@tech-diefra/fluig-ui 1.0.2 → 1.0.4

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),l=require("react"),S=require("react-hook-form"),X=require("react-imask"),P=require("@fluig-kit/ecm"),L=require("react-datepicker"),E=require("date-fns"),Y={cpf:"000.000.000-00",cnpj:"00.000.000/0000-00",telefone:"(00) 00000-0000",cep:"00000-000"};function Q({name:e,label:a="",placeholder:n="",type:o="text",mask:r,className:d="",forceReadOnly:i=!1,forceHidden:c=!1}){const{isReadOnly:w,isHidden:g}=P.useSection(),x=i||!!w(e),b=c||!!g(e),{control:M}=S.useFormContext(),{isView:R}=P.useFluigRuntime(),{field:h}=S.useController({name:e,control:M}),{errors:y}=S.useFormState({name:e}),f=y==null?void 0:y[e],C=l.useMemo(()=>r?Y[r]??r:null,[r]),k=l.useCallback(s=>{if(!s)return"";const v=s.replace(/\D/g,"");return(Number(v)/100).toLocaleString("pt-BR",{style:"currency",currency:"BRL"})},[]),N=l.useCallback(s=>o==="monetary"?k(s):s,[o,k]);return R?t.jsxs("div",{className:"form-group",children:[t.jsx("label",{children:a}),t.jsx("span",{className:"form-control",children:h.value||"-"})]}):t.jsxs("div",{className:`form-group ${b?"hidden":""}`,children:[t.jsx("label",{children:a}),C?t.jsx(X.IMaskInput,{name:e,mask:C,value:String(h.value??""),unmask:!1,onAccept:s=>h.onChange(N(s)),placeholder:n,readOnly:x,className:`form-control ${f?"border-red":""} ${d}`,inputRef:h.ref,onBlur:h.onBlur}):t.jsx("input",{...h,type:"text",value:h.value??"",onChange:s=>h.onChange(N(s.target.value)),placeholder:n,readOnly:x,className:`form-control ${f?"border-red":""} ${d}`}),f&&t.jsx("p",{className:"text-danger",children:String(f.message)})]})}const G=l.memo(Q);function J({name:e,label:a="",options:n=[],placeholder:o="",labelKey:r="label",valueKey:d="value",enableSearch:i=!1,searchPlaceholder:c="Buscar...",loading:w=!1,onSearchChange:g,debounceTime:x=300,onSelect:b,forceReadOnly:M=!1,forceHidden:R=!1}){const{isReadOnly:h,isHidden:y}=P.useSection(),f=M||!!h(e),C=R||!!y(e),{control:k,clearErrors:N}=S.useFormContext(),{isView:s}=P.useFluigRuntime(),{field:{onChange:v,value:j,ref:V},fieldState:{error:u}}=S.useController({name:e,control:k}),[p,O]=l.useState(!1),[$,B]=l.useState(""),q=l.useRef(null),H=l.useRef(g);l.useEffect(()=>{H.current=g},[g]),l.useEffect(()=>{const m=W=>{q.current&&!q.current.contains(W.target)&&O(!1)};return document.addEventListener("mousedown",m),()=>document.removeEventListener("mousedown",m)},[]),l.useEffect(()=>{p||B("")},[p]),l.useEffect(()=>{if(!i)return;const m=setTimeout(()=>{H.current&&H.current($)},x);return()=>clearTimeout(m)},[$,i,x]);const z=l.useMemo(()=>i&&!g&&$.trim()?n.filter(m=>String((m==null?void 0:m[r])??"").toLowerCase().includes($.toLowerCase())):n??[],[n,i,g,$,r]),I=l.useMemo(()=>{if(j==null)return"";if(typeof j=="object")return String(j[d]??"");const m=(n||[]).find(W=>String(W==null?void 0:W[d])===String(j));return String(m?(m==null?void 0:m[r])??"":j)},[j,n,d,r]),_=m=>{f||(v(m[d]),b&&b(m),N(e),O(!1))};return t.jsxs("div",{className:`select-wrapper form-group ${C?"hidden":""}`,ref:q,children:[t.jsx("label",{className:"control-label",children:a}),s?t.jsx("span",{className:"form-control",children:I||"-"}):t.jsxs(t.Fragment,{children:[t.jsxs("div",{className:`select-control ${u?"border-red":""} ${f?"readOnly":""}`,onClick:()=>!f&&O(m=>!m),ref:V,children:[t.jsx("span",{className:`select-display ${f?"readOnly":""}`,children:I||o}),t.jsx("i",{className:"flaticon flaticon-chevron-down select-icon"})]}),p&&!f&&t.jsxs("div",{className:"select-dropdown",children:[i&&t.jsx("div",{className:"select-search",children:t.jsx("input",{type:"text",className:"select-search-input",value:$,onChange:m=>B(m.target.value),placeholder:w?"Carregando...":c,autoFocus:!0,onClick:m=>m.stopPropagation()})}),t.jsx("ul",{className:"select-options",children:w?t.jsx("li",{className:"select-option readOnly",children:"Carregando..."}):z.length>0?z.map(m=>t.jsx("li",{onClick:()=>_(m),className:"select-option handleHover",children:m[r]},m[d])):t.jsx("li",{className:"select-option readOnly",children:"Sem resultados"})})]})]}),t.jsx("input",{type:"hidden",name:e,value:j||""}),u&&t.jsx("p",{className:"text-danger",children:String(u.message)})]})}const U=l.memo(J);function Z({name:e,options:a=[],label:n="",valueKey:o="value",labelKey:r="label",forceReadOnly:d=!1,forceHidden:i=!1}){var j,V;const c=S.useFormContext(),{isView:w,isReadOnly:g}=P.useFluigRuntime(),{isReadOnly:x,isHidden:b}=P.useSection(),M=x?x(e):!1,R=b?b(e):!1,h=d||M,y=i||R,f=h||g||w;if(!c||!e)return console.error("Checkbox requer contexto de formulário e nome."),null;const C=()=>!a||!c?{}:a.reduce((u,p)=>{const O=p[o],$=c.getValues(O);return u[O]=$==="on",u},{}),k=c.watch(e),N=l.useMemo(()=>k&&typeof k=="object"?k:C(),[k,a,o]);l.useEffect(()=>{const u=c.getValues(e);(!u||typeof u!="object")&&c.setValue(e,N,{shouldDirty:!1,shouldValidate:!1})},[N,e,c]);const s=(u,p)=>{if(f)return;const O={...N,[u]:p};c.setValue(e,O,{shouldDirty:!0,shouldValidate:!0}),c.setValue(u,p?"on":"",{shouldValidate:!1})},v=(V=(j=c.formState)==null?void 0:j.errors)==null?void 0:V[e];return t.jsxs("div",{className:`form-group ${y?"hidden":""}`,children:[n&&t.jsx("label",{children:n}),t.jsx("div",{className:`checkbox-group-custom ${f?"readOnly":""}`,children:a.map(u=>{const p=String(u[o]),O=N[p]===!0;return t.jsxs("div",{children:[t.jsx("input",{type:"hidden",...c.register(p)}),t.jsxs("label",{className:`custom-checkbox ${O?"checked":""} ${f?"readOnly":""}`,children:[t.jsx("input",{type:"checkbox",checked:O,disabled:f,onChange:$=>s(p,$.target.checked)}),t.jsx("span",{className:"checkmark"}),t.jsx("span",{children:u[r]})]})]},p)})}),v&&t.jsx("p",{className:"text-danger",children:String(v.message)})]})}function K({name:e,label:a="",options:n=[],valueKey:o="value",labelKey:r="label",iconKey:d="icon",forceReadOnly:i=!1,forceHidden:c=!1}){const{isReadOnly:w,isHidden:g}=P.useSection(),x=i||!!w(e),b=c||!!g(e),{control:M}=S.useFormContext(),{isView:R,isReadOnly:h}=P.useFluigRuntime(),{field:y,fieldState:{error:f}}=S.useController({name:e,control:M}),C=x||h||R,k=y.value??"",N=l.useCallback(s=>{C||y.onChange(s)},[C,y]);return t.jsxs("div",{className:`form-group column ${b?"hidden":""}`,children:[a&&t.jsx("label",{className:"control-label",children:a}),t.jsx("div",{className:`btn-group ${C?"view-mode":""}`,"data-field-name":e,children:n.map(s=>{const v=s[o],j=k===v,V=s.color?{"--customColor":s.color}:void 0;return t.jsxs("label",{htmlFor:`${e}_${v}`,style:V,className:`btn fs-ellipsis ${j?"active":""}`,children:[t.jsx("input",{type:"radio",id:`${e}_${v}`,name:e,value:v,checked:j,className:"hidden",onChange:()=>N(v),disabled:C}),s[d]&&t.jsx("i",{className:`${s[d]} icon-sm`})," ",s[r]]},v)})}),f&&t.jsx("p",{className:"text-danger",children:String(f.message)})]})}const ee=l.memo(K),te=({name:e,label:a="",placeholder:n="",className:o="",rows:r=4,maxLength:d,forceReadOnly:i=!1,forceHidden:c=!1})=>{const{isReadOnly:w,isHidden:g}=P.useSection(),x=i||!!w(e),b=c||!!g(e),{control:M}=S.useFormContext(),{isView:R}=P.useFluigRuntime(),{field:h,fieldState:{error:y}}=S.useController({name:e,control:M});return R?t.jsxs("div",{className:`form-group ${b?"hidden":""}`,children:[t.jsx("label",{children:a}),t.jsx("span",{className:"form-control",children:h.value||"-"})]}):t.jsxs("div",{className:`form-group ${b?"hidden":""}`,children:[t.jsx("label",{children:a}),t.jsx("textarea",{...h,rows:r,maxLength:d,value:h.value||"",placeholder:n,readOnly:x,className:`form-control ${y?"border-red":""} ${o}`}),y&&t.jsx("p",{className:"text-danger",children:String(y.message)})]})},ne=l.memo(te);function T(e){return(a={})=>{const n=a.width?String(a.width):e.defaultWidth;return e.formats[n]||e.formats[e.defaultWidth]}}function F(e){return(a,n)=>{const o=n!=null&&n.context?String(n.context):"standalone";let r;if(o==="formatting"&&e.formattingValues){const i=e.defaultFormattingWidth||e.defaultWidth,c=n!=null&&n.width?String(n.width):i;r=e.formattingValues[c]||e.formattingValues[i]}else{const i=e.defaultWidth,c=n!=null&&n.width?String(n.width):e.defaultWidth;r=e.values[c]||e.values[i]}const d=e.argumentCallback?e.argumentCallback(a):a;return r[d]}}function D(e){return(a,n={})=>{const o=n.width,r=o&&e.matchPatterns[o]||e.matchPatterns[e.defaultMatchWidth],d=a.match(r);if(!d)return null;const i=d[0],c=o&&e.parsePatterns[o]||e.parsePatterns[e.defaultParseWidth],w=Array.isArray(c)?re(c,b=>b.test(i)):ae(c,b=>b.test(i));let g;g=e.valueCallback?e.valueCallback(w):w,g=n.valueCallback?n.valueCallback(g):g;const x=a.slice(i.length);return{value:g,rest:x}}}function ae(e,a){for(const n in e)if(Object.prototype.hasOwnProperty.call(e,n)&&a(e[n]))return n}function re(e,a){for(let n=0;n<e.length;n++)if(a(e[n]))return n}function se(e){return(a,n={})=>{const o=a.match(e.matchPattern);if(!o)return null;const r=o[0],d=a.match(e.parsePattern);if(!d)return null;let i=e.valueCallback?e.valueCallback(d[0]):d[0];i=n.valueCallback?n.valueCallback(i):i;const c=a.slice(r.length);return{value:i,rest:c}}}const oe={lessThanXSeconds:{one:"menos de um segundo",other:"menos de {{count}} segundos"},xSeconds:{one:"1 segundo",other:"{{count}} segundos"},halfAMinute:"meio minuto",lessThanXMinutes:{one:"menos de um minuto",other:"menos de {{count}} minutos"},xMinutes:{one:"1 minuto",other:"{{count}} minutos"},aboutXHours:{one:"cerca de 1 hora",other:"cerca de {{count}} horas"},xHours:{one:"1 hora",other:"{{count}} horas"},xDays:{one:"1 dia",other:"{{count}} dias"},aboutXWeeks:{one:"cerca de 1 semana",other:"cerca de {{count}} semanas"},xWeeks:{one:"1 semana",other:"{{count}} semanas"},aboutXMonths:{one:"cerca de 1 mês",other:"cerca de {{count}} meses"},xMonths:{one:"1 mês",other:"{{count}} meses"},aboutXYears:{one:"cerca de 1 ano",other:"cerca de {{count}} anos"},xYears:{one:"1 ano",other:"{{count}} anos"},overXYears:{one:"mais de 1 ano",other:"mais de {{count}} anos"},almostXYears:{one:"quase 1 ano",other:"quase {{count}} anos"}},ie=(e,a,n)=>{let o;const r=oe[e];return typeof r=="string"?o=r:a===1?o=r.one:o=r.other.replace("{{count}}",String(a)),n!=null&&n.addSuffix?n.comparison&&n.comparison>0?"em "+o:"há "+o:o},de={full:"EEEE, d 'de' MMMM 'de' y",long:"d 'de' MMMM 'de' y",medium:"d MMM y",short:"dd/MM/yyyy"},ce={full:"HH:mm:ss zzzz",long:"HH:mm:ss z",medium:"HH:mm:ss",short:"HH:mm"},le={full:"{{date}} 'às' {{time}}",long:"{{date}} 'às' {{time}}",medium:"{{date}}, {{time}}",short:"{{date}}, {{time}}"},ue={date:T({formats:de,defaultWidth:"full"}),time:T({formats:ce,defaultWidth:"full"}),dateTime:T({formats:le,defaultWidth:"full"})},me={lastWeek:e=>{const a=e.getDay();return"'"+(a===0||a===6?"último":"última")+"' eeee 'às' p"},yesterday:"'ontem às' p",today:"'hoje às' p",tomorrow:"'amanhã às' p",nextWeek:"eeee 'às' p",other:"P"},he=(e,a,n,o)=>{const r=me[e];return typeof r=="function"?r(a):r},fe={narrow:["AC","DC"],abbreviated:["AC","DC"],wide:["antes de cristo","depois de cristo"]},ge={narrow:["1","2","3","4"],abbreviated:["T1","T2","T3","T4"],wide:["1º trimestre","2º trimestre","3º trimestre","4º trimestre"]},xe={narrow:["j","f","m","a","m","j","j","a","s","o","n","d"],abbreviated:["jan","fev","mar","abr","mai","jun","jul","ago","set","out","nov","dez"],wide:["janeiro","fevereiro","março","abril","maio","junho","julho","agosto","setembro","outubro","novembro","dezembro"]},be={narrow:["D","S","T","Q","Q","S","S"],short:["dom","seg","ter","qua","qui","sex","sab"],abbreviated:["domingo","segunda","terça","quarta","quinta","sexta","sábado"],wide:["domingo","segunda-feira","terça-feira","quarta-feira","quinta-feira","sexta-feira","sábado"]},ye={narrow:{am:"a",pm:"p",midnight:"mn",noon:"md",morning:"manhã",afternoon:"tarde",evening:"tarde",night:"noite"},abbreviated:{am:"AM",pm:"PM",midnight:"meia-noite",noon:"meio-dia",morning:"manhã",afternoon:"tarde",evening:"tarde",night:"noite"},wide:{am:"a.m.",pm:"p.m.",midnight:"meia-noite",noon:"meio-dia",morning:"manhã",afternoon:"tarde",evening:"tarde",night:"noite"}},je={narrow:{am:"a",pm:"p",midnight:"mn",noon:"md",morning:"da manhã",afternoon:"da tarde",evening:"da tarde",night:"da noite"},abbreviated:{am:"AM",pm:"PM",midnight:"meia-noite",noon:"meio-dia",morning:"da manhã",afternoon:"da tarde",evening:"da tarde",night:"da noite"},wide:{am:"a.m.",pm:"p.m.",midnight:"meia-noite",noon:"meio-dia",morning:"da manhã",afternoon:"da tarde",evening:"da tarde",night:"da noite"}},ve=(e,a)=>{const n=Number(e);return(a==null?void 0:a.unit)==="week"?n+"ª":n+"º"},pe={ordinalNumber:ve,era:F({values:fe,defaultWidth:"wide"}),quarter:F({values:ge,defaultWidth:"wide",argumentCallback:e=>e-1}),month:F({values:xe,defaultWidth:"wide"}),day:F({values:be,defaultWidth:"wide"}),dayPeriod:F({values:ye,defaultWidth:"wide",formattingValues:je,defaultFormattingWidth:"wide"})},we=/^(\d+)[ºªo]?/i,Ce=/\d+/i,ke={narrow:/^(ac|dc|a|d)/i,abbreviated:/^(a\.?\s?c\.?|d\.?\s?c\.?)/i,wide:/^(antes de cristo|depois de cristo)/i},Ne={any:[/^ac/i,/^dc/i],wide:[/^antes de cristo/i,/^depois de cristo/i]},Pe={narrow:/^[1234]/i,abbreviated:/^T[1234]/i,wide:/^[1234](º)? trimestre/i},Me={any:[/1/i,/2/i,/3/i,/4/i]},Se={narrow:/^[jfmajsond]/i,abbreviated:/^(jan|fev|mar|abr|mai|jun|jul|ago|set|out|nov|dez)/i,wide:/^(janeiro|fevereiro|março|abril|maio|junho|julho|agosto|setembro|outubro|novembro|dezembro)/i},Re={narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^fev/i,/^mar/i,/^abr/i,/^mai/i,/^jun/i,/^jul/i,/^ago/i,/^set/i,/^out/i,/^nov/i,/^dez/i]},Oe={narrow:/^(dom|[23456]ª?|s[aá]b)/i,short:/^(dom|[23456]ª?|s[aá]b)/i,abbreviated:/^(dom|seg|ter|qua|qui|sex|s[aá]b)/i,wide:/^(domingo|(segunda|ter[cç]a|quarta|quinta|sexta)([- ]feira)?|s[aá]bado)/i},$e={short:[/^d/i,/^2/i,/^3/i,/^4/i,/^5/i,/^6/i,/^s[aá]/i],narrow:[/^d/i,/^2/i,/^3/i,/^4/i,/^5/i,/^6/i,/^s[aá]/i],any:[/^d/i,/^seg/i,/^t/i,/^qua/i,/^qui/i,/^sex/i,/^s[aá]b/i]},Ve={narrow:/^(a|p|mn|md|(da) (manhã|tarde|noite))/i,any:/^([ap]\.?\s?m\.?|meia[-\s]noite|meio[-\s]dia|(da) (manhã|tarde|noite))/i},We={any:{am:/^a/i,pm:/^p/i,midnight:/^mn|^meia[-\s]noite/i,noon:/^md|^meio[-\s]dia/i,morning:/manhã/i,afternoon:/tarde/i,evening:/tarde/i,night:/noite/i}},Fe={ordinalNumber:se({matchPattern:we,parsePattern:Ce,valueCallback:e=>parseInt(e,10)}),era:D({matchPatterns:ke,defaultMatchWidth:"wide",parsePatterns:Ne,defaultParseWidth:"any"}),quarter:D({matchPatterns:Pe,defaultMatchWidth:"wide",parsePatterns:Me,defaultParseWidth:"any",valueCallback:e=>e+1}),month:D({matchPatterns:Se,defaultMatchWidth:"wide",parsePatterns:Re,defaultParseWidth:"any"}),day:D({matchPatterns:Oe,defaultMatchWidth:"wide",parsePatterns:$e,defaultParseWidth:"any"}),dayPeriod:D({matchPatterns:Ve,defaultMatchWidth:"any",parsePatterns:We,defaultParseWidth:"any"})},De={code:"pt-BR",formatDistance:ie,formatLong:ue,formatRelative:he,localize:pe,match:Fe,options:{weekStartsOn:0,firstWeekContainsDate:1}};L.registerLocale("pt-BR",De);const A="dd/MM/yyyy",qe=e=>{if(!e)return null;const a=E.parse(e,A,new Date);return E.isValid(a)?a:null},He=e=>e?E.format(e,A):"",Te=l.forwardRef(({shimRef:e,className:a,name:n,...o},r)=>t.jsx("input",{name:n,...o,className:a,ref:d=>{typeof r=="function"?r(d):r&&(r.current=d),e&&e(d)}})),Ee=({name:e,label:a="",placeholder:n="dd/mm/aaaa",className:o="",forceReadOnly:r=!1,forceHidden:d=!1})=>{const{control:i}=S.useFormContext(),{isView:c}=P.useFluigRuntime(),{isReadOnly:w,isHidden:g}=P.useSection(),x=r||!!w(e),b=d||!!g(e),{field:{onChange:M,onBlur:R,value:h,ref:y},fieldState:{error:f}}=S.useController({name:e,control:i}),C=l.useMemo(()=>qe(h),[h]),k=l.useCallback(s=>{M(s?He(s):"")},[M]),N=l.useCallback(s=>{var v,j;if(y(s),s&&((j=(v=i._fields)==null?void 0:v[e])!=null&&j._f)){const V=i._fields[e];V._f.ref={focus:()=>{var u;return(u=s.focus)==null?void 0:u.call(s)},select:()=>{var u;return(u=s.select)==null?void 0:u.call(s)},setCustomValidity:u=>{var p;return(p=s.setCustomValidity)==null?void 0:p.call(s,u)},reportValidity:()=>{var u;return(u=s.reportValidity)==null?void 0:u.call(s)}}}},[y,i,e]);return b?null:c?t.jsxs("div",{className:"form-group",children:[t.jsx("label",{children:a}),t.jsx("span",{className:"form-control",children:h||"-"})]}):t.jsxs("div",{className:`form-group fluig-style-guide ${o}`,children:[a&&t.jsx("label",{className:"control-label",htmlFor:e,children:a}),t.jsx("div",{className:`${f?"border-red":""}`,children:t.jsx(L,{id:e,name:e,selected:C,onChange:k,onBlur:R,dateFormat:A,placeholderText:n,disabled:x,readOnly:x,locale:"pt-BR",className:`form-control ${f?"border-red":""}`,wrapperClassName:"w-100",showMonthDropdown:!0,showYearDropdown:!0,dropdownMode:"select",isClearable:!x&&!!h,autoComplete:"off",customInput:t.jsx(Te,{name:e,shimRef:N})})}),f&&t.jsx("span",{className:"help-block text-danger",children:String(f.message)})]})},Ae=l.memo(Ee);function Be({mapping:e={},defaultLabel:a="Não reconhecido",className:n="",hidden:o=!1,label:r}){const{activityId:d}=P.useFluigRuntime(),i=l.useMemo(()=>!e||d===null||d===void 0?null:e[d],[d,e]);if(!i)return t.jsxs("div",{className:`form-group ${o?"hidden":""}`,children:[r&&t.jsx("label",{children:r}),t.jsx("div",{className:`status-badge default ${n}`,children:a})]});const c={"--customColor":i.color};return t.jsxs("div",{className:`form-group ${o?"hidden":""}`,children:[r&&t.jsx("label",{children:r}),t.jsxs("div",{className:`status-badge ${n}`,style:c,children:[i.icon&&t.jsx("i",{className:i.icon}),t.jsx("span",{children:i.label})]})]})}const ze=l.memo(Be);exports.Checkbox=Z;exports.DatePicker=Ae;exports.Input=G;exports.RadioBtn=ee;exports.Select=U;exports.StatusBadge=ze;exports.TextArea=ne;