quirk-ui 0.0.550 → 0.0.551

package/dist/next/blocks/StickyScrollBlock/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../assets/index5.css');const t=require("react/jsx-runtime"),r=require("react"),I=require("next/image"),a=require("../../ui/PortableTextRenderer/index.cjs");require("react-dom");const N=require("../../utils/portableTextToPlainText.cjs"),R=require("../../contexts/ThemeContext.cjs"),q="_layout_l5nlh_1",S="_container_l5nlh_7",U="_heading_l5nlh_19",w="_scroll_l5nlh_35",P="_sidebar_l5nlh_40",$="_number_l5nlh_65",A="_link_l5nlh_82",B="_active_l5nlh_96",C="_content_l5nlh_108",E="_item_l5nlh_112",M="_text_l5nlh_124",O="_title_l5nlh_131",V="_image_l5nlh_135",s={layout:q,container:S,heading:U,scroll:w,sidebar:P,number:$,link:A,active:B,content:C,item:E,text:M,title:O,image:V};function z({heading:o,items:_,showNumbers:f}){const[y,u]=r.useState(null),{mode:d}=R.useTheme(),T=r.useRef(null),h=r.useRef([]);return r.useEffect(()=>{const e=new IntersectionObserver(l=>{const n=l.filter(i=>i.isIntersecting).sort((i,c)=>c.intersectionRatio-i.intersectionRatio);if(n.length>0){const i=n[0].target.getAttribute("id");i&&u(i)}},{rootMargin:"-45% 0px -45% 0px",threshold:.1});return h.current.forEach(l=>{l&&e.observe(l)}),T.current=e,()=>{e.disconnect()}},[]),t.jsx("section",{className:s.layout,children:t.jsxs("article",{className:s.container,children:[t.jsxs("div",{className:s.heading,children:[t.jsx(a.RichText,{className:s.title,blocks:o.title}),o.description&&t.jsx(a.RichText,{blocks:o.description})]}),t.jsxs("div",{className:s.scroll,children:[t.jsx("nav",{className:s.sidebar,children:t.jsx("ul",{children:_.map((e,l)=>t.jsx("li",{children:t.jsxs("button",{type:"button",className:`${s.link} ${y===e._key?s.active:""}`,onClick:()=>{u(e._key);const n=document.getElementById(e._key);n==null||n.scrollIntoView({behavior:"smooth",block:"start"})},children:[f&&t.jsx("div",{className:s.number,children:l+1}),e.title&&N.portableTextToPlainText(e.title)]})},e._key))})}),t.jsx("div",{className:s.content,children:_.map((e,l)=>{var c,m,x,g,b,k,v,j;let n;(c=e.image)!=null&&c.imageUrls&&(n=d==="dark"&&((m=e.image.imageUrls.dark)==null?void 0:m.medium)||e.image.imageUrls.default.medium);let i=((b=(g=(x=e.image)==null?void 0:x[d==="dark"?"darkImage":"defaultImage"])==null?void 0:g.asset)==null?void 0:b.altText)||((j=(v=(k=e.image)==null?void 0:k[d==="dark"?"darkImage":"defaultImage"])==null?void 0:v.asset)==null?void 0:j.description)||"Card image";return t.jsxs("section",{ref:p=>{h.current[l]=p},id:e._key,className:s.item,children:[t.jsxs("div",{className:s.text,children:[e.title&&t.jsx(a.RichText,{className:s.title,blocks:e.title}),e.description&&t.jsx(a.RichText,{blocks:e.description})]}),e.image&&n&&t.jsx("div",{className:s.image,children:t.jsx(I,{src:n,alt:i,width:600,height:400,priority:!0})})]},e._key)})})]})]})})}exports.StickyScrollBlock=z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../assets/index5.css');const t=require("react/jsx-runtime"),r=require("react"),I=require("next/image"),a=require("../../ui/PortableTextRenderer/index.cjs");require("react-dom");const N=require("../../contexts/ThemeContext.cjs"),R=require("../../utils/portableTextToPlainText.cjs"),q="_layout_l5nlh_1",S="_container_l5nlh_7",U="_heading_l5nlh_19",w="_scroll_l5nlh_35",P="_sidebar_l5nlh_40",$="_number_l5nlh_65",A="_link_l5nlh_82",B="_active_l5nlh_96",C="_content_l5nlh_108",E="_item_l5nlh_112",M="_text_l5nlh_124",O="_title_l5nlh_131",V="_image_l5nlh_135",s={layout:q,container:S,heading:U,scroll:w,sidebar:P,number:$,link:A,active:B,content:C,item:E,text:M,title:O,image:V};function z({heading:o,items:_,showNumbers:f}){const[y,u]=r.useState(null),{mode:d}=N.useTheme(),T=r.useRef(null),h=r.useRef([]);return r.useEffect(()=>{const e=new IntersectionObserver(l=>{const n=l.filter(i=>i.isIntersecting).sort((i,c)=>c.intersectionRatio-i.intersectionRatio);if(n.length>0){const i=n[0].target.getAttribute("id");i&&u(i)}},{rootMargin:"-45% 0px -45% 0px",threshold:.1});return h.current.forEach(l=>{l&&e.observe(l)}),T.current=e,()=>{e.disconnect()}},[]),t.jsx("section",{className:s.layout,children:t.jsxs("article",{className:s.container,children:[t.jsxs("div",{className:s.heading,children:[t.jsx(a.RichText,{className:s.title,blocks:o.title}),o.description&&t.jsx(a.RichText,{blocks:o.description})]}),t.jsxs("div",{className:s.scroll,children:[t.jsx("nav",{className:s.sidebar,children:t.jsx("ul",{children:_.map((e,l)=>t.jsx("li",{children:t.jsxs("button",{type:"button",className:`${s.link} ${y===e._key?s.active:""}`,onClick:()=>{u(e._key);const n=document.getElementById(e._key);n==null||n.scrollIntoView({behavior:"smooth",block:"start"})},children:[f&&t.jsx("div",{className:s.number,children:l+1}),e.title&&R.portableTextToPlainText(e.title)]})},e._key))})}),t.jsx("div",{className:s.content,children:_.map((e,l)=>{var c,m,x,g,b,k,v,j;let n;(c=e.image)!=null&&c.imageUrls&&(n=d==="dark"&&((m=e.image.imageUrls.dark)==null?void 0:m.medium)||e.image.imageUrls.default.medium);let i=((b=(g=(x=e.image)==null?void 0:x[d==="dark"?"darkImage":"defaultImage"])==null?void 0:g.asset)==null?void 0:b.altText)||((j=(v=(k=e.image)==null?void 0:k[d==="dark"?"darkImage":"defaultImage"])==null?void 0:v.asset)==null?void 0:j.description)||"Card image";return t.jsxs("section",{ref:p=>{h.current[l]=p},id:e._key,className:s.item,children:[t.jsxs("div",{className:s.text,children:[e.title&&t.jsx(a.RichText,{className:s.title,blocks:e.title}),e.description&&t.jsx(a.RichText,{blocks:e.description})]}),e.image&&n&&t.jsx("div",{className:s.image,children:t.jsx(I,{src:n,alt:i,width:600,height:400,priority:!0})})]},e._key)})})]})]})})}exports.StickyScrollBlock=z;

