@pallasoft/ps-core-components 2.45.0 → 2.46.1

package/dist/components/ps-data-boundary.d.ts

@@ -1,9 +1,14 @@
 import { type ElementType, type ReactNode } from 'react';
+import { PsDataBoundaryVariant } from '../constants/ps-data-boundary-variant';
 export interface PsDataBoundaryProps<Data> {
     AwaitComponent: ElementType;
-    children: (data: Data) => ReactNode;
+    children: (data: Data, isPending: boolean) => ReactNode;
+    className?: string;
     errorElement: ReactNode;
     fallback: ReactNode;
     resolve: Promise<Data>;
+    retain?: boolean;
+    retainKey?: string;
+    variant?: PsDataBoundaryVariant;
 }
-export declare const PsDataBoundary: <Data>({ AwaitComponent, children, errorElement, fallback, resolve, }: PsDataBoundaryProps<Data>) => import("react").JSX.Element;
+export declare const PsDataBoundary: <Data>({ AwaitComponent, children, className, errorElement, fallback, resolve, retain, retainKey, variant, }: PsDataBoundaryProps<Data>) => import("react").JSX.Element;

package/dist/components/ps-data-boundary.js

@@ -3,5 +3,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PsDataBoundary = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const PsDataBoundary = ({ AwaitComponent, children, errorElement, fallback, resolve, }) => ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: fallback, children: (0, jsx_runtime_1.jsx)(AwaitComponent, { errorElement: errorElement, resolve: resolve, children: children }) }));
+const ps_design_system_1 = require("@pallasoft/ps-design-system");
+const ps_data_boundary_config_1 = require("../constants/ps-data-boundary-config");
+const ps_data_boundary_variant_1 = require("../constants/ps-data-boundary-variant");
+const PsDataBoundary = ({ AwaitComponent, children, className, errorElement, fallback, resolve, retain = false, retainKey, variant = ps_data_boundary_variant_1.PsDataBoundaryVariant.Page, }) => {
+    const deferred = (0, react_1.useDeferredValue)({ key: retainKey, resolve });
+    const isRetaining = retain && deferred.key === retainKey;
+    const shown = isRetaining ? deferred.resolve : resolve;
+    const isPending = shown !== resolve;
+    const content = ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: fallback, children: (0, jsx_runtime_1.jsx)(AwaitComponent, { errorElement: errorElement, resolve: shown, children: (data) => children(data, isPending) }) }));
+    if (variant === ps_data_boundary_variant_1.PsDataBoundaryVariant.Page)
+        return content;
+    return ((0, jsx_runtime_1.jsx)("div", { "aria-busy": isPending, className: ps_design_system_1.PallasoftClassNameService.merge(ps_data_boundary_config_1.PsDataBoundaryConfig.sectionClassName, isPending ? ps_data_boundary_config_1.PsDataBoundaryConfig.pendingClassName : null, className), children: content }));
+};
 exports.PsDataBoundary = PsDataBoundary;

package/dist/constants/ps-data-boundary-config.d.ts

@@ -0,0 +1,4 @@
+export declare const PsDataBoundaryConfig: {
+    readonly pendingClassName: "opacity-60 transition-opacity";
+    readonly sectionClassName: "transition-opacity";
+};

package/dist/constants/ps-data-boundary-config.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsDataBoundaryConfig = void 0;
+exports.PsDataBoundaryConfig = {
+    pendingClassName: 'opacity-60 transition-opacity',
+    sectionClassName: 'transition-opacity',
+};

package/dist/constants/ps-data-boundary-variant.d.ts

@@ -0,0 +1,4 @@
+export declare enum PsDataBoundaryVariant {
+    Page = "page",
+    Section = "section"
+}

package/dist/constants/ps-data-boundary-variant.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsDataBoundaryVariant = void 0;
+var PsDataBoundaryVariant;
+(function (PsDataBoundaryVariant) {
+    PsDataBoundaryVariant["Page"] = "page";
+    PsDataBoundaryVariant["Section"] = "section";
+})(PsDataBoundaryVariant || (exports.PsDataBoundaryVariant = PsDataBoundaryVariant = {}));

