@retinalabsllc/zairusjs 16.1.80 → 16.1.90

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.d.mts +2 -0
  2. package/dist/index.d.ts +2 -0
  3. package/dist/index.js +12 -7
  4. package/dist/index.mjs +12 -7
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -780,6 +780,8 @@ interface ContentGridBlockProps {
780
780
  bgColor_2?: string;
781
781
  bgDeco_1?: string;
782
782
  bgDeco_2?: string;
783
+ bgDecoRotation_1?: string;
784
+ bgDecoRotation_2?: string;
783
785
  }
784
786
  declare const ContentGridBlock: React.FC<ContentGridBlockProps>;
785
787
 
package/dist/index.d.ts CHANGED
@@ -780,6 +780,8 @@ interface ContentGridBlockProps {
780
780
  bgColor_2?: string;
781
781
  bgDeco_1?: string;
782
782
  bgDeco_2?: string;
783
+ bgDecoRotation_1?: string;
784
+ bgDecoRotation_2?: string;
783
785
  }
784
786
  declare const ContentGridBlock: React.FC<ContentGridBlockProps>;
785
787
 
package/dist/index.js CHANGED
@@ -3621,12 +3621,17 @@ var ContentGridBlock = ({
3621
3621
  bgColor_1,
3622
3622
  bgColor_2,
3623
3623
  bgDeco_1,
3624
- bgDeco_2
3624
+ bgDeco_2,
3625
+ bgDecoRotation_1,
3626
+ bgDecoRotation_2
3625
3627
  }) => {
3626
3628
  return /* @__PURE__ */ import_react62.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react62.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react62.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[14px] text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react62.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-100 tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react62.default.createElement("div", null, /* @__PURE__ */ import_react62.default.createElement("h4", { className: "text-[15px] text-white" }, leftCard.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react62.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react62.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative mx-h-95" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react62.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react62.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "grow flex flex-col mt-10 justify-center items-center py-6" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-200 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react62.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react62.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react62.default.createElement("div", null, /* @__PURE__ */ import_react62.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react62.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react62.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[14px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => {
3627
3629
  const isSecondCard = idx === 1;
3628
- const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ceff8a]" : bgColor_1 || "bg-[#143731]";
3629
- const bgDecoImage = isSecondCard ? bgDeco_2 : bgDeco_1;
3630
+ const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ffffff]" : bgColor_1 || "bg-[#068afe]";
3631
+ const defaultDeco_a = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_a.avif";
3632
+ const defaultDeco_b = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_b.avif";
3633
+ const bgDecoImage = isSecondCard ? bgDeco_2 || defaultDeco_b : bgDeco_1 || defaultDeco_a;
3634
+ const rotationClass = isSecondCard ? bgDecoRotation_2 || "-rotate-12" : bgDecoRotation_1 || "rotate-90";
3630
3635
  return /* @__PURE__ */ import_react62.default.createElement(
3631
3636
  "div",
3632
3637
  {
@@ -3638,7 +3643,7 @@ var ContentGridBlock = ({
3638
3643
  {
3639
3644
  src: bgDecoImage,
3640
3645
  alt: "Decorative background",
3641
- className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-10 pointer-events-none opacity-30 rotate-90"
3646
+ className: `absolute bottom-0 right-0 translate-x-1/4 translate-y-1/4 w-52 sm:w-60 h-auto object-contain z-10 pointer-events-none opacity-30 ${rotationClass}`
3642
3647
  }
3643
3648
  ),
3644
3649
  /* @__PURE__ */ import_react62.default.createElement("div", { className: `absolute inset-0 z-20 pointer-events-none ${isSecondCard ? "" : "bg-black/20"}` }),
@@ -5016,14 +5021,14 @@ var UniversalHome2 = ({
5016
5021
  {
5017
5022
  src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cal_b.avif",
5018
5023
  alt: "Create Huddle",
5019
- className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none"
5024
+ className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
5020
5025
  }
5021
5026
  )
5022
5027
  ), /* @__PURE__ */ import_react81.default.createElement(
5023
5028
  "div",
5024
5029
  {
5025
5030
  onClick: joinHuddleAction?.onClick,
5026
- className: "bg-[#f8f8fa] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
5031
+ className: "bg-[#ffffff] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
5027
5032
  },
5028
5033
  /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-[15px] sm:text-[15px] text-black leading-tight" }, "Join", /* @__PURE__ */ import_react81.default.createElement("br", null), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-black/60" }, "Huddle")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-8 h-8 rounded-full bg-black/5 flex items-center justify-center" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.ArrowRight01Icon, size: 16, className: "text-black" }))),
5029
5034
  /* @__PURE__ */ import_react81.default.createElement(
@@ -5031,7 +5036,7 @@ var UniversalHome2 = ({
5031
5036
  {
5032
5037
  src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cam_c.avif",
5033
5038
  alt: "Join Huddle",
5034
- className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none"
5039
+ className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
5035
5040
  }
5036
5041
  )
5037
5042
  ))), customContent && /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ import_react81.default.createElement(
package/dist/index.mjs CHANGED
@@ -3608,12 +3608,17 @@ var ContentGridBlock = ({
3608
3608
  bgColor_1,
3609
3609
  bgColor_2,
3610
3610
  bgDeco_1,
3611
- bgDeco_2
3611
+ bgDeco_2,
3612
+ bgDecoRotation_1,
3613
+ bgDecoRotation_2
3612
3614
  }) => {
3613
3615
  return /* @__PURE__ */ React38.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React38.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React38.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React38.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React38.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React38.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ React38.createElement("p", { className: "text-[14px] text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React38.createElement("span", { className: "mb-auto text-[11px] text-neutral-100 tracking-widest" }, leftCard.tag), /* @__PURE__ */ React38.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React38.createElement("div", null, /* @__PURE__ */ React38.createElement("h4", { className: "text-[15px] text-white" }, leftCard.title), /* @__PURE__ */ React38.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ React38.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React38.createElement(Image12, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React38.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative mx-h-95" }, /* @__PURE__ */ React38.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React38.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React38.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React38.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React38.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React38.createElement(Image12, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React38.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React38.createElement("div", { className: "grow flex flex-col mt-10 justify-center items-center py-6" }, /* @__PURE__ */ React38.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-200 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ React38.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React38.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React38.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React38.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React38.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ React38.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React38.createElement("div", null, /* @__PURE__ */ React38.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React38.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React38.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React38.createElement(Image12, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React38.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React38.createElement("p", { className: "text-[14px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React38.createElement("span", { className: "text-[11px] text-neutral-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => {
3614
3616
  const isSecondCard = idx === 1;
3615
- const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ceff8a]" : bgColor_1 || "bg-[#143731]";
3616
- const bgDecoImage = isSecondCard ? bgDeco_2 : bgDeco_1;
3617
+ const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ffffff]" : bgColor_1 || "bg-[#068afe]";
3618
+ const defaultDeco_a = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_a.avif";
3619
+ const defaultDeco_b = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_b.avif";
3620
+ const bgDecoImage = isSecondCard ? bgDeco_2 || defaultDeco_b : bgDeco_1 || defaultDeco_a;
3621
+ const rotationClass = isSecondCard ? bgDecoRotation_2 || "-rotate-12" : bgDecoRotation_1 || "rotate-90";
3617
3622
  return /* @__PURE__ */ React38.createElement(
3618
3623
  "div",
3619
3624
  {
@@ -3625,7 +3630,7 @@ var ContentGridBlock = ({
3625
3630
  {
3626
3631
  src: bgDecoImage,
3627
3632
  alt: "Decorative background",
3628
- className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-10 pointer-events-none opacity-30 rotate-90"
3633
+ className: `absolute bottom-0 right-0 translate-x-1/4 translate-y-1/4 w-52 sm:w-60 h-auto object-contain z-10 pointer-events-none opacity-30 ${rotationClass}`
3629
3634
  }
3630
3635
  ),
3631
3636
  /* @__PURE__ */ React38.createElement("div", { className: `absolute inset-0 z-20 pointer-events-none ${isSecondCard ? "" : "bg-black/20"}` }),
@@ -5049,14 +5054,14 @@ var UniversalHome2 = ({
5049
5054
  {
5050
5055
  src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cal_b.avif",
5051
5056
  alt: "Create Huddle",
5052
- className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none"
5057
+ className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
5053
5058
  }
5054
5059
  )
5055
5060
  ), /* @__PURE__ */ React48.createElement(
5056
5061
  "div",
5057
5062
  {
5058
5063
  onClick: joinHuddleAction?.onClick,
5059
- className: "bg-[#f8f8fa] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
5064
+ className: "bg-[#ffffff] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
5060
5065
  },
5061
5066
  /* @__PURE__ */ React48.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[15px] sm:text-[15px] text-black leading-tight" }, "Join", /* @__PURE__ */ React48.createElement("br", null), /* @__PURE__ */ React48.createElement("span", { className: "text-black/60" }, "Huddle")), /* @__PURE__ */ React48.createElement("div", { className: "w-8 h-8 rounded-full bg-black/5 flex items-center justify-center" }, /* @__PURE__ */ React48.createElement(HugeiconsIcon34, { icon: ArrowRight01Icon11, size: 16, className: "text-black" }))),
5062
5067
  /* @__PURE__ */ React48.createElement(
@@ -5064,7 +5069,7 @@ var UniversalHome2 = ({
5064
5069
  {
5065
5070
  src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cam_c.avif",
5066
5071
  alt: "Join Huddle",
5067
- className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none"
5072
+ className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
5068
5073
  }
5069
5074
  )
5070
5075
  ))), customContent && /* @__PURE__ */ React48.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ React48.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ React48.createElement(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "16.1.80",
3
+ "version": "16.1.90",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",