intable 0.0.27 → 0.0.29

package/dist/__uno.css

@@ -1 +1 @@
-@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--un-bg-opacity:100%;--un-leading:initial;--un-content:"";--un-translate-x:initial;--un-translate-y:initial;--un-translate-z:initial;--un-text-opacity:100%;--un-border-opacity:100%;--un-space-y-reverse:initial;--un-space-x-reverse:initial;--un-outline-style:solid;--un-outline-opacity:100%}}@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-leading{syntax:"*";inherits:false}@property --un-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --un-outline-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-inset-ring-color{syntax:"*";inherits:false}@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow-color{syntax:"*";inherits:false}@property --un-ring-color{syntax:"*";inherits:false}@property --un-ring-inset{syntax:"*";inherits:false}@property --un-ring-offset-color{syntax:"*";inherits:false}@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow-color{syntax:"*";inherits:false}@property --un-translate-x{syntax:"*";inherits:false;initial-value:0}@property --un-translate-y{syntax:"*";inherits:false;initial-value:0}@property --un-translate-z{syntax:"*";inherits:false;initial-value:0}@property --un-space-y-reverse{syntax:"*";inherits:false;initial-value:0}:root,:host{--spacing:.25rem;--radius-DEFAULT:.25rem;--colors-gray-DEFAULT:#99a1af;--text-sm-fontSize:.875rem;--text-sm-lineHeight:1.25rem;--radius-md:.375rem;--default-transition-timingFunction:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--radius-xl:.75rem;--fontWeight-medium:500;--radius-sm:.25rem;--colors-blue-DEFAULT:#54a2ff;--colors-red-DEFAULT:#ff6568;--text-2xl-fontSize:1.5rem;--text-2xl-lineHeight:2rem;--text-xs-fontSize:.75rem;--text-xs-lineHeight:1rem;--colors-green-DEFAULT:#05df72;--colors-black:#000;--font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--default-font-family:var(--font-sans);--default-monoFont-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--colors-gray-DEFAULT:lab(65.9269% -.832677 -8.17474);--colors-blue-DEFAULT:lab(65.0361% -1.42065 -56.9802);--colors-red-DEFAULT:lab(63.7053% 60.745 31.3109);--colors-green-DEFAULT:lab(78.503% -64.9264 39.7492)}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-featureSettings,normal);font-variation-settings:var(--default-font-variationSettings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-monoFont-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-monoFont-featureSettings,normal);font-variation-settings:var(--default-monoFont-variationSettings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden~=until-found])){display:none!important}.container{width:100%}.aic{align-items:center}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.text-2xl{font-size:var(--text-2xl-fontSize);line-height:var(--un-leading,var(--text-2xl-lineHeight))}.text-3{font-size:.75rem}.text-3\.5{font-size:.875rem}.text-4{font-size:1rem}.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading,var(--text-xs-lineHeight))}.c-\#1e3a8a{color:color-mix(in oklab,#1e3a8a var(--un-text-opacity),transparent)}.c-\#7c2d12{color:color-mix(in oklab,#7c2d12 var(--un-text-opacity),transparent)}.c-blue{color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in srgb,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in srgb,var(--colors-red-DEFAULT)75%,transparent)}.leading-5{--un-leading:calc(4px*5);line-height:20px}.lh-\[1\]{--un-leading:1;line-height:1}.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium)}.m9{margin:36px}.mx-1{margin-inline:4px}.mx-3\!{margin-inline:12px!important}.my-1{margin-block:4px}.ml{margin-left:16px}.ml-\.5{margin-left:2px}.ml-1{margin-left:4px}.mr--1{margin-right:-4px}.mr-1{margin-right:4px}.mr-2{margin-right:8px}.mr-2\.5{margin-right:10px}.mt-1{margin-top:4px}.p-1{padding:4px}.p-4\!{padding:16px!important}.px,.px-4{padding-inline:16px}.px-1\.5{padding-inline:6px}.px-2{padding-inline:8px}.py-1{padding-block:4px}.py-1\.5{padding-block:6px}.py-2{padding-block:8px}.pl-1{padding-left:4px}.pl-4{padding-left:16px}.pr-4{padding-right:16px}.ps{padding-inline-start:16px}.outline-0{outline-style:var(--un-outline-style);outline-width:0}.outline-2{outline-style:var(--un-outline-style);outline-width:2px}.outline-blue{outline-color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.outline-none{--un-outline-style:none;outline-style:none}.b,.b-1,.border{border-width:1px}.b-r-0{border-right-width:0}.b-\#00000000\!{border-color:color-mix(in oklab,#0000 var(--un-border-opacity),transparent)!important}.b-\#4f7ff0{border-color:color-mix(in oklab,#4f7ff0 var(--un-border-opacity),transparent)}.b-\#f59e0b{border-color:color-mix(in oklab,#f59e0b var(--un-border-opacity),transparent)}.rd-2{border-radius:.5rem}.rd-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rd-l-4{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.b-dashed{--un-border-style:dashed;border-style:dashed}.b-solid{--un-border-style:solid;border-style:solid}.bg-\#dbe6ff\/75{background-color:#dbe6ffbf;background-color:lab(91.0303% -.143617 -13.4803/.75)}.bg-\#fff{background-color:color-mix(in oklab,#fff var(--un-bg-opacity),transparent)}.bg-\#fff3d6\/85{background-color:#fff3d6d9;background-color:lab(96.236% .744313 15.5662/.85)}.bg-blue\/20\!{background-color:color-mix(in srgb,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in srgb,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in srgb,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in srgb,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-transparent{background-color:#0000}.hover\:bg-black\/8:hover{background-color:color-mix(in srgb,var(--colors-black)8%,transparent)}.op-0{opacity:0}.op-15{opacity:.15}.op-60{opacity:.6}.op-75{opacity:.75}.op40{opacity:.4}.group:hover .group-hover\:op-100{opacity:1}.flex{display:flex}.flex-1{flex:1}.flex-shrink{flex-shrink:1}.flex-shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-1{gap:4px}.gap-1\.5{gap:6px}.gap-2{gap:8px}.grid{display:grid}.size-3\.5{width:14px;height:14px}.size-4\!{width:16px!important;height:16px!important}.size-full{width:100%;height:100%}.h-1\!{height:4px!important}.h-6{height:24px}.h-a\!{height:auto!important}.h-full{height:100%}.max-h-100{max-height:400px}.min-h-16{min-height:64px}.min-h-40{min-height:160px}.min-h-a\!{min-height:auto!important}.min-w-24{min-width:96px}.min-w-52{min-width:208px}.w-10{width:40px}.w-10px\!{width:10px!important}.w-a\!{width:auto!important}.after\:h-1:after{height:4px}.after\:w-1:after{width:4px}.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.contents{display:contents}.hidden{display:none}.visible{visibility:visible}.collapse{visibility:collapse}.cursor-s-resize{cursor:s-resize}.cursor-w-resize{cursor:w-resize}.pointer-events-none{pointer-events:none}.resize{resize:both}.resize-none{resize:none}.select-none{-webkit-user-select:none;user-select:none}.shadow-sm{--un-shadow:0 1px 3px 0 var(--un-shadow-color,#0000001a),0 1px 2px -1px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow),var(--un-inset-ring-shadow),var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.translate-x--1\/2{--un-translate-x:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-x-1\/2{--un-translate-x:50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-y--1\/2{--un-translate-y:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.transform{transform:var(--un-rotate-x)var(--un-rotate-y)var(--un-rotate-z)var(--un-skew-x)var(--un-skew-y)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.items-start{align-items:flex-start}.items-center{align-items:center}.box-border{box-sizing:border-box}.inset-0{inset:0}.bottom-0{bottom:0}.left--0,.left-0{left:0}.right-0{right:0}.top-0{top:0}.top-1\/2{top:50%}.justify-end\!{justify-content:flex-end!important}.justify-center{justify-content:center}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.z--1{z-index:-1}.z-1{z-index:1}.z-2{z-index:2}.z-9{z-index:9}.overflow-auto{overflow:auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.filter{filter:var(--un-blur,)var(--un-brightness,)var(--un-contrast,)var(--un-grayscale,)var(--un-hue-rotate,)var(--un-invert,)var(--un-saturate,)var(--un-sepia,)var(--un-drop-shadow,)}.table{display:table}.table-cell{display:table-cell}:where(.space-y-5>:not(:last-child)){--un-space-y-reverse:0;margin-block-start:calc(calc(4px*5)*var(--un-space-y-reverse));margin-block-end:calc(calc(4px*5)*calc(1 - var(--un-space-y-reverse)))}@supports (color:color-mix(in lab, red, red)){.c-blue{color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in oklab,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in oklab,var(--colors-red-DEFAULT)75%,transparent)}.outline-blue{outline-color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.bg-blue\/20\!{background-color:color-mix(in oklab,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in oklab,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in oklab,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in oklab,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.hover\:bg-black\/8:hover{background-color:color-mix(in oklab,var(--colors-black)8%,transparent)}}
+@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--un-bg-opacity:100%;--un-leading:initial;--un-content:"";--un-translate-x:initial;--un-translate-y:initial;--un-translate-z:initial;--un-text-opacity:100%;--un-border-opacity:100%;--un-space-y-reverse:initial;--un-space-x-reverse:initial;--un-outline-style:solid;--un-outline-opacity:100%}}@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-leading{syntax:"*";inherits:false}@property --un-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --un-outline-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-inset-ring-color{syntax:"*";inherits:false}@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow-color{syntax:"*";inherits:false}@property --un-ring-color{syntax:"*";inherits:false}@property --un-ring-inset{syntax:"*";inherits:false}@property --un-ring-offset-color{syntax:"*";inherits:false}@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow-color{syntax:"*";inherits:false}@property --un-translate-x{syntax:"*";inherits:false;initial-value:0}@property --un-translate-y{syntax:"*";inherits:false;initial-value:0}@property --un-translate-z{syntax:"*";inherits:false;initial-value:0}@property --un-space-y-reverse{syntax:"*";inherits:false;initial-value:0}:root,:host{--spacing:.25rem;--radius-DEFAULT:.25rem;--colors-gray-DEFAULT:#99a1af;--text-sm-fontSize:.875rem;--text-sm-lineHeight:1.25rem;--default-transition-timingFunction:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--radius-md:.375rem;--radius-xl:.75rem;--fontWeight-medium:500;--radius-sm:.25rem;--colors-blue-DEFAULT:#54a2ff;--colors-red-DEFAULT:#ff6568;--text-2xl-fontSize:1.5rem;--text-2xl-lineHeight:2rem;--text-xs-fontSize:.75rem;--text-xs-lineHeight:1rem;--colors-green-DEFAULT:#05df72;--colors-black:#000;--font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--default-font-family:var(--font-sans);--default-monoFont-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--colors-gray-DEFAULT:lab(65.9269% -.832677 -8.17474);--colors-blue-DEFAULT:lab(65.0361% -1.42065 -56.9802);--colors-red-DEFAULT:lab(63.7053% 60.745 31.3109);--colors-green-DEFAULT:lab(78.503% -64.9264 39.7492)}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-featureSettings,normal);font-variation-settings:var(--default-font-variationSettings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-monoFont-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-monoFont-featureSettings,normal);font-variation-settings:var(--default-monoFont-variationSettings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden~=until-found])){display:none!important}.container{width:100%}.aic{align-items:center}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.text-2xl{font-size:var(--text-2xl-fontSize);line-height:var(--un-leading,var(--text-2xl-lineHeight))}.text-3{font-size:.75rem}.text-3\.5{font-size:.875rem}.text-4{font-size:1rem}.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading,var(--text-xs-lineHeight))}.c-\#1e3a8a{color:color-mix(in oklab,#1e3a8a var(--un-text-opacity),transparent)}.c-\#7c2d12{color:color-mix(in oklab,#7c2d12 var(--un-text-opacity),transparent)}.c-blue{color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in srgb,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in srgb,var(--colors-red-DEFAULT)75%,transparent)}.leading-5{--un-leading:calc(4px*5);line-height:20px}.lh-\[1\]{--un-leading:1;line-height:1}.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium)}.m9{margin:36px}.mx-1{margin-inline:4px}.mx-3\!{margin-inline:12px!important}.my-1{margin-block:4px}.ml{margin-left:16px}.ml-\.5{margin-left:2px}.ml-1{margin-left:4px}.mr--1{margin-right:-4px}.mr-1{margin-right:4px}.mr-2{margin-right:8px}.mr-2\.5{margin-right:10px}.mt-1{margin-top:4px}.p-1{padding:4px}.p-4\!{padding:16px!important}.px,.px-4{padding-inline:16px}.px-1\.5{padding-inline:6px}.px-2{padding-inline:8px}.py-1{padding-block:4px}.py-1\.5{padding-block:6px}.py-2{padding-block:8px}.pl-1{padding-left:4px}.pl-4{padding-left:16px}.pr-4{padding-right:16px}.ps{padding-inline-start:16px}.outline-0{outline-style:var(--un-outline-style);outline-width:0}.outline-2{outline-style:var(--un-outline-style);outline-width:2px}.outline-blue{outline-color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.outline-none{--un-outline-style:none;outline-style:none}.b,.b-1,.border{border-width:1px}.b-r-0{border-right-width:0}.b-\#00000000\!{border-color:color-mix(in oklab,#0000 var(--un-border-opacity),transparent)!important}.b-\#4f7ff0{border-color:color-mix(in oklab,#4f7ff0 var(--un-border-opacity),transparent)}.b-\#f59e0b{border-color:color-mix(in oklab,#f59e0b var(--un-border-opacity),transparent)}.rd-2{border-radius:.5rem}.rd-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rd-l-4{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.b-dashed{--un-border-style:dashed;border-style:dashed}.b-solid{--un-border-style:solid;border-style:solid}.bg-\#dbe6ff\/75{background-color:#dbe6ffbf;background-color:lab(91.0303% -.143617 -13.4803/.75)}.bg-\#fff{background-color:color-mix(in oklab,#fff var(--un-bg-opacity),transparent)}.bg-\#fff3d6\/85{background-color:#fff3d6d9;background-color:lab(96.236% .744313 15.5662/.85)}.bg-blue\/20\!{background-color:color-mix(in srgb,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in srgb,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in srgb,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in srgb,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-transparent{background-color:#0000}.hover\:bg-black\/8:hover{background-color:color-mix(in srgb,var(--colors-black)8%,transparent)}.op-0{opacity:0}.op-15{opacity:.15}.op-60{opacity:.6}.op-75{opacity:.75}.op40{opacity:.4}.group:hover .group-hover\:op-100{opacity:1}.flex{display:flex}.flex-1{flex:1}.flex-shrink{flex-shrink:1}.flex-shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-1{gap:4px}.gap-1\.5{gap:6px}.gap-2{gap:8px}.grid{display:grid}.size-3\.5{width:14px;height:14px}.size-4\!{width:16px!important;height:16px!important}.size-full{width:100%;height:100%}.h-1\!{height:4px!important}.h-6{height:24px}.h-a\!{height:auto!important}.h-full{height:100%}.max-h-100{max-height:400px}.max-h-inherit{max-height:inherit}.min-h-16{min-height:64px}.min-h-40{min-height:160px}.min-h-a\!{min-height:auto!important}.min-w-24{min-width:96px}.min-w-52{min-width:208px}.w-10{width:40px}.w-10px\!{width:10px!important}.w-a\!{width:auto!important}.after\:h-1:after{height:4px}.after\:w-1:after{width:4px}.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.contents{display:contents}.hidden{display:none}.visible{visibility:visible}.collapse{visibility:collapse}.cursor-s-resize{cursor:s-resize}.cursor-w-resize{cursor:w-resize}.pointer-events-none{pointer-events:none}.resize{resize:both}.resize-none{resize:none}.select-none{-webkit-user-select:none;user-select:none}.shadow-sm{--un-shadow:0 1px 3px 0 var(--un-shadow-color,#0000001a),0 1px 2px -1px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow),var(--un-inset-ring-shadow),var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.translate-x--1\/2{--un-translate-x:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-x-1\/2{--un-translate-x:50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-y--1\/2{--un-translate-y:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.transform{transform:var(--un-rotate-x)var(--un-rotate-y)var(--un-rotate-z)var(--un-skew-x)var(--un-skew-y)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.items-start{align-items:flex-start}.items-center{align-items:center}.box-border{box-sizing:border-box}.inset-0{inset:0}.bottom-0{bottom:0}.left--0,.left-0{left:0}.right-0{right:0}.top-0{top:0}.top-1\/2{top:50%}.justify-end\!{justify-content:flex-end!important}.justify-center{justify-content:center}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.z--1{z-index:-1}.z-1{z-index:1}.z-2{z-index:2}.z-9{z-index:9}.overflow-auto{overflow:auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.filter{filter:var(--un-blur,)var(--un-brightness,)var(--un-contrast,)var(--un-grayscale,)var(--un-hue-rotate,)var(--un-invert,)var(--un-saturate,)var(--un-sepia,)var(--un-drop-shadow,)}.table{display:table}.table-cell{display:table-cell}:where(.space-y-5>:not(:last-child)){--un-space-y-reverse:0;margin-block-start:calc(calc(4px*5)*var(--un-space-y-reverse));margin-block-end:calc(calc(4px*5)*calc(1 - var(--un-space-y-reverse)))}@supports (color:color-mix(in lab, red, red)){.c-blue{color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in oklab,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in oklab,var(--colors-red-DEFAULT)75%,transparent)}.outline-blue{outline-color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.bg-blue\/20\!{background-color:color-mix(in oklab,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in oklab,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in oklab,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in oklab,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.hover\:bg-black\/8:hover{background-color:color-mix(in oklab,var(--colors-black)8%,transparent)}}

package/dist/hooks/useVirtualizer.d.ts

@@ -4,6 +4,8 @@ interface VirtualizerOptions {
     batch?: number;
     getScrollElement: () => Element;
     horizontal?: boolean;
+    paddingStart?: number;
+    paddingEnd?: number;
     count: number;
     estimateSize: (i: number) => number;
     extras?: (startIdx: number, endIdx: number) => number[];
@@ -26,5 +28,6 @@ export declare function useVirtualizer(opt: VirtualizerOptions): {
         end: number;
         index: number;
     };
+    scrollToIndex: (i: number, center?: boolean) => void;
 };
 export {};

package/dist/hooks/useVirtualizer.js

@@ -66,7 +66,7 @@ function useVirtualizer(d) {
 		if (v(), !d.enable) return Array.from({ length: d.count }, (e, s) => S(s));
 		let e = [];
 		for (let s = C(); s <= w(); s++) e.push(S(s));
-		return d.extras && (e.push(...d.extras(C(), w())?.map((e) => S(e)) || []), e = uniqBy(e, (e) => e.index)), e;
+		return d.extras && (e.push(...d.extras(C(), w())?.map((e) => S(e)) || []), e = uniqBy(e, (e) => e.index), e.sort((e, s) => e.index - s.index)), e;
 	});
 	return {
 		options: d,
@@ -87,7 +87,17 @@ function useVirtualizer(d) {
 		getVirtualItem: (() => {
 			let e = createMemo(() => keyBy(T(), (e) => e.index));
 			return (s) => e()[s];
-		})()
+		})(),
+		scrollToIndex: (e, s) => {
+			let c = d.getScrollElement(), l = _.sum(e - 1);
+			d.horizontal ? c.scrollTo({
+				left: l + (s ? -c.offsetWidth / 2 : 0),
+				behavior: "instant"
+			}) : c.scrollTo({
+				top: l + (s ? -c.offsetHeight / 2 : 0),
+				behavior: "instant"
+			});
+		}
 	};
 }
 export { useVirtualizer };

