@pallasoft/ps-core-components 2.47.1 → 2.49.0

package/dist/components/ps-form-page-skeleton.d.ts

@@ -1,5 +1,9 @@
 export interface PsFormPageSkeletonProps {
+    hasActions?: boolean;
+    hasBackLink?: boolean;
+    isNarrow?: boolean;
     loadingLabel: string;
     title?: string;
+    variant?: 'bordered' | 'card' | 'plain';
 }
-export declare const PsFormPageSkeleton: ({ loadingLabel, title }: PsFormPageSkeletonProps) => import("react").JSX.Element;
+export declare const PsFormPageSkeleton: ({ hasActions, hasBackLink, isNarrow, loadingLabel, title, variant, }: PsFormPageSkeletonProps) => import("react").JSX.Element;

package/dist/components/ps-form-page-skeleton.js

@@ -6,5 +6,5 @@ const ps_page_skeleton_config_1 = require("../constants/ps-page-skeleton-config"
 const ps_form_fields_skeleton_1 = require("./ps-form-fields-skeleton");
 const ps_page_skeleton_1 = require("./ps-page-skeleton");
 const ps_section_panel_skeleton_1 = require("./ps-section-panel-skeleton");
-const PsFormPageSkeleton = ({ loadingLabel, title }) => ((0, jsx_runtime_1.jsx)(ps_page_skeleton_1.PsPageSkeleton, { hasActions: true, loadingLabel: loadingLabel, title: title, children: ps_page_skeleton_config_1.PsPageSkeletonConfig.formSections.map((section) => ((0, jsx_runtime_1.jsx)(ps_section_panel_skeleton_1.PsSectionPanelSkeleton, { children: (0, jsx_runtime_1.jsx)(ps_form_fields_skeleton_1.PsFormFieldsSkeleton, {}) }, section))) }));
+const PsFormPageSkeleton = ({ hasActions = true, hasBackLink = false, isNarrow = false, loadingLabel, title, variant = 'plain', }) => ((0, jsx_runtime_1.jsx)(ps_page_skeleton_1.PsPageSkeleton, { hasActions: hasActions, hasBackLink: hasBackLink, isNarrow: isNarrow, loadingLabel: loadingLabel, title: title, children: ps_page_skeleton_config_1.PsPageSkeletonConfig.formSections.map((section) => ((0, jsx_runtime_1.jsx)(ps_section_panel_skeleton_1.PsSectionPanelSkeleton, { variant: variant, children: (0, jsx_runtime_1.jsx)(ps_form_fields_skeleton_1.PsFormFieldsSkeleton, {}) }, section))) }));
 exports.PsFormPageSkeleton = PsFormPageSkeleton;

package/dist/components/ps-link-preview-card.d.ts

@@ -0,0 +1,15 @@
+import { PsLinkPreviewSize } from '../constants/ps-link-preview-size';
+export interface PsLinkPreviewCardProps {
+    className?: string;
+    description?: string | null;
+    faviconSrc?: string | null;
+    href: string;
+    imageSrc?: string | null;
+    isLoading?: boolean;
+    loadingLabel?: string;
+    opensInNewTabLabel?: string;
+    siteName?: string | null;
+    size?: PsLinkPreviewSize | 'compact' | 'full';
+    title?: string | null;
+}
+export declare const PsLinkPreviewCard: ({ className, description, faviconSrc, href, imageSrc, isLoading, loadingLabel, opensInNewTabLabel, siteName, size, title, }: PsLinkPreviewCardProps) => import("react").JSX.Element | null;

package/dist/components/ps-link-preview-card.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsLinkPreviewCard = 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 ps_link_preview_config_1 = require("../constants/ps-link-preview-config");
+const ps_link_preview_size_1 = require("../constants/ps-link-preview-size");
+const ps_skeleton_shape_1 = require("../constants/ps-skeleton-shape");
+const ps_link_preview_service_1 = require("../services/ps-link-preview-service");
+const ps_image_1 = require("./ps-image");
+const ps_skeleton_1 = require("./ps-skeleton");
+const ps_skeleton_group_1 = require("./ps-skeleton-group");
+const PsLinkPreviewCard = ({ className, description, faviconSrc, href, imageSrc, isLoading = false, loadingLabel, opensInNewTabLabel, siteName, size = ps_link_preview_size_1.PsLinkPreviewSize.Full, title, }) => {
+    const isCompact = size === ps_link_preview_size_1.PsLinkPreviewSize.Compact;
+    const domain = ps_link_preview_service_1.PsLinkPreviewService.domain(href);
+    const hasTitle = title !== null && title !== undefined && title.trim() !== '';
+    const hasSite = siteName !== null && siteName !== undefined && siteName.trim() !== '';
+    const hasDescription = description !== null && description !== undefined && description.trim() !== '';
+    const hasImage = imageSrc !== null && imageSrc !== undefined && imageSrc !== '';
+    const hasFavicon = faviconSrc !== null && faviconSrc !== undefined && faviconSrc !== '';
+    if (!ps_link_preview_service_1.PsLinkPreviewService.isWebAddress(href))
+        return null;
+    if (isLoading)
+        return ((0, jsx_runtime_1.jsxs)(ps_skeleton_group_1.PsSkeletonGroup, { className: ps_design_system_1.PallasoftClassNameService.merge('ps-card min-w-0 overflow-hidden rounded-ps-card', className), direction: isCompact ? 'row' : 'column', gap: 'gap-0', label: loadingLabel, children: [isCompact ? ((0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-20 w-24 shrink-0', shape: ps_skeleton_shape_1.PsSkeletonShape.Block, radius: '0' })) : ((0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { aspect: '1.91 / 1', className: 'w-full', shape: ps_skeleton_shape_1.PsSkeletonShape.Block, radius: '0' })), (0, jsx_runtime_1.jsxs)("span", { className: isCompact ? 'flex flex-1 flex-col gap-2 p-3' : 'flex flex-col gap-2 p-4', children: [(0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-3 w-24' }), (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-4 w-3/4' }), isCompact ? null : (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-3 w-full' })] })] }));
+    const favicon = hasFavicon ? ((0, jsx_runtime_1.jsx)(ps_image_1.PsImage, { alt: '', className: ps_link_preview_config_1.PsLinkPreviewConfig.faviconClassName, errorFallback: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { className: ps_link_preview_config_1.PsLinkPreviewConfig.globeIconClassName, iconKey: ps_icons_1.PsIconKey.Globe }), height: 16, loading: 'lazy', src: faviconSrc, width: 16 })) : ((0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { className: ps_link_preview_config_1.PsLinkPreviewConfig.globeIconClassName, iconKey: ps_icons_1.PsIconKey.Globe }));
+    const meta = ((0, jsx_runtime_1.jsxs)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.metaRowClassName, children: [favicon, (0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.siteClassName, children: hasSite ? siteName : domain }), (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { className: ps_link_preview_config_1.PsLinkPreviewConfig.externalIconClassName, iconKey: ps_icons_1.PsIconKey.ExternalLink })] }));
+    const text = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [meta, hasTitle ? ((0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.titleClassName, children: title })) : ((0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.urlClassName, children: href })), hasDescription && !isCompact ? ((0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.descriptionClassName, children: description })) : null, opensInNewTabLabel === undefined ? null : ((0, jsx_runtime_1.jsx)("span", { className: 'sr-only', children: opensInNewTabLabel }))] }));
+    const media = hasImage ? ((0, jsx_runtime_1.jsx)(ps_image_1.PsImage, { alt: '', className: isCompact
+            ? ps_link_preview_config_1.PsLinkPreviewConfig.compactImageClassName
+            : ps_link_preview_config_1.PsLinkPreviewConfig.fullImageClassName, errorFallback: null, loading: 'lazy', src: imageSrc })) : null;
+    return ((0, jsx_runtime_1.jsx)("a", { className: ps_design_system_1.PallasoftClassNameService.merge(ps_link_preview_config_1.PsLinkPreviewConfig.anchorClassName, className), href: href, rel: ps_link_preview_config_1.PsLinkPreviewConfig.rel, target: ps_link_preview_config_1.PsLinkPreviewConfig.target, children: isCompact ? ((0, jsx_runtime_1.jsxs)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.compactRowClassName, children: [media === null ? null : ((0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.compactMediaClassName, children: media })), (0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.compactBodyClassName, children: text })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [media === null ? null : ((0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.fullMediaClassName, children: media })), (0, jsx_runtime_1.jsx)("span", { className: ps_link_preview_config_1.PsLinkPreviewConfig.fullBodyClassName, children: text })] })) }));
+};
+exports.PsLinkPreviewCard = PsLinkPreviewCard;