package/dist/constants/ps-optimistic-config.d.ts

@@ -1,4 +1,5 @@
 export declare const PsOptimisticConfig: {
     readonly pendingPrefix: "pending-";
+    readonly releaseTimeoutMs: 15000;
     readonly submitTimeoutMs: 30000;
 };

package/dist/constants/ps-optimistic-config.js

@@ -3,5 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PsOptimisticConfig = void 0;
 exports.PsOptimisticConfig = {
     pendingPrefix: 'pending-',
+    releaseTimeoutMs: 15000,
     submitTimeoutMs: 30000,
 };

package/dist/constants/ps-skeleton-config.d.ts

@@ -10,6 +10,7 @@ export declare const PsSkeletonConfig: {
     readonly importantPrefix: "!";
     readonly widthUtilityPattern: RegExp;
     readonly heightUtilityPattern: RegExp;
+    readonly radiusUtilityPattern: RegExp;
     readonly compactControlHeightClassName: "h-ps-control-compact";
     readonly tabWidthClassName: "w-24";
     readonly tabCount: 4;

package/dist/constants/ps-skeleton-config.js

@@ -16,6 +16,7 @@ exports.PsSkeletonConfig = {
     importantPrefix: '!',
     widthUtilityPattern: /^(w|size)-/,
     heightUtilityPattern: /^(h|size)-/,
+    radiusUtilityPattern: /^rounded(-|$)/,
     compactControlHeightClassName: 'h-ps-control-compact',
     tabWidthClassName: 'w-24',
     tabCount: 4,

package/dist/esm/components/ps-data-boundary.js

@@ -1,3 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Suspense } from 'react';
-export const PsDataBoundary = ({ AwaitComponent, children, errorElement, fallback, resolve, }) => (_jsx(Suspense, { fallback: fallback, children: _jsx(AwaitComponent, { errorElement: errorElement, resolve: resolve, children: children }) }));
+import { Suspense, useDeferredValue } from 'react';
+import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
+import { PsDataBoundaryConfig } from '../constants/ps-data-boundary-config.js';
+import { PsDataBoundaryVariant } from '../constants/ps-data-boundary-variant.js';
+export const PsDataBoundary = ({ AwaitComponent, children, className, errorElement, fallback, resolve, retain = false, retainKey, variant = PsDataBoundaryVariant.Page, }) => {
+    const deferred = useDeferredValue({ key: retainKey, resolve });
+    const isRetaining = retain && deferred.key === retainKey;
+    const shown = isRetaining ? deferred.resolve : resolve;
+    const isPending = shown !== resolve;
+    const content = (_jsx(Suspense, { fallback: fallback, children: _jsx(AwaitComponent, { errorElement: errorElement, resolve: shown, children: (data) => children(data, isPending) }) }));
+    if (variant === PsDataBoundaryVariant.Page)
+        return content;
+    return (_jsx("div", { "aria-busy": isPending, className: PallasoftClassNameService.merge(PsDataBoundaryConfig.sectionClassName, isPending ? PsDataBoundaryConfig.pendingClassName : null, className), children: content }));
+};

package/dist/esm/constants/ps-data-boundary-config.js

@@ -0,0 +1,4 @@
+export const PsDataBoundaryConfig = {
+    pendingClassName: 'opacity-60 transition-opacity',
+    sectionClassName: 'transition-opacity',
+};

package/dist/esm/constants/ps-data-boundary-variant.js

@@ -0,0 +1,5 @@
+export var PsDataBoundaryVariant;
+(function (PsDataBoundaryVariant) {
+    PsDataBoundaryVariant["Page"] = "page";
+    PsDataBoundaryVariant["Section"] = "section";
+})(PsDataBoundaryVariant || (PsDataBoundaryVariant = {}));

package/dist/esm/constants/ps-optimistic-config.js

@@ -1,4 +1,5 @@
 export const PsOptimisticConfig = {
     pendingPrefix: 'pending-',
+    releaseTimeoutMs: 15000,
     submitTimeoutMs: 30000,
 };

package/dist/esm/constants/ps-skeleton-config.js

@@ -13,6 +13,7 @@ export const PsSkeletonConfig = {
     importantPrefix: '!',
     widthUtilityPattern: /^(w|size)-/,
     heightUtilityPattern: /^(h|size)-/,
+    radiusUtilityPattern: /^rounded(-|$)/,
     compactControlHeightClassName: 'h-ps-control-compact',
     tabWidthClassName: 'w-24',
     tabCount: 4,

package/dist/esm/hooks/use-ps-optimistic-rows.js

@@ -1,17 +1,29 @@
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { PsOptimisticConfig } from '../constants/ps-optimistic-config.js';
+import { PsOptimisticReleaseService } from '../services/ps-optimistic-release-service.js';
 export const usePsOptimisticRows = ({ apply, isHolding = false, isSaving, rows, }) => {
-    const [remembered, setRemembered] = useState({
-        base: rows,
-        changes: [],
-    });
+    const [remembered, setRemembered] = useState(() => PsOptimisticReleaseService.empty(rows));
     const isActive = isSaving || isHolding;
-    const isStale = remembered.base !== rows && !isActive;
-    if (isStale)
-        setRemembered({ base: rows, changes: [] });
-    const changes = isStale ? [] : remembered.changes;
+    const current = PsOptimisticReleaseService.next(remembered, rows, isActive, isHolding, apply);
+    if (current !== remembered)
+        setRemembered(current);
+    const { changes } = current;
+    const isHeld = changes.length > 0 && !isActive;
     const shown = useMemo(() => (changes.length === 0 ? rows : apply(rows, changes)), [apply, changes, rows]);
-    const remember = useCallback((change) => setRemembered((current) => ({ base: rows, changes: [...current.changes, change] })), [rows]);
-    const forgetLast = useCallback(() => setRemembered((current) => ({ base: current.base, changes: current.changes.slice(0, -1) })), []);
-    const rollback = useCallback(() => setRemembered({ base: rows, changes: [] }), [rows]);
+    useEffect(() => {
+        if (!isHeld)
+            return undefined;
+        const timer = setTimeout(() => setRemembered(PsOptimisticReleaseService.empty(rows)), PsOptimisticConfig.releaseTimeoutMs);
+        return () => clearTimeout(timer);
+    }, [isHeld, changes, rows]);
+    const remember = useCallback((change) => setRemembered((previous) => ({
+        base: rows,
+        changes: [...previous.changes, change],
+        drainBase: null,
+        wasActive: previous.wasActive,
+        wasHolding: previous.wasHolding,
+    })), [rows]);
+    const forgetLast = useCallback(() => setRemembered((previous) => ({ ...previous, changes: previous.changes.slice(0, -1) })), []);
+    const rollback = useCallback(() => setRemembered(PsOptimisticReleaseService.empty(rows)), [rows]);
     return { forgetLast, remember, rollback, rows: shown };
 };

package/dist/esm/hooks/use-ps-promise-value.js

@@ -0,0 +1,15 @@
+import { useEffect, useState } from 'react';
+export const usePsPromiseValue = (promise, initial) => {
+    const [value, setValue] = useState(initial);
+    useEffect(() => {
+        let isCurrent = true;
+        void promise.then((resolved) => {
+            if (isCurrent)
+                setValue(resolved);
+        }, () => undefined);
+        return () => {
+            isCurrent = false;
+        };
+    }, [promise]);
+    return value;
+};

package/dist/esm/hooks/use-ps-retained-promise.js

@@ -0,0 +1,21 @@
+import { useEffect, useState } from 'react';
+export const usePsRetainedPromise = (promise) => {
+    const [state, setState] = useState({
+        hasFailed: false,
+        value: null,
+    });
+    useEffect(() => {
+        let isCurrent = true;
+        void promise.then((value) => {
+            if (isCurrent)
+                setState({ hasFailed: false, value });
+        }, () => {
+            if (isCurrent)
+                setState((previous) => ({ ...previous, hasFailed: true }));
+        });
+        return () => {
+            isCurrent = false;
+        };
+    }, [promise]);
+    return state;
+};

package/dist/esm/index.js

@@ -127,6 +127,12 @@ export * from './components/ps-active-filter-chip.js';
 export * from './components/ps-back-link.js';
 export * from './components/ps-card-block-skeleton.js';
 export * from './components/ps-data-boundary.js';
+export * from './constants/ps-data-boundary-config.js';
+export * from './constants/ps-data-boundary-variant.js';
+export * from './hooks/use-ps-retained-promise.js';
+export * from './hooks/use-ps-promise-value.js';
+export * from './interfaces/ps-retained-promise-data.js';
+export * from './services/ps-deep-equal-service.js';
 export * from './components/ps-faq-answer.js';
 export * from './components/ps-feature-grid.js';
 export * from './components/ps-feature-card.js';

package/dist/esm/interfaces/ps-retained-promise-data.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/services/ps-deep-equal-service.js

@@ -0,0 +1,31 @@
+export class PsDeepEqualService {
+    static isEqual(left, right) {
+        if (Object.is(left, right))
+            return true;
+        if (typeof left !== 'object' || typeof right !== 'object')
+            return false;
+        if (left === null || right === null)
+            return false;
+        if (Array.isArray(left) || Array.isArray(right))
+            return PsDeepEqualService.isArrayEqual(left, right);
+        if (left instanceof Date || right instanceof Date) {
+            return left instanceof Date && right instanceof Date && left.getTime() === right.getTime();
+        }
+        return PsDeepEqualService.isRecordEqual(left, right);
+    }
+    static isArrayEqual(left, right) {
+        if (!Array.isArray(left) || !Array.isArray(right))
+            return false;
+        if (left.length !== right.length)
+            return false;
+        return left.every((item, index) => PsDeepEqualService.isEqual(item, right[index]));
+    }
+    static isRecordEqual(left, right) {
+        const leftEntries = Object.entries(left);
+        const rightRecord = { ...right };
+        if (leftEntries.length !== Object.keys(rightRecord).length)
+            return false;
+        return leftEntries.every(([key, value]) => Object.prototype.hasOwnProperty.call(rightRecord, key) &&
+            PsDeepEqualService.isEqual(value, rightRecord[key]));
+    }
+}

package/dist/esm/services/ps-optimistic-release-service.js

@@ -0,0 +1,38 @@
+import { PsDeepEqualService } from './ps-deep-equal-service.js';
+export class PsOptimisticReleaseService {
+    static empty(rows) {
+        return { base: rows, changes: [], drainBase: null, wasActive: false, wasHolding: false };
+    }
+    static next(remembered, rows, isActive, isHolding, apply) {
+        if (isActive) {
+            const wasHolding = remembered.wasHolding || isHolding;
+            if (remembered.wasActive &&
+                remembered.drainBase === null &&
+                remembered.wasHolding === wasHolding)
+                return remembered;
+            return { ...remembered, drainBase: null, wasActive: true, wasHolding };
+        }
+        if (remembered.changes.length === 0) {
+            if (remembered.base === rows && !remembered.wasActive)
+                return remembered;
+            return PsOptimisticReleaseService.empty(rows);
+        }
+        if (remembered.wasActive) {
+            if (remembered.wasHolding && rows !== remembered.base) {
+                return PsOptimisticReleaseService.empty(rows);
+            }
+            if (!PsDeepEqualService.isEqual(rows, remembered.base)) {
+                return PsOptimisticReleaseService.empty(rows);
+            }
+            return { ...remembered, drainBase: rows, wasActive: false, wasHolding: false };
+        }
+        const reference = remembered.drainBase === null ? remembered.base : remembered.drainBase;
+        if (!PsDeepEqualService.isEqual(rows, reference)) {
+            return PsOptimisticReleaseService.empty(rows);
+        }
+        if (PsDeepEqualService.isEqual(apply(rows, remembered.changes), rows)) {
+            return PsOptimisticReleaseService.empty(rows);
+        }
+        return remembered;
+    }
+}

package/dist/esm/services/ps-skeleton-class-service.js

@@ -10,8 +10,18 @@ export class PsSkeletonClassService {
             : [];
         const hasWidth = utilities.some((utility) => PsSkeletonConfig.widthUtilityPattern.test(utility));
         const hasHeight = utilities.some((utility) => PsSkeletonConfig.heightUtilityPattern.test(utility));
+        const hasRadius = utilities.some((utility) => PsSkeletonConfig.radiusUtilityPattern.test(utility));
         const size = PsSkeletonConfig.shapeSizes[shape];
-        return PallasoftClassNameService.merge(PsSkeletonConfig.baseClassName, PsSkeletonConfig.shapeClassNames[shape], hasHeight ? null : size.height, hasWidth ? null : size.width, className);
+        const shapeClassName = hasRadius
+            ? PsSkeletonClassService.withoutRadius(PsSkeletonConfig.shapeClassNames[shape])
+            : PsSkeletonConfig.shapeClassNames[shape];
+        return PallasoftClassNameService.merge(PsSkeletonConfig.baseClassName, shapeClassName, hasHeight ? null : size.height, hasWidth ? null : size.width, className);
+    }
+    static withoutRadius(className) {
+        return className
+            .split(PsSkeletonConfig.classSeparator)
+            .filter((token) => !PsSkeletonConfig.radiusUtilityPattern.test(token))
+            .join(' ');
     }
     static withoutImportant(token) {
         return token.startsWith(PsSkeletonConfig.importantPrefix) ? token.slice(1) : token;

package/dist/hooks/use-ps-optimistic-rows.js

@@ -2,20 +2,32 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.usePsOptimisticRows = void 0;
 const react_1 = require("react");
+const ps_optimistic_config_1 = require("../constants/ps-optimistic-config");
+const ps_optimistic_release_service_1 = require("../services/ps-optimistic-release-service");
 const usePsOptimisticRows = ({ apply, isHolding = false, isSaving, rows, }) => {
-    const [remembered, setRemembered] = (0, react_1.useState)({
-        base: rows,
-        changes: [],
-    });
+    const [remembered, setRemembered] = (0, react_1.useState)(() => ps_optimistic_release_service_1.PsOptimisticReleaseService.empty(rows));
     const isActive = isSaving || isHolding;
-    const isStale = remembered.base !== rows && !isActive;
-    if (isStale)
-        setRemembered({ base: rows, changes: [] });
-    const changes = isStale ? [] : remembered.changes;
+    const current = ps_optimistic_release_service_1.PsOptimisticReleaseService.next(remembered, rows, isActive, isHolding, apply);
+    if (current !== remembered)
+        setRemembered(current);
+    const { changes } = current;
+    const isHeld = changes.length > 0 && !isActive;
     const shown = (0, react_1.useMemo)(() => (changes.length === 0 ? rows : apply(rows, changes)), [apply, changes, rows]);
-    const remember = (0, react_1.useCallback)((change) => setRemembered((current) => ({ base: rows, changes: [...current.changes, change] })), [rows]);
-    const forgetLast = (0, react_1.useCallback)(() => setRemembered((current) => ({ base: current.base, changes: current.changes.slice(0, -1) })), []);
-    const rollback = (0, react_1.useCallback)(() => setRemembered({ base: rows, changes: [] }), [rows]);
+    (0, react_1.useEffect)(() => {
+        if (!isHeld)
+            return undefined;
+        const timer = setTimeout(() => setRemembered(ps_optimistic_release_service_1.PsOptimisticReleaseService.empty(rows)), ps_optimistic_config_1.PsOptimisticConfig.releaseTimeoutMs);
+        return () => clearTimeout(timer);
+    }, [isHeld, changes, rows]);
+    const remember = (0, react_1.useCallback)((change) => setRemembered((previous) => ({
+        base: rows,
+        changes: [...previous.changes, change],
+        drainBase: null,
+        wasActive: previous.wasActive,
+        wasHolding: previous.wasHolding,
+    })), [rows]);
+    const forgetLast = (0, react_1.useCallback)(() => setRemembered((previous) => ({ ...previous, changes: previous.changes.slice(0, -1) })), []);
+    const rollback = (0, react_1.useCallback)(() => setRemembered(ps_optimistic_release_service_1.PsOptimisticReleaseService.empty(rows)), [rows]);
     return { forgetLast, remember, rollback, rows: shown };
 };
 exports.usePsOptimisticRows = usePsOptimisticRows;

package/dist/hooks/use-ps-promise-value.d.ts

@@ -0,0 +1 @@
+export declare const usePsPromiseValue: <Value>(promise: Promise<Value>, initial: Value) => Value;

package/dist/hooks/use-ps-promise-value.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsPromiseValue = void 0;
+const react_1 = require("react");
+const usePsPromiseValue = (promise, initial) => {
+    const [value, setValue] = (0, react_1.useState)(initial);
+    (0, react_1.useEffect)(() => {
+        let isCurrent = true;
+        void promise.then((resolved) => {
+            if (isCurrent)
+                setValue(resolved);
+        }, () => undefined);
+        return () => {
+            isCurrent = false;
+        };
+    }, [promise]);
+    return value;
+};
+exports.usePsPromiseValue = usePsPromiseValue;

package/dist/hooks/use-ps-retained-promise.d.ts

@@ -0,0 +1,2 @@
+import type { PsRetainedPromiseData } from '../interfaces/ps-retained-promise-data';
+export declare const usePsRetainedPromise: <Value>(promise: Promise<Value>) => PsRetainedPromiseData<Value>;

package/dist/hooks/use-ps-retained-promise.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsRetainedPromise = void 0;
+const react_1 = require("react");
+const usePsRetainedPromise = (promise) => {
+    const [state, setState] = (0, react_1.useState)({
+        hasFailed: false,
+        value: null,
+    });
+    (0, react_1.useEffect)(() => {
+        let isCurrent = true;
+        void promise.then((value) => {
+            if (isCurrent)
+                setState({ hasFailed: false, value });
+        }, () => {
+            if (isCurrent)
+                setState((previous) => ({ ...previous, hasFailed: true }));
+        });
+        return () => {
+            isCurrent = false;
+        };
+    }, [promise]);
+    return state;
+};
+exports.usePsRetainedPromise = usePsRetainedPromise;

package/dist/index.d.ts

@@ -127,6 +127,12 @@ export * from './components/ps-active-filter-chip';
 export * from './components/ps-back-link';
 export * from './components/ps-card-block-skeleton';
 export * from './components/ps-data-boundary';
+export * from './constants/ps-data-boundary-config';
+export * from './constants/ps-data-boundary-variant';
+export * from './hooks/use-ps-retained-promise';
+export * from './hooks/use-ps-promise-value';
+export * from './interfaces/ps-retained-promise-data';
+export * from './services/ps-deep-equal-service';
 export * from './components/ps-faq-answer';
 export * from './components/ps-feature-grid';
 export * from './components/ps-feature-card';

package/dist/index.js

@@ -143,6 +143,12 @@ __exportStar(require("./components/ps-active-filter-chip"), exports);
 __exportStar(require("./components/ps-back-link"), exports);
 __exportStar(require("./components/ps-card-block-skeleton"), exports);
 __exportStar(require("./components/ps-data-boundary"), exports);
+__exportStar(require("./constants/ps-data-boundary-config"), exports);
+__exportStar(require("./constants/ps-data-boundary-variant"), exports);
+__exportStar(require("./hooks/use-ps-retained-promise"), exports);
+__exportStar(require("./hooks/use-ps-promise-value"), exports);
+__exportStar(require("./interfaces/ps-retained-promise-data"), exports);
+__exportStar(require("./services/ps-deep-equal-service"), exports);
 __exportStar(require("./components/ps-faq-answer"), exports);
 __exportStar(require("./components/ps-feature-grid"), exports);
 __exportStar(require("./components/ps-feature-card"), exports);

package/dist/interfaces/ps-optimistic-changes.d.ts

@@ -1,4 +1,7 @@
 export interface PsOptimisticChanges<Row, Change> {
     base: Row[];
     changes: Change[];
+    drainBase: Row[] | null;
+    wasActive: boolean;
+    wasHolding: boolean;
 }

package/dist/interfaces/ps-retained-promise-data.d.ts

@@ -0,0 +1,4 @@
+export interface PsRetainedPromiseData<Value> {
+    hasFailed: boolean;
+    value: Value | null;
+}

package/dist/interfaces/ps-retained-promise-data.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/services/ps-deep-equal-service.d.ts

@@ -0,0 +1,5 @@
+export declare class PsDeepEqualService {
+    static isEqual(left: unknown, right: unknown): boolean;
+    private static isArrayEqual;
+    private static isRecordEqual;
+}

package/dist/services/ps-deep-equal-service.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsDeepEqualService = void 0;
+class PsDeepEqualService {
+    static isEqual(left, right) {
+        if (Object.is(left, right))
+            return true;
+        if (typeof left !== 'object' || typeof right !== 'object')
+            return false;
+        if (left === null || right === null)
+            return false;
+        if (Array.isArray(left) || Array.isArray(right))
+            return PsDeepEqualService.isArrayEqual(left, right);
+        if (left instanceof Date || right instanceof Date) {
+            return left instanceof Date && right instanceof Date && left.getTime() === right.getTime();
+        }
+        return PsDeepEqualService.isRecordEqual(left, right);
+    }
+    static isArrayEqual(left, right) {
+        if (!Array.isArray(left) || !Array.isArray(right))
+            return false;
+        if (left.length !== right.length)
+            return false;
+        return left.every((item, index) => PsDeepEqualService.isEqual(item, right[index]));
+    }
+    static isRecordEqual(left, right) {
+        const leftEntries = Object.entries(left);
+        const rightRecord = { ...right };
+        if (leftEntries.length !== Object.keys(rightRecord).length)
+            return false;
+        return leftEntries.every(([key, value]) => Object.prototype.hasOwnProperty.call(rightRecord, key) &&
+            PsDeepEqualService.isEqual(value, rightRecord[key]));
+    }
+}
+exports.PsDeepEqualService = PsDeepEqualService;

package/dist/services/ps-optimistic-release-service.d.ts

@@ -0,0 +1,5 @@
+import type { PsOptimisticChanges } from '../interfaces/ps-optimistic-changes';
+export declare class PsOptimisticReleaseService {
+    static empty<Row, Change>(rows: Row[]): PsOptimisticChanges<Row, Change>;
+    static next<Row, Change>(remembered: PsOptimisticChanges<Row, Change>, rows: Row[], isActive: boolean, isHolding: boolean, apply: (rows: Row[], changes: Change[]) => Row[]): PsOptimisticChanges<Row, Change>;
+}

package/dist/services/ps-optimistic-release-service.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsOptimisticReleaseService = void 0;
+const ps_deep_equal_service_1 = require("./ps-deep-equal-service");
+class PsOptimisticReleaseService {
+    static empty(rows) {
+        return { base: rows, changes: [], drainBase: null, wasActive: false, wasHolding: false };
+    }
+    static next(remembered, rows, isActive, isHolding, apply) {
+        if (isActive) {
+            const wasHolding = remembered.wasHolding || isHolding;
+            if (remembered.wasActive &&
+                remembered.drainBase === null &&
+                remembered.wasHolding === wasHolding)
+                return remembered;
+            return { ...remembered, drainBase: null, wasActive: true, wasHolding };
+        }
+        if (remembered.changes.length === 0) {
+            if (remembered.base === rows && !remembered.wasActive)
+                return remembered;
+            return PsOptimisticReleaseService.empty(rows);
+        }
+        if (remembered.wasActive) {
+            if (remembered.wasHolding && rows !== remembered.base) {
+                return PsOptimisticReleaseService.empty(rows);
+            }
+            if (!ps_deep_equal_service_1.PsDeepEqualService.isEqual(rows, remembered.base)) {
+                return PsOptimisticReleaseService.empty(rows);
+            }
+            return { ...remembered, drainBase: rows, wasActive: false, wasHolding: false };
+        }
+        const reference = remembered.drainBase === null ? remembered.base : remembered.drainBase;
+        if (!ps_deep_equal_service_1.PsDeepEqualService.isEqual(rows, reference)) {
+            return PsOptimisticReleaseService.empty(rows);
+        }
+        if (ps_deep_equal_service_1.PsDeepEqualService.isEqual(apply(rows, remembered.changes), rows)) {
+            return PsOptimisticReleaseService.empty(rows);
+        }
+        return remembered;
+    }
+}
+exports.PsOptimisticReleaseService = PsOptimisticReleaseService;

package/dist/services/ps-skeleton-class-service.d.ts

@@ -1,5 +1,6 @@
 import { PsSkeletonShape } from '../constants/ps-skeleton-shape';
 export declare class PsSkeletonClassService {
     static resolve(shape: PsSkeletonShape, className?: string): string;
+    private static withoutRadius;
     private static withoutImportant;
 }

package/dist/services/ps-skeleton-class-service.js

@@ -13,8 +13,18 @@ class PsSkeletonClassService {
             : [];
         const hasWidth = utilities.some((utility) => ps_skeleton_config_1.PsSkeletonConfig.widthUtilityPattern.test(utility));
         const hasHeight = utilities.some((utility) => ps_skeleton_config_1.PsSkeletonConfig.heightUtilityPattern.test(utility));
+        const hasRadius = utilities.some((utility) => ps_skeleton_config_1.PsSkeletonConfig.radiusUtilityPattern.test(utility));
         const size = ps_skeleton_config_1.PsSkeletonConfig.shapeSizes[shape];
-        return ps_design_system_1.PallasoftClassNameService.merge(ps_skeleton_config_1.PsSkeletonConfig.baseClassName, ps_skeleton_config_1.PsSkeletonConfig.shapeClassNames[shape], hasHeight ? null : size.height, hasWidth ? null : size.width, className);
+        const shapeClassName = hasRadius
+            ? PsSkeletonClassService.withoutRadius(ps_skeleton_config_1.PsSkeletonConfig.shapeClassNames[shape])
+            : ps_skeleton_config_1.PsSkeletonConfig.shapeClassNames[shape];
+        return ps_design_system_1.PallasoftClassNameService.merge(ps_skeleton_config_1.PsSkeletonConfig.baseClassName, shapeClassName, hasHeight ? null : size.height, hasWidth ? null : size.width, className);
+    }
+    static withoutRadius(className) {
+        return className
+            .split(ps_skeleton_config_1.PsSkeletonConfig.classSeparator)
+            .filter((token) => !ps_skeleton_config_1.PsSkeletonConfig.radiusUtilityPattern.test(token))
+            .join(' ');
     }
     static withoutImportant(token) {
         return token.startsWith(ps_skeleton_config_1.PsSkeletonConfig.importantPrefix) ? token.slice(1) : token;

package/package.json

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