@blocklet/labels 1.4.11 → 1.4.13

package/dist/index.umd.js

@@ -1,4 +1,4 @@
-(function(s,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react"),require("@mui/icons-material/ExpandMore"),require("@mui/material/Box"),require("@mui/material/styles"),require("react-arborist"),require("@iconify/react"),require("react/jsx-runtime"),require("lodash/omit"),require("react-select"),require("@mui/material/Typography"),require("@mui/material/Button"),require("@mui/material/IconButton"),require("@mui/icons-material/DeleteOutlineOutlined"),require("@mui/icons-material/EditOutlined"),require("@mui/icons-material/Add"),require("react-use/lib/useSetState"),require("@mui/material/TextField"),require("@mui/base/ClickAwayListener"),require("react-color"),require("@arcblock/ux/lib/Dialog"),require("@mui/material/Alert"),require("@mui/icons-material/Edit"),require("@mui/icons-material/LabelOutlined"),require("@mui/material/ClickAwayListener"),require("@mui/material/Chip")):typeof define=="function"&&define.amd?define(["exports","react","@mui/icons-material/ExpandMore","@mui/material/Box","@mui/material/styles","react-arborist","@iconify/react","react/jsx-runtime","lodash/omit","react-select","@mui/material/Typography","@mui/material/Button","@mui/material/IconButton","@mui/icons-material/DeleteOutlineOutlined","@mui/icons-material/EditOutlined","@mui/icons-material/Add","react-use/lib/useSetState","@mui/material/TextField","@mui/base/ClickAwayListener","react-color","@arcblock/ux/lib/Dialog","@mui/material/Alert","@mui/icons-material/Edit","@mui/icons-material/LabelOutlined","@mui/material/ClickAwayListener","@mui/material/Chip"],f):(s=typeof globalThis<"u"?globalThis:s||self,f(s.DiscussKitComponents={},s.React,s.ExpandMoreIcon,s.Box,s.styles,s.reactArborist,s.react$1,s.jsxRuntime,s.omit,s.Select,s.Typography,s.Button,s.IconButton,s.DeleteOutlineOutlinedIcon,s.EditOutlinedIcon,s.AddIcon,s.useSetState,s.TextField,s.ClickAwayListener,s.reactColor,s.Dialog,s.Alert,s.EditIcon,s.LabelOutlinedIcon,s.ClickAwayListener$1,s.Chip))})(this,function(s,f,j,H,B,K,$,e,Q,T,J,U,Z,G,Y,X,R,ee,te,re,ne,le,ae,oe,ie,se){"use strict";const C=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},E=C(j),m=C(H),de=C(Q),ce=C(T),ue=C(J),k=C(U),A=C(Z),fe=C(G),he=C(Y),pe=C(X),me=C(R),q=C(ee),ye=C(te),D=C(ne),ge=C(le),xe=C(ae),Ce=C(oe),be=C(ie),ve=C(se),Se=t=>e.jsx("svg",{viewBox:"0 0 24 24",width:"1.2em",height:"1.2em",...t,children:e.jsx("path",{fill:"currentColor",d:"M5 19q-.825 0-1.413-.587Q3 17.825 3 17V7q0-.825.587-1.412Q4.175 5 5 5h10q.5 0 .938.225q.437.225.712.625l3.525 5q.375.525.375 1.15q0 .625-.375 1.15l-3.525 5q-.275.4-.712.625Q15.5 19 15 19Z"})}),we=t=>e.jsx("svg",{viewBox:"0 0 24 24",width:"1.2em",height:"1.2em",...t,children:e.jsx("path",{fill:"currentColor",d:"m10 16.4l-4-4L7.4 11l2.6 2.6L16.6 7L18 8.4Z"})}),P=f.createContext({});function Ie({selectable:t=!1,selected:r=[],onSelect:a,renderItem:o,children:l}){const n=p=>r.indexOf(p)!==-1,i=p=>{Array.from(new Set(r).add(p)),a==null||a(p)},d=f.useMemo(()=>({selectable:t,selected:r,isSelected:n,select:i,renderItem:o}),[r]);return e.jsx(P.Provider,{value:d,children:l})}const _e=t=>{var r;return t.isLeaf||!((r=t.data.children)!=null&&r.length)};function ke({node:t}){return _e(t)?e.jsx("span",{}):t.isOpen?e.jsx(E.default,{style:{fontSize:20}}):e.jsx(E.default,{style:{fontSize:20,transform:"rotate(-90deg)"}})}function Le({node:t,style:r,dragHandle:a}){const{selectable:o,select:l,isSelected:n,renderItem:i}=f.useContext(P),{data:d}=t,p=d.icon?e.jsx($.Icon,{icon:d.icon,style:{fontSize:18}}):e.jsx(Se,{style:{fontSize:18,color:d.color||"#ddd"}}),h=y=>{y.stopPropagation(),t.isInternal&&t.toggle()},x=y=>{y.stopPropagation(),o&&l(t.id)},g=e.jsxs(e.Fragment,{children:[e.jsxs(m.default,{sx:{display:"flex",alignItems:"center",flex:1},children:[e.jsx(m.default,{sx:{display:"flex",cursor:"pointer"},onClick:h,children:e.jsx(ke,{node:t})}),e.jsx(m.default,{sx:{display:"flex",alignItems:"center",width:22,height:22},children:p}),e.jsx(m.default,{component:"span",sx:{color:"grey.700"},children:t.data.name})]}),o&&n(t.id)&&e.jsx(we,{})]});return e.jsxs(m.default,{className:"label-tree-item",style:r,sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},ref:a,onClick:x,children:[!i&&g,!!i&&i(g,t.data)]})}const Ae=B.styled(m.default)`
+(function(s,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react"),require("@mui/icons-material/ExpandMore"),require("@mui/material/Box"),require("@mui/material/styles"),require("react-arborist"),require("@iconify/react"),require("react/jsx-runtime"),require("lodash/omit"),require("react-select"),require("@mui/material/Typography"),require("@mui/material/Button"),require("@mui/material/IconButton"),require("@mui/icons-material/DeleteOutlineOutlined"),require("@mui/icons-material/EditOutlined"),require("@mui/icons-material/Add"),require("react-use/lib/useSetState"),require("@mui/material/TextField"),require("@mui/base/ClickAwayListener"),require("react-color"),require("@arcblock/ux/lib/Dialog"),require("@mui/material"),require("@mui/icons-material/Translate"),require("@mui/material/Popover"),require("@arcblock/ux/lib/Locale/context"),require("@mui/material/Alert"),require("@mui/icons-material/Edit"),require("@mui/icons-material/LabelOutlined"),require("@mui/material/ClickAwayListener"),require("@mui/material/Chip")):typeof define=="function"&&define.amd?define(["exports","react","@mui/icons-material/ExpandMore","@mui/material/Box","@mui/material/styles","react-arborist","@iconify/react","react/jsx-runtime","lodash/omit","react-select","@mui/material/Typography","@mui/material/Button","@mui/material/IconButton","@mui/icons-material/DeleteOutlineOutlined","@mui/icons-material/EditOutlined","@mui/icons-material/Add","react-use/lib/useSetState","@mui/material/TextField","@mui/base/ClickAwayListener","react-color","@arcblock/ux/lib/Dialog","@mui/material","@mui/icons-material/Translate","@mui/material/Popover","@arcblock/ux/lib/Locale/context","@mui/material/Alert","@mui/icons-material/Edit","@mui/icons-material/LabelOutlined","@mui/material/ClickAwayListener","@mui/material/Chip"],f):(s=typeof globalThis<"u"?globalThis:s||self,f(s.DiscussKitComponents={},s.React,s.ExpandMoreIcon,s.Box,s.styles,s.reactArborist,s.react$1,s.jsxRuntime,s.omit,s.Select,s.Typography,s.Button,s.IconButton,s.DeleteOutlineOutlinedIcon,s.EditOutlinedIcon,s.AddIcon,s.useSetState,s.TextField,s.ClickAwayListener,s.reactColor,s.Dialog,s.material,s.TranslateIcon,s.Popover,s.context,s.Alert,s.EditIcon,s.LabelOutlinedIcon,s.ClickAwayListener$1,s.Chip))})(this,function(s,f,K,$,E,Q,U,e,Y,B,Z,G,X,R,ee,te,re,ne,le,oe,ae,k,se,ie,D,de,ce,ue,fe,he){"use strict";const b=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},N=b(K),g=b($),pe=b(Y),ge=b(B),me=b(Z),T=b(G),L=b(X),xe=b(R),ye=b(ee),Ce=b(te),ve=b(re),M=b(ne),be=b(le),F=b(ae),Ie=b(se),Se=b(ie),we=b(de),_e=b(ce),ke=b(ue),Te=b(fe),qe=b(he),Ae=t=>e.jsx("svg",{viewBox:"0 0 24 24",width:"1.2em",height:"1.2em",...t,children:e.jsx("path",{fill:"currentColor",d:"M5 19q-.825 0-1.413-.587Q3 17.825 3 17V7q0-.825.587-1.412Q4.175 5 5 5h10q.5 0 .938.225q.437.225.712.625l3.525 5q.375.525.375 1.15q0 .625-.375 1.15l-3.525 5q-.275.4-.712.625Q15.5 19 15 19Z"})}),Le=t=>e.jsx("svg",{viewBox:"0 0 24 24",width:"1.2em",height:"1.2em",...t,children:e.jsx("path",{fill:"currentColor",d:"m10 16.4l-4-4L7.4 11l2.6 2.6L16.6 7L18 8.4Z"})}),W=f.createContext({});function Oe({selectable:t=!1,selected:r=[],onSelect:c,renderItem:o,children:l}){const n=p=>r.indexOf(p)!==-1,a=p=>{Array.from(new Set(r).add(p)),c==null||c(p)},u=f.useMemo(()=>({selectable:t,selected:r,isSelected:n,select:a,renderItem:o}),[r]);return e.jsx(W.Provider,{value:u,children:l})}const ze=t=>{var r;return t.isLeaf||!((r=t.data.children)!=null&&r.length)};function Be({node:t}){return ze(t)?e.jsx("span",{}):t.isOpen?e.jsx(N.default,{style:{fontSize:20}}):e.jsx(N.default,{style:{fontSize:20,transform:"rotate(-90deg)"}})}function Me({node:t,style:r,dragHandle:c}){const{selectable:o,select:l,isSelected:n,renderItem:a}=f.useContext(W),{data:u}=t,p=u.icon?e.jsx(U.Icon,{icon:u.icon,style:{fontSize:18}}):e.jsx(Ae,{style:{fontSize:18,color:u.color||"#ddd"}}),y=i=>{i.stopPropagation(),t.isInternal&&t.toggle()},x=i=>{i.stopPropagation(),o&&l(t.id)},C=e.jsxs(e.Fragment,{children:[e.jsxs(g.default,{sx:{display:"flex",alignItems:"center",flex:1},children:[e.jsx(g.default,{sx:{display:"flex",cursor:"pointer"},onClick:y,children:e.jsx(Be,{node:t})}),e.jsx(g.default,{sx:{display:"flex",alignItems:"center",width:22,height:22},children:p}),e.jsx(g.default,{component:"span",sx:{color:"grey.700"},children:t.data.name})]}),o&&n(t.id)&&e.jsx(Le,{})]});return e.jsxs(g.default,{className:"label-tree-item",style:r,sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},ref:c,onClick:x,children:[!a&&C,!!a&&a(C,t.data)]})}const Pe=E.styled(g.default)`
   > div,
   > div > div,
   > div > div > div {
@@ -11,7 +11,7 @@
   .label-tree-item {
     width: 100%;
   }
-`;function z({data:t,selectable:r,selected:a=[],onSelect:o,rowHeight:l=28,renderItem:n,sx:i,...d}){const p=f.useRef(),h=[...Array.isArray(i)?i:[i]],[x,g]=f.useState(0),y=f.useCallback(()=>{var _,c;g((((c=(_=p.current)==null?void 0:_.visibleNodes)==null?void 0:c.length)||0)*l)},[l]);f.useEffect(()=>{y()},[t,y]);const S=()=>{setTimeout(y)};return e.jsx(Ie,{selectable:r,selected:a,onSelect:o,renderItem:n,children:e.jsx(Ae,{...d,sx:h,children:e.jsx(K.Tree,{data:t,rowHeight:l,height:x,indent:32,ref:p,onToggle:S,children:Le})})})}const O=t=>t.reduce((r,a)=>{var o;return r.push(a),(o=a.children)!=null&&o.length&&r.push(...O(a.children)),r},[]),F=t=>t.map(r=>{var a;return(a=r.children)!=null&&a.length&&(r.children=F(r.children)),r}),N=t=>{const r=t.reduce((l,n)=>(l[n.id]=l[n.id]||{},n.parentId&&(l[n.id].parent=n.parentId,l[n.parentId]=l[n.parentId]||{},l[n.parentId].children=l[n.parentId].children||[],l[n.parentId].children.push(n.id)),l),{}),a=t.map(({parentId:l,...n})=>({...n,children:[]})),o=a.reduce((l,n)=>({...l,[n.id]:n}),{});return a.forEach(l=>{const n=r[l.id];n.parent&&o[n.parent]&&(l.parent=o[n.parent]),n.children&&(l.children=n.children.map(i=>o[i]))}),a.filter(l=>!l.parent)},qe=t=>{const{options:r,getValue:a,selectProps:o,selectOption:l}=t,n=a(),i=d=>{const p=r.find(h=>h.data.id===d);p&&l(p)};return e.jsxs(e.Fragment,{children:[e.jsx(T.components.MenuList,{...de.default(t,["addon"]),children:e.jsx(m.default,{sx:{px:2,py:1},children:e.jsx(z,{data:o.data,selectable:!0,onSelect:i,selected:n.map(d=>d.data.id)})})}),t.addon]})},ze=({children:t,...r})=>{const[a,o]=t,l=Array.isArray(a)?a.length:0;return e.jsxs(T.components.ValueContainer,{...r,children:[e.jsx(m.default,{component:"span",sx:{fontSize:13,fontWeight:"bold"},children:l?"Labels":"Filter by labels"}),!!l&&e.jsx(m.default,{sx:{display:"inline-flex",justifyContent:"center",alignItems:"center",width:22,height:22,ml:1,borderRadius:"100%",fontSize:12,bgcolor:"grey.200"},children:l}),o]})},Oe={control:t=>({...t,minHeight:31}),valueContainer:t=>({...t,display:"flex"}),dropdownIndicator:t=>({...t,padding:"0 4px"}),clearIndicator:t=>({...t,padding:"4px"})};function V({data:t,value:r=[],editable:a=!1,addon:o,onChange:l,compact:n,...i}){const d=f.useRef(null),p=f.useMemo(()=>O(t).map(c=>({data:c,label:c.name,value:c.id})),[t]),h=p.reduce((c,w)=>({...c,[w.data.id]:w}),{}),x=Array.isArray(r)?r:[r],g=x.map(c=>h[c]),y=f.useRef({prev:x.map(c=>h[c].data)}),S=(c,w)=>{y.current.current=c.map(L=>L.data),["clear","remove-value"].includes(w.action)&&d.current&&setTimeout(()=>{var L;return(L=d==null?void 0:d.current)==null?void 0:L.blur()},1)},_=()=>{y.current.current&&JSON.stringify(y.current.prev.map(w=>w.id))!==JSON.stringify(y.current.current.map(w=>w.id))&&(l(y.current.current),y.current.prev=y.current.current)};return e.jsx(m.default,{...i,children:e.jsx(ce.default,{ref:d,defaultValue:g,options:p,onChange:S,components:{MenuList:c=>e.jsx(qe,{...c,addon:o}),...n&&{ValueContainer:ze}},placeholder:"Select labels",styles:{...n&&Oe,menu:c=>({...c,...a&&{paddingBottom:"36px"},zIndex:99}),menuList:c=>({...c,overflowY:"auto",maxHeight:"264px"})},theme:c=>({...c,colors:{...c.colors,primary25:"#ddd",primary50:"#ddd",primary:"#ddd"}}),isSearchable:!1,isMulti:!0,closeMenuOnSelect:!1,onMenuClose:_,data:t})})}function Te({open:t,initialLabel:r,onSubmit:a,onClose:o,...l}){const n=!(r!=null&&r.id),[i,d]=me.default({name:(r==null?void 0:r.name)||"",color:(r==null?void 0:r.color)||"#ddd",slug:(r==null?void 0:r.id)||""}),p=c=>/^#([0-9A-F]{3}){1,2}$/i.test(c),h=f.useMemo(()=>n?i.name&&i.color&&i.slug&&p(i.color):i.name&&i.color&&p(i.color),[i,n]),[x,g]=f.useState(!1),y=()=>{a({...r,name:i.name,color:i.color,id:i.slug})},S=c=>{d({color:c.hex}),setTimeout(()=>g(!1))},_=c=>{d({color:c.target.value})};return e.jsx(D.default,{open:t,showCloseButton:!0,maxWidth:"lg",title:n?"Create label":"Edit label",actions:e.jsxs(e.Fragment,{children:[e.jsx(k.default,{color:"inherit",variant:"contained",size:"small",onClick:o,children:"Cancel"}),e.jsx(k.default,{color:"primary",variant:"contained",size:"small",onClick:y,disabled:!h,children:n?"Create":"Save Changes"})]}),onClose:o,...l,children:e.jsxs(m.default,{width:600,minHeight:280,children:[e.jsx(m.default,{sx:{position:"relative",zIndex:9999},children:e.jsx(q.default,{label:"Name",value:i.name,placeholder:"New label",size:"small",fullWidth:!0,onChange:c=>d({name:c.target.value})})}),e.jsx(q.default,{label:"Slug",value:i.slug,size:"small",fullWidth:!0,disabled:!n,onChange:c=>d({slug:c.target.value}),sx:{mt:2}}),(r==null?void 0:r.parent)&&e.jsx(q.default,{label:"Parent",value:r.parent.name,size:"small",fullWidth:!0,disabled:!0,sx:{mt:2}}),e.jsx(ye.default,{onClickAway:()=>g(!1),children:e.jsxs(m.default,{sx:{position:"relative",mt:2},children:[e.jsxs(m.default,{sx:{display:"flex",alignItems:"center",gap:1},children:[e.jsx(m.default,{sx:{width:30,height:30,bgcolor:i.color,borderRadius:1},onClick:()=>g(!0)}),e.jsx(q.default,{label:"",value:i.color,size:"small",onChange:_,inputProps:{maxLength:7},sx:{width:100,".MuiInputBase-root":{height:32}}})]}),x&&e.jsx(m.default,{sx:{position:"absolute",top:48,zIndex:1},children:e.jsx(re.GithubPicker,{color:i.color,onChangeComplete:S})})]})})]})})}function Me({open:t,label:r,onSubmit:a,onClose:o,...l}){return e.jsx(D.default,{open:t,showCloseButton:!0,maxWidth:"md",title:"Delete",actions:e.jsxs(e.Fragment,{children:[e.jsx(k.default,{color:"inherit",variant:"contained",size:"small",onClick:o,children:"Cancel"}),e.jsx(k.default,{color:"primary",variant:"contained",size:"small",onClick:a,children:"Delete"})]}),onClose:o,...l,children:e.jsxs(m.default,{width:600,minHeight:280,children:[e.jsx(ge.default,{severity:"info",sx:{mb:2},children:"Are you sure you want to delete these labels ?"}),e.jsx(z,{data:[r]})]})})}const Be=B.styled(z)`
+`;function O({data:t,selectable:r,selected:c=[],onSelect:o,rowHeight:l=28,renderItem:n,sx:a,...u}){const p=f.useRef(),y=[...Array.isArray(a)?a:[a]],[x,C]=f.useState(0),i=f.useCallback(()=>{var S,d;C((((d=(S=p.current)==null?void 0:S.visibleNodes)==null?void 0:d.length)||0)*l)},[l]);f.useEffect(()=>{i()},[t,i]);const m=()=>{setTimeout(i)};return e.jsx(Oe,{selectable:r,selected:c,onSelect:o,renderItem:n,children:e.jsx(Pe,{...u,sx:y,children:e.jsx(Q.Tree,{data:t,rowHeight:l,height:x,indent:32,ref:p,onToggle:m,children:Me})})})}const z=t=>t.reduce((r,c)=>{var o;return r.push(c),(o=c.children)!=null&&o.length&&r.push(...z(c.children)),r},[]),j=t=>t.map(r=>{var c;return(c=r.children)!=null&&c.length&&(r.children=j(r.children)),r}),Ee=(t,r=null)=>{try{return JSON.parse(t)}catch{return r}},V=t=>{const r=t.reduce((l,n)=>(l[n.id]=l[n.id]||{},n.parentId&&(l[n.id].parent=n.parentId,l[n.parentId]=l[n.parentId]||{},l[n.parentId].children=l[n.parentId].children||[],l[n.parentId].children.push(n.id)),l),{}),c=t.map(({parentId:l,translation:n,...a})=>({...a,translation:Ee(n),children:[]})),o=c.reduce((l,n)=>({...l,[n.id]:n}),{});return c.forEach(l=>{const n=r[l.id];n.parent&&o[n.parent]&&(l.parent=o[n.parent]),n.children&&(l.children=n.children.map(a=>o[a]))}),c.filter(l=>!l.parent)},De=t=>{const{options:r,getValue:c,selectProps:o,selectOption:l}=t,n=c(),a=u=>{const p=r.find(y=>y.data.id===u);p&&l(p)};return e.jsxs(e.Fragment,{children:[e.jsx(B.components.MenuList,{...pe.default(t,["addon"]),children:e.jsx(g.default,{sx:{px:2,py:1},children:e.jsx(O,{data:o.data,selectable:!0,onSelect:a,selected:n.map(u=>u.data.id)})})}),t.addon]})},Ne=({children:t,...r})=>{const[c,o]=t,l=Array.isArray(c)?c.length:0;return e.jsxs(B.components.ValueContainer,{...r,children:[e.jsx(g.default,{component:"span",sx:{fontSize:13,fontWeight:"bold"},children:l?"Labels":"Filter by labels"}),!!l&&e.jsx(g.default,{sx:{display:"inline-flex",justifyContent:"center",alignItems:"center",width:22,height:22,ml:1,borderRadius:"100%",fontSize:12,bgcolor:"grey.200"},children:l}),o]})},Fe={control:t=>({...t,minHeight:31}),valueContainer:t=>({...t,display:"flex"}),dropdownIndicator:t=>({...t,padding:"0 4px"}),clearIndicator:t=>({...t,padding:"4px"})};function H({data:t,value:r=[],editable:c=!1,addon:o,onChange:l,compact:n,...a}){const u=f.useRef(null),p=f.useMemo(()=>z(t).map(d=>({data:d,label:d.name,value:d.id})),[t]),y=p.reduce((d,_)=>({...d,[_.data.id]:_}),{}),x=Array.isArray(r)?r:[r],C=x.map(d=>y[d]),i=f.useRef({prev:x.map(d=>y[d].data)}),m=(d,_)=>{i.current.current=d.map(q=>q.data),["clear","remove-value"].includes(_.action)&&u.current&&setTimeout(()=>{var q;return(q=u==null?void 0:u.current)==null?void 0:q.blur()},1)},S=()=>{i.current.current&&JSON.stringify(i.current.prev.map(_=>_.id))!==JSON.stringify(i.current.current.map(_=>_.id))&&(l(i.current.current),i.current.prev=i.current.current)};return e.jsx(g.default,{...a,children:e.jsx(ge.default,{ref:u,defaultValue:C,options:p,onChange:m,components:{MenuList:d=>e.jsx(De,{...d,addon:o}),...n&&{ValueContainer:Ne}},placeholder:"Select labels",styles:{...n&&Fe,menu:d=>({...d,...c&&{paddingBottom:"36px"},zIndex:99}),menuList:d=>({...d,overflowY:"auto",maxHeight:"264px"})},theme:d=>({...d,colors:{...d.colors,primary25:"#ddd",primary50:"#ddd",primary:"#ddd"}}),isSearchable:!1,isMulti:!0,closeMenuOnSelect:!1,onMenuClose:S,data:t})})}function We({I18NProps:t,...r}){const{languages:c}=D.useLocaleContext(),{translation:o,onChange:l}=t,[n,a]=f.useState(null),u=x=>{const C=x.currentTarget.closest(".MuiInputBase-root");C&&a(C)},p=()=>{a(null)},y=c.filter(x=>x.code!=="en");return e.jsx(k.TextField,{...r,InputProps:{endAdornment:e.jsxs(k.InputAdornment,{position:"end",children:[e.jsx(k.IconButton,{edge:"end",onClick:u,children:e.jsx(Ie.default,{})}),e.jsx(Se.default,{open:!!n,anchorEl:n,onClose:p,transformOrigin:{vertical:"top",horizontal:"right"},anchorOrigin:{vertical:"bottom",horizontal:"right"},PaperProps:{sx:{width:n==null?void 0:n.clientWidth,maxHeight:200,overflowY:"auto",bgcolor:"grey.50"}},elevation:1,sx:{mt:2},children:e.jsx(k.Box,{sx:{p:2},children:y.map(({code:x,name:C})=>e.jsxs(k.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between","& + &":{mt:1}},children:[e.jsx(k.Box,{sx:{flex:"0 0 120px"},children:C}),e.jsx(k.Box,{sx:{flex:1},children:e.jsx(k.TextField,{value:o[x]||"",size:"small",sx:{width:1},onChange:i=>l({...o,[x]:i.target.value})})})]},x))})})]})}})}function je({open:t,initialLabel:r,onSubmit:c,onClose:o,...l}){const n=!(r!=null&&r.id),[a,u]=ve.default({name:(r==null?void 0:r.name)||"",color:(r==null?void 0:r.color)||"#ddd",slug:(r==null?void 0:r.id)||"",translation:(r==null?void 0:r.translation)||{}}),p=d=>/^#([0-9A-F]{3}){1,2}$/i.test(d),y=f.useMemo(()=>n?a.name&&a.color&&a.slug&&p(a.color):a.name&&a.color&&p(a.color),[a,n]),[x,C]=f.useState(!1),i=()=>{c({...r,name:a.name,color:a.color,id:a.slug,translation:a.translation})},m=d=>{u({color:d.hex}),setTimeout(()=>C(!1))},S=d=>{u({color:d.target.value})};return e.jsx(F.default,{open:t,showCloseButton:!0,maxWidth:"lg",title:n?"Create label":"Edit label",actions:e.jsxs(e.Fragment,{children:[e.jsx(T.default,{color:"inherit",variant:"contained",size:"small",onClick:o,children:"Cancel"}),e.jsx(T.default,{color:"primary",variant:"contained",size:"small",onClick:i,disabled:!y,children:n?"Create":"Save Changes"})]}),onClose:o,...l,children:e.jsxs(g.default,{width:600,minHeight:280,children:[e.jsx(We,{label:"Name",value:a.name,placeholder:"New label",size:"small",fullWidth:!0,onChange:d=>u({name:d.target.value}),I18NProps:{translation:a.translation,onChange:d=>u({translation:d})}}),e.jsx(M.default,{label:"Slug",value:a.slug,size:"small",fullWidth:!0,disabled:!n,onChange:d=>u({slug:d.target.value}),sx:{mt:2}}),(r==null?void 0:r.parent)&&e.jsx(M.default,{label:"Parent",value:r.parent.name,size:"small",fullWidth:!0,disabled:!0,sx:{mt:2}}),e.jsx(be.default,{onClickAway:()=>C(!1),children:e.jsxs(g.default,{sx:{position:"relative",mt:2},children:[e.jsxs(g.default,{sx:{display:"flex",alignItems:"center",gap:1},children:[e.jsx(g.default,{sx:{width:30,height:30,bgcolor:a.color,borderRadius:1},onClick:()=>C(!0)}),e.jsx(M.default,{label:"",value:a.color,size:"small",onChange:S,inputProps:{maxLength:7},sx:{width:100,".MuiInputBase-root":{height:32}}})]}),x&&e.jsx(g.default,{sx:{position:"absolute",top:48,zIndex:1},children:e.jsx(oe.GithubPicker,{color:a.color,onChangeComplete:m})})]})})]})})}function Ve({open:t,label:r,onSubmit:c,onClose:o,...l}){return e.jsx(F.default,{open:t,showCloseButton:!0,maxWidth:"md",title:"Delete",actions:e.jsxs(e.Fragment,{children:[e.jsx(T.default,{color:"inherit",variant:"contained",size:"small",onClick:o,children:"Cancel"}),e.jsx(T.default,{color:"primary",variant:"contained",size:"small",onClick:c,children:"Delete"})]}),onClose:o,...l,children:e.jsxs(g.default,{width:600,minHeight:280,children:[e.jsx(we.default,{severity:"info",sx:{mb:2},children:"Are you sure you want to delete these labels ?"}),e.jsx(O,{data:[r]})]})})}const He=E.styled(O)`
   .label-tree-item {
     &:before {
       content: '';
@@ -31,4 +31,4 @@
     box-sizing: border-box;
     padding: 0 16px;
   }
-`;function Ee({data:t,api:r,...a}){const[o,l]=f.useState(null),[n,i]=f.useState(null),[d,p]=f.useState(F(t)),h=f.useMemo(()=>O(d),[d]),x=f.useMemo(()=>{const u=(b,I)=>b.map(v=>(I&&(v.parent=I),v.children&&(v.children=u(v.children,v)),v));return u(d)},[d]),g=u=>{var b,I;u.parent?(u.parent.children=(I=(b=u.parent)==null?void 0:b.children)==null?void 0:I.map(v=>v.id===u.id?{...u}:v),g(u.parent)):p(d.map(v=>v.id===u.id?{...u}:v))},y=u=>{u.parent?(u.parent.children=u.parent.children||[],u.parent.children.push(u),p([...d])):p([...d,u])},S=u=>{var b;u.parent?u.parent.children=(b=u.parent.children)==null?void 0:b.filter(I=>I.id!==u.id):p(d.filter(I=>I.id!==u.id))},_=u=>{if(o)return;l({id:"",name:"New label",parent:u,color:"#dddddd"})},c=u=>{o||l(u)},w=async u=>{if(!o)return;const{parent:b,children:I,...v}=u;o.id?(await r.updateLabel({...v,parentId:b==null?void 0:b.id}),g(u)):(await r.createLabel({...v,parentId:b==null?void 0:b.id}),y(u)),l(null)},L=async()=>{!n||(await r.deleteLabel(n.id),S(n),i(null))},Ne=(u,b)=>e.jsxs(e.Fragment,{children:[u,e.jsxs(m.default,{sx:{display:"flex",gap:1,flex:"0 0 auto"},children:[e.jsx(A.default,{color:"inherit",size:"small",sx:{color:"grey.500"},onClick:()=>_(b),children:e.jsx(pe.default,{sx:{fontSize:20}})}),e.jsx(A.default,{color:"inherit",size:"small",sx:{color:"grey.500"},onClick:()=>c(b),children:e.jsx(he.default,{sx:{fontSize:18}})}),e.jsx(A.default,{color:"inherit",size:"small",sx:{color:"grey.500"},onClick:()=>i(b),children:e.jsx(fe.default,{sx:{fontSize:20}})})]})]});return e.jsxs(m.default,{...a,children:[e.jsxs(m.default,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[e.jsx(ue.default,{component:"h2",variant:"h6",children:"Manage labels"}),e.jsx(k.default,{color:"primary",variant:"contained",size:"small",sx:{textTransform:"none"},onClick:()=>_(),children:"New label"})]}),e.jsxs(m.default,{sx:{mt:2,border:1,borderColor:"grey.300",borderRadius:1,overflow:"hidden"},children:[e.jsxs(m.default,{sx:{p:2,fontSize:14,fontWeight:"bold",bgcolor:"grey.200"},children:[h.length," labels"]}),e.jsx(m.default,{sx:{pt:.5},children:e.jsx(Be,{data:x,selected:[],renderItem:Ne,rowHeight:64})})]}),e.jsx(Te,{open:!!o,onClose:()=>l(null),initialLabel:o,onSubmit:w},o==null?void 0:o.id),e.jsx(Me,{open:!!n,onClose:()=>i(null),label:n,onSubmit:L},n==null?void 0:n.id)]})}const W=f.createContext({}),M=()=>f.useContext(W),De=()=>{const{updateLabels:t}=M();f.useEffect(()=>()=>{t()},[])};function Pe({fetchLabels:t,children:r}){const[a,o]=f.useState({loading:!0,labels:[],updateCounter:1});f.useEffect(()=>{(async()=>{try{o(g=>({...g,loading:!0}));const x=await t();o(g=>({...g,loading:!1,labels:N(x)}))}catch(x){console.error(x),o(g=>({...g,loading:!1,labels:[]}))}})()},[a.updateCounter]);const l=f.useMemo(()=>{var x;return(x=a.labels)!=null&&x.length?O(a.labels).reduce((g,y)=>({...g,[y.id]:y}),{}):{}},[a.labels]),n=f.useCallback(h=>h.map(x=>l[x]),[l]),i=f.useCallback(h=>(h==null?void 0:h.split(","))||[],[]),d=f.useCallback((h=[])=>{if(!!(h!=null&&h.length))return h.join(",")},[]),p=f.useMemo(()=>({loading:a.loading,labels:a.labels||[],updateLabels:()=>o(h=>({...h,updateCounter:++a.updateCounter})),getLabelsById:n,parseLabelIds:i,stringifyLabelIds:d}),[a,n,i,d]);return e.jsx(W.Provider,{value:p,children:r})}function Fe({labels:t,editable:r,onChange:a,sx:o}){const l=!(t!=null&&t.length),{labels:n,loading:i,getLabelsById:d}=M(),[p,h]=f.useState(!1);if(i||!r&&l)return null;const x=S=>{a==null||a(S),setTimeout(()=>{h(!1)},300)};if(p)return e.jsx(be.default,{onClickAway:()=>p&&h(!1),children:e.jsx("div",{children:e.jsx(V,{data:n,value:t||[],onChange:x})})});const g=d(t||[]),y=[{display:"flex",gap:1,alignItems:"center",flexWrap:"wrap"},...Array.isArray(o)?o:[o]];return e.jsxs(m.default,{sx:y,children:[g.map(S=>S?e.jsx(ve.default,{label:S.name,variant:"filled",size:"small",sx:{borderRadius:1}},S.id):null),r&&!l&&e.jsx(A.default,{color:"inherit",size:"small",onClick:()=>h(!0),sx:{color:"grey.400"},children:e.jsx(xe.default,{sx:{fontSize:20}})}),r&&l&&e.jsx(k.default,{color:"inherit",variant:"outlined",startIcon:e.jsx(Ce.default,{}),onClick:()=>h(!0),children:"Edit labels"})]})}s.LabelManager=Ee,s.LabelPicker=V,s.LabelTree=z,s.Labels=Fe,s.LabelsProvider=Pe,s.transformLabels=N,s.useLabelsContext=M,s.useLabelsUpdateOnDestroy=De,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+`;function Je({locale:t,value:r}){return e.jsxs(g.default,{sx:{display:"flex",alignItems:"center",flex:"0 0 auto",px:1,py:.25,fontSize:12,bgcolor:"grey.300",borderRadius:2},children:[e.jsx(g.default,{sx:{pr:.5,borderRight:1,borderColor:"grey.400"},children:t}),e.jsx(g.default,{sx:{pl:.5},children:r})]})}function Ke({data:t,api:r,...c}){const[o,l]=f.useState(null),[n,a]=f.useState(null),[u,p]=f.useState(j(t)),y=f.useMemo(()=>z(u),[u]),x=f.useMemo(()=>{const h=(v,w)=>v.map(I=>(w&&(I.parent=w),I.children&&(I.children=h(I.children,I)),I));return h(u)},[u]),C=h=>{var v,w;h.parent?(h.parent.children=(w=(v=h.parent)==null?void 0:v.children)==null?void 0:w.map(I=>I.id===h.id?{...h}:I),C(h.parent)):p(u.map(I=>I.id===h.id?{...h}:I))},i=h=>{h.parent?(h.parent.children=h.parent.children||[],h.parent.children.push(h),p([...u])):p([...u,h])},m=h=>{var v;h.parent?h.parent.children=(v=h.parent.children)==null?void 0:v.filter(w=>w.id!==h.id):p(u.filter(w=>w.id!==h.id))},S=h=>{if(o)return;l({id:"",name:"New label",parent:h,color:"#dddddd"})},d=h=>{o||l(h)},_=async h=>{if(!o)return;const{parent:v,children:w,translation:I,...A}=h;o.id?(await r.updateLabel({...A,translation:JSON.stringify(I),parentId:v==null?void 0:v.id}),C(h)):(await r.createLabel({...A,translation:JSON.stringify(I),parentId:v==null?void 0:v.id}),i(h)),l(null)},q=async()=>{!n||(await r.deleteLabel(n.id),m(n),a(null))},Ye=(h,v)=>e.jsxs(e.Fragment,{children:[e.jsxs(g.default,{sx:{display:"flex",alignItems:"center",flexWrap:"wrap"},children:[e.jsx(g.default,{children:h}),v.translation&&e.jsx(g.default,{sx:{display:"flex",alignItems:"center",gap:.5,ml:2},children:Object.keys(v.translation).map(w=>{var A;const I=(A=v.translation)==null?void 0:A[w];return I?e.jsx(Je,{locale:w,value:I},w):null})})]}),e.jsxs(g.default,{sx:{display:"flex",gap:1,flex:"0 0 auto"},children:[e.jsx(L.default,{color:"inherit",size:"small",sx:{color:"grey.500"},onClick:()=>S(v),children:e.jsx(Ce.default,{sx:{fontSize:20}})}),e.jsx(L.default,{color:"inherit",size:"small",sx:{color:"grey.500"},onClick:()=>d(v),children:e.jsx(ye.default,{sx:{fontSize:18}})}),e.jsx(L.default,{color:"inherit",size:"small",sx:{color:"grey.500"},onClick:()=>a(v),children:e.jsx(xe.default,{sx:{fontSize:20}})})]})]});return e.jsxs(g.default,{...c,children:[e.jsxs(g.default,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[e.jsx(me.default,{component:"h2",variant:"h6",children:"Manage labels"}),e.jsx(T.default,{color:"primary",variant:"contained",size:"small",sx:{textTransform:"none"},onClick:()=>S(),children:"New label"})]}),e.jsxs(g.default,{sx:{mt:2,border:1,borderColor:"grey.300",borderRadius:1,overflow:"hidden"},children:[e.jsxs(g.default,{sx:{p:2,fontSize:14,fontWeight:"bold",bgcolor:"grey.200"},children:[y.length," labels"]}),e.jsx(g.default,{sx:{pt:.5},children:e.jsx(He,{data:x,selected:[],renderItem:Ye,rowHeight:64})})]}),e.jsx(je,{open:!!o,onClose:()=>l(null),initialLabel:o,onSubmit:_},o==null?void 0:o.id),e.jsx(Ve,{open:!!n,onClose:()=>a(null),label:n,onSubmit:q},n==null?void 0:n.id)]})}const J=f.createContext({}),P=()=>f.useContext(J),$e=()=>{const{updateLabels:t}=P();f.useEffect(()=>()=>{t()},[])};function Qe({fetchLabels:t,children:r}){const{locale:c}=D.useLocaleContext(),[o,l]=f.useState({loading:!0,labels:[],updateCounter:1});f.useEffect(()=>{(async()=>{try{l(S=>({...S,loading:!0}));const m=await t();l(S=>({...S,loading:!1,labels:V(m)}))}catch(m){console.error(m),l(S=>({...S,loading:!1,labels:[]}))}})()},[o.updateCounter]);const n=f.useMemo(()=>{var m;return(m=o.labels)!=null&&m.length?z(o.labels).reduce((S,d)=>({...S,[d.id]:d}),{}):{}},[o.labels]),a=f.useCallback(i=>{var m;return{...i,name:((m=i.translation)==null?void 0:m[c])||i.name}},[c]),u=f.useCallback(i=>i.map(m=>n[m]).map(a),[n,a]),p=f.useCallback(i=>(i==null?void 0:i.split(","))||[],[]),y=f.useCallback((i=[])=>{if(!!(i!=null&&i.length))return i.join(",")},[]),x=f.useMemo(()=>o.labels.map(a),[o.labels,a]),C=f.useMemo(()=>({loading:o.loading,labels:o.labels||[],updateLabels:()=>l(i=>({...i,updateCounter:++o.updateCounter})),getLabelsById:u,parseLabelIds:p,stringifyLabelIds:y,localizedLabels:x}),[o,u,p,y,x]);return e.jsx(J.Provider,{value:C,children:r})}function Ue({labels:t,editable:r,onChange:c,sx:o}){const l=!(t!=null&&t.length),{labels:n,loading:a,getLabelsById:u}=P(),[p,y]=f.useState(!1);if(a||!r&&l)return null;const x=m=>{c==null||c(m),setTimeout(()=>{y(!1)},300)};if(p)return e.jsx(Te.default,{onClickAway:()=>p&&y(!1),children:e.jsx("div",{children:e.jsx(H,{data:n,value:t||[],onChange:x})})});const C=u(t||[]),i=[{display:"flex",gap:1,alignItems:"center",flexWrap:"wrap"},...Array.isArray(o)?o:[o]];return e.jsxs(g.default,{sx:i,children:[C.map(m=>m?e.jsx(qe.default,{label:m.name,variant:"filled",size:"small",sx:{borderRadius:1}},m.id):null),r&&!l&&e.jsx(L.default,{color:"inherit",size:"small",onClick:()=>y(!0),sx:{color:"grey.400"},children:e.jsx(_e.default,{sx:{fontSize:20}})}),r&&l&&e.jsx(T.default,{color:"inherit",variant:"outlined",startIcon:e.jsx(ke.default,{}),onClick:()=>y(!0),children:"Edit labels"})]})}s.LabelManager=Ke,s.LabelPicker=H,s.LabelTree=O,s.Labels=Ue,s.LabelsProvider=Qe,s.transformLabels=V,s.useLabelsContext=P,s.useLabelsUpdateOnDestroy=$e,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/labels",
-  "version": "1.4.11",
+  "version": "1.4.13",
   "files": [
     "dist"
   ],
@@ -74,5 +74,5 @@
   "resolutions": {
     "react": "^18.2.0"
   },
-  "gitHead": "d2c181e19937781ba9ba843b18b2cf07e2d77f0a"
+  "gitHead": "6158b77b6d0b352a9dbb4883ac07e12127fdc53d"
 }