@lanaco/lnc-react-ui 3.11.35 → 4.0.2

package/dist/KanbanView.js

@@ -0,0 +1,255 @@
+import { jsxs as m, jsx as s } from "react/jsx-runtime";
+import $ from "react";
+import { P as e } from "./index-Ds9PUTwb.js";
+import { n as k } from "./emotion-styled.browser.esm-BZSYYThs.js";
+import P from "./KanbanActionsToolbar.js";
+import { r as i, e as d } from "./utils-DEke8iwo.js";
+import ee from "./Kanban.js";
+import { K as oe } from "./KanbanCard-D9OhU8C6.js";
+import ne from "./KanbanHeader.js";
+import ae from "./KanbanFooter.js";
+const te = k.div`
+  & .kanban-view-footer-lnc {
+    padding: 0 0.625rem;
+  }
+  & .kanban-view-toolbar-lnc {
+    margin: 0 0.625rem;
+  }
+`, u = $.forwardRef((C, b) => {
+  const {
+    __TYPE__: le = "KANBAN_VIEW",
+    goToPreviousView: re,
+    toolbarActions: w = [],
+    kanbanProps: n = {},
+    actionsToolbarProps: f = {},
+    footerProps: a = {},
+    showCreate: A = !0,
+    enableCreate: h = !0,
+    loading: se = !1,
+    customCardActions: N = [],
+    customColumnActions: E = [],
+    editCardText: D = "Edit",
+    enableEditCard: T = !0,
+    showEditCard: z = !0,
+    deleteCardText: g = "Delete",
+    enableDeleteCard: _ = !0,
+    showDeleteCard: y = !0,
+    editColumnText: K = "Edit",
+    enableEditColumn: x = !0,
+    showEditColumn: v = !0,
+    deleteColumnText: O = "Delete",
+    enableDeleteColumn: V = !0,
+    showDeleteColumn: j = !0,
+    showAddNewCard: M = !1,
+    showLoadMoreCards: B = !1,
+    //----------------
+    onCreate: c = () => {
+    },
+    onEditCard: L = () => {
+    },
+    onDeleteCard: R = () => {
+    },
+    onEditColumn: I = () => {
+    },
+    onDeleteColumn: F = () => {
+    },
+    onCardDetails: S = () => {
+    },
+    onColumnDetails: W = () => {
+    },
+    onAddNewCard: Y = () => {
+    },
+    onLoadMoreCards: p = () => {
+    },
+    //------------------
+    className: H = "",
+    style: q = {},
+    size: l = "small",
+    color: r = "primary",
+    children: t,
+    ...G
+  } = C, o = {
+    ...f,
+    showCreate: A,
+    enableCreate: h,
+    onCreate: c,
+    actions: w
+  }, J = (Z) => {
+    c(Z);
+  }, Q = () => i(
+    d("KANBAN_VIEW_ACTIONS_TOOLBAR", t),
+    {
+      ...o,
+      size: o != null && o.size ? o.size : l,
+      color: o != null && o.color ? o.color : r,
+      className: "kanban-view-toolbar-lnc " + (o == null ? void 0 : o.className)
+    },
+    t
+  ) || /* @__PURE__ */ s(
+    P,
+    {
+      ...o,
+      className: "kanban-view-toolbar-lnc " + (o == null ? void 0 : o.className),
+      size: o != null && o.size ? o.size : l,
+      color: o != null && o.color ? o.color : r,
+      onCreate: J
+    }
+  ), U = () => i(
+    d("KANBAN", t),
+    {
+      ...n,
+      size: n != null && n.size ? n.size : l,
+      color: n != null && n.color ? n.color : r,
+      className: n == null ? void 0 : n.className
+    },
+    t
+  ) || /* @__PURE__ */ m(
+    ee,
+    {
+      size: n != null && n.size ? n.size : l,
+      color: n != null && n.color ? n.color : r,
+      ...n,
+      children: [
+        /* @__PURE__ */ s(
+          ne,
+          {
+            onDetails: W,
+            actionsMenu: !0,
+            actions: [
+              {
+                name: K,
+                enable: x,
+                show: v,
+                onAction: I,
+                icon: "pen"
+              },
+              {
+                name: O,
+                enable: V,
+                show: j,
+                onAction: F,
+                icon: "trash"
+              },
+              ...E
+            ]
+          }
+        ),
+        /* @__PURE__ */ s(
+          oe,
+          {
+            onDetails: S,
+            actionsMenu: !0,
+            actions: [
+              {
+                name: D,
+                enable: T,
+                show: z,
+                onAction: L,
+                icon: "pen"
+              },
+              {
+                name: g,
+                enable: _,
+                show: y,
+                onAction: R,
+                icon: "trash"
+              },
+              ...N
+            ]
+          }
+        ),
+        t,
+        /* @__PURE__ */ s(
+          ae,
+          {
+            showAddNewCard: M,
+            showLoadMoreCards: B,
+            onAddNewCard: Y,
+            onLoadMoreCards: p
+          }
+        )
+      ]
+    }
+  ), X = () => i(
+    d("KANBAN_VIEW_FOOTER", t),
+    {
+      ...a,
+      size: a != null && a.size ? a.size : l,
+      color: a != null && a.color ? a.color : r,
+      className: "kanban-view-footer-lnc " + (a == null ? void 0 : a.className)
+    },
+    t
+  ) || null;
+  return /* @__PURE__ */ m(te, { ref: b, className: H, style: q, ...G, children: [
+    Q(),
+    U(),
+    X()
+  ] });
+});
+u.propTypes = {
+  __TYPE__: e.string,
+  kanbanProps: e.object,
+  actionsToolbarProps: e.object,
+  footerProps: e.object,
+  loading: e.bool,
+  showCreate: e.bool,
+  /**
+   * Enable create
+   */
+  enableCreate: e.bool,
+  /**
+   * Actions that will be shown in toolbar with existing actions
+   * toolbarActions=[{name: `<string>`, show: `<bool>`, enable: `<bool>`, onAction: `<func>`, customAction: `<element>`}, ...]
+   */
+  toolbarActions: e.array,
+  customCardActions: e.array,
+  customColumnActions: e.array,
+  editCardText: e.string,
+  enableEditCard: e.bool,
+  showEditCard: e.bool,
+  deleteCardText: e.string,
+  enableDeleteCard: e.bool,
+  showDeleteCard: e.bool,
+  editColumnText: e.string,
+  enableEditColumn: e.bool,
+  showEditColumn: e.bool,
+  deleteColumnText: e.string,
+  enableDeleteColumn: e.bool,
+  showDeleteColumn: e.bool,
+  /**
+   * Show Add New Card in all Columns
+   */
+  showAddNewCard: e.bool,
+  /**
+   * Show Load More Cards in all Columns
+   */
+  showLoadMoreCards: e.bool,
+  //-------------------------------------------------------------
+  onCreate: e.func,
+  onEditCard: e.func,
+  onDeleteCard: e.func,
+  onEditColumn: e.func,
+  onDeleteColumn: e.func,
+  onCardDetails: e.func,
+  onColumnDetails: e.func,
+  onLoadMoreCards: e.func,
+  onAddNewCard: e.func,
+  //------------------------------------------------------------
+  className: e.string,
+  style: e.object,
+  size: e.oneOf(["small", "medium", "large"]),
+  color: e.oneOf([
+    "primary",
+    "secondary",
+    "success",
+    "danger",
+    "warning",
+    "information",
+    "neutral",
+    "gray"
+  ])
+};
+u.displayName = "KanbanView";
+export {
+  u as default
+};

