@pallasoft/ps-core-components 2.30.0 → 2.31.0

package/dist/components/ps-document-row.d.ts

@@ -0,0 +1,19 @@
+import type { ReactNode } from 'react';
+export interface PsDocumentRowProps {
+    actions?: ReactNode;
+    amount?: ReactNode;
+    badges?: ReactNode;
+    className?: string;
+    date?: string;
+    isSelected?: boolean;
+    note?: ReactNode;
+    onOpen?: () => void;
+    onPrefetch?: () => void;
+    select?: ReactNode;
+    subtitle?: string;
+    thumbnailAlt?: string;
+    thumbnailFallback?: ReactNode;
+    thumbnailSrc?: string | null;
+    title: string;
+}
+export declare const PsDocumentRow: ({ actions, amount, badges, className, date, isSelected, note, onOpen, onPrefetch, select, subtitle, thumbnailAlt, thumbnailFallback, thumbnailSrc, title, }: PsDocumentRowProps) => import("react").JSX.Element;

package/dist/components/ps-document-row.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsDocumentRow = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ps_design_system_1 = require("@pallasoft/ps-design-system");
+const PsDocumentRow = ({ actions, amount, badges, className, date, isSelected = false, note, onOpen, onPrefetch, select, subtitle, thumbnailAlt = '', thumbnailFallback, thumbnailSrc, title, }) => {
+    const Main = onOpen ? 'button' : 'div';
+    return ((0, jsx_runtime_1.jsxs)("div", { className: ps_design_system_1.PallasoftClassNameService.merge('flex min-w-0 flex-wrap items-center gap-x-3 gap-y-2 border-b border-line/70 px-3 py-3 transition-colors last:border-b-0 sm:flex-nowrap', isSelected ? 'bg-primary/5' : 'hover:bg-mist/40', className), children: [select ? (0, jsx_runtime_1.jsx)("span", { className: 'flex shrink-0 items-center', children: select }) : null, (0, jsx_runtime_1.jsxs)(Main, { className: 'ps-focus-ring grid min-w-0 flex-1 basis-0 grid-cols-[auto_minmax(0,1fr)] items-center gap-x-3 gap-y-1 rounded-ps-control text-left sm:grid-cols-[auto_minmax(0,1fr)_auto]', ...(onOpen
+                    ? {
+                        onClick: onOpen,
+                        onFocus: onPrefetch,
+                        onPointerEnter: onPrefetch,
+                        type: 'button',
+                    }
+                    : {}), children: [(0, jsx_runtime_1.jsx)("span", { className: 'row-span-2 flex h-14 w-11 shrink-0 items-center justify-center overflow-hidden rounded-ps-control border border-line/60 bg-mist/40 sm:row-span-1', children: thumbnailSrc ? ((0, jsx_runtime_1.jsx)("img", { alt: thumbnailAlt, className: 'h-full w-full object-cover object-top', decoding: 'async', loading: 'lazy', src: thumbnailSrc })) : (thumbnailFallback) }), (0, jsx_runtime_1.jsxs)("span", { className: 'flex min-w-0 flex-col gap-0.5', children: [(0, jsx_runtime_1.jsx)("span", { className: 'truncate text-sm font-semibold text-ink', children: title }), subtitle ? (0, jsx_runtime_1.jsx)("span", { className: 'truncate text-xs text-ink/55', children: subtitle }) : null, badges ? ((0, jsx_runtime_1.jsx)("span", { className: 'flex flex-wrap items-center gap-1.5 pt-1', children: badges })) : null, note ? ((0, jsx_runtime_1.jsx)("span", { className: 'line-clamp-2 break-words pt-0.5 text-xs text-ink/70', children: note })) : null] }), amount || date ? ((0, jsx_runtime_1.jsxs)("span", { className: 'col-start-2 flex items-baseline gap-2 sm:col-start-3 sm:flex-col sm:items-end sm:gap-0.5', children: [amount ? ((0, jsx_runtime_1.jsx)("span", { className: 'text-sm font-semibold tabular-nums text-ink', children: amount })) : null, date ? (0, jsx_runtime_1.jsx)("span", { className: 'text-xs tabular-nums text-ink/55', children: date }) : null] })) : null] }), actions ? ((0, jsx_runtime_1.jsx)("div", { className: 'flex w-full shrink-0 items-center justify-end gap-2 sm:w-auto', children: actions })) : null] }));
+};
+exports.PsDocumentRow = PsDocumentRow;

