@payfit/unity-components 3.9.6 → 3.9.8

package/dist/esm/modules/ai-kit/components/proposal-card/ProposalCard.js

@@ -0,0 +1,35 @@
+import { Card as e } from "../../../../core/components/card/Card.js";
+import { ProposalCardContextProvider as t } from "./ProposalCard.context.js";
+import { proposalCard as n } from "./ProposalCard.variants.js";
+import { forwardRef as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+import { Disclosure as a } from "react-aria-components/Disclosure";
+//#region src/modules/ai-kit/components/proposal-card/ProposalCard.tsx
+var o = r(({ children: r, state: o, isExpanded: s, defaultExpanded: c = !1, onExpandedChange: l, ...u }, d) => {
+	let f = o !== "pending", { body: p, disclosure: m } = n();
+	return /* @__PURE__ */ i(t, {
+		value: {
+			state: o,
+			isExpandable: f
+		},
+		children: /* @__PURE__ */ i(e, {
+			ref: d,
+			...u,
+			density: "compact",
+			"data-unity-proposal-state": o,
+			children: f ? /* @__PURE__ */ i(a, {
+				className: ({ isExpanded: e }) => m({ isExpanded: e }),
+				defaultExpanded: c,
+				isExpanded: s,
+				onExpandedChange: l,
+				children: r
+			}) : /* @__PURE__ */ i("div", {
+				className: p(),
+				children: r
+			})
+		})
+	});
+});
+o.displayName = "AIProposalCard";
+//#endregion
+export { o as AIProposalCard };

package/dist/esm/modules/ai-kit/components/proposal-card/ProposalCard.variants.d.ts

@@ -0,0 +1,55 @@
+export declare const proposalCard: import('tailwind-variants').TVReturnType<{
+    isExpanded: {
+        true: {
+            disclosure: string;
+            disclosureIcon: string;
+        };
+        false: {};
+    };
+}, {
+    body: string;
+    disclosure: string;
+    header: string;
+    headerContent: string;
+    subtitle: string;
+    content: string;
+    actions: string;
+    disclosureHeader: string[];
+    disclosureIcon: string;
+}, undefined, {
+    isExpanded: {
+        true: {
+            disclosure: string;
+            disclosureIcon: string;
+        };
+        false: {};
+    };
+}, {
+    body: string;
+    disclosure: string;
+    header: string;
+    headerContent: string;
+    subtitle: string;
+    content: string;
+    actions: string;
+    disclosureHeader: string[];
+    disclosureIcon: string;
+}, import('tailwind-variants').TVReturnTypeLike<{
+    isExpanded: {
+        true: {
+            disclosure: string;
+            disclosureIcon: string;
+        };
+        false: {};
+    };
+}, {
+    body: string;
+    disclosure: string;
+    header: string;
+    headerContent: string;
+    subtitle: string;
+    content: string;
+    actions: string;
+    disclosureHeader: string[];
+    disclosureIcon: string;
+}>>;

package/dist/esm/modules/ai-kit/components/proposal-card/ProposalCard.variants.js

@@ -0,0 +1,31 @@
+import { uyTv as e } from "@payfit/unity-themes";
+//#region src/modules/ai-kit/components/proposal-card/ProposalCard.variants.ts
+var t = e({
+	slots: {
+		body: "uy:flex uy:flex-col uy:gap-200",
+		disclosure: "uy:flex uy:flex-col",
+		header: "uy:flex uy:items-start uy:justify-between uy:gap-200",
+		headerContent: "uy:flex uy:min-w-0 uy:flex-col uy:gap-25",
+		subtitle: "uy:typography-body-small uy:text-content-neutral-lowest",
+		content: "uy:flex uy:flex-col uy:gap-200",
+		actions: "uy:flex uy:flex-wrap uy:justify-end uy:gap-100",
+		disclosureHeader: [
+			"uy:flex uy:w-full uy:items-center uy:justify-between uy:gap-200",
+			"uy:rounded-100 uy:text-left uy:text-content-neutral",
+			"uy:data-[focus-visible=true]:outline-2",
+			"uy:data-[focus-visible=true]:outline-solid",
+			"uy:data-[focus-visible=true]:outline-offset-2",
+			"uy:data-[focus-visible=true]:outline-utility-focus-ring"
+		],
+		disclosureIcon: "uy:shrink-0 uy:transition-transform"
+	},
+	variants: { isExpanded: {
+		true: {
+			disclosure: "uy:gap-200",
+			disclosureIcon: "uy:rotate-180"
+		},
+		false: {}
+	} }
+});
+//#endregion
+export { t as proposalCard };

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardActions.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export interface AIProposalCardActionsProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className'> {
+    /** Consumer-provided decision controls. They render only while pending. */
+    children: ReactNode;
+}
+/** Renders consumer-provided confirmation or rejection actions for pending proposals. */
+export declare const AIProposalCardActions: import('react').ForwardRefExoticComponent<AIProposalCardActionsProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardActions.js

