react-gridix 0.1.1 → 0.2.0

package/dist/style.css

@@ -1 +1 @@
-:where(.rk-checkbox){display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-family:inherit;line-height:1;vertical-align:middle}:where(.rk-checkbox--disabled){cursor:not-allowed;opacity:.55}:where(.rk-checkbox__control){box-sizing:border-box;flex:none;margin:0;cursor:inherit;width:var(--rk-checkbox-size, 20px);height:var(--rk-checkbox-size, 20px)}:where(.rk-checkbox__control:disabled){cursor:not-allowed}:where(.rk-checkbox__control:focus-visible){outline:2px solid var(--rk-checkbox-color, #4f46e5);outline-offset:2px}:where(.rk-checkbox--button .rk-checkbox__control,.rk-checkbox--tick .rk-checkbox__control){display:inline-flex;align-items:center;justify-content:center;padding:0;border:var(--rk-checkbox-border-width, 1px) solid var(--rk-checkbox-border, #9ca3af);border-radius:var(--rk-checkbox-radius, 0px);background:var(--rk-checkbox-bg, #fff);color:var(--rk-checkbox-tick, #fff);transition:background .12s,border-color .12s}:where(.rk-checkbox--button .rk-checkbox__control[aria-checked=true],.rk-checkbox--button .rk-checkbox__control[aria-checked=mixed]){border-color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox--tick .rk-checkbox__control[aria-checked=true],.rk-checkbox--tick .rk-checkbox__control[aria-checked=mixed]){background:var(--rk-checkbox-color, #4f46e5);border-color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox__indicator){display:block;line-height:1;text-align:center;visibility:hidden}:where(.rk-checkbox__indicator[data-state=checked],.rk-checkbox__indicator[data-state=indeterminate]){visibility:visible}:where(.rk-checkbox--button .rk-checkbox__indicator){width:55%;height:55%;border-radius:var(--rk-checkbox-radius, 0px);background:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox--tick .rk-checkbox__indicator){width:80%;height:80%}:where(.rk-checkbox--button .rk-checkbox__indicator[data-state=indeterminate]){height:16%;border-radius:1px}:where(.rk-checkbox__indicator--custom){width:auto;height:auto;background:none}:where(.rk-checkbox__indicator--custom){font-size:calc(var(--rk-checkbox-size, 20px) * .7);font-weight:700}:where(.rk-checkbox--button .rk-checkbox__indicator--custom){color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox--tick .rk-checkbox__indicator--custom){color:var(--rk-checkbox-tick, #fff)}:where(.rk-checkbox--native .rk-checkbox__control){accent-color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox__label){font-size:14px}:where(.rk-grid){display:flex;flex-direction:column;width:100%;max-width:100%;min-width:0;box-sizing:border-box;font-family:var(--rk-font, system-ui, sans-serif);font-size:14px;color:var(--rk-text, #111827);background:var(--rk-grid-bg, var(--rk-surface, #fff));border:1px solid var(--rk-border, #d1d5db);border-radius:var(--rk-grid-radius, 10px);box-shadow:var(--rk-grid-shadow, none);overflow:hidden}:where(.rk-grid__toolbar){display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid var(--rk-border, #d1d5db);background:var(--rk-toolbar-bg, transparent)}:where(.rk-grid__search){width:260px;max-width:100%;padding:7px 12px;font:inherit;border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:8px;background:var(--rk-input-bg, var(--rk-surface, #fff));color:var(--rk-input-text, inherit)}:where(.rk-grid__search:focus,.rk-grid__filter-input:focus,.rk-grid__page-size:focus){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:-1px}:where(.rk-grid__scroll){overflow:auto;scroll-behavior:smooth}:where(.rk-grid__table){width:100%;border-collapse:collapse}:where(.rk-grid__thead){position:sticky;top:0;z-index:1;background:var(--rk-header-bg, var(--rk-bg-subtle, #f3f4f6));color:var(--rk-header-text, inherit)}:where(.rk-grid__th){padding:10px 12px;text-align:left;font-weight:600;white-space:nowrap;background:transparent;border-bottom:1px solid var(--rk-header-border, var(--rk-border, #d1d5db));-webkit-user-select:none;user-select:none}:where(.rk-grid__th--sortable){cursor:pointer}:where(.rk-grid__th--sortable:hover){background:var(--rk-header-hover-bg, rgba(0, 0, 0, .06))}:where(.rk-grid__th:focus-visible,.rk-grid__td:focus-visible){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:-2px}:where(.rk-grid__th-content){display:inline-flex;align-items:center;gap:6px}:where(.rk-grid__sort){font-size:10px;opacity:.55}:where(.rk-grid__filter-btn){display:inline-flex;align-items:center;justify-content:center;padding:4px;margin:0;font:inherit;line-height:1;color:inherit;background:transparent;border:0;border-radius:999px;cursor:pointer}:where(.rk-grid__filter-btn:hover,.rk-grid__filter-btn--open){background:var(--rk-header-hover-bg, rgba(0, 0, 0, .08))}:where(.rk-grid__filter-btn:focus-visible){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:1px}:where(.rk-grid__filter-dot){display:block;width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.4;transition:opacity .15s,background .15s,box-shadow .15s}:where(.rk-grid__filter-btn:hover .rk-grid__filter-dot){opacity:.75}:where(.rk-grid__filter-btn--active .rk-grid__filter-dot){opacity:1;background:var(--rk-filter-active, var(--rk-primary, #4f46e5));box-shadow:0 0 0 3px var(--rk-filter-glow, rgba(79, 70, 229, .25))}:where(.rk-grid-popup){z-index:1000;display:flex;align-items:center;gap:8px;box-sizing:border-box;padding:10px;min-width:220px;font-family:var(--rk-font, system-ui, sans-serif);font-size:14px;color:var(--rk-popup-text, #111827);background:var(--rk-popup-bg, #fff);border:1px solid var(--rk-popup-border, #d1d5db);border-radius:var(--rk-popup-radius, 10px);box-shadow:var(--rk-popup-shadow, 0 10px 30px rgba(15, 23, 42, .18));animation:rk-pop-in .14s ease-out}:where(.rk-grid__filter-input){flex:1;min-width:0;box-sizing:border-box;padding:6px 10px;font:inherit;font-size:13px;border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:6px;background:var(--rk-input-bg, #fff);color:var(--rk-input-text, inherit)}:where(.rk-grid__filter-clear){padding:5px 10px;font:inherit;font-size:13px;cursor:pointer;color:inherit;background:transparent;border:1px solid var(--rk-popup-border, #d1d5db);border-radius:6px}:where(.rk-grid__filter-clear:hover){background:var(--rk-btn-hover, #e5e7eb)}@keyframes rk-pop-in{0%{opacity:0;transform:translateY(-4px)}}:where(.rk-grid__td){padding:9px 12px;border-bottom:1px solid var(--rk-cell-border, #eef0f3)}:where(.rk-grid__td--editable){cursor:text}:where(.rk-grid__td--editing){padding:3px 6px}:where(.rk-grid__row--stripe-a){background:var(--rk-stripe-a, transparent)}:where(.rk-grid__row--stripe-b){background:var(--rk-stripe-b, #fafafa)}:where(.rk-grid__row:hover){background:var(--rk-row-hover, #f3f4f6)}:where(.rk-grid__row--clickable){cursor:pointer}:where(.rk-grid__row--enter){animation:rk-row-in var(--rk-row-duration, .38s) cubic-bezier(.22,.8,.3,1) backwards;animation-delay:calc(var(--rk-i, 0) * var(--rk-row-stagger, 28ms))}@keyframes rk-row-in{0%{opacity:0;transform:translateY(14px)}}@media (prefers-reduced-motion: reduce){:where(.rk-grid__row--enter){animation:none}:where(.rk-grid__scroll){scroll-behavior:auto}:where(.rk-grid-popup){animation:none}}:where(.rk-grid__editor){width:100%;box-sizing:border-box;padding:5px 8px;font:inherit;border:2px solid var(--rk-primary, #4f46e5);border-radius:6px;background:var(--rk-input-bg, var(--rk-surface, #fff));color:var(--rk-input-text, inherit)}:where(.rk-grid__editor:focus){outline:none}:where(.rk-grid__editor--invalid){border-color:var(--rk-danger, #dc2626);background:var(--rk-invalid-bg, #fef2f2)}:where(.rk-grid__custom-editor){display:flex;align-items:center;min-height:30px}:where(.rk-grid__checkbox-cell,.rk-grid__header-checkbox){display:inline-flex;vertical-align:middle}:where(.rk-grid__empty){padding:32px 12px;text-align:center;color:var(--rk-muted, #6b7280)}:where(.rk-grid__footer){display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:8px 12px;border-top:1px solid var(--rk-border, #d1d5db);background:var(--rk-footer-bg, var(--rk-bg-subtle, #f3f4f6));color:var(--rk-footer-text, var(--rk-muted, #6b7280));font-size:13px}:where(.rk-grid__footer--top){border-top:0;border-bottom:1px solid var(--rk-border, #d1d5db)}:where(.rk-grid__pagination){display:flex;align-items:center;gap:8px}:where(.rk-grid__page-size-label){display:inline-flex;align-items:center;gap:6px;margin-right:8px}:where(.rk-grid__page-size){padding:3px 6px;font:inherit;border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:6px;background:var(--rk-input-bg, var(--rk-surface, #fff));color:var(--rk-input-text, inherit)}:where(.rk-grid__page-btn){min-width:30px;padding:3px 8px;font:inherit;cursor:pointer;color:var(--rk-input-text, var(--rk-text, #111827));background:var(--rk-input-bg, var(--rk-surface, #fff));border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:6px}:where(.rk-grid__page-btn:hover:not(:disabled)){background:var(--rk-btn-hover, #e5e7eb)}:where(.rk-grid__page-btn:disabled){opacity:.4;cursor:not-allowed}:where([data-rk-theme=ocean]){--rk-font: "Inter", system-ui, sans-serif;--rk-text: #0f172a;--rk-muted: #64748b;--rk-border: #bfdbfe;--rk-surface: #ffffff;--rk-primary: #0284c7;--rk-danger: #e11d48;--rk-grid-bg: #ffffff;--rk-grid-radius: 14px;--rk-grid-shadow: 0 10px 30px rgba(2, 132, 199, .15);--rk-toolbar-bg: #f0f9ff;--rk-input-bg: #ffffff;--rk-input-border: #bae6fd;--rk-input-text: #0f172a;--rk-header-bg: linear-gradient(90deg, #0369a1, #0ea5e9);--rk-header-text: #ffffff;--rk-header-hover-bg: rgba(255, 255, 255, .16);--rk-header-border: transparent;--rk-cell-border: #e0f2fe;--rk-row-hover: #e0f2fe;--rk-stripe-a: #ffffff;--rk-stripe-b: #f0f9ff;--rk-footer-bg: #f0f9ff;--rk-footer-text: #0369a1;--rk-btn-hover: #e0f2fe;--rk-filter-active: #fde047;--rk-filter-glow: rgba(253, 224, 71, .4);--rk-popup-bg: #ffffff;--rk-popup-text: #0f172a;--rk-popup-border: #bae6fd;--rk-popup-radius: 12px;--rk-checkbox-color: #0284c7;--rk-checkbox-border: #7dd3fc}:where([data-rk-theme=midnight]){color-scheme:dark;--rk-font: "Inter", system-ui, sans-serif;--rk-text: #e2e8f0;--rk-muted: #94a3b8;--rk-border: #334155;--rk-surface: #0f172a;--rk-primary: #818cf8;--rk-danger: #fb7185;--rk-grid-bg: #0f172a;--rk-grid-radius: 14px;--rk-grid-shadow: 0 12px 40px rgba(0, 0, 0, .5);--rk-toolbar-bg: #111c33;--rk-input-bg: #1e293b;--rk-input-border: #334155;--rk-input-text: #e2e8f0;--rk-header-bg: #1e293b;--rk-header-text: #c7d2fe;--rk-header-hover-bg: rgba(129, 140, 248, .16);--rk-header-border: #334155;--rk-cell-border: #1e293b;--rk-row-hover: #1e2a4a;--rk-stripe-a: #0f172a;--rk-stripe-b: #131d33;--rk-footer-bg: #111c33;--rk-footer-text: #94a3b8;--rk-btn-hover: #334155;--rk-invalid-bg: #4c0519;--rk-filter-active: #818cf8;--rk-filter-glow: rgba(129, 140, 248, .35);--rk-popup-bg: #1e293b;--rk-popup-text: #e2e8f0;--rk-popup-border: #475569;--rk-popup-radius: 12px;--rk-popup-shadow: 0 16px 40px rgba(0, 0, 0, .6);--rk-checkbox-color: #818cf8;--rk-checkbox-border: #64748b;--rk-checkbox-bg: #0f172a;--rk-checkbox-tick: #0f172a}:where([data-rk-theme=sunset]){--rk-font: "Georgia", "Times New Roman", serif;--rk-text: #431407;--rk-muted: #9a3412;--rk-border: #fed7aa;--rk-surface: #fffbf5;--rk-primary: #ea580c;--rk-danger: #be123c;--rk-grid-bg: #fffbf5;--rk-grid-radius: 18px;--rk-grid-shadow: 0 12px 32px rgba(234, 88, 12, .18);--rk-toolbar-bg: #fff7ed;--rk-input-bg: #ffffff;--rk-input-border: #fdba74;--rk-input-text: #431407;--rk-header-bg: linear-gradient(90deg, #f97316, #ec4899);--rk-header-text: #ffffff;--rk-header-hover-bg: rgba(255, 255, 255, .2);--rk-header-border: transparent;--rk-cell-border: #ffedd5;--rk-row-hover: #ffedd5;--rk-stripe-a: #fffbf5;--rk-stripe-b: #fff1e6;--rk-footer-bg: #fff7ed;--rk-footer-text: #9a3412;--rk-btn-hover: #ffedd5;--rk-filter-active: #fef08a;--rk-filter-glow: rgba(254, 240, 138, .5);--rk-popup-bg: #fffbf5;--rk-popup-text: #431407;--rk-popup-border: #fdba74;--rk-popup-radius: 14px;--rk-checkbox-color: #ea580c;--rk-checkbox-border: #fb923c;--rk-checkbox-radius: 4px}:where([data-rk-theme=forest]){--rk-font: system-ui, sans-serif;--rk-text: #14301f;--rk-muted: #4d7c5f;--rk-border: #bbd8c4;--rk-surface: #fafdf9;--rk-primary: #15803d;--rk-danger: #b91c1c;--rk-grid-bg: #fafdf9;--rk-grid-radius: 6px;--rk-grid-shadow: 0 6px 18px rgba(20, 83, 45, .14);--rk-toolbar-bg: #f0f7f1;--rk-input-bg: #ffffff;--rk-input-border: #a7cbb2;--rk-input-text: #14301f;--rk-header-bg: #14532d;--rk-header-text: #ecfdf5;--rk-header-hover-bg: rgba(255, 255, 255, .14);--rk-header-border: transparent;--rk-cell-border: #e1efe5;--rk-row-hover: #dcfce7;--rk-stripe-a: #fafdf9;--rk-stripe-b: #eef7f0;--rk-footer-bg: #f0f7f1;--rk-footer-text: #166534;--rk-btn-hover: #dcfce7;--rk-filter-active: #86efac;--rk-filter-glow: rgba(134, 239, 172, .4);--rk-popup-bg: #fafdf9;--rk-popup-text: #14301f;--rk-popup-border: #a7cbb2;--rk-popup-radius: 6px;--rk-checkbox-color: #15803d;--rk-checkbox-border: #6aa57d}
+:where(.rk-checkbox){display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-family:inherit;line-height:1;vertical-align:middle}:where(.rk-checkbox--disabled){cursor:not-allowed;opacity:.55}:where(.rk-checkbox__control){box-sizing:border-box;flex:none;margin:0;cursor:inherit;width:var(--rk-checkbox-size, 20px);height:var(--rk-checkbox-size, 20px)}:where(.rk-checkbox__control:disabled){cursor:not-allowed}:where(.rk-checkbox__control:focus-visible){outline:2px solid var(--rk-checkbox-color, #4f46e5);outline-offset:2px}:where(.rk-checkbox--button .rk-checkbox__control,.rk-checkbox--tick .rk-checkbox__control){display:inline-flex;align-items:center;justify-content:center;padding:0;border:var(--rk-checkbox-border-width, 1px) solid var(--rk-checkbox-border, #9ca3af);border-radius:var(--rk-checkbox-radius, 0px);background:var(--rk-checkbox-bg, #fff);color:var(--rk-checkbox-tick, #fff);transition:background .12s,border-color .12s}:where(.rk-checkbox--button .rk-checkbox__control[aria-checked=true],.rk-checkbox--button .rk-checkbox__control[aria-checked=mixed]){border-color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox--tick .rk-checkbox__control[aria-checked=true],.rk-checkbox--tick .rk-checkbox__control[aria-checked=mixed]){background:var(--rk-checkbox-color, #4f46e5);border-color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox__indicator){display:block;line-height:1;text-align:center;visibility:hidden}:where(.rk-checkbox__indicator[data-state=checked],.rk-checkbox__indicator[data-state=indeterminate]){visibility:visible}:where(.rk-checkbox--button .rk-checkbox__indicator){width:55%;height:55%;border-radius:var(--rk-checkbox-radius, 0px);background:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox--tick .rk-checkbox__indicator){width:80%;height:80%}:where(.rk-checkbox--button .rk-checkbox__indicator[data-state=indeterminate]){height:16%;border-radius:1px}:where(.rk-checkbox__indicator--custom){width:auto;height:auto;background:none}:where(.rk-checkbox__indicator--custom){font-size:calc(var(--rk-checkbox-size, 20px) * .7);font-weight:700}:where(.rk-checkbox--button .rk-checkbox__indicator--custom){color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox--tick .rk-checkbox__indicator--custom){color:var(--rk-checkbox-tick, #fff)}:where(.rk-checkbox--native .rk-checkbox__control){accent-color:var(--rk-checkbox-color, #4f46e5)}:where(.rk-checkbox__label){font-size:14px}:where(.rk-grid){display:flex;flex-direction:column;width:100%;max-width:100%;min-width:0;box-sizing:border-box;font-family:var(--rk-font, system-ui, sans-serif);font-size:14px;color:var(--rk-text, #111827);background:var(--rk-grid-bg, var(--rk-surface, #fff));border:1px solid var(--rk-border, #d1d5db);border-radius:var(--rk-grid-radius, 10px);box-shadow:var(--rk-grid-shadow, none);overflow:hidden}:where(.rk-grid__toolbar){display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid var(--rk-border, #d1d5db);background:var(--rk-toolbar-bg, transparent)}:where(.rk-grid__toolbar-left,.rk-grid__toolbar-actions){display:flex;align-items:center;gap:10px;min-width:0}:where(.rk-grid__toolbar-left){flex:1}:where(.rk-grid__selected-count){padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--rk-selected-bg, #eef2ff);color:var(--rk-primary, #4f46e5)}:where(.rk-grid__tool-btn){padding:6px 12px;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;color:var(--rk-input-text, var(--rk-text, #111827));background:var(--rk-input-bg, var(--rk-surface, #fff));border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:8px}:where(.rk-grid__tool-btn:hover){background:var(--rk-btn-hover, #e5e7eb)}:where(.rk-grid__tool-btn:focus-visible){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:1px}:where(.rk-grid__search){width:260px;max-width:100%;padding:7px 12px;font:inherit;border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:8px;background:var(--rk-input-bg, var(--rk-surface, #fff));color:var(--rk-input-text, inherit)}:where(.rk-grid__search:focus,.rk-grid__filter-input:focus,.rk-grid__page-size:focus){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:-1px}:where(.rk-grid__scroll){overflow:auto;scroll-behavior:smooth}:where(.rk-grid__table){width:100%;border-collapse:collapse}:where(.rk-grid__thead){position:sticky;top:0;z-index:3;background:var(--rk-header-bg, var(--rk-bg-subtle, #f3f4f6));color:var(--rk-header-text, inherit)}:where(.rk-grid__th,.rk-grid__td){box-sizing:border-box}:where(.rk-grid__th){position:relative;padding:10px 12px;text-align:left;font-weight:600;white-space:nowrap;background:transparent;border-bottom:1px solid var(--rk-header-border, var(--rk-border, #d1d5db));-webkit-user-select:none;user-select:none}:where(.rk-grid__th--sortable){cursor:pointer}:where(.rk-grid__th--sortable:hover){background-image:linear-gradient(var(--rk-header-hover-bg, rgba(0, 0, 0, .06)),var(--rk-header-hover-bg, rgba(0, 0, 0, .06)))}:where(.rk-grid__th:focus-visible,.rk-grid__td:focus-visible){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:-2px}:where(.rk-grid__th-content){display:inline-flex;align-items:center;gap:6px}:where(.rk-grid__sort){font-size:10px;opacity:.55;white-space:nowrap}:where(.rk-grid__sort-order){margin-left:1px;font-size:9px}:where(.rk-grid__select-cell){width:44px;padding-left:0;padding-right:0;text-align:center}:where(.rk-grid__filter-btn){display:inline-flex;align-items:center;justify-content:center;padding:3px;margin:0;font:inherit;line-height:1;color:inherit;background:transparent;border:0;border-radius:999px;cursor:pointer}:where(.rk-grid__filter-btn:hover,.rk-grid__filter-btn--open){background:var(--rk-header-hover-bg, rgba(0, 0, 0, .08))}:where(.rk-grid__filter-btn:focus-visible){outline:2px solid var(--rk-primary, #4f46e5);outline-offset:1px}:where(.rk-grid__filter-dot){display:block;width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.4;transition:opacity .15s,background .15s,box-shadow .15s}:where(.rk-grid__filter-btn:hover .rk-grid__filter-dot){opacity:.75}:where(.rk-grid__filter-btn--active .rk-grid__filter-dot){opacity:1;background:var(--rk-filter-active, var(--rk-primary, #4f46e5));box-shadow:0 0 0 3px var(--rk-filter-glow, rgba(79, 70, 229, .25))}:where(.rk-grid-popup){z-index:1000;display:flex;align-items:center;gap:8px;box-sizing:border-box;padding:10px;min-width:220px;font-family:var(--rk-font, system-ui, sans-serif);font-size:14px;color:var(--rk-popup-text, #111827);background:var(--rk-popup-bg, #fff);border:1px solid var(--rk-popup-border, #d1d5db);border-radius:var(--rk-popup-radius, 10px);box-shadow:var(--rk-popup-shadow, 0 10px 30px rgba(15, 23, 42, .18));animation:rk-pop-in .14s ease-out}:where(.rk-grid__filter-input){flex:1;min-width:0;box-sizing:border-box;padding:6px 10px;font:inherit;font-size:13px;border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:6px;background:var(--rk-input-bg, #fff);color:var(--rk-input-text, inherit)}:where(.rk-grid__filter-clear){padding:5px 10px;font:inherit;font-size:13px;cursor:pointer;color:inherit;background:transparent;border:1px solid var(--rk-popup-border, #d1d5db);border-radius:6px}:where(.rk-grid__filter-clear:hover){background:var(--rk-btn-hover, #e5e7eb)}:where(.rk-grid__filter-fields){display:flex;flex:1;gap:8px;min-width:0}:where(.rk-grid__filter-field){display:flex;flex:1;flex-direction:column;gap:3px;min-width:0;font-size:12px;opacity:.9}:where(.rk-grid__filter-options){flex-direction:column;gap:6px;max-height:220px;overflow:auto;padding-right:4px}:where(.rk-grid__filter-empty){font-size:13px;opacity:.7}:where(.rk-grid-popup input[type=date],.rk-grid__editor[type=date]){font-family:inherit}@keyframes rk-pop-in{0%{opacity:0;transform:translateY(-4px)}}:where(.rk-grid__td){padding:9px 12px;border-bottom:1px solid var(--rk-cell-border, #eef0f3)}:where(.rk-grid__td--editable){cursor:text}:where(.rk-grid__td--editing){padding:3px 6px}:where(.rk-grid__row--stripe-a){background:var(--rk-stripe-a, transparent)}:where(.rk-grid__row--stripe-b){background:var(--rk-stripe-b, #fafafa)}:where(.rk-grid__row:hover){background:var(--rk-row-hover, #f3f4f6)}:where(.rk-grid__row--selected){background:var(--rk-selected-bg, #eef2ff)}:where(.rk-grid__row--clickable){cursor:pointer}:where(.rk-grid__pinned){position:sticky;z-index:1;background-color:var(--rk-pinned-bg, var(--rk-grid-bg, var(--rk-surface, #fff)))}:where(thead .rk-grid__pinned){z-index:2;background-color:var(--rk-pinned-header-bg, var(--rk-bg-subtle, #f3f4f6))}:where(.rk-grid__pinned--left.rk-grid__pinned--edge){box-shadow:2px 0 4px -2px #00000040}:where(.rk-grid__pinned--right.rk-grid__pinned--edge){box-shadow:-2px 0 4px -2px #00000040}:where(.rk-grid__row--stripe-a>.rk-grid__pinned){background-image:linear-gradient(var(--rk-stripe-a, transparent),var(--rk-stripe-a, transparent))}:where(.rk-grid__row--stripe-b>.rk-grid__pinned){background-image:linear-gradient(var(--rk-stripe-b, #fafafa),var(--rk-stripe-b, #fafafa))}:where(.rk-grid__row:hover>.rk-grid__pinned){background-image:linear-gradient(var(--rk-row-hover, #f3f4f6),var(--rk-row-hover, #f3f4f6))}:where(.rk-grid__row--selected>.rk-grid__pinned){background-image:linear-gradient(var(--rk-selected-bg, #eef2ff),var(--rk-selected-bg, #eef2ff))}:where(.rk-grid__resizer){position:absolute;top:0;right:0;bottom:0;width:8px;cursor:col-resize;touch-action:none;-webkit-user-select:none;user-select:none}:where(.rk-grid__resizer:after){content:"";position:absolute;top:25%;bottom:25%;right:3px;width:2px;border-radius:1px;background:currentColor;opacity:.2}:where(.rk-grid__resizer:hover:after){opacity:.6}:where(.rk-grid--virtual .rk-grid__td){box-sizing:border-box;white-space:nowrap;overflow:hidden;padding-top:0;padding-bottom:0}:where(.rk-grid__spacer>td){padding:0;border:0}:where(.rk-grid__skeleton){display:block;height:12px;max-width:100%;border-radius:6px;background:linear-gradient(90deg,var(--rk-skeleton-a, #e5e7eb) 25%,var(--rk-skeleton-b, #f3f4f6) 50%,var(--rk-skeleton-a, #e5e7eb) 75%);background-size:200% 100%;animation:rk-shimmer 1.3s ease-in-out infinite}:where(.rk-grid__skeleton-row>.rk-grid__td){padding-top:14px;padding-bottom:14px}@keyframes rk-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}:where(.rk-grid__error){color:var(--rk-danger, #dc2626)}:where(.rk-grid__row--enter){animation:rk-row-in var(--rk-row-duration, .38s) cubic-bezier(.22,.8,.3,1) backwards;animation-delay:calc(var(--rk-i, 0) * var(--rk-row-stagger, 28ms))}@keyframes rk-row-in{0%{opacity:0;transform:translateY(14px)}}@media (prefers-reduced-motion: reduce){:where(.rk-grid__row--enter){animation:none}:where(.rk-grid__scroll){scroll-behavior:auto}:where(.rk-grid-popup){animation:none}:where(.rk-grid__skeleton){animation:none}}:where(.rk-grid__editor){width:100%;box-sizing:border-box;padding:5px 8px;font:inherit;border:2px solid var(--rk-primary, #4f46e5);border-radius:6px;background:var(--rk-input-bg, var(--rk-surface, #fff));color:var(--rk-input-text, inherit)}:where(.rk-grid__editor:focus){outline:none}:where(.rk-grid__editor--invalid){border-color:var(--rk-danger, #dc2626);background:var(--rk-invalid-bg, #fef2f2)}:where(.rk-grid__custom-editor){display:flex;align-items:center;min-height:30px}:where(.rk-grid__checkbox-cell,.rk-grid__header-checkbox){display:inline-flex;vertical-align:middle}:where(.rk-grid__empty){padding:32px 12px;text-align:center;color:var(--rk-muted, #6b7280)}:where(.rk-grid__footer){display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:8px 12px;border-top:1px solid var(--rk-border, #d1d5db);background:var(--rk-footer-bg, var(--rk-bg-subtle, #f3f4f6));color:var(--rk-footer-text, var(--rk-muted, #6b7280));font-size:13px}:where(.rk-grid__footer--top){border-top:0;border-bottom:1px solid var(--rk-border, #d1d5db)}:where(.rk-grid__pagination){display:flex;align-items:center;gap:8px}:where(.rk-grid__page-size-label){display:inline-flex;align-items:center;gap:6px;margin-right:8px}:where(.rk-grid__page-size){padding:3px 6px;font:inherit;border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:6px;background:var(--rk-input-bg, var(--rk-surface, #fff));color:var(--rk-input-text, inherit)}:where(.rk-grid__page-btn){min-width:30px;padding:3px 8px;font:inherit;cursor:pointer;color:var(--rk-input-text, var(--rk-text, #111827));background:var(--rk-input-bg, var(--rk-surface, #fff));border:1px solid var(--rk-input-border, var(--rk-border, #d1d5db));border-radius:6px}:where(.rk-grid__page-btn:hover:not(:disabled)){background:var(--rk-btn-hover, #e5e7eb)}:where(.rk-grid__page-btn:disabled){opacity:.4;cursor:not-allowed}:where([data-rk-theme=ocean]){--rk-font: "Inter", system-ui, sans-serif;--rk-text: #0f172a;--rk-muted: #64748b;--rk-border: #bfdbfe;--rk-surface: #ffffff;--rk-primary: #0284c7;--rk-danger: #e11d48;--rk-grid-bg: #ffffff;--rk-grid-radius: 14px;--rk-grid-shadow: 0 10px 30px rgba(2, 132, 199, .15);--rk-toolbar-bg: #f0f9ff;--rk-input-bg: #ffffff;--rk-input-border: #bae6fd;--rk-input-text: #0f172a;--rk-header-bg: linear-gradient(90deg, #0369a1, #0ea5e9);--rk-header-text: #ffffff;--rk-header-hover-bg: rgba(255, 255, 255, .16);--rk-header-border: transparent;--rk-cell-border: #e0f2fe;--rk-row-hover: #e0f2fe;--rk-stripe-a: #ffffff;--rk-stripe-b: #f0f9ff;--rk-footer-bg: #f0f9ff;--rk-footer-text: #0369a1;--rk-btn-hover: #e0f2fe;--rk-filter-active: #fde047;--rk-filter-glow: rgba(253, 224, 71, .4);--rk-popup-bg: #ffffff;--rk-popup-text: #0f172a;--rk-popup-border: #bae6fd;--rk-popup-radius: 12px;--rk-checkbox-color: #0284c7;--rk-checkbox-border: #7dd3fc;--rk-pinned-bg: #ffffff;--rk-pinned-header-bg: #0369a1;--rk-selected-bg: #bae6fd;--rk-skeleton-a: #e0f2fe;--rk-skeleton-b: #f0f9ff}:where([data-rk-theme=midnight]){color-scheme:dark;--rk-font: "Inter", system-ui, sans-serif;--rk-text: #e2e8f0;--rk-muted: #94a3b8;--rk-border: #334155;--rk-surface: #0f172a;--rk-primary: #818cf8;--rk-danger: #fb7185;--rk-grid-bg: #0f172a;--rk-grid-radius: 14px;--rk-grid-shadow: 0 12px 40px rgba(0, 0, 0, .5);--rk-toolbar-bg: #111c33;--rk-input-bg: #1e293b;--rk-input-border: #334155;--rk-input-text: #e2e8f0;--rk-header-bg: #1e293b;--rk-header-text: #c7d2fe;--rk-header-hover-bg: rgba(129, 140, 248, .16);--rk-header-border: #334155;--rk-cell-border: #1e293b;--rk-row-hover: #1e2a4a;--rk-stripe-a: #0f172a;--rk-stripe-b: #131d33;--rk-footer-bg: #111c33;--rk-footer-text: #94a3b8;--rk-btn-hover: #334155;--rk-invalid-bg: #4c0519;--rk-filter-active: #818cf8;--rk-filter-glow: rgba(129, 140, 248, .35);--rk-popup-bg: #1e293b;--rk-popup-text: #e2e8f0;--rk-popup-border: #475569;--rk-popup-radius: 12px;--rk-popup-shadow: 0 16px 40px rgba(0, 0, 0, .6);--rk-checkbox-color: #818cf8;--rk-checkbox-border: #64748b;--rk-checkbox-bg: #0f172a;--rk-checkbox-tick: #0f172a;--rk-pinned-bg: #0f172a;--rk-pinned-header-bg: #1e293b;--rk-selected-bg: #27335c;--rk-skeleton-a: #1e293b;--rk-skeleton-b: #2b3a55}:where([data-rk-theme=sunset]){--rk-font: "Georgia", "Times New Roman", serif;--rk-text: #431407;--rk-muted: #9a3412;--rk-border: #fed7aa;--rk-surface: #fffbf5;--rk-primary: #ea580c;--rk-danger: #be123c;--rk-grid-bg: #fffbf5;--rk-grid-radius: 18px;--rk-grid-shadow: 0 12px 32px rgba(234, 88, 12, .18);--rk-toolbar-bg: #fff7ed;--rk-input-bg: #ffffff;--rk-input-border: #fdba74;--rk-input-text: #431407;--rk-header-bg: linear-gradient(90deg, #f97316, #ec4899);--rk-header-text: #ffffff;--rk-header-hover-bg: rgba(255, 255, 255, .2);--rk-header-border: transparent;--rk-cell-border: #ffedd5;--rk-row-hover: #ffedd5;--rk-stripe-a: #fffbf5;--rk-stripe-b: #fff1e6;--rk-footer-bg: #fff7ed;--rk-footer-text: #9a3412;--rk-btn-hover: #ffedd5;--rk-filter-active: #fef08a;--rk-filter-glow: rgba(254, 240, 138, .5);--rk-popup-bg: #fffbf5;--rk-popup-text: #431407;--rk-popup-border: #fdba74;--rk-popup-radius: 14px;--rk-checkbox-color: #ea580c;--rk-checkbox-border: #fb923c;--rk-checkbox-radius: 4px;--rk-pinned-bg: #fffbf5;--rk-pinned-header-bg: #f97316;--rk-selected-bg: #fed7aa;--rk-skeleton-a: #ffedd5;--rk-skeleton-b: #fff7ed}:where([data-rk-theme=forest]){--rk-font: system-ui, sans-serif;--rk-text: #14301f;--rk-muted: #4d7c5f;--rk-border: #bbd8c4;--rk-surface: #fafdf9;--rk-primary: #15803d;--rk-danger: #b91c1c;--rk-grid-bg: #fafdf9;--rk-grid-radius: 6px;--rk-grid-shadow: 0 6px 18px rgba(20, 83, 45, .14);--rk-toolbar-bg: #f0f7f1;--rk-input-bg: #ffffff;--rk-input-border: #a7cbb2;--rk-input-text: #14301f;--rk-header-bg: #14532d;--rk-header-text: #ecfdf5;--rk-header-hover-bg: rgba(255, 255, 255, .14);--rk-header-border: transparent;--rk-cell-border: #e1efe5;--rk-row-hover: #dcfce7;--rk-stripe-a: #fafdf9;--rk-stripe-b: #eef7f0;--rk-footer-bg: #f0f7f1;--rk-footer-text: #166534;--rk-btn-hover: #dcfce7;--rk-filter-active: #86efac;--rk-filter-glow: rgba(134, 239, 172, .4);--rk-popup-bg: #fafdf9;--rk-popup-text: #14301f;--rk-popup-border: #a7cbb2;--rk-popup-radius: 6px;--rk-checkbox-color: #15803d;--rk-checkbox-border: #6aa57d;--rk-pinned-bg: #fafdf9;--rk-pinned-header-bg: #14532d;--rk-selected-bg: #bbf7d0;--rk-skeleton-a: #dcfce7;--rk-skeleton-b: #f0fdf4}:where([data-rk-theme=lavender]){--rk-font: "Inter", system-ui, sans-serif;--rk-text: #2e1065;--rk-muted: #7c3aed;--rk-border: #ddd6fe;--rk-surface: #ffffff;--rk-primary: #7c3aed;--rk-danger: #e11d48;--rk-grid-bg: #fdfcff;--rk-grid-radius: 16px;--rk-grid-shadow: 0 12px 32px rgba(124, 58, 237, .16);--rk-toolbar-bg: #f5f3ff;--rk-input-bg: #ffffff;--rk-input-border: #c4b5fd;--rk-input-text: #2e1065;--rk-header-bg: linear-gradient(90deg, #7c3aed, #c084fc);--rk-header-text: #ffffff;--rk-header-hover-bg: rgba(255, 255, 255, .18);--rk-header-border: transparent;--rk-cell-border: #ede9fe;--rk-row-hover: #f5f3ff;--rk-stripe-a: #fdfcff;--rk-stripe-b: #f5f3ff;--rk-footer-bg: #f5f3ff;--rk-footer-text: #6d28d9;--rk-btn-hover: #ede9fe;--rk-filter-active: #fde68a;--rk-filter-glow: rgba(253, 230, 138, .45);--rk-popup-bg: #ffffff;--rk-popup-text: #2e1065;--rk-popup-border: #c4b5fd;--rk-popup-radius: 14px;--rk-pinned-bg: #fdfcff;--rk-pinned-header-bg: #7c3aed;--rk-selected-bg: #ddd6fe;--rk-skeleton-a: #ede9fe;--rk-skeleton-b: #f5f3ff;--rk-checkbox-color: #7c3aed;--rk-checkbox-border: #a78bfa;--rk-checkbox-radius: 4px}:where([data-rk-theme=coffee]){--rk-font: "Georgia", "Times New Roman", serif;--rk-text: #3b2a20;--rk-muted: #8a6f5d;--rk-border: #dccab8;--rk-surface: #fbf6ef;--rk-primary: #a1622f;--rk-danger: #b91c1c;--rk-grid-bg: #fbf6ef;--rk-grid-radius: 8px;--rk-grid-shadow: 0 8px 24px rgba(91, 58, 41, .18);--rk-toolbar-bg: #f4ebdd;--rk-input-bg: #fffdf9;--rk-input-border: #d3bda6;--rk-input-text: #3b2a20;--rk-header-bg: #5b3a29;--rk-header-text: #f6e9d7;--rk-header-hover-bg: rgba(255, 255, 255, .12);--rk-header-border: transparent;--rk-cell-border: #eadfce;--rk-row-hover: #f1e4d2;--rk-stripe-a: #fbf6ef;--rk-stripe-b: #f4ebdd;--rk-footer-bg: #f4ebdd;--rk-footer-text: #7a5a45;--rk-btn-hover: #ead9c3;--rk-filter-active: #fcd34d;--rk-filter-glow: rgba(252, 211, 77, .4);--rk-popup-bg: #fffdf9;--rk-popup-text: #3b2a20;--rk-popup-border: #d3bda6;--rk-popup-radius: 8px;--rk-pinned-bg: #fbf6ef;--rk-pinned-header-bg: #5b3a29;--rk-selected-bg: #ecd5b8;--rk-skeleton-a: #eadfce;--rk-skeleton-b: #f6efe4;--rk-checkbox-color: #a1622f;--rk-checkbox-border: #b9956f}:where([data-rk-theme=graphite]){color-scheme:dark;--rk-font: system-ui, sans-serif;--rk-text: #e5e7eb;--rk-muted: #9ca3af;--rk-border: #374151;--rk-surface: #18181b;--rk-primary: #2dd4bf;--rk-danger: #f87171;--rk-grid-bg: #18181b;--rk-grid-radius: 4px;--rk-grid-shadow: 0 10px 10px rgba(0, 0, 0, .55);--rk-toolbar-bg: #1f1f23;--rk-input-bg: #27272a;--rk-input-border: #3f3f46;--rk-input-text: #e5e7eb;--rk-header-bg: #27272a;--rk-header-text: #5eead4;--rk-header-hover-bg: rgba(94, 234, 212, .12);--rk-header-border: #3f3f46;--rk-cell-border: #27272a;--rk-row-hover: #26303a;--rk-stripe-a: #18181b;--rk-stripe-b: #1d1d21;--rk-footer-bg: #1f1f23;--rk-footer-text: #9ca3af;--rk-btn-hover: #3f3f46;--rk-invalid-bg: #450a0a;--rk-filter-active: #2dd4bf;--rk-filter-glow: rgba(45, 212, 191, .35);--rk-popup-bg: #27272a;--rk-popup-text: #e5e7eb;--rk-popup-border: #52525b;--rk-popup-radius: 4px;--rk-popup-shadow: 0 16px 40px rgba(0, 0, 0, .65);--rk-pinned-bg: #18181b;--rk-pinned-header-bg: #27272a;--rk-selected-bg: #134e4a;--rk-skeleton-a: #27272a;--rk-skeleton-b: #3a3a40;--rk-checkbox-color: #2dd4bf;--rk-checkbox-border: #71717a;--rk-checkbox-bg: #18181b;--rk-checkbox-tick: #042f2e}:where([data-rk-theme=aurora]){color-scheme:dark;--rk-font: "Inter", system-ui, sans-serif;--rk-text: #e0f2f1;--rk-muted: #8fb5b0;--rk-border: #1f3b4d;--rk-surface: #0b1d2a;--rk-primary: #34d399;--rk-danger: #fb7185;--rk-grid-bg: #0b1d2a;--rk-grid-radius: 16px;--rk-grid-shadow: 0 14px 44px rgba(52, 211, 153, .18);--rk-toolbar-bg: #0e2433;--rk-input-bg: #12304a;--rk-input-border: #25506b;--rk-input-text: #e0f2f1;--rk-header-bg: linear-gradient(90deg, #059669, #0ea5e9 55%, #8b5cf6);--rk-header-text: #ffffff;--rk-header-hover-bg: rgba(94, 5, 79, .16);--rk-header-border: transparent;--rk-cell-border: #14293a;--rk-row-hover: #143247;--rk-stripe-a: #0b1d2a;--rk-stripe-b: #0f2536;--rk-footer-bg: #0e2433;--rk-footer-text: #8fb5b0;--rk-btn-hover: #1c4560;--rk-invalid-bg: #4c0519;--rk-filter-active: #6ee7b7;--rk-filter-glow: rgba(110, 231, 183, .4);--rk-popup-bg: #12304a;--rk-popup-text: #e0f2f1;--rk-popup-border: #2f6a8c;--rk-popup-radius: 14px;--rk-popup-shadow: 0 18px 44px rgba(0, 0, 0, .6);--rk-pinned-bg: #0b1d2a;--rk-pinned-header-bg: #059669;--rk-selected-bg: #0f4a45;--rk-skeleton-a: #12304a;--rk-skeleton-b: #1d4863;--rk-checkbox-color: #34d399;--rk-checkbox-border: #3d7a8f;--rk-checkbox-bg: #0b1d2a;--rk-checkbox-tick: #052e22}

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "react-gridix",
-  "version": "0.1.1",
-  "description": "A simple React library for displaying arrays in table form",
+  "version": "0.2.0",
+  "description": "A simple React library for displaying arrays in tables",
   "author": "Felix Ongom",
   "type": "module",
   "main": "./dist/react-gridix.cjs",
   "module": "./dist/react-gridix.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",
+  "keywords": ["table", "react-table", "react-grid", "tabular-display"],
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",