@lanaco/lnc-react-ui 4.0.199 → 4.0.201

package/dist/TabItem.js

@@ -1,50 +1,49 @@
-import { jsx as j } from "react/jsx-runtime";
-import { forwardRef as D, useState as H } from "react";
-import { P as t } from "./index-CblbdqjE.js";
-import { s as I } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { h as A, c as F, b as i, a as o } from "./utils-DtEfC-TX.js";
-import { u as K } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import { u as h } from "./useUpdateEffect-CuYWz7EA.js";
-const S = (e) => e == "small" ? "3.125rem" : e == "medium" ? "3.375rem" : "3.625rem", V = I.div`
+import { jsx as O } from "react/jsx-runtime";
+import { forwardRef as W, useState as j } from "react";
+import { s as A } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { h as D, c as P, b as l, a as n } from "./utils-DtEfC-TX.js";
+import { u as S } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { u as f } from "./useUpdateEffect-CuYWz7EA.js";
+const V = (e) => e == "small" ? "3.125rem" : e == "medium" ? "3.375rem" : "3.625rem", E = A.div`
   box-sizing: border-box;
-  ${(e) => e.disabled === !0 && A(e.theme)};
+  ${(e) => e.disabled === !0 && D(e.theme)};
   min-width: 5.25rem;
   ${(e) => e.fullWidth && "width: 100%"};
   display: flex;
   justify-content: center;
   align-items: center;
 