package/dist/next/blocks/StickyScrollBlock/index.mjs

@@ -3,8 +3,8 @@ import { useState as R, useRef as y, useEffect as U } from "react";
 import w from "next/image";
 import { RichText as a } from "../../ui/PortableTextRenderer/index.mjs";
 import "react-dom";
-import { portableTextToPlainText as A } from "../../utils/portableTextToPlainText.mjs";
-import { useTheme as E } from "../../contexts/ThemeContext.mjs";
+import { useTheme as A } from "../../contexts/ThemeContext.mjs";
+import { portableTextToPlainText as E } from "../../utils/portableTextToPlainText.mjs";
 import '../../../assets/index5.css';const S = "_layout_l5nlh_1", j = "_container_l5nlh_7", B = "_heading_l5nlh_19", C = "_scroll_l5nlh_35", $ = "_sidebar_l5nlh_40", M = "_number_l5nlh_65", O = "_link_l5nlh_82", P = "_active_l5nlh_96", V = "_content_l5nlh_108", q = "_item_l5nlh_112", z = "_text_l5nlh_124", D = "_title_l5nlh_131", F = "_image_l5nlh_135", t = {
   layout: S,
   container: j,
@@ -25,7 +25,7 @@ function X({
   items: m,
   showNumbers: x
 }) {
-  const [I, _] = R(null), { mode: d } = E(), N = y(null), h = y([]);
+  const [I, _] = R(null), { mode: d } = A(), N = y(null), h = y([]);
   return U(() => {
     const e = new IntersectionObserver(
       (i) => {
@@ -66,7 +66,7 @@ function X({
           },
           children: [
             x && /* @__PURE__ */ l("div", { className: t.number, children: i + 1 }),
-            e.title && A(e.title)
+            e.title && E(e.title)
           ]
         }
       ) }, e._key)) }) }),