package/dist/Link.cjs

@@ -0,0 +1,15 @@
+"use strict";const y=require("react/jsx-runtime"),d=require("react"),t=require("./index-DXnSjbfJ.cjs"),g=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),o=require("./utils-hdRGTsQ7.cjs"),h=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),b=g.newStyled.a`
+  ${e=>o.getComponentTypographyCss(e.theme,"Breadcrumbs",e.size,"enabled")};
+  color: ${e=>o.getColorRgbaValue(e.theme,"Link",e.color,"enabled","text")};
+  text-decoration: none;
+
+  &:hover {
+    color: ${e=>o.getColorRgbaValue(e.theme,"Link",e.color,"hover","text")};
+  }
+  &:active {
+    color: ${e=>o.getColorRgbaValue(e.theme,"Link",e.color,"active","text")};
+  }
+  &:visited {
+    color: ${e=>o.getColorRgbaValue(e.theme,"Link",e.color,"visited","text")};
+  }
+`,r=d.forwardRef((e,s)=>{const{className:n="",style:l={},color:c="primary",size:i="small",children:a,...m}=e,u={theme:h.useTheme(),size:i,color:c,className:"lnc-ui-link "+n,style:l};return y.jsx(b,{ref:s,...u,...m,children:a})});r.propTypes={className:t.PropTypes.string,style:t.PropTypes.object,color:t.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:t.PropTypes.oneOf(["small","medium","large"])};module.exports=r;