package/dist/components/ps-selection-bar.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+export interface PsSelectionBarProps {
+    children: ReactNode;
+    className?: string;
+    clearLabel: string;
+    countLabel: string;
+    onClear: () => void;
+}
+export declare const PsSelectionBar: ({ children, className, clearLabel, countLabel, onClear, }: PsSelectionBarProps) => import("react").JSX.Element;

package/dist/components/ps-selection-bar.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsSelectionBar = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ps_design_system_1 = require("@pallasoft/ps-design-system");
+const ps_icons_1 = require("@pallasoft/ps-icons");
+const PsSelectionBar = ({ children, className, clearLabel, countLabel, onClear, }) => ((0, jsx_runtime_1.jsxs)("div", { "aria-live": 'polite', className: ps_design_system_1.PallasoftClassNameService.merge('sticky bottom-3 z-10 flex min-w-0 flex-wrap items-center gap-x-3 gap-y-2 rounded-ps-card border border-line bg-surface px-4 py-2 shadow-lg', className), role: 'toolbar', children: [(0, jsx_runtime_1.jsx)("span", { className: 'text-sm font-semibold text-ink', children: countLabel }), (0, jsx_runtime_1.jsx)("div", { className: 'flex min-w-0 flex-1 flex-wrap items-center gap-2', children: children }), (0, jsx_runtime_1.jsx)("button", { "aria-label": clearLabel, className: 'ps-focus-ring ps-control-square inline-flex shrink-0 items-center justify-center rounded-ps-control text-ink/65 transition-colors hover:bg-ink/5 hover:text-ink', onClick: onClear, title: clearLabel, type: 'button', children: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: ps_icons_1.PsIconKey.Close }) })] }));
+exports.PsSelectionBar = PsSelectionBar;

package/dist/esm/components/ps-document-row.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
+export const PsDocumentRow = ({ actions, amount, badges, className, date, isSelected = false, note, onOpen, onPrefetch, select, subtitle, thumbnailAlt = '', thumbnailFallback, thumbnailSrc, title, }) => {
+    const Main = onOpen ? 'button' : 'div';
+    return (_jsxs("div", { className: PallasoftClassNameService.merge('flex min-w-0 flex-wrap items-center gap-x-3 gap-y-2 border-b border-line/70 px-3 py-3 transition-colors last:border-b-0 sm:flex-nowrap', isSelected ? 'bg-primary/5' : 'hover:bg-mist/40', className), children: [select ? _jsx("span", { className: 'flex shrink-0 items-center', children: select }) : null, _jsxs(Main, { className: 'ps-focus-ring grid min-w-0 flex-1 basis-0 grid-cols-[auto_minmax(0,1fr)] items-center gap-x-3 gap-y-1 rounded-ps-control text-left sm:grid-cols-[auto_minmax(0,1fr)_auto]', ...(onOpen
+                    ? {
+                        onClick: onOpen,
+                        onFocus: onPrefetch,
+                        onPointerEnter: onPrefetch,
+                        type: 'button',
+                    }
+                    : {}), children: [_jsx("span", { className: 'row-span-2 flex h-14 w-11 shrink-0 items-center justify-center overflow-hidden rounded-ps-control border border-line/60 bg-mist/40 sm:row-span-1', children: thumbnailSrc ? (_jsx("img", { alt: thumbnailAlt, className: 'h-full w-full object-cover object-top', decoding: 'async', loading: 'lazy', src: thumbnailSrc })) : (thumbnailFallback) }), _jsxs("span", { className: 'flex min-w-0 flex-col gap-0.5', children: [_jsx("span", { className: 'truncate text-sm font-semibold text-ink', children: title }), subtitle ? _jsx("span", { className: 'truncate text-xs text-ink/55', children: subtitle }) : null, badges ? (_jsx("span", { className: 'flex flex-wrap items-center gap-1.5 pt-1', children: badges })) : null, note ? (_jsx("span", { className: 'line-clamp-2 break-words pt-0.5 text-xs text-ink/70', children: note })) : null] }), amount || date ? (_jsxs("span", { className: 'col-start-2 flex items-baseline gap-2 sm:col-start-3 sm:flex-col sm:items-end sm:gap-0.5', children: [amount ? (_jsx("span", { className: 'text-sm font-semibold tabular-nums text-ink', children: amount })) : null, date ? _jsx("span", { className: 'text-xs tabular-nums text-ink/55', children: date }) : null] })) : null] }), actions ? (_jsx("div", { className: 'flex w-full shrink-0 items-center justify-end gap-2 sm:w-auto', children: actions })) : null] }));
+};

