@gearbox-protocol/ui-kit 3.14.0-next.2 → 3.14.0-next.23

package/dist/esm/components/legal-agreement/legal-agreement-panel.js

@@ -0,0 +1,130 @@
+import { jsx as l, jsxs as s } from "react/jsx-runtime";
+import { Checkbox as h } from "../checkbox/checkbox.js";
+import { CheckboxLabeled as b } from "../checkbox/checkbox-labeled.js";
+import { faTriangleExclamation as u } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as N } from "../icons/fa-icon.js";
+import { legalAgreementPanelRootVariants as k, legalAgreementPanelNotificationVariants as p, legalAgreementPanelV2BannerVariants as f, legalAgreementPanelCheckboxListVariants as v, legalAgreementPanelCheckboxListTitleVariants as A, legalAgreementPanelCheckboxRowVariants as x, legalAgreementPanelCheckboxLabelVariants as g } from "./legal-agreement-theme.js";
+class P {
+  static root = "legal-agreement-panel-root";
+}
+function T({
+  config: a,
+  checkedItems: i,
+  onCheckedChange: n,
+  hasV2Signature: r,
+  showTitle: c,
+  checkboxIdPrefix: o,
+  theme: e
+}) {
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: k({ theme: e }),
+      "data-testid": P.root,
+      children: [
+        c ? /* @__PURE__ */ l("h2", { className: "text-center text-xl font-semibold text-foreground", children: r ? a.updatedTitle || "Terms of Service Updated" : a.title || "Legal Agreement" }) : null,
+        /* @__PURE__ */ l("div", { className: p({ theme: e }), children: a.notificationText }),
+        r ? /* @__PURE__ */ s("div", { className: f({ theme: e }), children: [
+          /* @__PURE__ */ l(
+            N,
+            {
+              icon: u,
+              className: "size-5 shrink-0 text-yellow-500 mt-0.5"
+            }
+          ),
+          /* @__PURE__ */ l("div", { className: "text-sm text-yellow-500", children: a.updatedTermsNoticeText ?? `Our Terms of Service have been updated. Please review and sign the new agreement to continue using ${a.productName}.` })
+        ] }) : null,
+        /* @__PURE__ */ s("div", { className: v({ theme: e }), children: [
+          a.checkboxListTitle ? /* @__PURE__ */ l(
+            "div",
+            {
+              className: A({ theme: e }),
+              children: a.checkboxListTitle
+            }
+          ) : null,
+          a.checkboxItems.map((t) => {
+            const d = `${o}-${t.id}`, m = i[t.id] || !1;
+            return e === "gearboxV3" ? /* @__PURE__ */ l(
+              "div",
+              {
+                className: x({ theme: e }),
+                children: /* @__PURE__ */ l(
+                  b,
+                  {
+                    id: d,
+                    checked: m,
+                    onChange: () => n(t.id),
+                    boxAlign: "flex-start",
+                    size: "lg",
+                    color: "secondary",
+                    children: /* @__PURE__ */ l(
+                      "div",
+                      {
+                        className: g({
+                          theme: e
+                        }),
+                        children: t.content
+                      }
+                    )
+                  }
+                )
+              },
+              t.id
+            ) : /* @__PURE__ */ s(
+              "label",
+              {
+                htmlFor: d,
+                className: x({ theme: e }),
+                children: [
+                  /* @__PURE__ */ l(
+                    h,
+                    {
+                      id: d,
+                      checked: m,
+                      onCheckedChange: () => n(t.id),
+                      className: "mt-1"
+                    }
+                  ),
+                  /* @__PURE__ */ l(
+                    "span",
+                    {
+                      className: g({ theme: e }),
+                      children: t.content
+                    }
+                  )
+                ]
+              },
+              t.id
+            );
+          })
+        ] })
+      ]
+    }
+  );
+}
+function $({
+  config: a,
+  checkedItems: i,
+  onCheckedChange: n,
+  hasV2Signature: r = !1,
+  showTitle: c = !1,
+  checkboxIdPrefix: o = "legal-checkbox",
+  theme: e = "default"
+}) {
+  return /* @__PURE__ */ l(
+    T,
+    {
+      config: a,
+      checkedItems: i,
+      onCheckedChange: n,
+      hasV2Signature: r,
+      showTitle: c,
+      checkboxIdPrefix: o,
+      theme: e
+    }
+  );
+}
+export {
+  $ as LegalAgreementPanel,
+  P as LegalAgreementPanelTest
+};

package/dist/esm/components/legal-agreement/legal-agreement-theme.js