package/dist/components/ps-metric-grid-skeleton.js

@@ -2,6 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PsMetricGridSkeleton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const ps_metric_grid_config_1 = require("../constants/ps-metric-grid-config");
 const ps_metric_card_1 = require("./ps-metric-card");
-const PsMetricGridSkeleton = ({ count }) => ((0, jsx_runtime_1.jsx)("div", { className: 'grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4', children: Array.from({ length: count }, (_, index) => ((0, jsx_runtime_1.jsx)(ps_metric_card_1.PsMetricCard, { isLoading: true, label: '', value: '' }, index))) }));
+const PsMetricGridSkeleton = ({ count }) => {
+    const columns = ps_metric_grid_config_1.PsMetricGridColumns[Math.min(count, ps_metric_grid_config_1.PsMetricGridConfig.maxColumns)];
+    return ((0, jsx_runtime_1.jsx)("div", { className: `grid grid-cols-1 gap-3 ${columns === undefined ? ps_metric_grid_config_1.PsMetricGridColumns[ps_metric_grid_config_1.PsMetricGridConfig.defaultColumns] : columns}`, children: Array.from({ length: count }, (_, index) => ((0, jsx_runtime_1.jsx)(ps_metric_card_1.PsMetricCard, { isLoading: true, label: '', value: '' }, index))) }));
+};
 exports.PsMetricGridSkeleton = PsMetricGridSkeleton;

package/dist/components/ps-page-header.d.ts

@@ -3,6 +3,7 @@ import { type PsBackLinkProps } from './ps-back-link';
 export interface PsPageHeaderProps {
     actions?: ReactNode;
     backLink?: PsBackLinkProps;
+    leading?: ReactNode;
     title: string;
 }
-export declare const PsPageHeader: ({ actions, backLink, title }: PsPageHeaderProps) => import("react").JSX.Element;
+export declare const PsPageHeader: ({ actions, backLink, leading, title }: PsPageHeaderProps) => import("react").JSX.Element;

package/dist/components/ps-page-header.js

@@ -4,5 +4,5 @@ exports.PsPageHeader = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ps_back_link_1 = require("./ps-back-link");
 const ps_section_header_1 = require("./ps-section-header");
-const PsPageHeader = ({ actions, backLink, title }) => ((0, jsx_runtime_1.jsx)(ps_section_header_1.PsSectionHeader, { leading: backLink ? (0, jsx_runtime_1.jsx)(ps_back_link_1.PsBackLink, { ...backLink }) : undefined, title: title, trailing: actions ? ((0, jsx_runtime_1.jsx)("div", { className: 'flex flex-wrap items-center justify-end gap-2', children: actions })) : undefined }));
+const PsPageHeader = ({ actions, backLink, leading, title }) => ((0, jsx_runtime_1.jsx)(ps_section_header_1.PsSectionHeader, { leading: backLink ? (0, jsx_runtime_1.jsx)(ps_back_link_1.PsBackLink, { ...backLink }) : leading, title: title, trailing: actions ? ((0, jsx_runtime_1.jsx)("div", { className: 'flex flex-wrap items-center justify-end gap-2', children: actions })) : undefined }));
 exports.PsPageHeader = PsPageHeader;

