angel-table 0.0.0-stage → 0.0.2

package/dist/angel-table.umd.cjs

@@ -0,0 +1,5 @@
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("react/jsx-runtime")):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`angel-table`]={},e.React,e[`react/jsx-runtime`]))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t,t.exports),e=null),t.exports),i=r((e=>{var t=require("react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;e.c=function(e){return t.H.useMemoCache(e)}})),a=r((e=>{process.env.NODE_ENV!==`production`&&(function(){var t=require("react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;e.c=function(e){var n=t.H;return n===null&&console.error(`Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
+1. You might have mismatching versions of React and the renderer (such as React DOM)
+2. You might be breaking the Rules of Hooks
+3. You might have more than one copy of React in the same app
+See https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.`),n.useMemoCache(e)}})()})),o=r(((e,t)=>{t.exports=process.env.NODE_ENV===`production`?i():a()}))(),s=e=>{let r=(0,o.c)(26),{value:i,options:a,noLabel:s,title:c,onChange:l,direction:u}=e,d=i===void 0?``:i,f=s!==void 0&&s,p=u===void 0?`bottom`:u,[m,h]=(0,t.useState)(!1),[g,_]=(0,t.useState)(c),[v,y]=(0,t.useState)(d),b;r[0]!==c||r[1]!==d?(b=()=>{(d===void 0||d===``)&&_(c)},r[0]=c,r[1]=d,r[2]=b):b=r[2];let x;r[3]===d?x=r[4]:(x=[d],r[3]=d,r[4]=x),(0,t.useEffect)(b,x);let S;r[5]===Symbol.for(`react.memo_cache_sentinel`)?(S=e=>{e.currentTarget.contains(e.relatedTarget)||h(!1)},r[5]=S):S=r[5];let C=`angel-table__dropdown ${m?`is-open`:``}`,w;r[6]===m?w=r[7]:(w=()=>h(!m),r[6]=m,r[7]=w);let T;r[8]===g?T=r[9]:(T=(0,n.jsx)(`span`,{children:g}),r[8]=g,r[9]=T);let E;r[10]===Symbol.for(`react.memo_cache_sentinel`)?(E=(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`10`,height:`10`,fill:`currentColor`,viewBox:`0 0 16 16`,className:`angel-table__dropdown-arrow`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708`})}),r[10]=E):E=r[10];let D;r[11]!==w||r[12]!==T?(D=(0,n.jsxs)(`button`,{onClick:w,className:`angel-table__button angel-table__button--secondary angel-table__dropdown-trigger`,children:[T,E]}),r[11]=w,r[12]=T,r[13]=D):D=r[13];let O;r[14]!==f||r[15]!==l||r[16]!==a||r[17]!==m||r[18]!==c||r[19]!==v?(O=m&&(0,n.jsxs)(`div`,{className:`angel-table__dropdown-menu`,children:[!f&&(0,n.jsx)(`button`,{type:`button`,onClick:()=>{y(``),_(c),l&&l(``),h(!1)},className:`angel-table__dropdown-item ${v===``?`active`:``}`,children:c}),a.map(e=>(0,n.jsx)(`button`,{type:`button`,onClick:()=>{y(e.value+``),_(e.title),l&&l(e.value),h(!1)},className:`angel-table__dropdown-item ${e.value+``===v?`active`:``}`,children:e.title},e.value))]}),r[14]=f,r[15]=l,r[16]=a,r[17]=m,r[18]=c,r[19]=v,r[20]=O):O=r[20];let k;return r[21]!==p||r[22]!==D||r[23]!==O||r[24]!==C?(k=(0,n.jsxs)(`div`,{onBlur:S,"data-direction":p,className:C,children:[D,O]}),r[21]=p,r[22]=D,r[23]=O,r[24]=C,r[25]=k):k=r[25],k},c=(0,t.memo)(e=>{let r=(0,o.c)(15),{options:i,onChange:a,direction:s}=e,c=s===void 0?`bottom`:s,[u,d]=(0,t.useState)(!1),[f,p]=(0,t.useState)(i),m;r[0]===Symbol.for(`react.memo_cache_sentinel`)?(m=e=>{e.currentTarget.contains(e.relatedTarget)||d(!1)},r[0]=m):m=r[0];let h=`angel-table__dropdown ${u?`is-open`:``}`,g;r[1]===u?g=r[2]:(g=()=>d(!u),r[1]=u,r[2]=g);let _;r[3]===Symbol.for(`react.memo_cache_sentinel`)?(_=(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{d:`M2 2a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zm12-1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2z`}),(0,n.jsx)(`path`,{d:`M13 4a1 1 0 0 0-1-1h-2a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1z`})]}),r[3]=_):_=r[3];let v;r[4]===g?v=r[5]:(v=(0,n.jsx)(`button`,{onClick:g,className:`angel-table__button angel-table__button--secondary `,children:_}),r[4]=g,r[5]=v);let y;r[6]!==a||r[7]!==f||r[8]!==u?(y=u&&(0,n.jsx)(`div`,{className:`angel-table__dropdown-menu`,children:f.map((e,t)=>(0,n.jsxs)(`button`,{type:`button`,onClick:()=>{let e=f.map((e,n)=>({...e,show:n===t?!e.show:e.show}));e.filter(l).length>1&&(a?.(t),p(e))},className:`angel-table__dropdown-item angel-table__button`,children:[e.show?(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`blue`,className:` selected`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{d:`M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z`})}):(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,className:`not-selected`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{d:`M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16`}),(0,n.jsx)(`path`,{d:`m10.97 4.97-.02.022-3.473 4.425-2.093-2.094a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05`})]}),(0,n.jsx)(`p`,{children:e.title})]},e.value))}),r[6]=a,r[7]=f,r[8]=u,r[9]=y):y=r[9];let b;return r[10]!==c||r[11]!==h||r[12]!==v||r[13]!==y?(b=(0,n.jsxs)(`div`,{onBlur:m,"data-direction":c,className:h,children:[v,y]}),r[10]=c,r[11]=h,r[12]=v,r[13]=y,r[14]=b):b=r[14],b});function l(e){return e.show}function u(e){let n=(0,o.c)(9),r;n[0]===e?r=n[1]:(r=e===void 0?{}:e,n[0]=e,n[1]=r);let{pageOption:i,perPageOption:a}=r,s=i===void 0?1:i,c=a===void 0?10:a,[l,u]=(0,t.useState)(s),[d,f]=(0,t.useState)(0),[p,m]=(0,t.useState)(c),h;n[2]!==l||n[3]!==p||n[4]!==d?(h={page:l,perPage:p,totalPage:d},n[2]=l,n[3]=p,n[4]=d,n[5]=h):h=n[5];let g;n[6]===Symbol.for(`react.memo_cache_sentinel`)?(g={setPage:u,setPerPage:m,setTotalPage:f},n[6]=g):g=n[6];let _;return n[7]===h?_=n[8]:(_={data:h,handle:g},n[7]=h,n[8]=_),_}function d(){let e=(0,o.c)(14),n;e[0]===Symbol.for(`react.memo_cache_sentinel`)?(n={},e[0]=n):n=e[0];let[r,i]=(0,t.useState)(n),[a,s]=(0,t.useState)(``),[c,l]=(0,t.useState)(``),u;e[1]===Symbol.for(`react.memo_cache_sentinel`)?(u={field:``,direction:`asc`},e[1]=u):u=e[1];let[d,f]=(0,t.useState)(u),p;e[2]===Symbol.for(`react.memo_cache_sentinel`)?(p=e=>{f(t=>({field:e,direction:t.field===e&&t.direction===`asc`?`desc`:`asc`}))},e[2]=p):p=e[2];let m=p,h,g;e[3]===a?(h=e[4],g=e[5]):(h=()=>{let e=setTimeout(()=>{l(a)},500);return()=>clearTimeout(e)},g=[a],e[3]=a,e[4]=h,e[5]=g),(0,t.useEffect)(h,g);let _;e[6]!==c||e[7]!==r||e[8]!==a||e[9]!==d?(_={filter:r,search:a,debouncedSearch:c,sort:d},e[6]=c,e[7]=r,e[8]=a,e[9]=d,e[10]=_):_=e[10];let v;e[11]===Symbol.for(`react.memo_cache_sentinel`)?(v={setFilter:i,setSearch:s,setSort:f,setDebouncedSearch:l,handleSort:m},e[11]=v):v=e[11];let y;return e[12]===_?y=e[13]:(y={data:_,handle:v},e[12]=_,e[13]=y),y}function f({rowData:e,keyObject:n,is_select:r,selectedItem:i}){let[a,o]=(0,t.useState)({}),{checkAll:s,selectedCount:c}=(0,t.useMemo)(()=>{let t=e.filter(e=>a[String(e[n])]).length;if(r&&i){i(e);let t=[];for(let e in a)t.push(e)}return{checkAll:e.length>0&&t===e.length,selectedCount:t}},[a,e,n]),l=(0,t.useCallback)(()=>{let t={};e.forEach(e=>{t[String(e[n])]=!s}),o(t)},[e]);return{handle:{handleCheck:(0,t.useCallback)(e=>{let t=String(e[n]);o(e=>({...e,[t]:!e[t]}))},[]),handleCheckAll:l,setCheckedId:o},data:{selectedCount:c,checkedId:a,checkAll:s}}}function p(e){let t=new URLSearchParams;return Object.entries(e).forEach(([e,n])=>{n!==``&&t.set(e,n)}),t}function m({rows:e=[],setup:n={}}){let{url:r=``,viewDefault:i=`table`,angelFetch:a,keyObject:o=`id`,is_select:s=!1,selectedItem:c}=n,{data:{page:l,perPage:m,totalPage:h},handle:{setPage:g,setPerPage:_,setTotalPage:v}}=u(),{data:{debouncedSearch:y,filter:b,search:x,sort:S},handle:{handleSort:C,setFilter:w,setSearch:T,setSort:E,setDebouncedSearch:D}}=d(),{data:{checkedId:O,selectedCount:k,checkAll:A},handle:{handleCheck:j,handleCheckAll:M,setCheckedId:N}}=f({is_select:s,keyObject:o,rowData:e,selectedItem:c}),[P,F]=(0,t.useState)(e),[I,L]=(0,t.useState)(!1),[R,z]=(0,t.useState)(i),B=(0,t.useRef)(null),V=(0,t.useCallback)(()=>{w({}),g(1),T(``),D(``),E({direction:`asc`,field:``})},[]);return(0,t.useEffect)(()=>{let e=new AbortController,t=AbortSignal.timeout(5e3);return(async()=>{L(!0);try{let n=p(b);n.set(`page`,String(l)),n.set(`perPage`,String(m)),y.trim()!==``&&n.set(`search`,y.trim()),S.field&&(n.set(`field`,S.field),n.set(`direction`,S.direction));let i=r.includes(`?`)?`&`:`?`,o=`${r}${i}${n.toString()}`;if(a){let e=await a(o);F(e.data??[]),v(Math.max(1,Number(e.totalPage??1))),N({})}else{let n=await fetch(o,{method:`GET`,signal:AbortSignal.any([e.signal,t])});if(!n.ok)throw Error(`Request failed: ${n.status}`);let r=await n.json();if(e.signal.aborted)return;F(r.data??[]),v(Math.max(1,Number(r.totalPage??1))),N({})}B.current?.scrollIntoView({behavior:`smooth`,block:`start`})}catch(e){if(e instanceof Error&&e.name===`AbortError`)return;F([]),v(1)}finally{e.signal.aborted||L(!1)}})(),()=>e.abort()},[b,l,m,r,y,S]),{data:{page:l,perPage:m,totalPage:h,debouncedSearch:y,filter:b,search:x,sort:S,checkedId:O,selectedCount:k,rowData:P,view:R,loading:I,targetRef:B,checkAll:A},handle:{setPage:g,setPerPage:_,setTotalPage:v,handleResetFilter:V,handleSort:C,setFilter:w,setSearch:T,setSort:E,handleCheck:j,handleCheckAll:M,setCheckedId:N,setRowData:F,setView:z}}}function h(e){let n=(0,o.c)(4),{columns:r}=e,i;n[0]===r?i=n[1]:(i=[...r.map(g)],n[0]=r,n[1]=i);let[a,s]=(0,t.useState)(i),c;return n[2]===a?c=n[3]:(c={setShowColumm:s,showColumm:a},n[2]=a,n[3]=c),c}function g(e){return{...e,show:!0}}var _=e=>{let r=(0,o.c)(20),{columns:i,field:a,sortDirection:s,onSort:c}=e,[l,u]=(0,t.useState)(!1),[d,f]=(0,t.useState)(a),[p,m]=(0,t.useState)(s),h;r[0]===i?h=r[1]:(h=i.filter(v),r[0]=i,r[1]=h);let g=h,_,b;r[2]===a?(_=r[3],b=r[4]):(_=()=>(f(a),y),b=[a],r[2]=a,r[3]=_,r[4]=b),(0,t.useEffect)(_,b);let x;r[5]===Symbol.for(`react.memo_cache_sentinel`)?(x=e=>{e.currentTarget.contains(e.relatedTarget)||u(!1)},r[5]=x):x=r[5];let S;r[6]===l?S=r[7]:(S=()=>u(!l),r[6]=l,r[7]=S);let C;r[8]===Symbol.for(`react.memo_cache_sentinel`)?(C=(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M11.5 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L11 2.707V14.5a.5.5 0 0 0 .5.5m-7-14a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L4 13.293V1.5a.5.5 0 0 1 .5-.5`})}),r[8]=C):C=r[8];let w;r[9]===S?w=r[10]:(w=(0,n.jsx)(`button`,{onClick:S,className:`angel-table__button angel-table__button--secondary `,children:C}),r[9]=S,r[10]=w);let T;r[11]!==l||r[12]!==c||r[13]!==d||r[14]!==p||r[15]!==g?(T=l&&(0,n.jsxs)(`div`,{className:`angel-table__dropdown-menu`,children:[g.map(e=>(0,n.jsx)(`button`,{type:`button`,onClick:()=>{(p!==`asc`||e.field!==d)&&(f(e.field),m(`asc`),c&&c({field:e.field,sortDirection:`asc`}))},className:`angel-table__dropdown-item angel-table__button ${d===e.field?`active`:``}`,children:(0,n.jsxs)(`p`,{children:[` `,e.title]})},e.field)),(0,n.jsx)(`hr`,{}),g.filter(e=>e.field===d).map(e=>(0,n.jsxs)(t.Fragment,{children:[(0,n.jsxs)(`button`,{onClick:()=>{m(`asc`),c&&c({field:e.field,sortDirection:`asc`})},className:`angel-table__dropdown-item angel-table__button ${p===`asc`?`active`:``}`,children:[(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,className:`bi bi-arrow-up`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M8 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L7.5 2.707V14.5a.5.5 0 0 0 .5.5`})}),(0,n.jsx)(`p`,{children:e.sortLabel?.ascLabel??`Ascending`})]}),(0,n.jsxs)(`button`,{onClick:()=>{m(`desc`),c&&c({field:e.field,sortDirection:`desc`})},className:`angel-table__dropdown-item angel-table__button ${p===`desc`?`active`:``}`,children:[(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M8 1a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L7.5 13.293V1.5A.5.5 0 0 1 8 1`})}),(0,n.jsx)(`p`,{children:e.sortLabel?.descLabel??`Descending`})]})]},e.field))]}),r[11]=l,r[12]=c,r[13]=d,r[14]=p,r[15]=g,r[16]=T):T=r[16];let E;return r[17]!==w||r[18]!==T?(E=(0,n.jsxs)(`div`,{onBlur:x,"data-direction":`bottom`,className:`angel-table__dropdown `,children:[w,T]}),r[17]=w,r[18]=T,r[19]=E):E=r[19],E};function v(e){return e.sort&&e.show}function y(){}e.Table=e=>{let{columns:r,card:i,className:a,empty:o,perPages:l,selector:u,setup:d}=(0,t.useMemo)(()=>{let{columns:t,card:n,className:r,empty:i,perPages:a=[10,15,20],rows:o,selector:s,setup:c={}}=e;return{columns:t,card:n,className:r,empty:i,perPages:a,rows:o,selector:s,setup:c}},[e]),{keyObject:f=`id`,contentPage:p=`Page`,mode:g=`light`,selectedRender:v=e=>(0,n.jsxs)(`span`,{children:[`Selected: `,(0,n.jsx)(`strong`,{children:e}),` items`]}),is_select:y=!1,showColumns:b}=(0,t.useMemo)(()=>d,[d]),{data:{checkedId:x,filter:S,loading:C,page:w,perPage:T,rowData:E,search:D,selectedCount:O,sort:k,totalPage:A,view:j,targetRef:M,checkAll:N},handle:{handleCheck:P,handleCheckAll:F,handleResetFilter:I,handleSort:L,setCheckedId:R,setFilter:z,setPage:B,setPerPage:V,setSearch:H,setView:U}}=m(e),{setShowColumm:W,showColumm:G}=h({columns:r}),K=(0,t.useCallback)(()=>o?o.render():(0,n.jsxs)(`div`,{className:`angel-table__empty`,children:[(0,n.jsx)(`div`,{className:`angel-table__empty-icon`,children:(0,n.jsxs)(`svg`,{viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,"aria-hidden":`true`,children:[(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M4 5.5A1.5 1.5 0 0 1 5.5 4h13A1.5 1.5 0 0 1 20 5.5v13a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 18.5v-13Z`}),(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M8 9h8M8 13h5m2 4 2 2 4-4`})]})}),(0,n.jsx)(`h3`,{className:`angel-table__empty-title`,children:`No data found`}),(0,n.jsx)(`p`,{className:`angel-table__empty-description`,children:`No data available to display. Please try again later.`}),(0,n.jsx)(`button`,{type:`button`,className:`angel-table__button angel-table__button--secondary`,onClick:()=>B(1),children:`Refresh`})]}),[o]),q=(0,n.jsx)(`tr`,{children:G.filter(e=>e.show).map(e=>e.field===`check_field`?(0,n.jsx)(`th`,{style:{width:e.width},className:`angel-table__check-cell ${e.className??``}`,children:(0,n.jsx)(`input`,{type:`checkbox`,checked:N,onChange:F,"aria-label":`Chọn tất cả`})},e.field):e.field===`action_field`?(0,n.jsx)(`th`,{style:{width:e.width},className:`angel-table__index-cell ${e.className??``}`,children:e.title},e.field):e.field===`index_field`?(0,n.jsx)(`th`,{style:{width:e.width},onClick:()=>{e.sort&&L(e.field)},className:`angel-table__index-cell ${e.className??``}`,children:(0,n.jsx)(`span`,{className:`angel-table__sort`,children:`#`})},e.field):(0,n.jsx)(`th`,{style:{width:e.width},onClick:()=>L(e.field),className:e.className??``,children:(0,n.jsxs)(`span`,{className:`angel-table__sort`,children:[e.title,e.sort&&(0,n.jsxs)(`span`,{className:`angel-table__sort-icon`,children:[k.field===e.field&&k.direction===`asc`&&(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,className:`bi bi-arrow-up`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M8 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L7.5 2.707V14.5a.5.5 0 0 0 .5.5`})}),k.field===e.field&&k.direction===`desc`&&(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,className:`bi bi-arrow-down`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M8 1a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L7.5 13.293V1.5A.5.5 0 0 1 8 1`})}),k.field!==e.field&&(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M11.5 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L11 2.707V14.5a.5.5 0 0 0 .5.5m-7-14a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L4 13.293V1.5a.5.5 0 0 1 .5-.5`})})]})]})},e.field))});return(0,n.jsxs)(`div`,{"data-theme":g,className:`angel-table-container  ${a}`,children:[(0,n.jsx)(`div`,{className:`angel-table-toolbar`,children:(0,n.jsxs)(`div`,{className:`angel-table__toolbar`,children:[(0,n.jsxs)(`div`,{className:`angel-table__toolbar-left`,children:[u?.map(e=>(0,n.jsx)(s,{value:S[e.field],...e,onChange:t=>{z(n=>({...n,[e.field]:t})),B(1)},direction:`bottom`},e.field)),O>0&&y&&(0,n.jsxs)(`div`,{className:`angel-table__selection`,children:[v(O),(0,n.jsx)(`button`,{type:`button`,onClick:()=>R({}),children:`Clear selection`})]})]}),(0,n.jsxs)(`div`,{className:`angel-table__toolbar-left`,children:[b&&(0,n.jsx)(c,{onChange:e=>{let t=G.map((t,n)=>({...t,show:n===e?!t.show:t.show}));W([...t])},options:[...r.map(e=>({value:e.field,title:e.title,show:!0}))]}),(0,n.jsx)(_,{columns:G,onSort:e=>{L(e.field)},field:k.field,sortDirection:k.direction}),(0,n.jsx)(`button`,{onClick:()=>{U(j===`table`?`card`:`table`)},className:`angel-table__button angel-table__button--secondary`,children:j===`table`?(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,fill:`currentColor`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{d:`M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2z`}),(0,n.jsx)(`path`,{d:`M5 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 5 8m0-2.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5m0 5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5m-1-5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0M4 8a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0m0 2.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0`})]}):(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{d:`M1 2.5A1.5 1.5 0 0 1 2.5 1h3A1.5 1.5 0 0 1 7 2.5v3A1.5 1.5 0 0 1 5.5 7h-3A1.5 1.5 0 0 1 1 5.5zM2.5 2a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5zm6.5.5A1.5 1.5 0 0 1 10.5 1h3A1.5 1.5 0 0 1 15 2.5v3A1.5 1.5 0 0 1 13.5 7h-3A1.5 1.5 0 0 1 9 5.5zm1.5-.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5zM1 10.5A1.5 1.5 0 0 1 2.5 9h3A1.5 1.5 0 0 1 7 10.5v3A1.5 1.5 0 0 1 5.5 15h-3A1.5 1.5 0 0 1 1 13.5zm1.5-.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5zm6.5.5A1.5 1.5 0 0 1 10.5 9h3a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1-1.5 1.5h-3A1.5 1.5 0 0 1 9 13.5zm1.5-.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5z`})})}),(0,n.jsxs)(`div`,{className:`angel-table__search-box`,children:[(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{d:`M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0`}),` `]}),(0,n.jsx)(`input`,{type:`text`,name:`angel-table__search`,placeholder:`Search...`,value:D,onChange:e=>{H(e.currentTarget.value)}})]}),(0,n.jsx)(`button`,{type:`button`,className:`angel-table__button angel-table__button--secondary`,onClick:I,children:(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2z`}),(0,n.jsx)(`path`,{d:`M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466`})]})})]})]})}),(0,n.jsxs)(`div`,{className:`angel-table-body`,children:[C&&(0,n.jsx)(n.Fragment,{children:(0,n.jsxs)(`div`,{className:`angel-table__loading-container`,children:[(0,n.jsx)(`div`,{className:`angel-table__loading-backdrop`}),(0,n.jsx)(`div`,{className:`angel-table__loading-overlay`,children:(0,n.jsx)(`div`,{className:`angel-table__loading-text`,children:`Loading...`})})]})}),(0,n.jsx)(`div`,{className:`angel-table__desktop`,ref:M,children:j===`table`?(0,n.jsx)(`div`,{style:{maxHeight:d.heightTable??600},className:`angel-table `,children:(0,n.jsxs)(`table`,{children:[(0,n.jsx)(`thead`,{children:q}),(0,n.jsx)(`tbody`,{children:E.length===0&&!C?(0,n.jsx)(`tr`,{className:``,children:(0,n.jsx)(`td`,{colSpan:r.length,children:K()})}):E.map((e,t)=>{let r=String(e[f]);return(0,n.jsx)(`tr`,{className:x[r]?`is-selected`:``,children:G.filter(e=>e.show).map(i=>i.field===`action_field`?(0,n.jsx)(`td`,{className:i.className??``,children:i.render?i.render(e):``},i.field):i.field===`check_field`?(0,n.jsx)(`td`,{className:`angel-table__check-cell ${i.className??``}`,children:(0,n.jsx)(`input`,{type:`checkbox`,checked:!!x[r],onChange:()=>P(e),"aria-label":`Chọn dòng ${r}`})},i.field):i.field===`index_field`?(0,n.jsx)(`td`,{className:`angel-table__index-cell ${i.className??``}`,children:t+1},i.field):(0,n.jsx)(`td`,{className:i.className??``,children:i.render?i.render(e):e[i.field]},i.field))},r)})})]})}):(0,n.jsx)(t.Fragment,{children:E.length===0?K():(0,n.jsx)(`ul`,{className:`angel-table__cards`,children:E.map((e,r)=>{let a=e[f];return(0,n.jsx)(t.Fragment,{children:i?i.render(e,()=>P(e),x[a]):(0,n.jsxs)(`li`,{onClick:()=>{P(e)},className:`angel-table__card `,children:[x[a]&&y&&(0,n.jsx)(`span`,{className:`is-selected`,children:`Selected`}),G.filter(e=>e.show).map((t,i)=>[`check_field`,`index_field`].includes(t.field)?null:t.field===`action_field`?(0,n.jsx)(`div`,{children:t.render?t.render(e):(0,n.jsx)(n.Fragment,{})},`${a??r}-${t.field??i}`):(0,n.jsxs)(`div`,{className:`angel-table__card_row`,children:[(0,n.jsx)(`div`,{className:`angel-table__card_column_left`,children:t.title}),(0,n.jsx)(`div`,{className:`angel-table__card_column_right`,children:t.render?t.render(e):e[t.field]})]},`${a??r}-${t.field??i}`))]})},a??r)})})})}),(0,n.jsx)(`ul`,{className:`angel-table__mobile`,children:(0,n.jsx)(t.Fragment,{children:E.length===0?K():(0,n.jsx)(`li`,{className:`angel-table__cards`,children:E.map((e,r)=>{let a=String(e[f]);return x[a],(0,n.jsx)(t.Fragment,{children:i?i.render(e,()=>P(e),x[a]):(0,n.jsxs)(`div`,{className:`angel-table__card`,children:[x[a]&&y&&(0,n.jsx)(`span`,{className:`is-selected`,children:`Selected`}),G.filter(e=>e.show).map((t,i)=>[`check_field`,`index_field`].includes(t.field)?null:t.field===`action_field`?(0,n.jsx)(`div`,{children:t.render?t.render(e):(0,n.jsx)(n.Fragment,{})},`${String(a??r)}-${t.field??i}`):(0,n.jsxs)(`div`,{className:`angel-table__card_row`,children:[(0,n.jsx)(`div`,{className:`angel-table__card_column_left`,children:t.title}),(0,n.jsx)(`div`,{className:`angel-table__card_column_right`,children:t.render?t.render(e):e[t.field]})]},`${String(a??r)}-${t.field??i}`))]})},String(a??r))})})})}),(0,n.jsxs)(`div`,{className:`angel-table__footer`,children:[(0,n.jsx)(`div`,{className:`angel-table__footer-info`,children:C?`Đang tải...`:(0,n.jsxs)(n.Fragment,{children:[p,` `,(0,n.jsx)(`strong`,{children:w}),` /`,` `,(0,n.jsx)(`strong`,{children:A})]})}),(0,n.jsxs)(`div`,{className:`angel-table__pagination`,children:[(0,n.jsx)(s,{field:``,onChange:e=>{V(Number(e)),B(1)},noLabel:!0,direction:`top`,options:[...l.map(e=>({title:e+``,value:e+``}))],title:T+``}),(0,n.jsx)(`button`,{type:`button`,className:`angel-table__page-button`,disabled:w<=1||C,onClick:()=>B(()=>1),"aria-label":`Trang trước`,children:(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M8.354 1.646a.5.5 0 0 1 0 .708L2.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0`}),(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M12.354 1.646a.5.5 0 0 1 0 .708L6.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0`})]})}),(0,n.jsx)(`button`,{type:`button`,className:`angel-table__page-button`,disabled:w<=1||C,onClick:()=>B(e=>Math.max(1,e-1)),"aria-label":`Trang trước`,children:(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0`})})}),(0,n.jsx)(`span`,{className:`angel-table__page-number`,children:w}),(0,n.jsx)(`button`,{type:`button`,className:`angel-table__page-button`,disabled:w>=A||C,onClick:()=>B(e=>Math.min(A,e+1)),"aria-label":`Trang tiếp theo`,children:(0,n.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708`})})}),(0,n.jsx)(`button`,{type:`button`,className:`angel-table__page-button`,disabled:w>=A||C,onClick:()=>B(()=>A),"aria-label":`Trang tiếp theo`,children:(0,n.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 16 16`,children:[(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M3.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L9.293 8 3.646 2.354a.5.5 0 0 1 0-.708`}),(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M7.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L13.293 8 7.646 2.354a.5.5 0 0 1 0-.708`})]})})]})]})]})]})}});

package/dist/lib/Table/Table.d.ts

@@ -0,0 +1,2 @@
+import { TAngelTableOption } from './type';
+export declare const Table: (data: TAngelTableOption<any>) => import('react').JSX.Element;

package/dist/lib/Table/components/Select.d.ts

@@ -0,0 +1,3 @@
+import { TAngelSelect } from '../type';
+declare const AngelSelect: ({ value, options, noLabel, title, onChange, direction, }: TAngelSelect) => import('react').JSX.Element;
+export default AngelSelect;

package/dist/lib/Table/components/SelectCheck.d.ts

@@ -0,0 +1,3 @@
+import { TAngelSelectCheck } from '../type';
+declare const _default: import('react').MemoExoticComponent<({ options, onChange, direction, }: TAngelSelectCheck) => import('react').JSX.Element>;
+export default _default;

package/dist/lib/Table/components/Sort.d.ts

@@ -0,0 +1,3 @@
+import { TAngelSortOption } from '../type';
+declare const AngelSort: ({ columns, field, sortDirection, onSort, }: TAngelSortOption) => import('react').JSX.Element;
+export default AngelSort;

package/dist/lib/Table/hook/useAngelCheck.d.ts

@@ -0,0 +1,19 @@
+type TAngelCheckOption<T> = {
+    rowData: T[];
+    keyObject: string;
+    is_select: boolean;
+    selectedItem: ((data: T[]) => void) | undefined;
+};
+export declare function useAngelCheck<T>({ rowData, keyObject, is_select, selectedItem, }: TAngelCheckOption<T>): {
+    handle: {
+        handleCheck: (data: any) => void;
+        handleCheckAll: () => void;
+        setCheckedId: import('react').Dispatch<import('react').SetStateAction<Record<string, boolean>>>;
+    };
+    data: {
+        selectedCount: number;
+        checkedId: Record<string, boolean>;
+        checkAll: boolean;
+    };
+};
+export {};

package/dist/lib/Table/hook/useAngelColumn.d.ts

@@ -0,0 +1,33 @@
+import { TColumn } from '../type';
+type TAngelTableColumnOption = {
+    columns: TColumn[];
+};
+export declare function useAngelColumn({ columns }: TAngelTableColumnOption): {
+    setShowColumm: import('react').Dispatch<import('react').SetStateAction<{
+        show: boolean;
+        title: string;
+        className?: string;
+        field: "check_field" | "index_field" | "action_field" | (string & {});
+        render?: (row: any) => import('react').ReactNode;
+        width?: string;
+        sort?: boolean;
+        sortLabel?: {
+            ascLabel?: string;
+            descLabel?: string;
+        };
+    }[]>>;
+    showColumm: {
+        show: boolean;
+        title: string;
+        className?: string;
+        field: "check_field" | "index_field" | "action_field" | (string & {});
+        render?: (row: any) => import('react').ReactNode;
+        width?: string;
+        sort?: boolean;
+        sortLabel?: {
+            ascLabel?: string;
+            descLabel?: string;
+        };
+    }[];
+};
+export {};

package/dist/lib/Table/hook/useAngelData.d.ts

@@ -0,0 +1,40 @@
+import { TAngelTableOption } from '../type';
+export declare function useAngelTable<T>({ rows, setup, }: TAngelTableOption<T>): {
+    data: {
+        page: number;
+        perPage: number;
+        totalPage: number;
+        debouncedSearch: string;
+        filter: Record<string, string>;
+        search: string;
+        sort: {
+            field: string;
+            direction: "asc" | "desc";
+        };
+        checkedId: Record<string, boolean>;
+        selectedCount: number;
+        rowData: T[];
+        view: "table" | "card";
+        loading: boolean;
+        targetRef: import('react').RefObject<HTMLDivElement | null>;
+        checkAll: boolean;
+    };
+    handle: {
+        setPage: import('react').Dispatch<import('react').SetStateAction<number>>;
+        setPerPage: import('react').Dispatch<import('react').SetStateAction<number>>;
+        setTotalPage: import('react').Dispatch<import('react').SetStateAction<number>>;
+        handleResetFilter: () => void;
+        handleSort: (field: string) => void;
+        setFilter: import('react').Dispatch<import('react').SetStateAction<Record<string, string>>>;
+        setSearch: import('react').Dispatch<import('react').SetStateAction<string>>;
+        setSort: import('react').Dispatch<import('react').SetStateAction<{
+            field: string;
+            direction: "asc" | "desc";
+        }>>;
+        handleCheck: (data: any) => void;
+        handleCheckAll: () => void;
+        setCheckedId: import('react').Dispatch<import('react').SetStateAction<Record<string, boolean>>>;
+        setRowData: import('react').Dispatch<import('react').SetStateAction<T[]>>;
+        setView: import('react').Dispatch<import('react').SetStateAction<"table" | "card">>;
+    };
+};

package/dist/lib/Table/hook/useAngelFilterSerchSort.d.ts

@@ -0,0 +1,21 @@
+export declare function useAngelFilterSerchSort(): {
+    data: {
+        filter: Record<string, string>;
+        search: string;
+        debouncedSearch: string;
+        sort: {
+            field: string;
+            direction: "asc" | "desc";
+        };
+    };
+    handle: {
+        setFilter: import('react').Dispatch<import('react').SetStateAction<Record<string, string>>>;
+        setSearch: import('react').Dispatch<import('react').SetStateAction<string>>;
+        setSort: import('react').Dispatch<import('react').SetStateAction<{
+            field: string;
+            direction: "asc" | "desc";
+        }>>;
+        setDebouncedSearch: import('react').Dispatch<import('react').SetStateAction<string>>;
+        handleSort: (field: string) => void;
+    };
+};

package/dist/lib/Table/hook/useAngelPagination.d.ts

@@ -0,0 +1,17 @@
+type TAngelPaginationOption = {
+    pageOption?: number;
+    perPageOption?: number;
+};
+export declare function useAngelPagination({ pageOption, perPageOption, }?: TAngelPaginationOption): {
+    data: {
+        page: number;
+        perPage: number;
+        totalPage: number;
+    };
+    handle: {
+        setPage: import('react').Dispatch<import('react').SetStateAction<number>>;
+        setPerPage: import('react').Dispatch<import('react').SetStateAction<number>>;
+        setTotalPage: import('react').Dispatch<import('react').SetStateAction<number>>;
+    };
+};
+export {};

package/dist/lib/Table/type.d.ts

@@ -0,0 +1,83 @@
+import { ReactNode } from 'react';
+export type TAngelTableOption<T> = {
+    columns: TColumn[];
+    perPages?: number[];
+    rows?: T[];
+    card?: TCard<T>;
+    empty?: TEmpty;
+    className?: string;
+    selector?: TAngelSelect[];
+    setup?: {
+        heightTable?: number;
+        keyObject?: string;
+        showColumns?: boolean;
+        url?: string;
+        viewDefault?: 'table' | 'card';
+        is_select?: boolean;
+        contentPage?: string;
+        contentSearch?: string;
+        mode?: 'light' | 'dark';
+        selectedRender?: (count: number) => ReactNode;
+        loadingRender?: () => ReactNode;
+        selectedItem?: (data: T[]) => void;
+        angelFetch?: (angelUrl: string) => Promise<{
+            totalPage: number;
+            data: T[];
+            curPage: number;
+        }>;
+    };
+};
+export type TFilter = {
+    field: string;
+    value: string;
+};
+export type TEmpty = {
+    render: () => ReactNode;
+};
+export type TColumn = {
+    title: string;
+    className?: string;
+    field: 'check_field' | 'index_field' | 'action_field' | (string & {});
+    render?: (row: any) => ReactNode;
+    width?: string;
+    sort?: boolean;
+    sortLabel?: {
+        ascLabel?: string;
+        descLabel?: string;
+    };
+    show?: boolean;
+};
+export type TCard<T> = {
+    render: (row: T, onCheck: () => void, checked: boolean) => ReactNode;
+};
+export type TAngelOption = {
+    value: string;
+    title: string;
+};
+export type TAngelSelect = {
+    field: string;
+    title: string;
+    value?: string;
+    direction?: 'top' | 'left' | 'right' | 'bottom';
+    noLabel?: boolean;
+    onChange?: (e: string) => void;
+    options: TAngelOption[];
+};
+export type TAngelSelectCheck = {
+    onChange?: (index: number) => void;
+    options: {
+        value: string;
+        title: string;
+        show: boolean;
+    }[];
+    direction?: 'top' | 'left' | 'right' | 'bottom';
+};
+export type TAngelSortOption = {
+    columns: TColumn[];
+    field: string;
+    sortDirection: string;
+    onSort?: (d: {
+        field: string;
+        sortDirection: 'asc' | 'desc';
+    }) => void;
+};

package/dist/lib/main.d.ts

@@ -0,0 +1 @@
+export { Table } from './Table/Table';

package/dist/src/App.d.ts

@@ -0,0 +1,2 @@
+declare function App(): import('react').JSX.Element;
+export default App;

package/dist/src/utils/createFilter.d.ts

@@ -0,0 +1 @@
+export declare function createFilter(filters: Record<string, string>): URLSearchParams;

package/dist/src/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './createFilter';

package/package.json

@@ -1,6 +1,44 @@
 {
   "name": "angel-table",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.0.2",
+  "type": "module",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "main": "./dist/angel-table.umd.cjs",
+  "module": "./dist/angel-table.js",
+  "exports": {
+    ".": {
+      "import": "./dist/angel-table.js",
+      "require": "./dist/angel-table.umd.cjs"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "prebuild": "rm -rf dist",
+    "build": "tsc -b && vite build",
+    "lint": "oxlint",
+    "preview": "vite preview",
+    "publish": "npm run build && npm publish"
+  },
+  "dependencies": {
+    "react": "^19.3.1",
+    "react-dom": "^19.3.1",
+    "vite-plugin-dts": "^5.1.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.29.7",
+    "@rolldown/plugin-babel": "^0.3.0",
+    "@types/babel__core": "^7.20.5",
+    "@types/node": "^24.19.2",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "@typescript/typescript6": "^6.0.2",
+    "@vitejs/plugin-react": "^6.1.2",
+    "babel-plugin-react-compiler": "^1.0.0",
+    "oxlint": "^1.90.0",
+    "typescript": "~7.0.2",
+    "vite": "^8.3.6"
+  }
+}