@@ -0,0 +1,137 @@
+import { cva as e } from "class-variance-authority";
+const t = {
+  theme: {
+    default: "",
+    gearboxV3: ""
+  }
+}, r = e("space-y-4", {
+  variants: {
+    theme: {
+      default: "",
+      gearboxV3: "mx-auto w-full min-w-0 max-w-[750px]"
+    }
+  },
+  defaultVariants: {
+    theme: "default"
+  }
+}), n = e("", {
+  variants: {
+    theme: {
+      default: "text-center leading-relaxed text-base text-foreground",
+      gearboxV3: "mb-6 text-center text-xl font-semibold leading-normal text-foreground"
+    }
+  },
+  defaultVariants: {
+    theme: "default"
+  }
+}), l = e("space-y-4", {
+  variants: t,
+  defaultVariants: {
+    theme: "default"
+  }
+}), o = e("", {
+  variants: {
+    theme: {
+      default: "text-base text-foreground",
+      gearboxV3: "mb-5 text-center text-base text-foreground"
+    }
+  },
+  defaultVariants: {
+    theme: "default"
+  }
+}), i = e("", {
+  variants: {
+    theme: {
+      default: "group flex cursor-pointer items-start gap-3",
+      gearboxV3: "min-w-0 break-words"
+    }
+  },
+  defaultVariants: {
+    theme: "default"
+  }
+}), s = e("", {
+  variants: {
+    theme: {
+      default: "text-sm leading-relaxed transition-colors",
+      gearboxV3: "relative min-w-0 break-words"
+    }
+  },
+  defaultVariants: {
+    theme: "default"
+  }
+}), m = e(
+  "flex items-start gap-2 rounded-lg border border-yellow-500/50 bg-yellow-500/10 p-3",
+  {
+    variants: {
+      theme: {
+        default: "",
+        gearboxV3: "mx-auto w-full min-w-0 max-w-[750px]"
+      }
+    },
+    defaultVariants: {
+      theme: "default"
+    }
+  }
+), g = e(
+  "flex flex-col items-center gap-4 py-8 text-center",
+  {
+    variants: {
+      theme: {
+        default: "",
+        gearboxV3: "mx-auto w-full min-w-0 max-w-[750px]"
+      }
+    },
+    defaultVariants: {
+      theme: "default"
+    }
+  }
+), d = e(
+  "flex items-center justify-center gap-2 text-foreground",
+  {
+    variants: {
+      theme: {
+        default: "text-lg font-semibold",
+        gearboxV3: "text-base font-normal"
+      }
+    },
+    defaultVariants: {
+      theme: "default"
+    }
+  }
+), x = e(
+  "text-secondary-foreground",
+  {
+    variants: {
+      theme: {
+        default: "text-sm",
+        gearboxV3: "text-base"
+      }
+    },
+    defaultVariants: {
+      theme: "default"
+    }
+  }
+), f = e("underline", {
+  variants: {
+    theme: {
+      default: "text-primary hover:text-primary/80",
+      gearboxV3: ""
+    }
+  },
+  defaultVariants: {
+    theme: "default"
+  }
+});
+export {
+  x as legalAgreementAwaitingDescriptionVariants,
+  g as legalAgreementAwaitingRootVariants,
+  d as legalAgreementAwaitingTitleVariants,
+  f as legalAgreementLinkVariants,
+  s as legalAgreementPanelCheckboxLabelVariants,
+  o as legalAgreementPanelCheckboxListTitleVariants,
+  l as legalAgreementPanelCheckboxListVariants,
+  i as legalAgreementPanelCheckboxRowVariants,
+  n as legalAgreementPanelNotificationVariants,
+  r as legalAgreementPanelRootVariants,
+  m as legalAgreementPanelV2BannerVariants
+};

package/dist/esm/components/legal-agreement/legal-agreement.stories-config.js

