@cfx-dev/ui-components 4.5.14 → 4.5.16

package/dist/cfxIcons-B4SQ4Ljd.js

@@ -0,0 +1,100 @@
+import r from "./components/Icons/cfx-icons/Close.js";
+import o from "./components/Icons/cfx-icons/Controller.js";
+import m from "./components/Icons/cfx-icons/Copy.js";
+import t from "./components/Icons/cfx-icons/DownArrow.js";
+import i from "./components/Icons/cfx-icons/DownChevron.js";
+import p from "./components/Icons/cfx-icons/Download.js";
+import f from "./components/Icons/cfx-icons/Expand.js";
+import e from "./components/Icons/cfx-icons/ExternalLink.js";
+import n from "./components/Icons/cfx-icons/Filter.js";
+import l from "./components/Icons/cfx-icons/Heart.js";
+import a from "./components/Icons/cfx-icons/HeartFilled.js";
+import s from "./components/Icons/cfx-icons/Help.js";
+import h from "./components/Icons/cfx-icons/LeftArrow.js";
+import u from "./components/Icons/cfx-icons/LeftChevron.js";
+import c from "./components/Icons/cfx-icons/Map.js";
+import d from "./components/Icons/cfx-icons/Menu.js";
+import C from "./components/Icons/cfx-icons/Minus.js";
+import U from "./components/Icons/cfx-icons/More.js";
+import v from "./components/Icons/cfx-icons/MoreInfo.js";
+import w from "./components/Icons/cfx-icons/Pencil.js";
+import S from "./components/Icons/cfx-icons/Play.js";
+import g from "./components/Icons/cfx-icons/Plus.js";
+import y from "./components/Icons/cfx-icons/Radio.js";
+import M from "./components/Icons/cfx-icons/Refresh.js";
+import b from "./components/Icons/cfx-icons/RightArrow.js";
+import R from "./components/Icons/cfx-icons/RightChevron.js";
+import A from "./components/Icons/cfx-icons/Search.js";
+import P from "./components/Icons/cfx-icons/Sort.js";
+import T from "./components/Icons/cfx-icons/Square.js";
+import _ from "./components/Icons/cfx-icons/SquareCheck.js";
+import k from "./components/Icons/cfx-icons/Stop.js";
+import x from "./components/Icons/cfx-icons/Tick.js";
+import D from "./components/Icons/cfx-icons/Transfer.js";
+import H from "./components/Icons/cfx-icons/Trash.js";
+import I from "./components/Icons/cfx-icons/Undo.js";
+import L from "./components/Icons/cfx-icons/UpArrow.js";
+import O from "./components/Icons/cfx-icons/UpChevron.js";
+import V from "./components/Icons/cfx-icons/Upload.js";
+import j from "./components/Icons/cfx-icons/Users.js";
+import q from "./components/Icons/cfx-icons/Visibility.js";
+import E from "./components/Icons/cfx-icons/VisibilityOff.js";
+import F from "./components/Icons/cfx-icons/Warning.js";
+import z from "./components/Icons/cfx-icons/Cart.js";
+import B from "./components/Icons/cfx-icons/User.js";
+import W from "./components/Icons/cfx-icons/Verified.js";
+import G from "./components/Icons/cfx-icons/UpvotesBurst.js";
+import J from "./components/Icons/cfx-icons/UpvotesRecurring.js";
+const Er = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Cart: z,
+  Close: r,
+  Controller: o,
+  Copy: m,
+  DownArrow: t,
+  DownChevron: i,
+  Download: p,
+  Expand: f,
+  ExternalLink: e,
+  Filter: n,
+  Heart: l,
+  HeartFilled: a,
+  Help: s,
+  LeftArrow: h,
+  LeftChevron: u,
+  Map: c,
+  Menu: d,
+  Minus: C,
+  More: U,
+  MoreInfo: v,
+  Pencil: w,
+  Play: S,
+  Plus: g,
+  Radio: y,
+  Refresh: M,
+  RightArrow: b,
+  RightChevron: R,
+  Search: A,
+  Sort: P,
+  Square: T,
+  SquareCheck: _,
+  Stop: k,
+  Tick: x,
+  Transfer: D,
+  Trash: H,
+  Undo: I,
+  UpArrow: L,
+  UpChevron: O,
+  Upload: V,
+  UpvotesBurst: G,
+  UpvotesRecurring: J,
+  User: B,
+  Users: j,
+  Verified: W,
+  Visibility: q,
+  VisibilityOff: E,
+  Warning: F
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  Er as I
+};

