@hbuesing/ui-library 3.1.0 → 4.0.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.
Files changed (11) hide show
  1. package/dist/bundle.js +1 -1
  2. package/dist/bundle.js.map +1 -1
  3. package/dist/components/checkbox/customCheckbox.d.ts +1 -1
  4. package/dist/components/input/passwordInput.d.ts +1 -2
  5. package/dist/components/modal/baseModal.d.ts +1 -2
  6. package/dist/index.d.ts +3 -4
  7. package/dist/utils/useInjectStyles.d.ts +1 -1
  8. package/package.json +4 -5
  9. package/dist/enums/index.d.ts +0 -1
  10. package/dist/enums/modalType.d.ts +0 -6
  11. package/dist/enums/passwordRuleTypes.d.ts +0 -8
package/dist/bundle.js CHANGED
@@ -1,2 +1,2 @@
1
- import e,{useEffect as l,useRef as i,useState as r}from"react";function t(){return t=Object.assign?Object.assign.bind():function(e){for(var l=1;l<arguments.length;l++){var i=arguments[l];for(var r in i)({}).hasOwnProperty.call(i,r)&&(e[r]=i[r])}return e},t.apply(null,arguments)}function a(e,l){if(null==e)return{};var i={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(l.includes(r))continue;i[r]=e[r]}return i}var o=":root{--uil-black:#000;--uil-black-alt:#222;--uil-white:#fff;--uil-grey:#f3f3f3;--uil-grey-alt:#cfcfcf;--uil-grey-dark:#878787;--uil-outline-focus:#1e90ff;--uil-outline-disabled:#8b0000;--uil-success:#006a4e;--uil-error:#800020;--uil-question:#00416a;--uil-warning:gold;--uil-xxxs:.125rem;--uil-xxs:.25rem;--uil-xs:.5rem;--uil-s:.75rem;--uil-m:1rem;--uil-l:1.25rem;--uil-xl:1.5rem;--uil-xxl:1.75rem;--uil-xxxl:2rem;--uil-font-base:var(--uil-l);--uil-font-small:var(--uil-m)}.uil-button{background-color:var(--uil-white);border:1px solid var(--uil-black);border-radius:2px;box-shadow:0 0 3px 0 var(--uil-black-alt);color:var(--uil-black);cursor:pointer;letter-spacing:1px;padding:.375rem var(--uil-xxs)}@media (min-width:760px){.uil-button{padding:var(--uil-xs) var(--uil-s)}}.uil-button.uil-disabled{background-color:var(--uil-grey-dark);border:transparent;color:var(--uil-grey)}.uil-button.uil-small{font-size:var(--uil-font-small);line-height:var(--uil-font-small);padding:var(--uil-xxs) var(--uil-xs)}.uil-check-wrapper{align-items:center;display:flex;font-size:var(--uil-font-base);gap:var(--uil-s);line-height:var(--uil-font-base)}.uil-check-wrapper .uil-checkbox{border-radius:2px}.uil-svg-wrapper{display:flex;height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content}.uil-svg-wrapper .uil-svg{height:var(--uil-xxxl);width:var(--uil-xxxl)}.uil-input-wrapper{display:block;position:relative}.uil-input-wrapper .uil-label{background:linear-gradient(0deg,var(--uil-white) 9px,transparent 0);color:var(--uil-black);cursor:text;font-weight:700;left:var(--uil-xxs);opacity:.6;padding:0 var(--uil-xxxs);position:absolute;top:25%;transition:top .25s ease-in-out}.uil-input-wrapper .uil-input{background-color:var(--uil-white);border:1px solid var(--uil-black);border-radius:0;box-sizing:border-box;color:var(--uil-black);padding:var(--uil-xs);width:100%}.uil-input-wrapper .uil-input::-moz-placeholder{color:transparent;height:0;width:0}.uil-input-wrapper .uil-input::placeholder{color:transparent;height:0;width:0}.uil-input-wrapper .uil-input:focus{outline:1px solid var(--uil-outline-focus)}.uil-input-wrapper .uil-input:disabled{background-color:var(--uil-grey);border:2px solid var(--uil-outline-disabled);color:var(--uil-grey-dark);cursor:not-allowed}.uil-input-wrapper .uil-input:disabled~.uil-label{background:transparent;color:var(--uil-grey-dark);cursor:not-allowed}.uil-input-wrapper .uil-input:disabled~.uil-icon{fill:var(--uil-grey-dark);cursor:not-allowed}.uil-input-wrapper .uil-input:disabled:not(:-moz-placeholder-shown)~.uil-label{background:linear-gradient(0deg,var(--uil-grey) 8px,transparent 0)}.uil-input-wrapper .uil-input:disabled:not(:placeholder-shown)~.uil-label{background:linear-gradient(0deg,var(--uil-grey) 8px,transparent 0)}.uil-input-wrapper .uil-icon{fill:var(--uil-black);align-items:center;display:flex;justify-content:center;opacity:.5;position:absolute;right:var(--uil-xs);top:50%;transform:translateY(-50%)}.uil-input-wrapper .uil-input:not(:-moz-placeholder-shown)~.uil-label{opacity:1;top:-30%}.uil-input-wrapper .uil-input:focus~.uil-label,.uil-input-wrapper .uil-input:not(:placeholder-shown)~.uil-label{opacity:1;top:-30%}.uil-input-wrapper .uil-input:not(:-moz-placeholder-shown)~.uil-icon{opacity:1}.uil-input-wrapper .uil-input:focus~.uil-icon,.uil-input-wrapper .uil-input:not(:placeholder-shown)~.uil-icon{opacity:1}.uil-tooltip-wrapper{position:relative}.uil-tooltip-wrapper .uil-tooltip-icon{fill:var(--uil-black-alt);cursor:pointer;margin-bottom:var(--uil-xxs)}.uil-tooltip-wrapper .uil-tooltip-icon:has(~.uil-input-wrapper>.uil-input:not(:-moz-placeholder-shown),~.uil-input-wrapper:focus-within){opacity:0;-moz-transition:opacity .3s,visibility .3s;transition:opacity .3s,visibility .3s;visibility:hidden}.uil-tooltip-wrapper .uil-tooltip-icon:has(~.uil-input-wrapper>.uil-input:not(:placeholder-shown),~.uil-input-wrapper:focus-within){opacity:0;transition:opacity .3s,visibility .3s;visibility:hidden}.uil-tooltip-wrapper .uil-tooltip{background-color:rgba(34,34,34,.9);border-radius:3px;box-sizing:border-box;color:var(--uil-white);font-size:var(--uil-font-small);left:0;line-height:var(--uil-font-small);padding:var(--uil-s);position:absolute;top:0;width:100%;z-index:1}.uil-tooltip-wrapper .uil-tooltip .uil-tooltip-button{background-color:transparent;border:none;border-bottom:1px solid var(--uil-white);color:var(--uil-white);cursor:pointer;display:block;margin-bottom:var(--uil-m);margin-left:auto;padding:0}.uil-password-rules{display:flex;flex-direction:column;gap:var(--uil-xs);margin-left:var(--uil-xs);margin-top:var(--uil-m)}.uil-password-rules .uil-password-rule{align-items:center;display:flex;font-size:var(--uil-font-small);gap:var(--uil-xxs);line-height:var(--uil-font-small)}.uil-modal-wrapper{background-color:rgba(0,0,0,.5);height:100%;left:0;position:fixed;top:0;width:100%;z-index:99}.uil-modal-wrapper .uil-modal{border-radius:5px;box-shadow:0 0 6px 0 var(--uil-black);left:50%;position:absolute;top:30%;transform:translateX(-50%);width:95%;z-index:999}@media (min-width:1025px){.uil-modal-wrapper .uil-modal{width:75%}}@media (min-width:1250px){.uil-modal-wrapper .uil-modal{width:55%}}@media (min-width:1920px){.uil-modal-wrapper .uil-modal{width:35%}}.uil-modal-wrapper .uil-modal .uil-progress-wrapper{background-color:var(--uil-grey-alt)}.uil-modal-wrapper .uil-modal .uil-progress-wrapper .uil-progress-bar{animation-duration:2s;animation-iteration-count:1;animation-name:uil-progress;border:2px solid var(--uil-grey-dark)}@keyframes uil-progress{0%{width:100%}to{width:0}}.uil-modal-wrapper .uil-modal .uil-header{background-color:var(--uil-question);border-top-left-radius:3px;border-top-right-radius:3px;color:var(--uil-white);display:flex;font-size:var(--uil-xl);font-weight:700;justify-content:space-between;line-height:var(--uil-xl);margin:0;padding:var(--uil-s)}@media (min-width:1025px){.uil-modal-wrapper .uil-modal .uil-header{font-size:var(--uil-xxxl);line-height:var(--uil-xxxl);padding:var(--uil-m)}}.uil-modal-wrapper .uil-modal .uil-header.uil-success{background-color:var(--uil-success)}.uil-modal-wrapper .uil-modal .uil-header.uil-error{background-color:var(--uil-error)}.uil-modal-wrapper .uil-modal .uil-header.uil-warning{background-color:var(--uil-warning);color:var(--uil-black)}.uil-modal-wrapper .uil-modal .uil-content{background-color:var(--uil-white);border-bottom-left-radius:3px;border-bottom-right-radius:3px;display:flex;flex-direction:column;gap:var(--uil-m);padding:var(--uil-m)}@media (min-width:1025px){.uil-modal-wrapper .uil-modal .uil-content{gap:var(--uil-xxxl);padding:var(--uil-l)}}.uil-modal-wrapper .uil-modal .uil-content .uil-modal-text{color:var(--uil-black);font-size:var(--uil-font-base);line-height:var(--uil-font-base);margin:0}.uil-modal-wrapper .uil-modal .uil-content .uil-button-wrapper{display:flex;justify-content:space-between}.uil-modal-wrapper .uil-modal .uil-content .uil-button-wrapper.uil-single{justify-content:end}.uil-radio-title{display:block;font-size:var(--uil-xl);line-height:var(--uil-xl);margin-bottom:var(--uil-m)}.uil-radio-wrapper{display:flex;flex-direction:column;gap:var(--uil-m)}.uil-radio-wrapper .uil-radio-option{align-items:center;display:flex;gap:.25rem}.uil-radio-wrapper .uil-radio-option .uil-radio,.uil-radio-wrapper .uil-radio-option .uil-radio .uil-radio-check{border-radius:50%}.uil-fit{height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content}.uil-font-base{font-size:var(--uil-font-base);line-height:var(--uil-font-base)}.uil-check{border:2px solid var(--uil-black-alt);box-sizing:border-box;cursor:pointer;display:block;font-size:var(--uil-font-small);line-height:var(--uil-font-small);min-height:var(--uil-l);min-width:var(--uil-l);position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.uil-check:has(input:disabled){background-color:var(--uil-grey);border-color:var(--uil-grey-dark)}.uil-check input{cursor:pointer;height:0;opacity:0;position:absolute;width:0}.uil-check input:checked~.uil-checkmark{transform:scale(1)}.uil-check input:disabled~.uil-checkmark{background-color:var(--uil-grey-dark)}.uil-check .uil-checkmark{background-color:var(--uil-black-alt);height:var(--uil-xs);left:25%;position:absolute;top:25%;transform:scale(0);transition:.1s ease;width:var(--uil-xs)}";const n=[];function u(e){l(()=>{const l=e.current?e.current.ownerDocument:document;if(void 0!==l&&!n.includes(l)){const e=l.createElement("style");e.innerHTML=o,n.push(l),l.head.appendChild(e)}},[])}function c(e){if(7!==e.length)throw new Error("provided hex color must be 7 characters (including #) long");e=e.substring(1,7);const l=[parseInt(e.substring(0,2),16)/255,parseInt(e.substring(2,4),16)/255,parseInt(e.substring(4,6),16)/255].map(e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return.2126*l[0]+.7152*l[1]+.0722*l[2]>.179?"#000000":"#ffffff"}const s=["disabled","label","small","theme"];function p(l){const{disabled:r=!1,label:o,small:n=!1,theme:p}=l,d=a(l,s),m=i(null);return u(m),e.createElement("button",t({className:function(){const e="uil-button uil-fit";return r&&!n?`${e} uil-font-base uil-disabled`:r&&n?`${e} uil-disabled uil-small`:n?`${e} uil-small`:`${e} uil-font-base`}(),style:function(){if(!r&&p){if(p.includes("#"))return{color:c(p),backgroundColor:p,border:"transparent"};switch(p){case"success":return{color:c("#006A4E"),backgroundColor:"#006A4E",border:"transparent"};case"warning":return{color:"#000000",backgroundColor:"#FFD700",border:"transparent"};case"error":return{color:c("#800020"),backgroundColor:"#800020",border:"transparent"};default:throw new Error("invalid theme provided")}}}(),disabled:r},d,{ref:m}),o)}const d=["checkColor","checked","toggleCheck","label","children"];function m(l){const{checkColor:r,checked:o,toggleCheck:n,label:c,children:s}=l,p=a(l,d),m=i(null);return u(m),e.createElement("div",{className:"uil-check-wrapper",ref:m},e.createElement("label",{className:"uil-checkbox uil-check"},e.createElement("input",t({type:"checkbox",checked:o,onChange:()=>{n(!o)}},p)),e.createElement("div",{className:"uil-checkmark",style:{backgroundColor:r}})),s||e.createElement("span",{onClick:()=>n(!o),style:{cursor:"pointer",userSelect:"none"}},c))}function h(l){const{src:r,color:t,height:a,width:o}=l;if(!r.includes(".svg"))throw new Error("Provided src is not an svg image");const n=i(null);return u(n),e.createElement("div",{ref:n,className:"uil-svg-wrapper"},e.createElement("svg",{"aria-hidden":!0,className:"uil-svg",style:{fill:t,height:`${a}px`,width:`${o}px`}},e.createElement("use",{href:r})))}const b=["iconColor","iconSrc","inputColor","label","toggle","valueChanged"];function g(l){const{iconColor:r,iconSrc:o,inputColor:n,label:c,toggle:s,valueChanged:p}=l,d=a(l,b),m=i(null);return u(m),e.createElement("label",{className:"uil-input-wrapper",htmlFor:d.id,ref:m},e.createElement("input",t({className:"uil-input uil-font-base",onChange:e=>p(e.target.value),placeholder:c,style:{color:n}},d)),o&&e.createElement("div",{className:"uil-icon",onClick:s},e.createElement(h,{src:o,width:24,height:24,color:r})),e.createElement("span",{className:"uil-label uil-font-base",style:{color:n}},c))}function f(e){const r=i(null);return l(()=>{if(r.current)return document.addEventListener("click",l),document.addEventListener("touchend",l),()=>{document.removeEventListener("click",l),document.removeEventListener("touchend",l)};function l(l){r.current&&!r.current.contains(l.target)&&e()}},[e]),r}const v=["tooltipClose","tooltipIcon","tooltipText"];function w(l){const{tooltipClose:i,tooltipIcon:o,tooltipText:n}=l,u=a(l,v),[c,s]=r(!1),p=f(d);function d(){s(!1)}return e.createElement(e.Fragment,null,o?e.createElement("div",{className:"uil-tooltip-wrapper",ref:p},c&&e.createElement("div",{className:"uil-tooltip"},i&&e.createElement("button",{className:"uil-tooltip-button uil-fit",onClick:d},i),e.createElement("span",null,n)),e.createElement("div",{className:"uil-tooltip-icon uil-fit",onClick:()=>s(!c)},e.createElement(h,{src:o,height:16,width:16})),e.createElement(g,t({},u))):e.createElement(g,t({},u)))}var k;function x(e){return`${e}-${(new Date).getTime()}`}!function(e){e[e.minLength=1]="minLength",e[e.maxLength=2]="maxLength",e[e.letters=3]="letters",e[e.numbers=4]="numbers",e[e.special=5]="special",e[e.upper=6]="upper"}(k||(k={}));const y=["capsLockWarning","rules","ruleChecked","ruleUnchecked","setFailedRules"];function E(i){const{capsLockWarning:o,rules:n,ruleChecked:u,ruleUnchecked:c,setFailedRules:s}=i,p=a(i,y),[d,m]=r(!1);function b(e){let l;if(e.type){if(!e.count)throw new Error("count must not be empty if a type is provided");switch(e.type){case k.minLength:l=`[a-zA-Z0-9ßÄäÖöÜü._!"\`'#%&§,:;<>=@{}~\\$\\(\\)\\*\\+\\/\\\\\\?\\[\\]\\^\\|\\-]{${e.count},}`;break;case k.maxLength:l=`^[a-zA-Z0-9ßÄäÖöÜü._!"\`'#%&,:;<>=@{}~\\$\\(\\)\\*\\+\\/\\\\\\?\\[\\]\\^\\|\\-]{0,${e.count}}$`;break;case k.letters:l=`[a-zA-ZßÄäÖöÜü]{${e.count},}`;break;case k.numbers:l=`[0-9]{${e.count},}`;break;case k.special:l=`[._!"\`'#%&§,:;<>=@{}~\\$\\(\\)\\*\\+\\/\\\\\\?\\[\\]\\^\\|\\-]{${e.count},}`;break;case k.upper:l=`[A-ZÄÖÜ]{${e.count},}`;break;default:throw new Error("unrecognized rule type provided")}}else l=e.pattern?e.pattern:"";if(""===l)throw new Error("pattern must not be an empty string");return new RegExp(l).test(i.value)}return l(()=>{!function(){const e=[];n.forEach(l=>{b(l)||e.push(l)}),null==s||s(e)}()},[i.value]),l(()=>{if(o)return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e);function e(e){m(null==e.getModifierState?void 0:e.getModifierState("CapsLock"))}},[]),e.createElement("div",null,e.createElement(w,t({},p)),e.createElement("div",{className:"uil-password-rules"},d&&e.createElement("div",{className:"uil-password-rule"},o),n.map((l,i)=>e.createElement("div",{key:x(i),className:"uil-password-rule"},e.createElement(h,{src:b(l)?u:c,height:12,width:12}),e.createElement("span",null,l.label)))))}var C;function N(r){const{callback:t,cancelLabel:a="",close:o,closeLabel:n,confirm:c,confirmLabel:s="",message:d,timeout:m,title:h,type:b}=r;let g;const f=i(null);return u(f),l(()=>{if(m)return g=setTimeout(()=>t?t():o(),m),()=>clearTimeout(g)},[]),e.createElement("div",{className:"uil-modal-wrapper",ref:f},e.createElement("div",{className:"uil-modal"},e.createElement("div",{className:function(){const e="uil-header";switch(b){case C.error:return`${e} uil-error`;case C.success:return`${e} uil-success`;case C.warning:return`${e} uil-warning`;default:return e}}()},h),m&&e.createElement("div",{className:"uil-progress-wrapper"},e.createElement("div",{className:"uil-progress-bar",style:{animationDuration:m/1e3+.5+"s"}})),e.createElement("div",{className:"uil-content"},e.createElement("div",null,Array.isArray(d)?d.map((l,i)=>e.createElement("p",{key:x(i),className:"uil-modal-text"},l)):e.createElement("p",{className:"uil-modal-text"},d)),e.createElement("div",{className:"uil-button-wrapper "+(b!==C.question?"uil-single":"")},b!==C.question&&e.createElement(p,{label:null!=n?n:"",onClick:function(){clearTimeout(g),m&&t?t():o()},type:"button"}),b==C.question&&r.confirm&&e.createElement(e.Fragment,null,e.createElement(p,{label:s,theme:"#00416A",onClick:c,type:"button"}),e.createElement(p,{label:a,onClick:o,type:"button"}))))))}!function(e){e.error="error",e.question="question",e.success="success",e.warning="warning"}(C||(C={}));const z=["modalType"];function $(l){const{modalType:i}=l,r=a(l,z);return e.createElement(N,t({type:i},r))}const L=["cancel"];function A(l){const{cancel:i}=l,r=a(l,L);return e.createElement(N,t({type:C.question,close:i},r))}function T(r){const{checkColor:t,disabled:a,label:o,options:n,value:c,valueChanged:s}=r,p=i(null);function d(e){c!==e&&s(e)}return u(p),l(()=>{n.forEach(e=>{e.checked&&d(e.value)})},[]),e.createElement("div",{ref:p},o&&e.createElement("div",{className:"uil-radio-title"},o),e.createElement("div",{className:"uil-radio-wrapper"},n.map((l,i)=>e.createElement("div",{key:x(i),className:"uil-radio-option"},e.createElement("label",{className:"uil-radio uil-check"},e.createElement("input",{name:l.label,type:"radio",value:l.value,checked:c===l.value||""===c&&l.checked,onChange:()=>d(l.value),disabled:a||l.disabled}),e.createElement("div",{className:"uil-checkmark uil-radio-check",style:{backgroundColor:t}})),e.createElement("span",{className:"uil-font-base"},l.label)))))}export{p as CustomButton,m as CustomCheckbox,w as CustomInput,T as CustomRadio,$ as NotifyModal,E as PasswordInput,k as PasswordRuleTypes,A as QuestionModal,h as SVG,f as useClickOutsideRef,c as useGetColor};
1
+ import e,{useEffect as l,useRef as i,useState as r}from"react";function t(){return t=Object.assign?Object.assign.bind():function(e){for(var l=1;l<arguments.length;l++){var i=arguments[l];for(var r in i)({}).hasOwnProperty.call(i,r)&&(e[r]=i[r])}return e},t.apply(null,arguments)}function a(e,l){if(null==e)return{};var i={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(l.includes(r))continue;i[r]=e[r]}return i}var o=":root{--uil-black:#000;--uil-black-alt:#222;--uil-white:#fff;--uil-grey:#f3f3f3;--uil-grey-alt:#cfcfcf;--uil-grey-dark:#878787;--uil-outline-focus:#1e90ff;--uil-outline-disabled:#8b0000;--uil-success:#006a4e;--uil-error:#800020;--uil-question:#00416a;--uil-warning:gold;--uil-xxxs:.125rem;--uil-xxs:.25rem;--uil-xs:.5rem;--uil-s:.75rem;--uil-m:1rem;--uil-l:1.25rem;--uil-xl:1.5rem;--uil-xxl:1.75rem;--uil-xxxl:2rem;--uil-font-base:var(--uil-l);--uil-font-small:var(--uil-m)}.uil-button{background-color:var(--uil-white);border:1px solid var(--uil-black);border-radius:2px;box-shadow:0 0 3px 0 var(--uil-black-alt);color:var(--uil-black);cursor:pointer;letter-spacing:1px;padding:.375rem var(--uil-xxs)}@media (min-width:760px){.uil-button{padding:var(--uil-xs) var(--uil-s)}}.uil-button.uil-disabled{background-color:var(--uil-grey-dark);border:transparent;color:var(--uil-grey)}.uil-button.uil-small{font-size:var(--uil-font-small);line-height:var(--uil-font-small);padding:var(--uil-xxs) var(--uil-xs)}.uil-check-wrapper{align-items:center;display:flex;font-size:var(--uil-font-base);gap:var(--uil-s);line-height:var(--uil-font-base)}.uil-check-wrapper .uil-checkbox{border-radius:2px}.uil-check-wrapper .uil-check-label{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.uil-svg-wrapper{display:flex;height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content}.uil-svg-wrapper .uil-svg{height:var(--uil-xxxl);width:var(--uil-xxxl)}.uil-input-wrapper{display:block;position:relative}.uil-input-wrapper .uil-label{background:linear-gradient(0deg,var(--uil-white) 9px,transparent 0);color:var(--uil-black);cursor:text;font-weight:700;left:var(--uil-xxs);opacity:.6;padding:0 var(--uil-xxxs);position:absolute;top:25%;transition:top .25s ease-in-out}.uil-input-wrapper .uil-input{background-color:var(--uil-white);border:1px solid var(--uil-black);border-radius:0;box-sizing:border-box;color:var(--uil-black);padding:var(--uil-xs);width:100%}.uil-input-wrapper .uil-input::-moz-placeholder{color:transparent;height:0;width:0}.uil-input-wrapper .uil-input::placeholder{color:transparent;height:0;width:0}.uil-input-wrapper .uil-input:focus{outline:1px solid var(--uil-outline-focus)}.uil-input-wrapper .uil-input:disabled{background-color:var(--uil-grey);border:2px solid var(--uil-outline-disabled);color:var(--uil-grey-dark);cursor:not-allowed}.uil-input-wrapper .uil-input:disabled~.uil-label{background:transparent;color:var(--uil-grey-dark);cursor:not-allowed}.uil-input-wrapper .uil-input:disabled~.uil-icon{fill:var(--uil-grey-dark);cursor:not-allowed}.uil-input-wrapper .uil-input:disabled:not(:-moz-placeholder-shown)~.uil-label{background:linear-gradient(0deg,var(--uil-grey) 8px,transparent 0)}.uil-input-wrapper .uil-input:disabled:not(:placeholder-shown)~.uil-label{background:linear-gradient(0deg,var(--uil-grey) 8px,transparent 0)}.uil-input-wrapper .uil-icon{fill:var(--uil-black);align-items:center;display:flex;justify-content:center;opacity:.5;position:absolute;right:var(--uil-xs);top:50%;transform:translateY(-50%)}.uil-input-wrapper .uil-input:not(:-moz-placeholder-shown)~.uil-label{opacity:1;top:-30%}.uil-input-wrapper .uil-input:focus~.uil-label,.uil-input-wrapper .uil-input:not(:placeholder-shown)~.uil-label{opacity:1;top:-30%}.uil-input-wrapper .uil-input:not(:-moz-placeholder-shown)~.uil-icon{opacity:1}.uil-input-wrapper .uil-input:focus~.uil-icon,.uil-input-wrapper .uil-input:not(:placeholder-shown)~.uil-icon{opacity:1}.uil-tooltip-wrapper{position:relative}.uil-tooltip-wrapper .uil-tooltip-icon{fill:var(--uil-black-alt);cursor:pointer;margin-bottom:var(--uil-xxs)}.uil-tooltip-wrapper .uil-tooltip-icon:has(~.uil-input-wrapper>.uil-input:not(:-moz-placeholder-shown),~.uil-input-wrapper:focus-within){opacity:0;-moz-transition:opacity .3s,visibility .3s;transition:opacity .3s,visibility .3s;visibility:hidden}.uil-tooltip-wrapper .uil-tooltip-icon:has(~.uil-input-wrapper>.uil-input:not(:placeholder-shown),~.uil-input-wrapper:focus-within){opacity:0;transition:opacity .3s,visibility .3s;visibility:hidden}.uil-tooltip-wrapper .uil-tooltip{background-color:rgba(34,34,34,.9);border-radius:3px;box-sizing:border-box;color:var(--uil-white);font-size:var(--uil-font-small);left:0;line-height:var(--uil-font-small);padding:var(--uil-s);position:absolute;top:0;width:100%;z-index:1}.uil-tooltip-wrapper .uil-tooltip .uil-tooltip-button{background-color:transparent;border:none;border-bottom:1px solid var(--uil-white);color:var(--uil-white);cursor:pointer;display:block;margin-bottom:var(--uil-m);margin-left:auto;padding:0}.uil-password-rules{display:flex;flex-direction:column;gap:var(--uil-xs);margin-left:var(--uil-xs);margin-top:var(--uil-m)}.uil-password-rules .uil-password-rule{align-items:center;display:flex;font-size:var(--uil-font-small);gap:var(--uil-xxs);line-height:var(--uil-font-small)}.uil-modal-wrapper{background-color:rgba(0,0,0,.5);height:100%;left:0;position:fixed;top:0;width:100%;z-index:99}.uil-modal-wrapper .uil-modal{border-radius:5px;box-shadow:0 0 6px 0 var(--uil-black);left:50%;position:absolute;top:30%;transform:translateX(-50%);width:95%;z-index:999}@media (min-width:1025px){.uil-modal-wrapper .uil-modal{width:75%}}@media (min-width:1250px){.uil-modal-wrapper .uil-modal{width:55%}}@media (min-width:1920px){.uil-modal-wrapper .uil-modal{width:35%}}.uil-modal-wrapper .uil-modal .uil-progress-wrapper{background-color:var(--uil-grey-alt)}.uil-modal-wrapper .uil-modal .uil-progress-wrapper .uil-progress-bar{animation-duration:2s;animation-iteration-count:1;animation-name:uil-progress;border:2px solid var(--uil-grey-dark)}@keyframes uil-progress{0%{width:100%}to{width:0}}.uil-modal-wrapper .uil-modal .uil-header{background-color:var(--uil-question);border-top-left-radius:3px;border-top-right-radius:3px;color:var(--uil-white);display:flex;font-size:var(--uil-xl);font-weight:700;justify-content:space-between;line-height:var(--uil-xl);margin:0;padding:var(--uil-s)}@media (min-width:1025px){.uil-modal-wrapper .uil-modal .uil-header{font-size:var(--uil-xxxl);line-height:var(--uil-xxxl);padding:var(--uil-m)}}.uil-modal-wrapper .uil-modal .uil-header.uil-success{background-color:var(--uil-success)}.uil-modal-wrapper .uil-modal .uil-header.uil-error{background-color:var(--uil-error)}.uil-modal-wrapper .uil-modal .uil-header.uil-warning{background-color:var(--uil-warning);color:var(--uil-black)}.uil-modal-wrapper .uil-modal .uil-content{background-color:var(--uil-white);border-bottom-left-radius:3px;border-bottom-right-radius:3px;display:flex;flex-direction:column;gap:var(--uil-m);padding:var(--uil-m)}@media (min-width:1025px){.uil-modal-wrapper .uil-modal .uil-content{gap:var(--uil-xxxl);padding:var(--uil-l)}}.uil-modal-wrapper .uil-modal .uil-content .uil-modal-text{color:var(--uil-black);font-size:var(--uil-font-base);line-height:var(--uil-font-base);margin:0}.uil-modal-wrapper .uil-modal .uil-content .uil-button-wrapper{display:flex;justify-content:space-between}.uil-modal-wrapper .uil-modal .uil-content .uil-button-wrapper.uil-single{justify-content:end}.uil-radio-title{display:block;font-size:var(--uil-xl);line-height:var(--uil-xl);margin-bottom:var(--uil-m)}.uil-radio-wrapper{display:flex;flex-direction:column;gap:var(--uil-m)}.uil-radio-wrapper .uil-radio-option{align-items:center;display:flex;gap:.25rem}.uil-radio-wrapper .uil-radio-option .uil-radio,.uil-radio-wrapper .uil-radio-option .uil-radio .uil-radio-check{border-radius:50%}.uil-fit{height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content}.uil-font-base{font-size:var(--uil-font-base);line-height:var(--uil-font-base)}.uil-check{border:2px solid var(--uil-black-alt);box-sizing:border-box;cursor:pointer;display:block;font-size:var(--uil-font-small);line-height:var(--uil-font-small);min-height:var(--uil-l);min-width:var(--uil-l);position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.uil-check:has(input:disabled){background-color:var(--uil-grey);border-color:var(--uil-grey-dark)}.uil-check input{cursor:pointer;height:0;opacity:0;position:absolute;width:0}.uil-check input:checked~.uil-checkmark{transform:scale(1)}.uil-check input:disabled~.uil-checkmark{background-color:var(--uil-grey-dark)}.uil-check .uil-checkmark{background-color:var(--uil-black-alt);height:var(--uil-xs);left:25%;position:absolute;top:25%;transform:scale(0);transition:.1s ease;width:var(--uil-xs)}";const n=[];function u(e){l(()=>{const l=e.current?e.current.ownerDocument:document;if(void 0!==l&&!n.includes(l)){const e=l.createElement("style");e.innerHTML=o,n.push(l),l.head.appendChild(e)}},[])}function c(l){const{color:r,height:t,src:a,width:o}=l;if(!a.includes(".svg"))throw new Error("Provided src is not an svg image");const n={fill:r,height:t,width:o},c=i(null);return u(c),e.createElement("div",{ref:c,className:"uil-svg-wrapper"},e.createElement("svg",{"aria-hidden":!0,className:"uil-svg",style:n},e.createElement("use",{href:a})))}const s=["iconColor","iconSrc","inputColor","label","toggle","valueChanged"];function p(l){const{iconColor:r,iconSrc:o,inputColor:n,label:p,toggle:d,valueChanged:m}=l,h=a(l,s),b=i(null);return u(b),e.createElement("label",{className:"uil-input-wrapper",htmlFor:h.id,ref:b},e.createElement("input",t({className:"uil-input uil-font-base",onChange:e=>{m(e.target.value)},placeholder:p,style:{color:n}},h)),o&&e.createElement("div",{className:"uil-icon",onClick:d},e.createElement(c,{src:o,width:24,height:24,color:r})),e.createElement("span",{className:"uil-label uil-font-base",style:{color:n}},p))}function d(e){const r=i(null);return l(()=>{if(r.current)return document.addEventListener("click",l),document.addEventListener("touchend",l),()=>{document.removeEventListener("click",l),document.removeEventListener("touchend",l)};function l(l){r.current&&!r.current.contains(l.target)&&e()}},[e]),r}const m=["tooltipClose","tooltipIcon","tooltipText"];function h(l){const{tooltipClose:i,tooltipIcon:o,tooltipText:n}=l,u=a(l,m),[s,h]=r(!1),b=d(g);function g(){h(!1)}return e.createElement(e.Fragment,null,o?e.createElement("div",{className:"uil-tooltip-wrapper",ref:b},s&&e.createElement("div",{className:"uil-tooltip"},i&&e.createElement("button",{className:"uil-tooltip-button uil-fit",onClick:g},i),e.createElement("span",null,n)),e.createElement("div",{className:"uil-tooltip-icon uil-fit",onClick:()=>{h(!s)}},e.createElement(c,{src:o,height:16,width:16})),e.createElement(p,t({},u))):e.createElement(p,t({},u)))}function b(e){return`${e}-${String(Date.now().toString(32)+Math.random().toString(16)).replace(/\./g,"")}`}const g=["capsLockWarning","rules","ruleChecked","ruleUnchecked","setFailedRules"];function f(i){const{capsLockWarning:o,rules:n,ruleChecked:u,ruleUnchecked:s,setFailedRules:p}=i,d=a(i,g),[m,f]=r(!1);function v(e){let l;if(e.type){if(!e.count)throw new Error("count must not be empty if a type is provided");switch(e.type){case"minLength":l=`[a-zA-Z0-9ßÄäÖöÜü._!"\`'#%&§,:;<>=@{}~\\$\\(\\)\\*\\+\\/\\\\\\?\\[\\]\\^\\|\\-]{${e.count},}`;break;case"maxLength":l=`^[a-zA-Z0-9ßÄäÖöÜü._!"\`'#%&,:;<>=@{}~\\$\\(\\)\\*\\+\\/\\\\\\?\\[\\]\\^\\|\\-]{0,${e.count}}$`;break;case"letters":l=`[a-zA-ZßÄäÖöÜü]{${e.count},}`;break;case"numbers":l=`[0-9]{${e.count},}`;break;case"special":l=`[._!"\`'#%&§,:;<>=@{}~\\$\\(\\)\\*\\+\\/\\\\\\?\\[\\]\\^\\|\\-]{${e.count},}`;break;case"upper":l=`[A-ZÄÖÜ]{${e.count},}`;break;default:throw new Error("unrecognized rule type provided")}}else{if(!e.pattern)throw new Error("pattern must not be an empty string");l=e.pattern}return new RegExp(l).test(i.value)}return l(()=>{!function(){const e=[];n.forEach(l=>{v(l)||e.push(l)}),null==p||p(e)}()},[i.value]),l(()=>{if(o)return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)};function e(e){f(e.getModifierState("CapsLock"))}},[]),e.createElement("div",null,e.createElement(h,t({},d)),e.createElement("div",{className:"uil-password-rules"},m&&e.createElement("div",{className:"uil-password-rule"},o),n.map((l,i)=>e.createElement("div",{key:b(i),className:"uil-password-rule"},e.createElement(c,{src:v(l)?u:s,height:12,width:12}),e.createElement("span",null,l.label)))))}function v(e){if(7!==e.length)throw new Error("provided hex color must be 7 characters (including #) long");e=e.substring(1,7);const l=[parseInt(e.substring(0,2),16)/255,parseInt(e.substring(2,4),16)/255,parseInt(e.substring(4,6),16)/255].map(e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return.2126*l[0]+.7152*l[1]+.0722*l[2]>.179?"#000000":"#ffffff"}const w=["disabled","label","small","theme"];function k(l){const{disabled:r=!1,label:o,small:n=!1,theme:c}=l,s=a(l,w),p=i(null);return u(p),e.createElement("button",t({className:function(){const e="uil-button uil-fit";return r?n?`${e} uil-disabled uil-small`:`${e} uil-font-base uil-disabled`:n?`${e} uil-small`:`${e} uil-font-base`}(),style:function(){if(!r&&c){if(c.includes("#"))return{color:v(c),backgroundColor:c,border:"transparent"};switch(c){case"success":return{color:v("#006A4E"),backgroundColor:"#006A4E",border:"transparent"};case"warning":return{color:"#000000",backgroundColor:"#FFD700",border:"transparent"};case"error":return{color:v("#800020"),backgroundColor:"#800020",border:"transparent"};default:throw new Error("invalid theme provided")}}}(),disabled:r,ref:p},s),o)}function x(r){const{callback:t,cancelLabel:a="",close:o,closeLabel:n,confirm:c,confirmLabel:s="",message:p,timeout:d,title:m,type:h}=r;let g;const f=i(null);return u(f),l(()=>{if(d)return g=setTimeout(()=>t?t():o(),d),()=>{clearTimeout(g)}},[]),e.createElement("div",{className:"uil-modal-wrapper",ref:f},e.createElement("div",{className:"uil-modal"},e.createElement("div",{className:function(){const e="uil-header";switch(h){case"error":return`${e} uil-error`;case"success":return`${e} uil-success`;case"warning":return`${e} uil-warning`;default:return e}}()},m),d&&e.createElement("div",{className:"uil-progress-wrapper"},e.createElement("div",{className:"uil-progress-bar",style:{animationDuration:d/1e3+.5+"s"}})),e.createElement("div",{className:"uil-content"},e.createElement("div",null,Array.isArray(p)?p.map((l,i)=>e.createElement("p",{key:b(i),className:"uil-modal-text"},l)):e.createElement("p",{className:"uil-modal-text"},p)),e.createElement("div",{className:"uil-button-wrapper "+("question"!==h?"uil-single":"")},"question"!==h&&e.createElement(k,{label:null!=n?n:"",onClick:function(){return clearTimeout(g),d&&t?t():o()},type:"button"}),"question"==h&&r.confirm&&e.createElement(e.Fragment,null,e.createElement(k,{label:s,theme:"#00416A",onClick:c,type:"button"}),e.createElement(k,{label:a,onClick:o,type:"button"}))))))}const y=["modalType"];function E(l){const{modalType:i}=l,r=a(l,y);return e.createElement(x,t({type:i},r))}const C=["cancel"];function N(l){const{cancel:i}=l,r=a(l,C);return e.createElement(x,t({type:"question",close:i},r))}function z(r){const{checkColor:t,disabled:a,label:o,options:n,value:c,valueChanged:s}=r,p=b("radio"),d=i(null);function m(e){c===e.value||e.disabled||a||s(e.value)}return u(d),l(()=>{n.forEach(e=>{e.checked&&m(e)})},[]),e.createElement("div",{ref:d},o&&e.createElement("div",{className:"uil-radio-title"},o),e.createElement("div",{className:"uil-radio-wrapper"},n.map((l,i)=>e.createElement("div",{key:b(i),className:"uil-radio-option"},e.createElement("div",{className:"uil-radio uil-check",onClick:()=>{m(l)}},e.createElement("input",{id:`${i}-${p}`,name:l.label,type:"radio",value:l.value,checked:c===l.value||""===c&&l.checked,onChange:()=>{m(l)},disabled:a||l.disabled}),e.createElement("div",{className:"uil-checkmark uil-radio-check",style:{backgroundColor:t}})),e.createElement("label",{htmlFor:`${i}-${p}`,className:"uil-font-base"},l.label)))))}const $=["checkColor","checked","children","toggleCheck","label"];function L(l){const{checkColor:r,checked:o,children:n,toggleCheck:c,label:s}=l,p=a(l,$),d=b("check"),m=i(null);return u(m),e.createElement("div",{className:"uil-check-wrapper",ref:m},e.createElement("div",{className:"uil-checkbox uil-check",onClick:()=>{c(!o)}},e.createElement("input",t({type:"checkbox",checked:o,onChange:()=>{c(!o)}},p,{id:d})),e.createElement("div",{className:"uil-checkmark",style:{backgroundColor:r}})),e.createElement("label",{htmlFor:d,className:"uil-check-label"},n||s))}export{k as CustomButton,L as CustomCheckbox,h as CustomInput,z as CustomRadio,E as NotifyModal,f as PasswordInput,N as QuestionModal,c as SVG,d as useClickOutsideRef,v as useGetColor};
2
2
  //# sourceMappingURL=bundle.js.map
package/dist/bundle.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"bundle.js","sources":["../src/utils/useInjectStyles.ts","../src/hooks/getColor.ts","../src/components/button/customButton.tsx","../src/components/checkbox/customCheckbox.tsx","../src/components/images/svgIcon.tsx","../src/components/input/baseInput.tsx","../src/hooks/clickOutside.ts","../src/components/input/customInput.tsx","../src/enums/passwordRuleTypes.ts","../src/utils/generateKey.ts","../src/components/input/passwordInput.tsx","../src/enums/modalType.ts","../src/components/modal/baseModal.tsx","../src/components/modal/notifyModal.tsx","../src/components/modal/questionModal.tsx","../src/components/radio/customRadio.tsx"],"sourcesContent":["import {RefObject, useEffect} from \"react\";\nimport styles from \"./styles.scss\";\n\nconst injectedStyles: Document[] = [];\n\nexport default function useInjectStyleSheet(nodeRef: RefObject<HTMLElement>): void {\n useEffect(() => {\n const parentDocument = nodeRef.current ? nodeRef.current.ownerDocument : document;\n\n if (typeof parentDocument !== \"undefined\" && !injectedStyles.includes(parentDocument)) {\n const styleElement = parentDocument.createElement(\"style\");\n\n styleElement.innerHTML = styles;\n injectedStyles.push(parentDocument);\n\n parentDocument.head.appendChild(styleElement);\n }\n }, []);\n}","export function useGetColor(backgroundColor: string) {\n if (backgroundColor.length !== 7) throw new Error('provided hex color must be 7 characters (including #) long');\n\n backgroundColor = backgroundColor.substring(1, 7);\n const uiColors = [\n parseInt(backgroundColor.substring(0, 2), 16) / 255,\n parseInt(backgroundColor.substring(2, 4), 16) / 255,\n parseInt(backgroundColor.substring(4, 6), 16) / 255\n ];\n const c = uiColors.map(col => {\n return col <= 0.03928? (col / 12.92) : Math.pow((col + 0.055) / 1.055, 2.4);\n });\n const contrast = (0.2126 * c[0]) + (0.7152 * c[1]) + (0.0722 * c[2]);\n\n return contrast > 0.179 ? '#000000' : '#ffffff';\n}","import React, {ComponentPropsWithoutRef, CSSProperties, useRef} from 'react';\nimport useInjectStyleSheet from \"utils/useInjectStyles\";\nimport {useGetColor} from 'hooks/getColor';\n\ntype HEXColor = `#${string}`\n\ninterface ICustomButton extends ComponentPropsWithoutRef<'button'> {\n label : string;\n disabled?: boolean;\n small? : boolean;\n theme? : HEXColor | 'success' | 'warning' | 'error';\n}\n\nexport function CustomButton(props: ICustomButton) {\n const {\n disabled = false,\n label,\n small = false,\n theme,\n ...buttonProps\n } = props;\n\n const nodeRef = useRef<HTMLButtonElement>(null);\n useInjectStyleSheet(nodeRef);\n\n function getStyle(): CSSProperties | undefined {\n if (disabled || !theme) return undefined;\n\n if (theme.includes('#')) {\n return {\n color: useGetColor(theme),\n backgroundColor: theme,\n border: 'transparent'\n };\n }\n\n switch (theme) {\n case 'success':\n return {\n color: useGetColor('#006A4E'),\n backgroundColor: '#006A4E',\n border: 'transparent'\n };\n case 'warning':\n return {\n color: '#000000',\n backgroundColor: '#FFD700',\n border: 'transparent'\n };\n case 'error':\n return {\n color: useGetColor('#800020'),\n backgroundColor: '#800020',\n border: 'transparent'\n };\n default:\n throw new Error('invalid theme provided')\n }\n }\n\n function getClassName(): string {\n const base = 'uil-button uil-fit'\n\n if (disabled && !small) {\n return `${base} uil-font-base uil-disabled`;\n }\n\n if (disabled && small) {\n return `${base} uil-disabled uil-small`;\n }\n\n if (small) {\n return `${base} uil-small`;\n }\n\n return `${base} uil-font-base`;\n }\n\n return (\n <button className={getClassName()} style={getStyle()} disabled={disabled} {...buttonProps} ref={nodeRef}>\n {label}\n </button>\n );\n}","import React, {ComponentPropsWithoutRef, ReactNode, useRef} from 'react';\nimport useInjectStyleSheet from \"utils/useInjectStyles\";\n\ninterface ICustomCheckbox extends ComponentPropsWithoutRef<'input'> {\n checked : boolean;\n label? : string;\n toggleCheck : (value: boolean) => void;\n checkColor? : string;\n children? : ReactNode;\n}\n\nexport function CustomCheckbox(props: ICustomCheckbox) {\n const {\n checkColor,\n checked,\n toggleCheck,\n label,\n children,\n ...checkProps\n } = props;\n\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n return (\n <div className={'uil-check-wrapper'} ref={nodeRef}>\n <label className={'uil-checkbox uil-check'}>\n <input type={'checkbox'} checked={checked} onChange={() => {toggleCheck(!checked)}} {...checkProps}/>\n <div className={'uil-checkmark'} style={{backgroundColor: checkColor}}/>\n </label>\n\n {children ? children : <span onClick={() => toggleCheck(!checked)} style={{cursor: 'pointer', userSelect: 'none'}}>{label}</span>}\n </div>\n );\n}","import React, {ComponentPropsWithoutRef, CSSProperties, useRef} from 'react';\nimport useInjectStyleSheet from \"utils/useInjectStyles\";\n\ninterface ISvgIcon extends ComponentPropsWithoutRef<'svg'>{\n src : string;\n color? : string | undefined;\n height?: number;\n width? : number;\n}\n\nexport function SVG(props: ISvgIcon) {\n const {\n src,\n color,\n height,\n width\n } = props;\n\n if (!src.includes('.svg')) {\n throw new Error('Provided src is not an svg image');\n }\n\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n const style: CSSProperties = {\n fill: color,\n height: `${height}px`,\n width: `${width}px`\n }\n\n return (\n <div ref={nodeRef} className={'uil-svg-wrapper'}>\n <svg aria-hidden={true} className={'uil-svg'} style={style}>\n <use href={src}/>\n </svg>\n </div>\n );\n}","import React, {ComponentPropsWithoutRef, useRef} from 'react';\nimport {SVG} from 'components/images/svgIcon';\nimport useInjectStyleSheet from \"../../utils/useInjectStyles\";\n\nexport interface IBaseInput extends ComponentPropsWithoutRef<'input'> {\n label : string;\n value : string;\n valueChanged: (value: string) => void;\n iconColor? : string;\n iconSrc? : string;\n inputColor? : string;\n toggle? : () => void;\n}\n\nexport function BaseInput(props: IBaseInput) {\n const {\n iconColor,\n iconSrc,\n inputColor,\n label,\n toggle,\n valueChanged,\n ...inputProps\n } = props;\n\n const nodeRef = useRef<HTMLLabelElement>(null);\n useInjectStyleSheet(nodeRef);\n\n return (\n <label className={'uil-input-wrapper'} htmlFor={inputProps.id} ref={nodeRef}>\n <input\n className={'uil-input uil-font-base'}\n onChange={(e) => valueChanged(e.target.value)}\n placeholder={label}\n style={{color: inputColor}}\n {...inputProps}\n />\n\n {iconSrc &&\n <div className={'uil-icon'} onClick={toggle}>\n <SVG src={iconSrc} width={24} height={24} color={iconColor}/>\n </div>\n }\n\n <span className={'uil-label uil-font-base'} style={{color: inputColor}}>{label}</span>\n </label>\n );\n}","import {useEffect, useRef} from 'react';\n\nexport function useClickOutsideRef<T extends HTMLElement>(callback: () => void) {\n const ref = useRef<T>(null);\n\n useEffect(() => {\n if (!ref.current) return;\n\n function handleClickOutside (event: MouseEvent | TouchEvent) {\n if (ref.current && !ref.current.contains(event.target as Node)) {\n callback();\n }\n }\n\n document.addEventListener('click', handleClickOutside);\n document.addEventListener('touchend', handleClickOutside);\n\n return () => {\n document.removeEventListener('click', handleClickOutside);\n document.removeEventListener('touchend', handleClickOutside);\n };\n }, [callback]);\n\n return ref;\n}","import React, {useState} from 'react';\nimport {BaseInput, IBaseInput} from './baseInput';\nimport {SVG} from 'components/images/svgIcon';\nimport {useClickOutsideRef} from 'hooks/clickOutside';\n\nexport interface ICustomInput extends IBaseInput {\n tooltipClose?: string;\n tooltipIcon? : string;\n tooltipText? : string;\n}\n\nexport function CustomInput(props: ICustomInput) {\n const {\n tooltipClose,\n tooltipIcon,\n tooltipText,\n ...inputProps\n } = props;\n\n const [tooltipVisible, setTooltipVisible] = useState(false);\n const ref = useClickOutsideRef<HTMLDivElement>(closeTooltip);\n\n function closeTooltip() {\n setTooltipVisible(false);\n }\n\n return (\n <>\n {tooltipIcon ?\n <div className={'uil-tooltip-wrapper'} ref={ref}>\n {tooltipVisible &&\n <div className={'uil-tooltip'}>\n {tooltipClose &&\n <button className={'uil-tooltip-button uil-fit'} onClick={closeTooltip}>\n {tooltipClose}\n </button>\n }\n\n <span>{tooltipText}</span>\n </div>\n }\n\n <div className={'uil-tooltip-icon uil-fit'} onClick={() => setTooltipVisible(!tooltipVisible)}>\n <SVG src={tooltipIcon} height={16} width={16}/>\n </div>\n\n <BaseInput {...inputProps}/>\n </div> :\n\n <BaseInput {...inputProps}/>\n }\n </>\n );\n}","export enum PasswordRuleTypes {\n minLength = 1,\n maxLength,\n letters,\n numbers,\n special,\n upper\n}","export default function generateKey(prefix: string | number) {\n return `${prefix}-${new Date().getTime()}`;\n}","import React, {useEffect, useState} from 'react';\nimport {CustomInput, ICustomInput} from './customInput';\nimport {SVG} from 'components/images/svgIcon';\nimport {PasswordRuleTypes} from 'enums/passwordRuleTypes';\nimport generateKey from 'utils/generateKey';\n\ninterface IPasswordInput extends ICustomInput {\n ruleChecked : string;\n rules : PasswordRule[];\n ruleUnchecked : string;\n capsLockWarning?: string;\n setFailedRules? : (value: PasswordRule[]) => void;\n}\n\nexport interface PasswordRule {\n label : string;\n count? : number;\n type? : PasswordRuleTypes;\n pattern?: string;\n}\n\nexport function PasswordInput(props: IPasswordInput) {\n const {\n capsLockWarning,\n rules,\n ruleChecked,\n ruleUnchecked,\n setFailedRules,\n ...inputProps\n } = props;\n\n const [capsLock, setCapsLock] = useState(false);\n\n useEffect(() => {\n validateInput();\n }, [props.value]);\n\n useEffect(() => {\n if (!capsLockWarning) return;\n\n function setCapsLockState(event: globalThis.KeyboardEvent) {\n setCapsLock(event.getModifierState?.('CapsLock'));\n }\n\n document.addEventListener('keydown', setCapsLockState);\n\n return () => document.removeEventListener('keydown', setCapsLockState);\n }, []);\n\n function validateInput() {\n const failedRules: PasswordRule[] = [];\n\n rules.forEach(rule => {\n if (!checkRule(rule)) {\n failedRules.push(rule);\n }\n });\n\n setFailedRules?.(failedRules);\n }\n\n function checkRule(rule: PasswordRule): boolean {\n let pattern: string;\n\n if (rule.type) {\n if (!rule.count) throw new Error('count must not be empty if a type is provided');\n\n switch (rule.type) {\n case PasswordRuleTypes.minLength:\n pattern = `[a-zA-Z0-9ßÄäÖöÜü._!\"\\`'#%&§,:;<>=@{}~\\\\$\\\\(\\\\)\\\\*\\\\+\\\\/\\\\\\\\\\\\?\\\\[\\\\]\\\\^\\\\|\\\\-]{${rule.count},}`;\n break;\n case PasswordRuleTypes.maxLength:\n pattern = `^[a-zA-Z0-9ßÄäÖöÜü._!\"\\`'#%&,:;<>=@{}~\\\\$\\\\(\\\\)\\\\*\\\\+\\\\/\\\\\\\\\\\\?\\\\[\\\\]\\\\^\\\\|\\\\-]{0,${rule.count}}$`;\n break;\n case PasswordRuleTypes.letters:\n pattern = `[a-zA-ZßÄäÖöÜü]{${rule.count},}`;\n break;\n case PasswordRuleTypes.numbers:\n pattern = `[0-9]{${rule.count},}`;\n break;\n case PasswordRuleTypes.special:\n pattern = `[._!\"\\`'#%&§,:;<>=@{}~\\\\$\\\\(\\\\)\\\\*\\\\+\\\\/\\\\\\\\\\\\?\\\\[\\\\]\\\\^\\\\|\\\\-]{${rule.count},}`;\n break;\n case PasswordRuleTypes.upper:\n pattern = `[A-ZÄÖÜ]{${rule.count},}`;\n break;\n default:\n throw new Error('unrecognized rule type provided');\n }\n } else {\n pattern = rule.pattern ? rule.pattern : '';\n }\n\n if (pattern === '') throw new Error('pattern must not be an empty string');\n\n const reg = new RegExp(pattern);\n return reg.test(props.value);\n }\n\n return (\n <div>\n <CustomInput {...inputProps}/>\n\n <div className={'uil-password-rules'}>\n {capsLock &&\n <div className={'uil-password-rule'}>{capsLockWarning}</div>\n }\n\n {rules.map((rule, idx) =>\n <div key={generateKey(idx)} className={'uil-password-rule'}>\n <SVG src={checkRule(rule) ? ruleChecked : ruleUnchecked} height={12} width={12}/>\n\n <span>{rule.label}</span>\n </div>\n )}\n </div>\n </div>\n );\n}","export enum ModalType {\n error = 'error',\n question = 'question',\n success = 'success',\n warning = 'warning',\n}","import React, {useEffect, useRef} from 'react';\nimport {ModalType} from 'enums/modalType';\nimport {CustomButton} from 'components/button/customButton';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\nimport generateKey from 'utils/generateKey';\n\ninterface IBaseModal {\n close : () => void;\n message : string | string[];\n title : string;\n type : ModalType;\n callback? : (() => void) | undefined;\n cancelLabel? : string;\n closeLabel? : string;\n confirm? : () => void;\n confirmLabel?: string;\n timeout? : number;\n}\n\nexport function BaseModal(props: IBaseModal) {\n const {\n callback,\n cancelLabel = '',\n close,\n closeLabel,\n confirm,\n confirmLabel = '',\n message,\n timeout,\n title,\n type\n } = props;\n\n let timer: NodeJS.Timeout | undefined = undefined;\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n useEffect(() => {\n if (!timeout) return;\n\n timer = setTimeout(() => {\n return callback ? callback() : close();\n }, timeout);\n\n return () => clearTimeout(timer);\n },[]);\n\n function setHeaderClass() {\n const base = 'uil-header';\n\n switch (type) {\n case ModalType.error:\n return `${base} uil-error`;\n case ModalType.success:\n return `${base} uil-success`;\n case ModalType.warning:\n return `${base} uil-warning`;\n default:\n return base;\n }\n }\n\n //run callback if timeout and callback are set, otherwise close\n function handleClose() {\n clearTimeout(timer);\n timeout && callback ? callback() : close();\n }\n\n return (\n <div className={'uil-modal-wrapper'} ref={nodeRef}>\n <div className={'uil-modal'}>\n <div className={setHeaderClass()}>\n {title}\n </div>\n\n {timeout &&\n <div className={'uil-progress-wrapper'}>\n <div className={'uil-progress-bar'} style={{animationDuration: `${(timeout / 1000) + .5}s`}}/>\n </div>\n }\n\n <div className={'uil-content'}>\n <div>\n {Array.isArray(message) ?\n message.map((m, idx) => <p key={generateKey(idx)} className={'uil-modal-text'}>{m}</p>)\n : <p className={'uil-modal-text'}>{message}</p>\n }\n </div>\n\n <div className={`uil-button-wrapper ${type !== ModalType.question ? 'uil-single' : ''}`}>\n {type !== ModalType.question &&\n <CustomButton label={closeLabel?? ''} onClick={handleClose} type={'button'}/>\n }\n\n {type == ModalType.question && props.confirm &&\n <>\n <CustomButton label={confirmLabel} theme={'#00416A'} onClick={confirm} type={'button'}/>\n <CustomButton label={cancelLabel} onClick={close} type={'button'}/>\n </>\n }\n </div>\n </div>\n </div>\n </div>\n );\n}","import React from 'react';\nimport {BaseModal} from './baseModal';\nimport {ModalType} from 'enums/modalType';\n\nexport interface INotifyModal {\n close : () => void;\n closeLabel: string;\n modalType : 'success' | 'warning' | 'error';\n message : string | string[];\n title : string;\n callback? : (() => void) | undefined;\n timeout? : number;\n}\n\nexport function NotifyModal(props: INotifyModal) {\n const {\n modalType,\n ...modalProps\n } = props;\n\n return (\n <BaseModal type={modalType as ModalType} {...modalProps}/>\n );\n}","import React from 'react';\nimport {BaseModal} from './baseModal';\nimport {ModalType} from 'enums/modalType';\n\nexport interface IQuestionModal {\n cancel : () => void;\n cancelLabel : string;\n confirm : () => void;\n confirmLabel: string;\n message : string | string[];\n title : string;\n}\n\nexport function QuestionModal(props: IQuestionModal) {\n const {\n cancel,\n ...modalProps\n } = props;\n\n return (\n <BaseModal type={ModalType.question} close={cancel} {...modalProps}/>\n );\n}","import React, {useEffect, useRef} from 'react';\nimport generateKey from 'utils/generateKey';\nimport useInjectStyleSheet from \"utils/useInjectStyles\";\n\ninterface ICustomRadio {\n options : RadioOption[];\n value : string;\n valueChanged: (value: string) => void;\n checkColor? : string;\n disabled? : boolean;\n label? : string;\n}\n\nexport interface RadioOption {\n label : string;\n value : string;\n checked? : boolean;\n disabled?: boolean;\n}\n\nexport function CustomRadio(props: ICustomRadio) {\n const {\n checkColor,\n disabled,\n label,\n options,\n value,\n valueChanged,\n } = props;\n\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n useEffect(() => {\n // prevents multiple radio options being checked at the same time\n options.forEach(option => {\n if (option.checked) handleRadioChange(option.value);\n });\n },[]);\n\n function handleRadioChange(newValue: string) {\n if (value === newValue) return;\n\n valueChanged(newValue);\n }\n\n return (\n <div ref={nodeRef}>\n {label && <div className={'uil-radio-title'}>{label}</div>}\n\n <div className={'uil-radio-wrapper'}>\n {options.map((option, idx) =>\n <div key={generateKey(idx)} className={'uil-radio-option'}>\n <label className={'uil-radio uil-check'}>\n <input\n name={option.label}\n type={'radio'}\n value={option.value}\n checked={value === option.value || value === '' && option.checked}\n onChange={() => handleRadioChange(option.value)}\n disabled={disabled? disabled : option.disabled}\n />\n <div className={'uil-checkmark uil-radio-check'} style={{backgroundColor: checkColor}}/>\n </label>\n\n <span className={'uil-font-base'}>{option.label}</span>\n </div>\n )}\n </div>\n </div>\n );\n}"],"names":["injectedStyles","useInjectStyleSheet","nodeRef","useEffect","parentDocument","current","ownerDocument","document","includes","styleElement","createElement","innerHTML","styles","push","head","appendChild","useGetColor","backgroundColor","length","Error","substring","c","parseInt","map","col","Math","pow","_excluded","CustomButton","props","disabled","label","small","theme","buttonProps","_objectWithoutPropertiesLoose","useRef","React","_extends","className","base","getClassName","style","color","border","getStyle","ref","CustomCheckbox","checkColor","checked","toggleCheck","children","checkProps","type","onChange","onClick","cursor","userSelect","SVG","src","height","width","fill","href","BaseInput","iconColor","iconSrc","inputColor","toggle","valueChanged","inputProps","htmlFor","id","e","target","value","placeholder","useClickOutsideRef","callback","addEventListener","handleClickOutside","removeEventListener","event","contains","CustomInput","tooltipClose","tooltipIcon","tooltipText","tooltipVisible","setTooltipVisible","useState","closeTooltip","Fragment","PasswordRuleTypes","generateKey","prefix","Date","getTime","PasswordInput","capsLockWarning","rules","ruleChecked","ruleUnchecked","setFailedRules","capsLock","setCapsLock","checkRule","rule","pattern","count","minLength","maxLength","letters","numbers","special","upper","RegExp","test","failedRules","forEach","validateInput","setCapsLockState","getModifierState","idx","key","ModalType","BaseModal","cancelLabel","close","closeLabel","confirm","confirmLabel","message","timeout","title","timer","setTimeout","clearTimeout","error","success","warning","setHeaderClass","animationDuration","Array","isArray","m","question","NotifyModal","modalType","modalProps","QuestionModal","cancel","CustomRadio","options","handleRadioChange","newValue","option","name"],"mappings":"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"}
1
+ {"version":3,"file":"bundle.js","sources":["../src/utils/useInjectStyles.ts","../src/components/images/svgIcon.tsx","../src/components/input/baseInput.tsx","../src/hooks/clickOutside.ts","../src/components/input/customInput.tsx","../src/utils/generateKey.ts","../src/components/input/passwordInput.tsx","../src/hooks/getColor.ts","../src/components/button/customButton.tsx","../src/components/modal/baseModal.tsx","../src/components/modal/notifyModal.tsx","../src/components/modal/questionModal.tsx","../src/components/radio/customRadio.tsx","../src/components/checkbox/customCheckbox.tsx"],"sourcesContent":["import {RefObject, useEffect} from 'react';\nimport styles from './styles.scss';\n\nconst injectedStyles: Document[] = [];\n\nexport default function useInjectStyleSheet(nodeRef: RefObject<HTMLElement>): void {\n useEffect(() => {\n const parentDocument = nodeRef.current ? nodeRef.current.ownerDocument : document;\n\n if (typeof parentDocument !== \"undefined\" && !injectedStyles.includes(parentDocument)) {\n const styleElement = parentDocument.createElement(\"style\");\n\n styleElement.innerHTML = styles;\n injectedStyles.push(parentDocument);\n\n parentDocument.head.appendChild(styleElement);\n }\n }, []);\n}","import React, {ComponentPropsWithoutRef, CSSProperties, useRef} from 'react';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\n\ninterface ISvgIcon extends ComponentPropsWithoutRef<'svg'>{\n src : string;\n color? : string | undefined;\n height?: number;\n width? : number;\n}\n\nexport function SVG(props: ISvgIcon) {\n const {\n color,\n height,\n src,\n width\n } = props;\n\n if (!src.includes('.svg')) {\n throw new Error('Provided src is not an svg image');\n }\n\n const style: CSSProperties = {\n fill: color,\n height: height,\n width: width,\n }\n\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n return (\n <div ref={nodeRef} className={'uil-svg-wrapper'}>\n <svg aria-hidden={true} className={'uil-svg'} style={style}>\n <use href={src}/>\n </svg>\n </div>\n );\n}","import React, {ComponentPropsWithoutRef, useRef} from 'react';\nimport {SVG} from 'components/images/svgIcon';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\n\nexport interface IBaseInput extends ComponentPropsWithoutRef<'input'> {\n label : string;\n value : string;\n valueChanged: (value: string) => void;\n iconColor? : string;\n iconSrc? : string;\n inputColor? : string;\n toggle? : () => void;\n}\n\nexport function BaseInput(props: IBaseInput) {\n const {\n iconColor,\n iconSrc,\n inputColor,\n label,\n toggle,\n valueChanged,\n ...inputProps\n } = props;\n\n const nodeRef = useRef<HTMLLabelElement>(null);\n useInjectStyleSheet(nodeRef);\n\n return (\n <label className={'uil-input-wrapper'} htmlFor={inputProps.id} ref={nodeRef}>\n <input\n className={'uil-input uil-font-base'}\n onChange={(e) => {valueChanged(e.target.value)}}\n placeholder={label}\n style={{color: inputColor}}\n {...inputProps}\n />\n\n {iconSrc &&\n <div className={'uil-icon'} onClick={toggle}>\n <SVG src={iconSrc} width={24} height={24} color={iconColor}/>\n </div>\n }\n\n <span className={'uil-label uil-font-base'} style={{color: inputColor}}>{label}</span>\n </label>\n );\n}","import {useEffect, useRef} from 'react';\n\nexport function useClickOutsideRef<T extends HTMLElement>(callback: () => void) {\n const ref = useRef<T>(null);\n\n useEffect(() => {\n if (!ref.current) return;\n\n function handleClickOutside (event: MouseEvent | TouchEvent) {\n if (ref.current && !ref.current.contains(event.target as Node)) {\n callback();\n }\n }\n\n document.addEventListener('click', handleClickOutside);\n document.addEventListener('touchend', handleClickOutside);\n\n return () => {\n document.removeEventListener('click', handleClickOutside);\n document.removeEventListener('touchend', handleClickOutside);\n };\n }, [callback]);\n\n return ref;\n}","import React, {useState} from 'react';\nimport {BaseInput, IBaseInput} from './baseInput';\nimport {SVG} from 'components/images/svgIcon';\nimport {useClickOutsideRef} from 'hooks/clickOutside';\n\nexport interface ICustomInput extends IBaseInput {\n tooltipClose?: string;\n tooltipIcon? : string;\n tooltipText? : string;\n}\n\nexport function CustomInput(props: ICustomInput) {\n const {\n tooltipClose,\n tooltipIcon,\n tooltipText,\n ...inputProps\n } = props;\n\n const [tooltipVisible, setTooltipVisible] = useState(false);\n const ref = useClickOutsideRef<HTMLDivElement>(closeTooltip);\n\n function closeTooltip() {\n setTooltipVisible(false);\n }\n\n return (\n <>\n {tooltipIcon ?\n <div className={'uil-tooltip-wrapper'} ref={ref}>\n {tooltipVisible &&\n <div className={'uil-tooltip'}>\n {tooltipClose &&\n <button className={'uil-tooltip-button uil-fit'} onClick={closeTooltip}>\n {tooltipClose}\n </button>\n }\n\n <span>{tooltipText}</span>\n </div>\n }\n\n <div className={'uil-tooltip-icon uil-fit'} onClick={() => {setTooltipVisible(!tooltipVisible)}}>\n <SVG src={tooltipIcon} height={16} width={16}/>\n </div>\n\n <BaseInput {...inputProps}/>\n </div> :\n\n <BaseInput {...inputProps}/>\n }\n </>\n );\n}","export default function generateKey(prefix: string | number) {\n const id = String(Date.now().toString(32) + Math.random().toString(16)).replace(/\\./g, '');\n\n return `${prefix}-${id}`;\n}","import React, {useEffect, useState} from 'react';\nimport {CustomInput, ICustomInput} from './customInput';\nimport {SVG} from 'components/images/svgIcon';\nimport generateKey from 'utils/generateKey';\n\ninterface IPasswordInput extends ICustomInput {\n ruleChecked : string;\n rules : PasswordRule[];\n ruleUnchecked : string;\n capsLockWarning?: string;\n setFailedRules? : (value: PasswordRule[]) => void;\n}\n\nexport interface PasswordRule {\n label : string;\n count? : number;\n type? : 'minLength' | 'maxLength' | 'letters' | 'numbers' | 'special' | 'upper';\n pattern?: string;\n}\n\nexport function PasswordInput(props: IPasswordInput) {\n const {\n capsLockWarning,\n rules,\n ruleChecked,\n ruleUnchecked,\n setFailedRules,\n ...inputProps\n } = props;\n\n const [capsLock, setCapsLock] = useState(false);\n\n useEffect(() => {\n validateInput();\n }, [props.value]);\n\n useEffect(() => {\n if (!capsLockWarning) return;\n\n function setCapsLockState(event: globalThis.KeyboardEvent) {\n setCapsLock(event.getModifierState('CapsLock'));\n }\n\n document.addEventListener('keydown', setCapsLockState);\n\n return () => {document.removeEventListener('keydown', setCapsLockState)};\n }, []);\n\n function validateInput() {\n const failedRules: PasswordRule[] = [];\n\n rules.forEach(rule => {\n if (!checkRule(rule)) {\n failedRules.push(rule);\n }\n });\n\n setFailedRules?.(failedRules);\n }\n\n function checkRule(rule: PasswordRule): boolean {\n let pattern: string;\n\n if (rule.type) {\n if (!rule.count) throw new Error('count must not be empty if a type is provided');\n\n switch (rule.type) {\n case 'minLength':\n pattern = `[a-zA-Z0-9ßÄäÖöÜü._!\"\\`'#%&§,:;<>=@{}~\\\\$\\\\(\\\\)\\\\*\\\\+\\\\/\\\\\\\\\\\\?\\\\[\\\\]\\\\^\\\\|\\\\-]{${rule.count},}`;\n break;\n case 'maxLength':\n pattern = `^[a-zA-Z0-9ßÄäÖöÜü._!\"\\`'#%&,:;<>=@{}~\\\\$\\\\(\\\\)\\\\*\\\\+\\\\/\\\\\\\\\\\\?\\\\[\\\\]\\\\^\\\\|\\\\-]{0,${rule.count}}$`;\n break;\n case 'letters':\n pattern = `[a-zA-ZßÄäÖöÜü]{${rule.count},}`;\n break;\n case 'numbers':\n pattern = `[0-9]{${rule.count},}`;\n break;\n case 'special':\n pattern = `[._!\"\\`'#%&§,:;<>=@{}~\\\\$\\\\(\\\\)\\\\*\\\\+\\\\/\\\\\\\\\\\\?\\\\[\\\\]\\\\^\\\\|\\\\-]{${rule.count},}`;\n break;\n case 'upper':\n pattern = `[A-ZÄÖÜ]{${rule.count},}`;\n break;\n default:\n throw new Error('unrecognized rule type provided');\n }\n } else {\n if (!rule.pattern) {\n throw new Error('pattern must not be an empty string');\n }\n\n pattern = rule.pattern;\n }\n\n const reg = new RegExp(pattern);\n return reg.test(props.value);\n }\n\n return (\n <div>\n <CustomInput {...inputProps}/>\n\n <div className={'uil-password-rules'}>\n {capsLock && <div className={'uil-password-rule'}>{capsLockWarning}</div>}\n\n {rules.map((rule, idx) =>\n <div key={generateKey(idx)} className={'uil-password-rule'}>\n <SVG src={checkRule(rule) ? ruleChecked : ruleUnchecked} height={12} width={12}/>\n\n <span>{rule.label}</span>\n </div>\n )}\n </div>\n </div>\n );\n}","export function useGetColor(backgroundColor: string) {\n if (backgroundColor.length !== 7) throw new Error('provided hex color must be 7 characters (including #) long');\n\n backgroundColor = backgroundColor.substring(1, 7);\n const uiColors = [\n parseInt(backgroundColor.substring(0, 2), 16) / 255,\n parseInt(backgroundColor.substring(2, 4), 16) / 255,\n parseInt(backgroundColor.substring(4, 6), 16) / 255\n ];\n const c = uiColors.map(col => {\n return col <= 0.03928? (col / 12.92) : Math.pow((col + 0.055) / 1.055, 2.4);\n });\n const contrast = (0.2126 * c[0]) + (0.7152 * c[1]) + (0.0722 * c[2]);\n\n return contrast > 0.179 ? '#000000' : '#ffffff';\n}","import React, {ComponentPropsWithoutRef, CSSProperties, useRef} from 'react';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\nimport {useGetColor} from 'hooks/getColor';\n\ntype HEXColor = `#${string}`\n\ninterface ICustomButton extends ComponentPropsWithoutRef<'button'> {\n label : string;\n disabled?: boolean;\n small? : boolean;\n theme? : HEXColor | 'success' | 'warning' | 'error';\n}\n\nexport function CustomButton(props: ICustomButton) {\n const {\n disabled = false,\n label,\n small = false,\n theme,\n ...buttonProps\n } = props;\n\n const nodeRef = useRef<HTMLButtonElement>(null);\n useInjectStyleSheet(nodeRef);\n\n function getStyle(): CSSProperties | undefined {\n if (disabled || !theme) return undefined;\n\n if (theme.includes('#')) {\n return {\n color: useGetColor(theme),\n backgroundColor: theme,\n border: 'transparent'\n };\n }\n\n switch (theme) {\n case 'success':\n return {\n color: useGetColor('#006A4E'),\n backgroundColor: '#006A4E',\n border: 'transparent'\n };\n case 'warning':\n return {\n color: '#000000',\n backgroundColor: '#FFD700',\n border: 'transparent'\n };\n case 'error':\n return {\n color: useGetColor('#800020'),\n backgroundColor: '#800020',\n border: 'transparent'\n };\n default:\n throw new Error('invalid theme provided')\n }\n }\n\n function getClassName(): string {\n const base = 'uil-button uil-fit'\n\n if (disabled) {\n if (small) {\n return `${base} uil-disabled uil-small`;\n }\n\n return `${base} uil-font-base uil-disabled`;\n }\n\n if (small) {\n return `${base} uil-small`;\n }\n\n return `${base} uil-font-base`;\n }\n\n return (\n <button className={getClassName()} style={getStyle()} disabled={disabled} ref={nodeRef} {...buttonProps}>\n {label}\n </button>\n );\n}","import React, {useEffect, useRef} from 'react';\nimport {CustomButton} from 'components/button/customButton';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\nimport generateKey from 'utils/generateKey';\n\ninterface IBaseModal {\n close : () => void;\n message : string | string[];\n title : string;\n type : 'success' | 'warning' | 'error' | 'question';\n callback? : (() => void) | undefined;\n cancelLabel? : string;\n closeLabel? : string;\n confirm? : () => void;\n confirmLabel?: string;\n timeout? : number;\n}\n\nexport function BaseModal(props: IBaseModal) {\n const {\n callback,\n cancelLabel = '',\n close,\n closeLabel,\n confirm,\n confirmLabel = '',\n message,\n timeout,\n title,\n type\n } = props;\n\n let timer: NodeJS.Timeout | undefined = undefined;\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n useEffect(() => {\n if (!timeout) return;\n\n timer = setTimeout(() => {\n return callback ? callback() : close();\n }, timeout);\n\n return () => {clearTimeout(timer)};\n },[]);\n\n function setHeaderClass() {\n const base = 'uil-header';\n\n switch (type) {\n case 'error':\n return `${base} uil-error`;\n case 'success':\n return `${base} uil-success`;\n case 'warning':\n return `${base} uil-warning`;\n default:\n return base;\n }\n }\n\n function handleClose() {\n clearTimeout(timer);\n\n //run callback if timeout and callback are set, otherwise close\n if (timeout && callback) {\n return callback();\n }\n\n return close();\n }\n\n return (\n <div className={'uil-modal-wrapper'} ref={nodeRef}>\n <div className={'uil-modal'}>\n <div className={setHeaderClass()}>{title}</div>\n\n {timeout &&\n <div className={'uil-progress-wrapper'}>\n <div className={'uil-progress-bar'} style={{animationDuration: `${(timeout / 1000) + .5}s`}}/>\n </div>\n }\n\n <div className={'uil-content'}>\n <div>\n {Array.isArray(message) ?\n message.map((m, idx) => <p key={generateKey(idx)} className={'uil-modal-text'}>{m}</p>)\n : <p className={'uil-modal-text'}>{message}</p>\n }\n </div>\n\n <div className={`uil-button-wrapper ${type !== 'question' ? 'uil-single' : ''}`}>\n {type !== 'question' &&\n <CustomButton label={closeLabel?? ''} onClick={handleClose} type={'button'}/>\n }\n\n {type == 'question' && props.confirm &&\n <>\n <CustomButton label={confirmLabel} theme={'#00416A'} onClick={confirm} type={'button'}/>\n <CustomButton label={cancelLabel} onClick={close} type={'button'}/>\n </>\n }\n </div>\n </div>\n </div>\n </div>\n );\n}","import React from 'react';\nimport {BaseModal} from './baseModal';\n\nexport interface INotifyModal {\n close : () => void;\n closeLabel: string;\n modalType : 'success' | 'warning' | 'error';\n message : string | string[];\n title : string;\n callback? : (() => void) | undefined;\n timeout? : number;\n}\n\nexport function NotifyModal(props: INotifyModal) {\n const {\n modalType,\n ...modalProps\n } = props;\n\n return (\n <BaseModal type={modalType} {...modalProps}/>\n );\n}","import React from 'react';\nimport {BaseModal} from './baseModal';\n\nexport interface IQuestionModal {\n cancel : () => void;\n cancelLabel : string;\n confirm : () => void;\n confirmLabel: string;\n message : string | string[];\n title : string;\n}\n\nexport function QuestionModal(props: IQuestionModal) {\n const {\n cancel,\n ...modalProps\n } = props;\n\n return (\n <BaseModal type={'question'} close={cancel} {...modalProps}/>\n );\n}","import React, {useEffect, useRef} from 'react';\nimport generateKey from 'utils/generateKey';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\n\ninterface ICustomRadio {\n options : RadioOption[];\n value : string;\n valueChanged: (value: string) => void;\n checkColor? : string;\n disabled? : boolean;\n label? : string;\n}\n\nexport interface RadioOption {\n label : string;\n value : string;\n checked? : boolean;\n disabled?: boolean;\n}\n\nexport function CustomRadio(props: ICustomRadio) {\n const {\n checkColor,\n disabled,\n label,\n options,\n value,\n valueChanged,\n } = props;\n\n const id = generateKey('radio');\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n useEffect(() => {\n // prevents multiple radio options being checked at the same time\n options.forEach(option => {\n if (option.checked) handleRadioChange(option);\n });\n },[]);\n\n function handleRadioChange(option: RadioOption) {\n if (value === option.value || option.disabled || disabled) return;\n\n valueChanged(option.value);\n }\n\n return (\n <div ref={nodeRef}>\n {label && <div className={'uil-radio-title'}>{label}</div>}\n\n <div className={'uil-radio-wrapper'}>\n {options.map((option, idx) =>\n <div key={generateKey(idx)} className={'uil-radio-option'}>\n <div className={'uil-radio uil-check'} onClick={() => {handleRadioChange(option)}}>\n <input\n id={`${idx}-${id}`}\n name={option.label}\n type={'radio'}\n value={option.value}\n checked={value === option.value || value === '' && option.checked}\n onChange={() => {handleRadioChange(option)}}\n disabled={disabled? disabled : option.disabled}\n />\n <div className={'uil-checkmark uil-radio-check'} style={{backgroundColor: checkColor}}/>\n </div>\n\n <label htmlFor={`${idx}-${id}`} className={'uil-font-base'}>{option.label}</label>\n </div>\n )}\n </div>\n </div>\n );\n}","import React, {ComponentPropsWithoutRef, ReactNode, useRef} from 'react';\nimport useInjectStyleSheet from 'utils/useInjectStyles';\nimport generateKey from 'utils/generateKey';\n\ninterface ICustomCheckbox extends ComponentPropsWithoutRef<'input'> {\n checked : boolean;\n toggleCheck: (value: boolean) => void;\n checkColor?: string;\n children? : ReactNode;\n label? : string;\n}\n\nexport function CustomCheckbox(props: ICustomCheckbox) {\n const {\n checkColor,\n checked,\n children,\n toggleCheck,\n label,\n ...checkProps\n } = props;\n\n const id = generateKey('check');\n const nodeRef = useRef<HTMLDivElement>(null);\n useInjectStyleSheet(nodeRef);\n\n return (\n <div className={'uil-check-wrapper'} ref={nodeRef}>\n <div className={'uil-checkbox uil-check'} onClick={() => {toggleCheck(!checked)}}>\n <input type={'checkbox'} checked={checked} onChange={() => {toggleCheck(!checked)}} {...checkProps} id={id}/>\n <div className={'uil-checkmark'} style={{backgroundColor: checkColor}}/>\n </div>\n\n <label htmlFor={id} className={'uil-check-label'}>\n {children ? children : label}\n </label>\n </div>\n );\n}"],"names":["injectedStyles","useInjectStyleSheet","nodeRef","useEffect","parentDocument","current","ownerDocument","document","includes","styleElement","createElement","innerHTML","styles","push","head","appendChild","SVG","props","color","height","src","width","Error","style","fill","useRef","React","ref","className","href","BaseInput","iconColor","iconSrc","inputColor","label","toggle","valueChanged","inputProps","_objectWithoutPropertiesLoose","_excluded","htmlFor","id","_extends","onChange","e","target","value","placeholder","onClick","useClickOutsideRef","callback","addEventListener","handleClickOutside","removeEventListener","event","contains","CustomInput","tooltipClose","tooltipIcon","tooltipText","tooltipVisible","setTooltipVisible","useState","closeTooltip","Fragment","generateKey","prefix","String","Date","now","toString","Math","random","replace","PasswordInput","capsLockWarning","rules","ruleChecked","ruleUnchecked","setFailedRules","capsLock","setCapsLock","checkRule","rule","pattern","type","count","RegExp","test","failedRules","forEach","validateInput","setCapsLockState","getModifierState","map","idx","key","useGetColor","backgroundColor","length","substring","c","parseInt","col","pow","CustomButton","disabled","small","theme","buttonProps","base","getClassName","border","getStyle","BaseModal","cancelLabel","close","closeLabel","confirm","confirmLabel","message","timeout","title","timer","setTimeout","clearTimeout","setHeaderClass","animationDuration","Array","isArray","m","NotifyModal","modalType","modalProps","QuestionModal","cancel","CustomRadio","checkColor","options","handleRadioChange","option","checked","name","CustomCheckbox","children","toggleCheck","checkProps"],"mappings":"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"}
package/dist/components/checkbox/customCheckbox.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
2
2
  interface ICustomCheckbox extends ComponentPropsWithoutRef<'input'> {
3
3
  checked: boolean;
4
- label?: string;
5
4
  toggleCheck: (value: boolean) => void;
6
5
  checkColor?: string;
7
6
  children?: ReactNode;
7
+ label?: string;
8
8
  }
