@npm_leadtech/legal-contracts-ui 0.49.0 → 0.50.1

package/dist/components/Badge.d.ts

@@ -6,5 +6,6 @@ export declare const Badge: FC<BadgeProps>;
 export declare interface BadgeProps {
     children?: ReactNode;
     color?: 'primary' | 'secondary';
+    className?: string;
 }
 

package/dist/components/Badge.js

@@ -1,12 +1,12 @@
-import { jsx as a } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
 import "react";
-const o = ({ children: t, color: e = "secondary" }) => /* @__PURE__ */ a(
+const n = ({ children: r, color: t = "secondary", className: e }) => /* @__PURE__ */ o(
   "div",
   {
-    className: `absolute -top-4 left-1/2 flex -translate-x-1/2 transform items-center gap-2 rounded sm:-right-2 sm:left-auto sm:translate-0 bg-${e}-200 text-small px-2 py-2 whitespace-nowrap text-neutral-800 shadow-md`,
-    children: t
+    className: `flex items-center gap-2 rounded bg-${t}-200 whitespace-nowrap text-neutral-800 shadow-md ${e || ""}`,
+    children: r
   }
 );
 export {
-  o as Badge
+  n as Badge
 };

package/dist/components/FaqItem.js

@@ -1,41 +1,44 @@
-"use client";
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { useState as c } from "react";
-import { FaqItemWrapper as p } from "./FaqItemWrapper.js";
-import { Markdown as x } from "./Markdown.js";
-import { ChevronDownIcon as u } from "./ChevronDownIcon.js";
-const g = ({
+import { useId as s } from "react";
+import { FaqItemWrapper as c } from "./FaqItemWrapper.js";
+import { Markdown as d } from "./Markdown.js";
+import { ChevronDownIcon as o } from "./ChevronDownIcon.js";
+const w = ({
   question: a,
-  answer: o,
+  answer: i,
   showMoreText: n,
-  collapsedButtonText: m,
-  expandedButtonText: s
+  collapsedButtonText: l,
+  expandedButtonText: m
 }) => {
-  const i = /* @__PURE__ */ e("span", { className: "font-bold", children: a }), [t, l] = c(!1);
-  return /* @__PURE__ */ e("div", { className: "text-medium flex flex-col rounded bg-white p-4 text-neutral-800 shadow", children: /* @__PURE__ */ r(p, { question: i, children: [
-    /* @__PURE__ */ e(x, { content: o, className: "text-medium" }),
+  const t = `toggle-${s().replace(/:/g, "")}`;
+  return /* @__PURE__ */ e("div", { className: "text-medium flex flex-col rounded bg-white p-4 text-neutral-800 shadow", children: /* @__PURE__ */ r(c, { question: /* @__PURE__ */ e("span", { className: "font-bold", children: a }), children: [
+    /* @__PURE__ */ e(d, { content: i, className: "text-medium" }),
     n && /* @__PURE__ */ r("div", { className: "mt-4 rounded-lg bg-neutral-50 p-6", children: [
-      /* @__PURE__ */ e(
-        "p",
+      /* @__PURE__ */ e("input", { type: "checkbox", id: t, className: "peer sr-only" }),
+      /* @__PURE__ */ e("p", { className: "mb-4 line-clamp-4 text-xs leading-relaxed wrap-break-word text-neutral-800 peer-checked:line-clamp-none", children: n }),
+      /* @__PURE__ */ r(
+        "label",
         {
-          className: `mb-4 text-xs leading-relaxed wrap-break-word text-neutral-800 ${t ? "" : "line-clamp-4"}`,
-          children: n
+          htmlFor: t,
+          className: "text-primary-700 flex cursor-pointer items-center gap-1 text-sm font-medium transition-colors peer-checked:hidden",
+          children: [
+            m,
+            /* @__PURE__ */ e(o, { fill: "var(--primary-700)", className: "h-4 w-4 transition-transform duration-200" })
+          ]
         }
       ),
       /* @__PURE__ */ r(
-        "button",
+        "label",
         {
-          className: "text-primary-700 flex cursor-pointer items-center gap-1 text-sm font-medium transition-colors",
-          onClick: () => {
-            l((d) => !d);
-          },
+          htmlFor: t,
+          className: "text-primary-700 hidden cursor-pointer items-center gap-1 text-sm font-medium transition-colors peer-checked:flex",
           children: [
-            t ? m : s,
+            l,
             /* @__PURE__ */ e(
-              u,
+              o,
               {
                 fill: "var(--primary-700)",
-                className: `h-4 w-4 transition-transform duration-200 ${t ? "rotate-180" : ""} `
+                className: "h-4 w-4 rotate-180 transition-transform duration-200"
               }
             )
           ]
@@ -45,5 +48,5 @@ const g = ({
   ] }) });
 };
 export {
-  g as FaqItem
+  w as FaqItem
 };

package/dist/components/TrustedBadge.js

@@ -1,11 +1,11 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { jsxs as r, jsx as s } from "react/jsx-runtime";
 import "react";
 import { Badge as e } from "./Badge.js";
-import { TrustedIcon as m } from "./TrustedIcon.js";
-const a = ({ children: r }) => /* @__PURE__ */ o(e, { children: [
-  /* @__PURE__ */ t(m, { className: "h-5 w-5" }),
-  r
+import { TrustedIcon as a } from "./TrustedIcon.js";
+const n = ({ children: t }) => /* @__PURE__ */ r(e, { className: "text-small absolute -top-4 left-1/2 -translate-x-1/2 transform px-2 py-2 sm:-right-2 sm:left-auto sm:translate-0", children: [
+  /* @__PURE__ */ s(a, { className: "h-5 w-5" }),
+  t
 ] });
 export {
-  a as TrustedBadge
+  n as TrustedBadge
 };