@lanaco/lnc-react-ui 4.0.199 → 4.0.200

package/dist/DetailsView.js

@@ -1,200 +1,184 @@
-import { jsx as a, jsxs as s, Fragment as k } from "react/jsx-runtime";
-import { forwardRef as v } from "react";
-import { P as e } from "./index-CblbdqjE.js";
-import { s as f } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import W from "./FlexGrid.js";
-import A from "./FlexGridItem.js";
-import { c as Y, b as B, g as U, a as q } from "./utils-DtEfC-TX.js";
-import { u as E } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import H from "./Button.js";
-import c from "./IconButton.js";
-const J = f.label`
+import { jsx as r, jsxs as i, Fragment as T } from "react/jsx-runtime";
+import { forwardRef as w } from "react";
+import { s as u } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import j from "./FlexGrid.js";
+import W from "./FlexGridItem.js";
+import { c as A, b as C, g as O, a as U } from "./utils-DtEfC-TX.js";
+import { u as P } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import Y from "./Button.js";
+import d from "./IconButton.js";
+const q = u.label`
   display: block;
   margin-bottom: 4px;
-  ${(o) => Y(o.theme, "FormField", o.size, "enabled")}
-  color: ${(o) => B(
-  o.theme,
+  ${(e) => A(e.theme, "FormField", e.size, "enabled")}
+  color: ${(e) => C(
+  e.theme,
   "FormField",
-  o.color,
+  e.color,
   "enabled",
   "text"
 )};
-`, g = v((o, m) => {
+`, v = w((e, c) => {
   const {
     size: h = "small",
-    color: n = "primary",
-    className: r = "",
-    style: b = {},
-    children: p
-  } = o, u = E();
-  return /* @__PURE__ */ a(
-    J,
+    color: s = "primary",
+    className: l = "",
+    style: m = {},
+    children: b
+  } = e, p = P();
+  return /* @__PURE__ */ r(
+    q,
     {
-      theme: u,
+      theme: p,
       size: h,
-      className: "lnc-ui-label " + r,
-      style: b,
-      color: n,
-      ref: m,
-      children: p
+      className: "lnc-ui-label " + l,
+      style: m,
+      color: s,
+      ref: c,
+      children: b
     }
   );
 });
-g.defaultProps = {
+v.defaultProps = {
   style: {},
   size: "small",
   color: "primary"
 };
-g.propTypes = {
-  className: e.string,
-  style: e.object,
-  size: e.oneOf(["small", "medium", "large"]),
-  color: e.oneOf([
-    "primary",
-    "secondary",
-    "success",
-    "danger",
-    "warning",
-    "information",
-    "neutral",
-    "gray"
-  ])
-};
-const P = f.div`
+const k = u.div`
   display: flex;
   justify-content: space-between;
-`, K = f.div`
+`, H = u.div`
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  box-shadow: ${(o) => U(
-  o.theme,
+  box-shadow: ${(e) => O(
+  e.theme,
   "Popover",
-  o.color,
+  e.color,
   "enabled",
   "boxShadow"
 )};
-  border-radius: ${(o) => q(o.theme, o.borderRadius)};
+  border-radius: ${(e) => U(e.theme, e.borderRadius)};
   border-top: 1px solid rgba(0, 0, 0, 0.04);
   padding: 12px;
-  background-color: ${(o) => B(o.theme, "Popover", "default", "enabled", "bg")};
-`, N = v((o, m) => {
+  background-color: ${(e) => C(e.theme, "Popover", "default", "enabled", "bg")};
+`, J = w((e, c) => {
   const {
     // eslint-disable-next-line no-unused-vars
     __TYPE__: h = "DETAILS_VIEW",
-    goToPreviousView: n,
-    data: r = {},
-    fields: b = {},
-    flexGridProps: p,
-    goBackText: u = "Go back",
-    showBack: C = !0,
-    showNext: _ = !0,
-    showPrevious: G = !0,
-    showEdit: y = !0,
-    disableGoBack: V = !1,
-    disableNext: F = !1,
-    disablePrevious: j = !1,
-    disableEdit: x = !1,
-    editOnTop: T = !1,
+    goToPreviousView: s,
+    data: l = {},
+    fields: m = {},
+    flexGridProps: b,
+    goBackText: p = "Go back",
+    showBack: B = !0,
+    showNext: E = !0,
+    showPrevious: V = !0,
+    showEdit: f = !0,
+    disableGoBack: F = !1,
+    disableNext: N = !1,
+    disablePrevious: G = !1,
+    disableEdit: g = !1,
+    editOnTop: y = !1,
     //------------------
-    goToNext: z = () => {
+    goToNext: I = () => {
     },
-    goToPrevious: I = () => {
+    goToPrevious: S = () => {
     },
-    onEdit: w = () => {
+    onEdit: x = () => {
     },
-    goBack: O = () => {
+    goBack: _ = () => {
     },
     //------------------
-    className: S = "",
-    color: i = "primary",
-    size: t = "small",
-    children: $,
-    ...R
-  } = o, D = E(), L = (l, d) => {
-    n && n(), O(l, d);
+    className: $ = "",
+    color: t = "primary",
+    size: a = "small",
+    children: R,
+    ...z
+  } = e, D = P(), L = (o, n) => {
+    s && s(), _(o, n);
   };
-  return /* @__PURE__ */ s(
-    K,
+  return /* @__PURE__ */ i(
+    H,
     {
-      ref: m,
+      ref: c,
       theme: D,
-      color: i,
+      color: t,
       borderRadius: "regular",
-      className: S,
-      ...R,
+      className: $,
+      ...z,
       children: [
-        /* @__PURE__ */ s(P, { children: [
-          C && /* @__PURE__ */ a(
-            H,
+        /* @__PURE__ */ i(k, { children: [
+          B && /* @__PURE__ */ r(
+            Y,
             {
               leadingIcon: "arrow-circle-left",
-              text: u,
+              text: p,
               btnType: "outline",
               style: { width: "fit-content" },
-              onClick: (l) => L(l, r),
-              disabled: V,
-              color: i,
-              size: t
+              onClick: (o) => L(o, l),
+              disabled: F,
+              color: t,
+              size: a
             },
             0
           ),
-          y && T && /* @__PURE__ */ a(
-            c,
+          f && y && /* @__PURE__ */ r(
+            d,
             {
               btnType: "outline",
               icon: "pen",
-              disabled: x,
-              onClick: (l) => w(r, l),
-              color: i,
-              size: t
+              disabled: g,
+              onClick: (o) => x(l, o),
+              color: t,
+              size: a
             }
           )
         ] }),
-        /* @__PURE__ */ a(k, { children: $ || /* @__PURE__ */ a(W, { spacing: 10, ...p, children: b.map((l, d) => /* @__PURE__ */ s(A, { ...l, children: [
-          /* @__PURE__ */ s(g, { color: i, size: t, children: [
-            l.label,
+        /* @__PURE__ */ r(T, { children: R || /* @__PURE__ */ r(j, { spacing: 10, ...b, children: m.map((o, n) => /* @__PURE__ */ i(W, { ...o, children: [
+          /* @__PURE__ */ i(v, { color: t, size: a, children: [
+            o.label,
             ":"
-          ] }, d),
-          r[l.accessor]
-        ] }, d)) }) }),
-        /* @__PURE__ */ s(P, { children: [
-          /* @__PURE__ */ s("div", { children: [
-            _ && /* @__PURE__ */ s(k, { children: [
-              /* @__PURE__ */ a(
-                c,
+          ] }, n),
+          l[o.accessor]
+        ] }, n)) }) }),
+        /* @__PURE__ */ i(k, { children: [
+          /* @__PURE__ */ i("div", { children: [
+            E && /* @__PURE__ */ i(T, { children: [
+              /* @__PURE__ */ r(
+                d,
                 {
                   btnType: "outline",
                   icon: "angle-left",
-                  disabled: j,
-                  onClick: (l) => I(r, l),
-                  color: i,
-                  size: t
+                  disabled: G,
+                  onClick: (o) => S(l, o),
+                  color: t,
+                  size: a
                 }
               ),
               "  "
             ] }),
-            G && /* @__PURE__ */ a(
-              c,
+            V && /* @__PURE__ */ r(
+              d,
               {
                 btnType: "outline",
                 icon: "angle-right",
-                disabled: F,
-                onClick: (l) => z(r, l),
-                color: i,
-                size: t
+                disabled: N,
+                onClick: (o) => I(l, o),
+                color: t,
+                size: a
               }
             )
           ] }),
-          y && !T && /* @__PURE__ */ a(
-            c,
+          f && !y && /* @__PURE__ */ r(
+            d,
             {
               btnType: "outline",
               icon: "pen",
-              disabled: x,
-              onClick: (l) => w(r, l),
-              color: i,
-              size: t
+              disabled: g,
+              onClick: (o) => x(l, o),
+              color: t,
+              size: a
             }
           )
         ] })
@@ -202,42 +186,7 @@ const P = f.div`
     }
   );
 });
-N.propTypes = {
-  __TYPE__: e.string,
-  goBackText: e.string,
-  fields: e.array,
-  data: e.object,
-  showBack: e.bool,
-  showNext: e.bool,
-  showPrevious: e.bool,
-  showEdit: e.bool,
-  disableGoBack: e.bool,
-  disableNext: e.bool,
-  disablePrevious: e.bool,
-  disableEdit: e.bool,
-  flexGridProps: e.any,
-  editOnTop: e.bool,
-  //-----------------------------------------------------------
-  goToNext: e.func,
-  goToPrevious: e.func,
-  onEdit: e.func,
-  goBack: e.func,
-  //------------------------------------------------------------
-  className: e.string,
-  style: e.object,
-  color: e.oneOf([
-    "primary",
-    "secondary",
-    "success",
-    "warning",
-    "danger",
-    "information",
-    "neutral",
-    "gray"
-  ]),
-  size: e.oneOf(["small", "medium", "large"])
-};
-N.displayName = "DETAILS_VIEW";
+J.displayName = "DETAILS_VIEW";
 export {
-  N as default
+  J as default
 };

package/dist/DoubleRangeSlider.cjs

@@ -1,12 +1,12 @@
-"use strict";const t=require("react/jsx-runtime"),s=require("react"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),i=require("./index-BpbMKBf_.cjs"),o=require("./utils-RnrgDDZP.cjs"),C=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),N=({theme:e,size:y})=>{var u=o.getSizeValueWithUnits(e,y);return`
-    min-height: ${u};
-    max-height: ${u};
-  `},b={small:"0.875rem",medium:"1.125rem",large:"1.375rem"},S=v.styled.div`
+"use strict";const t=require("react/jsx-runtime"),i=require("react"),f=require("./emotion-styled.browser.esm-BtEseadx.cjs"),s=require("./utils-RnrgDDZP.cjs"),z=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),C=({theme:e,size:p})=>{var d=s.getSizeValueWithUnits(e,p);return`
+    min-height: ${d};
+    max-height: ${d};
+  `},m={small:"0.875rem",medium:"1.125rem",large:"1.375rem"},S=f.styled.div`
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
-  ${e=>N(e)};
+  ${e=>C(e)};
 
   /* Removing the default appearance */
   & > :is(.thumb, .thumb::-webkit-slider-thumb) {
@@ -34,10 +34,10 @@
   & > .thumb::-webkit-slider-thumb {
     -webkit-appearance: none; /* Override default look */
     appearance: none;
-    width: ${e=>b[e.size]}; /* Set a specific slider handle width */
-    height: ${e=>b[e.size]}; /* Slider handle height */
+    width: ${e=>m[e.size]}; /* Set a specific slider handle width */
+    height: ${e=>m[e.size]}; /* Slider handle height */
     border-radius: 50%;
-    background-color: ${e=>o.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    background-color: ${e=>s.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
     cursor: pointer; /* Cursor on hover */
     border: none;
     pointer-events: all;
@@ -45,15 +45,15 @@
 
   /* For Firefox browsers */
   & > .thumb::-moz-range-thumb {
-    width: ${e=>b[e.size]}; /* Set a specific slider handle width */
-    height: ${e=>b[e.size]}; /* Slider handle height */
+    width: ${e=>m[e.size]}; /* Set a specific slider handle width */
+    height: ${e=>m[e.size]}; /* Slider handle height */
     border-radius: 50%;
-    background-color: ${e=>o.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    background-color: ${e=>s.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
     cursor: pointer; /* Cursor on hover */
     border: none;
     pointer-events: all;
   }
-`,T=v.styled.div`
+`,N=f.styled.div`
   position: relative;
   width: 100%;
   height: 0.25rem;
@@ -67,29 +67,29 @@
   }
 
   & > .slider__track {
-    background-color: ${e=>o.getColorRgbaValue(e.theme,"Range",e.color,"enabled","unfilled")};
+    background-color: ${e=>s.getColorRgbaValue(e.theme,"Range",e.color,"enabled","unfilled")};
     width: 100%;
     z-index: 1;
-    border-radius: ${e=>o.getBorderRadiusValueWithUnits(e.theme,"regular")};
+    border-radius: ${e=>s.getBorderRadiusValueWithUnits(e.theme,"regular")};
   }
 
   & > .slider__range {
-    border-radius: ${e=>o.getBorderRadiusValueWithUnits(e.theme,"regular")};
-    background-color: ${e=>o.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    border-radius: ${e=>s.getBorderRadiusValueWithUnits(e.theme,"regular")};
+    background-color: ${e=>s.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
     z-index: 2;
   }
-`,R=v.styled.div`
+`,R=f.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   position: absolute;
   left: ${e=>`calc(${e.inputValue+"%"} + (${8-e.inputValue*.15}px))`};
-  top: ${e=>"calc(-"+b[e.size]+")"};
+  top: ${e=>"calc(-"+m[e.size]+")"};
   transform: translateX(-50%);
-  ${e=>o.getComponentTypographyCss(e.theme,"Range",e.size,"enabled")};
+  ${e=>s.getComponentTypographyCss(e.theme,"Range",e.size,"enabled")};
   & > .text-content {
     color: white;
-    background-color: ${e=>o.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    background-color: ${e=>s.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
     border-radius: 3px;
     z-index: 2;
     padding: 2px 6px;
@@ -101,7 +101,7 @@
       & > .inner {
         width: 8px;
         height: 8px;
-        background-color: ${e=>o.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+        background-color: ${e=>s.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
         transform: rotate(45deg);
         position: absolute;
         top: -6px;
@@ -111,4 +111,4 @@
       }
     }
   }
-`,j=s.forwardRef((e,y)=>{const{minValue:u=null,maxValue:f=null,min:h=0,max:m=100,disabled:g=!1,onChange:w=()=>{},color:V="primary",size:P="small",...z}=e,x={theme:C.useTheme(),size:P,color:V},[_,p]=s.useState(),[r,$]=s.useState(u),[n,k]=s.useState(f);s.useEffect(()=>{$(u),k(f)},[u,f]);const c=s.useRef(null),l=s.useCallback(a=>Math.round((a-h)/(m-h)*100),[h,m]);return s.useEffect(()=>{const a=l(r),d=l(n);c.current&&(c.current.style.left=`${a}%`,c.current.style.width=`${d-a}%`)},[r,l]),s.useEffect(()=>{const a=l(r),d=l(n);c.current&&(c.current.style.width=`${d-a}%`)},[n,l]),s.useEffect(()=>{w({min:r,max:n})},[r,n,w]),t.jsxs(S,{disabled:g,...x,...z,children:[_&&r&&t.jsx(t.Fragment,{children:t.jsxs(R,{...x,inputValue:l(r),disabled:g,children:[t.jsx("div",{className:"text-content",children:r}),t.jsx("div",{className:"arrow",children:t.jsx("div",{className:"outer",children:t.jsx("div",{className:"inner"})})})]})}),_&&n&&t.jsx(t.Fragment,{children:t.jsxs(R,{...x,inputValue:l(n),disabled:g,children:[t.jsx("div",{className:"text-content",children:n}),t.jsx("div",{className:"arrow",children:t.jsx("div",{className:"outer",children:t.jsx("div",{className:"inner"})})})]})}),t.jsx("input",{type:"range",min:h,max:m,value:r|"",onChange:a=>{const d=Math.min(Number(a.target.value),n-1);$(d)},className:"thumb thumb--left",style:{zIndex:r>m-100&&"5"},onMouseEnter:()=>{p(!0)},onMouseLeave:()=>{p(!1)}}),t.jsx("input",{type:"range",min:h,max:m,value:n|"",onChange:a=>{const d=Math.max(Number(a.target.value),r+1);k(d)},className:"thumb thumb--right",onMouseEnter:()=>{p(!0)},onMouseLeave:()=>{p(!1)}}),t.jsxs(T,{...x,disabled:g,children:[t.jsx("div",{className:"slider__track"}),t.jsx("div",{ref:c,className:"slider__range"})]})]})});j.propTypes={minValue:i.PropTypes.number,maxValue:i.PropTypes.number,min:i.PropTypes.number,max:i.PropTypes.number,disabled:i.PropTypes.bool,onChange:i.PropTypes.func,className:i.PropTypes.string,style:i.PropTypes.object,size:i.PropTypes.oneOf(["small","medium","large"]),color:i.PropTypes.oneOf(["primary","secondary","success","danger","warning","disabled","information","neutral","gray"])};module.exports=j;
+`,M=i.forwardRef((e,p)=>{const{minValue:d=null,maxValue:v=null,min:c=0,max:h=100,disabled:g=!1,onChange:w=()=>{},color:j="primary",size:V="small",...y}=e,b={theme:z.useTheme(),size:V,color:j},[_,x]=i.useState(),[r,$]=i.useState(d),[a,k]=i.useState(v);i.useEffect(()=>{$(d),k(v)},[d,v]);const u=i.useRef(null),l=i.useCallback(n=>Math.round((n-c)/(h-c)*100),[c,h]);return i.useEffect(()=>{const n=l(r),o=l(a);u.current&&(u.current.style.left=`${n}%`,u.current.style.width=`${o-n}%`)},[r,l]),i.useEffect(()=>{const n=l(r),o=l(a);u.current&&(u.current.style.width=`${o-n}%`)},[a,l]),i.useEffect(()=>{w({min:r,max:a})},[r,a,w]),t.jsxs(S,{disabled:g,...b,...y,children:[_&&r&&t.jsx(t.Fragment,{children:t.jsxs(R,{...b,inputValue:l(r),disabled:g,children:[t.jsx("div",{className:"text-content",children:r}),t.jsx("div",{className:"arrow",children:t.jsx("div",{className:"outer",children:t.jsx("div",{className:"inner"})})})]})}),_&&a&&t.jsx(t.Fragment,{children:t.jsxs(R,{...b,inputValue:l(a),disabled:g,children:[t.jsx("div",{className:"text-content",children:a}),t.jsx("div",{className:"arrow",children:t.jsx("div",{className:"outer",children:t.jsx("div",{className:"inner"})})})]})}),t.jsx("input",{type:"range",min:c,max:h,value:r|"",onChange:n=>{const o=Math.min(Number(n.target.value),a-1);$(o)},className:"thumb thumb--left",style:{zIndex:r>h-100&&"5"},onMouseEnter:()=>{x(!0)},onMouseLeave:()=>{x(!1)}}),t.jsx("input",{type:"range",min:c,max:h,value:a|"",onChange:n=>{const o=Math.max(Number(n.target.value),r+1);k(o)},className:"thumb thumb--right",onMouseEnter:()=>{x(!0)},onMouseLeave:()=>{x(!1)}}),t.jsxs(N,{...b,disabled:g,children:[t.jsx("div",{className:"slider__track"}),t.jsx("div",{ref:u,className:"slider__range"})]})]})});module.exports=M;