package/dist/index.d.ts

@@ -70,7 +70,7 @@ export interface TableProps {
     Table?: Component<any>;
     Thead?: Component<any>;
     Tbody?: Component<any>;
-    Td?: TD;
+    Td?: Component<TDProps>;
     Th?: Component<THProps>;
     Tr?: Component<{
         y?: number;
@@ -112,11 +112,11 @@ export type TDProps = {
     y: number;
     data: any;
     col: TableColumn;
+    value?: any;
     children?: JSX.Element;
     rowspan?: number;
     colspan?: number;
 };
-export type TD = Component<TDProps>;
 type Obj = Record<string | symbol, any>;
 export interface TableColumn extends Obj {
     id: any;
@@ -125,7 +125,6 @@ export interface TableColumn extends Obj {
     fixed?: 'left' | 'right';
     class?: any;
     style?: any;
-    props?: (props: any) => JSX.HTMLAttributes<any>;
 }
 type Nullable<T> = T | undefined;
 export interface TableStore extends Obj {

package/dist/index.js

@@ -26,7 +26,7 @@ import { createLazyMemo } from "@solid-primitives/memo";
 import { createElementSize, createResizeObserver, makeResizeObserver } from "@solid-primitives/resize-observer";
 import { createScrollPosition } from "@solid-primitives/scroll";
 import { difference, isEqual, memoize, sumBy } from "es-toolkit";
-var _tmpl$ = /* @__PURE__ */ template("<div>"), _tmpl$2 = /* @__PURE__ */ template("<table>"), _tmpl$3 = /* @__PURE__ */ template("<thead>"), _tmpl$4 = /* @__PURE__ */ template("<tbody>"), _tmpl$5 = /* @__PURE__ */ template("<tr>"), _tmpl$6 = /* @__PURE__ */ template("<th>"), _tmpl$7 = /* @__PURE__ */ template("<td>"), _tmpl$8 = /* @__PURE__ */ template("<div class=data-table__layers>"), _tmpl$9 = /* @__PURE__ */ template("<div class=\"data-table--scroll-view h-full\">"), _tmpl$0 = /* @__PURE__ */ template("<div class=data-table__empty>No data"), _tmpl$1 = /* @__PURE__ */ template("<div class=data-table__loading>");
+var _tmpl$ = /* @__PURE__ */ template("<div>"), _tmpl$2 = /* @__PURE__ */ template("<table>"), _tmpl$3 = /* @__PURE__ */ template("<thead>"), _tmpl$4 = /* @__PURE__ */ template("<tbody>"), _tmpl$5 = /* @__PURE__ */ template("<tr>"), _tmpl$6 = /* @__PURE__ */ template("<th>"), _tmpl$7 = /* @__PURE__ */ template("<td>"), _tmpl$8 = /* @__PURE__ */ template("<div class=data-table__layers>"), _tmpl$9 = /* @__PURE__ */ template("<div class=\"data-table--scroll-view h-full max-h-inherit\">"), _tmpl$0 = /* @__PURE__ */ template("<div class=data-table__empty>No data"), _tmpl$1 = /* @__PURE__ */ template("<div class=data-table__loading>");
 const Ctx = createContext({
 	props: {},
 	store: {}
@@ -34,7 +34,7 @@ const Ctx = createContext({
 	K = mergeProps$1({ rowKey: "id" }, K);
 	let q = getOwner(), J = createMutable({
 		get rawProps() {
-			return K;
+			return K[$PROXY] ||= K;
 		},
 		get plugins() {
 			return X();
@@ -132,7 +132,7 @@ var THead = () => {
 							get data() {
 								return K();
 							},
-							get children() {
+							get value() {
 								return K()[J().id];
 							}
 						})

package/dist/plugins/CellMergePlugin.js

@@ -1,6 +1,5 @@
-import { createComponent } from "solid-js/web";
+import { createComponent, mergeProps } from "solid-js/web";
 import { Show, createMemo } from "solid-js";
-import { combineProps } from "@solid-primitives/props";
 function buildMergeMap(e, t, n) {
 	let r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Set();
 	for (let a = 0; a < e.length; a++) for (let o = 0; o < t.length; o++) {
@@ -27,28 +26,28 @@ function buildMergeMap(e, t, n) {
 const CellMergePlugin = {
 	name: "cell-merge",
 	rewriteProps: {
-		Table: ({ Table: t }, { store: r }) => (a) => (r._mergeMap ??= createMemo(() => {
-			let { merge: e, data: t, columns: n } = r.props;
-			return !e && !n?.some((e) => e.mergeRow) || !t?.length || !n?.length ? {
+		Table: ({ Table: t }, { store: n }) => (a) => (n._mergeMap ??= createMemo(() => {
+			let { merge: e, data: t, columns: r } = n.props;
+			return !e && !r?.some((e) => e.mergeRow) || !t?.length || !r?.length ? {
 				spans: /* @__PURE__ */ new Map(),
 				covered: /* @__PURE__ */ new Set()
-			} : buildMergeMap(t, n, e);
+			} : buildMergeMap(t, r, e);
 		}), createComponent(t, a)),
-		Td: ({ Td: n }, { store: i }) => (a) => {
+		Td: ({ Td: r }, { store: i }) => (a) => {
 			let o = () => `${a.y},${a.x}`, s = () => i._mergeMap?.().covered.has(o()) ?? !1, c = () => i._mergeMap?.().spans.get(o());
-			return a = combineProps(a, {
-				get rowspan() {
-					return c()?.rowspan;
-				},
-				get colspan() {
-					return c()?.colspan;
-				}
-			}), createComponent(Show, {
+			return createComponent(Show, {
 				get when() {
 					return !s();
 				},
 				get children() {
-					return createComponent(n, a);
+					return createComponent(r, mergeProps(a, {
+						get rowspan() {
+							return c()?.rowspan;
+						},
+						get colspan() {
+							return c()?.colspan;
+						}
+					}));
 				}
 			});
 		},

package/dist/plugins/CellSelectionPlugin.js

@@ -1,8 +1,10 @@
 import { usePointerDrag } from "../hooks/index.js";
+import { unFn } from "../utils.js";
 import { createComponent, memo, mergeProps, template } from "solid-js/web";
 import { batch, createMemo } from "solid-js";
 import { combineProps } from "@solid-primitives/props";
-var _tmpl$ = /* @__PURE__ */ template("<div class=area>"), inrange = (e, i, a) => e <= a && e >= i;
+import { createLazyMemo } from "@solid-primitives/memo";
+var _tmpl$ = /* @__PURE__ */ template("<div class=area>"), inrange = (e, a, o) => e <= o && e >= a;
 const CellSelectionPlugin = {
 	name: "cell-selection",
 	store: (e) => ({
@@ -10,104 +12,130 @@ const CellSelectionPlugin = {
 			start: [],
 			end: []
 		},
-		cellSelectionRect: () => {
-			let { start: i, end: a } = e.selected, o = [i[0], a[0]].sort((e, i) => e - i), s = [i[1], a[1]].sort((e, i) => e - i);
+		cellSelectionRect: createLazyMemo(() => {
+			let { start: a, end: o } = e.selected, s = [a[0], o[0]].sort((e, a) => e - a), c = [a[1], o[1]].sort((e, a) => e - a);
 			return {
-				xs: o,
-				ys: s
+				xs: s,
+				ys: c
 			};
-		}
+		})
 	}),
 	commands: (e) => ({ getAreaRows() {
-		let { start: i, end: a } = e.selected, [o, s] = [i[1], a[1]].sort((e, i) => e - i);
-		return e.props.data.slice(o, s + 1);
+		let { start: a, end: o } = e.selected, [s, c] = [a[1], o[1]].sort((e, a) => e - a);
+		return e.props.data.slice(s, c + 1);
 	} }),
 	rewriteProps: {
-		Table: ({ Table: a }, { store: o }) => (s) => (usePointerDrag(() => o.table, {
+		Table: ({ Table: a }, { store: s }) => (c) => (usePointerDrag(() => s.table, {
 			preventDefault: !1,
-			start(e, i, a) {
+			start(e, a, o) {
 				batch(() => {
-					let a = (e) => e.composedPath().find((e) => e.tagName == "TH" || e.tagName == "TD"), s = (e) => [e.getAttribute("x"), e.getAttribute("y")], c = a(e);
-					if (c && !(e.buttons != 1 && c.classList.contains("range-selected"))) {
-						if (c.tagName == "TH") {
-							let [e, l] = s(c);
+					let o = (e) => e.composedPath().find((e) => e.tagName == "TH" || e.tagName == "TD"), c = (e) => [e.getAttribute("x"), e.getAttribute("y")], l = o(e);
+					if (l && !(e.buttons != 1 && l.classList.contains("range-selected"))) {
+						if (l.tagName == "TH") {
+							let [e, u] = c(l);
 							if (e == null) return;
-							o.selected.start = [+e, 0], o.selected.end = [+e, Infinity], i((e) => {
-								let i = a(e);
-								if (!i) return;
-								let [c, l] = s(i);
-								c != null && (o.selected.end = [+c, Infinity]);
+							s.selected.start = [+e, 0], s.selected.end = [+e, Infinity], a((e) => {
+								let a = o(e);
+								if (!a) return;
+								let [l, u] = c(a);
+								l != null && (s.selected.end = [+l, Infinity]);
 							});
 						}
-						if (c.classList.contains("index")) {
-							let [e, l] = s(c);
-							if (e == null || l == null) return;
-							o.selected.start = [0, +l], o.selected.end = [Infinity, +l], i((e) => {
-								let i = a(e);
-								if (!i) return;
-								let [c, l] = s(i);
-								c == null || l == null || (o.selected.end = [Infinity, +l]);
+						if (l.classList.contains("index")) {
+							let [e, u] = c(l);
+							if (e == null || u == null) return;
+							s.selected.start = [0, +u], s.selected.end = [Infinity, +u], a((e) => {
+								let a = o(e);
+								if (!a) return;
+								let [l, u] = c(a);
+								l == null || u == null || (s.selected.end = [Infinity, +u]);
 							});
-						} else if (c.tagName == "TD") {
-							let [e, l] = s(c);
-							if (e == null || l == null) return;
-							o.selected.start = [+e, +l], o.selected.end = [...o.selected.start], i((e) => {
-								let i = a(e);
-								if (!i) return;
-								let [c, l] = s(i);
-								c == null || l == null || (o.selected.end = [+c, +l]);
+						} else if (l.tagName == "TD") {
+							let [e, u] = c(l);
+							if (e == null || u == null) return;
+							s.selected.start = [+e, +u], s.selected.end = [...s.selected.start], a((e) => {
+								let a = o(e);
+								if (!a) return;
+								let [l, u] = c(a);
+								l == null || u == null || (s.selected.end = [+l, +u]);
 							});
 						}
 					}
 				});
 			}
-		}), s = combineProps({ class: "select-none" }, s), createComponent(a, s)),
-		Th: ({ Th: e }, { store: s }) => (c) => {
+		}), c = combineProps({ class: "select-none" }, c), createComponent(a, c)),
+		Th: ({ Th: e }, { store: a }) => (l) => {
 			let u = createMemo(() => {
-				let { start: e, end: i } = s.selected;
-				return inrange(c.x, ...[e[0], i[0]].sort((e, i) => e - i)) ? "col-range-highlight" : "";
-			}), d = combineProps(c, { get class() {
-				return u();
-			} });
-			return createComponent(e, mergeProps(d, { get children() {
-				return [memo(() => d.children), memo(() => memo(() => !!u())() && _tmpl$())];
-			} }));
+				let { start: e, end: o } = a.selected;
+				return inrange(l.x, ...[e[0], o[0]].sort((e, a) => e - a)) ? "col-range-highlight" : "";
+			});
+			return createComponent(e, mergeProps(l, {
+				get class() {
+					return `${l.class} ${u()}`;
+				},
+				get children() {
+					return [l.children, memo(() => memo(() => !!u())() && _tmpl$())];
+				}
+			}));
 		},
-		Td: ({ Td: e }, { store: s }) => (c) => {
+		Td: ({ Td: e }, { store: a }) => (l) => {
 			let u = createMemo(() => {
-				let e = "", { xs: i, ys: a } = s.cellSelectionRect(), o = inrange(c.x, i[0], i[1]), l = inrange(c.y, a[0], a[1]);
-				return o && l && (e += "range-selected ", c.x == i[0] && (e += "range-selected-l "), c.x == i[1] && (e += "range-selected-r "), c.y == a[0] && (e += "range-selected-t "), c.y == a[1] && (e += "range-selected-b ")), c.col.id == s.$index?.id && l && (e += "row-range-highlight "), e;
-			}), d = combineProps(c, {
+				let e = "", { xs: o, ys: s } = a.cellSelectionRect(), c = inrange(l.x, o[0], o[1]), u = inrange(l.y, s[0], s[1]);
+				return c && u && (e += "range-selected ", l.x == o[0] && (e += "range-selected-l "), l.x == o[1] && (e += "range-selected-r "), l.y == s[0] && (e += "range-selected-t "), l.y == s[1] && (e += "range-selected-b ")), l.col.id == a.$index?.id && u && (e += "row-range-highlight "), e;
+			});
+			return createComponent(e, mergeProps(l, {
 				get class() {
-					return u();
+					return `${l.class} ${u()}`;
 				},
-				tabindex: -1
-			});
-			return createComponent(e, mergeProps(d, { get children() {
-				return [memo(() => d.children), memo(() => memo(() => !!u())() && _tmpl$())];
-			} }));
+				tabindex: -1,
+				get children() {
+					return [l.children, memo(() => memo(() => !!u())() && _tmpl$())];
+				}
+			}));
 		}
 	},
 	keybindings: (e) => ({
-		ArrowLeft: () => {
-			let { start: i, end: a } = e.selected;
-			i.length && (i[0] = a[0] = Math.max(i[0] - 1, 0), a[1] = i[1], e.scrollCellIfNeeded(i[0], i[1]));
+		ArrowLeft: async () => {
+			let { start: a, end: o } = e.selected;
+			a.length && (a[0] = o[0] = Math.max(a[0] - 1, 0), o[1] = a[1], e.scrollCellIfNeeded(a[0], a[1]), await new Promise(requestAnimationFrame), e.table.querySelector(`[x="${a[0]}"][y="${a[1]}"]`)?.focus());
 		},
-		ArrowRight: () => {
-			let { start: i, end: a } = e.selected;
-			i.length && (i[0] = a[0] = Math.min(i[0] + 1, e.props.columns.length - 1), a[1] = i[1], e.scrollCellIfNeeded(i[0], i[1]));
+		ArrowRight: async () => {
+			let { start: a, end: o } = e.selected;
+			a.length && (a[0] = o[0] = Math.min(a[0] + 1, e.props.columns.length - 1), o[1] = a[1], e.scrollCellIfNeeded(a[0], a[1]), await new Promise(requestAnimationFrame), e.table.querySelector(`[x="${a[0]}"][y="${a[1]}"]`)?.focus());
 		},
-		ArrowUp: () => {
-			let { start: i, end: a } = e.selected;
-			i.length && (i[1] = a[1] = Math.max(i[1] - 1, 0), a[0] = i[0], e.scrollCellIfNeeded(i[0], i[1]));
+		ArrowUp: async () => {
+			let { start: a, end: o } = e.selected;
+			a.length && (a[1] = o[1] = Math.max(a[1] - 1, 0), o[0] = a[0], e.scrollCellIfNeeded(a[0], a[1]), await new Promise(requestAnimationFrame), e.table.querySelector(`[x="${a[0]}"][y="${a[1]}"]`)?.focus());
 		},
-		ArrowDown: () => {
-			let { start: i, end: a } = e.selected;
-			i.length && (i[1] = a[1] = Math.min(i[1] + 1, e.props.data.length - 1), a[0] = i[0], e.scrollCellIfNeeded(i[0], i[1]));
+		ArrowDown: async () => {
+			let { start: a, end: o } = e.selected;
+			a.length && (a[1] = o[1] = Math.min(a[1] + 1, e.props.data.length - 1), o[0] = a[0], e.scrollCellIfNeeded(a[0], a[1]), await new Promise(requestAnimationFrame), e.table.querySelector(`[x="${a[0]}"][y="${a[1]}"]`)?.focus());
 		},
 		"$mod+a": () => {
-			let { columns: i, data: a } = e.props;
-			!i?.length || !a?.length || (e.selected.start = [0, 0], e.selected.end = [i.length - 1, a.length - 1], e.scrollCellIfNeeded(e.selected.start[0], e.selected.start[1]));
+			let { columns: a, data: o } = e.props;
+			!a?.length || !o?.length || (e.selected.start = [0, 0], e.selected.end = [a.length - 1, o.length - 1]);
+		},
+		backspace: () => {
+			let { start: o, end: s } = e.selected;
+			if (!o.length) return;
+			let [c, l] = [o[0], s[0]].sort((e, a) => e - a), [u, d] = [o[1], s[1]].sort((e, a) => e - a), f = [...e.props.data];
+			for (let o = u; o <= d; o++) {
+				let s = e.props.data[o], u = {};
+				for (let d = c; d <= l; d++) {
+					let c = e.props.columns[d];
+					unFn(e.props.editable, {
+						col: c,
+						data: s,
+						x: d,
+						y: o
+					}) && (u[c.id] = "");
+				}
+				f[o] = {
+					...f[o],
+					...u
+				};
+			}
+			e.commands.rowsChange(f.slice(u, d + 1));
 		}
 	})
 };

package/dist/plugins/CommandPlugin.js

@@ -23,7 +23,7 @@ const CommandPlugin = {
 			scrollCellIfNeeded(r, i, a = !1) {
 				r = typeof r == "object" ? e.props.columns.indexOf(r) : r, i = typeof i == "object" ? e.props.data.indexOf(i) : i;
 				let o = e.table.querySelector(`[x="${r}"][y="${i}"]`);
-				o && (o.scrollIntoViewIfNeeded(a), o.focus());
+				o && o.scrollIntoViewIfNeeded(a);
 			}
 		};
 	},

package/dist/plugins/DiffPlugin.d.ts

@@ -3,7 +3,6 @@ declare module '../index' {
     interface TableProps {
         diff?: {
             /** @default false */
-            enable?: boolean;
             data?: any[];
             /** @default true */
             added?: boolean;

package/dist/plugins/DiffPlugin.js

@@ -33,7 +33,7 @@ const DiffPlugin = {
 			...e
 		}),
 		data: ({ data: e }, { store: o }) => {
-			if (!o.props.diff?.enable) return e;
+			if (!o.props.diff?.data) return e;
 			let { rowKey: s, diff: c } = o.props || {}, l = o.diffData();
 			if (e.length === l.length && e.length > 0) {
 				let o = !0;
@@ -49,7 +49,7 @@ const DiffPlugin = {
 				[o.internal]: 1
 			})) : [] : e.value);
 		},
-		Td: ({ Td: u }, { store: f }) => f.props.diff?.enable ? (p) => {
+		Td: ({ Td: u }, { store: f }) => f.props.diff?.data ? (p) => {
 			let m = createMemo(() => {
 				let { diff: e } = f.props, o = p.data[f.props.rowKey];
 				return [p.data[NEW] ? "bg-green!" : p.data[DEL] ? "bg-red!" : p.data[f.internal] ? "" : e.changed && p.data[p.col.id] != f.diffDataKeyed()[o]?.[p.col.id] ? "bg-green!" : ""].join(" ");