@lanaco/lnc-react-ui 4.0.100 → 4.0.101

package/dist/Button.cjs

@@ -1,4 +1,4 @@
-"use strict";const l=require("react/jsx-runtime"),w=require("react"),o=require("./index-BPVoEhTF.cjs"),C=require("./index-DAOBjHnD.cjs"),r=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-BWzf4vLl.cjs"),V=require("./Icon.cjs"),W=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),B={small:{regular:"1rem",icon:"0.75rem",justIcon:"0.5rem"},medium:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"},large:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"}},f=e=>`
+"use strict";const n=require("react/jsx-runtime"),w=require("react"),o=require("./index-BPVoEhTF.cjs"),C=require("./index-DAOBjHnD.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-BWzf4vLl.cjs"),z=require("./Icon.cjs"),W=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),B={small:{regular:"1rem",icon:"0.75rem",justIcon:"0.5rem"},medium:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"},large:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"}},f=e=>`
         outline: none;
         display: inline-flex;
         flex-direction: row;
@@ -13,11 +13,11 @@
         
         padding-left: ${e.hasLeadingIcon?B[e.size].icon:B[e.size].regular};
         padding-right: ${e.hasTrailingIcon?B[e.size].icon:B[e.size].regular};
-    `,D=r.styled.span`
+    `,D=c.styled.span`
   padding-right: ${e=>e.size==="small"?"0.25rem":"0.5rem"};
-`,E=r.styled.span`
+`,N=c.styled.span`
   padding-left: ${e=>e.size==="small"?"0.25rem":"0.5rem"};
-`,z=r.styled.button`
+`,I=c.styled.button`
   ${e=>f(e)}
 
   ${e=>t.getComponentTypographyCss(e.theme,"ButtonFilled",e.size,"enabled")};
@@ -50,7 +50,7 @@
     background-color: ${e=>e.disabled===!1&&t.getColorRgbaValue(e.theme,"ButtonFilled",e.color,"active","background")};
     color: ${e=>e.disabled===!1&&t.getColorRgbaValue(e.theme,"ButtonFilled",e.color,"active","text")};
   }
-`,L=r.styled.button`
+`,E=c.styled.button`
   ${e=>f(e)}
 
   min-height: ${e=>t.getSizeValueWithUnits(e.theme,e.size)};
@@ -86,7 +86,7 @@
     cursor: default;
     background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted","gray","disabled","background")};
   }
-`,I=r.styled.button`
+`,O=c.styled.button`
   ${e=>f(e)}
 
   ${e=>t.getComponentTypographyCss(e.theme,"ButtonTinted",e.size,"enabled")};
@@ -121,7 +121,7 @@
     cursor: default;
     background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic","gray","disabled","background","backgroundOpacity")};
   }
-`,_=r.styled(I)`
+`,L=c.styled(O)`
   border: 1px solid
     ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic",e.color,"enabled","border","borderOpacity")};
-`,O=w.forwardRef((e,c)=>{const{text:k="",iconStyle:T="solid",leadingIcon:x=null,trailingIcon:R=null,borderRadius:v="regular",btnType:n="filled",disabled:P=!1,tabIndex:d=0,onFocus:u,onBlur:s,onClick:g,onKeyDown:b,onLeadingIconClick:N,onTrailingIconClick:K,size:$="small",color:j="primary",className:F="",style:S={},children:U,...m}=e,h={theme:W.useTheme(),color:j,size:$,style:S,disabled:P,borderRadius:v,btnType:n,className:"lnc-ui-button "+F},a=!C.isEmpty(x),i=!C.isEmpty(R),q=!C.isEmpty(k),y=()=>l.jsxs(l.Fragment,{children:[a&&l.jsx(D,{size:$,children:l.jsx(V,{icon:x,sizeInUnits:"1.125rem",iconStyle:T})}),k,U,i&&l.jsx(E,{size:$,children:l.jsx(V,{icon:R,sizeInUnits:"1.125rem",iconStyle:T})})]});return n==="filled"?l.jsx(z,{ref:c,"data-type":"filled",...h,hasLeadingIcon:a,hasTrailingIcon:i,onFocus:u,onBlur:s,onClick:g,onKeyDown:b,tabIndex:d,btnType:n,...m,children:y()}):n==="tinted"?l.jsx(L,{ref:c,"data-type":"tinted",...h,hasLeadingIcon:a,hasTrailingIcon:i,onFocus:u,onBlur:s,onClick:g,onKeyDown:b,tabIndex:d,btnType:n,...m,children:y()}):n==="outline"?l.jsx(_,{ref:c,"data-type":"outline",...h,hasLeadingIcon:a,hasTrailingIcon:i,onFocus:u,onBlur:s,onClick:g,onKeyDown:b,tabIndex:d,btnType:n,...m,children:y()}):n==="basic"?l.jsx(I,{ref:c,"data-type":"basic",...h,hasLeadingIcon:a,hasTrailingIcon:i,onFocus:u,onBlur:s,onClick:g,onKeyDown:b,tabIndex:d,btnType:n,...m,children:y()}):l.jsx(z,{ref:c,"data-type":"filled",size:$,...h,hasLeadingIcon:a,hasTrailingIcon:i,onFocus:u,onBlur:s,onClick:g,onKeyDown:b,hasText:q,tabIndex:d,btnType:n,...m,children:y()})});O.propTypes={text:o.PropTypes.string,iconStyle:o.PropTypes.oneOf(["regular","solid"]),leadingIcon:o.PropTypes.string,trailingIcon:o.PropTypes.string,borderRadius:o.PropTypes.oneOf(["slight","regular","edged","curved","none"]),btnType:o.PropTypes.oneOf(["filled","tinted","outline","basic"]),disabled:o.PropTypes.bool,tabIndex:o.PropTypes.number,onBlur:o.PropTypes.func,onFocus:o.PropTypes.func,onClick:o.PropTypes.func,onKeyDown:o.PropTypes.func,className:o.PropTypes.string,style:o.PropTypes.object,color:o.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:o.PropTypes.oneOf(["small","medium","large"])};module.exports=O;
+`,v=w.forwardRef((e,d)=>{const{text:k="",iconStyle:T="solid",leadingIcon:x=null,trailingIcon:R=null,borderRadius:j="regular",btnType:l="filled",disabled:F=!1,tabIndex:u=0,onFocus:s,onBlur:g,onClick:b,onKeyDown:m,onLeadingIconClick:_,onTrailingIconClick:K,size:$="small",color:V="primary",className:P="",style:S={},children:U,...h}=e,a={theme:W.useTheme(),color:V,size:$,style:S,disabled:F,borderRadius:j,btnType:l,className:"lnc-ui-button "+P},i=!C.isEmpty(x),r=!C.isEmpty(R),q=!C.isEmpty(k),y=()=>n.jsxs(n.Fragment,{children:[i&&n.jsx(D,{size:$,children:n.jsx(z,{icon:x,sizeInUnits:"1.125rem",iconStyle:T})}),k,U,r&&n.jsx(N,{size:$,children:n.jsx(z,{icon:R,sizeInUnits:"1.125rem",iconStyle:T})})]});return l==="filled"?n.jsx(I,{ref:d,"data-type":"filled",...a,className:`${a==null?void 0:a.className} ${V}-${l}-lnc-btn`,hasLeadingIcon:i,hasTrailingIcon:r,onFocus:s,onBlur:g,onClick:b,onKeyDown:m,tabIndex:u,btnType:l,...h,children:y()}):l==="tinted"?n.jsx(E,{ref:d,"data-type":"tinted",...a,hasLeadingIcon:i,hasTrailingIcon:r,onFocus:s,onBlur:g,onClick:b,onKeyDown:m,tabIndex:u,btnType:l,...h,children:y()}):l==="outline"?n.jsx(L,{ref:d,"data-type":"outline",...a,hasLeadingIcon:i,hasTrailingIcon:r,onFocus:s,onBlur:g,onClick:b,onKeyDown:m,tabIndex:u,btnType:l,...h,children:y()}):l==="basic"?n.jsx(O,{ref:d,"data-type":"basic",...a,hasLeadingIcon:i,hasTrailingIcon:r,onFocus:s,onBlur:g,onClick:b,onKeyDown:m,tabIndex:u,btnType:l,...h,children:y()}):n.jsx(I,{ref:d,"data-type":"filled",size:$,...a,hasLeadingIcon:i,hasTrailingIcon:r,onFocus:s,onBlur:g,onClick:b,onKeyDown:m,hasText:q,tabIndex:u,btnType:l,...h,children:y()})});v.propTypes={text:o.PropTypes.string,iconStyle:o.PropTypes.oneOf(["regular","solid"]),leadingIcon:o.PropTypes.string,trailingIcon:o.PropTypes.string,borderRadius:o.PropTypes.oneOf(["slight","regular","edged","curved","none"]),btnType:o.PropTypes.oneOf(["filled","tinted","outline","basic"]),disabled:o.PropTypes.bool,tabIndex:o.PropTypes.number,onBlur:o.PropTypes.func,onFocus:o.PropTypes.func,onClick:o.PropTypes.func,onKeyDown:o.PropTypes.func,className:o.PropTypes.string,style:o.PropTypes.object,color:o.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:o.PropTypes.oneOf(["small","medium","large"])};module.exports=v;

package/dist/Button.js

@@ -1,10 +1,10 @@
-import { jsx as i, jsxs as K, Fragment as W } from "react/jsx-runtime";
-import { forwardRef as E } from "react";
+import { jsx as i, jsxs as W, Fragment as E } from "react/jsx-runtime";
+import { forwardRef as P } from "react";
 import { P as o } from "./index-S5Cd7WrG.js";
 import { i as y } from "./index-BlxaTV-D.js";
-import { s as r } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { c as x, b as t, d as c, h as T, e as z, a as q } from "./utils-BXCGNjIy.js";
-import j from "./Icon.js";
+import { s as d } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { c as x, b as t, d as r, h as T, e as z, a as q } from "./utils-BXCGNjIy.js";
+import w from "./Icon.js";
 import { u as A } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const k = {
   small: {
@@ -40,11 +40,11 @@ const k = {
         
         padding-left: ${e.hasLeadingIcon ? k[e.size].icon : k[e.size].regular};
         padding-right: ${e.hasTrailingIcon ? k[e.size].icon : k[e.size].regular};
-    `, G = r.span`
+    `, G = d.span`
   padding-right: ${(e) => e.size === "small" ? "0.25rem" : "0.5rem"};
-`, H = r.span`
+`, H = d.span`
   padding-left: ${(e) => e.size === "small" ? "0.25rem" : "0.5rem"};
-`, w = r.button`
+`, R = d.button`
   ${(e) => I(e)}
 
   ${(e) => x(
@@ -69,8 +69,8 @@ const k = {
   "text"
 )};
 
-  min-height: ${(e) => c(e.theme, e.size)};
-  max-height: ${(e) => c(e.theme, e.size)};
+  min-height: ${(e) => r(e.theme, e.size)};
+  max-height: ${(e) => r(e.theme, e.size)};
 
   &:disabled {
     ${(e) => e.disabled === !0 && T(e.theme)};
@@ -142,11 +142,11 @@ const k = {
   "text"
 )};
   }
-`, J = r.button`
+`, J = d.button`
   ${(e) => I(e)}
 
-  min-height: ${(e) => c(e.theme, e.size)};
-  max-height: ${(e) => c(e.theme, e.size)};
+  min-height: ${(e) => r(e.theme, e.size)};
+  max-height: ${(e) => r(e.theme, e.size)};
   ${(e) => x(
   e.theme,
   "ButtonTinted",
@@ -241,7 +241,7 @@ const k = {
   "background"
 )};
   }
-`, R = r.button`
+`, N = d.button`
   ${(e) => I(e)}
 
   ${(e) => x(
@@ -268,8 +268,8 @@ const k = {
   "backgroundOpacity"
 )};
 
-  min-height: ${(e) => c(e.theme, e.size)};
-  max-height: ${(e) => c(e.theme, e.size)};
+  min-height: ${(e) => r(e.theme, e.size)};
+  max-height: ${(e) => r(e.theme, e.size)};
 
   &:hover {
     background-color: ${(e) => t(
@@ -340,7 +340,7 @@ const k = {
   "backgroundOpacity"
 )};
   }
-`, M = r(R)`
+`, M = d(N)`
   border: 1px solid
     ${(e) => t(
   e.theme,
@@ -350,7 +350,7 @@ const k = {
   "border",
   "borderOpacity"
 )};
-`, Q = E((e, d) => {
+`, Q = P((e, u) => {
   const {
     text: v = "",
     iconStyle: O = "solid",
@@ -359,33 +359,33 @@ const k = {
     borderRadius: L = "regular",
     btnType: n = "filled",
     disabled: S = !1,
-    tabIndex: u = 0,
+    tabIndex: s = 0,
     //----------------
-    onFocus: s,
-    onBlur: m,
-    onClick: b,
-    onKeyDown: g,
+    onFocus: m,
+    onBlur: b,
+    onClick: g,
+    onKeyDown: h,
     onLeadingIconClick: X,
     onTrailingIconClick: Y,
     //----------------
     size: B = "small",
-    color: U = "primary",
-    className: D = "",
-    style: N = {},
-    children: P,
-    ...h
-  } = e, f = {
+    color: j = "primary",
+    className: U = "",
+    style: D = {},
+    children: V,
+    ...$
+  } = e, a = {
     theme: A(),
-    color: U,
+    color: j,
     size: B,
-    style: N,
+    style: D,
     disabled: S,
     borderRadius: L,
     btnType: n,
-    className: "lnc-ui-button " + D
-  }, a = !y(F), l = !y(C), V = !y(v), $ = () => /* @__PURE__ */ K(W, { children: [
-    a && /* @__PURE__ */ i(G, { size: B, children: /* @__PURE__ */ i(
-      j,
+    className: "lnc-ui-button " + U
+  }, l = !y(F), c = !y(C), K = !y(v), f = () => /* @__PURE__ */ W(E, { children: [
+    l && /* @__PURE__ */ i(G, { size: B, children: /* @__PURE__ */ i(
+      w,
       {
         icon: F,
         sizeInUnits: "1.125rem",
@@ -393,9 +393,9 @@ const k = {
       }
     ) }),
     v,
-    P,
-    l && /* @__PURE__ */ i(H, { size: B, children: /* @__PURE__ */ i(
-      j,
+    V,
+    c && /* @__PURE__ */ i(H, { size: B, children: /* @__PURE__ */ i(
+      w,
       {
         icon: C,
         sizeInUnits: "1.125rem",
@@ -404,91 +404,92 @@ const k = {
     ) })
   ] });
   return n === "filled" ? /* @__PURE__ */ i(
-    w,
+    R,
     {
-      ref: d,
+      ref: u,
       "data-type": "filled",
-      ...f,
-      hasLeadingIcon: a,
-      hasTrailingIcon: l,
-      onFocus: s,
-      onBlur: m,
-      onClick: b,
-      onKeyDown: g,
-      tabIndex: u,
+      ...a,
+      className: `${a == null ? void 0 : a.className} ${j}-${n}-lnc-btn`,
+      hasLeadingIcon: l,
+      hasTrailingIcon: c,
+      onFocus: m,
+      onBlur: b,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
       btnType: n,
-      ...h,
-      children: $()
+      ...$,
+      children: f()
     }
   ) : n === "tinted" ? /* @__PURE__ */ i(
     J,
     {
-      ref: d,
+      ref: u,
       "data-type": "tinted",
-      ...f,
-      hasLeadingIcon: a,
-      hasTrailingIcon: l,
-      onFocus: s,
-      onBlur: m,
-      onClick: b,
-      onKeyDown: g,
-      tabIndex: u,
+      ...a,
+      hasLeadingIcon: l,
+      hasTrailingIcon: c,
+      onFocus: m,
+      onBlur: b,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
       btnType: n,
-      ...h,
-      children: $()
+      ...$,
+      children: f()
     }
   ) : n === "outline" ? /* @__PURE__ */ i(
     M,
     {
-      ref: d,
+      ref: u,
       "data-type": "outline",
-      ...f,
-      hasLeadingIcon: a,
-      hasTrailingIcon: l,
-      onFocus: s,
-      onBlur: m,
-      onClick: b,
-      onKeyDown: g,
-      tabIndex: u,
+      ...a,
+      hasLeadingIcon: l,
+      hasTrailingIcon: c,
+      onFocus: m,
+      onBlur: b,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
       btnType: n,
-      ...h,
-      children: $()
+      ...$,
+      children: f()
     }
   ) : n === "basic" ? /* @__PURE__ */ i(
-    R,
+    N,
     {
-      ref: d,
+      ref: u,
       "data-type": "basic",
-      ...f,
-      hasLeadingIcon: a,
-      hasTrailingIcon: l,
-      onFocus: s,
-      onBlur: m,
-      onClick: b,
-      onKeyDown: g,
-      tabIndex: u,
+      ...a,
+      hasLeadingIcon: l,
+      hasTrailingIcon: c,
+      onFocus: m,
+      onBlur: b,
+      onClick: g,
+      onKeyDown: h,
+      tabIndex: s,
       btnType: n,
-      ...h,
-      children: $()
+      ...$,
+      children: f()
     }
   ) : /* @__PURE__ */ i(
-    w,
+    R,
     {
-      ref: d,
+      ref: u,
       "data-type": "filled",
       size: B,
-      ...f,
-      hasLeadingIcon: a,
-      hasTrailingIcon: l,
-      onFocus: s,
-      onBlur: m,
-      onClick: b,
-      onKeyDown: g,
-      hasText: V,
-      tabIndex: u,
+      ...a,
+      hasLeadingIcon: l,
+      hasTrailingIcon: c,
+      onFocus: m,
+      onBlur: b,
+      onClick: g,
+      onKeyDown: h,
+      hasText: K,
+      tabIndex: s,
       btnType: n,
-      ...h,
-      children: $()
+      ...$,
+      children: f()
     }
   );
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lanaco/lnc-react-ui",
-  "version": "4.0.100",
+  "version": "4.0.101",
   "description": "React component library",
   "type": "module",
   "keywords": [