-  height: ${(e) => S(e.size)};
-  ${(e) => F(
+  height: ${(e) => V(e.size)};
+  ${(e) => P(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.size,
   "enabled"
 )};
   ${(e) => !e.disabled && "cursor: pointer"};
-  color: ${(e) => !e.disabled && i(
+  color: ${(e) => !e.disabled && l(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.color,
   e.active ? "active" : "enabled",
   "text"
 )};
-  background-color: ${(e) => e.type == "regular" || e.type == "pill" && (e.disabled == !0 || e.active == !1) ? "transparent" : !e.disabled && i(
+  background-color: ${(e) => e.type == "regular" || e.type == "pill" && (e.disabled == !0 || e.active == !1) ? "transparent" : !e.disabled && l(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.color,
   e.active ? "active" : "enabled",
   "background",
   "backgroundOpacity"
 )};
-  ${(e) => e.type == "underline" && e.last == !1 && "border-right: 1px solid " + i(
+  ${(e) => e.type == "underline" && e.last == !1 && "border-right: 1px solid " + l(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.color,
   "enabled",
   "line"
 )};
-  ${(e) => y(
+  ${(e) => h(
   e.theme,
   e.type,
   e.active,
@@ -52,24 +51,24 @@ const S = (e) => e == "small" ? "3.125rem" : e == "medium" ? "3.375rem" : "3.625
   e.color,
   "enabled"
 )};
-  ${(e) => E(e.theme, e.type, e.first, e.last)};
+  ${(e) => F(e.theme, e.type, e.first, e.last)};
   &:hover {
-    color: ${(e) => !e.disabled && i(
+    color: ${(e) => !e.disabled && l(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.color,
   "hover",
   "text"
 )};
-    background-color: ${(e) => e.type == "regular" ? "transparent" : !e.disabled && i(
+    background-color: ${(e) => e.type == "regular" ? "transparent" : !e.disabled && l(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.color,
   "hover",
   "background",
   "backgroundOpacity"
 )};
-    ${(e) => y(
+    ${(e) => h(
   e.theme,
   e.type,
   e.active,
@@ -79,132 +78,98 @@ const S = (e) => e == "small" ? "3.125rem" : e == "medium" ? "3.375rem" : "3.625
 )};
   }
   &:active {
-    background: ${(e) => i(
+    background: ${(e) => l(
   e.theme,
-  a(e.type),
+  r(e.type),
   e.color,
   "active",
   "background",
   "backgroundOpacity"
 )};
   }
-`, a = (e) => e == "underline" ? "TabUnderline" : e == "pill" ? "TabPill" : "TabRegular", E = (e, r, n, l) => {
-  if (r == "pill")
-    return `border-radius: ${o(e, "regular")}`;
-  if (r == "underline" && n)
-    return `border-radius: ${o(
+`, r = (e) => e == "underline" ? "TabUnderline" : e == "pill" ? "TabPill" : "TabRegular", F = (e, t, i, a) => {
+  if (t == "pill")
+    return `border-radius: ${n(e, "regular")}`;
+  if (t == "underline" && i)
+    return `border-radius: ${n(
       e,
       "regular"
-    )} 0  0 ${o(e, "regular")}`;
-  if (r == "underline" && l)
-    return `border-radius: 0 ${o(
+    )} 0  0 ${n(e, "regular")}`;
+  if (t == "underline" && a)
+    return `border-radius: 0 ${n(
       e,
       "regular"
-    )} ${o(e, "regular")} 0`;
-}, y = (e, r, n, l, u, c) => {
-  if (r != "pill")
-    return `border-bottom: ${!l && (n || c == "hover") ? e.components[r === "regular" ? "TabRegular" : "TabUnderline"].default.enabled.lineHeight + "" : e.components[r === "regular" ? "TabRegular" : "TabUnderline"].default.hover.lineHeight + ""} solid ${i(
+    )} ${n(e, "regular")} 0`;
+}, h = (e, t, i, a, u, d) => {
+  if (t != "pill")
+    return `border-bottom: ${!a && (i || d == "hover") ? e.components[t === "regular" ? "TabRegular" : "TabUnderline"].default.enabled.lineHeight + "" : e.components[t === "regular" ? "TabRegular" : "TabUnderline"].default.hover.lineHeight + ""} solid ${l(
       e,
-      a(r),
+      r(t),
       u,
-      n && !l ? "active" : l ? "enabled" : c,
+      i && !a ? "active" : a ? "enabled" : d,
       "line"
     )}`;
-}, L = D((e, r) => {
+}, Q = W((e, t) => {
   const {
-    type: n = "underline",
-    disabled: l,
+    type: i = "underline",
+    disabled: a,
     first: u = !1,
-    last: c = !1,
+    last: d = !1,
     fullWidth: v = !1,
-    active: d = !1,
-    activeIndex: s,
+    active: c = !1,
+    activeIndex: o,
     index: b,
     //----------------
-    onFocus: $ = () => {
+    onFocus: y = () => {
     },
-    onBlur: k = () => {
+    onBlur: $ = () => {
     },
-    onClick: m = () => {
+    onClick: s = () => {
     },
-    onKeyDown: T = () => {
+    onKeyDown: k = () => {
     },
-    itemClick: f = () => {
+    itemClick: m = () => {
     },
     //----------------
-    size: x = "small",
-    color: C = "primary",
-    className: R = "",
-    style: w = {},
-    children: O,
-    ...B
-  } = e, U = K(), [z, g] = H(d), N = {
-    theme: U,
-    color: C,
-    size: x,
-    style: w,
-    className: "lnc-ui-tabitem " + R
-  }, P = (W) => {
-    f && !l && f(b), m && !l && m(W);
+    size: T = "small",
+    color: x = "primary",
+    className: C = "",
+    style: R = {},
+    children: U,
+    ...w
+  } = e, B = S(), [z, g] = j(c), H = {
+    theme: B,
+    color: x,
+    size: T,
+    style: R,
+    className: "lnc-ui-tabitem " + C
+  }, I = (N) => {
+    m && !a && m(b), s && !a && s(N);
   };
-  return h(() => {
-    g(d);
-  }, [d]), h(() => {
-    g(s == b);
-  }, [s]), /* @__PURE__ */ j(
-    V,
+  return f(() => {
+    g(c);
+  }, [c]), f(() => {
+    g(o == b);
+  }, [o]), /* @__PURE__ */ O(
+    E,
     {
-      ref: r,
-      onFocus: $,
-      onBlur: k,
-      onClick: P,
-      onKeyDown: T,
-      disabled: l,
-      type: n,
+      ref: t,
+      onFocus: y,
+      onBlur: $,
+      onClick: I,
+      onKeyDown: k,
+      disabled: a,
+      type: i,
       first: u,
-      last: c,
+      last: d,
       fullWidth: v,
       active: z,
-      ...N,
-      ...B,
-      children: O
+      ...H,
+      ...w,
+      children: U
     }
   );
 });
-L.propTypes = {
-  type: t.oneOf(["regular", "pill", "underline"]),
-  /**
-   * Is it first Tab Item in Tab Wrapper
-   * }
-   */
-  first: t.bool,
-  /**
-   * Is it last Tab Item in Tab Wrapper
-   * }
-   */
-  last: t.bool,
-  fullWidth: t.bool,
-  active: t.bool,
-  //---------------------------------------------------------------
-  onClick: t.func,
-  onBlur: t.func,
-  onFocus: t.func,
-  onKeyDown: t.func,
-  //---------------------------------------------------------------
-  className: t.string,
-  style: t.object,
-  color: t.oneOf([
-    "primary",
-    "secondary",
-    "success",
-    "warning",
-    "danger",
-    "information",
-    "neutral",
-    "gray"
-  ]),
-  size: t.oneOf(["small", "medium", "large"])
-};
 export {
-  L as default
+  Q as default
 };