@deviceinsight/ng-ui-basic-components 7.3.0 → 7.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1,2 +1,910 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),h=require("react"),v=require("classnames"),x=require("react-i18next"),X=require("react-dom"),Y=require("react-draggable"),f=require("@floating-ui/react");function G(n){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const t in n)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>n[t]})}}return e.default=n,Object.freeze(e)}const j=G(h);class J extends j.Component{state={currentPageIndex:-1};componentDidMount(){const{defaultOpenPageIndex:e}=this.props;e!=null&&this.handleAccordionToggle(e)}handleAccordionToggle=e=>{const{onPageChange:t}=this.props,i=this.state.currentPageIndex!==e?e:-1;this.setState({currentPageIndex:i}),t&&t(i)};render(){const{children:e,accordionClass:t}=this.props,{currentPageIndex:i}=this.state;return s.jsx("div",{className:t?`di accordion ${t}`:"di accordion",children:e&&e.map((a,o)=>a?s.jsx(a.type,{index:o,isOpen:i===o,toggle:()=>this.handleAccordionToggle(o),...a.props},o):null)})}}class Q extends j.PureComponent{render(){const{badge:e,children:t,isOpen:i,info1:a,itemClasses:o,title:r,titleTooltip:c,toggle:l,tools:u,...p}=this.props,d=["item"];return o&&d.push(o),i&&d.push("open"),s.jsxs("div",{className:d.join(" "),children:[s.jsxs("div",{className:"head",children:[s.jsxs("span",{className:"title",onClick:l,"data-testid":p["data-testid"],children:[s.jsx("h1",{title:c,children:r}),e&&s.jsx("span",{className:"di label",style:{margin:"0 0 0 10px",backgroundColor:"#ddd",borderColor:"transparent"},children:e}),a&&s.jsx("span",{style:a.cssStyle,children:a.text})]}),s.jsx("span",{className:"tools",children:u&&u.map((m,g)=>s.jsx("span",{className:"tool",children:m},g))})]}),s.jsx("div",{className:"cont",children:t})]})}}function ee({children:n,title:e,type:t,disabled:i,onClick:a,style:o,tabIndex:r,t:c,primary:l,danger:u,naked:p,className:d,small:m,...g}){let y=e;return e&&typeof e!="string"&&(y=c(e.id,{defaultValue:e.defaultValue})),s.jsx("button",{"data-testid":g["data-testid"],type:t||"button",className:v("di button",d,{small:m,primary:l,danger:u,link:p}),title:typeof y=="string"?y:void 0,disabled:i,onClick:a,style:o,tabIndex:r,children:n})}const w=x.withTranslation()(ee),S=({children:n,dividing:e,className:t,style:i})=>s.jsx("div",{style:i,className:`di button-row ${e?"dividing":""} ${t||""}`,children:n});S.defaultProps={dividing:!1};const te=n=>!!n.touches,ne=(n,e)=>{const t=n.getBoundingClientRect();let i,a;return te(e)?(i=e.touches[0].pageX,a=e.touches[0].pageY):(i=e.pageX,a=e.pageY),t.left<=i&&t.right>=i&&t.top<=a&&t.bottom>=a},se=(n,e)=>{const t=h.useRef(e);h.useEffect(()=>{t.current=e},[e]),h.useEffect(()=>{const i=a=>{n.filter(r=>r!=null).every(r=>r!==a.target&&!r.contains(a.target)&&!ne(r,a))&&t.current(a)};return document.addEventListener("mousedown",i,!0),document.addEventListener("touchstart",i,!0),()=>{document.removeEventListener("mousedown",i,!0),document.removeEventListener("touchstart",i,!0)}},[n])};function ie({className:n,width:e,header:t,content:i,footer:a,onOutsideClick:o}){const r=h.useRef(null),[c,l]=h.useState(null);return h.useEffect(()=>{l(r.current)},[]),se([c],()=>{o&&o()}),s.jsx(Y,{handle:".modal-header",nodeRef:r,children:s.jsxs("div",{ref:r,className:`modal-window ${n||""}`,style:{maxWidth:e},children:[t&&s.jsx("div",{className:"modal-header",children:t}),i&&s.jsx("div",{className:"modal-content",children:i}),a&&s.jsx("div",{className:"modal-footer",children:a})]})})}class H extends h.Component{static defaultProps={width:"60%"};container;modalRoot;timeoutId;constructor(e){super(e),this.state={className:"di modal"}}componentDidMount(){this.container=document.createElement("div"),this.modalRoot=document.getElementById("modal-root"),this.modalRoot?this.modalRoot.appendChild(this.container):document.body&&document.body.appendChild(this.container),this.props.onOutsideClick&&window.addEventListener("keydown",this.keyEventHandler),this.timeoutId=setTimeout(()=>this.setState({className:`di modal show ${this.props.className||""}`}),10)}componentWillUnmount(){this.container&&(this.modalRoot?this.modalRoot.removeChild(this.container):document.body&&document.body.removeChild(this.container)),this.props.onOutsideClick&&window.removeEventListener("keydown",this.keyEventHandler),this.timeoutId&&clearTimeout(this.timeoutId)}keyEventHandler=e=>{e.key==="Escape"&&this.props.onOutsideClick&&this.props.onOutsideClick(e)};render(){return this.container?X.createPortal(s.jsx("div",{className:this.state.className,onMouseDown:this.props.onMouseDown,children:s.jsx(ie,{...this.props})}),this.container):null}}class ae extends h.PureComponent{render(){return s.jsx("div",{id:"modal-root"})}}class L extends h.Component{static defaultProps={size:56,center:!1};render(){const{size:e=56,center:t,...i}=this.props;let a={width:e,height:e};return t&&(a={...a,position:"absolute",top:"50%",left:"50%",marginTop:-e/2,marginLeft:-e/2}),s.jsx("div",{className:"di spinner",style:a,...i})}}class oe extends h.Component{static defaultProps={size:56};render(){const{show:e,size:t,children:i,className:a}=this.props,o=`di spinner-wrapper ${a||""}`;return s.jsxs("div",{className:o,children:[s.jsx("div",{className:`di spinner-container ${e?"visible":""}`,"data-testid":this.props["data-testid"],children:s.jsx(L,{size:t,center:!0})}),i]})}}const re=(n,e)=>{switch(n){case"checkbox":case"radio":return"di checkbox";case"toggle":return e?"di toggle toggle-small":"di toggle";default:throw Error(`type not support: ${n}`)}},ce=(n,e)=>{switch(n){case"checkbox":return"box";case"radio":return"radio";case"toggle":return e?"switch switch-small":"switch";default:throw Error(`type not support: ${n}`)}},le=({type:n="checkbox",value:e,onChange:t,title:i,label:a,disabled:o=!1,toggleSmall:r=!1,toggleColor:c="#259b23",t:l,...u})=>{const p=n==="toggle"?{backgroundColor:e?c:"gray"}:{},d=i?l(i.id,{defaultValue:i.defaultValue}):void 0,m=a?l(a.id,{defaultValue:a.defaultValue}):null;return s.jsxs("label",{title:d,className:re(n,r),"data-testid":u["wrapper-data-testid"],children:[s.jsx("input",{type:"checkbox",checked:e,disabled:o,onChange:()=>t(!e),"data-testid":u["data-testid"]}),s.jsx("div",{className:ce(n,r),style:p,"data-testid":u["innerdiv-data-testid"]}),a&&s.jsx("span",{className:"textlabel",children:m})]})},de=x.withTranslation()(le);function T(n){const e=typeof n=="object"&&typeof n.id=="string"&&typeof n.defaultValue=="string";return e&&console.warn("Please use strings instead of TranslationDescriptors to initialize the Confirm modal, because TranslationDescriptors are deprecated"),e}function N(n){return T(n)?s.jsx(x.Trans,{i18nKey:n.id,children:n.defaultValue}):n}function ue({title:n,message:e,onAccept:t,onDecline:i,acceptButtonLabel:a,declineButtonLabel:o,acceptButtonStyle:r="primary"}){return s.jsx(H,{header:N(n),content:N(e),footer:s.jsxs("div",{children:[s.jsx(w,{primary:r==="primary",danger:r==="danger",onClick:t,children:a?N(a):s.jsx(x.Trans,{i18nKey:"form.accept",children:"Accept"})}),s.jsx(w,{onClick:i,children:o?N(o):s.jsx(x.Trans,{i18nKey:"form.decline",children:"Decline"})})]}),width:500})}const R=h.createContext({confirm:()=>Promise.reject(new Error("ConfirmProvider is missing!"))});function _({children:n}){const[e,t]=h.useState(!1),[i,a]=h.useState({title:"",message:"",onAccept:()=>{},onDecline:()=>{}});async function o(r){return new Promise(c=>{t(!0),a({...r,onAccept:()=>{t(!1),c(!0)},onDecline:()=>{t(!1),c(!1)}})})}return s.jsxs(R.Provider,{value:{confirm:o},children:[n,e&&s.jsx(ue,{...i})]})}function $(){const n=h.useContext(R);if(!n)throw new Error("ConfirmProvider is missing");const{confirm:e}=n;return e}function he(n){function e(t){const i=$(),{t:a}=x.useTranslation();function o(c){return T(c)?a(c.id,{defaultValue:c.defaultValue}):c}async function r(c,l,u,p,d,m){const g=await i({title:o(c),message:T(l)?o(l):l,acceptButtonLabel:u?o(u):void 0,declineButtonLabel:p?o(p):void 0,acceptButtonStyle:m});if(d)return g;if(!g)return new Promise(()=>{})}return s.jsx(n,{...t,confirm:r})}return function(i){return s.jsx(_,{children:s.jsx(e,{...i})})}}const pe="data:image/svg+xml,%3csvg%20id='icon-add_24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpolygon%20id='plus'%20points='20%2010%2014%2010%2014%204%2010%204%2010%2010%204%2010%204%2014%2010%2014%2010%2020%2014%2020%2014%2014%2020%2014%2020%2010'/%3e%3c/svg%3e",fe="data:image/svg+xml,%3csvg%20id='icon-cross_24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpolygon%20id='icon-cross_24'%20points='20%206.28%2017.87%204%2012%209.78%206.13%204%204%206.28%209.78%2011.97%204%2017.66%206.13%2019.93%2012%2014.15%2017.87%2019.93%2020%2017.66%2014.22%2011.97%2020%206.28'/%3e%3c/svg%3e",me="data:image/svg+xml,%3csvg%20id='icon-edit-24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%20id='stift'%3e%3cpath%20d='M7.35,12.65a.5.5,0,0,0,0,.7l3.3,3.3a.5.5,0,0,0,.7,0l8.3-8.3A1.4,1.4,0,0,0,20,7.5v-1a1.4,1.4,0,0,0-.35-.85l-1.3-1.3A1.4,1.4,0,0,0,17.5,4h-1a1.4,1.4,0,0,0-.85.35Z'/%3e%3c/g%3e%3cpath%20d='M5.9,14.49c.06-.27.26-.33.45-.14l3.3,3.3c.19.19.13.39-.14.45l-4,.8a.3.3,0,0,1-.39-.39Z'/%3e%3c/svg%3e",ge="data:image/svg+xml,%3csvg%20id='icon-gear-24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%20id='icon-gear-24_sga-2'%20data-name='icon-gear-24_sga'%3e%3cpath%20d='M22.82,14.06A1.25,1.25,0,0,0,24,13,7.66,7.66,0,0,0,24,12,7.66,7.66,0,0,0,24,11a1.25,1.25,0,0,0-1.13-1l-1.09,0A1.49,1.49,0,0,1,20.44,9c-.15-.47-.44-2-.07-2.37l.74-.81a1.16,1.16,0,0,0,0-1.5L19.7,2.87a1.16,1.16,0,0,0-1.5,0l-.81.74a1.5,1.5,0,0,1-1.54.27c-.44-.23-1.72-1.08-1.74-1.63l0-1.09A1.25,1.25,0,0,0,13,.05a7.66,7.66,0,0,0-1,0,7.66,7.66,0,0,0-1,.05,1.25,1.25,0,0,0-1,1.13l0,1.09A1.52,1.52,0,0,1,9,3.56c-.47.15-2,.44-2.37.07L5.8,2.89a1.16,1.16,0,0,0-1.5,0L2.86,4.3a1.18,1.18,0,0,0,0,1.5l.74.81A1.5,1.5,0,0,1,3.9,8.15c-.23.44-1.08,1.72-1.63,1.74l-1.09,0A1.25,1.25,0,0,0,.05,11a7.66,7.66,0,0,0,0,1,7.66,7.66,0,0,0,.05,1,1.25,1.25,0,0,0,1.13,1l1.09,0A1.47,1.47,0,0,1,3.55,15c.16.48.45,2,.08,2.37l-.74.81a1.16,1.16,0,0,0,0,1.5L4.3,21.13a1.16,1.16,0,0,0,1.5,0l.81-.74a1.5,1.5,0,0,1,1.54-.27c.44.23,1.72,1.08,1.75,1.63l0,1.09A1.25,1.25,0,0,0,11,24,7.66,7.66,0,0,0,12,24,7.66,7.66,0,0,0,13,24a1.25,1.25,0,0,0,1-1.13l0-1.09A1.49,1.49,0,0,1,15,20.44c.47-.15,2-.44,2.37-.07l.81.74a1.16,1.16,0,0,0,1.5,0l1.43-1.43a1.16,1.16,0,0,0,0-1.5l-.74-.81a1.5,1.5,0,0,1-.27-1.54c.23-.44,1.08-1.72,1.63-1.74ZM12,15.5A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z'/%3e%3c/g%3e%3c/svg%3e",xe="data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%3e%3cpath%20d='M22.1,4.91a3,3,0,0,0-3-3H6.44a2.4,2.4,0,0,1,1.34-.4h12.6A2.12,2.12,0,0,1,22.5,3.62V17.26a1.42,1.42,0,0,1-.4,1Z'/%3e%3cpath%20d='M20.38,1H7.78A3,3,0,0,0,5.26,2.4H19.09A2.51,2.51,0,0,1,21.6,4.91V19.12A1.94,1.94,0,0,0,23,17.26V3.62A2.62,2.62,0,0,0,20.38,1Z'/%3e%3c/g%3e%3cg%3e%3cpath%20d='M4,21.5A1.5,1.5,0,0,1,2.5,20V5.8A1.5,1.5,0,0,1,4,4.3H18.2a1.5,1.5,0,0,1,1.5,1.5V20a1.5,1.5,0,0,1-1.5,1.5ZM9.5,18a.5.5,0,0,0,.5.5h2a.5.5,0,0,0,.5-.5V14.5H16a.5.5,0,0,0,.5-.5V12a.5.5,0,0,0-.5-.5H12.5V8a.5.5,0,0,0-.5-.5H10a.5.5,0,0,0-.5.5v3.5H6a.5.5,0,0,0-.5.5v2a.5.5,0,0,0,.5.5H9.5Z'/%3e%3cpath%20d='M18.2,4.8a1,1,0,0,1,1,1V20a1,1,0,0,1-1,1H4a1,1,0,0,1-1-1V5.8a1,1,0,0,1,1-1H18.2M9,11H6a1,1,0,0,0-1,1v2a1,1,0,0,0,1,1H9v3a1,1,0,0,0,1,1h2a1,1,0,0,0,1-1V15h3a1,1,0,0,0,1-1V12a1,1,0,0,0-1-1H13V8a1,1,0,0,0-1-1H10A1,1,0,0,0,9,8v3m9.2-7.2H4a2,2,0,0,0-2,2V20a2,2,0,0,0,2,2H18.2a2,2,0,0,0,2-2V5.8a2,2,0,0,0-2-2ZM6,14V12h4V8h2v4h4v2H12v4H10V14Z'/%3e%3c/g%3e%3c/svg%3e",ve="data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3e%3cpolygon%20points='7.92%2012%202.84%207%2013%207%207.92%2012'/%3e%3crect%20x='5'%20y='2'%20width='6'%20height='5'/%3e%3crect%20x='2'%20y='14'%20width='12'%20height='1'/%3e%3c/svg%3e",we="data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3e%3cdefs%3e%3cstyle%3e%20.cls-1%20{%20fill:%20%23fff;%20}%20%3c/style%3e%3c/defs%3e%3cg%3e%3ccircle%20class='cls-1'%20cx='5.5'%20cy='5.5'%20r='4.5'/%3e%3cpath%20d='M5.5,2A3.5,3.5,0,1,1,2,5.5,3.5,3.5,0,0,1,5.5,2m0-1A4.5,4.5,0,1,0,10,5.5,4.49,4.49,0,0,0,5.5,1Z'/%3e%3c/g%3e%3crect%20x='6.79'%20y='10.04'%20width='7.74'%20height='2.16'%20transform='translate(10.98%20-4.28)%20rotate(45)'/%3e%3c/svg%3e",ye="data:image/svg+xml,%3csvg%20data-name='icon_key'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2027.02%2027'%3e%3cpath%20d='M35.07,16.5a8.52,8.52,0,0,0-7.69,12L17.2,38.8a2.46,2.46,0,0,0,0,3.46,2.41,2.41,0,0,0,3.42,0l1.69-1.7,2.91,2.94L31,37.63l-2.92-3,2.44-2.46a8.31,8.31,0,0,0,4.51,1.33,8.53,8.53,0,0,0,0-17Zm0,3.91A4.62,4.62,0,1,1,30.5,25,4.6,4.6,0,0,1,35.07,20.41Z'%20transform='translate(-16.49%20-16.5)'/%3e%3c/svg%3e",be="data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%20id='Pfeilende'%3e%3cpath%20d='M24,10H15l9-8.93Z'/%3e%3c/g%3e%3cpath%20d='M18.45,18.78A9.33,9.33,0,0,1,2.62,14.86,9.8,9.8,0,0,1,8.89,2.69,9.42,9.42,0,0,1,20.72,9.14H23A11.72,11.72,0,0,0,11.68,0,11.74,11.74,0,0,0,.34,9.14,12,12,0,0,0,8.89,23.65a11.43,11.43,0,0,0,11.16-3.31Z'/%3e%3c/svg%3e",je="data:image/svg+xml,%3csvg%20data-name='icon_fullscreen_sga'%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%3e%3cpolygon%20id='ecke'%20points='2%2014%202%2010%200%2010%200%2016%206%2016%206%2014%202%2014'/%3e%3cpolygon%20id='ecke-2'%20data-name='ecke'%20points='2%202%206%202%206%200%200%200%200%206%202%206%202%202'/%3e%3cpolygon%20id='ecke-3'%20data-name='ecke'%20points='14%2014%2010%2014%2010%2016%2016%2016%2016%2010%2014%2010%2014%2014'/%3e%3cpolygon%20id='ecke-4'%20data-name='ecke'%20points='10%200%2010%202%2014%202%2014%206%2016%206%2016%200%2010%200'/%3e%3c/svg%3e",Ce="data:image/svg+xml,%3csvg%20id='Icon_help'%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20id='icon_help-2'%20data-name='icon_help'%20d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm1,16H11V15h2Zm1.7-6.26a4.85,4.85,0,0,1-.49.81l-1,1.37a1.36,1.36,0,0,0-.18.34,1,1,0,0,0-.07.38L13,14H11l.1-.49a2,2,0,0,1,.13-.77,3.18,3.18,0,0,1,.4-.69l1-1.33a3.21,3.21,0,0,0,.29-.46,1.19,1.19,0,0,0,.11-.47,1.17,1.17,0,0,0-.3-.82,1.07,1.07,0,0,0-.83-.33A1,1,0,0,0,11.1,9a1.25,1.25,0,0,0-.28.83H9a2.94,2.94,0,0,1,.23-1.17,2.45,2.45,0,0,1,.63-.88,2.9,2.9,0,0,1,.93-.55A3.13,3.13,0,0,1,11.94,7a3.31,3.31,0,0,1,1.13.19,2.82,2.82,0,0,1,.94.54,2.62,2.62,0,0,1,.65.88A3,3,0,0,1,14.9,9.8,2.16,2.16,0,0,1,14.7,10.74Z'%20style='opacity:%200.2'/%3e%3c/svg%3e",ke="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='icon_star_16'%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%3e%3cpath%20id='star'%20d='M8,0l2.45,4.97,5.55,.76-4.04,3.83,.99,5.44-4.94-2.61-4.94,2.61,.99-5.44L0,5.73l5.55-.76L8,0Z'/%3e%3c/svg%3e";function Ne(n){const{add:e,del:t,edit:i,config:a,duplicate:o,search:r,download:c,sync:l,fullscreen:u,iconKey:p,documentation:d,star:m}=n;if(e)return pe;if(t)return fe;if(i)return me;if(a)return ge;if(o)return xe;if(r)return we;if(c)return ve;if(l)return be;if(u)return je;if(p)return ye;if(d)return Ce;if(m)return ke;throw Error("getSrc: no icon type specified")}function Te(n){const{add:e,del:t,edit:i,config:a,duplicate:o,search:r,download:c,sync:l,fullscreen:u,iconKey:p,documentation:d,star:m}=n;if(e)return"icon add";if(t)return"icon delete";if(i)return"icon edit";if(a)return"icon config";if(o)return"icon duplicate";if(r)return"icon search";if(c)return"icon download";if(l)return"icon sync";if(u)return"icon fullscreen";if(p)return"icon iconKey";if(d)return"icon documentation";if(m)return"icon star";throw Error("getAlt: no icon type specified")}function C(n){let e;return n.large?e={width:24,height:24}:e={width:16,height:16},n.inverted&&(e={...e,filter:"invert(1)"}),s.jsx("img",{src:Ne(n),className:`di icon ${n.className||""}`,alt:Te(n),style:e})}function Ae({text:n,small:e=!1,large:t=!1,onDelete:i,className:a,onClick:o,children:r,...c}){function l(u){u.stopPropagation(),i&&i()}return s.jsxs("span",{onClick:o,className:v("di label",a,{large:t,small:e,removable:i,clickable:!!o}),"data-testid":c["data-testid"],children:[typeof n=="string"?n:n&&s.jsx(x.Trans,{i18nKey:n.id,children:n.defaultValue}),s.jsx(s.Fragment,{children:r}),i&&s.jsx("span",{"data-testid":c["delete-button-data-testid"],className:"remove",onClick:l,children:s.jsx(C,{del:!0,inverted:!0})})]})}const b=16;function A({placement:n="bottom",mode:e=["click"],disabled:t,handler:i,handlerWrapperClassName:a,preventDestroyContentOnHide:o,open:r,onOpenChange:c,className:l,children:u}){const p=h.useRef(null),{elements:d,update:m,refs:g,floatingStyles:y,context:k,middlewareData:P,placement:V}=f.useFloating({placement:n,open:r,onOpenChange:c,whileElementsMounted:o?void 0:f.autoUpdate,middleware:[f.offset({mainAxis:12}),f.flip({padding:b}),f.shift({padding:b}),f.size({padding:b,apply({availableHeight:M,availableWidth:W,elements:E}){const z=`${Math.max(0,W-b)}px`,U=`${Math.max(0,M-b)}px`;E.floating.style.maxWidth=z,E.floating.style.maxHeight=U}}),f.arrow({element:p})]});h.useEffect(()=>{if(o&&r&&d.reference&&d.floating)return f.autoUpdate(d.reference,d.floating,m)},[d.floating,d.reference,r,m,o]);const Z=f.useClick(k,{enabled:!t&&e.includes("click"),keyboardHandlers:!1}),O=f.useHover(k,{enabled:!t&&e.includes("hover"),handleClose:f.safePolygon()}),D=f.useFocus(k,{enabled:!t&&e.includes("focus")}),q=f.useDismiss(k),{getReferenceProps:K,getFloatingProps:F}=f.useInteractions([Z,O,D,q]);return s.jsxs(s.Fragment,{children:[s.jsx("span",{style:{display:"inline-block"},className:v("popup-handler-wrapper",a),ref:g.setReference,...K(),children:i}),(r||o)&&s.jsx(f.FloatingPortal,{children:s.jsx("div",{className:v("di popup-wrapper",{hidden:o&&!r}),ref:g.setFloating,style:y,...F(),children:s.jsxs("div",{className:v("di popup",V,l),children:[s.jsx("div",{className:v("popup-arrow",V),ref:p,style:{left:P.arrow?.x,top:P.arrow?.y}}),s.jsx("div",{className:"popup-content",children:u})]})})})]})}function I({content:n,inverted:e,children:t,disabled:i,style:a,direction:o,className:r}){const[c,l]=h.useState(!1);return s.jsx(A,{open:c,onOpenChange:l,handler:t,disabled:i,mode:["hover"],placement:o||"top",className:`bubble ${e?"inverted":""} ${r||""}`,children:s.jsx("span",{className:"bubble-content",style:a,children:n})})}function Pe({content:n,children:e,className:t,direction:i,disabled:a}){const[o,r]=h.useState(!1);return s.jsx(A,{open:o,disabled:a,mode:["hover"],onOpenChange:r,handler:e,placement:i||"right",className:`tooltip inverted ${t||""}`,children:s.jsx("span",{className:"tooltip-content",children:n})})}class Ve extends j.Component{state={currentTab:this.props.pages.length?this.props.pages[0].name:null};handleClick=e=>{this.props.onChange?this.props.onChange(e):typeof this.props.currentTab>"u"&&this.setState({currentTab:e})};currentTabPage=()=>{const e=typeof this.props.currentTab=="string"?this.props.currentTab:this.state.currentTab;return this.props.pages.find(({name:t})=>e===t)};isCurrentTab=e=>(typeof this.props.currentTab=="string"?this.props.currentTab:this.state.currentTab)===e;renderBody=()=>{const e=this.currentTabPage();return e&&typeof e.renderBody=="function"?e.renderBody():null};render(){const{pages:e,disabled:t}=this.props;return s.jsxs("div",{children:[s.jsx("div",{className:"di tabs",children:e.map(({name:i,renderHeading:a,tabDescription:o})=>o?s.jsx(I,{inverted:!0,content:o,className:"bubble-tab-description",children:s.jsx("button",{"data-testid":"tab-button",className:`item ${t?"disabled":""} ${this.isCurrentTab(i)?"active":""}`,onClick:()=>!t&&this.handleClick(i),children:a()})},i):s.jsx("button",{"data-testid":"tab-button",className:`item ${t?"disabled":""} ${this.isCurrentTab(i)?"active":""}`,onClick:()=>!t&&this.handleClick(i),children:a()},i))}),this.renderBody()]})}}const B=({onChange:n,inputElement:e,style:t})=>s.jsx(w,{naked:!0,onClick:()=>{n(""),e&&e.focus()},style:t,children:s.jsx(C,{del:!0})});class Me extends j.Component{state={query:this.props.initialValue||""};input;printPlaceholder(){const{t:e,placeholder:t}=this.props;return typeof t=="object"?e(t.id,{defaultValue:t.defaultValue}):t}handleChange=e=>{const{onChange:t}=this.props;this.setState({query:e}),t(e)};handleKeyUp=({key:e})=>{const{onSubmit:t}=this.props,{query:i}=this.state;e==="Enter"&&typeof t=="function"&&t(i)};render(){const{onSubmit:e,style:t,clearable:i}=this.props,{query:a}=this.state;return s.jsxs("div",{className:"search-box",style:t,children:[s.jsx("input",{ref:o=>{this.input=o},type:"text",value:a,placeholder:this.printPlaceholder(),onKeyUp:this.handleKeyUp,onChange:({target:{value:o}})=>this.handleChange(o)}),typeof e=="function"?s.jsxs(j.Fragment,{children:[a&&i&&s.jsx(B,{onChange:this.handleChange,inputElement:this.input,style:{right:30}}),s.jsx(w,{naked:!0,onClick:()=>e(a),children:s.jsx(C,{search:!0})})]}):a&&i?s.jsx(B,{onChange:this.handleChange,inputElement:this.input}):s.jsx(w,{naked:!0,disabled:!0,children:s.jsx(C,{search:!0})})]})}}const Ee=x.withTranslation()(Me);exports.Accordion=J;exports.AccordionItem=Q;exports.Bubble=I;exports.Button=w;exports.ButtonRow=S;exports.Checkbox=de;exports.ConfirmProvider=_;exports.Icon=C;exports.Label=Ae;exports.Modal=H;exports.ModalContainer=ae;exports.Popup=A;exports.SearchBox=Ee;exports.Spinner=L;exports.SpinnerContainer=oe;exports.Tabs=Ve;exports.Tooltip=Pe;exports.useConfirm=$;exports.withConfirm=he;
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const jsxRuntime = require("react/jsx-runtime");
4
+ const React = require("react");
5
+ const cx = require("classnames");
6
+ const reactI18next = require("react-i18next");
7
+ const ReactDOM = require("react-dom");
8
+ const Draggable = require("react-draggable");
9
+ const react = require("@floating-ui/react");
10
+ function _interopNamespaceDefault(e) {
11
+ const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
12
+ if (e) {
13
+ for (const k in e) {
14
+ if (k !== "default") {
15
+ const d = Object.getOwnPropertyDescriptor(e, k);
16
+ Object.defineProperty(n, k, d.get ? d : {
17
+ enumerable: true,
18
+ get: () => e[k]
19
+ });
20
+ }
21
+ }
22
+ }
23
+ n.default = e;
24
+ return Object.freeze(n);
25
+ }
26
+ const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
27
+ class Accordion extends React__namespace.Component {
28
+ state = {
29
+ currentPageIndex: -1
30
+ };
31
+ componentDidMount() {
32
+ const { defaultOpenPageIndex } = this.props;
33
+ if (defaultOpenPageIndex !== null && defaultOpenPageIndex !== void 0) {
34
+ this.handleAccordionToggle(defaultOpenPageIndex);
35
+ }
36
+ }
37
+ handleAccordionToggle = (index) => {
38
+ const { onPageChange } = this.props;
39
+ const newPageIndex = this.state.currentPageIndex !== index ? index : -1;
40
+ this.setState({
41
+ currentPageIndex: newPageIndex
42
+ });
43
+ if (onPageChange) {
44
+ onPageChange(newPageIndex);
45
+ }
46
+ };
47
+ render() {
48
+ const { children, accordionClass } = this.props;
49
+ const { currentPageIndex } = this.state;
50
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: accordionClass ? `di accordion ${accordionClass}` : "di accordion", children: children && children.map(
51
+ (child, index) => child ? /* @__PURE__ */ jsxRuntime.jsx(
52
+ child.type,
53
+ {
54
+ index,
55
+ isOpen: currentPageIndex === index,
56
+ toggle: () => this.handleAccordionToggle(index),
57
+ ...child.props
58
+ },
59
+ index
60
+ ) : null
61
+ ) });
62
+ }
63
+ }
64
+ class AccordionItem extends React__namespace.PureComponent {
65
+ render() {
66
+ const { badge, children, isOpen, info1, itemClasses, title, titleTooltip, toggle, tools, ...rest } = this.props;
67
+ const accordionItemClasses = ["item"];
68
+ if (itemClasses) accordionItemClasses.push(itemClasses);
69
+ if (isOpen) accordionItemClasses.push("open");
70
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: accordionItemClasses.join(" "), children: [
71
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "head", children: [
72
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "title", onClick: toggle, "data-testid": rest["data-testid"], children: [
73
+ /* @__PURE__ */ jsxRuntime.jsx("h1", { title: titleTooltip, children: title }),
74
+ badge && /* @__PURE__ */ jsxRuntime.jsx(
75
+ "span",
76
+ {
77
+ className: "di label",
78
+ style: {
79
+ margin: "0 0 0 10px",
80
+ backgroundColor: "#ddd",
81
+ borderColor: "transparent"
82
+ },
83
+ children: badge
84
+ }
85
+ ),
86
+ info1 && /* @__PURE__ */ jsxRuntime.jsx("span", { style: info1.cssStyle, children: info1.text })
87
+ ] }),
88
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tools", children: tools && tools.map((toolComponent, index) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tool", children: toolComponent }, index)) })
89
+ ] }),
90
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cont", children })
91
+ ] });
92
+ }
93
+ }
94
+ function Button$1({
95
+ children,
96
+ title,
97
+ type,
98
+ disabled,
99
+ onClick,
100
+ style,
101
+ tabIndex,
102
+ t,
103
+ primary,
104
+ danger,
105
+ naked,
106
+ className,
107
+ small,
108
+ ...rest
109
+ }) {
110
+ let btnTitle = title;
111
+ if (title && typeof title !== "string") {
112
+ btnTitle = t(title.id, {
113
+ defaultValue: title.defaultValue
114
+ });
115
+ }
116
+ return /* @__PURE__ */ jsxRuntime.jsx(
117
+ "button",
118
+ {
119
+ "data-testid": rest["data-testid"],
120
+ type: type || "button",
121
+ className: cx("di button", className, { small, primary, danger, link: naked }),
122
+ title: typeof btnTitle === "string" ? btnTitle : void 0,
123
+ disabled,
124
+ onClick,
125
+ style,
126
+ tabIndex,
127
+ children
128
+ }
129
+ );
130
+ }
131
+ const Button = reactI18next.withTranslation()(Button$1);
132
+ const ButtonRow = ({ children, dividing, className, style }) => /* @__PURE__ */ jsxRuntime.jsx("div", { style, className: `di button-row ${dividing ? "dividing" : ""} ${className || ""}`, children });
133
+ ButtonRow.defaultProps = {
134
+ dividing: false
135
+ };
136
+ const isTouchEvent = (event) => {
137
+ return !!event.touches;
138
+ };
139
+ const isInsideBoundingRect = (element, event) => {
140
+ const rect = element.getBoundingClientRect();
141
+ let x, y;
142
+ if (isTouchEvent(event)) {
143
+ x = event.touches[0].pageX;
144
+ y = event.touches[0].pageY;
145
+ } else {
146
+ x = event.pageX;
147
+ y = event.pageY;
148
+ }
149
+ return rect.left <= x && rect.right >= x && rect.top <= y && rect.bottom >= y;
150
+ };
151
+ const useOutsideClick = (elements, callback) => {
152
+ const callbackRef = React.useRef(callback);
153
+ React.useEffect(() => {
154
+ callbackRef.current = callback;
155
+ }, [callback]);
156
+ React.useEffect(() => {
157
+ const listener = (event) => {
158
+ const elementsNonNull = elements.filter((element) => element != null);
159
+ if (elementsNonNull.every(
160
+ (element) => element !== event.target && !element.contains(event.target) && !isInsideBoundingRect(element, event)
161
+ )) {
162
+ callbackRef.current(event);
163
+ }
164
+ };
165
+ document.addEventListener("mousedown", listener, true);
166
+ document.addEventListener("touchstart", listener, true);
167
+ return () => {
168
+ document.removeEventListener("mousedown", listener, true);
169
+ document.removeEventListener("touchstart", listener, true);
170
+ };
171
+ }, [elements]);
172
+ };
173
+ function ModalWindow({ className, width, header, content, footer, onOutsideClick }) {
174
+ const ref = React.useRef(null);
175
+ const [rootElement, setRootElement] = React.useState(null);
176
+ React.useEffect(() => {
177
+ setRootElement(ref.current);
178
+ }, []);
179
+ useOutsideClick([rootElement], () => {
180
+ if (onOutsideClick) onOutsideClick();
181
+ });
182
+ return /* @__PURE__ */ jsxRuntime.jsx(Draggable, { handle: ".modal-header", nodeRef: ref, children: /* @__PURE__ */ jsxRuntime.jsxs(
183
+ "div",
184
+ {
185
+ ref,
186
+ className: `modal-window ${className || ""}`,
187
+ style: {
188
+ maxWidth: width
189
+ },
190
+ children: [
191
+ header && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-header", children: header }),
192
+ content && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-content", children: content }),
193
+ footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-footer", children: footer })
194
+ ]
195
+ }
196
+ ) });
197
+ }
198
+ class Modal extends React.Component {
199
+ static defaultProps = {
200
+ width: "60%"
201
+ };
202
+ container;
203
+ modalRoot;
204
+ timeoutId;
205
+ constructor(props) {
206
+ super(props);
207
+ this.state = {
208
+ className: "di modal"
209
+ };
210
+ }
211
+ componentDidMount() {
212
+ this.container = document.createElement("div");
213
+ this.modalRoot = document.getElementById("modal-root");
214
+ if (this.modalRoot) {
215
+ this.modalRoot.appendChild(this.container);
216
+ } else if (document.body) {
217
+ document.body.appendChild(this.container);
218
+ }
219
+ if (this.props.onOutsideClick) {
220
+ window.addEventListener("keydown", this.keyEventHandler);
221
+ }
222
+ this.timeoutId = setTimeout(
223
+ () => this.setState({
224
+ className: `di modal show ${this.props.className || ""}`
225
+ }),
226
+ 10
227
+ );
228
+ }
229
+ componentWillUnmount() {
230
+ if (this.container) {
231
+ if (this.modalRoot) {
232
+ this.modalRoot.removeChild(this.container);
233
+ } else if (document.body) {
234
+ document.body.removeChild(this.container);
235
+ }
236
+ }
237
+ if (this.props.onOutsideClick) {
238
+ window.removeEventListener("keydown", this.keyEventHandler);
239
+ }
240
+ if (this.timeoutId) {
241
+ clearTimeout(this.timeoutId);
242
+ }
243
+ }
244
+ keyEventHandler = (event) => {
245
+ if (event.key === "Escape" && this.props.onOutsideClick) {
246
+ this.props.onOutsideClick(event);
247
+ }
248
+ };
249
+ render() {
250
+ if (!this.container) {
251
+ return null;
252
+ }
253
+ return ReactDOM.createPortal(
254
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: this.state.className, onMouseDown: this.props.onMouseDown, children: /* @__PURE__ */ jsxRuntime.jsx(ModalWindow, { ...this.props }) }),
255
+ this.container
256
+ );
257
+ }
258
+ }
259
+ class ModalContainer extends React.PureComponent {
260
+ render() {
261
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { id: "modal-root" });
262
+ }
263
+ }
264
+ class Spinner extends React.Component {
265
+ static defaultProps = {
266
+ size: 56,
267
+ center: false
268
+ };
269
+ render() {
270
+ const { size = 56, center, ...dataAttrs } = this.props;
271
+ let style = {
272
+ width: size,
273
+ height: size
274
+ };
275
+ if (center) {
276
+ style = {
277
+ ...style,
278
+ position: "absolute",
279
+ top: "50%",
280
+ left: "50%",
281
+ marginTop: -size / 2,
282
+ marginLeft: -size / 2
283
+ };
284
+ }
285
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "di spinner", style, ...dataAttrs });
286
+ }
287
+ }
288
+ class SpinnerContainer extends React.Component {
289
+ static defaultProps = {
290
+ size: 56
291
+ };
292
+ render() {
293
+ const { show, size, children, className } = this.props;
294
+ const classNames = `di spinner-wrapper ${className ? className : ""}`;
295
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classNames, children: [
296
+ /* @__PURE__ */ jsxRuntime.jsx(
297
+ "div",
298
+ {
299
+ className: `di spinner-container ${show ? "visible" : ""}`,
300
+ "data-testid": this.props["data-testid"],
301
+ children: /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size, center: true })
302
+ }
303
+ ),
304
+ children
305
+ ] });
306
+ }
307
+ }
308
+ const getWrapperClassName = (type, small) => {
309
+ switch (type) {
310
+ case "checkbox":
311
+ case "radio":
312
+ return "di checkbox";
313
+ case "toggle":
314
+ return small ? "di toggle toggle-small" : "di toggle";
315
+ default:
316
+ throw Error(`type not support: ${type}`);
317
+ }
318
+ };
319
+ const getCheckboxClassName = (type, small) => {
320
+ switch (type) {
321
+ case "checkbox":
322
+ return "box";
323
+ case "radio":
324
+ return "radio";
325
+ case "toggle":
326
+ return small ? "switch switch-small" : "switch";
327
+ default:
328
+ throw Error(`type not support: ${type}`);
329
+ }
330
+ };
331
+ const Checkbox = ({
332
+ type = "checkbox",
333
+ value,
334
+ onChange,
335
+ title,
336
+ label,
337
+ disabled = false,
338
+ toggleSmall = false,
339
+ toggleColor = "#259b23",
340
+ t,
341
+ ...other
342
+ }) => {
343
+ const style = type === "toggle" ? {
344
+ backgroundColor: value ? toggleColor : "gray"
345
+ } : {};
346
+ const tooltip = title ? t(title.id, {
347
+ defaultValue: title.defaultValue
348
+ }) : void 0;
349
+ const labelText = label ? t(label.id, {
350
+ defaultValue: label.defaultValue
351
+ }) : null;
352
+ return /* @__PURE__ */ jsxRuntime.jsxs(
353
+ "label",
354
+ {
355
+ title: tooltip,
356
+ className: getWrapperClassName(type, toggleSmall),
357
+ "data-testid": other["wrapper-data-testid"],
358
+ children: [
359
+ /* @__PURE__ */ jsxRuntime.jsx(
360
+ "input",
361
+ {
362
+ type: "checkbox",
363
+ checked: value,
364
+ disabled,
365
+ onChange: () => onChange(!value),
366
+ "data-testid": other["data-testid"]
367
+ }
368
+ ),
369
+ /* @__PURE__ */ jsxRuntime.jsx(
370
+ "div",
371
+ {
372
+ className: getCheckboxClassName(type, toggleSmall),
373
+ style,
374
+ "data-testid": other["innerdiv-data-testid"]
375
+ }
376
+ ),
377
+ label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "textlabel", children: labelText })
378
+ ]
379
+ }
380
+ );
381
+ };
382
+ const Checkbox_default = reactI18next.withTranslation()(Checkbox);
383
+ function isTranslationDescriptor(arg) {
384
+ const result = typeof arg === "object" && typeof arg.id === "string" && typeof arg.defaultValue === "string";
385
+ if (result) {
386
+ console.warn(
387
+ "Please use strings instead of TranslationDescriptors to initialize the Confirm modal, because TranslationDescriptors are deprecated"
388
+ );
389
+ }
390
+ return result;
391
+ }
392
+ function transformTextToElement(message) {
393
+ if (isTranslationDescriptor(message)) {
394
+ return /* @__PURE__ */ jsxRuntime.jsx(reactI18next.Trans, { i18nKey: message.id, children: message.defaultValue });
395
+ }
396
+ return message;
397
+ }
398
+ function Confirm({
399
+ title,
400
+ message,
401
+ onAccept,
402
+ onDecline,
403
+ acceptButtonLabel,
404
+ declineButtonLabel,
405
+ acceptButtonStyle = "primary"
406
+ }) {
407
+ return /* @__PURE__ */ jsxRuntime.jsx(
408
+ Modal,
409
+ {
410
+ header: transformTextToElement(title),
411
+ content: transformTextToElement(message),
412
+ footer: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
413
+ /* @__PURE__ */ jsxRuntime.jsx(
414
+ Button,
415
+ {
416
+ primary: acceptButtonStyle === "primary",
417
+ danger: acceptButtonStyle === "danger",
418
+ onClick: onAccept,
419
+ children: acceptButtonLabel ? transformTextToElement(acceptButtonLabel) : /* @__PURE__ */ jsxRuntime.jsx(reactI18next.Trans, { i18nKey: "form.accept", children: "Accept" })
420
+ }
421
+ ),
422
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: onDecline, children: declineButtonLabel ? transformTextToElement(declineButtonLabel) : /* @__PURE__ */ jsxRuntime.jsx(reactI18next.Trans, { i18nKey: "form.decline", children: "Decline" }) })
423
+ ] }),
424
+ width: 500
425
+ }
426
+ );
427
+ }
428
+ const ConfirmContext = React.createContext({
429
+ confirm: () => Promise.reject(new Error("ConfirmProvider is missing!"))
430
+ });
431
+ function ConfirmProvider({ children }) {
432
+ const [visible, setVisible] = React.useState(false);
433
+ const [confirmProps, setConfirmProps] = React.useState({
434
+ title: "",
435
+ message: "",
436
+ onAccept: () => {
437
+ },
438
+ onDecline: () => {
439
+ }
440
+ });
441
+ async function confirm(options) {
442
+ return new Promise((resolve) => {
443
+ setVisible(true);
444
+ setConfirmProps({
445
+ ...options,
446
+ onAccept: () => {
447
+ setVisible(false);
448
+ resolve(true);
449
+ },
450
+ onDecline: () => {
451
+ setVisible(false);
452
+ resolve(false);
453
+ }
454
+ });
455
+ });
456
+ }
457
+ return /* @__PURE__ */ jsxRuntime.jsxs(ConfirmContext.Provider, { value: { confirm }, children: [
458
+ children,
459
+ visible && /* @__PURE__ */ jsxRuntime.jsx(Confirm, { ...confirmProps })
460
+ ] });
461
+ }
462
+ function useConfirm() {
463
+ const context = React.useContext(ConfirmContext);
464
+ if (!context) {
465
+ throw new Error("ConfirmProvider is missing");
466
+ }
467
+ const { confirm } = context;
468
+ return confirm;
469
+ }
470
+ function withConfirm(WrappedComponent) {
471
+ function WithConfirm(props) {
472
+ const confirm = useConfirm();
473
+ const { t } = reactI18next.useTranslation();
474
+ function trans(arg) {
475
+ if (isTranslationDescriptor(arg)) {
476
+ return t(arg.id, { defaultValue: arg.defaultValue });
477
+ }
478
+ return arg;
479
+ }
480
+ async function deprecatedConfirm(title, message, acceptButtonLabel, declineButtonLabel, resolveWithConfirmation, acceptButtonStyle) {
481
+ const accepted = await confirm({
482
+ title: trans(title),
483
+ message: isTranslationDescriptor(message) ? trans(message) : message,
484
+ acceptButtonLabel: acceptButtonLabel ? trans(acceptButtonLabel) : void 0,
485
+ declineButtonLabel: declineButtonLabel ? trans(declineButtonLabel) : void 0,
486
+ acceptButtonStyle
487
+ });
488
+ if (resolveWithConfirmation) {
489
+ return accepted;
490
+ } else if (!accepted) {
491
+ return new Promise(() => {
492
+ });
493
+ }
494
+ }
495
+ return /* @__PURE__ */ jsxRuntime.jsx(WrappedComponent, { ...props, confirm: deprecatedConfirm });
496
+ }
497
+ return function WithConfirmWrapper(props) {
498
+ return /* @__PURE__ */ jsxRuntime.jsx(ConfirmProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(WithConfirm, { ...props }) });
499
+ };
500
+ }
501
+ const iconAdd = "data:image/svg+xml,%3csvg%20id='icon-add_24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpolygon%20id='plus'%20points='20%2010%2014%2010%2014%204%2010%204%2010%2010%204%2010%204%2014%2010%2014%2010%2020%2014%2020%2014%2014%2020%2014%2020%2010'/%3e%3c/svg%3e";
502
+ const iconDel = "data:image/svg+xml,%3csvg%20id='icon-cross_24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpolygon%20id='icon-cross_24'%20points='20%206.28%2017.87%204%2012%209.78%206.13%204%204%206.28%209.78%2011.97%204%2017.66%206.13%2019.93%2012%2014.15%2017.87%2019.93%2020%2017.66%2014.22%2011.97%2020%206.28'/%3e%3c/svg%3e";
503
+ const iconEdit = "data:image/svg+xml,%3csvg%20id='icon-edit-24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%20id='stift'%3e%3cpath%20d='M7.35,12.65a.5.5,0,0,0,0,.7l3.3,3.3a.5.5,0,0,0,.7,0l8.3-8.3A1.4,1.4,0,0,0,20,7.5v-1a1.4,1.4,0,0,0-.35-.85l-1.3-1.3A1.4,1.4,0,0,0,17.5,4h-1a1.4,1.4,0,0,0-.85.35Z'/%3e%3c/g%3e%3cpath%20d='M5.9,14.49c.06-.27.26-.33.45-.14l3.3,3.3c.19.19.13.39-.14.45l-4,.8a.3.3,0,0,1-.39-.39Z'/%3e%3c/svg%3e";
504
+ const iconConfig = "data:image/svg+xml,%3csvg%20id='icon-gear-24_sga'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%20id='icon-gear-24_sga-2'%20data-name='icon-gear-24_sga'%3e%3cpath%20d='M22.82,14.06A1.25,1.25,0,0,0,24,13,7.66,7.66,0,0,0,24,12,7.66,7.66,0,0,0,24,11a1.25,1.25,0,0,0-1.13-1l-1.09,0A1.49,1.49,0,0,1,20.44,9c-.15-.47-.44-2-.07-2.37l.74-.81a1.16,1.16,0,0,0,0-1.5L19.7,2.87a1.16,1.16,0,0,0-1.5,0l-.81.74a1.5,1.5,0,0,1-1.54.27c-.44-.23-1.72-1.08-1.74-1.63l0-1.09A1.25,1.25,0,0,0,13,.05a7.66,7.66,0,0,0-1,0,7.66,7.66,0,0,0-1,.05,1.25,1.25,0,0,0-1,1.13l0,1.09A1.52,1.52,0,0,1,9,3.56c-.47.15-2,.44-2.37.07L5.8,2.89a1.16,1.16,0,0,0-1.5,0L2.86,4.3a1.18,1.18,0,0,0,0,1.5l.74.81A1.5,1.5,0,0,1,3.9,8.15c-.23.44-1.08,1.72-1.63,1.74l-1.09,0A1.25,1.25,0,0,0,.05,11a7.66,7.66,0,0,0,0,1,7.66,7.66,0,0,0,.05,1,1.25,1.25,0,0,0,1.13,1l1.09,0A1.47,1.47,0,0,1,3.55,15c.16.48.45,2,.08,2.37l-.74.81a1.16,1.16,0,0,0,0,1.5L4.3,21.13a1.16,1.16,0,0,0,1.5,0l.81-.74a1.5,1.5,0,0,1,1.54-.27c.44.23,1.72,1.08,1.75,1.63l0,1.09A1.25,1.25,0,0,0,11,24,7.66,7.66,0,0,0,12,24,7.66,7.66,0,0,0,13,24a1.25,1.25,0,0,0,1-1.13l0-1.09A1.49,1.49,0,0,1,15,20.44c.47-.15,2-.44,2.37-.07l.81.74a1.16,1.16,0,0,0,1.5,0l1.43-1.43a1.16,1.16,0,0,0,0-1.5l-.74-.81a1.5,1.5,0,0,1-.27-1.54c.23-.44,1.08-1.72,1.63-1.74ZM12,15.5A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z'/%3e%3c/g%3e%3c/svg%3e";
505
+ const iconDuplicate = "data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%3e%3cpath%20d='M22.1,4.91a3,3,0,0,0-3-3H6.44a2.4,2.4,0,0,1,1.34-.4h12.6A2.12,2.12,0,0,1,22.5,3.62V17.26a1.42,1.42,0,0,1-.4,1Z'/%3e%3cpath%20d='M20.38,1H7.78A3,3,0,0,0,5.26,2.4H19.09A2.51,2.51,0,0,1,21.6,4.91V19.12A1.94,1.94,0,0,0,23,17.26V3.62A2.62,2.62,0,0,0,20.38,1Z'/%3e%3c/g%3e%3cg%3e%3cpath%20d='M4,21.5A1.5,1.5,0,0,1,2.5,20V5.8A1.5,1.5,0,0,1,4,4.3H18.2a1.5,1.5,0,0,1,1.5,1.5V20a1.5,1.5,0,0,1-1.5,1.5ZM9.5,18a.5.5,0,0,0,.5.5h2a.5.5,0,0,0,.5-.5V14.5H16a.5.5,0,0,0,.5-.5V12a.5.5,0,0,0-.5-.5H12.5V8a.5.5,0,0,0-.5-.5H10a.5.5,0,0,0-.5.5v3.5H6a.5.5,0,0,0-.5.5v2a.5.5,0,0,0,.5.5H9.5Z'/%3e%3cpath%20d='M18.2,4.8a1,1,0,0,1,1,1V20a1,1,0,0,1-1,1H4a1,1,0,0,1-1-1V5.8a1,1,0,0,1,1-1H18.2M9,11H6a1,1,0,0,0-1,1v2a1,1,0,0,0,1,1H9v3a1,1,0,0,0,1,1h2a1,1,0,0,0,1-1V15h3a1,1,0,0,0,1-1V12a1,1,0,0,0-1-1H13V8a1,1,0,0,0-1-1H10A1,1,0,0,0,9,8v3m9.2-7.2H4a2,2,0,0,0-2,2V20a2,2,0,0,0,2,2H18.2a2,2,0,0,0,2-2V5.8a2,2,0,0,0-2-2ZM6,14V12h4V8h2v4h4v2H12v4H10V14Z'/%3e%3c/g%3e%3c/svg%3e";
506
+ const iconDownload = "data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3e%3cpolygon%20points='7.92%2012%202.84%207%2013%207%207.92%2012'/%3e%3crect%20x='5'%20y='2'%20width='6'%20height='5'/%3e%3crect%20x='2'%20y='14'%20width='12'%20height='1'/%3e%3c/svg%3e";
507
+ const iconSearch = "data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3e%3cdefs%3e%3cstyle%3e%20.cls-1%20{%20fill:%20%23fff;%20}%20%3c/style%3e%3c/defs%3e%3cg%3e%3ccircle%20class='cls-1'%20cx='5.5'%20cy='5.5'%20r='4.5'/%3e%3cpath%20d='M5.5,2A3.5,3.5,0,1,1,2,5.5,3.5,3.5,0,0,1,5.5,2m0-1A4.5,4.5,0,1,0,10,5.5,4.49,4.49,0,0,0,5.5,1Z'/%3e%3c/g%3e%3crect%20x='6.79'%20y='10.04'%20width='7.74'%20height='2.16'%20transform='translate(10.98%20-4.28)%20rotate(45)'/%3e%3c/svg%3e";
508
+ const iconIconKey = "data:image/svg+xml,%3csvg%20data-name='icon_key'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2027.02%2027'%3e%3cpath%20d='M35.07,16.5a8.52,8.52,0,0,0-7.69,12L17.2,38.8a2.46,2.46,0,0,0,0,3.46,2.41,2.41,0,0,0,3.42,0l1.69-1.7,2.91,2.94L31,37.63l-2.92-3,2.44-2.46a8.31,8.31,0,0,0,4.51,1.33,8.53,8.53,0,0,0,0-17Zm0,3.91A4.62,4.62,0,1,1,30.5,25,4.6,4.6,0,0,1,35.07,20.41Z'%20transform='translate(-16.49%20-16.5)'/%3e%3c/svg%3e";
509
+ const iconSync = "data:image/svg+xml,%3csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cg%20id='Pfeilende'%3e%3cpath%20d='M24,10H15l9-8.93Z'/%3e%3c/g%3e%3cpath%20d='M18.45,18.78A9.33,9.33,0,0,1,2.62,14.86,9.8,9.8,0,0,1,8.89,2.69,9.42,9.42,0,0,1,20.72,9.14H23A11.72,11.72,0,0,0,11.68,0,11.74,11.74,0,0,0,.34,9.14,12,12,0,0,0,8.89,23.65a11.43,11.43,0,0,0,11.16-3.31Z'/%3e%3c/svg%3e";
510
+ const iconFullscreen = "data:image/svg+xml,%3csvg%20data-name='icon_fullscreen_sga'%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%3e%3cpolygon%20id='ecke'%20points='2%2014%202%2010%200%2010%200%2016%206%2016%206%2014%202%2014'/%3e%3cpolygon%20id='ecke-2'%20data-name='ecke'%20points='2%202%206%202%206%200%200%200%200%206%202%206%202%202'/%3e%3cpolygon%20id='ecke-3'%20data-name='ecke'%20points='14%2014%2010%2014%2010%2016%2016%2016%2016%2010%2014%2010%2014%2014'/%3e%3cpolygon%20id='ecke-4'%20data-name='ecke'%20points='10%200%2010%202%2014%202%2014%206%2016%206%2016%200%2010%200'/%3e%3c/svg%3e";
511
+ const iconDocumentation = "data:image/svg+xml,%3csvg%20id='Icon_help'%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20id='icon_help-2'%20data-name='icon_help'%20d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm1,16H11V15h2Zm1.7-6.26a4.85,4.85,0,0,1-.49.81l-1,1.37a1.36,1.36,0,0,0-.18.34,1,1,0,0,0-.07.38L13,14H11l.1-.49a2,2,0,0,1,.13-.77,3.18,3.18,0,0,1,.4-.69l1-1.33a3.21,3.21,0,0,0,.29-.46,1.19,1.19,0,0,0,.11-.47,1.17,1.17,0,0,0-.3-.82,1.07,1.07,0,0,0-.83-.33A1,1,0,0,0,11.1,9a1.25,1.25,0,0,0-.28.83H9a2.94,2.94,0,0,1,.23-1.17,2.45,2.45,0,0,1,.63-.88,2.9,2.9,0,0,1,.93-.55A3.13,3.13,0,0,1,11.94,7a3.31,3.31,0,0,1,1.13.19,2.82,2.82,0,0,1,.94.54,2.62,2.62,0,0,1,.65.88A3,3,0,0,1,14.9,9.8,2.16,2.16,0,0,1,14.7,10.74Z'%20style='opacity:%200.2'/%3e%3c/svg%3e";
512
+ const iconStar = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='icon_star_16'%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%3e%3cpath%20id='star'%20d='M8,0l2.45,4.97,5.55,.76-4.04,3.83,.99,5.44-4.94-2.61-4.94,2.61,.99-5.44L0,5.73l5.55-.76L8,0Z'/%3e%3c/svg%3e";
513
+ function getSrc(props) {
514
+ const { add, del, edit, config, duplicate, search, download, sync, fullscreen, iconKey, documentation, star } = props;
515
+ if (add) {
516
+ return iconAdd;
517
+ } else if (del) {
518
+ return iconDel;
519
+ } else if (edit) {
520
+ return iconEdit;
521
+ } else if (config) {
522
+ return iconConfig;
523
+ } else if (duplicate) {
524
+ return iconDuplicate;
525
+ } else if (search) {
526
+ return iconSearch;
527
+ } else if (download) {
528
+ return iconDownload;
529
+ } else if (sync) {
530
+ return iconSync;
531
+ } else if (fullscreen) {
532
+ return iconFullscreen;
533
+ } else if (iconKey) {
534
+ return iconIconKey;
535
+ } else if (documentation) {
536
+ return iconDocumentation;
537
+ } else if (star) {
538
+ return iconStar;
539
+ } else {
540
+ throw Error("getSrc: no icon type specified");
541
+ }
542
+ }
543
+ function getAlt(props) {
544
+ const { add, del, edit, config, duplicate, search, download, sync, fullscreen, iconKey, documentation, star } = props;
545
+ if (add) {
546
+ return "icon add";
547
+ } else if (del) {
548
+ return "icon delete";
549
+ } else if (edit) {
550
+ return "icon edit";
551
+ } else if (config) {
552
+ return "icon config";
553
+ } else if (duplicate) {
554
+ return "icon duplicate";
555
+ } else if (search) {
556
+ return "icon search";
557
+ } else if (download) {
558
+ return "icon download";
559
+ } else if (sync) {
560
+ return "icon sync";
561
+ } else if (fullscreen) {
562
+ return "icon fullscreen";
563
+ } else if (iconKey) {
564
+ return "icon iconKey";
565
+ } else if (documentation) {
566
+ return "icon documentation";
567
+ } else if (star) {
568
+ return "icon star";
569
+ } else {
570
+ throw Error("getAlt: no icon type specified");
571
+ }
572
+ }
573
+ function Icon(props) {
574
+ let style;
575
+ if (props.large) {
576
+ style = { width: 24, height: 24 };
577
+ } else {
578
+ style = { width: 16, height: 16 };
579
+ }
580
+ if (props.inverted) {
581
+ style = { ...style, filter: "invert(1)" };
582
+ }
583
+ return /* @__PURE__ */ jsxRuntime.jsx("img", { src: getSrc(props), className: `di icon ${props.className || ""}`, alt: getAlt(props), style });
584
+ }
585
+ function Label({
586
+ text,
587
+ small = false,
588
+ large = false,
589
+ onDelete,
590
+ className,
591
+ onClick,
592
+ children,
593
+ ...dataTestIds
594
+ }) {
595
+ function handleDelete(event) {
596
+ event.stopPropagation();
597
+ if (onDelete) {
598
+ onDelete();
599
+ }
600
+ }
601
+ return /* @__PURE__ */ jsxRuntime.jsxs(
602
+ "span",
603
+ {
604
+ onClick,
605
+ className: cx("di label", className, { large, small, removable: onDelete, clickable: !!onClick }),
606
+ "data-testid": dataTestIds["data-testid"],
607
+ children: [
608
+ typeof text === "string" ? text : text && /* @__PURE__ */ jsxRuntime.jsx(reactI18next.Trans, { i18nKey: text.id, children: text.defaultValue }),
609
+ /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children }),
610
+ onDelete && /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": dataTestIds["delete-button-data-testid"], className: "remove", onClick: handleDelete, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { del: true, inverted: true }) })
611
+ ]
612
+ }
613
+ );
614
+ }
615
+ const MARGIN = 16;
616
+ function Popup({
617
+ placement = "bottom",
618
+ mode = ["click"],
619
+ disabled,
620
+ handler,
621
+ handlerWrapperClassName,
622
+ preventDestroyContentOnHide,
623
+ open,
624
+ onOpenChange,
625
+ className,
626
+ children
627
+ }) {
628
+ const arrowRef = React.useRef(null);
629
+ const {
630
+ elements,
631
+ update,
632
+ refs,
633
+ floatingStyles,
634
+ context,
635
+ middlewareData,
636
+ placement: computedPlacement
637
+ } = react.useFloating({
638
+ placement,
639
+ open,
640
+ onOpenChange,
641
+ whileElementsMounted: !preventDestroyContentOnHide ? react.autoUpdate : void 0,
642
+ middleware: [
643
+ react.offset({
644
+ mainAxis: 12
645
+ }),
646
+ react.flip({
647
+ padding: MARGIN,
648
+ boundary: "clippingAncestors",
649
+ altBoundary: true
650
+ }),
651
+ react.shift({
652
+ padding: MARGIN,
653
+ boundary: "clippingAncestors",
654
+ altBoundary: true
655
+ }),
656
+ react.size({
657
+ padding: MARGIN,
658
+ boundary: "clippingAncestors",
659
+ altBoundary: true,
660
+ apply({ availableHeight, availableWidth, elements: elements2 }) {
661
+ const width = `${Math.max(0, availableWidth - MARGIN)}px`;
662
+ const height = `${Math.max(0, availableHeight - MARGIN)}px`;
663
+ elements2.floating.style.maxWidth = width;
664
+ elements2.floating.style.maxHeight = height;
665
+ }
666
+ }),
667
+ react.arrow({
668
+ element: arrowRef
669
+ })
670
+ ]
671
+ });
672
+ React.useEffect(() => {
673
+ if (preventDestroyContentOnHide && open && elements.reference && elements.floating) {
674
+ const cleanup = react.autoUpdate(elements.reference, elements.floating, update);
675
+ return cleanup;
676
+ }
677
+ }, [elements.floating, elements.reference, open, update, preventDestroyContentOnHide]);
678
+ const click = react.useClick(context, {
679
+ enabled: !disabled && mode.includes("click"),
680
+ keyboardHandlers: false
681
+ // Prevent space key from being blocked in input fields (floating-ui issue #1812)
682
+ });
683
+ const hover = react.useHover(context, {
684
+ enabled: !disabled && mode.includes("hover"),
685
+ handleClose: react.safePolygon()
686
+ });
687
+ const focus = react.useFocus(context, { enabled: !disabled && mode.includes("focus") });
688
+ const dismiss = react.useDismiss(context);
689
+ const { getReferenceProps, getFloatingProps } = react.useInteractions([click, hover, focus, dismiss]);
690
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
691
+ /* @__PURE__ */ jsxRuntime.jsx(
692
+ "span",
693
+ {
694
+ style: { display: "inline-block" },
695
+ className: cx("popup-handler-wrapper", handlerWrapperClassName),
696
+ ref: refs.setReference,
697
+ ...getReferenceProps(),
698
+ children: handler
699
+ }
700
+ ),
701
+ (open || preventDestroyContentOnHide) && /* @__PURE__ */ jsxRuntime.jsx(react.FloatingPortal, { children: /* @__PURE__ */ jsxRuntime.jsx(
702
+ "div",
703
+ {
704
+ className: cx("di popup-wrapper", { hidden: preventDestroyContentOnHide && !open }),
705
+ ref: refs.setFloating,
706
+ style: { ...floatingStyles, zIndex: 1e5 },
707
+ ...getFloatingProps(),
708
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx("di popup", computedPlacement, className), children: [
709
+ /* @__PURE__ */ jsxRuntime.jsx(
710
+ "div",
711
+ {
712
+ className: cx("popup-arrow", computedPlacement),
713
+ ref: arrowRef,
714
+ style: { left: middlewareData.arrow?.x, top: middlewareData.arrow?.y }
715
+ }
716
+ ),
717
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "popup-content", children })
718
+ ] })
719
+ }
720
+ ) })
721
+ ] });
722
+ }
723
+ function Bubble({ content, inverted, children, disabled, style, direction, className }) {
724
+ const [open, setOpen] = React.useState(false);
725
+ return /* @__PURE__ */ jsxRuntime.jsx(
726
+ Popup,
727
+ {
728
+ open,
729
+ onOpenChange: setOpen,
730
+ handler: children,
731
+ disabled,
732
+ mode: ["hover"],
733
+ placement: direction ? direction : "top",
734
+ className: `bubble ${inverted ? "inverted" : ""} ${className ? className : ""}`,
735
+ children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `bubble-content`, style, children: content })
736
+ }
737
+ );
738
+ }
739
+ function Tooltip({ content, children, className, direction, disabled }) {
740
+ const [open, setOpen] = React.useState(false);
741
+ return /* @__PURE__ */ jsxRuntime.jsx(
742
+ Popup,
743
+ {
744
+ open,
745
+ disabled,
746
+ mode: ["hover"],
747
+ onOpenChange: setOpen,
748
+ handler: children,
749
+ placement: direction ? direction : "right",
750
+ className: `tooltip inverted ${className ? className : ""}`,
751
+ children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tooltip-content", children: content })
752
+ }
753
+ );
754
+ }
755
+ class Tabs extends React__namespace.Component {
756
+ state = {
757
+ currentTab: this.props.pages.length ? this.props.pages[0].name : null
758
+ };
759
+ handleClick = (tab) => {
760
+ if (this.props.onChange) {
761
+ this.props.onChange(tab);
762
+ } else if (typeof this.props.currentTab === "undefined") {
763
+ this.setState({
764
+ currentTab: tab
765
+ });
766
+ }
767
+ };
768
+ currentTabPage = () => {
769
+ const currentTab = typeof this.props.currentTab === "string" ? this.props.currentTab : this.state.currentTab;
770
+ return this.props.pages.find(({ name }) => currentTab === name);
771
+ };
772
+ isCurrentTab = (tab) => {
773
+ const currentTab = typeof this.props.currentTab === "string" ? this.props.currentTab : this.state.currentTab;
774
+ return currentTab === tab;
775
+ };
776
+ renderBody = () => {
777
+ const page = this.currentTabPage();
778
+ if (page && typeof page.renderBody === "function") {
779
+ return page.renderBody();
780
+ }
781
+ return null;
782
+ };
783
+ render() {
784
+ const { pages, disabled } = this.props;
785
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
786
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "di tabs", children: pages.map(
787
+ ({ name, renderHeading, tabDescription }) => tabDescription ? /* @__PURE__ */ jsxRuntime.jsx(Bubble, { inverted: true, content: tabDescription, className: "bubble-tab-description", children: /* @__PURE__ */ jsxRuntime.jsx(
788
+ "button",
789
+ {
790
+ "data-testid": "tab-button",
791
+ className: `item ${disabled ? "disabled" : ""} ${this.isCurrentTab(name) ? "active" : ""}`,
792
+ onClick: () => !disabled && this.handleClick(name),
793
+ children: renderHeading()
794
+ }
795
+ ) }, name) : /* @__PURE__ */ jsxRuntime.jsx(
796
+ "button",
797
+ {
798
+ "data-testid": "tab-button",
799
+ className: `item ${disabled ? "disabled" : ""} ${this.isCurrentTab(name) ? "active" : ""}`,
800
+ onClick: () => !disabled && this.handleClick(name),
801
+ children: renderHeading()
802
+ },
803
+ name
804
+ )
805
+ ) }),
806
+ this.renderBody()
807
+ ] });
808
+ }
809
+ }
810
+ const ClearButton = ({
811
+ onChange,
812
+ inputElement,
813
+ style
814
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
815
+ Button,
816
+ {
817
+ naked: true,
818
+ onClick: () => {
819
+ onChange("");
820
+ if (inputElement) {
821
+ inputElement.focus();
822
+ }
823
+ },
824
+ style,
825
+ children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { del: true })
826
+ }
827
+ );
828
+ class SearchBox extends React__namespace.Component {
829
+ state = {
830
+ query: this.props.initialValue || ""
831
+ };
832
+ input;
833
+ printPlaceholder() {
834
+ const { t, placeholder } = this.props;
835
+ if (typeof placeholder === "object") {
836
+ return t(placeholder.id, {
837
+ defaultValue: placeholder.defaultValue
838
+ });
839
+ } else {
840
+ return placeholder;
841
+ }
842
+ }
843
+ handleChange = (value) => {
844
+ const { onChange } = this.props;
845
+ this.setState({
846
+ query: value
847
+ });
848
+ onChange(value);
849
+ };
850
+ handleKeyUp = ({ key }) => {
851
+ const { onSubmit } = this.props;
852
+ const { query } = this.state;
853
+ if (key === "Enter" && typeof onSubmit === "function") {
854
+ onSubmit(query);
855
+ }
856
+ };
857
+ render() {
858
+ const { onSubmit, style, clearable } = this.props;
859
+ const { query } = this.state;
860
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "search-box", style, children: [
861
+ /* @__PURE__ */ jsxRuntime.jsx(
862
+ "input",
863
+ {
864
+ ref: (input) => {
865
+ this.input = input;
866
+ },
867
+ type: "text",
868
+ value: query,
869
+ placeholder: this.printPlaceholder(),
870
+ onKeyUp: this.handleKeyUp,
871
+ onChange: ({ target: { value } }) => this.handleChange(value)
872
+ }
873
+ ),
874
+ typeof onSubmit === "function" ? /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
875
+ query && clearable && /* @__PURE__ */ jsxRuntime.jsx(
876
+ ClearButton,
877
+ {
878
+ onChange: this.handleChange,
879
+ inputElement: this.input,
880
+ style: {
881
+ right: 30
882
+ }
883
+ }
884
+ ),
885
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { naked: true, onClick: () => onSubmit(query), children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { search: true }) })
886
+ ] }) : query && clearable ? /* @__PURE__ */ jsxRuntime.jsx(ClearButton, { onChange: this.handleChange, inputElement: this.input }) : /* @__PURE__ */ jsxRuntime.jsx(Button, { naked: true, disabled: true, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { search: true }) })
887
+ ] });
888
+ }
889
+ }
890
+ const SearchBox_default = reactI18next.withTranslation()(SearchBox);
891
+ exports.Accordion = Accordion;
892
+ exports.AccordionItem = AccordionItem;
893
+ exports.Bubble = Bubble;
894
+ exports.Button = Button;
895
+ exports.ButtonRow = ButtonRow;
896
+ exports.Checkbox = Checkbox_default;
897
+ exports.ConfirmProvider = ConfirmProvider;
898
+ exports.Icon = Icon;
899
+ exports.Label = Label;
900
+ exports.Modal = Modal;
901
+ exports.ModalContainer = ModalContainer;
902
+ exports.Popup = Popup;
903
+ exports.SearchBox = SearchBox_default;
904
+ exports.Spinner = Spinner;
905
+ exports.SpinnerContainer = SpinnerContainer;
906
+ exports.Tabs = Tabs;
907
+ exports.Tooltip = Tooltip;
908
+ exports.useConfirm = useConfirm;
909
+ exports.withConfirm = withConfirm;
2
910
  //# sourceMappingURL=index.cjs.map