@@ -0,0 +1,18 @@
+import { useProposalCardContext as e } from "../ProposalCard.context.js";
+import { proposalCard as t } from "../ProposalCard.variants.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/modules/ai-kit/components/proposal-card/parts/ProposalCardActions.tsx
+var i = n(({ children: n, ...i }, a) => {
+	let { state: o } = e(), { actions: s } = t();
+	return o === "pending" ? /* @__PURE__ */ r("div", {
+		ref: a,
+		className: s(),
+		"data-unity-slot": "proposal-card.actions",
+		...i,
+		children: n
+	}) : null;
+});
+i.displayName = "AIProposalCardActions";
+//#endregion
+export { i as AIProposalCardActions };

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardContent.d.ts

@@ -0,0 +1,9 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export interface AIProposalCardContentProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'role' | 'className'> {
+    /** Arbitrary supporting proposal details. */
+    children: ReactNode;
+    /** Landmark role supported by React Aria's DisclosurePanel. */
+    role?: 'group' | 'region';
+}
+/** Renders proposal details and hides historical details until disclosed. */
+export declare const AIProposalCardContent: import('react').ForwardRefExoticComponent<AIProposalCardContentProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardContent.js

@@ -0,0 +1,19 @@
+import { useProposalCardContext as e } from "../ProposalCard.context.js";
+import { proposalCard as t } from "../ProposalCard.variants.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { DisclosurePanel as i } from "react-aria-components/Disclosure";
+//#region src/modules/ai-kit/components/proposal-card/parts/ProposalCardContent.tsx
+var a = n(({ children: n, ...a }, o) => {
+	let { isExpandable: s } = e(), { content: c } = t();
+	return r(s ? i : "div", {
+		ref: o,
+		className: c(),
+		"data-unity-slot": "proposal-card.content",
+		...a,
+		children: n
+	});
+});
+a.displayName = "AIProposalCardContent";
+//#endregion
+export { a as AIProposalCardContent };

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardHeader.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import { ButtonProps } from 'react-aria-components/Button';
+export interface AIProposalCardHeaderProps extends Omit<ButtonProps, 'children' | 'className' | 'slot'> {
+    /** Header content, typically AIProposalCardSubtitle and AIProposalCardTitle. */
+    children: ReactNode;
+    /** Heading level used for historical proposal headers. @default 3 */
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Overrides the accessible name of the historical-proposal disclosure trigger. */
+    disclosureLabel?: string;
+}
+/** Renders the status/title header and historical-proposal disclosure control. */
+export declare const AIProposalCardHeader: import('react').ForwardRefExoticComponent<AIProposalCardHeaderProps & import('react').RefAttributes<HTMLElement>>;

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardHeader.js