package/dist/components/ps-page-skeleton.d.ts

@@ -3,8 +3,9 @@ export interface PsPageSkeletonProps {
     actions?: ReactNode;
     children: ReactNode;
     hasActions?: boolean;
+    hasBackLink?: boolean;
     isNarrow?: boolean;
     loadingLabel: string;
     title?: string;
 }
-export declare const PsPageSkeleton: ({ actions, children, hasActions, isNarrow, loadingLabel, title, }: PsPageSkeletonProps) => import("react").JSX.Element;
+export declare const PsPageSkeleton: ({ actions, children, hasActions, hasBackLink, isNarrow, loadingLabel, title, }: PsPageSkeletonProps) => import("react").JSX.Element;

package/dist/components/ps-page-skeleton.js

@@ -8,5 +8,8 @@ const ps_page_layout_1 = require("./ps-page-layout");
 const ps_page_stack_1 = require("./ps-page-stack");
 const ps_section_header_1 = require("./ps-section-header");
 const ps_skeleton_1 = require("./ps-skeleton");
-const PsPageSkeleton = ({ actions, children, hasActions = false, isNarrow = false, loadingLabel, title, }) => ((0, jsx_runtime_1.jsx)(ps_page_layout_1.PsPageLayout, { isNarrow: isNarrow, children: (0, jsx_runtime_1.jsxs)(ps_page_stack_1.PsPageStack, { children: [title === undefined ? ((0, jsx_runtime_1.jsx)(ps_section_header_1.PsSectionHeader, { isLoading: true, title: loadingLabel, trailing: hasActions })) : ((0, jsx_runtime_1.jsx)(ps_page_header_1.PsPageHeader, { actions: actions !== undefined ? (actions) : hasActions ? ((0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { shape: ps_skeleton_shape_1.PsSkeletonShape.Button })) : undefined, title: title })), children] }) }));
+const PsPageSkeleton = ({ actions, children, hasActions = false, hasBackLink = false, isNarrow = false, loadingLabel, title, }) => {
+    const backLink = hasBackLink ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-5 w-32' }) : undefined;
+    return ((0, jsx_runtime_1.jsx)(ps_page_layout_1.PsPageLayout, { isNarrow: isNarrow, children: (0, jsx_runtime_1.jsxs)(ps_page_stack_1.PsPageStack, { children: [title === undefined ? ((0, jsx_runtime_1.jsx)(ps_section_header_1.PsSectionHeader, { isLoading: true, leading: backLink, title: loadingLabel, trailing: hasActions })) : ((0, jsx_runtime_1.jsx)(ps_page_header_1.PsPageHeader, { actions: actions !== undefined ? (actions) : hasActions ? ((0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { shape: ps_skeleton_shape_1.PsSkeletonShape.Button })) : undefined, leading: backLink, title: title })), children] }) }));
+};
 exports.PsPageSkeleton = PsPageSkeleton;

package/dist/components/ps-section-header.js

@@ -5,5 +5,5 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const ps_skeleton_shape_1 = require("../constants/ps-skeleton-shape");
 const ps_skeleton_1 = require("./ps-skeleton");
 const ps_skeleton_group_1 = require("./ps-skeleton-group");
-const PsSectionHeader = ({ description, eyebrow, isLoading = false, leading, title, trailing, }) => isLoading ? ((0, jsx_runtime_1.jsxs)(ps_skeleton_group_1.PsSkeletonGroup, { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', label: title, children: [(0, jsx_runtime_1.jsxs)("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [eyebrow ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-2.5 w-24' }) : null, (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-6 w-52' }), description ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-3 w-72' }) : null] }), trailing ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { shape: ps_skeleton_shape_1.PsSkeletonShape.Button }) : null] })) : ((0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [leading, eyebrow ? ((0, jsx_runtime_1.jsx)("p", { className: 'text-[0.68rem] font-semibold uppercase tracking-[0.22em] text-ink/50', children: eyebrow })) : null, (0, jsx_runtime_1.jsx)("h1", { className: 'break-words text-xl font-extrabold text-ink sm:text-2xl', children: title }), description ? ((0, jsx_runtime_1.jsx)("p", { className: 'max-w-3xl text-sm leading-6 text-ink/60', children: description })) : null] }), trailing ? ((0, jsx_runtime_1.jsx)("div", { className: 'flex w-full shrink-0 items-center justify-end sm:ml-auto sm:w-auto', children: trailing })) : null] }));
+const PsSectionHeader = ({ description, eyebrow, isLoading = false, leading, title, trailing, }) => isLoading ? ((0, jsx_runtime_1.jsxs)(ps_skeleton_group_1.PsSkeletonGroup, { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', label: title, children: [(0, jsx_runtime_1.jsxs)("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [leading, eyebrow ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-2.5 w-24' }) : null, (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-6 w-52' }), description ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-3 w-72' }) : null] }), trailing ? (0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { shape: ps_skeleton_shape_1.PsSkeletonShape.Button }) : null] })) : ((0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [leading, eyebrow ? ((0, jsx_runtime_1.jsx)("p", { className: 'text-[0.68rem] font-semibold uppercase tracking-[0.22em] text-ink/50', children: eyebrow })) : null, (0, jsx_runtime_1.jsx)("h1", { className: 'break-words text-xl font-extrabold text-ink sm:text-2xl', children: title }), description ? ((0, jsx_runtime_1.jsx)("p", { className: 'max-w-3xl text-sm leading-6 text-ink/60', children: description })) : null] }), trailing ? ((0, jsx_runtime_1.jsx)("div", { className: 'flex w-full shrink-0 items-center justify-end sm:ml-auto sm:w-auto', children: trailing })) : null] }));
 exports.PsSectionHeader = PsSectionHeader;

