najwer23morsels 1.10.30 → 1.10.32

package/README.md

@@ -1,6 +1,8 @@
-A comprehensive collection of React components for building consistent, scalable applications.
+<p align="left">
+  <img src="https://najwer23.github.io/najwer23morsels/logo-light.svg" alt="najwer23morsels" height="64" />
+</p>
 
-# najwer23morsels
+A comprehensive collection of React components for building consistent, scalable applications.
 
 [![NPM Downloads](https://img.shields.io/npm/dm/najwer23morsels?style=for-the-badge&logo=npm&logoColor=white)](https://www.npmjs.com/package/najwer23morsels)
 
@@ -27,4 +29,7 @@ export const Example = () => {
 **X:** https://twitter.com/najwer23  
 **LinkedIn:** https://www.linkedin.com/in/najwer23  
 **LeetCode:** https://leetcode.com/najwer23  
-**NPM:** https://www.npmjs.com/~najwer23
+**NPM:** https://www.npmjs.com/~najwer23 <br>
+**Gitfut:** https://gitfut.com/najwer23  
+**Nook:** https://najwer23.github.io/nook  
+**Blog** https://najwer23.github.io/#/blog

package/lib/Table/Table.types.d.ts

@@ -1,4 +1,5 @@
 import { SelectOption } from '../Select';
+import { ValidatorOptions } from '../validator';
 export type TableRow = Record<string, string | number | boolean> & {
     id: string | number;
 };
@@ -7,6 +8,7 @@ type TableColumnBase = {
     cellName: string;
     disabledAdd?: boolean;
     disabledEdit?: boolean;
+    validatorOptions?: ValidatorOptions;
     thAlign?: 'left' | 'right';
     tdAlign?: 'left' | 'right';
 };

package/lib/Table/index.js

@@ -1 +1 @@
-import{jsxs as e,jsx as l,Fragment as t}from"react/jsx-runtime";import{useState as a}from"react";import{B as o}from"../Button-QC014EKI.js";import{C as i}from"../Calendar-BkDrBfRy.js";import{D as n}from"../Dialog-8B0xk8Wx.js";import{F as r}from"../Form-CgTuTB2Q.js";import{G as d}from"../Grid-DmI4tqqG.js";import{I as s}from"../Input-Bl7_BOs4.js";import{L as c}from"../LoaderDots-BoEg_zlZ.js";import{S as p}from"../Select-QBTZllFj.js";import{T as b}from"../TextBox-__k4jPYK.js";import{T as g}from"../Typography-CZqNLAT7.js";import{s as h,g as m}from"../style-inject.es-CrVRO2OA.js";import"../Loader-ZYEBOkbx.js";import"../IconLocate-CQda7FAB.js";import"../validator/index.js";var u={n23mTable:"Table-module_n23mTable__kKVd9",table:"Table-module_table__hJFsY",loadingCell:"Table-module_loadingCell__mIX-P",loadingInner:"Table-module_loadingInner__GlNjv"};h('@layer n23mTable{.Table-module_n23mTable__kKVd9{--hover-bg:rgba(0,0,0,.11);background-attachment:local,local,scroll,scroll;background-color:#fff;background-image:linear-gradient(90deg,#fff 20px,hsla(0,0%,100%,0)),linear-gradient(270deg,#fff 20px,hsla(0,0%,100%,0)),radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.25),transparent),radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.25),transparent);background-position:0,100%,0,100%;background-repeat:no-repeat;background-size:40px 100%,40px 100%,14px 100%,14px 100%;isolation:isolate;overflow-x:auto;overflow-y:hidden}.Table-module_n23mTable__kKVd9:focus-visible{outline:2px solid currentcolor;outline-offset:2px}.Table-module_table__hJFsY{border-collapse:collapse;min-width:max-content;width:100%}.Table-module_table__hJFsY td,.Table-module_table__hJFsY th{border:1px solid grey;padding:10px 12px;position:relative}.Table-module_table__hJFsY td[data-clickable=true]{cursor:pointer}.Table-module_table__hJFsY td.Table-module_loadingCell__mIX-P{cursor:default;padding:0}.Table-module_loadingInner__GlNjv{align-items:flex-start;box-sizing:border-box;display:flex;justify-content:flex-start;min-height:var(--table-loading-height,219.25px);padding:10px}@media (hover:hover){.Table-module_table__hJFsY tbody tr:hover>td{background-color:var(--hover-bg)}.Table-module_table__hJFsY tbody td:hover:after{background-color:var(--hover-bg);content:"";inset:-100vh 0;pointer-events:none;position:absolute;z-index:-1}.Table-module_table__hJFsY tbody tr:hover>td.Table-module_loadingCell__mIX-P{background-color:transparent}.Table-module_table__hJFsY tbody td.Table-module_loadingCell__mIX-P:hover:after{content:none}}}');const x=({className:h,jsonSchema:x,jsonData:f,cellEdit:_,cellDelete:y,onCellReset:T,isLoading:k=!1,style:C,tableLoadingHeight:v,...S})=>{const[w,j]=a(!1),[z,D]=a(!1),[N,E]=a(0),[M,B]=a(null),{onCellEdit:F,isCellEditError:I=!1,isCellEditPending:Y=!1,isCellEditSuccess:J=!1,cellEditErrorMsg:W,cellEditSuccessMsg:V}=_??{},{onCellDelete:P,isCellDeleteError:L=!1,isCellDeletePending:A=!1,isCellDeleteSuccess:G=!1,cellDeleteErrorMsg:X,cellDeleteSuccessMsg:K}=y??{},O=Boolean(F),R=Boolean(P),H=x.cols.filter(e=>"id"!==e.cellName),q=()=>{T&&setTimeout(()=>T(),300)},Q=()=>{D(!1),q()},U=()=>{D(!1),j(!1),q()};return e("div",{className:[u.n23mTable,"n23mTable",h].filter(Boolean).join(" "),...S,style:{...m({"--table-loading-height":v}),...C},children:[O&&l(n,{open:w,onCancel:()=>{j(!1),q()},widthMax:"900px",children:e(d,{layout:"container",widthMin:"min(800px, calc(100vw - 25px))",padding:"0px 30px 30px 30px",margin:"auto",children:[l(g,{appearance:"light",variant:"subheading",style:{margin:"0 0 20px 0"},children:"Edit Cell"}),e(r,{onSubmit:e=>{if(!F)return;if(Object.values(e).some(({error:e})=>e))return;const l=Object.fromEntries(Object.entries(e).map(([e,{value:l}])=>[e,l]));F(l)},isError:I,isPending:Y,isSuccess:J,errorMsg:W,successMsg:V,children:[l(d,{layout:"columns",col:{smallDesktop:2},gap:{col:"20px"},children:M&&x.cols.map(e=>{const t=M[e.cellName];if("date"===e.cellType){const a=t||e.initialValue;return l(i,{label:e.cellText,name:e.cellName,disabled:e.disabledEdit,initialValue:a,placeholder:e.cellText},e.cellName)}if("select"===e.cellType){const a=e.options.find(e=>e.value===String(t??""))??e.initialValue;return l(p,{name:e.cellName,options:e.options,disabled:e.disabledEdit,initialValue:a},e.cellName)}return l(s,{label:e.cellText,name:e.cellName,type:e.cellType,step:"number"===e.cellType?.01:void 0,defaultValue:String(t??""),disabled:e.disabledEdit,placeholder:e.cellText},e.cellName)})}),e(d,{layout:"flex",widthMax:"100%",padding:"0",justifyContent:R?"space-between":"flex-end",alignItems:"right",margin:"20px 0 0 0",children:[R&&l(o,{type:"button",height:"40px",width:"auto",padding:"0 10px",disabled:Y||A,backgroundColor:"red",backgroundColorDisabled:"grey",onClick:()=>{R&&M&&D(!0)},children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Delete"})}),l(o,{type:"submit",height:"40px",width:"auto",padding:"0 10px",disabled:Y||A,backgroundColor:"#4BB543",backgroundColorDisabled:"grey",children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Save changes"})})]})]},N)]})}),R&&l(n,{open:z,onCancel:G?U:Q,widthMax:"450px",children:e(d,{layout:"container",widthMin:"min(400px, calc(100vw - 25px))",padding:"0px 30px 30px 30px",margin:"auto",children:[l(g,{appearance:"light",variant:"subheading",style:{margin:"0 0 10px 0"},children:G?"Deleted":"Are you sure?"}),!G&&l(b,{tag:"p",desktopSize:16,mobileSize:16,fontWeight:400,color:"black",children:"This row will be permanently deleted. This action cannot be undone."}),L&&!G&&l(b,{tag:"p",desktopSize:16,mobileSize:16,fontWeight:400,color:"red",style:{margin:"10px 0 0 0"},children:X??"Delete failed"}),G&&l(b,{tag:"p",desktopSize:16,mobileSize:16,fontWeight:400,color:"#4BB543",children:K??"Row deleted"}),l(d,{layout:"flex",widthMax:"100%",padding:"0",justifyContent:G?"flex-end":"space-between",margin:"20px 0 0 0",children:G?l(o,{type:"button",height:"40px",width:"auto",padding:"0 10px",backgroundColor:"#4BB543",onClick:U,children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Close"})}):e(t,{children:[l(o,{type:"button",height:"40px",width:"auto",padding:"0 10px",disabled:A,backgroundColor:"grey",backgroundColorDisabled:"grey",onClick:Q,children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Cancel"})}),l(o,{type:"button",height:"40px",width:"auto",padding:"0 10px",disabled:A,backgroundColor:"red",backgroundColorDisabled:"grey",onClick:()=>{P&&M&&P(M.id)},children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Yes, delete"})})]})})]})}),e("table",{className:u.table,"aria-busy":k,children:[l("thead",{children:l("tr",{children:H.map(e=>l("th",{scope:"col",children:l(b,{mobileSize:16,desktopSize:20,color:"black",textAlign:e.thAlign??"left",children:e.cellText})},e.cellName))})}),l("tbody",{children:k?l("tr",{children:l("td",{className:u.loadingCell,colSpan:Math.max(H.length,1),children:l("div",{className:u.loadingInner,children:l(c,{})})})}):f.rows.map(e=>l("tr",{children:H.map(t=>{const a=e[t.cellName];return l("td",{"data-clickable":O,onClick:O?()=>(e=>{B(e),j(!0),E(e=>e+1)})(e):void 0,children:l(b,{fontWeight:400,mobileSize:16,desktopSize:16,color:"black",textAlign:t.tdAlign??"left",children:void 0===a?"":String(a)})},t.cellName)})},e.id))})]})]})};x.displayName="Table";export{x as Table};
+import{jsxs as e,jsx as l,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{B as a}from"../Button-QC014EKI.js";import{C as i}from"../Calendar-BkDrBfRy.js";import{D as n}from"../Dialog-8B0xk8Wx.js";import{F as r}from"../Form-CgTuTB2Q.js";import{G as d}from"../Grid-DmI4tqqG.js";import{I as s}from"../Input-Bl7_BOs4.js";import{L as c}from"../LoaderDots-BoEg_zlZ.js";import{S as p}from"../Select-QBTZllFj.js";import{T as b}from"../TextBox-__k4jPYK.js";import{T as h}from"../Typography-CZqNLAT7.js";import{s as g,g as m}from"../style-inject.es-CrVRO2OA.js";import"../Loader-ZYEBOkbx.js";import"../IconLocate-CQda7FAB.js";import"../validator/index.js";var u={n23mTable:"Table-module_n23mTable__kKVd9",table:"Table-module_table__hJFsY",loadingCell:"Table-module_loadingCell__mIX-P",loadingInner:"Table-module_loadingInner__GlNjv"};g('@layer n23mTable{.Table-module_n23mTable__kKVd9{--hover-bg:rgba(0,0,0,.11);background-attachment:local,local,scroll,scroll;background-color:#fff;background-image:linear-gradient(90deg,#fff 20px,hsla(0,0%,100%,0)),linear-gradient(270deg,#fff 20px,hsla(0,0%,100%,0)),radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.25),transparent),radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.25),transparent);background-position:0,100%,0,100%;background-repeat:no-repeat;background-size:40px 100%,40px 100%,14px 100%,14px 100%;isolation:isolate;overflow-x:auto;overflow-y:hidden}.Table-module_n23mTable__kKVd9:focus-visible{outline:2px solid currentcolor;outline-offset:2px}.Table-module_table__hJFsY{border-collapse:collapse;min-width:max-content;width:100%}.Table-module_table__hJFsY td,.Table-module_table__hJFsY th{border:1px solid grey;padding:10px 12px;position:relative}.Table-module_table__hJFsY td[data-clickable=true]{-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.Table-module_table__hJFsY td.Table-module_loadingCell__mIX-P{cursor:default;padding:0}.Table-module_loadingInner__GlNjv{align-items:flex-start;box-sizing:border-box;display:flex;justify-content:flex-start;min-height:var(--table-loading-height,219.25px);padding:10px}@media (hover:hover){.Table-module_table__hJFsY tbody tr:hover>td{background-color:var(--hover-bg)}.Table-module_table__hJFsY tbody td:hover:after{background-color:var(--hover-bg);content:"";inset:-100vh 0;pointer-events:none;position:absolute;z-index:-1}.Table-module_table__hJFsY tbody tr:hover>td.Table-module_loadingCell__mIX-P{background-color:transparent}.Table-module_table__hJFsY tbody td.Table-module_loadingCell__mIX-P:hover:after{content:none}}}');const x=({className:g,jsonSchema:x,jsonData:f,cellEdit:_,cellDelete:k,onCellReset:y,isLoading:T=!1,style:v,tableLoadingHeight:C,...S})=>{const[w,j]=o(!1),[z,D]=o(!1),[N,E]=o(0),[M,B]=o(null),{onCellEdit:F,isCellEditError:I=!1,isCellEditPending:Y=!1,isCellEditSuccess:J=!1,cellEditErrorMsg:O,cellEditSuccessMsg:W}=_??{},{onCellDelete:V,isCellDeleteError:P=!1,isCellDeletePending:L=!1,isCellDeleteSuccess:A=!1,cellDeleteErrorMsg:G,cellDeleteSuccessMsg:X}=k??{},K=Boolean(F),R=Boolean(V),H=x.cols.filter(e=>"id"!==e.cellName),q=()=>{y&&setTimeout(()=>y(),300)},Q=()=>{D(!1),q()},U=()=>{D(!1),j(!1),q()};return e("div",{className:[u.n23mTable,"n23mTable",g].filter(Boolean).join(" "),...S,style:{...m({"--table-loading-height":C}),...v},children:[K&&l(n,{open:w,onCancel:()=>{j(!1),q()},widthMax:"900px",children:e(d,{layout:"container",widthMin:"min(800px, calc(100vw - 25px))",padding:"0px 30px 30px 30px",margin:"auto",children:[l(h,{appearance:"light",variant:"subheading",style:{margin:"0 0 20px 0"},children:"Edit Cell"}),e(r,{onSubmit:e=>{if(!F)return;if(Object.values(e).some(({error:e})=>e))return;const l=Object.fromEntries(Object.entries(e).map(([e,{value:l}])=>[e,l]));F(l)},isError:I,isPending:Y,isSuccess:J,errorMsg:O,successMsg:W,children:[l(d,{layout:"columns",col:{smallDesktop:2},gap:{col:"20px"},children:M&&x.cols.map(e=>{const t=M[e.cellName];if("date"===e.cellType){const o=t||e.initialValue;return l(i,{label:e.cellText,name:e.cellName,disabled:e.disabledEdit,initialValue:o,placeholder:e.cellText,validatorOptions:e.validatorOptions},e.cellName)}if("select"===e.cellType){const o=e.options.find(e=>e.value===String(t??""))??e.initialValue;return l(p,{name:e.cellName,options:e.options,disabled:e.disabledEdit,initialValue:o,validatorOptions:e.validatorOptions},e.cellName)}return l(s,{label:e.cellText,name:e.cellName,type:e.cellType,step:"number"===e.cellType?.01:void 0,defaultValue:String(t??""),disabled:e.disabledEdit,placeholder:e.cellText,validatorOptions:e.validatorOptions},e.cellName)})}),e(d,{layout:"flex",widthMax:"100%",padding:"0",justifyContent:R?"space-between":"flex-end",alignItems:"right",margin:"20px 0 0 0",children:[R&&l(a,{type:"button",height:"40px",width:"auto",padding:"0 10px",disabled:Y||L,backgroundColor:"red",backgroundColorDisabled:"grey",onClick:()=>{R&&M&&D(!0)},children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Delete"})}),l(a,{type:"submit",height:"40px",width:"auto",padding:"0 10px",disabled:Y||L,backgroundColor:"#4BB543",backgroundColorDisabled:"grey",children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Save changes"})})]})]},N)]})}),R&&l(n,{open:z,onCancel:A?U:Q,widthMax:"450px",children:e(d,{layout:"container",widthMin:"min(400px, calc(100vw - 25px))",padding:"0px 30px 30px 30px",margin:"auto",children:[l(h,{appearance:"light",variant:"subheading",style:{margin:"0 0 10px 0"},children:A?"Deleted":"Are you sure?"}),!A&&l(b,{tag:"p",desktopSize:16,mobileSize:16,fontWeight:400,color:"black",children:"This row will be permanently deleted. This action cannot be undone."}),P&&!A&&l(b,{tag:"p",desktopSize:16,mobileSize:16,fontWeight:400,color:"red",style:{margin:"10px 0 0 0"},children:G??"Delete failed"}),A&&l(b,{tag:"p",desktopSize:16,mobileSize:16,fontWeight:400,color:"#4BB543",children:X??"Row deleted"}),l(d,{layout:"flex",widthMax:"100%",padding:"0",justifyContent:A?"flex-end":"space-between",margin:"20px 0 0 0",children:A?l(a,{type:"button",height:"40px",width:"auto",padding:"0 10px",backgroundColor:"#4BB543",onClick:U,children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Close"})}):e(t,{children:[l(a,{type:"button",height:"40px",width:"auto",padding:"0 10px",disabled:L,backgroundColor:"grey",backgroundColorDisabled:"grey",onClick:Q,children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Cancel"})}),l(a,{type:"button",height:"40px",width:"auto",padding:"0 10px",disabled:L,backgroundColor:"red",backgroundColorDisabled:"grey",onClick:()=>{V&&M&&V(M.id)},children:l(b,{tag:"span",desktopSize:16,mobileSize:16,fontWeight:400,color:"white",children:"Yes, delete"})})]})})]})}),e("table",{className:u.table,"aria-busy":T,children:[l("thead",{children:l("tr",{children:H.map(e=>l("th",{scope:"col",children:l(b,{mobileSize:16,desktopSize:20,color:"black",textAlign:e.thAlign??"left",children:e.cellText})},e.cellName))})}),l("tbody",{children:T?l("tr",{children:l("td",{className:u.loadingCell,colSpan:Math.max(H.length,1),children:l("div",{className:u.loadingInner,children:l(c,{})})})}):f.rows.map(e=>l("tr",{children:H.map(t=>{const o=e[t.cellName];return l("td",{"data-clickable":K,onClick:K?()=>(e=>{B(e),j(!0),E(e=>e+1)})(e):void 0,children:l(b,{fontWeight:400,mobileSize:16,desktopSize:16,color:"black",textAlign:t.tdAlign??"left",children:void 0===o?"":String(o)})},t.cellName)})},e.id))})]})]})};x.displayName="Table";export{x as Table};

package/lib/validator/index.d.ts

@@ -1,3 +1,4 @@
-import { type ValidatorOptions, validator } from './validator';
+import { validator } from './validator';
+import { ValidatorOptions } from './validator.types';
 export type { ValidatorOptions };
 export { validator };

package/lib/validator/validator.d.ts

@@ -1,39 +1,2 @@
-type ValidatorOption = {
-    type: 'empty';
-} | {
-    type: 'email';
-} | {
-    type: 'numberInRange';
-    options?: {
-        min?: number;
-        max?: number;
-    };
-} | {
-    type: 'naturalNumber';
-} | {
-    type: 'decimalDigits';
-    options?: {
-        digits: number;
-    };
-} | {
-    type: 'date';
-} | {
-    type: 'json';
-} | {
-    type: 'equal';
-    options: {
-        ref: React.RefObject<HTMLInputElement | null>;
-    };
-} | {
-    type: 'existsInOptions';
-    options: {
-        options: {
-            value: string;
-            label: string;
-        }[];
-        matchBy?: 'value' | 'label';
-    };
-};
-export type ValidatorOptions = ValidatorOption[];
+import { ValidatorOptions } from './validator.types';
 export declare const validator: (value: string, validatorOptions: ValidatorOptions) => string[];
-export {};

package/lib/validator/validator.types.d.ts

@@ -0,0 +1,38 @@
+export type ValidatorOption = {
+    type: 'empty';
+} | {
+    type: 'email';
+} | {
+    type: 'numberInRange';
+    options?: {
+        min?: number;
+        max?: number;
+    };
+} | {
+    type: 'naturalNumber';
+} | {
+    type: 'decimalDigits';
+    options?: {
+        digits: number;
+    };
+} | {
+    type: 'date';
+} | {
+    type: 'json';
+} | {
+    type: 'equal';
+    options: {
+        ref: React.RefObject<HTMLInputElement | null>;
+    };
+} | {
+    type: 'existsInOptions';
+    options: {
+        options: {
+            value: string;
+            label: string;
+        }[];
+        matchBy?: 'value' | 'label';
+    };
+};
+export type ValidatorOptions = ValidatorOption[];
+export type ValidatorFn = (value: string, options?: any) => string | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "najwer23morsels",
-  "version": "1.10.30",
+  "version": "1.10.32",
   "exports": {
     "./lib/*": {
       "types": "./lib/*/index.d.ts",