package/dist/next/ui/CallToActions/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),s=require("react"),v=require("../../../core/components/ButtonGroup/index.cjs"),i=require("../../../index-BN6814Bi.cjs"),c=require("../../../core/components/Modal/index.cjs"),u=require("../../utils/resolveLinkUrl.cjs");function A({items:e,alignment:g,className:p}){const[d,b]=s.useState([]);return s.useEffect(()=>{if(!(e!=null&&e.length)||!u.resolveLinkURL)return;async function n(){const o=await Promise.all(e.map(l=>u.resolveLinkURL(l)));b(o)}n()},[e]),e!=null&&e.length?r.jsx(v.ButtonGroup,{className:p,alignment:g,children:e.slice(0,3).map((n,o)=>{var t,a;const l=d[o]??"#";switch(n.type){case"link":return r.jsx(i.CallToAction,{as:"a",variant:n.variant??"primary",href:l,target:((t=n.linkOptions)==null?void 0:t.linkType)==="external"?"_blank":"_self",rel:((a=n.linkOptions)==null?void 0:a.linkType)==="external"?"noopener noreferrer":"","aria-label":n.ariaLabel||n.label,icon:n.icon,iconAlignment:n.iconAlignment??"right",children:n.label},o);case"modal":return r.jsx(c.Modal,{trigger:r.jsx(i.CallToAction,{as:"button",variant:n.variant??"primary",icon:n.icon,iconAlignment:n.iconAlignment??"right",children:n.label}),content:n.modalContent},o);case"video":return r.jsx(c.Modal,{trigger:r.jsx(i.CallToAction,{as:"button",variant:n.variant??"primary",icon:n.icon,iconAlignment:n.iconAlignment??"right",children:n.label}),content:r.jsx("video",{src:n.videoUrl,controls:!0,autoPlay:!0})},o);case"download":return r.jsx(i.CallToAction,{as:"a",variant:n.variant??"primary",href:l,download:!0,target:"_blank",rel:"noopener noreferrer","aria-label":n.ariaLabel||n.label,icon:n.icon,iconAlignment:n.iconAlignment??"right",children:n.label},o)}})}):null}exports.CallToActions=A;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),x=require("react"),C=require("next/image"),q=require("../../../core/components/ButtonGroup/index.cjs"),o=require("../../../index-BN6814Bi.cjs"),h=require("../../../core/components/Modal/index.cjs"),k=require("../../utils/resolveLinkUrl.cjs"),U=require("../../contexts/ThemeContext.cjs");function L({items:r,alignment:A,className:_}){const[T,y]=x.useState([]),{mode:a}=U.useTheme();return x.useEffect(()=>{if(!(r!=null&&r.length)||!k.resolveLinkURL)return;async function e(){const i=await Promise.all(r.map(l=>k.resolveLinkURL(l)));y(i)}e()},[r]),r!=null&&r.length?n.jsx(q.ButtonGroup,{className:_,alignment:A,children:r.slice(0,3).map((e,i)=>{var s,u,g,c,m,d,p,f,v,b;const l=T[i]??"#";let t;(s=e.image)!=null&&s.imageUrls&&(t=a==="dark"&&((u=e.image.imageUrls.dark)==null?void 0:u.medium)||e.image.imageUrls.default.medium);let j=((m=(c=(g=e.image)==null?void 0:g[a==="dark"?"darkImage":"defaultImage"])==null?void 0:c.asset)==null?void 0:m.altText)||((f=(p=(d=e.image)==null?void 0:d[a==="dark"?"darkImage":"defaultImage"])==null?void 0:p.asset)==null?void 0:f.description)||"Card image";switch(e.type){case"link":return n.jsx(o.CallToAction,{as:"a",variant:e.variant??"primary",href:l,target:((v=e.linkOptions)==null?void 0:v.linkType)==="external"?"_blank":"_self",rel:((b=e.linkOptions)==null?void 0:b.linkType)==="external"?"noopener noreferrer":"","aria-label":e.ariaLabel||e.label,icon:e.icon,iconAlignment:e.iconAlignment??"right",children:e.image&&t?n.jsx(C,{src:t??"",alt:j,fill:!0,priority:!0,style:{objectFit:"cover"},draggable:!1,sizes:"(min-width: 500px) 500px, 100vw"}):e.label},i);case"modal":return n.jsx(h.Modal,{trigger:n.jsx(o.CallToAction,{as:"button",variant:e.variant??"primary",icon:e.icon,iconAlignment:e.iconAlignment??"right",children:e.label}),content:e.modalContent},i);case"video":return n.jsx(h.Modal,{trigger:n.jsx(o.CallToAction,{as:"button",variant:e.variant??"primary",icon:e.icon,iconAlignment:e.iconAlignment??"right",children:e.label}),content:n.jsx("video",{src:e.videoUrl,controls:!0,autoPlay:!0})},i);case"download":return n.jsx(o.CallToAction,{as:"a",variant:e.variant??"primary",href:l,download:!0,target:"_blank",rel:"noopener noreferrer","aria-label":e.ariaLabel||e.label,icon:e.icon,iconAlignment:e.iconAlignment??"right",children:e.label},i)}})}):null}exports.CallToActions=L;

