@cfx-dev/ui-components 0.0.21 → 0.0.22

package/dist/components/Button/Button.d.ts

@@ -21,4 +21,6 @@ export interface ButtonProps {
     onMouseUp?: (event: React.MouseEvent<HTMLButtonElement>) => void;
     decorator?: React.ReactNode;
 }
+export declare function ButtonContent(props: Partial<ButtonProps>): React.ReactNode;
+export declare function getButtonClassName(props: Partial<ButtonProps>): string;
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/Button/Button.js

@@ -1,59 +1,105 @@
-import { jsxs as w, jsx as i } from "react/jsx-runtime";
-import B from "react";
-import { clsx as M } from "../../utils/clsx.js";
-import { noop as n } from "../../utils/functional.js";
-import { s as o } from "../../Button.module-Z6njvP9Z.js";
-const I = B.forwardRef(function(c, u) {
+import { jsx as c, jsxs as j, Fragment as w } from "react/jsx-runtime";
+import b from "react";
+import { clsx as z } from "../../utils/clsx.js";
+import { noop as p } from "../../utils/functional.js";
+import { s as t } from "../../Button.module-Z6njvP9Z.js";
+function F(a) {
   const {
-    text: t = null,
-    icon: e = null,
-    title: d = "",
-    type: f = "button",
-    className: m = "",
-    theme: p = "default",
-    size: h = "normal",
-    disabled: l = !1,
-    straightCorners: b = !1,
-    onClick: x = n,
-    onMouseDown: C = n,
-    onMouseUp: N = n,
-    autofocus: a = !1,
-    fullWidth: k = !1,
-    tabIndex: s,
-    decorator: r = null,
-    ariaLabel: y = ""
-  } = c, g = M(o.root, o[p], o[h], m, {
-    [o.disabled]: l,
-    [o.icon]: !!e && (t === null || typeof t > "u"),
-    [o.text]: !!t,
-    [o.autofocus]: a || typeof s < "u",
-    [o["straight-borders"]]: b,
-    [o.fullWidth]: k
+    text: e = null,
+    icon: l = null,
+    decorator: o = null
+  } = a;
+  return /* @__PURE__ */ j(w, { children: [
+    !!l && /* @__PURE__ */ c("span", { className: t["icon-node"], children: l }),
+    e,
+    !!o && /* @__PURE__ */ c("div", { className: t.decorator, children: o })
+  ] });
+}
+function I(a) {
+  const {
+    text: e = null,
+    icon: l = null,
+    theme: o = "default",
+    size: s = "normal",
+    disabled: f = !1,
+    straightCorners: d = !1,
+    className: r = "",
+    autofocus: u = !1,
+    fullWidth: i = !1,
+    tabIndex: n
+  } = a;
+  return z(t.root, t[o], t[s], r, {
+    [t.disabled]: f,
+    [t.icon]: !!l && (e === null || typeof e > "u"),
+    [t.text]: !!e,
+    [t.autofocus]: u || typeof n < "u",
+    [t["straight-borders"]]: d,
+    [t.fullWidth]: i
   });
-  return /* @__PURE__ */ w(
+}
+const U = b.forwardRef(function(e, l) {
+  const {
+    text: o = null,
+    icon: s = null,
+    title: f = "",
+    type: d = "button",
+    className: r = "",
+    theme: u = "default",
+    size: i = "normal",
+    disabled: n = !1,
+    straightCorners: x = !1,
+    onClick: C = p,
+    onMouseDown: g = p,
+    onMouseUp: k = p,
+    autofocus: m = !1,
+    fullWidth: N = !1,
+    tabIndex: h,
+    ariaLabel: B = ""
+  } = e, y = b.useMemo(() => I({
+    text: o,
+    icon: s,
+    theme: u,
+    size: i,
+    disabled: n,
+    straightCorners: x,
+    className: r,
+    autofocus: m,
+    fullWidth: N,
+    tabIndex: h
+  }), [
+    m,
+    r,
+    n,
+    N,
+    s,
+    i,
+    x,
+    h,
+    o,
+    u
+  ]), M = b.useCallback((W) => {
+    n || C(W);
+  }, [n, C]);
+  return /* @__PURE__ */ c(
     "button",
     {
-      ref: u,
-      disabled: l,
-      className: g,
-      onClick: (j) => {
-        l || x(j);
-      },
-      onMouseDown: C,
-      onMouseUp: N,
-      autoFocus: a,
-      tabIndex: s,
-      title: d,
-      type: f,
-      "aria-label": y,
-      children: [
-        !!e && /* @__PURE__ */ i("span", { className: o["icon-node"], children: e }),
-        t,
-        !!r && /* @__PURE__ */ i("div", { className: o.decorator, children: r })
-      ]
+      ref: l,
+      disabled: n,
+      className: y,
+      onClick: M,
+      onMouseDown: g,
+      onMouseUp: k,
+      autoFocus: m,
+      tabIndex: h,
+      title: f,
+      type: d,
+      "aria-label": B,
+      children: /* @__PURE__ */ c(F, { ...e })
     }
   );
 });
 export {
-  I as Button
+  U as Button,
+  F as ButtonContent,
+  I as getButtonClassName
 };

package/dist/components/Button/LinkButton.d.ts

@@ -1,19 +1,11 @@
 import { default as React } from 'react';
-import { ButtonSize, ButtonTheme } from './Button';
+import { ButtonProps } from './Button';
 
-export interface LinkButtonProps {
+export interface LinkButtonProps extends Omit<ButtonProps, 'autofocus' | 'onCLick' | 'onMouseDown' | 'onMouseUp' | 'ariaLabel'> {
     to: string;
-    text?: React.ReactNode;
-    title?: string;
-    icon?: React.ReactNode;
-    theme?: ButtonTheme;
-    size?: ButtonSize;
-    disabled?: boolean;
+    isHrefProp?: boolean;
     onClick?(): void;
-    tabIndex?: number;
-    className?: string;
     target?: string;
     Component?: React.ElementType;
-    decorator?: React.ReactNode;
 }
 export declare const LinkButton: React.ForwardRefExoticComponent<LinkButtonProps & React.RefAttributes<HTMLAnchorElement>>;

package/dist/components/Button/LinkButton.js

@@ -1,48 +1,33 @@
-import { jsxs as R, jsx as l } from "react/jsx-runtime";
-import a from "react";
-import { clsx as j } from "../../utils/clsx.js";
-import { noop as B } from "../../utils/functional.js";
-import { isExternalUrl as E } from "../../utils/links.js";
-import { s as o } from "../../Button.module-Z6njvP9Z.js";
-const P = a.forwardRef(function(i, c) {
+import { jsx as i } from "react/jsx-runtime";
+import n from "react";
+import { noop as k } from "../../utils/functional.js";
+import { isExternalUrl as d } from "../../utils/links.js";
+import { getButtonClassName as x, ButtonContent as B } from "./Button.js";
+const M = n.forwardRef(function(t, a) {
   const {
-    to: e,
-    text: t = null,
-    icon: n = null,
+    to: o,
     title: m = "",
-    className: d = "",
-    theme: f = "default",
-    size: p = "normal",
-    disabled: u = !1,
-    tabIndex: x,
-    target: k = "",
-    onClick: C = B,
-    decorator: s = null,
-    Component: h
-  } = i, N = j(o.root, o[f], o[p], d, {
-    [o.disabled]: u,
-    [o.icon]: !!n && !t,
-    [o.text]: !!t
-  }), r = E(e), b = r ? "a" : h || "a", L = a.useMemo(() => r ? { href: e } : { to: e }, [e, r]);
-  return /* @__PURE__ */ R(
-    b,
+    tabIndex: s,
+    target: f = "",
+    onClick: l = k,
+    isHrefProp: r = !1,
+    Component: c
+  } = t, u = n.useMemo(() => x(t), [t]), e = d(o), C = e ? "a" : c || "a", p = n.useMemo(() => e || r ? { href: o } : { to: o }, [o, e, r]);
+  return /* @__PURE__ */ i(
+    C,
     {
-      ref: c,
-      className: N,
-      tabIndex: x,
+      ref: a,
+      className: u,
+      tabIndex: s,
       title: m,
-      target: k,
+      target: f,
       rel: "noopener noreferrer",
-      onClickCapture: C,
-      ...L,
-      children: [
-        !!n && /* @__PURE__ */ l("span", { className: o["icon-node"], children: n }),
-        t,
-        !!s && /* @__PURE__ */ l("div", { className: o.decorator, children: s })
-      ]
+      onClickCapture: l,
+      ...p,
+      children: /* @__PURE__ */ i(B, { ...t })
     }
   );
 });
 export {
-  P as LinkButton
+  M as LinkButton
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cfx-dev/ui-components",
   "private": false,
-  "version": "0.0.21",
+  "version": "0.0.22",
   "type": "module",
   "license": "MIT",
   "main": "dist/main.js",