@sqrzro/admin 2.1.0-bz.27 → 2.1.0-bz.28

package/dist/components/DataTable/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface DataTableProps {
+    data: Record<string, string>;
+}
+declare function DataTable({ data }: Readonly<DataTableProps>): React.ReactElement;
+export default DataTable;

package/dist/components/DataTable/index.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function DataTable({ data }) {
+    return (_jsx("table", { children: _jsx("tbody", { children: Object.entries(data).map(([key, value]) => (_jsxs("tr", { className: "odd:bg-slate-100", children: [_jsx("th", { className: "p-2 font-normal", children: key }), _jsx("td", { className: "p-2 text-right", children: value })] }, key))) }) }));
+}
+export default DataTable;

package/dist/components/ListItem/index.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import type { StyleVariant } from '@sqrzro/interfaces';
 export interface ListObject<Data = Record<string, unknown>> {
     $data?: Data;
     actions?: (data: Data) => React.ReactNode;
@@ -17,7 +18,8 @@ export interface ListObject<Data = Record<string, unknown>> {
     };
     tertiary?: React.ReactNode;
     title?: React.ReactNode;
+    variant?: StyleVariant;
 }
 export declare function renderMeta(id: string, meta: ListObject['meta']): React.ReactElement | null;
-declare function ListItem<Data = Record<string, unknown>>({ $data, actions, description, href, id, isMinimal, meta, secondary, tertiary, title, }: Readonly<ListObject<Data>>): React.ReactElement;
+declare function ListItem<Data = Record<string, unknown>>({ $data, actions, description, href, id, isMinimal, meta, secondary, tertiary, title, variant, }: Readonly<ListObject<Data>>): React.ReactElement;
 export default ListItem;

package/dist/components/ListItem/index.js

@@ -2,6 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { isValidElement } from 'react';
 import { Link, tw } from '@sqrzro/components';
 import { filterNull } from '@sqrzro/utility';
+const variantMap = {
+    danger: 'text-red-700',
+};
 function getKey(item) {
     if (isValidElement(item)) {
         return item.key;
@@ -17,9 +20,9 @@ export function renderMeta(id, meta) {
     }
     return (_jsx("table", { className: "w-full text-xs", children: _jsx("tbody", { children: Object.entries(meta).map(([key, value]) => (_jsxs("tr", { className: "odd:bg-slate-100", children: [_jsx("th", { className: "p-2 font-semibold", children: key }), _jsx("td", { className: "p-2 text-right", children: value || '-' })] }, key))) }) }));
 }
-function ListItem({ $data, actions, description, href, id, isMinimal, meta, secondary, tertiary, title, }) {
+function ListItem({ $data, actions, description, href, id, isMinimal, meta, secondary, tertiary, title, variant, }) {
     return (_jsx("li", { children: _jsx("article", { className: tw('', isMinimal
                 ? 'border-b border-slate-200 pb-4'
-                : 'bg-panel rounded p-4 shadow-[0px_0px_0px_1px_rgba(9,9,11,0.07),0px_2px_2px_0px_rgba(9,9,11,0.05)]'), "data-testid": `list-item-root--${id}`, children: _jsxs("div", { className: "grid grid-cols-[3fr_2fr_2fr_auto]", children: [_jsxs("div", { children: [title ? (_jsx("h2", { className: "text-base font-semibold", "data-testid": `list-item-title--${id}`, children: href ? _jsx(Link, { href: href, children: title }) : title })) : null, description, meta ? (_jsx("div", { className: tw('mt-1', isMinimal ? '' : 'flex items-center justify-between'), children: meta ? renderMeta(id, meta) : null })) : null] }), tertiary ? (_jsx("div", { className: "flex h-full flex-col justify-center", children: tertiary })) : null, secondary ? (_jsxs("div", { className: "col-start-3 text-right", children: [secondary.title ? (_jsx("p", { className: "text-base font-semibold", children: secondary.title })) : null, secondary.description ? (_jsx("div", { className: "mt-1 text-xs text-slate-500", children: secondary.description })) : null, secondary.meta ? (_jsx("ul", { className: "mt-1 flex items-center justify-end gap-4 text-xs text-slate-500", children: filterNull(secondary.meta).map((item) => (_jsx("li", { children: item }, getKey(item)))) })) : null] })) : null, typeof actions === 'function' ? actions($data) : null] }) }) }));
+                : 'bg-panel rounded p-4 shadow-[0px_0px_0px_1px_rgba(9,9,11,0.07),0px_2px_2px_0px_rgba(9,9,11,0.05)]', variant ? variantMap[variant] : ''), "data-testid": `list-item-root--${id}`, children: _jsxs("div", { className: "grid grid-cols-[3fr_2fr_2fr_auto]", children: [_jsxs("div", { children: [title ? (_jsx("h2", { className: tw('text-base font-semibold', variant === 'danger' ? 'line-through' : ''), "data-testid": `list-item-title--${id}`, children: href ? _jsx(Link, { href: href, children: title }) : title })) : null, description, meta ? (_jsx("div", { className: tw('mt-1', isMinimal ? '' : 'flex items-center justify-between'), children: meta ? renderMeta(id, meta) : null })) : null] }), tertiary ? (_jsx("div", { className: "flex h-full flex-col justify-center", children: tertiary })) : null, secondary ? (_jsxs("div", { className: "col-start-3 text-right", children: [secondary.title ? (_jsx("p", { className: tw('text-base font-semibold', variant === 'danger' ? 'line-through' : ''), children: secondary.title })) : null, secondary.description ? (_jsx("div", { className: "mt-1 text-xs text-slate-500", children: secondary.description })) : null, secondary.meta ? (_jsx("ul", { className: "mt-1 flex items-center justify-end gap-4 text-xs text-slate-500", children: filterNull(secondary.meta).map((item) => (_jsx("li", { children: item }, getKey(item)))) })) : null] })) : null, typeof actions === 'function' ? actions($data) : null] }) }) }));
 }
 export default ListItem;

package/dist/components/index.d.ts

@@ -6,6 +6,8 @@ export type { BadgeProps } from './Badge';
 export { default as Badge } from './Badge';
 export type { DashboardProps } from './Dashboard';
 export { default as Dashboard } from './Dashboard';
+export type { DataTableProps } from './DataTable';
+export { default as DataTable } from './DataTable';
 export type { FilterBarProps, FilterObject } from './FilterBar';
 export { default as FilterBar } from './FilterBar';
 export type { GridListProps } from './GridList';

package/dist/components/index.js

@@ -3,6 +3,7 @@ export { Autocomplete, AutocompleteFormField, Button, CalendarInput, CheckboxInp
 export { default as AppLayout } from './AppLayout';
 export { default as Badge } from './Badge';
 export { default as Dashboard } from './Dashboard';
+export { default as DataTable } from './DataTable';
 export { default as FilterBar } from './FilterBar';
 export { default as GridList } from './GridList';
 export { default as InfoPanel } from './InfoPanel';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sqrzro/admin",
   "type": "module",
-  "version": "2.1.0-bz.27",
+  "version": "2.1.0-bz.28",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "license": "ISC",