@@ -0,0 +1,44 @@
+import { Icon as e } from "../../../../../core/components/icon/Icon.js";
+import { useProposalCardContext as t } from "../ProposalCard.context.js";
+import { proposalCard as n } from "../ProposalCard.variants.js";
+import { forwardRef as r, useContext as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Button as s } from "react-aria-components/Button";
+import { Heading as c } from "react-aria-components/Heading";
+import { DisclosureStateContext as l } from "react-aria-components/Disclosure";
+//#region src/modules/ai-kit/components/proposal-card/parts/ProposalCardHeader.tsx
+var u = r(({ children: r, disclosureLabel: u, level: d = 3, ...f }, p) => {
+	let { isExpandable: m } = t(), { header: h, headerContent: g, disclosureHeader: _, disclosureIcon: v } = n({ isExpanded: i(l)?.isExpanded });
+	return m ? /* @__PURE__ */ a(c, {
+		level: d,
+		children: /* @__PURE__ */ o(s, {
+			ref: p,
+			"aria-label": u,
+			className: _(),
+			"data-unity-slot": "proposal-card.header",
+			slot: "trigger",
+			...f,
+			children: [/* @__PURE__ */ a("span", {
+				className: g(),
+				children: r
+			}), /* @__PURE__ */ a(e, {
+				"aria-hidden": "true",
+				className: v(),
+				role: "presentation",
+				src: "CaretDownOutlined"
+			})]
+		})
+	}) : /* @__PURE__ */ a("div", {
+		ref: p,
+		className: h(),
+		"data-unity-slot": "proposal-card.header",
+		...f,
+		children: /* @__PURE__ */ a("div", {
+			className: g(),
+			children: r
+		})
+	});
+});
+u.displayName = "AIProposalCardHeader";
+//#endregion
+export { u as AIProposalCardHeader };

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardSubtitle.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export interface AIProposalCardSubtitleProps extends Omit<ComponentPropsWithoutRef<'p'>, 'children' | 'className'> {
+    /** Consumer-provided lifecycle copy, such as “Ready for review”. */
+    children: ReactNode;
+}
+/** Renders low-emphasis proposal status or supporting copy. */
+export declare const AIProposalCardSubtitle: import('react').ForwardRefExoticComponent<AIProposalCardSubtitleProps & import('react').RefAttributes<HTMLParagraphElement>>;

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardSubtitle.js

@@ -0,0 +1,16 @@
+import { proposalCard as e } from "../ProposalCard.variants.js";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/modules/ai-kit/components/proposal-card/parts/ProposalCardSubtitle.tsx
+var r = t(({ children: t, ...r }, i) => {
+	let { subtitle: a } = e();
+	return /* @__PURE__ */ n("p", {
+		ref: i,
+		className: a(),
+		...r,
+		children: t
+	});
+});
+r.displayName = "AIProposalCardSubtitle";
+//#endregion
+export { r as AIProposalCardSubtitle };

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardTitle.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from 'react';
+export interface AIProposalCardTitleProps extends PropsWithChildren {
+    /** The heading level for a pending proposal title. @default 3 */
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+}
+/** Supplies the AIProposalCard's visible title and Card accessible label. */
+export declare const AIProposalCardTitle: import('react').ForwardRefExoticComponent<AIProposalCardTitleProps & import('react').RefAttributes<HTMLElement>>;

package/dist/esm/modules/ai-kit/components/proposal-card/parts/ProposalCardTitle.js

