@veevarts/design-system 1.14.0-beta.1 → 1.14.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10,6 +10,8 @@ export interface ActionBarProps {
10
10
  isLoading: boolean;
11
11
  cart?: SummaryProps['cart'];
12
12
  cartAriaLabel: string;
13
+ /** Optional caption rendered under the open-layer CTA (e.g. installment breakdown). */
14
+ ctaCaption?: React.ReactNode;
13
15
  /** Expand the summary — the closed-bar cart button opens it on click. */
14
16
  onToggleOpen?: () => void;
15
17
  classNames: SummaryClassNames;
@@ -5,5 +5,7 @@ export interface ItemRowProps {
5
5
  locale: string;
6
6
  onRemove?: (id: string) => void;
7
7
  removeAriaLabel: string;
8
+ /** Show the per-item remove control. Defaults to `true`. */
9
+ showRemoveButton?: boolean;
8
10
  }
9
11
  export declare const ItemRow: React.FC<ItemRowProps>;
@@ -0,0 +1,11 @@
1
+ import { default as React } from 'react';
2
+ import { Money } from '../types';
3
+ export interface SecondaryTotalRowProps {
4
+ secondaryTotal: {
5
+ label: React.ReactNode;
6
+ amount: Money;
7
+ };
8
+ locale: string;
9
+ className?: string;
10
+ }
11
+ export declare const SecondaryTotalRow: React.FC<SecondaryTotalRowProps>;
@@ -9,6 +9,8 @@ export interface SummaryBodyProps {
9
9
  locale: string;
10
10
  onRemoveItem?: (id: string) => void;
11
11
  removeAriaLabel: string;
12
+ /** Show the per-item remove control. Defaults to `true`. */
13
+ showRemoveButton?: boolean;
12
14
  emptyState?: React.ReactNode;
13
15
  classNames: SummaryClassNames;
14
16
  }
@@ -4,4 +4,4 @@
4
4
  * Total + CTA, and a compact mobile bottom-bar.
5
5
  */
6
6
  export { Summary } from './Summary';
7
- export type { SummaryProps, SummaryLineItem, SummaryServiceFee, SummaryTotalRow, SummaryPrimaryAction, SummaryLabels, Money, } from './types';
7
+ export type { SummaryProps, SummaryLineItem, SummaryItemDetail, SummaryServiceFee, SummaryTotalRow, SummaryPrimaryAction, SummaryLabels, Money, } from './types';
@@ -1,6 +1,28 @@
1
1
  import { ReactNode } from 'react';
2
2
  import { Money } from '../../utils/money';
3
3
  export type { Money } from '../../utils/money';
4
+ /**
5
+ * A generic, parametrizable detail row rendered under a line item — an icon +
6
+ * label, an optional right-aligned value, and an optional info tooltip. It is
7
+ * intentionally agnostic: the host composes whatever the design needs (e.g. an
8
+ * auto-renewal note, a "pay by installments" line, a fulfilment hint) without
9
+ * the Summary pattern knowing those domains. The existing `dateLabel` /
10
+ * `dateRange` slots stay as dedicated rows; this covers everything else.
11
+ */
12
+ export interface SummaryItemDetail {
13
+ /** Stable key for `data-testid` (falls back to the row index). */
14
+ key?: string;
15
+ /** Leading icon node (e.g. `lucide:refresh-cw`, `lucide:scissors`). */
16
+ icon?: ReactNode;
17
+ /** Left label (rendered muted, like the date rows). */
18
+ label: ReactNode;
19
+ /** Optional right-aligned value (e.g. "$4.23 / month"). */
20
+ value?: ReactNode;
21
+ /** Tone of the value: `'primary'` paints it in the primary color; default inherits the muted label tone. */
22
+ valueTone?: 'default' | 'primary';
23
+ /** When set, an info icon next to the value reveals this content in a tooltip. */
24
+ tooltip?: ReactNode;
25
+ }
4
26
  /**
5
27
  * A single, flexible line item. The four Figma "types" (Ticket, Event,
6
28
  * Membership, Donation) are compositions of this one shape — not rigid
@@ -28,6 +50,12 @@ export interface SummaryLineItem {
28
50
  };
29
51
  /** Nested rows, indented (Event's Adult / Children). */
30
52
  children?: SummaryLineItem[];
53
+ /**
54
+ * Extra detail rows rendered under the item (after any date row). Generic
55
+ * and agnostic — see {@link SummaryItemDetail}. Used e.g. by membership to
56
+ * show an auto-renewal note and a pay-by-installments line.
57
+ */
58
+ details?: SummaryItemDetail[];
31
59
  }
32
60
  /** The "Pay Service fee" radio-toggle row. */
33
61
  export interface SummaryServiceFee {
@@ -86,8 +114,12 @@ export interface SummaryClassNames {
86
114
  totalsRows?: string;
87
115
  /** The Total row. */
88
116
  total?: string;
117
+ /** The secondary (primary-colored) total row under the Total. */
118
+ secondaryTotal?: string;
89
119
  /** Primary CTA button. */
90
120
  cta?: string;
121
+ /** The caption rendered under the CTA. */
122
+ ctaCaption?: string;
91
123
  /** Mobile compact bottom-bar. */
92
124
  mobileBar?: string;
93
125
  /** Mobile cart button. */
@@ -113,6 +145,26 @@ export interface SummaryProps {
113
145
  label?: ReactNode;
114
146
  amount: Money;
115
147
  };
148
+ /**
149
+ * An optional secondary total rendered right under the Total, in the primary
150
+ * color (e.g. "Due Today"). Purely presentational — the host supplies both
151
+ * the label and the already-computed amount.
152
+ */
153
+ secondaryTotal?: {
154
+ label: ReactNode;
155
+ amount: Money;
156
+ };
157
+ /**
158
+ * An optional caption rendered under the CTA, in muted text (e.g. an
159
+ * installment breakdown like "$50.75 total · 12 monthly installments…").
160
+ */
161
+ ctaCaption?: ReactNode;
162
+ /**
163
+ * Whether the per-item remove (trash) control is shown. Defaults to `true`;
164
+ * pass `false` to hide it even when `onRemoveItem` is wired. Independent of
165
+ * `onRemoveItem` so a host can keep the handler but suppress the control.
166
+ */
167
+ showRemoveButton?: boolean;
116
168
  /**
117
169
  * Whether the summary can collapse — the header shows a `×` and the whole
118
170
  * header toggles Open/Closed. Defaults to `variant === 'mobile'` (including
@@ -66,4 +66,4 @@ export type { PaymentSubAmountInputProps } from './PaymentSubAmountInput';
66
66
  export { ConfirmDialog } from './ConfirmDialog';
67
67
  export type { ConfirmDialogProps } from './ConfirmDialog';
68
68
  export { Summary } from './Summary';
69
- export type { SummaryProps, SummaryLineItem, SummaryServiceFee, SummaryTotalRow, SummaryPrimaryAction, SummaryLabels, } from './Summary';
69
+ export type { SummaryProps, SummaryLineItem, SummaryItemDetail, SummaryServiceFee, SummaryTotalRow, SummaryPrimaryAction, SummaryLabels, } from './Summary';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@veevarts/design-system",
3
3
  "private": false,
4
- "version": "1.14.0-beta.1",
4
+ "version": "1.14.0-beta.2",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
7
7
  "module": "dist/index.js",