package/dist/Link.js

@@ -0,0 +1,62 @@
+import { jsx as d } from "react/jsx-runtime";
+import f from "react";
+import { P as o } from "./index-Ds9PUTwb.js";
+import { n as h } from "./emotion-styled.browser.esm-BZSYYThs.js";
+import { a as y, b as t } from "./utils-DEke8iwo.js";
+import { u } from "./emotion-element-5486c51c.browser.esm-CSejtOeT.js";
+const g = h.a`
+  ${(e) => y(
+  e.theme,
+  "Breadcrumbs",
+  e.size,
+  "enabled"
+)};
+  color: ${(e) => t(e.theme, "Link", e.color, "enabled", "text")};
+  text-decoration: none;
+
+  &:hover {
+    color: ${(e) => t(e.theme, "Link", e.color, "hover", "text")};
+  }
+  &:active {
+    color: ${(e) => t(e.theme, "Link", e.color, "active", "text")};
+  }
+  &:visited {
+    color: ${(e) => t(e.theme, "Link", e.color, "visited", "text")};
+  }
+`, p = f.forwardRef((e, r) => {
+  const {
+    //----------------
+    className: a = "",
+    style: s = {},
+    color: n = "primary",
+    size: m = "small",
+    children: i,
+    ...l
+  } = e, c = {
+    theme: u(),
+    size: m,
+    color: n,
+    className: "lnc-ui-link " + a,
+    style: s
+  };
+  return /* @__PURE__ */ d(g, { ref: r, ...c, ...l, children: i });
+});
+p.propTypes = {
+  //---------------------------------------------------------------
+  className: o.string,
+  style: o.object,
+  color: o.oneOf([
+    "primary",
+    "secondary",
+    "success",
+    "warning",
+    "danger",
+    "information",
+    "neutral",
+    "gray"
+  ]),
+  size: o.oneOf(["small", "medium", "large"])
+};
+export {
+  p as default
+};

package/dist/MenuItem.cjs