@@ -0,0 +1,23 @@
+import { useCardContext as e } from "../../../../../core/components/card/Card.context.js";
+import { CardTitle as t } from "../../../../../core/components/card/parts/CardTitle.js";
+import { useProposalCardContext as n } from "../ProposalCard.context.js";
+import { forwardRef as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/modules/ai-kit/components/proposal-card/parts/ProposalCardTitle.tsx
+var a = r(({ children: r, level: a = 3 }, o) => {
+	let { isExpandable: s } = n(), { titleId: c } = e();
+	return s ? /* @__PURE__ */ i("span", {
+		ref: o,
+		className: "uy:typography-h3 uy:text-content-neutral uy:leading-none",
+		"data-unity-slot": "card.title",
+		id: c,
+		children: r
+	}) : /* @__PURE__ */ i(t, {
+		ref: o,
+		level: a,
+		children: r
+	});
+});
+a.displayName = "AIProposalCardTitle";
+//#endregion
+export { a as AIProposalCardTitle };

package/dist/esm/modules/ai-kit/index.d.ts

@@ -1,4 +1,10 @@
 export { AIButton, type AIButtonProps } from './components/ai-button/AIButton.js';
+export { AIProposalCard, type AIProposalCardProps, type AIProposalCardState, } from './components/proposal-card/ProposalCard.js';
+export { AIProposalCardHeader, type AIProposalCardHeaderProps, } from './components/proposal-card/parts/ProposalCardHeader.js';
+export { AIProposalCardSubtitle, type AIProposalCardSubtitleProps, } from './components/proposal-card/parts/ProposalCardSubtitle.js';
+export { AIProposalCardTitle, type AIProposalCardTitleProps, } from './components/proposal-card/parts/ProposalCardTitle.js';
+export { AIProposalCardContent, type AIProposalCardContentProps, } from './components/proposal-card/parts/ProposalCardContent.js';
+export { AIProposalCardActions, type AIProposalCardActionsProps, } from './components/proposal-card/parts/ProposalCardActions.js';
 export { PayfitAIBrand, type PayfitAIBrandProps, } from './components/payfit-ai-brand/PayfitAIBrand.js';
 export { AITriggerButton, type AITriggerButtonBrandSlotProps, type AITriggerButtonProps, } from './components/ai-trigger-button/AITriggerButton.js';
 export { AIComposerAttachment, type AIComposerAttachmentProps, } from './components/ai-composer/parts/AIComposerAttachment.js';
@@ -13,6 +19,7 @@ export { AIComposerTextArea, type AIComposerTextAreaProps, } from './components/
 export { aiGradientEffect, aiGradientSurfaceEffect, } from './utils/ai-gradient-effect.js';
 export { aiKitForm, useAIKitForm } from './hooks/use-ai-kit-form.js';
 export { useAIKitFieldContext, useAIKitFormContext, } from './hooks/ai-kit-form-context.js';
+export { AIChatEventFeedback, type AIChatEventFeedbackProps, } from './components/aichat-event-feedback/AIChatEventFeedback.js';
 export { RawAIOutcomeCard, type RawAIOutcomeCardProps, } from './components/ai-outcome-card/RawAIOutcomeCard.js';
 export { AIOutcomeCardIcon, type AIOutcomeCardIconProps, } from './components/ai-outcome-card/parts/AIOutcomeCardIcon.js';
 export { AIOutcomeCardTitle, type AIOutcomeCardTitleProps, } from './components/ai-outcome-card/parts/AIOutcomeCardTitle.js';

package/i18n/en-GB.json

@@ -150,6 +150,8 @@
   "unity:layout:funnel:skip-links:sidebar": "Sidebar",
   "unity:layout:funnel:skip-links:footer": "Footer",
   "unity:layout:funnel:sidebar:aria-label": "Process steps",
+  "unity:module:ai-kit:chat-event-feedback:success": "Success: ",
+  "unity:module:ai-kit:chat-event-feedback:failure": "Error: ",
   "unity:module:ai-kit:composer:action": "Composer action",
   "unity:module:ai-kit:composer:attachment-group": "Attachments",
   "unity:module:ai-kit:composer:attachment:remove": "Remove Attachment",

package/i18n/es-ES.json

@@ -150,6 +150,8 @@
   "unity:layout:funnel:skip-links:sidebar": "Barra lateral",
   "unity:layout:funnel:skip-links:footer": "Pie de página",
   "unity:layout:funnel:sidebar:aria-label": "Pasos del proceso",
+  "unity:module:ai-kit:chat-event-feedback:success": "Éxito: ",
+  "unity:module:ai-kit:chat-event-feedback:failure": "Error: ",
   "unity:module:ai-kit:composer:action": "Acción de composer",
   "unity:module:ai-kit:composer:attachment-group": "Ficheros adjuntos",
   "unity:module:ai-kit:composer:attachment:remove": "Eliminar",

package/i18n/fr-FR.json

@@ -151,6 +151,8 @@
   "unity:layout:funnel:skip-links:sidebar": "Barre latérale",
   "unity:layout:funnel:skip-links:footer": "Pied de page",
   "unity:layout:funnel:sidebar:aria-label": "Étapes du processus",
+  "unity:module:ai-kit:chat-event-feedback:success": "Succès : ",
+  "unity:module:ai-kit:chat-event-feedback:failure": "Erreur : ",
   "unity:module:ai-kit:composer:action": "Action du composer",
   "unity:module:ai-kit:composer:attachment-group": "Fichiers joints",
   "unity:module:ai-kit:composer:attachment:remove": "Supprimer",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@payfit/unity-components",
-  "version": "3.9.6",
+  "version": "3.9.8",
   "module": "./dist/esm/index.js",
   "type": "module",
   "sideEffects": false,
@@ -103,7 +103,7 @@
     "@formatjs/intl": "4.1.12",
     "@internationalized/date": "3.12.4",
     "minimatch": "10.2.5",
-    "@payfit/unity-illustrations": "3.9.6",
+    "@payfit/unity-illustrations": "3.9.8",
     "@radix-ui/react-avatar": "1.2.6",
     "@radix-ui/react-slot": "1.3.3",
     "@react-aria/interactions": "3.28.1",
@@ -132,8 +132,8 @@
     "zod": "4.6.5"
   },
   "peerDependencies": {
-    "@payfit/unity-icons": "3.9.6",
-    "@payfit/unity-themes": "3.9.6",
+    "@payfit/unity-icons": "3.9.8",
+    "@payfit/unity-themes": "3.9.8",
     "@storybook/react-vite": "^10",
     "@tanstack/react-query": "^5",
     "@tanstack/form-core": "1.33.5",
@@ -157,9 +157,9 @@
     "@payfit/storybook-addon-console-errors": "0.0.0-use.local",
     "@payfit/storybook-addon-datadog-rum": "0.0.0-use.local",
     "@payfit/storybook-config": "0.0.0-use.local",
-    "@payfit/unity-icons": "3.9.6",
-    "@payfit/unity-illustrations": "3.9.6",
-    "@payfit/unity-themes": "3.9.6",
+    "@payfit/unity-icons": "3.9.8",
+    "@payfit/unity-illustrations": "3.9.8",
+    "@payfit/unity-themes": "3.9.8",
     "@payfit/vite-configs": "0.0.0-use.local",
     "@storybook/addon-a11y": "10.6.0",
     "@storybook/addon-designs": "11.1.4",

package/src/agent-references/component-catalog.json

@@ -25,6 +25,31 @@
       ],
       "title": "AIButton"
     },
