quirk-ui 0.0.322 → 0.0.323

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.
@@ -1,9 +1,9 @@
1
- import { jsx as e, jsxs as s, Fragment as _ } from "react/jsx-runtime";
2
- import { useState as T, useRef as P, useEffect as B } from "react";
3
- import { useHeroContext as I } from "./HeroContext.js";
4
- import { I as p } from "../../../image-BVWU7eO6.js";
5
- import { usePrefersReducedMotion as F } from "../../hooks/usePrefersReducedMotion.js";
6
- import { c as U } from "../../../createLucideIcon-C8GTh_Qx.js";
1
+ import { jsx as e, jsxs as i, Fragment as y } from "react/jsx-runtime";
2
+ import { useState as $, useRef as B, useEffect as C } from "react";
3
+ import { useHeroContext as T } from "./HeroContext.js";
4
+ import { I as k } from "../../../image-BVWU7eO6.js";
5
+ import { usePrefersReducedMotion as P } from "../../hooks/usePrefersReducedMotion.js";
6
+ import { c as I } from "../../../createLucideIcon-C8GTh_Qx.js";
7
7
  import { P as z } from "../../../play-DYgKiSaf.js";
8
8
  import '../../../assets/index46.css';/**
9
9
  * @license lucide-react v0.488.0 - ISC
@@ -11,138 +11,93 @@ import '../../../assets/index46.css';/**
11
11
  * This source code is licensed under the ISC license.
12
12
  * See the LICENSE file in the root directory of this source tree.
13
13
  */