@@ -0,0 +1,36 @@
+"use strict";const c=require("react/jsx-runtime"),f=require("react"),s=require("./index-DXnSjbfJ.cjs"),Y=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),M=require("./Icon.cjs"),l=require("./utils-hdRGTsQ7.cjs"),G=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),H=Y.newStyled.div`
+  box-sizing: border-box;
+  cursor: ${n=>n.disabled==!1?"pointer":"context-menu"};
+  width: 100%;
+  border-radius: 6px;
+  display: flex;
+  align-items: center;
+  min-height: 2.25rem;
+  gap: 0.563rem;
+  padding: 0.563rem;
+  color: ${n=>l.getColorRgbaValue(n.theme,"MenuItem",n.color,"enabled","text")};
+  ${n=>l.getComponentTypographyCss(n.theme,"MenuItem",n.size,"enabled")};
+  & .menu-icon-lnc {
+    color: ${n=>n.isActive&&n.disabled==!1?l.getColorRgbaValue(n.theme,"MenuItem",n.color,"focus","icon"):l.getColorRgbaValue(n.theme,"MenuItem",n.color,"enabled","icon")};
+
+    ${n=>n.disabled===!0&&l.getDisabledStateCss(n.theme)};
+    background: transparent;
+  }
+  & .sub-menu-icon-lnc {
+    margin-left: auto;
+    transform: ${n=>n.showNested?"rotate(180deg)":"rotate(0)"};
+    transition: transform 0.25s ease;
+  }
+
+  ${n=>n.isActive==!0&&n.disabled==!1&&`background-color: ${l.getColorRgbaValue(n.theme,"MenuItem",n.color,"focus","background","backgroundOpacity")};
+    color: ${l.getColorRgbaValue(n.theme,"MenuItem",n.color,"focus","text")};
+  `}
+  outline: none;
+
+  ${n=>n.disabled===!0&&l.getDisabledStateCss(n.theme)};
+  &:hover {
+    ${n=>n.disabled==!1&&`background-color: ${l.getColorRgbaValue(n.theme,"MenuItem",n.color,"hover","background","backgroundOpacity")};
+      color: ${l.getColorRgbaValue(n.theme,"MenuItem",n.color,"hover","text")};
+      `}
+  }
+`,h=f.forwardRef((n,a)=>{const{value:T,active:r=null,icon:E,disabled:m=!1,isNested:d=!1,showNested:P,justifyToEnd:J=!1,onFocus:N=()=>{},onBlur:k=()=>{},onClick:C=()=>{},onKeyDown:v=()=>{},onMouseEnter:Q=()=>{},onMouseLeave:W=()=>{},toggleNested:u=()=>{},onItemSelected:w=()=>{},className:x="",style:_={},color:$="primary",iconProps:R,__TYPE__:X="MENU_ITEM",children:S,...A}=n,j={theme:G.useTheme(),color:$,style:_},y=f.useRef(),[q,g]=f.useState(r??!1);f.useEffect(()=>{g(r)},[r]);const O=e=>{m==!1&&(d&&u&&u(),w(e,T)),C(C)},D=e=>{g(!0),N(e)},V=e=>{r==null&&g(!1),k(e)},F=e=>{e.preventDefault(),e.key=="ArrowDown"?b(a?a.current:y.current):e.key=="ArrowUp"?p(a?a.current:y.current):(e.key=="Enter"||e.keyCode==32)&&m==!1&&(d&&u&&u(),w(e,T)),v(e)},b=e=>{if(e!=null&&e.nextSibling){let o=B(e);if(o!=null&&o.node&&(o==null?void 0:o.type)=="item")o.node.focus();else if(o!=null&&o.node&&(o==null?void 0:o.type)=="nested"){let i=z(o.node);i&&i.focus()}else e!=null&&e.parentElement&&t(e.parentElement,"nested-item-lnc")&&b(e.parentElement)}else e!=null&&e.parentElement&&t(e.parentElement,"nested-item-lnc")&&b(e.parentElement)},p=e=>{if(e!=null&&e.previousSibling){let o=K(e);if(o!=null&&o.node&&(o==null?void 0:o.type)=="item")o.node.focus();else if(o!=null&&o.node&&(o==null?void 0:o.type)=="nested"){let i=L(o.node);i&&i.focus()}else e!=null&&e.parentElement&&t(e.parentElement,"nested-item-lnc")&&p(e.parentElement)}else e!=null&&e.parentElement&&t(e.parentElement,"nested-item-lnc")&&p(e.parentElement)},B=e=>{for(;e=e.nextSibling;){if(t(e,"menu-item-lnc"))return{node:e,type:"item"};if(t(e,"nested-item-lnc"))return{node:e,type:"nested"}}return null},K=e=>{for(;e=e.previousSibling;){if(t(e,"menu-item-lnc"))return{node:e,type:"item"};if(t(e,"nested-item-lnc"))return{node:e,type:"nested"}}return null},z=e=>{var o;return(o=Array.from(e.querySelectorAll(".menu-item-lnc")))==null?void 0:o[0]},L=e=>{var o;return(o=Array.from(e.querySelectorAll(".menu-item-lnc")))==null?void 0:o.pop()},t=(e,o)=>{var i=" "+e.className+" ",U=" "+o+" ";return i.indexOf(U)!=-1};return c.jsx(c.Fragment,{children:c.jsxs(H,{ref:a||y,className:"menu-item-lnc "+(d?"nested-menu-item-lnc ":"")+(P?"spread-nested-item-lnc ":"")+x,...j,disabled:m,tabIndex:0,onKeyDown:F,onFocus:D,onBlur:V,onClick:O,isActive:q,showNested:P,...A,children:[E&&c.jsx(M,{icon:E,className:"menu-icon-lnc",...R}),c.jsx("div",{children:S}),d&&c.jsx(M,{icon:"angle-down",className:"sub-menu-icon-lnc"})]})})});h.propTypes={value:s.PropTypes.any,active:s.PropTypes.bool,icon:s.PropTypes.string,disabled:s.PropTypes.bool,isNested:s.PropTypes.bool,justifyToEnd:s.PropTypes.bool,onBlur:s.PropTypes.func,onFocus:s.PropTypes.func,onClick:s.PropTypes.func,onKeyDown:s.PropTypes.func,onMouseEnter:s.PropTypes.func,onMouseLeave:s.PropTypes.func,className:s.PropTypes.string,style:s.PropTypes.object,color:s.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),iconProps:s.PropTypes.any,size:s.PropTypes.oneOf(["small","medium","large"]),__TYPE__:s.PropTypes.string};h.displayName="MENU_ITEM";module.exports=h;

package/dist/MenuItem.js

@@ -0,0 +1,230 @@
+import { jsx as m, Fragment as V, jsxs as G } from "react/jsx-runtime";
+import H, { useRef as J, useState as Q, useEffect as W } from "react";
+import { P as o } from "./index-Ds9PUTwb.js";
+import { n as X } from "./emotion-styled.browser.esm-BZSYYThs.js";
+import k from "./Icon.js";
+import { b as i, a as Z, g as v } from "./utils-DEke8iwo.js";
+import { u as I } from "./emotion-element-5486c51c.browser.esm-CSejtOeT.js";
+const ee = X.div`
+  box-sizing: border-box;
+  cursor: ${(n) => n.disabled == !1 ? "pointer" : "context-menu"};
+  width: 100%;
+  border-radius: 6px;
+  display: flex;
+  align-items: center;
+  min-height: 2.25rem;
+  gap: 0.563rem;
+  padding: 0.563rem;
+  color: ${(n) => i(n.theme, "MenuItem", n.color, "enabled", "text")};
+  ${(n) => Z(n.theme, "MenuItem", n.size, "enabled")};
+  & .menu-icon-lnc {
+    color: ${(n) => n.isActive && n.disabled == !1 ? i(
+  n.theme,
+  "MenuItem",
+  n.color,
+  "focus",
+  "icon"
+) : i(
+  n.theme,
+  "MenuItem",
+  n.color,
+  "enabled",
+  "icon"
+)};
+
+    ${(n) => n.disabled === !0 && v(n.theme)};
+    background: transparent;
+  }
+  & .sub-menu-icon-lnc {
+    margin-left: auto;
+    transform: ${(n) => n.showNested ? "rotate(180deg)" : "rotate(0)"};
+    transition: transform 0.25s ease;
+  }
+
+  ${(n) => n.isActive == !0 && n.disabled == !1 && `background-color: ${i(
+  n.theme,
+  "MenuItem",
+  n.color,
+  "focus",
+  "background",
+  "backgroundOpacity"
+)};
+    color: ${i(
+  n.theme,
+  "MenuItem",
+  n.color,
+  "focus",
+  "text"
+)};
+  `}
+  outline: none;
+
+  ${(n) => n.disabled === !0 && v(n.theme)};
+  &:hover {
+    ${(n) => n.disabled == !1 && `background-color: ${i(
+  n.theme,
+  "MenuItem",
+  n.color,
+  "hover",
+  "background",
+  "backgroundOpacity"
+)};
+      color: ${i(
+  n.theme,
+  "MenuItem",
+  n.color,
+  "hover",
+  "text"
+)};
+      `}
+  }
+`, C = H.forwardRef((n, a) => {
+  const {
+    value: g,
+    active: c = null,
+    icon: E,
+    disabled: r = !1,
+    isNested: d = !1,
+    showNested: M,
+    justifyToEnd: ne = !1,
+    //----------------
+    onFocus: p = () => {
+    },
+    onBlur: $ = () => {
+    },
+    onClick: w = () => {
+    },
+    onKeyDown: _ = () => {
+    },
+    onMouseEnter: le = () => {
+    },
+    onMouseLeave: oe = () => {
+    },
+    toggleNested: f = () => {
+    },
+    onItemSelected: N = () => {
+    },
+    //----------------
+    className: x = "",
+    style: A = {},
+    color: S = "primary",
+    iconProps: T,
+    __TYPE__: te = "MENU_ITEM",
+    children: O,
+    ...P
+  } = n, D = { theme: I(), color: S, style: A }, u = J(), [F, y] = Q(c ?? !1);
+  W(() => {
+    y(c);
+  }, [c]);
+  const j = (e) => {
+    r == !1 && (d && f && f(), N(e, g)), w(w);
+  }, R = (e) => {
+    y(!0), p(e);
+  }, B = (e) => {
+    c == null && y(!1), $(e);
+  }, K = (e) => {
+    e.preventDefault(), e.key == "ArrowDown" ? b(a ? a.current : u.current) : e.key == "ArrowUp" ? h(a ? a.current : u.current) : (e.key == "Enter" || e.keyCode == 32) && r == !1 && (d && f && f(), N(e, g)), _(e);
+  }, b = (e) => {
+    if (e != null && e.nextSibling) {
+      let l = z(e);
+      if (l != null && l.node && (l == null ? void 0 : l.type) == "item")
+        l.node.focus();
+      else if (l != null && l.node && (l == null ? void 0 : l.type) == "nested") {
+        let s = U(l.node);
+        s && s.focus();
+      } else e != null && e.parentElement && t(e.parentElement, "nested-item-lnc") && b(e.parentElement);
+    } else e != null && e.parentElement && t(e.parentElement, "nested-item-lnc") && b(e.parentElement);
+  }, h = (e) => {
+    if (e != null && e.previousSibling) {
+      let l = L(e);
+      if (l != null && l.node && (l == null ? void 0 : l.type) == "item")
+        l.node.focus();
+      else if (l != null && l.node && (l == null ? void 0 : l.type) == "nested") {
+        let s = q(l.node);
+        s && s.focus();
+      } else e != null && e.parentElement && t(e.parentElement, "nested-item-lnc") && h(e.parentElement);
+    } else e != null && e.parentElement && t(e.parentElement, "nested-item-lnc") && h(e.parentElement);
+  }, z = (e) => {
+    for (; e = e.nextSibling; ) {
+      if (t(e, "menu-item-lnc"))
+        return { node: e, type: "item" };
+      if (t(e, "nested-item-lnc"))
+        return { node: e, type: "nested" };
+    }
+    return null;
+  }, L = (e) => {
+    for (; e = e.previousSibling; ) {
+      if (t(e, "menu-item-lnc"))
+        return { node: e, type: "item" };
+      if (t(e, "nested-item-lnc"))
+        return { node: e, type: "nested" };
+    }
+    return null;
+  }, U = (e) => {
+    var l;
+    return (l = Array.from(e.querySelectorAll(".menu-item-lnc"))) == null ? void 0 : l[0];
+  }, q = (e) => {
+    var l;
+    return (l = Array.from(e.querySelectorAll(".menu-item-lnc"))) == null ? void 0 : l.pop();
+  }, t = (e, l) => {
+    var s = " " + e.className + " ", Y = " " + l + " ";
+    return s.indexOf(Y) != -1;
+  };
+  return /* @__PURE__ */ m(V, { children: /* @__PURE__ */ G(
+    ee,
+    {
+      ref: a || u,
+      className: "menu-item-lnc " + (d ? "nested-menu-item-lnc " : "") + (M ? "spread-nested-item-lnc " : "") + x,
+      ...D,
+      disabled: r,
+      tabIndex: 0,
+      onKeyDown: K,
+      onFocus: R,
+      onBlur: B,
+      onClick: j,
+      isActive: F,
+      showNested: M,
+      ...P,
+      children: [
+        E && /* @__PURE__ */ m(k, { icon: E, className: "menu-icon-lnc", ...T }),
+        /* @__PURE__ */ m("div", { children: O }),
+        d && /* @__PURE__ */ m(k, { icon: "angle-down", className: "sub-menu-icon-lnc" })
+      ]
+    }
+  ) });
+});
+C.propTypes = {
+  value: o.any,
+  active: o.bool,
+  icon: o.string,
+  disabled: o.bool,
+  isNested: o.bool,
+  justifyToEnd: o.bool,
+  //---------------------------------------------------------------
+  onBlur: o.func,
+  onFocus: o.func,
+  onClick: o.func,
+  onKeyDown: o.func,
+  onMouseEnter: o.func,
+  onMouseLeave: o.func,
+  //---------------------------------------------------------------
+  className: o.string,
+  style: o.object,
+  color: o.oneOf([
+    "primary",
+    "secondary",
+    "success",
+    "warning",
+    "danger",
+    "information",
+    "neutral",
+    "gray"
+  ]),
+  iconProps: o.any,
+  size: o.oneOf(["small", "medium", "large"]),
+  __TYPE__: o.string
+};
+C.displayName = "MENU_ITEM";
+export {
+  C as default
+};

