@lanaco/lnc-react-ui 4.0.198 → 4.0.200

package/dist/Button.js

@@ -1,12 +1,11 @@
-import { jsx as c, jsxs as W, Fragment as E } from "react/jsx-runtime";
-import { forwardRef as q } from "react";
-import { P as n } from "./index-CblbdqjE.js";
-import { i as T } from "./index-6RFrSPs_.js";
-import { s as u } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { c as O, b as t, d as r, h as z, e as I, a as A } from "./utils-DtEfC-TX.js";
-import w from "./Icon.js";
-import { u as G } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const x = {
+import { jsx as a, jsxs as W, Fragment as E } from "react/jsx-runtime";
+import { forwardRef as K } from "react";
+import { i as x } from "./index-6RFrSPs_.js";
+import { s as r } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { c as T, b as t, d, h as z, e as v, a as q } from "./utils-DtEfC-TX.js";
+import j from "./Icon.js";
+import { u as A } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+const y = {
   small: {
     regular: "1rem",
     icon: "0.75rem",
@@ -22,7 +21,7 @@ const x = {
     icon: "1rem",
     justIcon: "0.5rem"
   }
-}, v = (e) => `
+}, O = (e) => `
         outline: none;
         display: inline-flex;
         flex-direction: row;
@@ -33,21 +32,21 @@ const x = {
         cursor: pointer;
         color: ${!e.disabled && "white"};
 
-        border-radius: ${A(
+        border-radius: ${q(
   e.theme,
   e.borderRadius
 )};
         
-        padding-left: ${e.hasLeadingIcon ? x[e.size].icon : x[e.size].regular};
-        padding-right: ${e.hasTrailingIcon ? x[e.size].icon : x[e.size].regular};
-    `, H = u.span`
+        padding-left: ${e.hasLeadingIcon ? y[e.size].icon : y[e.size].regular};
+        padding-right: ${e.hasTrailingIcon ? y[e.size].icon : y[e.size].regular};
+    `, G = r.span`
   padding-right: ${(e) => e.size === "small" ? "0.25rem" : "0.5rem"};
-`, J = u.span`
+`, H = r.span`
   padding-left: ${(e) => e.size === "small" ? "0.25rem" : "0.5rem"};
-`, R = u.button`
-  ${(e) => v(e)}
+`, R = r.button`
+  ${(e) => O(e)}
 
-  ${(e) => O(
+  ${(e) => T(
   e.theme,
   "ButtonFilled",
   e.size,
@@ -69,8 +68,8 @@ const x = {
   "text"
 )};
 
-  min-height: ${(e) => r(e.theme, e.size)};
-  max-height: ${(e) => r(e.theme, e.size)};
+  min-height: ${(e) => d(e.theme, e.size)};
+  max-height: ${(e) => d(e.theme, e.size)};
 
   &:disabled {
     ${(e) => e.disabled === !0 && z(e.theme)};
@@ -126,7 +125,7 @@ const x = {
   "focus",
   "text"
 )};
-    ${(e) => !e.disabled && I(e.theme)};
+    ${(e) => !e.disabled && v(e.theme)};
   }
 
   &:active {
@@ -146,12 +145,12 @@ const x = {
   "text"
 )};
   }
-`, M = u.button`
-  ${(e) => v(e)}
+`, J = r.button`
+  ${(e) => O(e)}
 
-  min-height: ${(e) => r(e.theme, e.size)};
-  max-height: ${(e) => r(e.theme, e.size)};
-  ${(e) => O(
+  min-height: ${(e) => d(e.theme, e.size)};
+  max-height: ${(e) => d(e.theme, e.size)};
+  ${(e) => T(
   e.theme,
   "ButtonTinted",
   e.size,
@@ -212,7 +211,7 @@ const x = {
   "focus",
   "text"
 )};
-    ${(e) => e.disabled === !1 && I(e.theme)};
+    ${(e) => e.disabled === !1 && v(e.theme)};
   }
 
   &:active {
@@ -254,10 +253,10 @@ const x = {
   "backgroundOpacity"
 )};
   }
-`, L = u.button`
-  ${(e) => v(e)}
+`, w = r.button`
+  ${(e) => O(e)}
 
-  ${(e) => O(
+  ${(e) => T(
   e.theme,
   "ButtonTinted",
   e.size,
@@ -281,8 +280,8 @@ const x = {
   "backgroundOpacity"
 )};
 
-  min-height: ${(e) => r(e.theme, e.size)};
-  max-height: ${(e) => r(e.theme, e.size)};
+  min-height: ${(e) => d(e.theme, e.size)};
+  max-height: ${(e) => d(e.theme, e.size)};
 
   &:hover {
     background-color: ${(e) => t(
@@ -320,7 +319,7 @@ const x = {
   "text"
 )};
 
-    ${(e) => !e.disabled && I(e.theme)};
+    ${(e) => !e.disabled && v(e.theme)};
   }
 
   &:active {
@@ -353,7 +352,7 @@ const x = {
   "backgroundOpacity"
 )};
   }
-`, Q = u(L)`
+`, M = r(w)`
   border: 1px solid
     ${(e) => t(
   e.theme,
@@ -363,197 +362,151 @@ const x = {
   "border",
   "borderOpacity"
 )};
-`, X = q((e, s) => {
+`, te = K((e, u) => {
   const {
-    text: F = "",
-    iconStyle: C = "solid",
+    text: I = "",
+    iconStyle: F = "solid",
     leadingIcon: N = null,
-    trailingIcon: j = null,
-    borderRadius: S = "regular",
-    btnType: a = "filled",
-    disabled: U = !1,
-    tabIndex: b = 0,
+    trailingIcon: C = null,
+    borderRadius: U = "regular",
+    btnType: n = "filled",
+    disabled: L = !1,
+    tabIndex: s = 0,
     //----------------
-    onFocus: m,
-    onBlur: g,
-    onClick: h,
-    onKeyDown: $,
-    onLeadingIconClick: Y,
-    onTrailingIconClick: Z,
+    onFocus: b,
+    onBlur: m,
+    onClick: g,
+    onKeyDown: h,
     //----------------
-    size: y = "small",
-    color: l = "primary",
-    className: f = "",
-    style: D = {},
+    size: f = "small",
+    color: c = "primary",
+    className: $ = "",
+    style: S = {},
     children: V,
     ...B
   } = e, o = {
-    theme: G(),
-    color: l,
-    size: y,
-    style: D,
-    disabled: U,
-    borderRadius: S,
-    btnType: a,
+    theme: A(),
+    color: c,
+    size: f,
+    style: S,
+    disabled: L,
+    borderRadius: U,
+    btnType: n,
     className: "lnc-ui-button "
-  }, i = !T(N), d = !T(j), K = !T(F), k = () => /* @__PURE__ */ W(E, { children: [
-    i && /* @__PURE__ */ c(H, { size: y, children: /* @__PURE__ */ c(
-      w,
+  }, l = !x(N), i = !x(C), D = !x(I), k = () => /* @__PURE__ */ W(E, { children: [
+    l && /* @__PURE__ */ a(G, { size: f, children: /* @__PURE__ */ a(
+      j,
       {
         icon: N,
         sizeInUnits: "1.125rem",
-        iconStyle: C
+        iconStyle: F
       }
     ) }),
-    F,
+    I,
     V,
-    d && /* @__PURE__ */ c(J, { size: y, children: /* @__PURE__ */ c(
-      w,
+    i && /* @__PURE__ */ a(H, { size: f, children: /* @__PURE__ */ a(
+      j,
       {
-        icon: j,
+        icon: C,
         sizeInUnits: "1.125rem",
-        iconStyle: C
+        iconStyle: F
       }
     ) })
   ] });
-  return a === "filled" ? /* @__PURE__ */ c(
+  return n === "filled" ? /* @__PURE__ */ a(
     R,
     {
-      ref: s,
+      ref: u,
       "data-type": "filled",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${l}-${a}-lnc-btn ${f}`,
-      hasLeadingIcon: i,
-      hasTrailingIcon: d,
-      onFocus: m,
-      onBlur: g,
-      onClick: h,
-      onKeyDown: $,
-      tabIndex: b,
-      btnType: a,
+      className: `${o == null ? void 0 : o.className} ${c}-${n}-lnc-btn ${$}`,
+      hasLeadingIcon: l,
+      hasTrailingIcon: i,
+      onFocus: b,
+      onBlur: m,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
+      btnType: n,
       ...B,
       children: k()
     }
-  ) : a === "tinted" ? /* @__PURE__ */ c(
-    M,
+  ) : n === "tinted" ? /* @__PURE__ */ a(
+    J,
     {
-      ref: s,
+      ref: u,
       "data-type": "tinted",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${l}-${a}-lnc-btn ${f}`,
-      hasLeadingIcon: i,
-      hasTrailingIcon: d,
-      onFocus: m,
-      onBlur: g,
-      onClick: h,
-      onKeyDown: $,
-      tabIndex: b,
-      btnType: a,
+      className: `${o == null ? void 0 : o.className} ${c}-${n}-lnc-btn ${$}`,
+      hasLeadingIcon: l,
+      hasTrailingIcon: i,
+      onFocus: b,
+      onBlur: m,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
+      btnType: n,
       ...B,
       children: k()
     }
-  ) : a === "outline" ? /* @__PURE__ */ c(
-    Q,
+  ) : n === "outline" ? /* @__PURE__ */ a(
+    M,
     {
-      ref: s,
+      ref: u,
       "data-type": "outline",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${l}-${a}-lnc-btn ${f}`,
-      hasLeadingIcon: i,
-      hasTrailingIcon: d,
-      onFocus: m,
-      onBlur: g,
-      onClick: h,
-      onKeyDown: $,
-      tabIndex: b,
-      btnType: a,
+      className: `${o == null ? void 0 : o.className} ${c}-${n}-lnc-btn ${$}`,
+      hasLeadingIcon: l,
+      hasTrailingIcon: i,
+      onFocus: b,
+      onBlur: m,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
+      btnType: n,
       ...B,
       children: k()
     }
-  ) : a === "basic" ? /* @__PURE__ */ c(
-    L,
+  ) : n === "basic" ? /* @__PURE__ */ a(
+    w,
     {
-      ref: s,
+      ref: u,
       "data-type": "basic",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${l}-${a}-lnc-btn ${f}`,
-      hasLeadingIcon: i,
-      hasTrailingIcon: d,
-      onFocus: m,
-      onBlur: g,
-      onClick: h,
-      onKeyDown: $,
-      tabIndex: b,
-      btnType: a,
+      className: `${o == null ? void 0 : o.className} ${c}-${n}-lnc-btn ${$}`,
+      hasLeadingIcon: l,
+      hasTrailingIcon: i,
+      onFocus: b,
+      onBlur: m,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
+      btnType: n,
       ...B,
       children: k()
     }
-  ) : /* @__PURE__ */ c(
+  ) : /* @__PURE__ */ a(
     R,
     {
-      ref: s,
+      ref: u,
       "data-type": "filled",
-      size: y,
+      size: f,
       ...o,
-      className: `${o == null ? void 0 : o.className} ${l}-${a}-lnc-btn ${f}`,
-      hasLeadingIcon: i,
-      hasTrailingIcon: d,
-      onFocus: m,
-      onBlur: g,
-      onClick: h,
-      onKeyDown: $,
-      hasText: K,
-      tabIndex: b,
-      btnType: a,
+      className: `${o == null ? void 0 : o.className} ${c}-${n}-lnc-btn ${$}`,
+      hasLeadingIcon: l,
+      hasTrailingIcon: i,
+      onFocus: b,
+      onBlur: m,
+      onClick: g,
+      onKeyDown: h,
+      hasText: D,
+      tabIndex: s,
+      btnType: n,
       ...B,
       children: k()
     }
   );
 });
-X.propTypes = {
-  text: n.string,
-  iconStyle: n.oneOf(["regular", "solid"]),
-  /**
-   * Icon before the text
-   */
-  leadingIcon: n.string,
-  /**
-   * Icon after the text
-   */
-  trailingIcon: n.string,
-  borderRadius: n.oneOf([
-    "slight",
-    "regular",
-    "edged",
-    "curved",
-    "none"
-  ]),
-  /**
-   * Different styles
-   */
-  btnType: n.oneOf(["filled", "tinted", "outline", "basic"]),
-  disabled: n.bool,
-  tabIndex: n.number,
-  //---------------------------------------------------------------
-  onBlur: n.func,
-  onFocus: n.func,
-  onClick: n.func,
-  onKeyDown: n.func,
-  //---------------------------------------------------------------
-  className: n.string,
-  style: n.object,
-  color: n.oneOf([
-    "primary",
-    "secondary",
-    "success",
-    "warning",
-    "danger",
-    "information",
-    "neutral",
-    "gray"
-  ]),
-  size: n.oneOf(["small", "medium", "large"])
-};
 export {
-  X as default
+  te as default
 };

package/dist/ButtonGroup.cjs

@@ -1,4 +1,4 @@
-"use strict";const i=require("react/jsx-runtime"),a=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./index-BpbMKBf_.cjs"),o=require("./utils-RnrgDDZP.cjs"),b=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),s=a.styled.div`
+"use strict";const u=require("react/jsx-runtime"),l=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-RnrgDDZP.cjs"),b=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),a=l.styled.div`
   display: inline-flex;
   flex-wrap: wrap;
   width: fit-content;
@@ -6,9 +6,9 @@
 
   & button {
     border: none;
-    border-top: ${e=>"0.0625rem solid "+o.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
+    border-top: ${e=>"0.0625rem solid "+t.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
 
-    border-bottom: ${e=>"0.0625rem  solid "+o.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
+    border-bottom: ${e=>"0.0625rem  solid "+t.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
   }
 
   & button:focus {
@@ -26,19 +26,19 @@
 
   & button:first-of-type {
     border-radius: ${e=>`${e.borderRadius} 0 0 ${e.borderRadius}`};
-    border-left: ${e=>"0.0625rem solid "+o.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
+    border-left: ${e=>"0.0625rem solid "+t.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
   }
 
   & button:last-of-type {
     border-radius: ${e=>`0 ${e.borderRadius} ${e.borderRadius} 0`};
-    border-right: ${e=>"0.0625rem solid "+o.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
+    border-right: ${e=>"0.0625rem solid "+t.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
   }
 
   & button:first-of-type:not([data-type="filled"]) {
-    border-right: ${e=>"0.0625rem solid "+o.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
+    border-right: ${e=>"0.0625rem solid "+t.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
   }
 
   & button:not(:first-of-type):not(:last-of-type):not([data-type="filled"]) {
-    border-right: ${e=>"0.0625rem solid "+o.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
+    border-right: ${e=>"0.0625rem solid "+t.getColorRgbaValue(e.theme,"ButtonGroup",e.color,"enabled","border")};
   }
-`,d=({children:e,borderRadius:n="regular",style:u={},className:l=""})=>{const r=b.useTheme();return i.jsx(s,{borderRadius:o.getBorderRadiusValueWithUnits(r,n),theme:r,style:u,className:"lnc-ui-button-group "+l,children:e})};d.propTypes={borderRadius:t.PropTypes.oneOf(["slight","regular","edged","curved","none"]),className:t.PropTypes.string,style:t.PropTypes.object};module.exports=d;
+`,i=({children:e,borderRadius:r="regular",style:d={},className:n=""})=>{const o=b.useTheme();return u.jsx(a,{borderRadius:t.getBorderRadiusValueWithUnits(o,r),theme:o,style:d,className:"lnc-ui-button-group "+n,children:e})};module.exports=i;

package/dist/ButtonGroup.js

@@ -1,28 +1,27 @@
 import { jsx as u } from "react/jsx-runtime";
-import { s as i } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { P as t } from "./index-CblbdqjE.js";
+import { s as a } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { b as o, a as b } from "./utils-DtEfC-TX.js";
-import { u as l } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const s = i.div`
+import { u as i } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+const l = a.div`
   display: inline-flex;
   flex-wrap: wrap;
   width: fit-content;
-  border-radius: ${(e) => e.borderRadius};
+  border-radius: ${(t) => t.borderRadius};
 
   & button {
     border: none;
-    border-top: ${(e) => "0.0625rem solid " + o(
-  e.theme,
+    border-top: ${(t) => "0.0625rem solid " + o(
+  t.theme,
   "ButtonGroup",
-  e.color,
+  t.color,
   "enabled",
   "border"
 )};
 
-    border-bottom: ${(e) => "0.0625rem  solid " + o(
-  e.theme,
+    border-bottom: ${(t) => "0.0625rem  solid " + o(
+  t.theme,
   "ButtonGroup",
-  e.color,
+  t.color,
   "enabled",
   "border"
 )};
@@ -42,75 +41,64 @@ const s = i.div`
   }
 
   & button:first-of-type {
-    border-radius: ${(e) => `${e.borderRadius} 0 0 ${e.borderRadius}`};
-    border-left: ${(e) => "0.0625rem solid " + o(
-  e.theme,
+    border-radius: ${(t) => `${t.borderRadius} 0 0 ${t.borderRadius}`};
+    border-left: ${(t) => "0.0625rem solid " + o(
+  t.theme,
   "ButtonGroup",
-  e.color,
+  t.color,
   "enabled",
   "border"
 )};
   }
 
   & button:last-of-type {
-    border-radius: ${(e) => `0 ${e.borderRadius} ${e.borderRadius} 0`};
-    border-right: ${(e) => "0.0625rem solid " + o(
-  e.theme,
+    border-radius: ${(t) => `0 ${t.borderRadius} ${t.borderRadius} 0`};
+    border-right: ${(t) => "0.0625rem solid " + o(
+  t.theme,
   "ButtonGroup",
-  e.color,
+  t.color,
   "enabled",
   "border"
 )};
   }
 
   & button:first-of-type:not([data-type="filled"]) {
-    border-right: ${(e) => "0.0625rem solid " + o(
-  e.theme,
+    border-right: ${(t) => "0.0625rem solid " + o(
+  t.theme,
   "ButtonGroup",
-  e.color,
+  t.color,
   "enabled",
   "border"
 )};
   }
 
   & button:not(:first-of-type):not(:last-of-type):not([data-type="filled"]) {
-    border-right: ${(e) => "0.0625rem solid " + o(
-  e.theme,
+    border-right: ${(t) => "0.0625rem solid " + o(
+  t.theme,
   "ButtonGroup",
-  e.color,
+  t.color,
   "enabled",
   "border"
 )};
   }
-`, m = ({
-  children: e,
-  borderRadius: d = "regular",
-  style: n = {},
-  className: a = ""
+`, h = ({
+  children: t,
+  borderRadius: r = "regular",
+  style: d = {},
+  className: n = ""
 }) => {
-  const r = l();
+  const e = i();
   return /* @__PURE__ */ u(
-    s,
+    l,
     {
-      borderRadius: b(r, d),
-      theme: r,
-      style: n,
-      className: "lnc-ui-button-group " + a,
-      children: e
+      borderRadius: b(e, r),
+      theme: e,
+      style: d,
+      className: "lnc-ui-button-group " + n,
+      children: t
     }
   );
 };
-m.propTypes = {
-  borderRadius: t.oneOf([
-    "slight",
-    "regular",
-    "edged",
-    "curved",
-    "none"
-  ]),
-  className: t.string,
-  style: t.object
-};
 export {
-  m as default
+  h as default
 };