14
- const R = [
14
+ const F = [
15
15
  ["rect", { x: "14", y: "4", width: "4", height: "16", rx: "1", key: "zuxfzm" }],
16
16
  ["rect", { x: "6", y: "4", width: "4", height: "16", rx: "1", key: "1okwgv" }]
17
- ], S = U("pause", R), W = "_hero_c7i2h_1", j = "_container_c7i2h_7", H = "_text_c7i2h_36", L = "_articleDetails_c7i2h_43", V = "_articleType_c7i2h_56", E = "_articleCategories_c7i2h_69", Y = "_category_c7i2h_75", M = "_number_c7i2h_90", A = "_blog_c7i2h_117", q = "_overlay_c7i2h_141", G = "_fullBleed_c7i2h_211", J = "_split_c7i2h_305", K = "_image_c7i2h_310", Q = "_videoControl_c7i2h_333", X = "_videoWrapper_c7i2h_354", Z = "_videoBackground_c7i2h_374", O = "_iframe_c7i2h_375", l = {
18
- hero: W,
19
- container: j,
20
- text: H,
21
- articleDetails: L,
22
- articleType: V,
23
- articleCategories: E,
24
- category: Y,
25
- number: M,
17
+ ], R = I("pause", F), j = "_hero_c7i2h_1", L = "_container_c7i2h_7", S = "_text_c7i2h_36", U = "_articleDetails_c7i2h_43", E = "_articleType_c7i2h_56", H = "_articleCategories_c7i2h_69", M = "_category_c7i2h_75", V = "_number_c7i2h_90", Y = "_blog_c7i2h_117", A = "_overlay_c7i2h_141", q = "_fullBleed_c7i2h_211", G = "_split_c7i2h_305", J = "_videoControl_c7i2h_333", K = "_videoBackground_c7i2h_374", Q = "_iframe_c7i2h_375", l = {
18
+ hero: j,
19
+ container: L,
20
+ text: S,
21
+ articleDetails: U,
22
+ articleType: E,
23
+ articleCategories: H,
24
+ category: M,
25
+ number: V,
26
26
  default: "_default_c7i2h_113",
27
- blog: A,
28
- overlay: q,
29
- fullBleed: G,
30
- split: J,
31
- image: K,
32
- videoControl: Q,
33
- videoWrapper: X,
34
- videoBackground: Z,
35
- iframe: O
27
+ blog: Y,
28
+ overlay: A,
29
+ fullBleed: q,
30
+ split: G,
31
+ videoControl: J,
32
+ videoBackground: K,
33
+ iframe: Q
36
34
  };
37
- function oe({
35
+ function le({
38
36
  // heading,
39
37
  image: r,
40
- video: t,
38
+ video: c,
41
39
  //callToAction,
42
- pageData: c,
43
- styleOptions: h
40
+ pageData: t,
41
+ styleOptions: a
44
42
  }) {
45
- var $, C;
46
- const n = F(), [v, b] = T(!n), { setIsFullbleedHeroAtTop: N } = I(), u = P(null), i = (h == null ? void 0 : h.layout) ?? "default", y = {
43
+ var x, w;
44
+ const n = P(), [_, m] = $(!n), { setIsFullbleedHeroAtTop: v } = T(), u = B(null), s = (a == null ? void 0 : a.layout) ?? "default", h = {
47
45
  default: l.default,
48
46
  split: l.split,
49
47
  "full-bleed": l.fullBleed,
50
48
  blog: l.blog
51
- }[i], w = ($ = c == null ? void 0 : c.categories) != null && $.length ? c == null ? void 0 : c.categories[0] : null, a = (C = c == null ? void 0 : c.categories) != null && C.length ? c == null ? void 0 : c.categories[1] : null;
52
- B(() => {
49
+ }[s], p = (x = t == null ? void 0 : t.categories) != null && x.length ? t == null ? void 0 : t.categories[0] : null, d = (w = t == null ? void 0 : t.categories) != null && w.length ? t == null ? void 0 : t.categories[1] : null;
50
+ C(() => {
53
51
  const o = () => {
54
- N(window.scrollY === 0);
52
+ v(window.scrollY === 0);
55
53
  };
56
- if (i === "full-bleed" && typeof window < "u")
57
- return N(!0), window.addEventListener("scroll", o), () => window.removeEventListener("scroll", o);
58
- }, [i]), B(() => {
54
+ if (s === "full-bleed" && typeof window < "u")
55
+ return v(!0), window.addEventListener("scroll", o), () => window.removeEventListener("scroll", o);
56
+ }, [s]), C(() => {
59
57
  const o = u.current;
60
58
  o && (n ? o.pause() : o.play());
61
59
  }, [n]);
62
- const f = () => /* @__PURE__ */ e(
60
+ const b = () => /* @__PURE__ */ e(
63
61
  "button",
64
62
  {
65
- title: `${v ? "Pause the video" : "Play the video"}`,
63
+ title: `${_ ? "Pause the video" : "Play the video"}`,
66
64
  className: l.videoControl,
67
65
  onClick: () => {
68
66
  const o = u.current;
69
67
  o && (o.paused ? (o.play().catch(() => {
70
- }), b(!0)) : (o.pause(), b(!1)));
68
+ }), m(!0)) : (o.pause(), m(!1)));
71
69
  },
72
- children: v ? /* @__PURE__ */ e(S, { size: 18 }) : /* @__PURE__ */ e(z, { size: 18 })
70
+ children: _ ? /* @__PURE__ */ e(R, { size: 18 }) : /* @__PURE__ */ e(z, { size: 18 })
73
71
  }
74
- ), x = () => {
75
- if (!t) return null;
76
- const o = t.includes("vimeo.com"), d = t.includes("youtube.com") || t.includes("youtu.be");
77
- return o || d ? /* @__PURE__ */ e("div", { className: l.videoWrapper, children: /* @__PURE__ */ e(
78
- "iframe",
79
- {
80
- src: o ? `${t}?autoplay=1&muted=1&loop=1&background=1` : `${t}?autoplay=1&mute=1&loop=1&playlist=${m(
81
- t
82
- )}`,
83
- allow: "autoplay; fullscreen",
84
- allowFullScreen: !0
85
- }
86
- ) }) : /* @__PURE__ */ s("div", { className: l.videoWrapper, children: [
87
- /* @__PURE__ */ e(f, {}),
88
- /* @__PURE__ */ e(
89
- "video",
90
- {
91
- ref: u,
92
- src: t,
93
- autoPlay: !n,
94
- loop: !0,
95
- muted: !0,
96
- playsInline: !0,
97
- poster: (r == null ? void 0 : r.imageUrl) || void 0
98
- }
99
- )
100
- ] });
101
- };
102
- function m(o) {
103
- const d = o.match(/(?:youtube\.com\/.*v=|youtu\.be\/)([^&?/]+)/);
104
- return (d == null ? void 0 : d[1]) || "";
72
+ );
73
+ function N(o) {
74
+ const f = o.match(/(?:youtube\.com\/.*v=|youtu\.be\/)([^&?/]+)/);
75
+ return (f == null ? void 0 : f[1]) || "";
105
76
  }
106
- const k = () => r && r.imageUrl ? /* @__PURE__ */ e("div", { className: l.image, children: /* @__PURE__ */ e(
107
- p,
108
- {
109
- src: r.imageUrl,
110
- alt: r.asset.altText || r.asset.description || "Hero image",
111
- width: 600,
112
- height: 658,
113
- priority: !0
114
- }
115
- ) }) : null;
116
- if (i === "split")
117
- return /* @__PURE__ */ e("section", { className: `${l.hero} ${l.split}`, children: /* @__PURE__ */ s("article", { className: l.container, children: [
118
- /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", {}) }),
119
- t ? /* @__PURE__ */ e(x, {}) : /* @__PURE__ */ e(k, {})
120
- ] }) });
121
- if (i === "default")
122
- return /* @__PURE__ */ e("section", { className: `${l.hero} ${y}`, children: /* @__PURE__ */ s("article", { className: l.container, children: [
123
- t ? /* @__PURE__ */ e(x, {}) : /* @__PURE__ */ e(k, {}),
124
- /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", {}) })
125
- ] }) });
126
- if (i === "full-bleed")
127
- return /* @__PURE__ */ e("section", { className: `${l.hero} ${y}`, children: /* @__PURE__ */ s("article", { className: l.container, children: [
128
- t ? t.includes("vimeo.com") || t.includes("youtube.com") || t.includes("youtu.be") ? /* @__PURE__ */ e("div", { className: l.videoBackground, children: /* @__PURE__ */ e(
77
+ if (s === "split")
78
+ return /* @__PURE__ */ e("section", { className: `${l.hero} ${l.split}`, children: /* @__PURE__ */ e("article", { className: l.container, children: /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", {}) }) }) });
79
+ if (s === "default")
80
+ return /* @__PURE__ */ e("section", { className: `${l.hero} ${h}`, children: /* @__PURE__ */ e("article", { className: l.container, children: /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", {}) }) }) });
81
+ if (s === "full-bleed")
82
+ return /* @__PURE__ */ e("section", { className: `${l.hero} ${h}`, children: /* @__PURE__ */ i("article", { className: l.container, children: [
83
+ c ? c.includes("vimeo.com") || c.includes("youtube.com") || c.includes("youtu.be") ? /* @__PURE__ */ e("div", { className: l.videoBackground, children: /* @__PURE__ */ e(
129
84
  "iframe",
130
85
  {
131
- src: t.includes("vimeo.com") ? `${t}?autoplay=1&muted=1&loop=1&background=1` : `${t}?autoplay=1&mute=1&loop=1&playlist=${m(
132
- t
86
+ src: c.includes("vimeo.com") ? `${c}?autoplay=1&muted=1&loop=1&background=1` : `${c}?autoplay=1&mute=1&loop=1&playlist=${N(
87
+ c
133
88
  )}`,
134
89
  className: l.iframe,
135
90
  allow: "autoplay; fullscreen",
136
91
  allowFullScreen: !0
137
92
  }
138
- ) }) : /* @__PURE__ */ s(_, { children: [
139
- /* @__PURE__ */ e(f, {}),
93
+ ) }) : /* @__PURE__ */ i(y, { children: [
94
+ /* @__PURE__ */ e(b, {}),
140
95
  /* @__PURE__ */ e(
141
96
  "video",
142
97
  {
143
98
  ref: u,
144
99
  className: l.videoBackground,
145
- src: t,
100
+ src: c,
146
101
  autoPlay: !n,
147
102
  loop: !0,
148
103
  muted: !0,
@@ -151,7 +106,7 @@ function oe({
151
106
  }
152
107
  )
153
108
  ] }) : /* @__PURE__ */ e(
154
- p,
109
+ k,
155
110
  {
156
111
  src: (r == null ? void 0 : r.imageUrl) ?? "",
157
112
  alt: (r == null ? void 0 : r.asset.altText) || (r == null ? void 0 : r.asset.description) || "Card image",
@@ -164,26 +119,26 @@ function oe({
164
119
  ),
165
120
  /* @__PURE__ */ e("div", { className: l.overlay, children: /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", {}) }) })
166
121
  ] }) });
167
- if (i === "blog")
168
- return /* @__PURE__ */ e("section", { className: `${l.hero} ${y}`, children: /* @__PURE__ */ s("article", { className: l.container, children: [
169
- t ? t.includes("vimeo.com") || t.includes("youtube.com") || t.includes("youtu.be") ? /* @__PURE__ */ e("div", { className: l.videoBackground, children: /* @__PURE__ */ e(
122
+ if (s === "blog")
123
+ return /* @__PURE__ */ e("section", { className: `${l.hero} ${h}`, children: /* @__PURE__ */ i("article", { className: l.container, children: [
124
+ c ? c.includes("vimeo.com") || c.includes("youtube.com") || c.includes("youtu.be") ? /* @__PURE__ */ e("div", { className: l.videoBackground, children: /* @__PURE__ */ e(
170
125
  "iframe",
171
126
  {
172
- src: t.includes("vimeo.com") ? `${t}?autoplay=1&muted=1&loop=1&background=1` : `${t}?autoplay=1&mute=1&loop=1&playlist=${m(
173
- t
127
+ src: c.includes("vimeo.com") ? `${c}?autoplay=1&muted=1&loop=1&background=1` : `${c}?autoplay=1&mute=1&loop=1&playlist=${N(
128
+ c
174
129
  )}`,
175
130
  className: l.iframe,
176
131
  allow: "autoplay; fullscreen",
177
132
  allowFullScreen: !0
178
133
  }
179
- ) }) : /* @__PURE__ */ s(_, { children: [
180
- /* @__PURE__ */ e(f, {}),
134
+ ) }) : /* @__PURE__ */ i(y, { children: [
135
+ /* @__PURE__ */ e(b, {}),
181
136
  /* @__PURE__ */ e(
182
137
  "video",
183
138
  {
184
139
  ref: u,
185
140
  className: l.videoBackground,
186
- src: t,
141
+ src: c,
187
142
  autoPlay: !n,
188
143
  loop: !0,
189
144
  muted: !0,
@@ -192,7 +147,7 @@ function oe({
192
147
  }
193
148
  )
194
149
  ] }) : /* @__PURE__ */ e(
195
- p,
150
+ k,
196
151
  {
197
152
  src: (r == null ? void 0 : r.imageUrl) ?? "",
198
153
  alt: (r == null ? void 0 : r.asset.altText) || (r == null ? void 0 : r.asset.description) || "Card image",
@@ -203,21 +158,21 @@ function oe({
203
158
  sizes: "(min-width: 500px) 500px, 100vw"
204
159
  }
205
160
  ),
206
- /* @__PURE__ */ e("div", { className: l.overlay, children: /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", { children: c && /* @__PURE__ */ s("div", { className: l.articleDetails, children: [
207
- c.articleType && /* @__PURE__ */ e("div", { className: l.articleType, children: c.articleType }),
208
- /* @__PURE__ */ s("div", { className: l.articleCategories, children: [
209
- w && /* @__PURE__ */ e("span", { className: l.category, children: w.title }),
210
- a && a.title.toLowerCase() !== "library" && !a.slug.current.includes(
161
+ /* @__PURE__ */ e("div", { className: l.overlay, children: /* @__PURE__ */ e("div", { className: l.text, children: /* @__PURE__ */ e("div", { children: t && /* @__PURE__ */ i("div", { className: l.articleDetails, children: [
162
+ t.articleType && /* @__PURE__ */ e("div", { className: l.articleType, children: t.articleType }),
163
+ /* @__PURE__ */ i("div", { className: l.articleCategories, children: [
164
+ p && /* @__PURE__ */ e("span", { className: l.category, children: p.title }),
165
+ d && d.title.toLowerCase() !== "library" && !d.slug.current.includes(
211
166
  "keywords"
212
- ) && /* @__PURE__ */ e("span", { className: l.category, children: a.title })
167
+ ) && /* @__PURE__ */ e("span", { className: l.category, children: d.title })
213
168
  ] }),
214
- c.timeToRead && /* @__PURE__ */ e(_, { children: /* @__PURE__ */ s("span", { children: [
215
- /* @__PURE__ */ e("span", { className: l.number, children: c.timeToRead }),
169
+ t.timeToRead && /* @__PURE__ */ e(y, { children: /* @__PURE__ */ i("span", { children: [
170
+ /* @__PURE__ */ e("span", { className: l.number, children: t.timeToRead }),
216
171
  "min read"
217
172
  ] }) })
218
173
  ] }) }) }) })
219
174
  ] }) });
220
175
  }
221
176
  export {
222
- oe as HeroBlock
177
+ le as HeroBlock
223
178
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quirk-ui",
3
3
  "private": false,
4
- "version": "0.0.322",
4
+ "version": "0.0.323",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {