UNPKG

@lanaco/lnc-react-ui

Version:

React component library

31 lines (27 loc) 3.07 kB
"use strict";const s=require("react/jsx-runtime"),p=require("react"),m=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),e=require("./index-BPVoEhTF.cjs"),N=require("./Icon.cjs"),k=require("./DropdownMenu.cjs"),q=require("./DropdownItem.cjs"),z=require("./index-gY9e_8LL.cjs"),C=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),R="_Action_bw0a9_5",$={Action:R},K=p.forwardRef(({active:r,className:n,cursor:a,style:t,...l},i)=>s.jsx("button",{ref:i,...l,className:z.classNames($.Action,n),tabIndex:0,style:{...t,cursor:a,"--fill":r==null?void 0:r.fill,"--background":r==null?void 0:r.background}})),u=p.forwardRef((r,n)=>s.jsx(K,{ref:n,cursor:"grab","data-cypress":"draggable-handle",...r,children:s.jsx("svg",{viewBox:"0 0 20 20",width:"12",children:s.jsx("path",{d:"M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z"})})})),O=m.newStyled.div` height: 100%; width: 100%; padding: ${r=>`18px 20px 18px ${r.handle==!0?"10px":"20px"}`}; position: relative; word-wrap: break-word; white-space: pre-wrap; word-break: break-word; display: flex; gap: 8px; & .card-action-lnc { position: absolute; right: 10px; cursor: pointer; } & > .kanban-card-content { ${r=>r.clickable&&"cursor: pointer;"} } `,S=m.newStyled.div` display: flex; & > *:first-of-type:not(:last-of-type) { opacity: 0; } & > *:first-of-type:not(:last-of-type):focus-visible { opacity: 1; } `,y=p.memo(p.forwardRef(({__TYPE__:r="KANBAN_CARD",id:n,containerId:a,item:t,handle:l=!0,handleProps:i,actionsMenu:b=!1,actions:c=[],onDetails:d,color:f="primary",size:x="small",className:w="",style:A={},children:T,...g},h)=>{const P=C.useTheme();return s.jsxs(O,{ref:h,handle:l,theme:P,className:w,style:A,clickable:!!d,...g,children:[l&&s.jsx(S,{className:"Actions",children:s.jsx(u,{...i})}),b&&s.jsx(k,{className:"card-action-lnc",horizontalAlignment:"right",verticalAlignment:"bottom",color:f,size:x,control:s.jsx(N,{color:"neutral",className:"card-action-lnc",icon:"ellipsis-v"}),children:c==null?void 0:c.map((o,_)=>{if((o==null?void 0:o.show)!=!1)return s.jsx(q,{icon:o.icon,disabled:o.enable==!1,onClick:j=>o.onAction(j,t,a),children:o.name},_)})}),s.jsx("div",{className:"kanban-card-content-lnc",onClick:o=>{d&&d(o,t,a)},children:T})]})}));y.propTypes={__TYPE__:e.PropTypes.string,id:e.PropTypes.oneOfType([e.PropTypes.string,e.PropTypes.number]),containerId:e.PropTypes.oneOfType([e.PropTypes.string,e.PropTypes.number]),className:e.PropTypes.string,style:e.PropTypes.object,handle:e.PropTypes.bool,handleProps:e.PropTypes.any,actionsMenu:e.PropTypes.bool,actions:e.PropTypes.array,onDetails:e.PropTypes.func,color:e.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:e.PropTypes.oneOf(["small","medium","large"])};y.displayName="KANBAN_CARD";exports.Handle=u;exports.KanbanCard=y;