package/dist/components/Accordion/Accordion.d.ts

@@ -1,5 +1,6 @@
 import { default as React } from 'react';
 import { IconName } from '../Icon';
+import { BoxDisplayType } from '../RSC/Box/Box.types';
 
 export interface AccordionProps {
     className?: string;
@@ -10,6 +11,15 @@ export declare const AccordionHeader: React.FC<React.PropsWithChildren>;
 export interface AccordionTriggerProps {
     text: string;
     iconLeft?: IconName;
+    iconLeftClassName?: string;
+    iconRightClassName?: string;
+    className?: string;
+    textClassName?: string;
 }
 export declare const AccordionTrigger: React.FC<AccordionTriggerProps>;
-export declare const AccordionContent: React.FC<React.PropsWithChildren>;
+export interface AccordionContentProps extends React.PropsWithChildren {
+    className?: string;
+    innerClassName?: string;
+    contentDisplay?: BoxDisplayType;
+}
+export declare const AccordionContent: React.FC<AccordionContentProps>;

package/dist/components/Accordion/Accordion.js

@@ -1,139 +1,146 @@
-import { jsx as c, jsxs as v } from "react/jsx-runtime";
+import { jsx as c, jsxs as T } from "react/jsx-runtime";
 import e from "react";
-import { Icon as A } from "../Icon/Icon.js";
-import { Text as b } from "../Text/Text.js";
-import { ui as I } from "../../utils/ui/ui.js";
-import { clsx as w } from "../../utils/clsx.js";
-import { debounce as R } from "../../utils/execution.js";
-import { minmax as y } from "../../utils/math.js";
-const T = "cfxui__Accordion__iconFlip__367de", k = "cfxui__Accordion__triggerContainer__b92c1", D = "cfxui__Accordion__iconUp__28d27", E = "cfxui__Accordion__iconDown__b9e95", N = "cfxui__Accordion__text__03dc4", U = "cfxui__Accordion__iconLeft__e348b", F = "cfxui__Accordion__iconRight__bbf0c", $ = "cfxui__Accordion__content__5ecaf", L = "cfxui__Accordion__contentText__1384b", S = "cfxui__Accordion__open__ed604", W = "cfxui__Accordion__closed__be897", o = {
-  iconFlip: T,
-  triggerContainer: k,
-  iconUp: D,
-  iconDown: E,
-  text: N,
-  iconLeft: U,
-  iconRight: F,
-  content: $,
-  contentText: L,
-  open: S,
-  closed: W
-}, g = e.createContext(void 0), q = function(i) {
+import { Icon as v } from "../Icon/Icon.js";
+import { Text as I } from "../Text/Text.js";
+import { ui as k } from "../../utils/ui/ui.js";
+import { clsx as p } from "../../utils/clsx.js";
+import { debounce as D } from "../../utils/execution.js";
+import { minmax as E } from "../../utils/math.js";
+const L = "cfxui__Accordion__iconFlip__367de", U = "cfxui__Accordion__triggerContainer__b92c1", F = "cfxui__Accordion__iconUp__28d27", $ = "cfxui__Accordion__iconDown__b9e95", S = "cfxui__Accordion__text__03dc4", W = "cfxui__Accordion__iconLeft__e348b", z = "cfxui__Accordion__iconRight__bbf0c", H = "cfxui__Accordion__content__5ecaf", O = "cfxui__Accordion__contentText__1384b", M = "cfxui__Accordion__open__ed604", j = "cfxui__Accordion__closed__be897", t = {
+  iconFlip: L,
+  triggerContainer: U,
+  iconUp: F,
+  iconDown: $,
+  text: S,
+  iconLeft: W,
+  iconRight: z,
+  content: H,
+  contentText: O,
+  open: M,
+  closed: j
+}, b = e.createContext(void 0), X = function(i) {
   const {
-    children: t,
-    className: s
-  } = i, [n, r] = e.useState({}), [d, a] = e.useState(null), u = e.useRef(null), l = e.useCallback((p) => {
-    r((m) => ({
-      ...m,
-      [p]: !m[p]
+    children: r,
+    className: _
+  } = i, [m, f] = e.useState({}), [d, s] = e.useState(null), a = e.useRef(null), n = e.useCallback((x) => {
+    f((u) => ({
+      ...u,
+      [x]: !u[x]
     }));
-  }, []), _ = e.useMemo(() => ({
-    openItems: n,
-    toggleItem: l,
+  }, []), l = e.useMemo(() => ({
+    openItems: m,
+    toggleItem: n,
     rootWidth: d
-  }), [n, l, d]), f = e.useCallback(() => {
-    u.current && a(u.current.getBoundingClientRect().width);
-  }, []), h = e.useMemo(() => R(f, 250), [f]);
-  return e.useEffect(() => (window.addEventListener("resize", h), () => {
-    window.removeEventListener("resize", h);
-  }), [h]), /* @__PURE__ */ c(g.Provider, { value: _, children: /* @__PURE__ */ c("div", { ref: u, className: s, role: "presentation", children: t }) });
-}, C = e.createContext(""), V = function({
+  }), [m, n, d]), h = e.useCallback(() => {
+    a.current && s(a.current.getBoundingClientRect().width);
+  }, []), o = e.useMemo(() => D(h, 250), [h]);
+  return e.useEffect(() => (window.addEventListener("resize", o), () => {
+    window.removeEventListener("resize", o);
+  }), [o]), /* @__PURE__ */ c(b.Provider, { value: l, children: /* @__PURE__ */ c("div", { ref: a, className: _, role: "presentation", children: r }) });
+}, w = e.createContext(""), Y = function({
   children: i
 }) {
-  const t = e.useId();
-  return /* @__PURE__ */ c(C.Provider, { value: t, children: /* @__PURE__ */ c("div", { className: o.item, id: t, role: "region", "aria-labelledby": `${t}-header`, children: i }) });
-}, G = function({
+  const r = e.useId();
+  return /* @__PURE__ */ c(w.Provider, { value: r, children: /* @__PURE__ */ c("div", { className: t.item, id: r, role: "region", "aria-labelledby": `${r}-header`, children: i }) });
+}, Z = function({
   children: i
 }) {
-  return /* @__PURE__ */ c("div", { className: o.header, children: i });
-}, J = function({
-  text: i,
-  iconLeft: t
-}) {
-  const s = e.useContext(g), n = e.useContext(C);
-  if (!s)
+  return /* @__PURE__ */ c("div", { className: t.header, children: i });
+}, ee = function(i) {
+  const {
+    text: r,
+    iconLeft: _,
+    iconRightClassName: m,
+    iconLeftClassName: f,
+    className: d,
+    textClassName: s
+  } = i, a = e.useContext(b), n = e.useContext(w);
+  if (!a)
     throw new Error("AccordionTrigger must be used within an Accordion");
   const {
-    toggleItem: r,
-    openItems: d
-  } = s, a = d[n], [u, l] = e.useState(!1), [_, f] = e.useState(a ? "UpChevron" : "DownChevron"), h = e.useCallback(() => {
-    r(n);
-  }, [n, r]), p = e.useCallback((m) => {
-    (m.key === "Enter" || m.key === " ") && r(n);
-  }, [n, r]);
+    toggleItem: l,
+    openItems: h
+  } = a, o = h[n], [x, u] = e.useState(!1), [A, R] = e.useState(o ? "UpChevron" : "DownChevron"), N = e.useCallback(() => {
+    l(n);
+  }, [n, l]), y = e.useCallback((C) => {
+    (C.key === "Enter" || C.key === " ") && l(n);
+  }, [n, l]);
   return e.useEffect(() => {
-    const m = setTimeout(() => {
-      f(a ? "UpChevron" : "DownChevron"), l(!1);
+    const C = setTimeout(() => {
+      R(o ? "UpChevron" : "DownChevron"), u(!1);
     }, 300);
-    return l(!0), () => clearTimeout(m);
-  }, [a]), /* @__PURE__ */ v(
+    return u(!0), () => clearTimeout(C);
+  }, [o]), /* @__PURE__ */ T(
     "div",
     {
-      className: o.triggerContainer,
-      onClick: h,
-      onKeyDown: p,
+      className: p(t.triggerContainer, d),
+      onClick: N,
+      onKeyDown: y,
       role: "button",
       tabIndex: 0,
-      "aria-expanded": a,
+      "aria-expanded": o,
       "aria-controls": `${n}-content`,
       id: `${n}-header`,
       children: [
-        t && /* @__PURE__ */ c(A, { name: t, className: o.iconLeft }),
-        /* @__PURE__ */ c(b, { size: "normal", className: o.text, children: i }),
+        _ && /* @__PURE__ */ c(v, { name: _, className: p(t.iconLeft, f) }),
+        /* @__PURE__ */ c(I, { size: "normal", className: p(t.text, s), children: r }),
         /* @__PURE__ */ c(
-          A,
+          v,
           {
-            className: w(o.iconRight, {
-              [o.iconFlip]: u,
-              [o.iconUp]: _ === "UpChevron",
-              [o.iconDown]: _ === "DownChevron"
+            className: p(t.iconRight, m, {
+              [t.iconFlip]: x,
+              [t.iconUp]: A === "UpChevron",
+              [t.iconDown]: A === "DownChevron"
             }),
-            name: _
+            name: A
           }
         )
       ]
     }
   );
-}, Q = function({
-  children: i
+}, ne = function({
+  children: i,
+  className: r,
+  innerClassName: _,
+  contentDisplay: m = "inline-block"
 }) {
-  const t = e.useContext(g), s = e.useContext(C), [n, r] = e.useState(null), d = e.useRef(null);
-  if (!t)
+  const f = e.useContext(b), d = e.useContext(w), [s, a] = e.useState(null), n = e.useRef(null);
+  if (!f)
     throw new Error("AccordionContent must be used within an Accordion");
   const {
-    openItems: a,
-    rootWidth: u
-  } = t, l = a[s], _ = e.useMemo(() => n === null ? 250 : y(n / 150 * 250, 350, 500), [n]);
+    openItems: l,
+    rootWidth: h
+  } = f, o = l[d], x = e.useMemo(() => s === null ? 250 : E(s / 150 * 250, 350, 500), [s]);
   return e.useEffect(() => {
-    r(null);
-  }, [u]), e.useEffect(() => {
-    if (n === null && d.current) {
-      const f = d.current.getBoundingClientRect().height;
-      r(f);
+    a(null);
+  }, [h]), e.useEffect(() => {
+    if (s === null && n.current) {
+      const u = n.current.getBoundingClientRect().height;
+      a(u);
     }
-  }, [n]), /* @__PURE__ */ c(
+  }, [s]), /* @__PURE__ */ c(
     "div",
     {
-      id: `${s}-content`,
+      id: `${d}-content`,
       role: "region",
-      "aria-labelledby": `${s}-header`,
-      className: w(o.content, {
-        [o.open]: l,
-        [o.closed]: !l
+      "aria-labelledby": `${d}-header`,
+      className: p(t.content, r, {
+        [t.open]: o,
+        [t.closed]: !o
       }),
       style: {
-        "--content-display": "inline-block",
-        "--content-height": I.q(100),
-        "--content-animation-time": `${_}ms`
+        "--content-display": m,
+        "--content-height": k.q(100),
+        "--content-animation-time": `${x}ms`
       },
       children: /* @__PURE__ */ c(
-        b,
+        I,
         {
           color: "secondary",
           size: "normal",
           typographic: !0,
-          className: o.contentText,
-          ref: d,
+          className: p(t.contentText, _),
+          ref: n,
           children: i
         }
       )
@@ -141,9 +148,9 @@ const T = "cfxui__Accordion__iconFlip__367de", k = "cfxui__Accordion__triggerCon
   );
 };
 export {
-  q as Accordion,
-  Q as AccordionContent,
-  G as AccordionHeader,
-  V as AccordionItem,
-  J as AccordionTrigger
+  X as Accordion,
+  ne as AccordionContent,
+  Z as AccordionHeader,
+  Y as AccordionItem,
+  ee as AccordionTrigger
 };

package/dist/components/Accordion/AccordionShowcase.js

@@ -1,107 +1,141 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import h from "react";
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+import l from "react";
 import a from "../Flex/Flex.js";
-import { Text as c } from "../Text/Text.js";
+import { Text as h } from "../Text/Text.js";
 import "../../utils/ui/ui.js";
-import { Accordion as l, AccordionItem as o, AccordionHeader as i, AccordionTrigger as n, AccordionContent as r } from "./Accordion.js";
-function s() {
-  return /* @__PURE__ */ e(a, { fullWidth: !0, vertical: !0, children: /* @__PURE__ */ t(a, { fullWidth: !0, vertical: !0, children: [
-    /* @__PURE__ */ e(c, { size: "large", children: "Accordion" }),
-    /* @__PURE__ */ t(l, { children: [
-      /* @__PURE__ */ t(o, { children: [
-        /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(
-          n,
-          {
-            text: "Will I get banned from GTA:O?",
-            iconLeft: "MoreInfo"
-          }
-        ) }),
-        /* @__PURE__ */ t(r, { children: [
-          "Nope!",
-          " ",
-          /* @__PURE__ */ e("a", { href: "https://cfx.re", children: "FiveM" }),
-          " ",
-          "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
+import { Accordion as s, AccordionItem as o, AccordionHeader as r, AccordionTrigger as i, AccordionContent as n } from "./Accordion.js";
+const u = "cfxui__AccordionShowcase__customTrigger__50550", d = "cfxui__AccordionShowcase__customTriggerIconRight__29b74", g = "cfxui__AccordionShowcase__customTriggerText__6f61c", m = "cfxui__AccordionShowcase__customContent__f7c2f", y = "cfxui__AccordionShowcase__customContentInner__f3d0e", c = {
+  customTrigger: u,
+  customTriggerIconRight: d,
+  customTriggerText: g,
+  customContent: m,
+  customContentInner: y
+};
+function v() {
+  return /* @__PURE__ */ e(a, { fullWidth: !0, vertical: !0, p: 2, gap: "large", children: [
+    /* @__PURE__ */ e(a, { fullWidth: !0, vertical: !0, children: [
+      /* @__PURE__ */ t(h, { size: "large", children: "Accordion" }),
+      /* @__PURE__ */ e(s, { children: [
+        /* @__PURE__ */ e(o, { children: [
+          /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(
+            i,
+            {
+              text: "Will I get banned from GTA:O?"
+            }
+          ) }),
+          /* @__PURE__ */ e(n, { children: [
+            "Nope!",
+            " ",
+            /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+            " ",
+            "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
+          ] })
+        ] }),
+        /* @__PURE__ */ e(o, { children: [
+          /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(
+            i,
+            {
+              text: "Can I cheat on FiveM?",
+              iconLeft: "Heart"
+            }
+          ) }),
+          /* @__PURE__ */ t(n, { children: "Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned!" })
+        ] }),
+        /* @__PURE__ */ e(o, { children: [
+          /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(
+            i,
+            {
+              text: "Is this accordion any good?",
+              iconLeft: "Pencil"
+            }
+          ) }),
+          /* @__PURE__ */ t(n, { children: "Obviously!" })
+        ] }),
+        /* @__PURE__ */ e(o, { children: [
+          /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(
+            i,
+            {
+              text: "Who said?"
+            }
+          ) }),
+          /* @__PURE__ */ t(n, { children: "Me!" })
+        ] }),
+        /* @__PURE__ */ e(o, { children: [
+          /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(
+            i,
+            {
+              text: "Long long text, Long long text, Long long text, Long long text, Long long text, Long long text to test the overflow, will it work? Let's see!",
+              iconLeft: "MoreInfo"
+            }
+          ) }),
+          /* @__PURE__ */ e(n, { children: [
+            "Nope!",
+            " ",
+            /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+            " ",
+            "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
+          ] })
+        ] }),
+        /* @__PURE__ */ e(o, { children: [
+          /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(
+            i,
+            {
+              text: "Long long text, Long long text, Long long text, Long long text, Long long text, Long long text to test the overflow, will it work? Let's see!"
+            }
+          ) }),
+          /* @__PURE__ */ e(n, { children: [
+            "Nope!",
+            " ",
+            /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+            " ",
+            "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope!",
+            " ",
+            /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+            " ",
+            "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope!",
+            " ",
+            /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+            " ",
+            "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope!",
+            " ",
+            /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+            " ",
+            "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
+          ] })
         ] })
-      ] }),
-      /* @__PURE__ */ t(o, { children: [
-        /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(
-          n,
-          {
-            text: "Can I cheat on FiveM?",
-            iconLeft: "MoreInfo"
-          }
-        ) }),
-        /* @__PURE__ */ e(r, { children: "Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned! Dont be a cheater, you will get banned!" })
-      ] }),
-      /* @__PURE__ */ t(o, { children: [
-        /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(
-          n,
-          {
-            text: "Is this accordion any good?",
-            iconLeft: "MoreInfo"
-          }
-        ) }),
-        /* @__PURE__ */ e(r, { children: "Obviously!" })
-      ] }),
-      /* @__PURE__ */ t(o, { children: [
-        /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(
-          n,
-          {
-            text: "Who said?",
-            iconLeft: "MoreInfo"
-          }
-        ) }),
-        /* @__PURE__ */ e(r, { children: "Me!" })
-      ] }),
-      /* @__PURE__ */ t(o, { children: [
-        /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(
-          n,
+      ] })
+    ] }),
+    /* @__PURE__ */ e(a, { fullWidth: !0, vertical: !0, gap: "large", children: [
+      /* @__PURE__ */ t(h, { size: "large", children: "Accordion with custom styles" }),
+      /* @__PURE__ */ t(s, { children: /* @__PURE__ */ e(o, { children: [
+        /* @__PURE__ */ t(
+          i,
           {
-            text: "Long long text, Long long text, Long long text, Long long text, Long long text, Long long text to test the overflow, will it work? Let's see!",
-            iconLeft: "MoreInfo"
+            text: "Will I get banned from GTA:O?",
+            className: c.customTrigger,
+            textClassName: c.customTriggerText,
+            iconRightClassName: c.customTriggerIconRight
           }
-        ) }),
-        /* @__PURE__ */ t(r, { children: [
-          "Nope!",
-          " ",
-          /* @__PURE__ */ e("a", { href: "https://cfx.re", children: "FiveM" }),
-          " ",
-          "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
-        ] })
-      ] }),
-      /* @__PURE__ */ t(o, { children: [
-        /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(
+        ),
+        /* @__PURE__ */ e(
           n,
           {
-            text: "Long long text, Long long text, Long long text, Long long text, Long long text, Long long text to test the overflow, will it work? Let's see!",
-            iconLeft: "MoreInfo"
+            className: c.customContent,
+            innerClassName: c.customContentInner,
+            children: [
+              "Nope!",
+              " ",
+              /* @__PURE__ */ t("a", { href: "https://cfx.re", children: "FiveM" }),
+              " ",
+              "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
+            ]
           }
-        ) }),
-        /* @__PURE__ */ t(r, { children: [
-          "Nope!",
-          " ",
-          /* @__PURE__ */ e("a", { href: "https://cfx.re", children: "FiveM" }),
-          " ",
-          "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope!",
-          " ",
-          /* @__PURE__ */ e("a", { href: "https://cfx.re", children: "FiveM" }),
-          " ",
-          "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope!",
-          " ",
-          /* @__PURE__ */ e("a", { href: "https://cfx.re", children: "FiveM" }),
-          " ",
-          "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope!",
-          " ",
-          /* @__PURE__ */ e("a", { href: "https://cfx.re", children: "FiveM" }),
-          " ",
-          "does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it. Nope! FiveM does not interact with the Rockstar Online Services other than to validate your game copy the first time you launch it."
-        ] })
-      ] })
+        )
+      ] }) })
     ] })
-  ] }) });
+  ] });
 }
-const p = h.memo(s);
+const R = l.memo(v);
 export {
-  p as default
+  R as default
 };

package/dist/components/Avatar/Avatar.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 
-export type AvatarSize = 'none' | 'small' | 'normal' | 'large' | 'xxxlarge';
+export type AvatarSize = 'none' | 'small' | 'normal' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge';
 export interface AvatarProps {
     url?: string | undefined | null;
     size?: AvatarSize;