package/dist/esm/components/ps-selection-bar.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
+import { PsIcon, PsIconKey } from '@pallasoft/ps-icons';
+export const PsSelectionBar = ({ children, className, clearLabel, countLabel, onClear, }) => (_jsxs("div", { "aria-live": 'polite', className: PallasoftClassNameService.merge('sticky bottom-3 z-10 flex min-w-0 flex-wrap items-center gap-x-3 gap-y-2 rounded-ps-card border border-line bg-surface px-4 py-2 shadow-lg', className), role: 'toolbar', children: [_jsx("span", { className: 'text-sm font-semibold text-ink', children: countLabel }), _jsx("div", { className: 'flex min-w-0 flex-1 flex-wrap items-center gap-2', children: children }), _jsx("button", { "aria-label": clearLabel, className: 'ps-focus-ring ps-control-square inline-flex shrink-0 items-center justify-center rounded-ps-control text-ink/65 transition-colors hover:bg-ink/5 hover:text-ink', onClick: onClear, title: clearLabel, type: 'button', children: _jsx(PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: PsIconKey.Close }) })] }));

package/dist/esm/index.js

@@ -25,6 +25,8 @@ export * from './models/ps-sortable-list';
 export * from './components/ps-empty-state';
 export * from './components/ps-fab';
 export * from './components/ps-infinite-scroll';
+export * from './components/ps-document-row';
+export * from './components/ps-selection-bar';
 export * from './components/ps-list-tile';
 export * from './components/ps-metric-card';
 export * from './components/ps-pill';

package/dist/index.d.ts

@@ -25,6 +25,8 @@ export * from './models/ps-sortable-list';
 export * from './components/ps-empty-state';
 export * from './components/ps-fab';
 export * from './components/ps-infinite-scroll';
+export * from './components/ps-document-row';
+export * from './components/ps-selection-bar';
 export * from './components/ps-list-tile';
 export * from './components/ps-metric-card';
 export * from './components/ps-pill';

package/dist/index.js

@@ -41,6 +41,8 @@ __exportStar(require("./models/ps-sortable-list"), exports);
 __exportStar(require("./components/ps-empty-state"), exports);
 __exportStar(require("./components/ps-fab"), exports);
 __exportStar(require("./components/ps-infinite-scroll"), exports);
+__exportStar(require("./components/ps-document-row"), exports);
+__exportStar(require("./components/ps-selection-bar"), exports);
 __exportStar(require("./components/ps-list-tile"), exports);
 __exportStar(require("./components/ps-metric-card"), exports);
 __exportStar(require("./components/ps-pill"), exports);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pallasoft/ps-core-components",
-	"version": "2.30.0",
+	"version": "2.31.0",
 	"private": false,
 	"main": "./dist/index.js",
 	"module": "./dist/esm/index.js",