quirk-ui 0.1.40 → 0.1.41
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.
package/dist/index7.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._content_15fiv_1{width:100%;padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}._container_15fiv_7{display:flex;align-items:center;justify-content:space-between;flex-direction:column;width:100%;max-width:var(--container-max-width, var(--layout-width));margin:0 auto;padding-left:var(--spacing-md);padding-right:var(--spacing-md)}._container_15fiv_7 h1,._container_15fiv_7 h2,._container_15fiv_7 h3,._container_15fiv_7 h4,._container_15fiv_7 h5,._container_15fiv_7 h6{width:100%;margin-block:0}@media (max-width: 767px){._container_15fiv_7{gap:var(--spacing-xl)}}._eyebrow_15fiv_34{font-weight:var(--font-weight-bold)}._metrics_15fiv_38{display:flex;align-items:flex-start;flex-wrap:wrap;gap:var(--spacing-md);padding:var(--spacing-md)}@media (max-width: 767px){._metrics_15fiv_38{flex-direction:column}}._metric_15fiv_38{flex:1}._metricValue_15fiv_54{font-size:2.5rem;font-weight:var(--font-weight-bold);position:relative;z-index:1;color:var(--color-text-primary)}._metricValue_15fiv_54:after{content:"";display:block;background-color:var(--color-primary-10);width:35px;height:35px;position:absolute;top:-3px;left:-.5rem;z-index:-1;border-radius:var(--radius-md)}._disclaimer_15fiv_75{color:var(--color-text-primary);font-size:var(--font-size-sm)}._layoutHImageRight_15fiv_80{flex-direction:row;gap:var(--gap, 5rem)}._layoutHImageRight_15fiv_80 ._heading_15fiv_84{gap:var(--spacing-md);flex:.65}._layoutHImageRight_15fiv_80 ._media_15fiv_89{flex:.5}@media (max-width: 768px){._layoutHImageRight_15fiv_80{flex-direction:column-reverse;gap:var(--spacing-lg)}}._noImage_15fiv_99{flex-direction:column}._layoutHImageLeft_15fiv_103{flex-direction:row-reverse;gap:var(--gap, 5rem)}._layoutHImageLeft_15fiv_103 ._heading_15fiv_84{gap:var(--spacing-md);flex:.65}._layoutHImageLeft_15fiv_103 ._media_15fiv_89{flex:.5}@media (max-width: 768px){._layoutHImageLeft_15fiv_103{flex-direction:column-reverse;gap:var(--spacing-lg)}}._layoutVImageTop_15fiv_122{flex-direction:column-reverse;gap:var(--gap, var(--spacing-md))}._layoutVImageTop_15fiv_122 ._heading_15fiv_84{gap:var(--spacing-md)}@media (max-width: 768px){._layoutVImageTop_15fiv_122{gap:var(--spacing-lg)}}._layoutVImageBottom_15fiv_135{flex-direction:column;gap:var(--gap, var(--spacing-md))}._layoutVImageBottom_15fiv_135 ._heading_15fiv_84{gap:var(--spacing-md)}@media (max-width: 768px){._layoutVImageBottom_15fiv_135{gap:var(--spacing-lg)}}._heading_15fiv_84{display:flex;flex-direction:column;width:100%;gap:var(--spacing-md)}._heading_15fiv_84:not(:has(._text_15fiv_154 .portableTextContainer)){gap:var(--spacing-lg)}._title_15fiv_159{text-wrap:pretty}._text_15fiv_154{flex:1;display:flex;justify-content:center;flex-direction:column;gap:var(--spacing-lg)}@media (max-width: 767px){._text_15fiv_154{flex:1;width:100%;align-items:flex-start}}._cta_15fiv_178{width:100%}@media (max-width: 767px){._cta_15fiv_178{justify-content:flex-start}}._headingHorizontal_15fiv_186{flex-direction:row;justify-content:space-between;gap:5rem}@media (max-width: 767px){._headingHorizontal_15fiv_186{gap:var(--spacing-md)}}._headingHorizontal_15fiv_186 ._titleWrapper_15fiv_195,._headingHorizontal_15fiv_186 .portableTextContainer{flex:1}._headingHorizontal_15fiv_186 ._title_15fiv_159{margin-bottom:0}._headingHorizontal_15fiv_186 p._title_15fiv_159{margin-top:1rem}@media (max-width: 768px){._headingHorizontal_15fiv_186{flex-direction:column}}._headingVertical_15fiv_216{flex-direction:column;justify-content:flex-start}._media_15fiv_89{display:flex;align-items:center;justify-content:center;flex:1;width:100%;margin:0 auto;line-height:0}._media_15fiv_89 img{width:100%;height:auto}._videoWrapper_15fiv_237{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:var(--radius-md);flex:1}._videoWrapper_15fiv_237 iframe,._videoWrapper_15fiv_237 video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}._default_15fiv_257{display:block}._default_15fiv_257 img{border-radius:var(--radius-md)}._maxWidth_15fiv_265{margin:0 auto}._maxWidth_15fiv_265 img{max-width:var(--max-width, var(--layout-width));border-radius:var(--radius-md);height:auto}._fullBleed_15fiv_275{width:100%;max-width:unset;border-radius:var(--radius-md);overflow:hidden}.blog ._container_15fiv_7{max-width:var(--blog-width)}.centered ._heading_15fiv_84{gap:var(--spacing-md);align-items:center;justify-content:center}.centered ._text_15fiv_154{align-items:center}.centered ._cta_15fiv_178{justify-content:center}.backgroundPrimary ._text_15fiv_154 p,.backgroundPrimary ._text_15fiv_154 p a,.backgroundPrimary ._metricValue_15fiv_54{color:#fff}.backgroundPrimary ._metricValue_15fiv_54:after{background-color:var(--color-secondary-100)}.backgroundPrimary ._cta_15fiv_178 ._secondary_15fiv_316{background-color:#fff}.split-35-65 ._heading_15fiv_84{flex:.35}._layoutSplitText_15fiv_329{flex-direction:row;align-items:flex-start;gap:var(--gap, 5rem)}@media (max-width: 768px){._layoutSplitText_15fiv_329{flex-direction:column;gap:var(--spacing-lg)}}._layoutSplitText_15fiv_329 ._heading_15fiv_84{flex:.5}._additionalContent_15fiv_344{flex:.5;display:flex;flex-direction:column;gap:var(--spacing-md)}@media (max-width: 768px){._additionalContent_15fiv_344{flex:1;width:100%}}._imageRadius-sm_15fiv_356 ._media_15fiv_89 img{border-radius:var(--radius-sm)}._imageRadius-md_15fiv_359 ._media_15fiv_89 img{border-radius:var(--radius-md)}._imageRadius-lg_15fiv_362 ._media_15fiv_89 img{border-radius:var(--radius-lg)}._imageRadius-full_15fiv_365 ._media_15fiv_89 img{border-radius:var(--radius-full)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../index7.css');const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../index7.css');const e=require("react/jsx-runtime"),k=require("../../hooks/useStyleClasses.cjs"),H=require("../../../core/context/ThemeContext.cjs"),W=require("../../hooks/useMediaQuery.cjs"),v=require("../../utils/mediaUtils.cjs"),z="_content_15fiv_1",$="_container_15fiv_7",L="_eyebrow_15fiv_34",B="_metrics_15fiv_38",C="_metric_15fiv_38",q="_metricValue_15fiv_54",M="_disclaimer_15fiv_75",U="_layoutHImageRight_15fiv_80",D="_heading_15fiv_84",E="_media_15fiv_89",Q="_noImage_15fiv_99",Y="_layoutHImageLeft_15fiv_103",F="_layoutVImageTop_15fiv_122",G="_layoutVImageBottom_15fiv_135",P="_text_15fiv_154",J="_title_15fiv_159",K="_cta_15fiv_178",X="_headingHorizontal_15fiv_186",Z="_titleWrapper_15fiv_195",O="_headingVertical_15fiv_216",A="_videoWrapper_15fiv_237",T="_layoutSplitText_15fiv_329",R="_additionalContent_15fiv_344",t={content:z,container:$,eyebrow:L,metrics:B,metric:C,metricValue:q,disclaimer:M,layoutHImageRight:U,heading:D,media:E,noImage:Q,layoutHImageLeft:Y,layoutVImageTop:F,layoutVImageBottom:G,text:P,title:J,cta:K,headingHorizontal:X,titleWrapper:Z,headingVertical:O,videoWrapper:A,layoutSplitText:T,additionalContent:R},tt={"no-image":t.noImage,"split-text":t.layoutSplitText,"horizontal-image-right":t.layoutHImageRight,"horizontal-image-left":t.layoutHImageLeft,"vertical-image-top":t.layoutVImageTop,"vertical-image-bottom":t.layoutVImageBottom},st={horizontal:t.headingHorizontal,vertical:t.headingVertical};function et(s,a,l){const i=s.includes("vimeo.com"),c=s.includes("youtube.com")||s.includes("youtu.be");return i||c?e.jsx("div",{style:{maxWidth:l??"unset",flex:.65},children:e.jsx("div",{className:t.videoWrapper,children:e.jsx("iframe",{src:i?`${s}?autoplay=0&muted=0&loop=0`:`${s}?autoplay=0&mute=0&loop=0`,allow:"autoplay; fullscreen",allowFullScreen:!0})})}):e.jsx("div",{style:{maxWidth:l??"unset",width:"100%",flex:.65},children:e.jsx("div",{className:t.videoWrapper,children:e.jsx("video",{src:s,controls:!0,poster:a})})})}function it({metrics:s,renderRichText:a}){return e.jsx("div",{className:t.metrics,children:s.map(l=>e.jsxs("div",{className:t.metric,children:[e.jsx("div",{className:t.metricValue,children:l.metricValue}),l.metricDescription&&(a==null?void 0:a({blocks:l.metricDescription}))]},l._key))})}function ot({layout:s,heading:a,additionalContent:l,image:i,video:c,metrics:r,callToAction:n,disclaimer:p,styleOptions:_,id:V,renderImage:d,renderRichText:o,renderCallToAction:u}){var N;const{mode:f}=H.useTheme(),b=k.useStyleClasses(_),j=W.useMediaQuery("(max-width: 768px)")??!1,m=v.resolveImageUrl(i,f),g=v.resolveAltText(i,f),h=v.resolveImageStyle(i,j),x=tt[(s==null?void 0:s.orientation)??"horizontal-image-right"],w=st[a.headingLayout??"horizontal"],S={"--container-max-width":(_==null?void 0:_.maxWidth)??"unset","--gap":s==null?void 0:s.gap,"--max-width":(i==null?void 0:i.sizing)==="inset"?i==null?void 0:i.maxWidth:"unset"},y=(s==null?void 0:s.orientation)==="split-text",I=!y&&(s==null?void 0:s.orientation)!=="no-image";return e.jsx("section",{id:V,className:`${b} ${t.content}`,children:e.jsxs("article",{className:`${t.container} ${x}`,style:S,children:[e.jsxs("div",{className:`${t.heading} ${w}`,children:[e.jsxs("div",{className:t.titleWrapper,children:[a.eyebrow&&(o==null?void 0:o({blocks:a.eyebrow,className:t.eyebrow})),a.title&&(o==null?void 0:o({blocks:a.title,className:t.title}))]}),a.description||(N=n==null?void 0:n.items)!=null&&N.length?e.jsxs("div",{className:t.text,children:[a.description&&(o==null?void 0:o({blocks:a.description})),r&&r.length>0&&e.jsx(it,{metrics:r,renderRichText:o}),n&&(u==null?void 0:u({items:n.items,alignment:n.alignment,className:t.cta})),p&&(o==null?void 0:o({blocks:p,className:t.disclaimer}))]}):null]}),y&&l&&e.jsx("div",{className:t.additionalContent,children:o==null?void 0:o({blocks:l})}),I&&c?et(c,m,i==null?void 0:i.maxWidth):I&&i&&m?e.jsx("div",{className:t.media,children:d?d({src:m,alt:g,width:600,height:400,priority:!0,style:h}):e.jsx("img",{src:m,alt:g,width:600,height:400,style:{width:"100%",height:"auto",...h}})}):null]})})}exports.ContentBlock=ot;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as e, jsxs as c } from "react/jsx-runtime";
|
|
2
2
|
import { useStyleClasses as k } from "../../hooks/useStyleClasses.mjs";
|
|
3
3
|
import { useTheme as z } from "../../../core/context/ThemeContext.mjs";
|
|
4
4
|
import { useMediaQuery as L } from "../../hooks/useMediaQuery.mjs";
|
|
5
5
|
import { resolveImageUrl as $, resolveAltText as B, resolveImageStyle as C } from "../../utils/mediaUtils.mjs";
|
|
6
|
-
import '../../../index7.css';const M = "
|
|
6
|
+
import '../../../index7.css';const M = "_content_15fiv_1", D = "_container_15fiv_7", U = "_eyebrow_15fiv_34", j = "_metrics_15fiv_38", E = "_metric_15fiv_38", Y = "_metricValue_15fiv_54", F = "_disclaimer_15fiv_75", G = "_layoutHImageRight_15fiv_80", Q = "_heading_15fiv_84", q = "_media_15fiv_89", J = "_noImage_15fiv_99", K = "_layoutHImageLeft_15fiv_103", P = "_layoutVImageTop_15fiv_122", X = "_layoutVImageBottom_15fiv_135", Z = "_text_15fiv_154", O = "_title_15fiv_159", x = "_cta_15fiv_178", A = "_headingHorizontal_15fiv_186", R = "_titleWrapper_15fiv_195", T = "_headingVertical_15fiv_216", tt = "_videoWrapper_15fiv_237", it = "_layoutSplitText_15fiv_329", ot = "_additionalContent_15fiv_344", t = {
|
|
7
7
|
content: M,
|
|
8
8
|
container: D,
|
|
9
9
|
eyebrow: U,
|
|
@@ -13,7 +13,7 @@ import '../../../index7.css';const M = "_content_1v4an_1", D = "_container_1v4an
|
|
|
13
13
|
disclaimer: F,
|
|
14
14
|
layoutHImageRight: G,
|
|
15
15
|
heading: Q,
|
|
16
|
-
|
|
16
|
+
media: q,
|
|
17
17
|
noImage: J,
|
|
18
18
|
layoutHImageLeft: K,
|
|
19
19
|
layoutVImageTop: P,
|
|
@@ -25,61 +25,61 @@ import '../../../index7.css';const M = "_content_1v4an_1", D = "_container_1v4an
|
|
|
25
25
|
titleWrapper: R,
|
|
26
26
|
headingVertical: T,
|
|
27
27
|
videoWrapper: tt,
|
|
28
|
-
layoutSplitText:
|
|
28
|
+
layoutSplitText: it,
|
|
29
29
|
additionalContent: ot
|
|
30
|
-
},
|
|
30
|
+
}, at = {
|
|
31
31
|
"no-image": t.noImage,
|
|
32
32
|
"split-text": t.layoutSplitText,
|
|
33
33
|
"horizontal-image-right": t.layoutHImageRight,
|
|
34
34
|
"horizontal-image-left": t.layoutHImageLeft,
|
|
35
35
|
"vertical-image-top": t.layoutVImageTop,
|
|
36
36
|
"vertical-image-bottom": t.layoutVImageBottom
|
|
37
|
-
},
|
|
37
|
+
}, st = {
|
|
38
38
|
horizontal: t.headingHorizontal,
|
|
39
39
|
vertical: t.headingVertical
|
|
40
40
|
};
|
|
41
|
-
function
|
|
42
|
-
const o =
|
|
43
|
-
return o || m ? /* @__PURE__ */
|
|
41
|
+
function et(i, s, l) {
|
|
42
|
+
const o = i.includes("vimeo.com"), m = i.includes("youtube.com") || i.includes("youtu.be");
|
|
43
|
+
return o || m ? /* @__PURE__ */ e("div", { style: { maxWidth: l ?? "unset", flex: 0.65 }, children: /* @__PURE__ */ e("div", { className: t.videoWrapper, children: /* @__PURE__ */ e(
|
|
44
44
|
"iframe",
|
|
45
45
|
{
|
|
46
|
-
src: o ? `${
|
|
46
|
+
src: o ? `${i}?autoplay=0&muted=0&loop=0` : `${i}?autoplay=0&mute=0&loop=0`,
|
|
47
47
|
allow: "autoplay; fullscreen",
|
|
48
48
|
allowFullScreen: !0
|
|
49
49
|
}
|
|
50
|
-
) }) }) : /* @__PURE__ */
|
|
50
|
+
) }) }) : /* @__PURE__ */ e("div", { style: { maxWidth: l ?? "unset", width: "100%", flex: 0.65 }, children: /* @__PURE__ */ e("div", { className: t.videoWrapper, children: /* @__PURE__ */ e("video", { src: i, controls: !0, poster: s }) }) });
|
|
51
51
|
}
|
|
52
|
-
function
|
|
53
|
-
metrics:
|
|
54
|
-
renderRichText:
|
|
52
|
+
function lt({
|
|
53
|
+
metrics: i,
|
|
54
|
+
renderRichText: s
|
|
55
55
|
}) {
|
|
56
|
-
return /* @__PURE__ */
|
|
57
|
-
/* @__PURE__ */
|
|
58
|
-
|
|
59
|
-
] },
|
|
56
|
+
return /* @__PURE__ */ e("div", { className: t.metrics, children: i.map((l) => /* @__PURE__ */ c("div", { className: t.metric, children: [
|
|
57
|
+
/* @__PURE__ */ e("div", { className: t.metricValue, children: l.metricValue }),
|
|
58
|
+
l.metricDescription && (s == null ? void 0 : s({ blocks: l.metricDescription }))
|
|
59
|
+
] }, l._key)) });
|
|
60
60
|
}
|
|
61
61
|
function pt({
|
|
62
|
-
layout:
|
|
63
|
-
heading:
|
|
64
|
-
additionalContent:
|
|
62
|
+
layout: i,
|
|
63
|
+
heading: s,
|
|
64
|
+
additionalContent: l,
|
|
65
65
|
image: o,
|
|
66
66
|
video: m,
|
|
67
67
|
metrics: p,
|
|
68
|
-
callToAction:
|
|
68
|
+
callToAction: n,
|
|
69
69
|
disclaimer: v,
|
|
70
70
|
styleOptions: _,
|
|
71
|
-
id:
|
|
72
|
-
renderImage:
|
|
73
|
-
renderRichText:
|
|
71
|
+
id: V,
|
|
72
|
+
renderImage: f,
|
|
73
|
+
renderRichText: a,
|
|
74
74
|
renderCallToAction: u
|
|
75
75
|
}) {
|
|
76
|
-
var
|
|
77
|
-
const { mode:
|
|
76
|
+
var N;
|
|
77
|
+
const { mode: g } = z(), b = k(_), w = L("(max-width: 768px)") ?? !1, r = $(o, g), d = B(o, g), I = C(o, w), H = at[(i == null ? void 0 : i.orientation) ?? "horizontal-image-right"], S = st[s.headingLayout ?? "horizontal"], W = {
|
|
78
78
|
"--container-max-width": (_ == null ? void 0 : _.maxWidth) ?? "unset",
|
|
79
|
-
"--gap":
|
|
79
|
+
"--gap": i == null ? void 0 : i.gap,
|
|
80
80
|
"--max-width": (o == null ? void 0 : o.sizing) === "inset" ? o == null ? void 0 : o.maxWidth : "unset"
|
|
81
|
-
},
|
|
82
|
-
return /* @__PURE__ */
|
|
81
|
+
}, h = (i == null ? void 0 : i.orientation) === "split-text", y = !h && (i == null ? void 0 : i.orientation) !== "no-image";
|
|
82
|
+
return /* @__PURE__ */ e("section", { id: V, className: `${b} ${t.content}`, children: /* @__PURE__ */ c(
|
|
83
83
|
"article",
|
|
84
84
|
{
|
|
85
85
|
className: `${t.container} ${H}`,
|
|
@@ -87,51 +87,51 @@ function pt({
|
|
|
87
87
|
children: [
|
|
88
88
|
/* @__PURE__ */ c("div", { className: `${t.heading} ${S}`, children: [
|
|
89
89
|
/* @__PURE__ */ c("div", { className: t.titleWrapper, children: [
|
|
90
|
-
|
|
91
|
-
blocks:
|
|
90
|
+
s.eyebrow && (a == null ? void 0 : a({
|
|
91
|
+
blocks: s.eyebrow,
|
|
92
92
|
className: t.eyebrow
|
|
93
93
|
})),
|
|
94
|
-
|
|
95
|
-
blocks:
|
|
94
|
+
s.title && (a == null ? void 0 : a({
|
|
95
|
+
blocks: s.title,
|
|
96
96
|
className: t.title
|
|
97
97
|
}))
|
|
98
98
|
] }),
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
p && p.length > 0 && /* @__PURE__ */
|
|
102
|
-
|
|
99
|
+
s.description || (N = n == null ? void 0 : n.items) != null && N.length ? /* @__PURE__ */ c("div", { className: t.text, children: [
|
|
100
|
+
s.description && (a == null ? void 0 : a({ blocks: s.description })),
|
|
101
|
+
p && p.length > 0 && /* @__PURE__ */ e(
|
|
102
|
+
lt,
|
|
103
103
|
{
|
|
104
104
|
metrics: p,
|
|
105
|
-
renderRichText:
|
|
105
|
+
renderRichText: a
|
|
106
106
|
}
|
|
107
107
|
),
|
|
108
|
-
|
|
109
|
-
items:
|
|
110
|
-
alignment:
|
|
108
|
+
n && (u == null ? void 0 : u({
|
|
109
|
+
items: n.items,
|
|
110
|
+
alignment: n.alignment,
|
|
111
111
|
className: t.cta
|
|
112
112
|
})),
|
|
113
|
-
v && (
|
|
113
|
+
v && (a == null ? void 0 : a({
|
|
114
114
|
blocks: v,
|
|
115
115
|
className: t.disclaimer
|
|
116
116
|
}))
|
|
117
117
|
] }) : null
|
|
118
118
|
] }),
|
|
119
|
-
|
|
120
|
-
|
|
119
|
+
h && l && /* @__PURE__ */ e("div", { className: t.additionalContent, children: a == null ? void 0 : a({ blocks: l }) }),
|
|
120
|
+
y && m ? et(m, r, o == null ? void 0 : o.maxWidth) : y && o && r ? /* @__PURE__ */ e("div", { className: t.media, children: f ? f({
|
|
121
121
|
src: r,
|
|
122
|
-
alt:
|
|
122
|
+
alt: d,
|
|
123
123
|
width: 600,
|
|
124
124
|
height: 400,
|
|
125
125
|
priority: !0,
|
|
126
|
-
style:
|
|
127
|
-
}) : /* @__PURE__ */
|
|
126
|
+
style: I
|
|
127
|
+
}) : /* @__PURE__ */ e(
|
|
128
128
|
"img",
|
|
129
129
|
{
|
|
130
130
|
src: r,
|
|
131
|
-
alt:
|
|
131
|
+
alt: d,
|
|
132
132
|
width: 600,
|
|
133
133
|
height: 400,
|
|
134
|
-
style: { width: "100%", height: "auto", ...
|
|
134
|
+
style: { width: "100%", height: "auto", ...I }
|
|
135
135
|
}
|
|
136
136
|
) }) : null
|
|
137
137
|
]
|