form-component-library-demo 1.0.3 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/index.cjs +1 -1
- package/dist/src/index.css +1 -1
- package/dist/src/index.js +228 -212
- package/package.json +1 -1
package/dist/src/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("react");c=s(c,1);let l=require("react/jsx-runtime"),u=require("lucide-react");var d=`field_library_token`,f=`field_library_user`,p=class{constructor({baseUrl:e,appId:t,onAuthError:n}){if(!e)throw Error(`baseUrl is required`);if(!t)throw Error(`appId is required`);if(this.baseUrl=e.replace(/\/+$/,``),this.appId=t,this.onAuthError=n,this.token=null,this.user=null,typeof window<`u`){this.token=localStorage.getItem(d);try{let e=localStorage.getItem(f);e&&(this.user=JSON.parse(e))}catch{this.user=null}}}setAuthErrorHandler(e){this.onAuthError=e}setToken(e){this.token=e,!(typeof window>`u`)&&(e?localStorage.setItem(d,e):(localStorage.removeItem(d),localStorage.removeItem(f),this.user=null))}getToken(){return this.token}async request(e,t,n,r={}){let i={"Content-Type":`application/json`,...r};return this.token&&(i.Authorization=`Bearer ${this.token}`),this.send(e,t,{headers:i,body:n===void 0?void 0:JSON.stringify(n)})}async requestForm(e,t){let n={};return this.token&&(n.Authorization=`Bearer ${this.token}`),this.send(`POST`,e,{headers:n,body:t})}async send(e,t,n){let r=await fetch(`${this.baseUrl}${t}`,{method:e,...n});if(r.status===401)throw this.setToken(null),this.onAuthError?.(),{status:401,message:`Unauthorized`};if(!r.ok){let e=r.statusText;try{let t=await r.json();t.error&&(e=t.error)}catch{}throw{status:r.status,message:e}}if(r.status!==204)return await r.json()}async login(e,t,n){let r=await this.request(`POST`,`/usr/login`,{email:e,password:t,...n?{org_id:Number(n)}:{}});return this.setToken(r.token),typeof window<`u`&&r.user&&(this.user=r.user,localStorage.setItem(f,JSON.stringify(r.user))),r}logout(){this.setToken(null)}async getMe(){let e=await this.request(`GET`,`/usr/app/${this.appId}/me`);return this.user&&(this.user={...this.user,...e},typeof window<`u`&&localStorage.setItem(f,JSON.stringify(this.user))),e}currentUser(){if(!this.token)return null;if(this.user)return this.user;try{let e=JSON.parse(atob(this.token.split(`.`)[1]));return{id:String(e.user_id??e.sub??``),org_id:String(e.org_id??``),name:e.name??``,email:e.email??``,mobile:String(e.mobile??e.mobile_number??e.phone??e.phone_number??e.user_mobile??``),roles:e.roles??[],groups:e.groups??[]}}catch{return null}}recordView(e,t={}){return this.request(`POST`,`/app/${this.appId}/view/recordview`,{rv_template_uid:e,...t.presetAlias?{preset_alias:t.presetAlias}:{},search_query:{page:t.page??1,limit:t.limit??50,sort_by:t.sortBy??``,sort_dir:t.sortDir??`desc`,search:t.search??``,filters:(t.filters??[]).map(e=>{let t={field_key:e.field_key,data_type:e.data_type??`character varying`};return e.values&&e.values.length>0?t.values=e.values:(t.value=e.value??``,t.value2=``),t})}})}detailView(e,t){return this.request(`GET`,`/app/${this.appId}/view/detailview/${e}?instance_id=${encodeURIComponent(String(t))}`)}audit(e){return this.request(`GET`,`/app/${this.appId}/view/audit?instance_id=${encodeURIComponent(String(e))}`)}aiDecisions(e){return this.request(`GET`,`/monitor/decisions?instance_id=${encodeURIComponent(String(e))}`).then(e=>e.decisions??[])}formSchema(e,t){return this.request(`POST`,`/app/${this.appId}/view/form-screens`,{activity_id:e,device_type:`desktop`,...t==null?{}:{instance_id:t}})}startInstance(e,t,n){return this.request(`POST`,`/app/${this.appId}/start`,{workflow_uuid:e,activity_id:t,data:n})}performActivity(e,t,n,r){return this.request(`POST`,`/app/${this.appId}/activity`,{workflow_uuid:e,instance_id:typeof t==`string`&&Number(t)||t,activity_id:n,data:r})}lookupRecords(e,t,n){return this.request(`POST`,`/app/${this.appId}/rdbms-templates/${t}/records`,{workflow_uuid:e,activity_id:n.activityId,field_id:n.fieldId,instance_id:n.instanceId||void 0,search:n.search??``,limit:n.limit??50,offset:0,form_data:n.formData??{}})}wfLookupRecords(e,t){return this.request(`POST`,`/app/${this.appId}/wf-lookup/records`,{workflow_uuid:e,activity_id:t.activityId,field_id:t.fieldId,form_data:t.formData??{},search:t.search??``,limit:t.limit??100,offset:t.offset??0})}datasetOptions(e,t){return this.request(`POST`,`/app/${this.appId}/dataset-options`,{workflow_uuid:e,activity_id:t.activityId,field_id:t.fieldId,instance_id:t.instanceId||void 0,search:t.search??``,limit:t.limit??200,offset:0,form_data:t.formData??{}})}getDatasets(){return this.request(`GET`,`/app/${this.appId}/datasets`)}getDataset(e){return this.request(`GET`,`/app/${this.appId}/datasets/${e}`)}createDataset(e){return this.request(`POST`,`/app/${this.appId}/datasets`,e)}updateDataset(e,t){return this.request(`PUT`,`/app/${this.appId}/datasets/${e}`,t)}fieldForm(e,t,n){let r=new FormData;return r.append(`file`,t),r.append(`workflow_uuid`,e),r.append(`activity_id`,n.activityId),r.append(`field_id`,n.fieldId),n.instanceId!=null&&r.append(`instance_id`,String(n.instanceId)),r}uploadFile(e,t,n){return this.requestForm(`/app/${this.appId}/upload`,this.fieldForm(e,t,n))}async extractOcr(e,t,n){if(t instanceof File||t instanceof Blob){let r=new FormData;return r.append(`file`,t),r.append(`store_file`,`true`),r.append(`workflow_uuid`,e),r.append(`activity_id`,n.activityId),r.append(`field_id`,n.fieldId),n.versionUuid&&r.append(`version_uuid`,n.versionUuid),n.instanceId!=null&&r.append(`instance_id`,String(n.instanceId)),this.requestForm(`/app/${this.appId}/ocr-extract`,r)}{let r={workflow_uuid:e,activity_id:n.activityId,field_id:n.fieldId,version_uuid:n.versionUuid,files:[t]};return n.instanceId!=null&&(r.instance_id=Number(n.instanceId)),{...await this.request(`POST`,`/app/${this.appId}/ocr-extract`,r),file:t}}}async getFilePreviewBlob(e){let t={};this.token&&(t.Authorization=`Bearer ${this.token}`);let n=await fetch(`${this.baseUrl}/app/${this.appId}/view/files/${e}/preview`,{method:`GET`,headers:t});if(n.status===401)throw this.setToken(null),this.onAuthError?.(),{status:401,message:`Unauthorized`};if(!n.ok)throw{status:n.status,message:`Failed to fetch preview`};return await n.blob()}},m={imagePreviewLoading:`_imagePreviewLoading_1rk84_1`,spinner:`_spinner_1rk84_10`,"zf-spin":`_zf-spin_1rk84_1`,spinnerSm:`_spinnerSm_1rk84_19`,imagePreviewError:`_imagePreviewError_1rk84_28`,imagePreview:`_imagePreview_1rk84_1`},h=(...e)=>e.filter(Boolean).join(` `);function g({file:e,client:t,className:n=``}){let[r,i]=(0,c.useState)(null),[a,o]=(0,c.useState)(!1),[s,u]=(0,c.useState)(!1);return(0,c.useEffect)(()=>{let n=null,r=!0;async function a(){if(!e){r&&i(null);return}if(e instanceof File){n=URL.createObjectURL(e),r&&i(n);return}if(e.uuid){if(!t){console.warn(`ImagePreview: 'client' prop is missing, cannot load remote preview`),r&&u(!0);return}r&&o(!0);try{let a=await t.getFilePreviewBlob(e.uuid);n=URL.createObjectURL(a),r&&i(n)}catch(e){console.error(`Failed to load image preview:`,e),r&&u(!0)}finally{r&&o(!1)}}}return a(),()=>{r=!1,n&&URL.revokeObjectURL(n)}},[e,t]),a?(0,l.jsx)(`div`,{className:h(m.imagePreviewLoading,n),children:(0,l.jsx)(`div`,{className:h(m.spinner,m.spinnerSm)})}):s||!r?(0,l.jsx)(`div`,{className:h(m.imagePreviewError,n),children:s?`Preview failed`:`No preview`}):(0,l.jsx)(`img`,{src:r,alt:`Preview`,className:h(m.imagePreview,n)})}var _={fieldContainer:`_fieldContainer_19pm5_2`,label:`_label_19pm5_14`,fieldBody:`_fieldBody_19pm5_20`,sizeSm:`_sizeSm_19pm5_27`,dropzone:`_dropzone_19pm5_27`,sizeMd:`_sizeMd_19pm5_28`,sizeLg:`_sizeLg_19pm5_29`,variantPrimary:`_variantPrimary_19pm5_32`,dropzoneIcon:`_dropzoneIcon_19pm5_34`,dropzoneText:`_dropzoneText_19pm5_34`,variantSecondary:`_variantSecondary_19pm5_36`,variantDanger:`_variantDanger_19pm5_40`,dropzoneLoading:`_dropzoneLoading_19pm5_60`,spinner:`_spinner_19pm5_102`,"zf-spin":`_zf-spin_19pm5_1`,spinnerSm:`_spinnerSm_19pm5_116`,previewList:`_previewList_19pm5_126`,previewCard:`_previewCard_19pm5_133`,previewSizeSm:`_previewSizeSm_19pm5_143`,previewSizeMd:`_previewSizeMd_19pm5_144`,previewSizeLg:`_previewSizeLg_19pm5_145`,documentPreview:`_documentPreview_19pm5_147`,fileIcon:`_fileIcon_19pm5_163`,documentName:`_documentName_19pm5_170`,removeBtn:`_removeBtn_19pm5_180`,retryBtnIcon:`_retryBtnIcon_19pm5_200`,overlay:`_overlay_19pm5_220`,extractedPanel:`_extractedPanel_19pm5_232`,extractedTitle:`_extractedTitle_19pm5_241`,extractedList:`_extractedList_19pm5_248`,extractedItem:`_extractedItem_19pm5_254`,extractedKey:`_extractedKey_19pm5_265`,extractedVal:`_extractedVal_19pm5_272`,hidden:`_hidden_19pm5_284`,errorText:`_errorText_19pm5_285`,btnSecondary:`_btnSecondary_19pm5_286`},v=(...e)=>e.filter(Boolean).join(` `),y=e=>{let t=e.name||e.original_name||``,n=e.type||e.mime_type||``;return t.endsWith(`.pdf`)||n.includes(`pdf`)||t.match(/\.(doc|docx|txt)$/i)?(0,l.jsx)(u.FileText,{className:_.fileIcon}):(0,l.jsx)(u.File,{className:_.fileIcon})};function b({label:e,value:t,onChange:n,onExtracted:r,onProcess:i,fieldMap:a,client:o,showExtracted:s=!0,accept:d=`image/*,application/pdf`,variant:f=`primary`,size:p=`md`,previewSize:m=`md`,width:h=`full`,className:b=``}){let[x,S]=(0,c.useState)(!1),[C,w]=(0,c.useState)(null),[T,E]=(0,c.useState)(null),D=(0,c.useRef)(null),O=Array.isArray(t)?t:t?[t]:[],k=e=>{if(e.file&&n(e.file),e.extract_error)w(e.extract_error);else if(e.extracted){E(e.extracted);let t={...e.extracted};if(a){if(t={},Array.isArray(a))for(let[n,r]of Object.entries(e.extracted)){let e=a.find(e=>e.source===n||e.extractKey===n),i=e?e.target||e.fieldId:n;t[i]=r}else for(let[n,r]of Object.entries(e.extracted)){let e=a[n]||n;t[e]=r}}r&&r(t)}},A=async e=>{let t=e.target.files?.[0];if(t){S(!0),w(null),E(null);try{let e=await i(t);k(e)}catch(e){console.error(e),w(`OCR extraction failed`)}finally{S(!1),D.current&&(D.current.value=``)}}},j=async e=>{S(!0),w(null);try{let t=await i(e);k(t)}catch(e){console.error(e),w(`OCR extraction retry failed`)}finally{S(!1)}},M=e=>{let t=[...O];if(t.splice(e,1),n(t.length===0?null:t),t.length===0){if(T&&r){let e={};if(a){if(Array.isArray(a))for(let t of Object.keys(T)){let n=a.find(e=>e.source===t||e.extractKey===t),r=n?n.target||n.fieldId:t;e[r]=``}else for(let t of Object.keys(T)){let n=a[t]||t;e[n]=``}}else for(let t of Object.keys(T))e[t]=``;r(e)}E(null)}},N=e=>e instanceof File?e.type.startsWith(`image/`):e.mime_type?e.mime_type.startsWith(`image/`):e.original_name?/\.(jpg|jpeg|png|gif|webp)$/i.test(e.original_name):!1,P=h===`full`?{width:`100%`}:{width:h};return(0,l.jsxs)(`div`,{className:v(_.fieldContainer,_[`variant${f.charAt(0).toUpperCase()+f.slice(1)}`],_[`size${p.charAt(0).toUpperCase()+p.slice(1)}`],_[`previewSize${m.charAt(0).toUpperCase()+m.slice(1)}`],b),style:P,children:[(0,l.jsxs)(`label`,{className:_.label,children:[e,` (OCR)`]}),(0,l.jsxs)(`div`,{className:_.fieldBody,children:[O.length===0&&(0,l.jsxs)(`div`,{className:v(_.dropzone,x&&_.dropzoneLoading),onClick:()=>D.current?.click(),children:[(0,l.jsx)(`input`,{ref:D,type:`file`,onChange:A,disabled:x,accept:d,className:_.hidden}),x?(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(`div`,{className:v(_.spinner,_.spinnerSm,_.dropzoneIcon)}),(0,l.jsx)(`p`,{className:_.dropzoneText,children:`Extracting OCR data...`})]}):(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(u.FileUp,{className:_.dropzoneIcon}),(0,l.jsx)(`p`,{className:_.dropzoneText,children:`Drop a document to extract`})]})]}),O.length>0&&(0,l.jsx)(`div`,{className:_.previewList,children:O.map((e,t)=>(0,l.jsxs)(`div`,{className:_.previewCard,children:[N(e)?(0,l.jsx)(g,{file:e,client:o}):(0,l.jsxs)(`div`,{className:_.documentPreview,children:[y(e),(0,l.jsx)(`span`,{className:_.documentName,title:e.name||e.original_name,children:e.name||e.original_name||`Document`})]}),x&&(0,l.jsx)(`div`,{className:_.overlay,children:(0,l.jsx)(`div`,{className:_.spinner})}),!x&&(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(`button`,{type:`button`,onClick:()=>j(e),className:_.retryBtnIcon,title:`Retry extraction`,children:(0,l.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,l.jsx)(`path`,{d:`M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,l.jsx)(`path`,{d:`M3 3v5h5`}),(0,l.jsx)(`path`,{d:`M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16`}),(0,l.jsx)(`path`,{d:`M16 21v-5h5`})]})}),(0,l.jsx)(`button`,{type:`button`,onClick:()=>M(t),className:_.removeBtn,title:`Remove file`,children:(0,l.jsx)(u.X,{size:12,strokeWidth:3})})]})]},t))}),C&&(0,l.jsxs)(`div`,{className:_.fieldBody,children:[(0,l.jsx)(`p`,{className:_.errorText,children:C}),O.length>0&&!T&&(0,l.jsx)(`button`,{type:`button`,onClick:()=>j(O[0]),disabled:x,className:_.btnSecondary,style:{alignSelf:`flex-start`},children:x?`Retrying...`:`Retry Extraction`})]}),s&&T&&(0,l.jsxs)(`div`,{className:_.extractedPanel,children:[(0,l.jsx)(`p`,{className:_.extractedTitle,children:`Extracted Data`}),(0,l.jsx)(`div`,{className:_.extractedList,children:Object.entries(T).map(([e,t])=>(0,l.jsxs)(`div`,{className:_.extractedItem,children:[(0,l.jsx)(`span`,{className:_.extractedKey,children:e.replace(/_/g,` `)}),(0,l.jsx)(`span`,{className:_.extractedVal,children:String(t)})]},e))})]})]})]})}exports.ImagePreview=g,exports.OcrField=b,exports.ZinoClient=p;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("react");c=s(c,1);let l=require("react/jsx-runtime"),u=require("lucide-react");var d=`field_library_token`,f=`field_library_user`,p=class{constructor({baseUrl:e,appId:t,onAuthError:n}){if(!e)throw Error(`baseUrl is required`);if(!t)throw Error(`appId is required`);if(this.baseUrl=e.replace(/\/+$/,``),this.appId=t,this.onAuthError=n,this.token=null,this.user=null,typeof window<`u`){this.token=localStorage.getItem(d);try{let e=localStorage.getItem(f);e&&(this.user=JSON.parse(e))}catch{this.user=null}}}setAuthErrorHandler(e){this.onAuthError=e}setToken(e){this.token=e,!(typeof window>`u`)&&(e?localStorage.setItem(d,e):(localStorage.removeItem(d),localStorage.removeItem(f),this.user=null))}getToken(){return this.token}async request(e,t,n,r={}){let i={"Content-Type":`application/json`,...r};return this.token&&(i.Authorization=`Bearer ${this.token}`),this.send(e,t,{headers:i,body:n===void 0?void 0:JSON.stringify(n)})}async requestForm(e,t){let n={};return this.token&&(n.Authorization=`Bearer ${this.token}`),this.send(`POST`,e,{headers:n,body:t})}async send(e,t,n){let r=await fetch(`${this.baseUrl}${t}`,{method:e,...n});if(r.status===401)throw this.setToken(null),this.onAuthError?.(),{status:401,message:`Unauthorized`};if(!r.ok){let e=r.statusText;try{let t=await r.json();t.error&&(e=t.error)}catch{}throw{status:r.status,message:e}}if(r.status!==204)return await r.json()}async login(e,t,n){let r=await this.request(`POST`,`/usr/login`,{email:e,password:t,...n?{org_id:Number(n)}:{}});return this.setToken(r.token),typeof window<`u`&&r.user&&(this.user=r.user,localStorage.setItem(f,JSON.stringify(r.user))),r}logout(){this.setToken(null)}async getMe(){let e=await this.request(`GET`,`/usr/app/${this.appId}/me`);return this.user&&(this.user={...this.user,...e},typeof window<`u`&&localStorage.setItem(f,JSON.stringify(this.user))),e}currentUser(){if(!this.token)return null;if(this.user)return this.user;try{let e=JSON.parse(atob(this.token.split(`.`)[1]));return{id:String(e.user_id??e.sub??``),org_id:String(e.org_id??``),name:e.name??``,email:e.email??``,mobile:String(e.mobile??e.mobile_number??e.phone??e.phone_number??e.user_mobile??``),roles:e.roles??[],groups:e.groups??[]}}catch{return null}}recordView(e,t={}){return this.request(`POST`,`/app/${this.appId}/view/recordview`,{rv_template_uid:e,...t.presetAlias?{preset_alias:t.presetAlias}:{},search_query:{page:t.page??1,limit:t.limit??50,sort_by:t.sortBy??``,sort_dir:t.sortDir??`desc`,search:t.search??``,filters:(t.filters??[]).map(e=>{let t={field_key:e.field_key,data_type:e.data_type??`character varying`};return e.values&&e.values.length>0?t.values=e.values:(t.value=e.value??``,t.value2=``),t})}})}detailView(e,t){return this.request(`GET`,`/app/${this.appId}/view/detailview/${e}?instance_id=${encodeURIComponent(String(t))}`)}audit(e){return this.request(`GET`,`/app/${this.appId}/view/audit?instance_id=${encodeURIComponent(String(e))}`)}aiDecisions(e){return this.request(`GET`,`/monitor/decisions?instance_id=${encodeURIComponent(String(e))}`).then(e=>e.decisions??[])}formSchema(e,t){return this.request(`POST`,`/app/${this.appId}/view/form-screens`,{activity_id:e,device_type:`desktop`,...t==null?{}:{instance_id:t}})}startInstance(e,t,n){return this.request(`POST`,`/app/${this.appId}/start`,{workflow_uuid:e,activity_id:t,data:n})}performActivity(e,t,n,r){return this.request(`POST`,`/app/${this.appId}/activity`,{workflow_uuid:e,instance_id:typeof t==`string`&&Number(t)||t,activity_id:n,data:r})}lookupRecords(e,t,n){return this.request(`POST`,`/app/${this.appId}/rdbms-templates/${t}/records`,{workflow_uuid:e,activity_id:n.activityId,field_id:n.fieldId,instance_id:n.instanceId||void 0,search:n.search??``,limit:n.limit??50,offset:0,form_data:n.formData??{}})}wfLookupRecords(e,t){return this.request(`POST`,`/app/${this.appId}/wf-lookup/records`,{workflow_uuid:e,activity_id:t.activityId,field_id:t.fieldId,form_data:t.formData??{},search:t.search??``,limit:t.limit??100,offset:t.offset??0})}datasetOptions(e,t){return this.request(`POST`,`/app/${this.appId}/dataset-options`,{workflow_uuid:e,activity_id:t.activityId,field_id:t.fieldId,instance_id:t.instanceId||void 0,search:t.search??``,limit:t.limit??200,offset:0,form_data:t.formData??{}})}getDatasets(){return this.request(`GET`,`/app/${this.appId}/datasets`)}getDataset(e){return this.request(`GET`,`/app/${this.appId}/datasets/${e}`)}createDataset(e){return this.request(`POST`,`/app/${this.appId}/datasets`,e)}updateDataset(e,t){return this.request(`PUT`,`/app/${this.appId}/datasets/${e}`,t)}fieldForm(e,t,n){let r=new FormData;return r.append(`file`,t),r.append(`workflow_uuid`,e),r.append(`activity_id`,n.activityId),r.append(`field_id`,n.fieldId),n.instanceId!=null&&r.append(`instance_id`,String(n.instanceId)),r}uploadFile(e,t,n){return this.requestForm(`/app/${this.appId}/upload`,this.fieldForm(e,t,n))}async extractOcr(e,t,n){if(t instanceof File||t instanceof Blob){let r=new FormData;return r.append(`file`,t),r.append(`store_file`,`true`),r.append(`workflow_uuid`,e),r.append(`activity_id`,n.activityId),r.append(`field_id`,n.fieldId),n.versionUuid&&r.append(`version_uuid`,n.versionUuid),n.instanceId!=null&&r.append(`instance_id`,String(n.instanceId)),this.requestForm(`/app/${this.appId}/ocr-extract`,r)}{let r={workflow_uuid:e,activity_id:n.activityId,field_id:n.fieldId,version_uuid:n.versionUuid,files:[t]};return n.instanceId!=null&&(r.instance_id=Number(n.instanceId)),{...await this.request(`POST`,`/app/${this.appId}/ocr-extract`,r),file:t}}}async getFilePreviewBlob(e){let t={};this.token&&(t.Authorization=`Bearer ${this.token}`);let n=await fetch(`${this.baseUrl}/app/${this.appId}/view/files/${e}/preview`,{method:`GET`,headers:t});if(n.status===401)throw this.setToken(null),this.onAuthError?.(),{status:401,message:`Unauthorized`};if(!n.ok)throw{status:n.status,message:`Failed to fetch preview`};return await n.blob()}},m={imagePreviewLoading:`_imagePreviewLoading_s2a11_1`,spinner:`_spinner_s2a11_10`,"zf-spin":`_zf-spin_s2a11_1`,spinnerSm:`_spinnerSm_s2a11_19`,imagePreviewError:`_imagePreviewError_s2a11_28`,imagePreview:`_imagePreview_s2a11_1`},h=(...e)=>e.filter(Boolean).join(` `);function g({file:e,client:t,className:n=``}){let[r,i]=(0,c.useState)(null),[a,o]=(0,c.useState)(!1),[s,u]=(0,c.useState)(!1);return(0,c.useEffect)(()=>{let n=null,r=!0;async function a(){if(!e){r&&i(null);return}if(e instanceof File){n=URL.createObjectURL(e),r&&i(n);return}if(e.uuid){if(!t){console.warn(`ImagePreview: 'client' prop is missing, cannot load remote preview`),r&&u(!0);return}r&&o(!0);try{let a=await t.getFilePreviewBlob(e.uuid);n=URL.createObjectURL(a),r&&i(n)}catch(e){console.error(`Failed to load image preview:`,e),r&&u(!0)}finally{r&&o(!1)}}}return a(),()=>{r=!1,n&&URL.revokeObjectURL(n)}},[e,t]),a?(0,l.jsx)(`div`,{className:h(m.imagePreviewLoading,n),children:(0,l.jsx)(`div`,{className:h(m.spinner,m.spinnerSm)})}):s||!r?(0,l.jsx)(`div`,{className:h(m.imagePreviewError,n),children:s?`Preview failed`:`No preview`}):(0,l.jsx)(`img`,{src:r,alt:`Preview`,className:h(m.imagePreview,n)})}var _={fieldContainer:`_fieldContainer_4bday_2`,label:`_label_4bday_14`,fieldBody:`_fieldBody_4bday_21`,sizeSm:`_sizeSm_4bday_28`,dropzone:`_dropzone_4bday_28`,sizeMd:`_sizeMd_4bday_29`,sizeLg:`_sizeLg_4bday_30`,variantPrimary:`_variantPrimary_4bday_33`,dropzoneIconWrapper:`_dropzoneIconWrapper_4bday_35`,dropzoneTitle:`_dropzoneTitle_4bday_36`,browseButton:`_browseButton_4bday_37`,fileCard:`_fileCard_4bday_39`,spinner:`_spinner_4bday_40`,variantSecondary:`_variantSecondary_4bday_42`,dropzoneLoading:`_dropzoneLoading_4bday_72`,dropzoneContent:`_dropzoneContent_4bday_77`,dropzoneIcon:`_dropzoneIcon_4bday_35`,dropzoneSub:`_dropzoneSub_4bday_109`,fileList:`_fileList_4bday_135`,fileCardPreview:`_fileCardPreview_4bday_152`,documentPreview:`_documentPreview_4bday_163`,documentBadge:`_documentBadge_4bday_173`,fileCardDetails:`_fileCardDetails_4bday_185`,statusSuccess:`_statusSuccess_4bday_193`,fileNameLarge:`_fileNameLarge_4bday_203`,fileMeta:`_fileMeta_4bday_211`,fileActions:`_fileActions_4bday_217`,btnActionBlue:`_btnActionBlue_4bday_224`,btnActionRed:`_btnActionRed_4bday_243`,hidden:`_hidden_4bday_263`,errorText:`_errorText_4bday_264`,overlay:`_overlay_4bday_266`,spin:`_spin_4bday_40`,spinnerSm:`_spinnerSm_4bday_286`,extractedPanel:`_extractedPanel_4bday_296`,extractedTitle:`_extractedTitle_4bday_304`,extractedList:`_extractedList_4bday_311`,extractedItem:`_extractedItem_4bday_317`,extractedKey:`_extractedKey_4bday_329`,extractedVal:`_extractedVal_4bday_336`},v=(...e)=>e.filter(Boolean).join(` `),y=e=>{let t=e.name||e.original_name||``,n=e.type||e.mime_type||``;return t.endsWith(`.pdf`)||n.includes(`pdf`)||t.match(/\.(doc|docx|txt)$/i)?(0,l.jsx)(u.FileText,{className:_.fileIcon}):(0,l.jsx)(u.File,{className:_.fileIcon})};function b({label:e,value:t,onChange:n,onExtracted:r,onProcess:i,client:a,showExtracted:o=!0,accept:s=`image/*,application/pdf`,variant:d=`primary`,size:f=`md`,previewSize:p=`md`,width:m=`full`,className:h=``}){let[b,x]=(0,c.useState)(!1),[S,C]=(0,c.useState)(null),[w,T]=(0,c.useState)(null),E=(0,c.useRef)(null),D=Array.isArray(t)?t:t?[t]:[],O=e=>{e.file&&n(e.file),e.extract_error?C(e.extract_error):e.extracted&&(T(e.extracted),r&&r({...e.extracted}))},k=async e=>{let t=e.target.files?.[0];if(t){x(!0),C(null),T(null);try{let e=await i(t);e&&e.file&&!e.file.size&&!e.file.file_size&&(e.file.size=t.size),O(e)}catch(e){console.error(e),C(`OCR extraction failed`)}finally{x(!1),E.current&&(E.current.value=``)}}},A=async e=>{x(!0),C(null);try{let t=await i(e);t&&t.file&&!t.file.size&&!t.file.file_size&&(t.file.size=e.size||e.file_size),O(t)}catch(e){console.error(e),C(`OCR extraction retry failed`)}finally{x(!1)}},j=e=>{let t=[...D];if(t.splice(e,1),n(t.length===0?null:t),t.length===0){if(w&&r){let e={};for(let t of Object.keys(w))e[t]=``;r(e)}T(null)}},M=e=>e instanceof File?e.type.startsWith(`image/`):e.mime_type?e.mime_type.startsWith(`image/`):e.original_name?/\.(jpg|jpeg|png|gif|webp)$/i.test(e.original_name):!1,N=m===`full`?{width:`100%`}:{width:m};return(0,l.jsxs)(`div`,{className:v(_.fieldContainer,_[`variant${d.charAt(0).toUpperCase()+d.slice(1)}`],_[`size${f.charAt(0).toUpperCase()+f.slice(1)}`],_[`previewSize${p.charAt(0).toUpperCase()+p.slice(1)}`],h),style:N,children:[(0,l.jsx)(`label`,{className:_.label,children:e}),(0,l.jsxs)(`div`,{className:_.fieldBody,children:[(0,l.jsx)(`input`,{ref:E,type:`file`,onChange:k,disabled:b,accept:s,className:_.hidden}),D.length===0&&(0,l.jsx)(`div`,{className:v(_.dropzone,b&&_.dropzoneLoading),onClick:()=>E.current?.click(),children:b?(0,l.jsxs)(`div`,{className:_.dropzoneContent,children:[(0,l.jsx)(`div`,{className:v(_.spinner,_.spinnerSm,_.dropzoneIconWrapper)}),(0,l.jsx)(`p`,{className:_.dropzoneTitle,children:`Extracting OCR data...`})]}):(0,l.jsxs)(`div`,{className:_.dropzoneContent,children:[(0,l.jsx)(`div`,{className:_.dropzoneIconWrapper,children:(0,l.jsx)(u.FileUp,{className:_.dropzoneIcon})}),(0,l.jsx)(`p`,{className:_.dropzoneTitle,children:`Drop a document to extract`}),(0,l.jsx)(`p`,{className:_.dropzoneSub,children:`PNG, JPG, JPEG or PDF (Max 5MB)`}),(0,l.jsxs)(`button`,{type:`button`,className:_.browseButton,children:[(0,l.jsx)(u.Folder,{size:16}),`Browse Files`]})]})}),D.length>0&&(0,l.jsx)(`div`,{className:_.fileList,children:D.map((e,t)=>{let n=e.name||e.original_name||`Document`,r=``,i=e?.size||e?.file_size;i&&(r=i>1048576?`${(i/1048576).toFixed(1)} MB`:`${(i/1024).toFixed(1)} KB`);let o=n.split(`.`).pop()?.toUpperCase()||`FILE`;return(0,l.jsxs)(`div`,{className:_.fileCard,children:[(0,l.jsxs)(`div`,{className:_.fileCardPreview,children:[M(e)?(0,l.jsx)(g,{file:e,client:a}):(0,l.jsxs)(`div`,{className:_.documentPreview,children:[y(e),(0,l.jsx)(`span`,{className:_.documentBadge,children:`PDF`})]}),b&&(0,l.jsx)(`div`,{className:_.overlay,children:(0,l.jsx)(`div`,{className:_.spinner})})]}),(0,l.jsxs)(`div`,{className:_.fileCardDetails,children:[(0,l.jsxs)(`div`,{className:_.statusSuccess,children:[(0,l.jsx)(u.CheckCircle2,{size:16}),(0,l.jsx)(`span`,{children:`Document uploaded successfully`})]}),(0,l.jsx)(`h4`,{className:_.fileNameLarge,title:n,children:n}),(0,l.jsxs)(`p`,{className:_.fileMeta,children:[o,` • `,r]}),!b&&(0,l.jsxs)(`div`,{className:_.fileActions,children:[(0,l.jsxs)(`button`,{type:`button`,onClick:t=>{t.stopPropagation(),A(e)},className:_.btnActionBlue,children:[(0,l.jsx)(u.RefreshCw,{size:14}),` Re-extract`]}),(0,l.jsxs)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),j(t)},className:_.btnActionRed,children:[(0,l.jsx)(u.Trash2,{size:14}),` Delete`]})]})]})]},t)})}),S&&(0,l.jsxs)(`div`,{className:_.fieldBody,children:[(0,l.jsx)(`p`,{className:_.errorText,children:S}),D.length>0&&!w&&(0,l.jsx)(`button`,{type:`button`,onClick:()=>A(D[0]),disabled:b,className:_.btnActionBlue,style:{alignSelf:`flex-start`,marginTop:`0.5rem`},children:b?`Retrying...`:`Retry Extraction`})]}),o&&w&&(0,l.jsxs)(`div`,{className:_.extractedPanel,children:[(0,l.jsx)(`p`,{className:_.extractedTitle,children:`Extracted Data`}),(0,l.jsx)(`div`,{className:_.extractedList,children:Object.entries(w).map(([e,t])=>(0,l.jsxs)(`div`,{className:_.extractedItem,children:[(0,l.jsx)(`span`,{className:_.extractedKey,children:e.replace(/_/g,` `)}),(0,l.jsx)(`span`,{className:_.extractedVal,children:String(t)})]},e))})]})]})]})}exports.ImagePreview=g,exports.OcrField=b,exports.ZinoClient=p;
|
package/dist/src/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--zf-primary-color:#3b82f6;--zf-primary-hover:#2563eb;--zf-primary-bg-subtle:#3b82f605;--zf-primary-bg-hover:#3b82f614;--zf-secondary-color:#64748b;--zf-secondary-hover:#475569;--zf-secondary-bg-hover:#64748b14;--zf-danger-color:#ef4444;--zf-danger-hover:#dc2828;--zf-danger-bg:#fee2e2;--zf-danger-bg-hover:#ef444426;--zf-border-color:#e2e8f0;--zf-border-style:dashed;--zf-text-color:#0f172a;--zf-text-muted:#64748b;--zf-text-inverse:#fff;--zf-surface-bg:#fff;--zf-surface-subtle:#f1f5f9;--zf-surface-overlay:#ffffffb3;--zf-font-family:inherit;--zf-font-size-xs:.75rem;--zf-font-size-sm:.875rem;--zf-font-size-md:1rem;--zf-font-size-lg:1.125rem;--zf-font-weight-normal:400;--zf-font-weight-medium:500;--zf-font-weight-semibold:600;--zf-font-weight-bold:700;--zf-spacing-1:.25rem;--zf-spacing-1-5:.375rem;--zf-spacing-2:.5rem;--zf-spacing-3:.75rem;--zf-spacing-4:1rem;--zf-spacing-5:1.25rem;--zf-spacing-6:1.5rem;--zf-spacing-8:2rem;--zf-spacing-16:4rem;--zf-radius-sm:.25rem;--zf-radius-md:.375rem;--zf-radius:.5rem;--zf-radius-lg:.5rem;--zf-radius-full:9999px;--zf-shadow-sm:0 1px 2px 0 #0000000d;--zf-shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--zf-shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--zf-screen-sm:640px;--zf-screen-md:768px;--zf-screen-lg:1024px;--zf-screen-xl:1280px;--zf-z-base:1;--zf-z-overlay:10;--zf-z-modal:50;--zf-z-max:9999}.
|
|
1
|
+
:root{--zf-primary-color:#3b82f6;--zf-primary-hover:#2563eb;--zf-primary-bg-subtle:#3b82f605;--zf-primary-bg-hover:#3b82f614;--zf-secondary-color:#64748b;--zf-secondary-hover:#475569;--zf-secondary-bg-hover:#64748b14;--zf-danger-color:#ef4444;--zf-danger-hover:#dc2828;--zf-danger-bg:#fee2e2;--zf-danger-bg-hover:#ef444426;--zf-border-color:#e2e8f0;--zf-border-style:dashed;--zf-text-color:#0f172a;--zf-text-muted:#64748b;--zf-text-inverse:#fff;--zf-surface-bg:#fff;--zf-surface-subtle:#f1f5f9;--zf-surface-overlay:#ffffffb3;--zf-font-family:inherit;--zf-font-size-xs:.75rem;--zf-font-size-sm:.875rem;--zf-font-size-md:1rem;--zf-font-size-lg:1.125rem;--zf-font-weight-normal:400;--zf-font-weight-medium:500;--zf-font-weight-semibold:600;--zf-font-weight-bold:700;--zf-spacing-1:.25rem;--zf-spacing-1-5:.375rem;--zf-spacing-2:.5rem;--zf-spacing-3:.75rem;--zf-spacing-4:1rem;--zf-spacing-5:1.25rem;--zf-spacing-6:1.5rem;--zf-spacing-8:2rem;--zf-spacing-16:4rem;--zf-radius-sm:.25rem;--zf-radius-md:.375rem;--zf-radius:.5rem;--zf-radius-lg:.5rem;--zf-radius-full:9999px;--zf-shadow-sm:0 1px 2px 0 #0000000d;--zf-shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--zf-shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--zf-screen-sm:640px;--zf-screen-md:768px;--zf-screen-lg:1024px;--zf-screen-xl:1280px;--zf-z-base:1;--zf-z-overlay:10;--zf-z-modal:50;--zf-z-max:9999}._imagePreviewLoading_s2a11_1{background-color:var(--zf-surface-subtle);justify-content:center;align-items:center;width:100%;height:100%;display:flex}._spinner_s2a11_10{width:var(--zf-spacing-8);height:var(--zf-spacing-8);border:2px solid var(--zf-primary-color);border-radius:var(--zf-radius-full);border-top-color:#0000;animation:1s linear infinite _zf-spin_s2a11_1}._spinnerSm_s2a11_19{width:var(--zf-spacing-6);height:var(--zf-spacing-6)}@keyframes _zf-spin_s2a11_1{to{transform:rotate(360deg)}}._imagePreviewError_s2a11_28{background-color:var(--zf-danger-bg);color:var(--zf-danger-color);font-size:var(--zf-font-size-xs);text-align:center;padding:var(--zf-spacing-2);justify-content:center;align-items:center;width:100%;height:100%;display:flex}._imagePreview_s2a11_1{object-fit:cover;width:100%;height:100%}._fieldContainer_4bday_2{gap:var(--zf-spacing-2);font-family:var(--zf-font-family);box-sizing:border-box;flex-direction:column;display:flex}._fieldContainer_4bday_2 *{box-sizing:border-box}._label_4bday_14{color:#111827;margin-bottom:.5rem;font-size:1rem;font-weight:600}._fieldBody_4bday_21{gap:var(--zf-spacing-3);flex-direction:column;display:flex}._sizeSm_4bday_28 ._dropzone_4bday_28{padding:var(--zf-spacing-4);min-height:auto}._sizeMd_4bday_29 ._dropzone_4bday_28{padding:var(--zf-spacing-8) var(--zf-spacing-6)}._sizeLg_4bday_30 ._dropzone_4bday_28{padding:2.5rem 1.5rem}._variantPrimary_4bday_33 ._dropzone_4bday_28{border-color:var(--zf-primary-color,#3b82f6);background-color:var(--zf-primary-bg-subtle,#f8fafc)}._variantPrimary_4bday_33 ._dropzone_4bday_28:hover{background-color:var(--zf-primary-bg-hover,#f1f5f9);border-color:var(--zf-primary-hover,#2563eb)}._variantPrimary_4bday_33 ._dropzoneIconWrapper_4bday_35{background-color:var(--zf-primary-bg-subtle,#eff6ff);color:var(--zf-primary-color,#3b82f6)}._variantPrimary_4bday_33 ._dropzoneTitle_4bday_36{color:var(--zf-primary-color,#3b82f6)}._variantPrimary_4bday_33 ._browseButton_4bday_37{border-color:var(--zf-primary-color,#3b82f6);color:var(--zf-primary-color,#3b82f6)}._variantPrimary_4bday_33 ._browseButton_4bday_37:hover{background-color:var(--zf-primary-bg-subtle,#eff6ff)}._variantPrimary_4bday_33 ._fileCard_4bday_39{border-color:var(--zf-primary-color,#3b82f6);background-color:var(--zf-primary-bg-subtle,#f8fafc)}._variantPrimary_4bday_33 ._spinner_4bday_40{border-color:var(--zf-primary-color,#3b82f6);border-top-color:#0000}._variantSecondary_4bday_42 ._dropzone_4bday_28{border-color:var(--zf-secondary-color,#64748b);background-color:var(--zf-surface-subtle,#f8fafc)}._variantSecondary_4bday_42 ._dropzone_4bday_28:hover{background-color:var(--zf-secondary-bg-hover,#f1f5f9);border-color:var(--zf-text-color,#334155)}._variantSecondary_4bday_42 ._dropzoneIconWrapper_4bday_35{background-color:var(--zf-surface-subtle,#f1f5f9);color:var(--zf-secondary-color,#64748b)}._variantSecondary_4bday_42 ._dropzoneTitle_4bday_36{color:var(--zf-secondary-color,#64748b)}._variantSecondary_4bday_42 ._browseButton_4bday_37{border-color:var(--zf-secondary-color,#64748b);color:var(--zf-secondary-color,#64748b)}._variantSecondary_4bday_42 ._browseButton_4bday_37:hover{background-color:var(--zf-surface-subtle,#f1f5f9)}._variantSecondary_4bday_42 ._fileCard_4bday_39{border-color:var(--zf-secondary-color,#64748b);background-color:var(--zf-surface-subtle,#f8fafc)}._variantSecondary_4bday_42 ._spinner_4bday_40{border-color:var(--zf-secondary-color,#64748b);border-top-color:#0000}._dropzone_4bday_28{border-width:2px;border-style:var(--zf-border-style,dashed);border-radius:var(--zf-radius,12px);text-align:center;cursor:pointer;background-color:#f8fafc;border-color:#3b82f6;flex-direction:column;justify-content:center;align-items:center;padding:2.5rem 1.5rem;transition:all .2s;display:flex}._dropzone_4bday_28:hover{background-color:#f1f5f9}._dropzoneLoading_4bday_72{opacity:.5;pointer-events:none}._dropzoneContent_4bday_77{flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex}._dropzoneIconWrapper_4bday_35{color:#3b82f6;background-color:#eff6ff;border-radius:50%;justify-content:center;align-items:center;width:3.5rem;height:3.5rem;margin-bottom:.5rem;display:flex}._dropzoneIcon_4bday_35{width:1.75rem;height:1.75rem}._dropzoneTitle_4bday_36{color:#3b82f6;margin:0;font-size:1rem;font-weight:600}._dropzoneSub_4bday_109{color:#6b7280;margin:0 0 1rem;font-size:.875rem}._browseButton_4bday_37{color:#3b82f6;cursor:pointer;background-color:#0000;border:1px solid #3b82f6;border-radius:6px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;transition:all .2s;display:inline-flex}._browseButton_4bday_37:hover{background-color:#eff6ff}._fileList_4bday_135{flex-direction:column;gap:1rem;display:flex}._fileCard_4bday_39{border-radius:var(--zf-radius,12px);background-color:#fff;border:1px solid #e5e7eb;flex-direction:row;gap:1.5rem;padding:1rem;display:flex;box-shadow:0 1px 3px #0000000d}._fileCardPreview_4bday_152{background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;flex-shrink:0;width:240px;height:150px;position:relative;overflow:hidden}._documentPreview_4bday_163{color:#9ca3af;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex}._documentBadge_4bday_173{color:#fff;background-color:#374151;border-radius:4px;padding:2px 6px;font-size:.65rem;font-weight:700;position:absolute;bottom:8px;left:8px}._fileCardDetails_4bday_185{flex-direction:column;flex-grow:1;justify-content:flex-start;padding:.25rem 0;display:flex}._statusSuccess_4bday_193{color:#10b981;align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.875rem;font-weight:500;display:flex}._fileNameLarge_4bday_203{color:#111827;word-break:break-all;margin:0 0 .5rem;font-size:1.25rem;font-weight:700}._fileMeta_4bday_211{color:#6b7280;margin:0;font-size:.875rem}._fileActions_4bday_217{justify-content:flex-end;gap:1rem;margin-top:auto;display:flex}._btnActionBlue_4bday_224{color:#3b82f6;cursor:pointer;background-color:#0000;border:1px solid #3b82f6;border-radius:6px;align-items:center;gap:.375rem;padding:.375rem .875rem;font-size:.875rem;font-weight:500;transition:all .2s;display:inline-flex}._btnActionBlue_4bday_224:hover{background-color:#eff6ff}._btnActionRed_4bday_243{color:#ef4444;cursor:pointer;background-color:#0000;border:1px solid #ef4444;border-radius:6px;align-items:center;gap:.375rem;padding:.375rem .875rem;font-size:.875rem;font-weight:500;transition:all .2s;display:inline-flex}._btnActionRed_4bday_243:hover{background-color:#fef2f2}._hidden_4bday_263{display:none}._errorText_4bday_264{color:#ef4444;margin:0;font-size:.875rem;font-weight:500}._overlay_4bday_266{z-index:10;background-color:#ffffffb3;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._spinner_4bday_40{border:2px solid #3b82f6;border-top-color:#0000;border-radius:50%;width:2rem;height:2rem;animation:1s linear infinite _spin_4bday_40}._spinnerSm_4bday_286{width:1.5rem;height:1.5rem}@keyframes _spin_4bday_40{to{transform:rotate(360deg)}}._extractedPanel_4bday_296{border-radius:var(--zf-radius,8px);background-color:#f9fafb;border:1px solid #e5e7eb;margin-top:1rem;padding:1rem}._extractedTitle_4bday_304{color:#111827;margin:0 0 .5rem;font-size:.875rem;font-weight:600}._extractedList_4bday_311{grid-template-columns:1fr;gap:.5rem;display:grid}._extractedItem_4bday_317{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:.25rem 0;display:flex}._extractedItem_4bday_317:last-child{border-bottom:none}._extractedKey_4bday_329{color:#6b7280;text-transform:uppercase;font-size:.75rem;font-weight:600}._extractedVal_4bday_336{color:#111827;text-align:right;word-break:break-all;max-width:60%;font-size:.875rem;font-weight:500}
|
|
2
2
|
/*$vite$:1*/
|
package/dist/src/index.js
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { useEffect as e, useRef as t, useState as n } from "react";
|
|
2
|
-
import {
|
|
3
|
-
import { File as o, FileText as s, FileUp as c,
|
|
2
|
+
import { jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
3
|
+
import { CheckCircle2 as a, File as o, FileText as s, FileUp as c, Folder as l, RefreshCw as u, Trash2 as d } from "lucide-react";
|
|
4
4
|
//#region src/ZinoClient.js
|
|
5
|
-
var
|
|
5
|
+
var f = "field_library_token", p = "field_library_user", m = class {
|
|
6
6
|
constructor({ baseUrl: e, appId: t, onAuthError: n }) {
|
|
7
7
|
if (!e) throw Error("baseUrl is required");
|
|
8
8
|
if (!t) throw Error("appId is required");
|
|
9
9
|
if (this.baseUrl = e.replace(/\/+$/, ""), this.appId = t, this.onAuthError = n, this.token = null, this.user = null, typeof window < "u") {
|
|
10
|
-
this.token = localStorage.getItem(
|
|
10
|
+
this.token = localStorage.getItem(f);
|
|
11
11
|
try {
|
|
12
|
-
let e = localStorage.getItem(
|
|
12
|
+
let e = localStorage.getItem(p);
|
|
13
13
|
e && (this.user = JSON.parse(e));
|
|
14
14
|
} catch {
|
|
15
15
|
this.user = null;
|
|
@@ -20,7 +20,7 @@ var u = "field_library_token", d = "field_library_user", f = class {
|
|
|
20
20
|
this.onAuthError = e;
|
|
21
21
|
}
|
|
22
22
|
setToken(e) {
|
|
23
|
-
this.token = e, !(typeof window > "u") && (e ? localStorage.setItem(
|
|
23
|
+
this.token = e, !(typeof window > "u") && (e ? localStorage.setItem(f, e) : (localStorage.removeItem(f), localStorage.removeItem(p), this.user = null));
|
|
24
24
|
}
|
|
25
25
|
getToken() {
|
|
26
26
|
return this.token;
|
|
@@ -70,7 +70,7 @@ var u = "field_library_token", d = "field_library_user", f = class {
|
|
|
70
70
|
password: t,
|
|
71
71
|
...n ? { org_id: Number(n) } : {}
|
|
72
72
|
});
|
|
73
|
-
return this.setToken(r.token), typeof window < "u" && r.user && (this.user = r.user, localStorage.setItem(
|
|
73
|
+
return this.setToken(r.token), typeof window < "u" && r.user && (this.user = r.user, localStorage.setItem(p, JSON.stringify(r.user))), r;
|
|
74
74
|
}
|
|
75
75
|
logout() {
|
|
76
76
|
this.setToken(null);
|
|
@@ -80,7 +80,7 @@ var u = "field_library_token", d = "field_library_user", f = class {
|
|
|
80
80
|
return this.user && (this.user = {
|
|
81
81
|
...this.user,
|
|
82
82
|
...e
|
|
83
|
-
}, typeof window < "u" && localStorage.setItem(
|
|
83
|
+
}, typeof window < "u" && localStorage.setItem(p, JSON.stringify(this.user))), e;
|
|
84
84
|
}
|
|
85
85
|
currentUser() {
|
|
86
86
|
if (!this.token) return null;
|
|
@@ -241,19 +241,19 @@ var u = "field_library_token", d = "field_library_user", f = class {
|
|
|
241
241
|
};
|
|
242
242
|
return await n.blob();
|
|
243
243
|
}
|
|
244
|
-
},
|
|
245
|
-
imagePreviewLoading: "
|
|
246
|
-
spinner: "
|
|
247
|
-
"zf-spin": "_zf-
|
|
248
|
-
spinnerSm: "
|
|
249
|
-
imagePreviewError: "
|
|
250
|
-
imagePreview: "
|
|
251
|
-
},
|
|
252
|
-
function
|
|
244
|
+
}, h = {
|
|
245
|
+
imagePreviewLoading: "_imagePreviewLoading_s2a11_1",
|
|
246
|
+
spinner: "_spinner_s2a11_10",
|
|
247
|
+
"zf-spin": "_zf-spin_s2a11_1",
|
|
248
|
+
spinnerSm: "_spinnerSm_s2a11_19",
|
|
249
|
+
imagePreviewError: "_imagePreviewError_s2a11_28",
|
|
250
|
+
imagePreview: "_imagePreview_s2a11_1"
|
|
251
|
+
}, g = (...e) => e.filter(Boolean).join(" ");
|
|
252
|
+
function _({ file: t, client: i, className: a = "" }) {
|
|
253
253
|
let [o, s] = n(null), [c, l] = n(!1), [u, d] = n(!1);
|
|
254
254
|
return e(() => {
|
|
255
255
|
let e = null, n = !0;
|
|
256
|
-
async function
|
|
256
|
+
async function r() {
|
|
257
257
|
if (!t) {
|
|
258
258
|
n && s(null);
|
|
259
259
|
return;
|
|
@@ -263,14 +263,14 @@ function h({ file: t, client: r, className: a = "" }) {
|
|
|
263
263
|
return;
|
|
264
264
|
}
|
|
265
265
|
if (t.uuid) {
|
|
266
|
-
if (!
|
|
266
|
+
if (!i) {
|
|
267
267
|
console.warn("ImagePreview: 'client' prop is missing, cannot load remote preview"), n && d(!0);
|
|
268
268
|
return;
|
|
269
269
|
}
|
|
270
270
|
n && l(!0);
|
|
271
271
|
try {
|
|
272
|
-
let
|
|
273
|
-
e = URL.createObjectURL(
|
|
272
|
+
let r = await i.getFilePreviewBlob(t.uuid);
|
|
273
|
+
e = URL.createObjectURL(r), n && s(e);
|
|
274
274
|
} catch (e) {
|
|
275
275
|
console.error("Failed to load image preview:", e), n && d(!0);
|
|
276
276
|
} finally {
|
|
@@ -278,233 +278,249 @@ function h({ file: t, client: r, className: a = "" }) {
|
|
|
278
278
|
}
|
|
279
279
|
}
|
|
280
280
|
}
|
|
281
|
-
return
|
|
281
|
+
return r(), () => {
|
|
282
282
|
n = !1, e && URL.revokeObjectURL(e);
|
|
283
283
|
};
|
|
284
|
-
}, [t,
|
|
285
|
-
className:
|
|
286
|
-
children: /* @__PURE__ */
|
|
287
|
-
}) : u || !o ? /* @__PURE__ */
|
|
288
|
-
className:
|
|
284
|
+
}, [t, i]), c ? /* @__PURE__ */ r("div", {
|
|
285
|
+
className: g(h.imagePreviewLoading, a),
|
|
286
|
+
children: /* @__PURE__ */ r("div", { className: g(h.spinner, h.spinnerSm) })
|
|
287
|
+
}) : u || !o ? /* @__PURE__ */ r("div", {
|
|
288
|
+
className: g(h.imagePreviewError, a),
|
|
289
289
|
children: u ? "Preview failed" : "No preview"
|
|
290
|
-
}) : /* @__PURE__ */
|
|
290
|
+
}) : /* @__PURE__ */ r("img", {
|
|
291
291
|
src: o,
|
|
292
292
|
alt: "Preview",
|
|
293
|
-
className:
|
|
293
|
+
className: g(h.imagePreview, a)
|
|
294
294
|
});
|
|
295
295
|
}
|
|
296
|
-
var
|
|
297
|
-
fieldContainer: "
|
|
298
|
-
label: "
|
|
299
|
-
fieldBody: "
|
|
300
|
-
sizeSm: "
|
|
301
|
-
dropzone: "
|
|
302
|
-
sizeMd: "
|
|
303
|
-
sizeLg: "
|
|
304
|
-
variantPrimary: "
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
296
|
+
var v = {
|
|
297
|
+
fieldContainer: "_fieldContainer_4bday_2",
|
|
298
|
+
label: "_label_4bday_14",
|
|
299
|
+
fieldBody: "_fieldBody_4bday_21",
|
|
300
|
+
sizeSm: "_sizeSm_4bday_28",
|
|
301
|
+
dropzone: "_dropzone_4bday_28",
|
|
302
|
+
sizeMd: "_sizeMd_4bday_29",
|
|
303
|
+
sizeLg: "_sizeLg_4bday_30",
|
|
304
|
+
variantPrimary: "_variantPrimary_4bday_33",
|
|
305
|
+
dropzoneIconWrapper: "_dropzoneIconWrapper_4bday_35",
|
|
306
|
+
dropzoneTitle: "_dropzoneTitle_4bday_36",
|
|
307
|
+
browseButton: "_browseButton_4bday_37",
|
|
308
|
+
fileCard: "_fileCard_4bday_39",
|
|
309
|
+
spinner: "_spinner_4bday_40",
|
|
310
|
+
variantSecondary: "_variantSecondary_4bday_42",
|
|
311
|
+
dropzoneLoading: "_dropzoneLoading_4bday_72",
|
|
312
|
+
dropzoneContent: "_dropzoneContent_4bday_77",
|
|
313
|
+
dropzoneIcon: "_dropzoneIcon_4bday_35",
|
|
314
|
+
dropzoneSub: "_dropzoneSub_4bday_109",
|
|
315
|
+
fileList: "_fileList_4bday_135",
|
|
316
|
+
fileCardPreview: "_fileCardPreview_4bday_152",
|
|
317
|
+
documentPreview: "_documentPreview_4bday_163",
|
|
318
|
+
documentBadge: "_documentBadge_4bday_173",
|
|
319
|
+
fileCardDetails: "_fileCardDetails_4bday_185",
|
|
320
|
+
statusSuccess: "_statusSuccess_4bday_193",
|
|
321
|
+
fileNameLarge: "_fileNameLarge_4bday_203",
|
|
322
|
+
fileMeta: "_fileMeta_4bday_211",
|
|
323
|
+
fileActions: "_fileActions_4bday_217",
|
|
324
|
+
btnActionBlue: "_btnActionBlue_4bday_224",
|
|
325
|
+
btnActionRed: "_btnActionRed_4bday_243",
|
|
326
|
+
hidden: "_hidden_4bday_263",
|
|
327
|
+
errorText: "_errorText_4bday_264",
|
|
328
|
+
overlay: "_overlay_4bday_266",
|
|
329
|
+
spin: "_spin_4bday_40",
|
|
330
|
+
spinnerSm: "_spinnerSm_4bday_286",
|
|
331
|
+
extractedPanel: "_extractedPanel_4bday_296",
|
|
332
|
+
extractedTitle: "_extractedTitle_4bday_304",
|
|
333
|
+
extractedList: "_extractedList_4bday_311",
|
|
334
|
+
extractedItem: "_extractedItem_4bday_317",
|
|
335
|
+
extractedKey: "_extractedKey_4bday_329",
|
|
336
|
+
extractedVal: "_extractedVal_4bday_336"
|
|
337
|
+
}, y = (...e) => e.filter(Boolean).join(" "), b = (e) => {
|
|
334
338
|
let t = e.name || e.original_name || "", n = e.type || e.mime_type || "";
|
|
335
|
-
return t.endsWith(".pdf") || n.includes("pdf") || t.match(/\.(doc|docx|txt)$/i) ? /* @__PURE__ */
|
|
339
|
+
return t.endsWith(".pdf") || n.includes("pdf") || t.match(/\.(doc|docx|txt)$/i) ? /* @__PURE__ */ r(s, { className: v.fileIcon }) : /* @__PURE__ */ r(o, { className: v.fileIcon });
|
|
336
340
|
};
|
|
337
|
-
function
|
|
338
|
-
let [
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
A(e.extracted);
|
|
342
|
-
let t = { ...e.extracted };
|
|
343
|
-
if (f) {
|
|
344
|
-
if (t = {}, Array.isArray(f)) for (let [n, r] of Object.entries(e.extracted)) {
|
|
345
|
-
let e = f.find((e) => e.source === n || e.extractKey === n), i = e ? e.target || e.fieldId : n;
|
|
346
|
-
t[i] = r;
|
|
347
|
-
}
|
|
348
|
-
else for (let [n, r] of Object.entries(e.extracted)) {
|
|
349
|
-
let e = f[n] || n;
|
|
350
|
-
t[e] = r;
|
|
351
|
-
}
|
|
352
|
-
}
|
|
353
|
-
u && u(t);
|
|
354
|
-
}
|
|
355
|
-
}, P = async (e) => {
|
|
341
|
+
function x({ label: e, value: o, onChange: s, onExtracted: f, onProcess: p, client: m, showExtracted: h = !0, accept: g = "image/*,application/pdf", variant: x = "primary", size: S = "md", previewSize: C = "md", width: w = "full", className: T = "" }) {
|
|
342
|
+
let [E, D] = n(!1), [O, k] = n(null), [A, j] = n(null), M = t(null), N = Array.isArray(o) ? o : o ? [o] : [], P = (e) => {
|
|
343
|
+
e.file && s(e.file), e.extract_error ? k(e.extract_error) : e.extracted && (j(e.extracted), f && f({ ...e.extracted }));
|
|
344
|
+
}, F = async (e) => {
|
|
356
345
|
let t = e.target.files?.[0];
|
|
357
346
|
if (t) {
|
|
358
|
-
|
|
347
|
+
D(!0), k(null), j(null);
|
|
359
348
|
try {
|
|
360
|
-
let e = await
|
|
361
|
-
|
|
349
|
+
let e = await p(t);
|
|
350
|
+
e && e.file && !e.file.size && !e.file.file_size && (e.file.size = t.size), P(e);
|
|
362
351
|
} catch (e) {
|
|
363
|
-
console.error(e),
|
|
352
|
+
console.error(e), k("OCR extraction failed");
|
|
364
353
|
} finally {
|
|
365
|
-
|
|
354
|
+
D(!1), M.current && (M.current.value = "");
|
|
366
355
|
}
|
|
367
356
|
}
|
|
368
|
-
},
|
|
369
|
-
|
|
357
|
+
}, I = async (e) => {
|
|
358
|
+
D(!0), k(null);
|
|
370
359
|
try {
|
|
371
|
-
let t = await
|
|
372
|
-
|
|
360
|
+
let t = await p(e);
|
|
361
|
+
t && t.file && !t.file.size && !t.file.file_size && (t.file.size = e.size || e.file_size), P(t);
|
|
373
362
|
} catch (e) {
|
|
374
|
-
console.error(e),
|
|
363
|
+
console.error(e), k("OCR extraction retry failed");
|
|
375
364
|
} finally {
|
|
376
|
-
|
|
365
|
+
D(!1);
|
|
377
366
|
}
|
|
378
|
-
},
|
|
379
|
-
let t = [...
|
|
367
|
+
}, L = (e) => {
|
|
368
|
+
let t = [...N];
|
|
380
369
|
if (t.splice(e, 1), s(t.length === 0 ? null : t), t.length === 0) {
|
|
381
|
-
if (
|
|
370
|
+
if (A && f) {
|
|
382
371
|
let e = {};
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
let n = f.find((e) => e.source === t || e.extractKey === t), r = n ? n.target || n.fieldId : t;
|
|
386
|
-
e[r] = "";
|
|
387
|
-
}
|
|
388
|
-
else for (let t of Object.keys(k)) {
|
|
389
|
-
let n = f[t] || t;
|
|
390
|
-
e[n] = "";
|
|
391
|
-
}
|
|
392
|
-
} else for (let t of Object.keys(k)) e[t] = "";
|
|
393
|
-
u(e);
|
|
372
|
+
for (let t of Object.keys(A)) e[t] = "";
|
|
373
|
+
f(e);
|
|
394
374
|
}
|
|
395
|
-
|
|
375
|
+
j(null);
|
|
396
376
|
}
|
|
397
|
-
},
|
|
398
|
-
return /* @__PURE__ */
|
|
399
|
-
className:
|
|
400
|
-
style:
|
|
401
|
-
children: [/* @__PURE__ */
|
|
402
|
-
className:
|
|
403
|
-
children:
|
|
404
|
-
}), /* @__PURE__ */
|
|
405
|
-
className:
|
|
377
|
+
}, R = (e) => e instanceof File ? e.type.startsWith("image/") : e.mime_type ? e.mime_type.startsWith("image/") : e.original_name ? /\.(jpg|jpeg|png|gif|webp)$/i.test(e.original_name) : !1, z = w === "full" ? { width: "100%" } : { width: w };
|
|
378
|
+
return /* @__PURE__ */ i("div", {
|
|
379
|
+
className: y(v.fieldContainer, v[`variant${x.charAt(0).toUpperCase() + x.slice(1)}`], v[`size${S.charAt(0).toUpperCase() + S.slice(1)}`], v[`previewSize${C.charAt(0).toUpperCase() + C.slice(1)}`], T),
|
|
380
|
+
style: z,
|
|
381
|
+
children: [/* @__PURE__ */ r("label", {
|
|
382
|
+
className: v.label,
|
|
383
|
+
children: e
|
|
384
|
+
}), /* @__PURE__ */ i("div", {
|
|
385
|
+
className: v.fieldBody,
|
|
406
386
|
children: [
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
disabled: T,
|
|
415
|
-
accept: y,
|
|
416
|
-
className: g.hidden
|
|
417
|
-
}), T ? /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("div", { className: _(g.spinner, g.spinnerSm, g.dropzoneIcon) }), /* @__PURE__ */ i("p", {
|
|
418
|
-
className: g.dropzoneText,
|
|
419
|
-
children: "Extracting OCR data..."
|
|
420
|
-
})] }) : /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i(c, { className: g.dropzoneIcon }), /* @__PURE__ */ i("p", {
|
|
421
|
-
className: g.dropzoneText,
|
|
422
|
-
children: "Drop a document to extract"
|
|
423
|
-
})] })]
|
|
387
|
+
/* @__PURE__ */ r("input", {
|
|
388
|
+
ref: M,
|
|
389
|
+
type: "file",
|
|
390
|
+
onChange: F,
|
|
391
|
+
disabled: E,
|
|
392
|
+
accept: g,
|
|
393
|
+
className: v.hidden
|
|
424
394
|
}),
|
|
425
|
-
|
|
426
|
-
className:
|
|
427
|
-
|
|
428
|
-
|
|
395
|
+
N.length === 0 && /* @__PURE__ */ r("div", {
|
|
396
|
+
className: y(v.dropzone, E && v.dropzoneLoading),
|
|
397
|
+
onClick: () => M.current?.click(),
|
|
398
|
+
children: E ? /* @__PURE__ */ i("div", {
|
|
399
|
+
className: v.dropzoneContent,
|
|
400
|
+
children: [/* @__PURE__ */ r("div", { className: y(v.spinner, v.spinnerSm, v.dropzoneIconWrapper) }), /* @__PURE__ */ r("p", {
|
|
401
|
+
className: v.dropzoneTitle,
|
|
402
|
+
children: "Extracting OCR data..."
|
|
403
|
+
})]
|
|
404
|
+
}) : /* @__PURE__ */ i("div", {
|
|
405
|
+
className: v.dropzoneContent,
|
|
429
406
|
children: [
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
}) : /* @__PURE__ */ a("div", {
|
|
434
|
-
className: g.documentPreview,
|
|
435
|
-
children: [v(e), /* @__PURE__ */ i("span", {
|
|
436
|
-
className: g.documentName,
|
|
437
|
-
title: e.name || e.original_name,
|
|
438
|
-
children: e.name || e.original_name || "Document"
|
|
439
|
-
})]
|
|
407
|
+
/* @__PURE__ */ r("div", {
|
|
408
|
+
className: v.dropzoneIconWrapper,
|
|
409
|
+
children: /* @__PURE__ */ r(c, { className: v.dropzoneIcon })
|
|
440
410
|
}),
|
|
441
|
-
|
|
442
|
-
className:
|
|
443
|
-
children:
|
|
411
|
+
/* @__PURE__ */ r("p", {
|
|
412
|
+
className: v.dropzoneTitle,
|
|
413
|
+
children: "Drop a document to extract"
|
|
444
414
|
}),
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
children: /* @__PURE__ */ a("svg", {
|
|
451
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
452
|
-
width: "12",
|
|
453
|
-
height: "12",
|
|
454
|
-
viewBox: "0 0 24 24",
|
|
455
|
-
fill: "none",
|
|
456
|
-
stroke: "currentColor",
|
|
457
|
-
strokeWidth: "2",
|
|
458
|
-
strokeLinecap: "round",
|
|
459
|
-
strokeLinejoin: "round",
|
|
460
|
-
children: [
|
|
461
|
-
/* @__PURE__ */ i("path", { d: "M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
|
|
462
|
-
/* @__PURE__ */ i("path", { d: "M3 3v5h5" }),
|
|
463
|
-
/* @__PURE__ */ i("path", { d: "M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16" }),
|
|
464
|
-
/* @__PURE__ */ i("path", { d: "M16 21v-5h5" })
|
|
465
|
-
]
|
|
466
|
-
})
|
|
467
|
-
}), /* @__PURE__ */ i("button", {
|
|
415
|
+
/* @__PURE__ */ r("p", {
|
|
416
|
+
className: v.dropzoneSub,
|
|
417
|
+
children: "PNG, JPG, JPEG or PDF (Max 5MB)"
|
|
418
|
+
}),
|
|
419
|
+
/* @__PURE__ */ i("button", {
|
|
468
420
|
type: "button",
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
children: /* @__PURE__ */ i(l, {
|
|
473
|
-
size: 12,
|
|
474
|
-
strokeWidth: 3
|
|
475
|
-
})
|
|
476
|
-
})] })
|
|
421
|
+
className: v.browseButton,
|
|
422
|
+
children: [/* @__PURE__ */ r(l, { size: 16 }), "Browse Files"]
|
|
423
|
+
})
|
|
477
424
|
]
|
|
478
|
-
}
|
|
425
|
+
})
|
|
426
|
+
}),
|
|
427
|
+
N.length > 0 && /* @__PURE__ */ r("div", {
|
|
428
|
+
className: v.fileList,
|
|
429
|
+
children: N.map((e, t) => {
|
|
430
|
+
let n = e.name || e.original_name || "Document", o = "", s = e?.size || e?.file_size;
|
|
431
|
+
s && (o = s > 1048576 ? `${(s / 1048576).toFixed(1)} MB` : `${(s / 1024).toFixed(1)} KB`);
|
|
432
|
+
let c = n.split(".").pop()?.toUpperCase() || "FILE";
|
|
433
|
+
return /* @__PURE__ */ i("div", {
|
|
434
|
+
className: v.fileCard,
|
|
435
|
+
children: [/* @__PURE__ */ i("div", {
|
|
436
|
+
className: v.fileCardPreview,
|
|
437
|
+
children: [R(e) ? /* @__PURE__ */ r(_, {
|
|
438
|
+
file: e,
|
|
439
|
+
client: m
|
|
440
|
+
}) : /* @__PURE__ */ i("div", {
|
|
441
|
+
className: v.documentPreview,
|
|
442
|
+
children: [b(e), /* @__PURE__ */ r("span", {
|
|
443
|
+
className: v.documentBadge,
|
|
444
|
+
children: "PDF"
|
|
445
|
+
})]
|
|
446
|
+
}), E && /* @__PURE__ */ r("div", {
|
|
447
|
+
className: v.overlay,
|
|
448
|
+
children: /* @__PURE__ */ r("div", { className: v.spinner })
|
|
449
|
+
})]
|
|
450
|
+
}), /* @__PURE__ */ i("div", {
|
|
451
|
+
className: v.fileCardDetails,
|
|
452
|
+
children: [
|
|
453
|
+
/* @__PURE__ */ i("div", {
|
|
454
|
+
className: v.statusSuccess,
|
|
455
|
+
children: [/* @__PURE__ */ r(a, { size: 16 }), /* @__PURE__ */ r("span", { children: "Document uploaded successfully" })]
|
|
456
|
+
}),
|
|
457
|
+
/* @__PURE__ */ r("h4", {
|
|
458
|
+
className: v.fileNameLarge,
|
|
459
|
+
title: n,
|
|
460
|
+
children: n
|
|
461
|
+
}),
|
|
462
|
+
/* @__PURE__ */ i("p", {
|
|
463
|
+
className: v.fileMeta,
|
|
464
|
+
children: [
|
|
465
|
+
c,
|
|
466
|
+
" • ",
|
|
467
|
+
o
|
|
468
|
+
]
|
|
469
|
+
}),
|
|
470
|
+
!E && /* @__PURE__ */ i("div", {
|
|
471
|
+
className: v.fileActions,
|
|
472
|
+
children: [/* @__PURE__ */ i("button", {
|
|
473
|
+
type: "button",
|
|
474
|
+
onClick: (t) => {
|
|
475
|
+
t.stopPropagation(), I(e);
|
|
476
|
+
},
|
|
477
|
+
className: v.btnActionBlue,
|
|
478
|
+
children: [/* @__PURE__ */ r(u, { size: 14 }), " Re-extract"]
|
|
479
|
+
}), /* @__PURE__ */ i("button", {
|
|
480
|
+
type: "button",
|
|
481
|
+
onClick: (e) => {
|
|
482
|
+
e.stopPropagation(), L(t);
|
|
483
|
+
},
|
|
484
|
+
className: v.btnActionRed,
|
|
485
|
+
children: [/* @__PURE__ */ r(d, { size: 14 }), " Delete"]
|
|
486
|
+
})]
|
|
487
|
+
})
|
|
488
|
+
]
|
|
489
|
+
})]
|
|
490
|
+
}, t);
|
|
491
|
+
})
|
|
479
492
|
}),
|
|
480
|
-
|
|
481
|
-
className:
|
|
482
|
-
children: [/* @__PURE__ */
|
|
483
|
-
className:
|
|
484
|
-
children:
|
|
485
|
-
}),
|
|
493
|
+
O && /* @__PURE__ */ i("div", {
|
|
494
|
+
className: v.fieldBody,
|
|
495
|
+
children: [/* @__PURE__ */ r("p", {
|
|
496
|
+
className: v.errorText,
|
|
497
|
+
children: O
|
|
498
|
+
}), N.length > 0 && !A && /* @__PURE__ */ r("button", {
|
|
486
499
|
type: "button",
|
|
487
|
-
onClick: () =>
|
|
488
|
-
disabled:
|
|
489
|
-
className:
|
|
490
|
-
style: {
|
|
491
|
-
|
|
500
|
+
onClick: () => I(N[0]),
|
|
501
|
+
disabled: E,
|
|
502
|
+
className: v.btnActionBlue,
|
|
503
|
+
style: {
|
|
504
|
+
alignSelf: "flex-start",
|
|
505
|
+
marginTop: "0.5rem"
|
|
506
|
+
},
|
|
507
|
+
children: E ? "Retrying..." : "Retry Extraction"
|
|
492
508
|
})]
|
|
493
509
|
}),
|
|
494
|
-
|
|
495
|
-
className:
|
|
496
|
-
children: [/* @__PURE__ */
|
|
497
|
-
className:
|
|
510
|
+
h && A && /* @__PURE__ */ i("div", {
|
|
511
|
+
className: v.extractedPanel,
|
|
512
|
+
children: [/* @__PURE__ */ r("p", {
|
|
513
|
+
className: v.extractedTitle,
|
|
498
514
|
children: "Extracted Data"
|
|
499
|
-
}), /* @__PURE__ */
|
|
500
|
-
className:
|
|
501
|
-
children: Object.entries(
|
|
502
|
-
className:
|
|
503
|
-
children: [/* @__PURE__ */
|
|
504
|
-
className:
|
|
515
|
+
}), /* @__PURE__ */ r("div", {
|
|
516
|
+
className: v.extractedList,
|
|
517
|
+
children: Object.entries(A).map(([e, t]) => /* @__PURE__ */ i("div", {
|
|
518
|
+
className: v.extractedItem,
|
|
519
|
+
children: [/* @__PURE__ */ r("span", {
|
|
520
|
+
className: v.extractedKey,
|
|
505
521
|
children: e.replace(/_/g, " ")
|
|
506
|
-
}), /* @__PURE__ */
|
|
507
|
-
className:
|
|
522
|
+
}), /* @__PURE__ */ r("span", {
|
|
523
|
+
className: v.extractedVal,
|
|
508
524
|
children: String(t)
|
|
509
525
|
})]
|
|
510
526
|
}, e))
|
|
@@ -515,4 +531,4 @@ function y({ label: e, value: o, onChange: s, onExtracted: u, onProcess: d, fiel
|
|
|
515
531
|
});
|
|
516
532
|
}
|
|
517
533
|
//#endregion
|
|
518
|
-
export {
|
|
534
|
+
export { _ as ImagePreview, x as OcrField, m as ZinoClient };
|