package/dist/next/ui/CallToActions/index.mjs

@@ -1,100 +1,116 @@
-import { jsx as e } from "react/jsx-runtime";
-import { useState as c, useEffect as b } from "react";
-import { ButtonGroup as h } from "../../../core/components/ButtonGroup/index.mjs";
-import { C as i } from "../../../index-C-E0ib2G.js";
-import { Modal as g } from "../../../core/components/Modal/index.mjs";
-import { resolveLinkURL as p } from "../../utils/resolveLinkUrl.mjs";
-function C({
+import { jsx as n } from "react/jsx-runtime";
+import { useState as I, useEffect as C } from "react";
+import x from "next/image";
+import { ButtonGroup as L } from "../../../core/components/ButtonGroup/index.mjs";
+import { C as a } from "../../../index-C-E0ib2G.js";
+import { Modal as v } from "../../../core/components/Modal/index.mjs";
+import { resolveLinkURL as k } from "../../utils/resolveLinkUrl.mjs";
+import { useTheme as _ } from "../../contexts/ThemeContext.mjs";
+function G({
   items: r,
-  alignment: u,
-  className: s
+  alignment: y,
+  className: A
 }) {
-  const [f, m] = c([]);
-  return b(() => {
-    if (!(r != null && r.length) || !p) return;
-    async function n() {
-      const o = await Promise.all(
-        r.map((l) => p(l))
+  const [T, U] = I([]), { mode: o } = _();
+  return C(() => {
+    if (!(r != null && r.length) || !k) return;
+    async function e() {
+      const i = await Promise.all(
+        r.map((l) => k(l))
       );
-      m(o);
+      U(i);
     }
-    n();
-  }, [r]), r != null && r.length ? /* @__PURE__ */ e(h, { className: s, alignment: u, children: r.slice(0, 3).map((n, o) => {
-    var a, t;
-    const l = f[o] ?? "#";
-    switch (n.type) {
+    e();
+  }, [r]), r != null && r.length ? /* @__PURE__ */ n(L, { className: A, alignment: y, children: r.slice(0, 3).map((e, i) => {
+    var m, g, s, u, d, f, p, b, c, h;
+    const l = T[i] ?? "#";
+    let t;
+    (m = e.image) != null && m.imageUrls && (t = o === "dark" && ((g = e.image.imageUrls.dark) == null ? void 0 : g.medium) || e.image.imageUrls.default.medium);
+    let w = ((d = (u = (s = e.image) == null ? void 0 : s[o === "dark" ? "darkImage" : "defaultImage"]) == null ? void 0 : u.asset) == null ? void 0 : d.altText) || ((b = (p = (f = e.image) == null ? void 0 : f[o === "dark" ? "darkImage" : "defaultImage"]) == null ? void 0 : p.asset) == null ? void 0 : b.description) || "Card image";
+    switch (e.type) {
       case "link":
-        return /* @__PURE__ */ e(
-          i,
+        return /* @__PURE__ */ n(
+          a,
           {
             as: "a",
-            variant: n.variant ?? "primary",
+            variant: e.variant ?? "primary",
             href: l,
-            target: ((a = n.linkOptions) == null ? void 0 : a.linkType) === "external" ? "_blank" : "_self",
-            rel: ((t = n.linkOptions) == null ? void 0 : t.linkType) === "external" ? "noopener noreferrer" : "",
-            "aria-label": n.ariaLabel || n.label,
-            icon: n.icon,
-            iconAlignment: n.iconAlignment ?? "right",
-            children: n.label
+            target: ((c = e.linkOptions) == null ? void 0 : c.linkType) === "external" ? "_blank" : "_self",
+            rel: ((h = e.linkOptions) == null ? void 0 : h.linkType) === "external" ? "noopener noreferrer" : "",
+            "aria-label": e.ariaLabel || e.label,
+            icon: e.icon,
+            iconAlignment: e.iconAlignment ?? "right",
+            children: e.image && t ? /* @__PURE__ */ n(
+              x,
+              {
+                src: t ?? "",
+                alt: w,
+                fill: !0,
+                priority: !0,
+                style: { objectFit: "cover" },
+                draggable: !1,
+                sizes: "(min-width: 500px) 500px, 100vw"
+              }
+            ) : e.label
           },
-          o
+          i
         );
       case "modal":
-        return /* @__PURE__ */ e(
-          g,
+        return /* @__PURE__ */ n(
+          v,
           {
-            trigger: /* @__PURE__ */ e(
-              i,
+            trigger: /* @__PURE__ */ n(
+              a,
               {
                 as: "button",
-                variant: n.variant ?? "primary",
-                icon: n.icon,
-                iconAlignment: n.iconAlignment ?? "right",
-                children: n.label
+                variant: e.variant ?? "primary",
+                icon: e.icon,
+                iconAlignment: e.iconAlignment ?? "right",
+                children: e.label
               }
             ),
-            content: n.modalContent
+            content: e.modalContent
           },
-          o
+          i
         );
       case "video":
-        return /* @__PURE__ */ e(
-          g,
+        return /* @__PURE__ */ n(
+          v,
           {
-            trigger: /* @__PURE__ */ e(
-              i,
+            trigger: /* @__PURE__ */ n(
+              a,
               {
                 as: "button",
-                variant: n.variant ?? "primary",
-                icon: n.icon,
-                iconAlignment: n.iconAlignment ?? "right",
-                children: n.label
+                variant: e.variant ?? "primary",
+                icon: e.icon,
+                iconAlignment: e.iconAlignment ?? "right",
+                children: e.label
               }
             ),
-            content: /* @__PURE__ */ e("video", { src: n.videoUrl, controls: !0, autoPlay: !0 })
+            content: /* @__PURE__ */ n("video", { src: e.videoUrl, controls: !0, autoPlay: !0 })
           },
-          o
+          i
         );
       case "download":
-        return /* @__PURE__ */ e(
-          i,
+        return /* @__PURE__ */ n(
+          a,
           {
             as: "a",
-            variant: n.variant ?? "primary",
+            variant: e.variant ?? "primary",
             href: l,
             download: !0,
             target: "_blank",
             rel: "noopener noreferrer",
-            "aria-label": n.ariaLabel || n.label,
-            icon: n.icon,
-            iconAlignment: n.iconAlignment ?? "right",
-            children: n.label
+            "aria-label": e.ariaLabel || e.label,
+            icon: e.icon,
+            iconAlignment: e.iconAlignment ?? "right",
+            children: e.label
           },
-          o
+          i
         );
     }
   }) }) : null;
 }
 export {
-  C as CallToActions
+  G as CallToActions
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "quirk-ui",
   "private": false,
-  "version": "0.0.550",
+  "version": "0.0.551",
   "type": "module",
   "exports": {
     ".": {