package/dist/components/ps-section-panel-skeleton.d.ts

@@ -2,5 +2,6 @@ import type { ReactNode } from 'react';
 export interface PsSectionPanelSkeletonProps {
     children: ReactNode;
     title?: string;
+    variant?: 'bordered' | 'card' | 'plain';
 }
-export declare const PsSectionPanelSkeleton: ({ children, title }: PsSectionPanelSkeletonProps) => import("react").JSX.Element;
+export declare const PsSectionPanelSkeleton: ({ children, title, variant, }: PsSectionPanelSkeletonProps) => import("react").JSX.Element;

package/dist/components/ps-section-panel-skeleton.js

@@ -3,5 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PsSectionPanelSkeleton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ps_skeleton_1 = require("./ps-skeleton");
-const PsSectionPanelSkeleton = ({ children, title }) => ((0, jsx_runtime_1.jsxs)("section", { className: 'ps-section', children: [(0, jsx_runtime_1.jsx)("div", { className: 'flex min-h-10 items-center', children: title === undefined ? ((0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-4 w-44' })) : ((0, jsx_runtime_1.jsx)("h2", { className: 'text-base font-semibold text-ink', children: title })) }), (0, jsx_runtime_1.jsx)("div", { className: 'flex min-w-0 flex-col gap-4', children: children })] }));
+const PsSectionPanelSkeleton = ({ children, title, variant = 'plain', }) => {
+    const heading = title === undefined ? ((0, jsx_runtime_1.jsx)(ps_skeleton_1.PsSkeleton, { className: 'h-4 w-44' })) : ((0, jsx_runtime_1.jsx)("h2", { className: 'text-base font-semibold text-ink', children: title }));
+    return variant === 'bordered' ? ((0, jsx_runtime_1.jsxs)("section", { className: 'rounded-ps-panel border border-line bg-surface', children: [(0, jsx_runtime_1.jsx)("header", { className: 'flex min-h-14 items-center justify-between gap-3 border-b border-line px-5 py-3', children: (0, jsx_runtime_1.jsx)("div", { className: 'flex min-w-0 flex-col', children: heading }) }), (0, jsx_runtime_1.jsx)("div", { className: 'flex flex-col gap-4 p-5', children: children })] })) : variant === 'card' ? ((0, jsx_runtime_1.jsxs)("section", { className: 'rounded-ps-panel border border-line bg-surface p-5', children: [(0, jsx_runtime_1.jsx)("div", { className: 'mb-3', children: heading }), children] })) : ((0, jsx_runtime_1.jsxs)("section", { className: 'ps-section', children: [(0, jsx_runtime_1.jsx)("div", { className: 'flex min-h-10 items-center', children: heading }), (0, jsx_runtime_1.jsx)("div", { className: 'flex min-w-0 flex-col gap-4', children: children })] }));
+};
 exports.PsSectionPanelSkeleton = PsSectionPanelSkeleton;

package/dist/constants/ps-link-preview-config.d.ts

@@ -0,0 +1,20 @@
+export declare const PsLinkPreviewConfig: {
+    readonly anchorClassName: "ps-card ps-focus-ring group block min-w-0 overflow-hidden rounded-ps-card text-left no-underline transition hover:border-primary/60";
+    readonly compactBodyClassName: "flex min-w-0 flex-1 flex-col gap-0.5 p-3";
+    readonly compactImageClassName: "h-full w-full object-cover";
+    readonly compactMediaClassName: "relative block w-20 shrink-0 self-stretch overflow-hidden bg-ink/5 empty:hidden sm:w-24 [&>span]:block [&>span]:h-full [&>span]:w-full";
+    readonly compactRowClassName: "flex min-w-0 items-stretch";
+    readonly descriptionClassName: "line-clamp-2 break-words text-sm text-ink/70";
+    readonly externalIconClassName: "h-4 w-4 shrink-0 text-ink/50 transition group-hover:text-primary";
+    readonly faviconClassName: "h-4 w-4 shrink-0 rounded-sm object-contain";
+    readonly fullBodyClassName: "flex min-w-0 flex-col gap-1 p-4";
+    readonly fullImageClassName: "h-full w-full object-cover";
+    readonly fullMediaClassName: "relative block aspect-[1.91/1] w-full overflow-hidden bg-ink/5 empty:hidden [&>span]:block [&>span]:h-full [&>span]:w-full";
+    readonly globeIconClassName: "h-4 w-4 shrink-0 text-ink/50";
+    readonly metaRowClassName: "flex min-w-0 items-center gap-2 text-xs font-medium text-ink/60";
+    readonly rel: "noopener noreferrer";
+    readonly siteClassName: "min-w-0 flex-1 truncate";
+    readonly target: "_blank";
+    readonly titleClassName: "line-clamp-2 break-words text-sm font-bold text-ink transition group-hover:text-primary";
+    readonly urlClassName: "truncate text-xs text-ink/60";
+};

package/dist/constants/ps-link-preview-config.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsLinkPreviewConfig = void 0;
+exports.PsLinkPreviewConfig = {
+    anchorClassName: 'ps-card ps-focus-ring group block min-w-0 overflow-hidden rounded-ps-card text-left no-underline transition hover:border-primary/60',
+    compactBodyClassName: 'flex min-w-0 flex-1 flex-col gap-0.5 p-3',
+    compactImageClassName: 'h-full w-full object-cover',
+    compactMediaClassName: 'relative block w-20 shrink-0 self-stretch overflow-hidden bg-ink/5 empty:hidden sm:w-24 [&>span]:block [&>span]:h-full [&>span]:w-full',
+    compactRowClassName: 'flex min-w-0 items-stretch',
+    descriptionClassName: 'line-clamp-2 break-words text-sm text-ink/70',
+    externalIconClassName: 'h-4 w-4 shrink-0 text-ink/50 transition group-hover:text-primary',
+    faviconClassName: 'h-4 w-4 shrink-0 rounded-sm object-contain',
+    fullBodyClassName: 'flex min-w-0 flex-col gap-1 p-4',
+    fullImageClassName: 'h-full w-full object-cover',
+    fullMediaClassName: 'relative block aspect-[1.91/1] w-full overflow-hidden bg-ink/5 empty:hidden [&>span]:block [&>span]:h-full [&>span]:w-full',
+    globeIconClassName: 'h-4 w-4 shrink-0 text-ink/50',
+    metaRowClassName: 'flex min-w-0 items-center gap-2 text-xs font-medium text-ink/60',
+    rel: 'noopener noreferrer',
+    siteClassName: 'min-w-0 flex-1 truncate',
+    target: '_blank',
+    titleClassName: 'line-clamp-2 break-words text-sm font-bold text-ink transition group-hover:text-primary',
+    urlClassName: 'truncate text-xs text-ink/60',
+};

package/dist/constants/ps-link-preview-size.d.ts

@@ -0,0 +1,4 @@
+export declare enum PsLinkPreviewSize {
+    Compact = "compact",
+    Full = "full"
+}

package/dist/constants/ps-link-preview-size.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsLinkPreviewSize = void 0;
+var PsLinkPreviewSize;
+(function (PsLinkPreviewSize) {
+    PsLinkPreviewSize["Compact"] = "compact";
+    PsLinkPreviewSize["Full"] = "full";
+})(PsLinkPreviewSize || (exports.PsLinkPreviewSize = PsLinkPreviewSize = {}));

package/dist/esm/components/ps-form-page-skeleton.js

@@ -3,4 +3,4 @@ import { PsPageSkeletonConfig } from '../constants/ps-page-skeleton-config.js';
 import { PsFormFieldsSkeleton } from './ps-form-fields-skeleton.js';
 import { PsPageSkeleton } from './ps-page-skeleton.js';
 import { PsSectionPanelSkeleton } from './ps-section-panel-skeleton.js';
-export const PsFormPageSkeleton = ({ loadingLabel, title }) => (_jsx(PsPageSkeleton, { hasActions: true, loadingLabel: loadingLabel, title: title, children: PsPageSkeletonConfig.formSections.map((section) => (_jsx(PsSectionPanelSkeleton, { children: _jsx(PsFormFieldsSkeleton, {}) }, section))) }));
+export const PsFormPageSkeleton = ({ hasActions = true, hasBackLink = false, isNarrow = false, loadingLabel, title, variant = 'plain', }) => (_jsx(PsPageSkeleton, { hasActions: hasActions, hasBackLink: hasBackLink, isNarrow: isNarrow, loadingLabel: loadingLabel, title: title, children: PsPageSkeletonConfig.formSections.map((section) => (_jsx(PsSectionPanelSkeleton, { variant: variant, children: _jsx(PsFormFieldsSkeleton, {}) }, section))) }));

package/dist/esm/components/ps-link-preview-card.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
+import { PsIcon, PsIconKey } from '@pallasoft/ps-icons';
+import { PsLinkPreviewConfig } from '../constants/ps-link-preview-config.js';
+import { PsLinkPreviewSize } from '../constants/ps-link-preview-size.js';
+import { PsSkeletonShape } from '../constants/ps-skeleton-shape.js';
+import { PsLinkPreviewService } from '../services/ps-link-preview-service.js';
+import { PsImage } from './ps-image.js';
+import { PsSkeleton } from './ps-skeleton.js';
+import { PsSkeletonGroup } from './ps-skeleton-group.js';
+export const PsLinkPreviewCard = ({ className, description, faviconSrc, href, imageSrc, isLoading = false, loadingLabel, opensInNewTabLabel, siteName, size = PsLinkPreviewSize.Full, title, }) => {
+    const isCompact = size === PsLinkPreviewSize.Compact;
+    const domain = PsLinkPreviewService.domain(href);
+    const hasTitle = title !== null && title !== undefined && title.trim() !== '';
+    const hasSite = siteName !== null && siteName !== undefined && siteName.trim() !== '';
+    const hasDescription = description !== null && description !== undefined && description.trim() !== '';
+    const hasImage = imageSrc !== null && imageSrc !== undefined && imageSrc !== '';
+    const hasFavicon = faviconSrc !== null && faviconSrc !== undefined && faviconSrc !== '';
+    if (!PsLinkPreviewService.isWebAddress(href))
+        return null;
+    if (isLoading)
+        return (_jsxs(PsSkeletonGroup, { className: PallasoftClassNameService.merge('ps-card min-w-0 overflow-hidden rounded-ps-card', className), direction: isCompact ? 'row' : 'column', gap: 'gap-0', label: loadingLabel, children: [isCompact ? (_jsx(PsSkeleton, { className: 'h-20 w-24 shrink-0', shape: PsSkeletonShape.Block, radius: '0' })) : (_jsx(PsSkeleton, { aspect: '1.91 / 1', className: 'w-full', shape: PsSkeletonShape.Block, radius: '0' })), _jsxs("span", { className: isCompact ? 'flex flex-1 flex-col gap-2 p-3' : 'flex flex-col gap-2 p-4', children: [_jsx(PsSkeleton, { className: 'h-3 w-24' }), _jsx(PsSkeleton, { className: 'h-4 w-3/4' }), isCompact ? null : _jsx(PsSkeleton, { className: 'h-3 w-full' })] })] }));
+    const favicon = hasFavicon ? (_jsx(PsImage, { alt: '', className: PsLinkPreviewConfig.faviconClassName, errorFallback: _jsx(PsIcon, { className: PsLinkPreviewConfig.globeIconClassName, iconKey: PsIconKey.Globe }), height: 16, loading: 'lazy', src: faviconSrc, width: 16 })) : (_jsx(PsIcon, { className: PsLinkPreviewConfig.globeIconClassName, iconKey: PsIconKey.Globe }));
+    const meta = (_jsxs("span", { className: PsLinkPreviewConfig.metaRowClassName, children: [favicon, _jsx("span", { className: PsLinkPreviewConfig.siteClassName, children: hasSite ? siteName : domain }), _jsx(PsIcon, { className: PsLinkPreviewConfig.externalIconClassName, iconKey: PsIconKey.ExternalLink })] }));
+    const text = (_jsxs(_Fragment, { children: [meta, hasTitle ? (_jsx("span", { className: PsLinkPreviewConfig.titleClassName, children: title })) : (_jsx("span", { className: PsLinkPreviewConfig.urlClassName, children: href })), hasDescription && !isCompact ? (_jsx("span", { className: PsLinkPreviewConfig.descriptionClassName, children: description })) : null, opensInNewTabLabel === undefined ? null : (_jsx("span", { className: 'sr-only', children: opensInNewTabLabel }))] }));
+    const media = hasImage ? (_jsx(PsImage, { alt: '', className: isCompact
+            ? PsLinkPreviewConfig.compactImageClassName
+            : PsLinkPreviewConfig.fullImageClassName, errorFallback: null, loading: 'lazy', src: imageSrc })) : null;
+    return (_jsx("a", { className: PallasoftClassNameService.merge(PsLinkPreviewConfig.anchorClassName, className), href: href, rel: PsLinkPreviewConfig.rel, target: PsLinkPreviewConfig.target, children: isCompact ? (_jsxs("span", { className: PsLinkPreviewConfig.compactRowClassName, children: [media === null ? null : (_jsx("span", { className: PsLinkPreviewConfig.compactMediaClassName, children: media })), _jsx("span", { className: PsLinkPreviewConfig.compactBodyClassName, children: text })] })) : (_jsxs(_Fragment, { children: [media === null ? null : (_jsx("span", { className: PsLinkPreviewConfig.fullMediaClassName, children: media })), _jsx("span", { className: PsLinkPreviewConfig.fullBodyClassName, children: text })] })) }));
+};

package/dist/esm/components/ps-metric-grid-skeleton.js

@@ -1,3 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { PsMetricGridColumns, PsMetricGridConfig } from '../constants/ps-metric-grid-config.js';
 import { PsMetricCard } from './ps-metric-card.js';
-export const PsMetricGridSkeleton = ({ count }) => (_jsx("div", { className: 'grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4', children: Array.from({ length: count }, (_, index) => (_jsx(PsMetricCard, { isLoading: true, label: '', value: '' }, index))) }));
+export const PsMetricGridSkeleton = ({ count }) => {
+    const columns = PsMetricGridColumns[Math.min(count, PsMetricGridConfig.maxColumns)];
+    return (_jsx("div", { className: `grid grid-cols-1 gap-3 ${columns === undefined ? PsMetricGridColumns[PsMetricGridConfig.defaultColumns] : columns}`, children: Array.from({ length: count }, (_, index) => (_jsx(PsMetricCard, { isLoading: true, label: '', value: '' }, index))) }));
+};

package/dist/esm/components/ps-page-header.js

@@ -1,4 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { PsBackLink } from './ps-back-link.js';
 import { PsSectionHeader } from './ps-section-header.js';
-export const PsPageHeader = ({ actions, backLink, title }) => (_jsx(PsSectionHeader, { leading: backLink ? _jsx(PsBackLink, { ...backLink }) : undefined, title: title, trailing: actions ? (_jsx("div", { className: 'flex flex-wrap items-center justify-end gap-2', children: actions })) : undefined }));
+export const PsPageHeader = ({ actions, backLink, leading, title }) => (_jsx(PsSectionHeader, { leading: backLink ? _jsx(PsBackLink, { ...backLink }) : leading, title: title, trailing: actions ? (_jsx("div", { className: 'flex flex-wrap items-center justify-end gap-2', children: actions })) : undefined }));

package/dist/esm/components/ps-page-skeleton.js

@@ -5,4 +5,7 @@ import { PsPageLayout } from './ps-page-layout.js';
 import { PsPageStack } from './ps-page-stack.js';
 import { PsSectionHeader } from './ps-section-header.js';
 import { PsSkeleton } from './ps-skeleton.js';
-export const PsPageSkeleton = ({ actions, children, hasActions = false, isNarrow = false, loadingLabel, title, }) => (_jsx(PsPageLayout, { isNarrow: isNarrow, children: _jsxs(PsPageStack, { children: [title === undefined ? (_jsx(PsSectionHeader, { isLoading: true, title: loadingLabel, trailing: hasActions })) : (_jsx(PsPageHeader, { actions: actions !== undefined ? (actions) : hasActions ? (_jsx(PsSkeleton, { shape: PsSkeletonShape.Button })) : undefined, title: title })), children] }) }));
+export const PsPageSkeleton = ({ actions, children, hasActions = false, hasBackLink = false, isNarrow = false, loadingLabel, title, }) => {
+    const backLink = hasBackLink ? _jsx(PsSkeleton, { className: 'h-5 w-32' }) : undefined;
+    return (_jsx(PsPageLayout, { isNarrow: isNarrow, children: _jsxs(PsPageStack, { children: [title === undefined ? (_jsx(PsSectionHeader, { isLoading: true, leading: backLink, title: loadingLabel, trailing: hasActions })) : (_jsx(PsPageHeader, { actions: actions !== undefined ? (actions) : hasActions ? (_jsx(PsSkeleton, { shape: PsSkeletonShape.Button })) : undefined, leading: backLink, title: title })), children] }) }));
+};

package/dist/esm/components/ps-section-header.js

@@ -2,4 +2,4 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PsSkeletonShape } from '../constants/ps-skeleton-shape.js';
 import { PsSkeleton } from './ps-skeleton.js';
 import { PsSkeletonGroup } from './ps-skeleton-group.js';
-export const PsSectionHeader = ({ description, eyebrow, isLoading = false, leading, title, trailing, }) => isLoading ? (_jsxs(PsSkeletonGroup, { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', label: title, children: [_jsxs("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [eyebrow ? _jsx(PsSkeleton, { className: 'h-2.5 w-24' }) : null, _jsx(PsSkeleton, { className: 'h-6 w-52' }), description ? _jsx(PsSkeleton, { className: 'h-3 w-72' }) : null] }), trailing ? _jsx(PsSkeleton, { shape: PsSkeletonShape.Button }) : null] })) : (_jsxs("div", { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', children: [_jsxs("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [leading, eyebrow ? (_jsx("p", { className: 'text-[0.68rem] font-semibold uppercase tracking-[0.22em] text-ink/50', children: eyebrow })) : null, _jsx("h1", { className: 'break-words text-xl font-extrabold text-ink sm:text-2xl', children: title }), description ? (_jsx("p", { className: 'max-w-3xl text-sm leading-6 text-ink/60', children: description })) : null] }), trailing ? (_jsx("div", { className: 'flex w-full shrink-0 items-center justify-end sm:ml-auto sm:w-auto', children: trailing })) : null] }));
+export const PsSectionHeader = ({ description, eyebrow, isLoading = false, leading, title, trailing, }) => isLoading ? (_jsxs(PsSkeletonGroup, { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', label: title, children: [_jsxs("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [leading, eyebrow ? _jsx(PsSkeleton, { className: 'h-2.5 w-24' }) : null, _jsx(PsSkeleton, { className: 'h-6 w-52' }), description ? _jsx(PsSkeleton, { className: 'h-3 w-72' }) : null] }), trailing ? _jsx(PsSkeleton, { shape: PsSkeletonShape.Button }) : null] })) : (_jsxs("div", { className: 'flex flex-wrap items-end justify-between gap-x-4 gap-y-3', children: [_jsxs("div", { className: 'flex min-w-0 flex-1 basis-auto flex-col gap-2', children: [leading, eyebrow ? (_jsx("p", { className: 'text-[0.68rem] font-semibold uppercase tracking-[0.22em] text-ink/50', children: eyebrow })) : null, _jsx("h1", { className: 'break-words text-xl font-extrabold text-ink sm:text-2xl', children: title }), description ? (_jsx("p", { className: 'max-w-3xl text-sm leading-6 text-ink/60', children: description })) : null] }), trailing ? (_jsx("div", { className: 'flex w-full shrink-0 items-center justify-end sm:ml-auto sm:w-auto', children: trailing })) : null] }));

package/dist/esm/components/ps-section-panel-skeleton.js

@@ -1,3 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PsSkeleton } from './ps-skeleton.js';
-export const PsSectionPanelSkeleton = ({ children, title }) => (_jsxs("section", { className: 'ps-section', children: [_jsx("div", { className: 'flex min-h-10 items-center', children: title === undefined ? (_jsx(PsSkeleton, { className: 'h-4 w-44' })) : (_jsx("h2", { className: 'text-base font-semibold text-ink', children: title })) }), _jsx("div", { className: 'flex min-w-0 flex-col gap-4', children: children })] }));
+export const PsSectionPanelSkeleton = ({ children, title, variant = 'plain', }) => {
+    const heading = title === undefined ? (_jsx(PsSkeleton, { className: 'h-4 w-44' })) : (_jsx("h2", { className: 'text-base font-semibold text-ink', children: title }));
+    return variant === 'bordered' ? (_jsxs("section", { className: 'rounded-ps-panel border border-line bg-surface', children: [_jsx("header", { className: 'flex min-h-14 items-center justify-between gap-3 border-b border-line px-5 py-3', children: _jsx("div", { className: 'flex min-w-0 flex-col', children: heading }) }), _jsx("div", { className: 'flex flex-col gap-4 p-5', children: children })] })) : variant === 'card' ? (_jsxs("section", { className: 'rounded-ps-panel border border-line bg-surface p-5', children: [_jsx("div", { className: 'mb-3', children: heading }), children] })) : (_jsxs("section", { className: 'ps-section', children: [_jsx("div", { className: 'flex min-h-10 items-center', children: heading }), _jsx("div", { className: 'flex min-w-0 flex-col gap-4', children: children })] }));
+};

package/dist/esm/constants/ps-link-preview-config.js

@@ -0,0 +1,20 @@
+export const PsLinkPreviewConfig = {
+    anchorClassName: 'ps-card ps-focus-ring group block min-w-0 overflow-hidden rounded-ps-card text-left no-underline transition hover:border-primary/60',
+    compactBodyClassName: 'flex min-w-0 flex-1 flex-col gap-0.5 p-3',
+    compactImageClassName: 'h-full w-full object-cover',
+    compactMediaClassName: 'relative block w-20 shrink-0 self-stretch overflow-hidden bg-ink/5 empty:hidden sm:w-24 [&>span]:block [&>span]:h-full [&>span]:w-full',
+    compactRowClassName: 'flex min-w-0 items-stretch',
+    descriptionClassName: 'line-clamp-2 break-words text-sm text-ink/70',
+    externalIconClassName: 'h-4 w-4 shrink-0 text-ink/50 transition group-hover:text-primary',
+    faviconClassName: 'h-4 w-4 shrink-0 rounded-sm object-contain',
+    fullBodyClassName: 'flex min-w-0 flex-col gap-1 p-4',
+    fullImageClassName: 'h-full w-full object-cover',
+    fullMediaClassName: 'relative block aspect-[1.91/1] w-full overflow-hidden bg-ink/5 empty:hidden [&>span]:block [&>span]:h-full [&>span]:w-full',
+    globeIconClassName: 'h-4 w-4 shrink-0 text-ink/50',
+    metaRowClassName: 'flex min-w-0 items-center gap-2 text-xs font-medium text-ink/60',
+    rel: 'noopener noreferrer',
+    siteClassName: 'min-w-0 flex-1 truncate',
+    target: '_blank',
+    titleClassName: 'line-clamp-2 break-words text-sm font-bold text-ink transition group-hover:text-primary',
+    urlClassName: 'truncate text-xs text-ink/60',
+};

package/dist/esm/constants/ps-link-preview-size.js

@@ -0,0 +1,5 @@
+export var PsLinkPreviewSize;
+(function (PsLinkPreviewSize) {
+    PsLinkPreviewSize["Compact"] = "compact";
+    PsLinkPreviewSize["Full"] = "full";
+})(PsLinkPreviewSize || (PsLinkPreviewSize = {}));

package/dist/esm/index.js

@@ -248,3 +248,7 @@ export * from './services/ps-image-service.js';
 export * from './components/ps-image.js';
 export { PsDeepEqualService, PsOptimisticConfig, PsOptimisticSaveService, } from '@pallasoft/ps-utilities';
 export { usePsChangeQueue, usePsDebouncedValue, usePsOptimisticRows, } from '@pallasoft/ps-utilities/react';
+export * from './constants/ps-link-preview-size.js';
+export * from './constants/ps-link-preview-config.js';
+export * from './services/ps-link-preview-service.js';
+export * from './components/ps-link-preview-card.js';

package/dist/esm/services/ps-link-preview-service.js

@@ -0,0 +1,19 @@
+export class PsLinkPreviewService {
+    static isWebAddress(href) {
+        try {
+            const { protocol } = new URL(href);
+            return protocol === 'http:' || protocol === 'https:';
+        }
+        catch {
+            return false;
+        }
+    }
+    static domain(href) {
+        try {
+            return new URL(href).hostname.replace(/^www\./i, '');
+        }
+        catch {
+            return href;
+        }
+    }
+}

package/dist/index.d.ts

@@ -248,3 +248,7 @@ export * from './services/ps-image-service';
 export * from './components/ps-image';
 export { PsDeepEqualService, PsOptimisticConfig, PsOptimisticSaveService, type PsOptimisticFailureReason, type PsOptimisticSaveSpec, } from '@pallasoft/ps-utilities';
 export { usePsChangeQueue, usePsDebouncedValue, usePsOptimisticRows, type PsChangeQueueInput, type PsChangeQueueResult, type PsOptimisticRowsInput, type PsOptimisticRowsResult, } from '@pallasoft/ps-utilities/react';
+export * from './constants/ps-link-preview-size';
+export * from './constants/ps-link-preview-config';
+export * from './services/ps-link-preview-service';
+export * from './components/ps-link-preview-card';

package/dist/index.js

@@ -271,3 +271,7 @@ var react_1 = require("@pallasoft/ps-utilities/react");
 Object.defineProperty(exports, "usePsChangeQueue", { enumerable: true, get: function () { return react_1.usePsChangeQueue; } });
 Object.defineProperty(exports, "usePsDebouncedValue", { enumerable: true, get: function () { return react_1.usePsDebouncedValue; } });
 Object.defineProperty(exports, "usePsOptimisticRows", { enumerable: true, get: function () { return react_1.usePsOptimisticRows; } });
+__exportStar(require("./constants/ps-link-preview-size"), exports);
+__exportStar(require("./constants/ps-link-preview-config"), exports);
+__exportStar(require("./services/ps-link-preview-service"), exports);
+__exportStar(require("./components/ps-link-preview-card"), exports);

package/dist/services/ps-link-preview-service.d.ts

@@ -0,0 +1,4 @@
+export declare class PsLinkPreviewService {
+    static isWebAddress(href: string): boolean;
+    static domain(href: string): string;
+}

package/dist/services/ps-link-preview-service.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsLinkPreviewService = void 0;
+class PsLinkPreviewService {
+    static isWebAddress(href) {
+        try {
+            const { protocol } = new URL(href);
+            return protocol === 'http:' || protocol === 'https:';
+        }
+        catch {
+            return false;
+        }
+    }
+    static domain(href) {
+        try {
+            return new URL(href).hostname.replace(/^www\./i, '');
+        }
+        catch {
+            return href;
+        }
+    }
+}
+exports.PsLinkPreviewService = PsLinkPreviewService;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pallasoft/ps-core-components",
-	"version": "2.47.1",
+	"version": "2.49.0",
 	"private": false,
 	"main": "./dist/index.js",
 	"module": "./dist/esm/index.js",
@@ -46,7 +46,7 @@
 		"@dnd-kit/core": "^6.3.1",
 		"@dnd-kit/sortable": "^10.0.0",
 		"@dnd-kit/utilities": "^3.2.2",
-		"@pallasoft/ps-icons": "^1.5.4",
+		"@pallasoft/ps-icons": "^1.12.0",
 		"@pallasoft/ps-motion-components": "^1.2.2",
 		"@pallasoft/ps-utilities": "^2.29.0",
 		"@portabletext/react": "^3.2.4",