package/dist/Modal.cjs

@@ -0,0 +1,84 @@
+"use strict";const t=require("react/jsx-runtime"),y=require("react"),o=require("./index-DXnSjbfJ.cjs"),j=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),_=require("./Icon.cjs"),w=require("./utils-hdRGTsQ7.cjs"),D=require("./index-C29T0m2a.cjs"),L=require("./motion-Oud-wpUz.cjs"),V=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),E=require("./index-BP5r5zGN.cjs"),x="5rem",h="3.8rem",l="1.5rem",G=(e,r,n)=>r&&n?e=="FULL"?`calc(100dvh - ${h} - ${x})`:`calc(100dvh - ${h} - ${x} - ${l})`:r?e=="FULL"?`calc(100dvh - ${h})`:`calc(100dvh - ${h} - ${l})`:n?e=="FULL"?`calc(100dvh - ${x})`:`calc(100dvh - ${x} - ${l})`:e=="FULL"?"100dvh":`calc(100dvh - ${l})`,W=e=>e=="FULL"?"100vw":`calc(100vw - ${l})`,X=(e,r,n)=>e=="FULL"?"0":`${r?"0":"16px"} 0 ${n?"0":"16px"} 0`,J=j.newStyled(L.motion.div)`
+  position: ${e=>e.scrollOverlay==!0?"absolute":"fixed"};
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: ${e=>e.scrollOverlay===!0?"transparent":e.overlayColor};
+  z-index: ${e=>e.zIndex};
+  display: flex;
+`,K=j.newStyled(L.motion.div)`
+  position: relative;
+  width: 50%;
+  background-color: white;
+  ${e=>e.scrollOverlay==!1?"position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);":"height: fit-content; margin-right: auto; margin-left: auto;"}
+  background-color: ${e=>w.getColorRgbaValue(e.theme,"Modal","default","enabled","bg")};
+  z-index: ${e=>e.zIndex};
+  width: ${e=>Z[e.size.toUpperCase()]};
+  max-width: ${e=>W(e.size.toUpperCase())};
+  box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.1),
+    0px 10px 10px -5px rgba(0, 0, 0, 0.04);
+  border-radius: ${e=>e.size.toUpperCase()!="FULL"?"16px":"0"};
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+
+  & .lnc-modal-header {
+    max-height: ${h};
+    overflow: hidden;
+    padding: ${l} ${l} 0 ${l};
+  }
+  & .lnc-modal-header > h1,
+  h2,
+  h3 {
+    margin: 0;
+  }
+  & .lnc-modal-footer {
+    max-height: ${x};
+    overflow: hidden;
+    padding-top: 1rem;
+  }
+  ${e=>e.size.toUpperCase()=="FULL"&&"height: 100dvh"};
+
+  & .lnc-modal-content {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    scrollbar-width: thin;
+    ${e=>e.scrollOverlay==!1&&`max-height: ${G(e.size.toUpperCase(),e.header,e.footer)};`}
+    overflow: auto;
+    margin: ${e=>X(e.size,e.header,e.footer)};
+    padding: 0 ${l} 0 ${l};
+  }
+`,Q=j.newStyled.div`
+  position: absolute;
+  cursor: pointer;
+  top: 1.375rem;
+  right: 1.375rem;
+  color: ${e=>w.getColorRgbaValue(e.theme,"Modal","primary","enabled","cancelButton")};
+  height: 1.5rem;
+  width: 1.5rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 4px;
+  & i {
+    font-size: 1.125rem;
+  }
+
+  &:hover {
+    background-color: ${e=>w.getColorRgbaValue(e.theme,"Modal","primary","hover","cancelBtnBg","cancelBtnBgOpacity")};
+  }
+  &:focus {
+    background-color: ${e=>w.getColorRgbaValue(e.theme,"Modal","primary","focus","cancelBtnBg","cancelBtnBgOpacity")};
+  }
+`,Y=j.newStyled(L.motion.div)`
+  display: ${e=>e.scrollOverlay===!0?"block":"none"};
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  background-color: ${e=>e.overlayColor};
+  z-index: 3;
+`,N=y.forwardRef((e,r)=>{const{portalElement:n=document.body,isOpen:s=!1,header:d,footer:a,scrollOverlay:i=!1,overlay:c=!0,overlayColor:p="rgba(0, 0, 0, 0.3)",showCloseButton:u=!0,onOpen:f=()=>{},onClose:g=()=>{},zIndex:C=1e3,size:$="fluid",clickOutsideToClose:v=!0,className:b="",style:A={},overlayProps:O,overlayAnimation:P={animate:{opacity:1},exit:{opacity:0},initial:{opacity:0},transition:{type:"spring",duration:.6}},modalAnimation:F={animate:{opacity:1},exit:{opacity:0},initial:{opacity:0},transition:{type:"spring",duration:.6}},children:U,rest:z}=e,M=y.useRef(),[R,k]=y.useState(s);let B={theme:V.useTheme(),size:$,zIndex:C,className:b,style:A};const S=m=>{m.target===m.currentTarget&&v&&T(m)};y.useImperativeHandle(r,()=>({open(){H()},close(){T()},isOpen(){return R}}));const H=m=>{k(!0),f(m)},T=m=>{k(!1),g(m)};return t.jsx(t.Fragment,{children:R&&t.jsx(t.Fragment,{children:n?t.jsx(t.Fragment,{children:D.reactDomExports.createPortal(t.jsx(q,{ref:M,overlay:c,scrollOverlay:i,onClickOutsideModal:S,overlayColor:p,overlayProps:O,overlayAnimation:P,modalAnimation:F,themeProps:B,showCloseButton:u,close:T,header:d,footer:a,isOpen:s,...z,children:U}),n)}):t.jsx(q,{ref:M,overlay:c,scrollOverlay:i,onClickOutsideModal:S,overlayColor:p,overlayProps:O,overlayAnimation:P,modalAnimation:F,themeProps:B,showCloseButton:u,close:T,header:d,footer:a,isOpen:s,...z,children:U})})})}),q=y.forwardRef(({overlay:e,scrollOverlay:r,onClickOutsideModal:n,overlayColor:s,overlayProps:d,overlayAnimation:a,modalAnimation:i,themeProps:c,showCloseButton:p,header:u,footer:f,close:g,isOpen:C,children:$,...v},b)=>t.jsx(E.AnimatePresence,{children:e?t.jsxs(t.Fragment,{children:[t.jsx(Y,{scrollOverlay:r,onClick:n,overlayColor:s,...d,...a}),t.jsx(J,{...c,onClick:n,scrollOverlay:r,overlayColor:s,isOpen:C,...d,...a,children:t.jsx(I,{ref:b,themeProps:c,scrollOverlay:r,modalAnimation:i,showCloseButton:p,close:g,header:u,footer:f,...v,children:$})})]}):t.jsx(I,{ref:b,themeProps:c,modalAnimation:i,showCloseButton:p,close:g,header:u,footer:f,...v,children:$})})),I=y.forwardRef(({themeProps:e,scrollOverlay:r,modalAnimation:n,showCloseButton:s,close:d,header:a,footer:i,children:c,...p},u)=>t.jsx(E.AnimatePresence,{children:t.jsxs(K,{ref:u,...e,...n,header:a,footer:i,scrollOverlay:r,...p,className:`modal-lnc-container ${e==null?void 0:e.className}`,children:[s&&t.jsx(Q,{...e,className:"modal-lnc-times",onClick:d,children:t.jsx(_,{icon:"times"})}),a&&t.jsx("div",{className:"lnc-modal-header",children:a}),t.jsx("div",{className:"lnc-modal-content",children:c}),i&&t.jsx("div",{className:"lnc-modal-footer",children:i})]})}));N.propTypes={portalElement:o.PropTypes.any,isOpen:o.PropTypes.bool,header:o.PropTypes.oneOfType([o.PropTypes.string,o.PropTypes.element]),footer:o.PropTypes.oneOfType([o.PropTypes.string,o.PropTypes.element]),showCloseButton:o.PropTypes.bool,overlay:o.PropTypes.bool,scrollOverlay:o.PropTypes.bool,onOpen:o.PropTypes.func,onClose:o.PropTypes.func,zIndex:o.PropTypes.number,clickOutsideToClose:o.PropTypes.bool,overlayColor:o.PropTypes.string,overlayAnimation:o.PropTypes.object,modalAnimation:o.PropTypes.object,className:o.PropTypes.string,style:o.PropTypes.object,size:o.PropTypes.oneOf(["fluid","xs","s","m","l","xl","full"]),overlayProps:o.PropTypes.any};const Z={FLUID:"max-content",XS:"320px",S:"412px",M:"672px",L:"1112px",XL:"1376px",FULL:"100vw"};module.exports=N;