@@ -0,0 +1,170 @@
+import { jsxs as r, Fragment as i, jsx as d } from "react/jsx-runtime";
+import { LegalAgreementLink as l } from "./legal-agreement-link.js";
+const t = {
+  termsOfService: "https://gearbox.finance/terms",
+  privacyNotice: "https://gearbox.finance/privacy",
+  riskDisclosure: "https://gearbox.finance/risks",
+  rwaMarketsTerms: "https://gearbox.finance/rwa-tc"
+}, n = "Example App";
+function c(a, e, s) {
+  return /* @__PURE__ */ d(l, { href: e, theme: a, children: s });
+}
+function m(a = "default") {
+  const e = (s, o) => c(a, s, o);
+  return {
+    productName: n,
+    notificationText: /* @__PURE__ */ r(i, { children: [
+      "Any use of and/or interaction with the ",
+      n,
+      " is subject to the",
+      " ",
+      e(t.termsOfService, "Terms of Service"),
+      " and",
+      " ",
+      e(t.privacyNotice, "Privacy Notice"),
+      ", and acceptance of risks described in the",
+      " ",
+      e(t.riskDisclosure, "Risk Disclosure Statement"),
+      "."
+    ] }),
+    checkboxItems: [
+      {
+        id: "consent",
+        content: /* @__PURE__ */ r(i, { children: [
+          "I agree to the",
+          " ",
+          e(t.termsOfService, "Terms of Service"),
+          " and acknowledge the ",
+          e(t.privacyNotice, "Privacy Notice"),
+          ". I have read the",
+          " ",
+          e(t.riskDisclosure, "Risk Disclosure Statement"),
+          " and I voluntarily assume all risks described in it."
+        ] })
+      }
+    ]
+  };
+}
+function h(a = "default") {
+  const e = (s, o) => c(a, s, o);
+  return {
+    productName: n,
+    notificationText: /* @__PURE__ */ r(i, { children: [
+      "By accessing or using ",
+      n,
+      ", I agree to the",
+      " ",
+      e(t.termsOfService, "Terms of Service"),
+      " and confirm that I have read and understood the",
+      " ",
+      e(t.privacyNotice, "Privacy Notice"),
+      " and",
+      " ",
+      e(t.riskDisclosure, "Risk Disclosure Statement"),
+      "."
+    ] }),
+    updatedTermsNoticeText: /* @__PURE__ */ r(i, { children: [
+      "Our Terms of Service have been updated. Please review and sign the new agreement to continue using ",
+      n,
+      "."
+    ] }),
+    checkboxItems: [
+      {
+        id: "terms",
+        content: /* @__PURE__ */ r(i, { children: [
+          "I agree to the",
+          " ",
+          e(t.termsOfService, "Terms of Service"),
+          " and acknowledge the ",
+          e(t.privacyNotice, "Privacy Notice"),
+          "."
+        ] })
+      },
+      {
+        id: "prohibited",
+        content: "I represent and confirm that I am not a Prohibited Person (as defined in the above Terms of Service) and am not acting on behalf of one."
+      },
+      {
+        id: "risks",
+        content: /* @__PURE__ */ r(i, { children: [
+          "I acknowledge that the ",
+          n,
+          ", related software, and smart contracts are experimental and may contain errors or vulnerabilities. I understand that their use may result in the complete loss of my funds. I have read the",
+          " ",
+          e(t.riskDisclosure, "Risk Disclosure Statement"),
+          " and I voluntarily assume all risks described in it."
+        ] })
+      }
+    ]
+  };
+}
+function f(a = "default") {
+  const e = (s, o) => c(a, s, o);
+  return {
+    productName: n,
+    notificationText: /* @__PURE__ */ r(i, { children: [
+      "By accessing or using ",
+      n,
+      ", I agree to the",
+      " ",
+      e(t.termsOfService, "Terms of Service"),
+      " and",
+      " ",
+      e(
+        t.rwaMarketsTerms,
+        "RWA Markets Interface Terms & Conditions"
+      ),
+      ", and confirm that I have read and understood the",
+      " ",
+      e(t.privacyNotice, "Privacy Notice"),
+      " and",
+      " ",
+      e(t.riskDisclosure, "Risk Disclosure Statement"),
+      "."
+    ] }),
+    checkboxItems: [
+      {
+        id: "terms",
+        content: /* @__PURE__ */ r(i, { children: [
+          "I agree to the",
+          " ",
+          e(t.termsOfService, "Terms of Service"),
+          " and",
+          " ",
+          e(
+            t.rwaMarketsTerms,
+            "RWA Markets Interface Terms & Conditions"
+          ),
+          ", and acknowledge the",
+          " ",
+          e(t.privacyNotice, "Privacy Notice"),
+          "."
+        ] })
+      },
+      {
+        id: "prohibited",
+        content: "I represent and confirm that I am not a Prohibited Person (as defined in the above Terms of Service) and am not acting on behalf of one."
+      },
+      {
+        id: "risks",
+        content: /* @__PURE__ */ r(i, { children: [
+          "I acknowledge that the ",
+          n,
+          ", RWA Markets Interface, related software, and smart contracts are experimental and may contain errors or vulnerabilities. I understand that their use may result in the complete loss of my funds. I have read the",
+          " ",
+          e(t.riskDisclosure, "Risk Disclosure Statement"),
+          ", and I voluntarily assume all risks described in it and the above RWA Markets Interface Terms & Conditions."
+        ] })
+      }
+    ]
+  };
+}
+const k = m(), g = h(), p = f();
+export {
+  h as createStoryExtendedLegalConfig,
+  m as createStoryPermissionlessLegalConfig,
+  f as createStoryRwaLegalConfig,
+  g as storyExtendedLegalConfig,
+  k as storyPermissionlessLegalConfig,
+  p as storyRwaLegalConfig
+};

package/dist/esm/components/markdown-viewer/markdown-viewer.js

@@ -124,6 +124,7 @@ import "lightweight-charts";
 import "../graph/graph-view.js";
 import "../health-factor/health-factor.js";
 import "../horizontal-indicator/horizontal-indicator.js";
+import "../legal-agreement/legal-agreement-theme.js";
 import { Link as I } from "../link/link.js";
 import "../../utils/reactochart-compat.js";
 import "../status-elements/status-elements.js";
@@ -181,7 +182,7 @@ function a(o) {
   }
   return { id: T(l), displayText: o };
 }
-function jr({
+function Ar({
   content: o,
   title: l,
   backButton: s,
@@ -393,5 +394,5 @@ function jr({
   return c ? d : /* @__PURE__ */ r(w, { title: l || "", backButton: s, children: d });
 }
 export {
-  jr as MarkdownViewer
+  Ar as MarkdownViewer
 };