+    {
+      "description": "Reports successful or failed AI chat actions with optional outcome content or required recovery actions.",
+      "docsHref": "?path=/docs/ai-kit-aichateventfeedback--docs",
+      "id": "ai-kit-aichateventfeedback",
+      "keywords": [
+        "ai",
+        "chat",
+        "event",
+        "feedback",
+        "success",
+        "failure"
+      ],
+      "preview": {
+        "type": "story",
+        "story": "success",
+        "storyId": "ai-kit-aichateventfeedback--success"
+      },
+      "related": [],
+      "section": "components",
+      "tags": [
+        "type:component",
+        "category:feedback"
+      ],
+      "title": "AIChatEventFeedback"
+    },
     {
       "description": "Composes an accessible AI prompt field with attachments, feedback, and lifecycle-aware actions.",
       "docsHref": "?path=/docs/ai-kit-aicomposer--docs",
@@ -99,6 +124,30 @@
       ],
       "title": "AIOutcomeCard"
     },
+    {
+      "description": "Presents a proposed AI operation, its details, and person-owned decision actions.",
+      "docsHref": "?path=/docs/ai-kit-aiproposalcard--docs",
+      "id": "ai-kit-aiproposalcard",
+      "keywords": [
+        "ai",
+        "proposal",
+        "confirmation",
+        "review",
+        "decision"
+      ],
+      "preview": {
+        "type": "story",
+        "story": "pending",
+        "storyId": "ai-kit-aiproposalcard--pending"
+      },
+      "related": [],
+      "section": "components",
+      "tags": [
+        "type:component",
+        "category:information"
+      ],
+      "title": "AIProposalCard"
+    },
     {
       "description": "Toggles a PayFit AI assistant surface with branded, accessible toggle-button semantics.",
       "docsHref": "?path=/docs/ai-kit-aitriggerbutton--docs",