triafly-ui-kit 1.0.79 → 1.0.80

package/dist/assets/src/components/Ui/ButtonsArray/ButtonsArray.css

@@ -1 +1 @@
-.buttons .buttons-bar{display:flex}.buttons .buttons-label{margin:0 0 8px;display:flex}.buttons .button{height:44px;padding:0 12px;display:flex;justify-content:center;align-items:center;border:1px solid var(--color-border-primary-default);background-color:var(--color-bg-neutral-basic-default);cursor:pointer}.buttons .button:not(:last-of-type){border-right:0 solid}.buttons .button:first-of-type{border-radius:8px 0 0 8px}.buttons .button:last-of-type{border-radius:0 8px 8px 0}.buttons .button:not(:disabled):hover{background:#ddd}.buttons .button:disabled{cursor:not-allowed;opacity:.6}.buttons .button.active{background:var(--color-bg-neutral-light-default);font-weight:600}.buttons .button.status-error{color:var(--color-status-error-foreground)}.buttons .button.status-warning{color:var(--color-status-warning-foreground)}.buttons .button.status-success{color:var(--color-status-success-foreground)}
+.buttons .buttons-bar{display:flex}.buttons .buttons-label{margin:0 0 8px;display:flex}.buttons .button{height:44px;padding:0 12px;display:flex;justify-content:center;align-items:center;border:1px solid var(--color-border-primary-default);background-color:var(--color-bg-neutral-basic-default);cursor:pointer}.buttons .button:not(:last-of-type){border-right:0 solid}.buttons .button:first-of-type{border-radius:8px 0 0 8px}.buttons .button:last-of-type{border-radius:0 8px 8px 0}.buttons .button.invalid{border:1px solid var(--color-border-error-default)}.buttons .button.invalid .helper-text{color:var(--color-border-error-default)}.buttons .button:not(:disabled):hover{background:#ddd}.buttons .button:disabled{cursor:not-allowed;opacity:.6}.buttons .helper-text{font-size:12px;color:var(--color-text-secondary-default);margin:8px 0 0}.buttons .button.active{background:var(--color-bg-neutral-light-default);font-weight:600}.buttons .button.status-error{color:var(--color-status-error-foreground)}.buttons .button.status-warning{color:var(--color-status-warning-foreground)}.buttons .button.status-success{color:var(--color-status-success-foreground)}

package/dist/components/Ui/ButtonsArray/ButtonsArray.js

@@ -1,31 +1,32 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
-import { forwardRef as f, useState as p, useEffect as k } from "react";
+import { jsxs as f, jsx as n } from "react/jsx-runtime";
+import { forwardRef as h, useState as k, useEffect as N } from "react";
 import '../../../assets/src/components/Ui/ButtonsArray/ButtonsArray.css';/* empty css                                                        */
-const h = f(
-  ({ tabs: e, label: o, onChange: a, activeKey: t, isDisabled: i }, u) => {
-    const [c, l] = p(t ?? e[0].key);
-    k(() => {
-      t != null ? l(t) : l(e[0].key);
-    }, [t]);
-    const d = (s, r) => {
-      s.stopPropagation(), s.preventDefault(), l(r), a && a(r);
+const y = h(
+  ({ tabs: s, label: a, onChange: o, activeKey: e, isDisabled: i, errorMessage: u, hasError: c }, d) => {
+    const [m, r] = k(e ?? s[0].key);
+    N(() => {
+      e != null ? r(e) : r(s[0].key);
+    }, [e]);
+    const p = (t, l) => {
+      t.stopPropagation(), t.preventDefault(), r(l), o && o(l);
     };
-    return e.length === 0 ? null : /* @__PURE__ */ m("div", { className: "buttons", ref: u, children: [
-      o && /* @__PURE__ */ n("span", { className: "buttons-label", children: o }),
-      /* @__PURE__ */ n("div", { className: "buttons-bar", children: e.map((s) => /* @__PURE__ */ n(
+    return s.length === 0 ? null : /* @__PURE__ */ f("div", { className: `buttons ${c && "invalid"}`, ref: d, children: [
+      a && /* @__PURE__ */ n("span", { className: "buttons-label", children: a }),
+      /* @__PURE__ */ n("div", { className: "buttons-bar", children: s.map((t) => /* @__PURE__ */ n(
         "button",
         {
-          disabled: i || s.disabled,
-          onClick: (r) => d(r, s.key),
-          className: `button ${s.key === c ? "active" : ""} status-${s.status}`,
-          children: s.label
+          disabled: i || t.disabled,
+          onClick: (l) => p(l, t.key),
+          className: `button ${t.key === m ? "active" : ""} status-${t.status}`,
+          children: t.label
         },
-        s.key
-      )) })
+        t.key
+      )) }),
+      u && /* @__PURE__ */ n("span", { className: "helper-text", children: u })
     ] });
   }
 );
-h.displayName = "ButtonsArray";
+y.displayName = "ButtonsArray";
 export {
-  h as ButtonsArray
+  y as ButtonsArray
 };

package/dist/main.d.ts

@@ -82,6 +82,8 @@ export declare interface ButtonsArrayProps {
     onChange?: (key: string | number) => void;
     activeKey?: string | number | null | undefined;
     isDisabled?: boolean;
+    errorMessage?: string;
+    hasError?: boolean;
 }
 
 declare interface ButtonTab {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "triafly-ui-kit",
-  "version": "1.0.79",
+  "version": "1.0.80",
   "description": "UI Kit from Triafly",
   "main": "./dist/main.js",
   "module": "./dist/main.js",