@npm_leadtech/legal-contracts-ui 0.165.6 → 0.167.0

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.
@@ -30,6 +30,7 @@ export declare interface PreformProps {
30
30
  radioFieldData?: RadioFieldData;
31
31
  inputFieldData?: InputFieldData;
32
32
  tooltips: TooltipsProps[];
33
+ hasMobileRadioField?: boolean;
33
34
  }
34
35
 
35
36
  export declare type RadioFieldData = {
@@ -1,35 +1,35 @@
1
1
  "use client";
2
- import { jsxs as c, Fragment as x, jsx as e } from "react/jsx-runtime";
2
+ import { jsxs as c, Fragment as p, jsx as e } from "react/jsx-runtime";
3
3
  import "react";
4
- import { Tooltips as n } from "./Tooltips.js";
5
- import { PreformMobile as a } from "./PreformMobile.js";
6
- import { PreformOption as f } from "./PreformOption.js";
4
+ import { Tooltips as a } from "./Tooltips.js";
5
+ import { PreformMobile as f } from "./PreformMobile.js";
7
6
  import { TrustedBadge as i } from "./TrustedBadge.js";
8
- import { Input as h } from "./Input.js";
7
+ import { PreformOption as h } from "./PreformOption.js";
8
+ import { Input as g } from "./Input.js";
9
9
  import { LinkWrapper as t } from "./LinkWrapper.js";
10
- const k = ({ trustedBadge: s, cta: o, inputFieldData: l, radioFieldData: m, tooltips: p }) => /* @__PURE__ */ c(x, { children: [
10
+ const C = ({
11
+ trustedBadge: s,
12
+ cta: o,
13
+ inputFieldData: l,
14
+ radioFieldData: r,
15
+ tooltips: n,
16
+ hasMobileRadioField: x
17
+ }) => /* @__PURE__ */ c(p, { children: [
11
18
  /* @__PURE__ */ e("section", { className: "bg-neutral-25 hidden pt-10 text-neutral-800 sm:block sm:px-6 lg:px-8 xl:px-30", children: /* @__PURE__ */ c("div", { className: "relative mx-auto flex max-w-300 flex-col gap-6 rounded bg-white px-6 pt-8 pb-6 shadow-md sm:items-center sm:gap-8 lg:px-26 xl:px-10", children: [
12
19
  /* @__PURE__ */ e(i, { ...s }),
13
- m?.isVisible && /* @__PURE__ */ c(x, { children: [
14
- /* @__PURE__ */ e("p", { className: "text-medium sm:text-large font-bold", children: m.label }),
20
+ r?.isVisible && /* @__PURE__ */ c(p, { children: [
21
+ /* @__PURE__ */ e("p", { className: "text-large font-bold", children: r.label }),
15
22
  /* @__PURE__ */ c("div", { className: "flex w-full max-w-272 flex-wrap justify-center gap-2 sm:gap-4", children: [
16
- m.options.map((r) => /* @__PURE__ */ e(
17
- "div",
23
+ r.options.map((m) => /* @__PURE__ */ e("div", { className: "w-[calc(25%-12px)] lg:w-[calc(20%-13px)] xl:w-[calc(16.66%-14px)]", children: /* @__PURE__ */ e(
24
+ h,
18
25
  {
19
- className: "w-[calc(50%-4px)] sm:w-[calc(25%-12px)] lg:w-[calc(20%-13px)] xl:w-[calc(16.66%-14px)]",
20
- children: /* @__PURE__ */ e(
21
- f,
22
- {
23
- ...r,
24
- selected: r.value === m.radioSelected,
25
- onClick: m.onClick
26
- }
27
- )
28
- },
29
- r.value
30
- )),
26
+ ...m,
27
+ selected: m.value === r.radioSelected,
28
+ onClick: r.onClick
29
+ }
30
+ ) }, m.value)),
31
31
  l?.isVisible && /* @__PURE__ */ e("div", { className: "mt-4 flex basis-full justify-center md:mt-0", children: /* @__PURE__ */ e(
32
- h,
32
+ g,
33
33
  {
34
34
  id: l.id,
35
35
  label: l.label,
@@ -43,18 +43,19 @@ const k = ({ trustedBadge: s, cta: o, inputFieldData: l, radioFieldData: m, tool
43
43
  ] })
44
44
  ] }),
45
45
  /* @__PURE__ */ e(t, { variant: "primary-green", children: o }),
46
- p.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-col gap-8", children: p.map((r) => /* @__PURE__ */ e(n, { ...r }, r.title)) })
46
+ n.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-col gap-8", children: n.map((m) => /* @__PURE__ */ e(a, { ...m }, m.title)) })
47
47
  ] }) }),
48
48
  /* @__PURE__ */ e(
49
- a,
49
+ f,
50
50
  {
51
51
  cta: o,
52
52
  trustedBadge: s,
53
53
  inputFieldData: l,
54
- radioFieldData: m
54
+ radioFieldData: r,
55
+ hasMobileRadioField: x
55
56
  }
56
57
  )
57
58
  ] });
58
59
  export {
59
- k as Preform
60
+ C as Preform
60
61
  };
@@ -19,6 +19,7 @@ export declare interface PreformMobileProps {
19
19
  radioFieldData?: RadioFieldData;
20
20
  inputFieldData?: InputFieldData;
21
21
  cta: ReactNode;
22
+ hasMobileRadioField?: boolean;
22
23
  }
23
24
 
24
25
  export interface PreformOptionProps {
@@ -1,53 +1,71 @@
1
- import { jsxs as o, Fragment as d, jsx as l } from "react/jsx-runtime";
2
- import { useState as x, useRef as v, useEffect as u } from "react";
3
- import { TrustedBadge as g } from "./TrustedBadge.js";
4
- import { Select as w } from "./Select.js";
5
- import { Input as f } from "./Input.js";
6
- import { LinkWrapper as N } from "./LinkWrapper.js";
7
- const y = ({ radioFieldData: r, inputFieldData: e, cta: h, trustedBadge: a }) => {
8
- const [m, b] = x(!1), c = v(null);
9
- u(() => {
10
- const s = c.current;
11
- if (!s) return;
12
- const n = new IntersectionObserver(
13
- ([i]) => {
14
- b(!i.isIntersecting);
1
+ import { jsxs as c, Fragment as v, jsx as l } from "react/jsx-runtime";
2
+ import { useState as w, useRef as p, useEffect as g } from "react";
3
+ import { TrustedBadge as N } from "./TrustedBadge.js";
4
+ import { Input as a } from "./Input.js";
5
+ import { PreformOption as C } from "./PreformOption.js";
6
+ import { Select as $ } from "./Select.js";
7
+ import { LinkWrapper as I } from "./LinkWrapper.js";
8
+ const R = ({
9
+ radioFieldData: r,
10
+ inputFieldData: e,
11
+ cta: d,
12
+ trustedBadge: i,
13
+ hasMobileRadioField: t
14
+ }) => {
15
+ const [f, u] = w(!1), h = p(null);
16
+ g(() => {
17
+ const n = h.current;
18
+ if (!n) return;
19
+ const s = new IntersectionObserver(
20
+ ([m]) => {
21
+ u(!m.isIntersecting);
15
22
  },
16
23
  { threshold: 0 }
17
24
  );
18
- return n.observe(s), () => {
19
- n.disconnect();
25
+ return s.observe(n), () => {
26
+ s.disconnect();
20
27
  };
21
28
  }, []);
22
- const t = (s) => /* @__PURE__ */ o(
29
+ const x = (n) => {
30
+ if (!r?.isVisible) return null;
31
+ const s = t && !n, m = `${r.name}-${n ? "sticky" : "mobile"}`;
32
+ return s ? /* @__PURE__ */ l("div", { className: "flex w-full flex-wrap justify-center gap-2", children: r.options.map((o) => /* @__PURE__ */ l("div", { className: "w-[calc(50%-4px)]", children: /* @__PURE__ */ l(
33
+ C,
34
+ {
35
+ ...o,
36
+ selected: o.value === r.radioSelected,
37
+ onClick: r.onClick
38
+ }
39
+ ) }, o.value)) }) : /* @__PURE__ */ l(
40
+ $,
41
+ {
42
+ id: m,
43
+ name: r.name,
44
+ value: r.radioSelected,
45
+ options: r.options,
46
+ containerClassName: "w-full",
47
+ onChange: (o) => {
48
+ r.onClick(o.target.value);
49
+ }
50
+ }
51
+ );
52
+ }, b = (n) => /* @__PURE__ */ c(
23
53
  "div",
24
54
  {
25
- className: `flex flex-col bg-white px-6 pb-4 ${s ? "border-t border-neutral-100 pt-4 shadow-md" : ""}`,
55
+ className: `flex flex-col bg-white px-6 pb-4 ${n ? "border-t border-neutral-100 pt-4 shadow-md" : ""}`,
26
56
  children: [
27
- /* @__PURE__ */ l(
57
+ t && !n ? /* @__PURE__ */ l("p", { className: "text-small mb-4 font-bold text-neutral-800", children: r?.label }) : /* @__PURE__ */ l(
28
58
  "label",
29
59
  {
30
- htmlFor: `${r?.name ?? ""}-${s ? "sticky" : "mobile"}`,
60
+ htmlFor: `${r?.name ?? ""}-${n ? "sticky" : "mobile"}`,
31
61
  className: "text-small mb-4 font-bold text-neutral-800",
32
62
  children: r?.label
33
63
  }
34
64
  ),
35
- /* @__PURE__ */ o("div", { className: `flex gap-4 ${s ? "flex-row items-center" : "flex-col"}`, children: [
36
- r?.isVisible && /* @__PURE__ */ l(
37
- w,
38
- {
39
- id: `${r.name}-${s ? "sticky" : "mobile"}`,
40
- name: r.name,
41
- value: r.radioSelected,
42
- options: r.options,
43
- containerClassName: "w-full",
44
- onChange: (n) => {
45
- r.onClick(n.target.value);
46
- }
47
- }
48
- ),
49
- e?.isVisible && !s && /* @__PURE__ */ l("div", { className: "flex justify-center", children: /* @__PURE__ */ l(
50
- f,
65
+ /* @__PURE__ */ c("div", { className: `flex gap-4 ${n ? "flex-row items-center" : "flex-col"}`, children: [
66
+ x(n),
67
+ e?.isVisible && !n && /* @__PURE__ */ l("div", { className: "flex justify-center", children: /* @__PURE__ */ l(
68
+ a,
51
69
  {
52
70
  containerClassName: "w-full text-small",
53
71
  id: `${e.id}-mobile`,
@@ -58,10 +76,10 @@ const y = ({ radioFieldData: r, inputFieldData: e, cta: h, trustedBadge: a }) =>
58
76
  onInputChange: e.onChange
59
77
  }
60
78
  ) }, e.name),
61
- /* @__PURE__ */ l(N, { variant: "primary-green", className: `text-small ${s ? "w-fit text-nowrap" : "w-full"}`, children: h })
79
+ /* @__PURE__ */ l(I, { variant: "primary-green", className: `text-small ${n ? "w-fit text-nowrap" : "w-full"}`, children: d })
62
80
  ] }),
63
- e?.isVisible && s && /* @__PURE__ */ l("div", { className: "mt-4 flex w-full justify-center", children: /* @__PURE__ */ l(
64
- f,
81
+ e?.isVisible && n && /* @__PURE__ */ l("div", { className: "mt-4 flex w-full justify-center", children: /* @__PURE__ */ l(
82
+ a,
65
83
  {
66
84
  containerClassName: "w-full text-small",
67
85
  id: `${e.id}-mobile-sticky`,
@@ -75,14 +93,14 @@ const y = ({ radioFieldData: r, inputFieldData: e, cta: h, trustedBadge: a }) =>
75
93
  ]
76
94
  }
77
95
  );
78
- return /* @__PURE__ */ o(d, { children: [
79
- /* @__PURE__ */ l("section", { className: "bg-neutral-25 pt-10 text-neutral-800 sm:hidden", children: /* @__PURE__ */ o("div", { ref: c, className: "relative flex flex-col rounded bg-white pt-8 shadow", children: [
80
- /* @__PURE__ */ l("div", { className: "px-6", children: /* @__PURE__ */ l(g, { ...a }) }),
81
- /* @__PURE__ */ l("div", { className: m ? "hidden" : "block", children: t(!1) })
96
+ return /* @__PURE__ */ c(v, { children: [
97
+ /* @__PURE__ */ l("section", { className: "bg-neutral-25 pt-10 text-neutral-800 sm:hidden", children: /* @__PURE__ */ c("div", { ref: h, className: "relative flex flex-col rounded bg-white pt-8 shadow", children: [
98
+ /* @__PURE__ */ l("div", { className: "px-6", children: /* @__PURE__ */ l(N, { ...i }) }),
99
+ /* @__PURE__ */ l("div", { className: f ? "hidden" : "block", children: b(!1) })
82
100
  ] }) }),
83
- m && /* @__PURE__ */ l("div", { className: "fixed bottom-0 left-0 z-50 w-full sm:hidden", children: t(!0) })
101
+ f && /* @__PURE__ */ l("div", { className: "fixed bottom-0 left-0 z-50 w-full sm:hidden", children: b(!0) })
84
102
  ] });
85
103
  };
86
104
  export {
87
- y as PreformMobile
105
+ R as PreformMobile
88
106
  };
@@ -129,6 +129,7 @@ export interface PreformProps {
129
129
  radioFieldData?: RadioFieldData;
130
130
  inputFieldData?: InputFieldData;
131
131
  tooltips: TooltipsProps[];
132
+ hasMobileRadioField?: boolean;
132
133
  }
133
134
 
134
135
  export interface PreviewDownloadProps {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-contracts-ui",
3
- "version": "0.165.6",
3
+ "version": "0.167.0",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",