9
9
  export declare function CustomCheckbox(props: ICustomCheckbox): React.JSX.Element;
10
10
  export {};
package/dist/components/input/passwordInput.d.ts CHANGED
@@ -1,6 +1,5 @@
1
1
  import React from 'react';
2
2
  import { ICustomInput } from './customInput';
3
- import { PasswordRuleTypes } from 'enums/passwordRuleTypes';
4
3
  interface IPasswordInput extends ICustomInput {
5
4
  ruleChecked: string;
6
5
  rules: PasswordRule[];
@@ -11,7 +10,7 @@ interface IPasswordInput extends ICustomInput {
11
10
  export interface PasswordRule {
12
11
  label: string;
13
12
  count?: number;
14
- type?: PasswordRuleTypes;
13
+ type?: 'minLength' | 'maxLength' | 'letters' | 'numbers' | 'special' | 'upper';
15
14
  pattern?: string;
16
15
  }
17
16
  export declare function PasswordInput(props: IPasswordInput): React.JSX.Element;
package/dist/components/modal/baseModal.d.ts CHANGED
@@ -1,10 +1,9 @@
1
1
  import React from 'react';
2
- import { ModalType } from 'enums/modalType';
3
2
  interface IBaseModal {
4
3
  close: () => void;
5
4
  message: string | string[];
6
5
  title: string;
7
- type: ModalType;
6
+ type: 'success' | 'warning' | 'error' | 'question';
8
7
  callback?: (() => void) | undefined;
9
8
  cancelLabel?: string;
10
9
  closeLabel?: string;
package/dist/index.d.ts CHANGED
@@ -1,8 +1,7 @@
1
- export { CustomButton } from './components/button/index';
2
- export { CustomCheckbox } from './components/checkbox/index';
3
- export { SVG } from './components/images/index';
4
1
  export { CustomInput, PasswordInput, PasswordRule } from './components/input/index';
5
2
  export { NotifyModal, QuestionModal } from './components/modal/index';
6
3
  export { CustomRadio, RadioOption } from './components/radio/index';
4
+ export { CustomCheckbox } from './components/checkbox/index';
5
+ export { CustomButton } from './components/button/index';
6
+ export { SVG } from './components/images/index';
7
7
  export { useClickOutsideRef, useGetColor } from './hooks/index';
8
- export { PasswordRuleTypes } from './enums/index';
package/dist/utils/useInjectStyles.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import { RefObject } from "react";
1
+ import { RefObject } from 'react';
2
2
  export default function useInjectStyleSheet(nodeRef: RefObject<HTMLElement>): void;
package/package.json CHANGED
@@ -1,12 +1,11 @@
1
1
  {
2
2
  "private": false,
3
3
  "name": "@hbuesing/ui-library",
4
- "version": "3.1.0",
4
+ "version": "4.0.0",
5
5
  "description": "Collection of reusable ui components for react based applications",
6
6
  "source": "src/index.ts",
7
7
  "type": "module",
8
8
  "exports": "./dist/bundle.js",
9
- "types": "dist/index.d.ts",
10
9
  "files": [
11
10
  "dist/*"
12
11
  ],
@@ -15,9 +14,9 @@
15
14
  "lint": "eslint src",
16
15
  "lint:nw": "eslint src --max-warnings 0",
17
16
  "build": "microbundle build --output ./dist/bundle.js --generateTypes true --format modern --jsx react --globals react/jsx-runtime=jsxRuntime --css inline",
18
- "build:uil": "microbundle build --output ../website/src/uil-bundle/bundle.mjs --no-pkg-main --generateTypes true --format modern --jsx react --globals react/jsx-runtime=jsxRuntime --css inline",
19
- "dev": "microbundle -w --output ./dist/bundle.mjs --no-pkg-main --generateTypes true --format modern --jsx react --globals react/jsx-runtime=jsxRuntime --css inline",
20
- "stats": "microbundle --visualize"
17
+ "build:uil": "microbundle build --output ../website/src/uil-bundle/bundle.js --generateTypes true --format modern --jsx react --globals react/jsx-runtime=jsxRuntime --css inline",
18
+ "dev": "microbundle -w --output ./dist/bundle.js --generateTypes true --format modern --jsx react --globals react/jsx-runtime=jsxRuntime --css inline",
19
+ "stats": "microbundle build --output ./dist/bundle.js --generateTypes true --format modern --jsx react --globals react/jsx-runtime=jsxRuntime --css inline --visualize --raw"
21
20
  },
22
21
  "license": "MIT",
23
22
  "homepage": "https://hb-ui-library-docs.vercel.app",
package/dist/enums/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './passwordRuleTypes';
package/dist/enums/modalType.d.ts DELETED
@@ -1,6 +0,0 @@
1
- export declare enum ModalType {
2
- error = "error",
3
- question = "question",
4
- success = "success",
5
- warning = "warning"
6
- }
package/dist/enums/passwordRuleTypes.d.ts DELETED
@@ -1,8 +0,0 @@
1
- export declare enum PasswordRuleTypes {
2
- minLength = 1,
3
- maxLength = 2,
4
- letters = 3,
5
- numbers = 4,
6
- special = 5,
7
- upper = 6
8
- }