@nex125/seatmap-viewer 0.1.17 → 0.1.20
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.
- package/dist/_tsup-dts-rollup.d.cts +173 -0
- package/dist/_tsup-dts-rollup.d.ts +173 -0
- package/dist/index.cjs +139 -10
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +24 -95
- package/dist/index.d.ts +24 -95
- package/dist/index.js +140 -11
- package/dist/index.js.map +1 -1
- package/package.json +10 -10
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
import type { CSSProperties } from 'react';
|
|
2
|
+
import { JSX } from 'react/jsx-runtime';
|
|
3
|
+
import { ReactNode } from 'react';
|
|
4
|
+
import type { SeatStatus } from '@nex125/seatmap-core';
|
|
5
|
+
import type { TooltipData } from '@nex125/seatmap-react';
|
|
6
|
+
import { useSeatStatus } from '@nex125/seatmap-react';
|
|
7
|
+
import type { Venue } from '@nex125/seatmap-core';
|
|
8
|
+
|
|
9
|
+
declare const defaultSeatmapViewerMessages: SeatmapViewerMessages;
|
|
10
|
+
export { defaultSeatmapViewerMessages }
|
|
11
|
+
export { defaultSeatmapViewerMessages as defaultSeatmapViewerMessages_alias_1 }
|
|
12
|
+
|
|
13
|
+
declare function getSeatmapViewerSharedThemeRootStyle(overrides?: SeatmapViewerCssVariableValues): CSSProperties;
|
|
14
|
+
export { getSeatmapViewerSharedThemeRootStyle }
|
|
15
|
+
export { getSeatmapViewerSharedThemeRootStyle as getSeatmapViewerSharedThemeRootStyle_alias_1 }
|
|
16
|
+
|
|
17
|
+
declare interface SeatmapCartEvent {
|
|
18
|
+
type: "cart-proceed-clicked";
|
|
19
|
+
payload: SeatmapCartPayload;
|
|
20
|
+
}
|
|
21
|
+
export { SeatmapCartEvent }
|
|
22
|
+
export { SeatmapCartEvent as SeatmapCartEvent_alias_1 }
|
|
23
|
+
|
|
24
|
+
declare interface SeatmapCartPayload {
|
|
25
|
+
venueId: string;
|
|
26
|
+
venueName: string;
|
|
27
|
+
seats: SeatmapCartSeat[];
|
|
28
|
+
totalSelectedSeats: number;
|
|
29
|
+
totalCost: number;
|
|
30
|
+
}
|
|
31
|
+
export { SeatmapCartPayload }
|
|
32
|
+
export { SeatmapCartPayload as SeatmapCartPayload_alias_1 }
|
|
33
|
+
|
|
34
|
+
declare interface SeatmapCartSeat {
|
|
35
|
+
seatId: string;
|
|
36
|
+
seatLabel: string;
|
|
37
|
+
rowLabel: string | null;
|
|
38
|
+
sectionId: string | null;
|
|
39
|
+
sectionLabel: string | null;
|
|
40
|
+
categoryId: string;
|
|
41
|
+
categoryName: string;
|
|
42
|
+
unitPrice: number;
|
|
43
|
+
baseUnitPrice: number;
|
|
44
|
+
serviceFee: number;
|
|
45
|
+
}
|
|
46
|
+
export { SeatmapCartSeat }
|
|
47
|
+
export { SeatmapCartSeat as SeatmapCartSeat_alias_1 }
|
|
48
|
+
|
|
49
|
+
declare function SeatmapViewer({ venue, onSeatClick, onSeatHover, onSelectionChange, renderTooltip, showLabels, className, onCartEvent, locale, currency, styles, classNames, messages, }: SeatmapViewerProps): JSX.Element;
|
|
50
|
+
export { SeatmapViewer }
|
|
51
|
+
export { SeatmapViewer as SeatmapViewer_alias_1 }
|
|
52
|
+
|
|
53
|
+
declare type SeatmapViewerClassNames = Partial<Record<SeatmapViewerStyleSlot, string>>;
|
|
54
|
+
export { SeatmapViewerClassNames }
|
|
55
|
+
export { SeatmapViewerClassNames as SeatmapViewerClassNames_alias_1 }
|
|
56
|
+
|
|
57
|
+
declare function SeatmapViewerContent({ venue, onSeatClick, onSeatHover, onSelectionChange, renderTooltip, showLabels, onCartEvent, locale, currency, styles, classNames, messages: messagesOverride, }: SeatmapViewerContentProps): JSX.Element;
|
|
58
|
+
export { SeatmapViewerContent }
|
|
59
|
+
export { SeatmapViewerContent as SeatmapViewerContent_alias_1 }
|
|
60
|
+
|
|
61
|
+
declare type SeatmapViewerContentProps = Omit<SeatmapViewerProps, "className"> & {
|
|
62
|
+
showLabels: boolean;
|
|
63
|
+
};
|
|
64
|
+
export { SeatmapViewerContentProps }
|
|
65
|
+
export { SeatmapViewerContentProps as SeatmapViewerContentProps_alias_1 }
|
|
66
|
+
|
|
67
|
+
declare type SeatmapViewerCssVariable = (typeof seatmapViewerCssVariables)[number];
|
|
68
|
+
export { SeatmapViewerCssVariable }
|
|
69
|
+
export { SeatmapViewerCssVariable as SeatmapViewerCssVariable_alias_1 }
|
|
70
|
+
|
|
71
|
+
declare const seatmapViewerCssVariables: readonly ["--seatmap-surface", "--seatmap-surface-elevated", "--seatmap-surface-muted", "--seatmap-on-surface", "--seatmap-on-surface-variant", "--seatmap-outline", "--seatmap-outline-variant", "--seatmap-primary", "--seatmap-on-primary", "--seatmap-error", "--seatmap-on-error", "--seatmap-state-layer-hover", "--seatmap-state-layer-pressed", "--seatmap-focus-ring", "--seatmap-radius-sm", "--seatmap-radius-md", "--seatmap-radius-lg", "--seatmap-shadow-raised", "--seatmap-shadow-elevated", "--seatmap-shadow-floating", "--seatmap-viewer-surface", "--seatmap-viewer-surface-elevated", "--seatmap-viewer-surface-muted", "--seatmap-viewer-border", "--seatmap-viewer-border-subtle", "--seatmap-viewer-text", "--seatmap-viewer-text-muted", "--seatmap-viewer-accent", "--seatmap-viewer-accent-disabled", "--seatmap-viewer-accent-text", "--seatmap-viewer-danger", "--seatmap-viewer-danger-text", "--seatmap-viewer-state-layer-hover", "--seatmap-viewer-state-layer-pressed", "--seatmap-viewer-focus-ring", "--seatmap-viewer-radius-sm", "--seatmap-viewer-radius-md", "--seatmap-viewer-radius-lg", "--seatmap-viewer-shadow-raised", "--seatmap-viewer-shadow-elevated", "--seatmap-viewer-shadow-floating"];
|
|
72
|
+
export { seatmapViewerCssVariables }
|
|
73
|
+
export { seatmapViewerCssVariables as seatmapViewerCssVariables_alias_1 }
|
|
74
|
+
|
|
75
|
+
declare type SeatmapViewerCssVariableValues = Partial<Record<SeatmapViewerCssVariable, string>>;
|
|
76
|
+
export { SeatmapViewerCssVariableValues }
|
|
77
|
+
export { SeatmapViewerCssVariableValues as SeatmapViewerCssVariableValues_alias_1 }
|
|
78
|
+
|
|
79
|
+
declare const seatmapViewerDefaultClassNames: Record<SeatmapViewerStyleSlot, string>;
|
|
80
|
+
export { seatmapViewerDefaultClassNames }
|
|
81
|
+
export { seatmapViewerDefaultClassNames as seatmapViewerDefaultClassNames_alias_1 }
|
|
82
|
+
|
|
83
|
+
declare interface SeatmapViewerMessages {
|
|
84
|
+
uncategorizedCategoryName: string;
|
|
85
|
+
sectionFallbackLabel: string;
|
|
86
|
+
tableLabel: (tableLabel: string) => string;
|
|
87
|
+
tooltipSeatLabel: (rowLabel: string, seatLabel: string) => string;
|
|
88
|
+
tooltipStatusAvailable: string;
|
|
89
|
+
tooltipPriceLabel: (price: string) => string;
|
|
90
|
+
tooltipPriceUnavailable: string;
|
|
91
|
+
legendAriaLabel: string;
|
|
92
|
+
legendStatusesTitle: string;
|
|
93
|
+
legendPricesTitle: string;
|
|
94
|
+
cartChipLabel: (selectedCount: number) => string;
|
|
95
|
+
cartAriaLabel: string;
|
|
96
|
+
cartHeaderTitle: string;
|
|
97
|
+
cartCloseLabel: string;
|
|
98
|
+
cartEmptyState: string;
|
|
99
|
+
cartGroupMeta: (count: number, unitPrice: string) => string;
|
|
100
|
+
cartGroupFee: (basePrice: string, serviceFee: string, serviceFeePercent: string | null) => string;
|
|
101
|
+
cartRemoveOneAriaLabel: (categoryName: string) => string;
|
|
102
|
+
cartAddOneAriaLabel: (categoryName: string) => string;
|
|
103
|
+
cartRemoveSeatTitle: string;
|
|
104
|
+
cartRemoveSeatAriaLabel: (seatLabel: string) => string;
|
|
105
|
+
cartServiceFeeSummary: (serviceFeeTotal: string) => string;
|
|
106
|
+
cartSummary: (count: number, totalCost: string) => string;
|
|
107
|
+
cartProceedButton: string;
|
|
108
|
+
}
|
|
109
|
+
export { SeatmapViewerMessages }
|
|
110
|
+
export { SeatmapViewerMessages as SeatmapViewerMessages_alias_1 }
|
|
111
|
+
|
|
112
|
+
declare interface SeatmapViewerProps {
|
|
113
|
+
venue: Venue;
|
|
114
|
+
onSeatClick?: (seatId: string, sectionId: string) => void;
|
|
115
|
+
onSeatHover?: (seatId: string | null, sectionId: string | null) => void;
|
|
116
|
+
onSelectionChange?: (seatIds: string[]) => void;
|
|
117
|
+
onStatusUpdate?: (seatId: string, status: SeatStatus) => void;
|
|
118
|
+
renderTooltip?: (data: TooltipData) => ReactNode;
|
|
119
|
+
showLabels?: boolean;
|
|
120
|
+
className?: string;
|
|
121
|
+
onCartEvent?: (event: SeatmapCartEvent) => void;
|
|
122
|
+
locale?: string;
|
|
123
|
+
currency?: string;
|
|
124
|
+
styles?: SeatmapViewerStyles;
|
|
125
|
+
classNames?: SeatmapViewerClassNames;
|
|
126
|
+
messages?: Partial<SeatmapViewerMessages>;
|
|
127
|
+
}
|
|
128
|
+
export { SeatmapViewerProps }
|
|
129
|
+
export { SeatmapViewerProps as SeatmapViewerProps_alias_1 }
|
|
130
|
+
|
|
131
|
+
declare const seatmapViewerSharedTheme: {
|
|
132
|
+
readonly rootClassName: "seatmap-viewer-theme";
|
|
133
|
+
readonly classNames: Partial<Record<"root" | "legendContainer" | "legendHeading" | "legendList" | "legendItem" | "legendSwatch" | "legendDivider" | "cartChip" | "cartPopup" | "cartHeader" | "cartHeaderTitle" | "cartIconButton" | "cartBody" | "cartEmptyState" | "cartGroup" | "cartGroupTitle" | "cartGroupMeta" | "cartQuantityRow" | "cartQuantityValue" | "cartGroupTotal" | "cartSeatRow" | "cartSeatLabel" | "cartFooter" | "cartSummary" | "cartProceedButton", string>>;
|
|
134
|
+
readonly variables: Partial<Record<"--seatmap-surface" | "--seatmap-surface-elevated" | "--seatmap-surface-muted" | "--seatmap-on-surface" | "--seatmap-on-surface-variant" | "--seatmap-outline" | "--seatmap-outline-variant" | "--seatmap-primary" | "--seatmap-on-primary" | "--seatmap-error" | "--seatmap-on-error" | "--seatmap-state-layer-hover" | "--seatmap-state-layer-pressed" | "--seatmap-focus-ring" | "--seatmap-radius-sm" | "--seatmap-radius-md" | "--seatmap-radius-lg" | "--seatmap-shadow-raised" | "--seatmap-shadow-elevated" | "--seatmap-shadow-floating" | "--seatmap-viewer-surface" | "--seatmap-viewer-surface-elevated" | "--seatmap-viewer-surface-muted" | "--seatmap-viewer-border" | "--seatmap-viewer-border-subtle" | "--seatmap-viewer-text" | "--seatmap-viewer-text-muted" | "--seatmap-viewer-accent" | "--seatmap-viewer-accent-disabled" | "--seatmap-viewer-accent-text" | "--seatmap-viewer-danger" | "--seatmap-viewer-danger-text" | "--seatmap-viewer-state-layer-hover" | "--seatmap-viewer-state-layer-pressed" | "--seatmap-viewer-focus-ring" | "--seatmap-viewer-radius-sm" | "--seatmap-viewer-radius-md" | "--seatmap-viewer-radius-lg" | "--seatmap-viewer-shadow-raised" | "--seatmap-viewer-shadow-elevated" | "--seatmap-viewer-shadow-floating", string>>;
|
|
135
|
+
};
|
|
136
|
+
export { seatmapViewerSharedTheme }
|
|
137
|
+
export { seatmapViewerSharedTheme as seatmapViewerSharedTheme_alias_1 }
|
|
138
|
+
|
|
139
|
+
declare const seatmapViewerSharedThemeClassNames: SeatmapViewerClassNames;
|
|
140
|
+
export { seatmapViewerSharedThemeClassNames }
|
|
141
|
+
export { seatmapViewerSharedThemeClassNames as seatmapViewerSharedThemeClassNames_alias_1 }
|
|
142
|
+
|
|
143
|
+
declare const seatmapViewerSharedThemeRootClassName = "seatmap-viewer-theme";
|
|
144
|
+
export { seatmapViewerSharedThemeRootClassName }
|
|
145
|
+
export { seatmapViewerSharedThemeRootClassName as seatmapViewerSharedThemeRootClassName_alias_1 }
|
|
146
|
+
|
|
147
|
+
declare const seatmapViewerSharedThemeVariables: SeatmapViewerCssVariableValues;
|
|
148
|
+
export { seatmapViewerSharedThemeVariables }
|
|
149
|
+
export { seatmapViewerSharedThemeVariables as seatmapViewerSharedThemeVariables_alias_1 }
|
|
150
|
+
|
|
151
|
+
declare const seatmapViewerStyleContract: {
|
|
152
|
+
readonly slots: readonly ["root", "legendContainer", "legendHeading", "legendList", "legendItem", "legendSwatch", "legendDivider", "cartChip", "cartPopup", "cartHeader", "cartHeaderTitle", "cartIconButton", "cartBody", "cartEmptyState", "cartGroup", "cartGroupTitle", "cartGroupMeta", "cartQuantityRow", "cartQuantityValue", "cartGroupTotal", "cartSeatRow", "cartSeatLabel", "cartFooter", "cartSummary", "cartProceedButton"];
|
|
153
|
+
readonly defaultClassNames: Record<"root" | "legendContainer" | "legendHeading" | "legendList" | "legendItem" | "legendSwatch" | "legendDivider" | "cartChip" | "cartPopup" | "cartHeader" | "cartHeaderTitle" | "cartIconButton" | "cartBody" | "cartEmptyState" | "cartGroup" | "cartGroupTitle" | "cartGroupMeta" | "cartQuantityRow" | "cartQuantityValue" | "cartGroupTotal" | "cartSeatRow" | "cartSeatLabel" | "cartFooter" | "cartSummary" | "cartProceedButton", string>;
|
|
154
|
+
readonly cssVariables: readonly ["--seatmap-surface", "--seatmap-surface-elevated", "--seatmap-surface-muted", "--seatmap-on-surface", "--seatmap-on-surface-variant", "--seatmap-outline", "--seatmap-outline-variant", "--seatmap-primary", "--seatmap-on-primary", "--seatmap-error", "--seatmap-on-error", "--seatmap-state-layer-hover", "--seatmap-state-layer-pressed", "--seatmap-focus-ring", "--seatmap-radius-sm", "--seatmap-radius-md", "--seatmap-radius-lg", "--seatmap-shadow-raised", "--seatmap-shadow-elevated", "--seatmap-shadow-floating", "--seatmap-viewer-surface", "--seatmap-viewer-surface-elevated", "--seatmap-viewer-surface-muted", "--seatmap-viewer-border", "--seatmap-viewer-border-subtle", "--seatmap-viewer-text", "--seatmap-viewer-text-muted", "--seatmap-viewer-accent", "--seatmap-viewer-accent-disabled", "--seatmap-viewer-accent-text", "--seatmap-viewer-danger", "--seatmap-viewer-danger-text", "--seatmap-viewer-state-layer-hover", "--seatmap-viewer-state-layer-pressed", "--seatmap-viewer-focus-ring", "--seatmap-viewer-radius-sm", "--seatmap-viewer-radius-md", "--seatmap-viewer-radius-lg", "--seatmap-viewer-shadow-raised", "--seatmap-viewer-shadow-elevated", "--seatmap-viewer-shadow-floating"];
|
|
155
|
+
};
|
|
156
|
+
export { seatmapViewerStyleContract }
|
|
157
|
+
export { seatmapViewerStyleContract as seatmapViewerStyleContract_alias_1 }
|
|
158
|
+
|
|
159
|
+
declare type SeatmapViewerStyles = Partial<Record<SeatmapViewerStyleSlot, CSSProperties>>;
|
|
160
|
+
export { SeatmapViewerStyles }
|
|
161
|
+
export { SeatmapViewerStyles as SeatmapViewerStyles_alias_1 }
|
|
162
|
+
|
|
163
|
+
declare type SeatmapViewerStyleSlot = (typeof seatmapViewerStyleSlots)[number];
|
|
164
|
+
export { SeatmapViewerStyleSlot }
|
|
165
|
+
export { SeatmapViewerStyleSlot as SeatmapViewerStyleSlot_alias_1 }
|
|
166
|
+
|
|
167
|
+
declare const seatmapViewerStyleSlots: readonly ["root", "legendContainer", "legendHeading", "legendList", "legendItem", "legendSwatch", "legendDivider", "cartChip", "cartPopup", "cartHeader", "cartHeaderTitle", "cartIconButton", "cartBody", "cartEmptyState", "cartGroup", "cartGroupTitle", "cartGroupMeta", "cartQuantityRow", "cartQuantityValue", "cartGroupTotal", "cartSeatRow", "cartSeatLabel", "cartFooter", "cartSummary", "cartProceedButton"];
|
|
168
|
+
export { seatmapViewerStyleSlots }
|
|
169
|
+
export { seatmapViewerStyleSlots as seatmapViewerStyleSlots_alias_1 }
|
|
170
|
+
|
|
171
|
+
export { useSeatStatus }
|
|
172
|
+
|
|
173
|
+
export { }
|
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
import type { CSSProperties } from 'react';
|
|
2
|
+
import { JSX } from 'react/jsx-runtime';
|
|
3
|
+
import { ReactNode } from 'react';
|
|
4
|
+
import type { SeatStatus } from '@nex125/seatmap-core';
|
|
5
|
+
import type { TooltipData } from '@nex125/seatmap-react';
|
|
6
|
+
import { useSeatStatus } from '@nex125/seatmap-react';
|
|
7
|
+
import type { Venue } from '@nex125/seatmap-core';
|
|
8
|
+
|
|
9
|
+
declare const defaultSeatmapViewerMessages: SeatmapViewerMessages;
|
|
10
|
+
export { defaultSeatmapViewerMessages }
|
|
11
|
+
export { defaultSeatmapViewerMessages as defaultSeatmapViewerMessages_alias_1 }
|
|
12
|
+
|
|
13
|
+
declare function getSeatmapViewerSharedThemeRootStyle(overrides?: SeatmapViewerCssVariableValues): CSSProperties;
|
|
14
|
+
export { getSeatmapViewerSharedThemeRootStyle }
|
|
15
|
+
export { getSeatmapViewerSharedThemeRootStyle as getSeatmapViewerSharedThemeRootStyle_alias_1 }
|
|
16
|
+
|
|
17
|
+
declare interface SeatmapCartEvent {
|
|
18
|
+
type: "cart-proceed-clicked";
|
|
19
|
+
payload: SeatmapCartPayload;
|
|
20
|
+
}
|
|
21
|
+
export { SeatmapCartEvent }
|
|
22
|
+
export { SeatmapCartEvent as SeatmapCartEvent_alias_1 }
|
|
23
|
+
|
|
24
|
+
declare interface SeatmapCartPayload {
|
|
25
|
+
venueId: string;
|
|
26
|
+
venueName: string;
|
|
27
|
+
seats: SeatmapCartSeat[];
|
|
28
|
+
totalSelectedSeats: number;
|
|
29
|
+
totalCost: number;
|
|
30
|
+
}
|
|
31
|
+
export { SeatmapCartPayload }
|
|
32
|
+
export { SeatmapCartPayload as SeatmapCartPayload_alias_1 }
|
|
33
|
+
|
|
34
|
+
declare interface SeatmapCartSeat {
|
|
35
|
+
seatId: string;
|
|
36
|
+
seatLabel: string;
|
|
37
|
+
rowLabel: string | null;
|
|
38
|
+
sectionId: string | null;
|
|
39
|
+
sectionLabel: string | null;
|
|
40
|
+
categoryId: string;
|
|
41
|
+
categoryName: string;
|
|
42
|
+
unitPrice: number;
|
|
43
|
+
baseUnitPrice: number;
|
|
44
|
+
serviceFee: number;
|
|
45
|
+
}
|
|
46
|
+
export { SeatmapCartSeat }
|
|
47
|
+
export { SeatmapCartSeat as SeatmapCartSeat_alias_1 }
|
|
48
|
+
|
|
49
|
+
declare function SeatmapViewer({ venue, onSeatClick, onSeatHover, onSelectionChange, renderTooltip, showLabels, className, onCartEvent, locale, currency, styles, classNames, messages, }: SeatmapViewerProps): JSX.Element;
|
|
50
|
+
export { SeatmapViewer }
|
|
51
|
+
export { SeatmapViewer as SeatmapViewer_alias_1 }
|
|
52
|
+
|
|
53
|
+
declare type SeatmapViewerClassNames = Partial<Record<SeatmapViewerStyleSlot, string>>;
|
|
54
|
+
export { SeatmapViewerClassNames }
|
|
55
|
+
export { SeatmapViewerClassNames as SeatmapViewerClassNames_alias_1 }
|
|
56
|
+
|
|
57
|
+
declare function SeatmapViewerContent({ venue, onSeatClick, onSeatHover, onSelectionChange, renderTooltip, showLabels, onCartEvent, locale, currency, styles, classNames, messages: messagesOverride, }: SeatmapViewerContentProps): JSX.Element;
|
|
58
|
+
export { SeatmapViewerContent }
|
|
59
|
+
export { SeatmapViewerContent as SeatmapViewerContent_alias_1 }
|
|
60
|
+
|
|
61
|
+
declare type SeatmapViewerContentProps = Omit<SeatmapViewerProps, "className"> & {
|
|
62
|
+
showLabels: boolean;
|
|
63
|
+
};
|
|
64
|
+
export { SeatmapViewerContentProps }
|
|
65
|
+
export { SeatmapViewerContentProps as SeatmapViewerContentProps_alias_1 }
|
|
66
|
+
|
|
67
|
+
declare type SeatmapViewerCssVariable = (typeof seatmapViewerCssVariables)[number];
|
|
68
|
+
export { SeatmapViewerCssVariable }
|
|
69
|
+
export { SeatmapViewerCssVariable as SeatmapViewerCssVariable_alias_1 }
|
|
70
|
+
|
|
71
|
+
declare const seatmapViewerCssVariables: readonly ["--seatmap-surface", "--seatmap-surface-elevated", "--seatmap-surface-muted", "--seatmap-on-surface", "--seatmap-on-surface-variant", "--seatmap-outline", "--seatmap-outline-variant", "--seatmap-primary", "--seatmap-on-primary", "--seatmap-error", "--seatmap-on-error", "--seatmap-state-layer-hover", "--seatmap-state-layer-pressed", "--seatmap-focus-ring", "--seatmap-radius-sm", "--seatmap-radius-md", "--seatmap-radius-lg", "--seatmap-shadow-raised", "--seatmap-shadow-elevated", "--seatmap-shadow-floating", "--seatmap-viewer-surface", "--seatmap-viewer-surface-elevated", "--seatmap-viewer-surface-muted", "--seatmap-viewer-border", "--seatmap-viewer-border-subtle", "--seatmap-viewer-text", "--seatmap-viewer-text-muted", "--seatmap-viewer-accent", "--seatmap-viewer-accent-disabled", "--seatmap-viewer-accent-text", "--seatmap-viewer-danger", "--seatmap-viewer-danger-text", "--seatmap-viewer-state-layer-hover", "--seatmap-viewer-state-layer-pressed", "--seatmap-viewer-focus-ring", "--seatmap-viewer-radius-sm", "--seatmap-viewer-radius-md", "--seatmap-viewer-radius-lg", "--seatmap-viewer-shadow-raised", "--seatmap-viewer-shadow-elevated", "--seatmap-viewer-shadow-floating"];
|
|
72
|
+
export { seatmapViewerCssVariables }
|
|
73
|
+
export { seatmapViewerCssVariables as seatmapViewerCssVariables_alias_1 }
|
|
74
|
+
|
|
75
|
+
declare type SeatmapViewerCssVariableValues = Partial<Record<SeatmapViewerCssVariable, string>>;
|
|
76
|
+
export { SeatmapViewerCssVariableValues }
|
|
77
|
+
export { SeatmapViewerCssVariableValues as SeatmapViewerCssVariableValues_alias_1 }
|
|
78
|
+
|
|
79
|
+
declare const seatmapViewerDefaultClassNames: Record<SeatmapViewerStyleSlot, string>;
|
|
80
|
+
export { seatmapViewerDefaultClassNames }
|
|
81
|
+
export { seatmapViewerDefaultClassNames as seatmapViewerDefaultClassNames_alias_1 }
|
|
82
|
+
|
|
83
|
+
declare interface SeatmapViewerMessages {
|
|
84
|
+
uncategorizedCategoryName: string;
|
|
85
|
+
sectionFallbackLabel: string;
|
|
86
|
+
tableLabel: (tableLabel: string) => string;
|
|
87
|
+
tooltipSeatLabel: (rowLabel: string, seatLabel: string) => string;
|
|
88
|
+
tooltipStatusAvailable: string;
|
|
89
|
+
tooltipPriceLabel: (price: string) => string;
|
|
90
|
+
tooltipPriceUnavailable: string;
|
|
91
|
+
legendAriaLabel: string;
|
|
92
|
+
legendStatusesTitle: string;
|
|
93
|
+
legendPricesTitle: string;
|
|
94
|
+
cartChipLabel: (selectedCount: number) => string;
|
|
95
|
+
cartAriaLabel: string;
|
|
96
|
+
cartHeaderTitle: string;
|
|
97
|
+
cartCloseLabel: string;
|
|
98
|
+
cartEmptyState: string;
|
|
99
|
+
cartGroupMeta: (count: number, unitPrice: string) => string;
|
|
100
|
+
cartGroupFee: (basePrice: string, serviceFee: string, serviceFeePercent: string | null) => string;
|
|
101
|
+
cartRemoveOneAriaLabel: (categoryName: string) => string;
|
|
102
|
+
cartAddOneAriaLabel: (categoryName: string) => string;
|
|
103
|
+
cartRemoveSeatTitle: string;
|
|
104
|
+
cartRemoveSeatAriaLabel: (seatLabel: string) => string;
|
|
105
|
+
cartServiceFeeSummary: (serviceFeeTotal: string) => string;
|
|
106
|
+
cartSummary: (count: number, totalCost: string) => string;
|
|
107
|
+
cartProceedButton: string;
|
|
108
|
+
}
|
|
109
|
+
export { SeatmapViewerMessages }
|
|
110
|
+
export { SeatmapViewerMessages as SeatmapViewerMessages_alias_1 }
|
|
111
|
+
|
|
112
|
+
declare interface SeatmapViewerProps {
|
|
113
|
+
venue: Venue;
|
|
114
|
+
onSeatClick?: (seatId: string, sectionId: string) => void;
|
|
115
|
+
onSeatHover?: (seatId: string | null, sectionId: string | null) => void;
|
|
116
|
+
onSelectionChange?: (seatIds: string[]) => void;
|
|
117
|
+
onStatusUpdate?: (seatId: string, status: SeatStatus) => void;
|
|
118
|
+
renderTooltip?: (data: TooltipData) => ReactNode;
|
|
119
|
+
showLabels?: boolean;
|
|
120
|
+
className?: string;
|
|
121
|
+
onCartEvent?: (event: SeatmapCartEvent) => void;
|
|
122
|
+
locale?: string;
|
|
123
|
+
currency?: string;
|
|
124
|
+
styles?: SeatmapViewerStyles;
|
|
125
|
+
classNames?: SeatmapViewerClassNames;
|
|
126
|
+
messages?: Partial<SeatmapViewerMessages>;
|
|
127
|
+
}
|
|
128
|
+
export { SeatmapViewerProps }
|
|
129
|
+
export { SeatmapViewerProps as SeatmapViewerProps_alias_1 }
|
|
130
|
+
|
|
131
|
+
declare const seatmapViewerSharedTheme: {
|
|
132
|
+
readonly rootClassName: "seatmap-viewer-theme";
|
|
133
|
+
readonly classNames: Partial<Record<"root" | "legendContainer" | "legendHeading" | "legendList" | "legendItem" | "legendSwatch" | "legendDivider" | "cartChip" | "cartPopup" | "cartHeader" | "cartHeaderTitle" | "cartIconButton" | "cartBody" | "cartEmptyState" | "cartGroup" | "cartGroupTitle" | "cartGroupMeta" | "cartQuantityRow" | "cartQuantityValue" | "cartGroupTotal" | "cartSeatRow" | "cartSeatLabel" | "cartFooter" | "cartSummary" | "cartProceedButton", string>>;
|
|
134
|
+
readonly variables: Partial<Record<"--seatmap-surface" | "--seatmap-surface-elevated" | "--seatmap-surface-muted" | "--seatmap-on-surface" | "--seatmap-on-surface-variant" | "--seatmap-outline" | "--seatmap-outline-variant" | "--seatmap-primary" | "--seatmap-on-primary" | "--seatmap-error" | "--seatmap-on-error" | "--seatmap-state-layer-hover" | "--seatmap-state-layer-pressed" | "--seatmap-focus-ring" | "--seatmap-radius-sm" | "--seatmap-radius-md" | "--seatmap-radius-lg" | "--seatmap-shadow-raised" | "--seatmap-shadow-elevated" | "--seatmap-shadow-floating" | "--seatmap-viewer-surface" | "--seatmap-viewer-surface-elevated" | "--seatmap-viewer-surface-muted" | "--seatmap-viewer-border" | "--seatmap-viewer-border-subtle" | "--seatmap-viewer-text" | "--seatmap-viewer-text-muted" | "--seatmap-viewer-accent" | "--seatmap-viewer-accent-disabled" | "--seatmap-viewer-accent-text" | "--seatmap-viewer-danger" | "--seatmap-viewer-danger-text" | "--seatmap-viewer-state-layer-hover" | "--seatmap-viewer-state-layer-pressed" | "--seatmap-viewer-focus-ring" | "--seatmap-viewer-radius-sm" | "--seatmap-viewer-radius-md" | "--seatmap-viewer-radius-lg" | "--seatmap-viewer-shadow-raised" | "--seatmap-viewer-shadow-elevated" | "--seatmap-viewer-shadow-floating", string>>;
|
|
135
|
+
};
|
|
136
|
+
export { seatmapViewerSharedTheme }
|
|
137
|
+
export { seatmapViewerSharedTheme as seatmapViewerSharedTheme_alias_1 }
|
|
138
|
+
|
|
139
|
+
declare const seatmapViewerSharedThemeClassNames: SeatmapViewerClassNames;
|
|
140
|
+
export { seatmapViewerSharedThemeClassNames }
|
|
141
|
+
export { seatmapViewerSharedThemeClassNames as seatmapViewerSharedThemeClassNames_alias_1 }
|
|
142
|
+
|
|
143
|
+
declare const seatmapViewerSharedThemeRootClassName = "seatmap-viewer-theme";
|
|
144
|
+
export { seatmapViewerSharedThemeRootClassName }
|
|
145
|
+
export { seatmapViewerSharedThemeRootClassName as seatmapViewerSharedThemeRootClassName_alias_1 }
|
|
146
|
+
|
|
147
|
+
declare const seatmapViewerSharedThemeVariables: SeatmapViewerCssVariableValues;
|
|
148
|
+
export { seatmapViewerSharedThemeVariables }
|
|
149
|
+
export { seatmapViewerSharedThemeVariables as seatmapViewerSharedThemeVariables_alias_1 }
|
|
150
|
+
|
|
151
|
+
declare const seatmapViewerStyleContract: {
|
|
152
|
+
readonly slots: readonly ["root", "legendContainer", "legendHeading", "legendList", "legendItem", "legendSwatch", "legendDivider", "cartChip", "cartPopup", "cartHeader", "cartHeaderTitle", "cartIconButton", "cartBody", "cartEmptyState", "cartGroup", "cartGroupTitle", "cartGroupMeta", "cartQuantityRow", "cartQuantityValue", "cartGroupTotal", "cartSeatRow", "cartSeatLabel", "cartFooter", "cartSummary", "cartProceedButton"];
|
|
153
|
+
readonly defaultClassNames: Record<"root" | "legendContainer" | "legendHeading" | "legendList" | "legendItem" | "legendSwatch" | "legendDivider" | "cartChip" | "cartPopup" | "cartHeader" | "cartHeaderTitle" | "cartIconButton" | "cartBody" | "cartEmptyState" | "cartGroup" | "cartGroupTitle" | "cartGroupMeta" | "cartQuantityRow" | "cartQuantityValue" | "cartGroupTotal" | "cartSeatRow" | "cartSeatLabel" | "cartFooter" | "cartSummary" | "cartProceedButton", string>;
|
|
154
|
+
readonly cssVariables: readonly ["--seatmap-surface", "--seatmap-surface-elevated", "--seatmap-surface-muted", "--seatmap-on-surface", "--seatmap-on-surface-variant", "--seatmap-outline", "--seatmap-outline-variant", "--seatmap-primary", "--seatmap-on-primary", "--seatmap-error", "--seatmap-on-error", "--seatmap-state-layer-hover", "--seatmap-state-layer-pressed", "--seatmap-focus-ring", "--seatmap-radius-sm", "--seatmap-radius-md", "--seatmap-radius-lg", "--seatmap-shadow-raised", "--seatmap-shadow-elevated", "--seatmap-shadow-floating", "--seatmap-viewer-surface", "--seatmap-viewer-surface-elevated", "--seatmap-viewer-surface-muted", "--seatmap-viewer-border", "--seatmap-viewer-border-subtle", "--seatmap-viewer-text", "--seatmap-viewer-text-muted", "--seatmap-viewer-accent", "--seatmap-viewer-accent-disabled", "--seatmap-viewer-accent-text", "--seatmap-viewer-danger", "--seatmap-viewer-danger-text", "--seatmap-viewer-state-layer-hover", "--seatmap-viewer-state-layer-pressed", "--seatmap-viewer-focus-ring", "--seatmap-viewer-radius-sm", "--seatmap-viewer-radius-md", "--seatmap-viewer-radius-lg", "--seatmap-viewer-shadow-raised", "--seatmap-viewer-shadow-elevated", "--seatmap-viewer-shadow-floating"];
|
|
155
|
+
};
|
|
156
|
+
export { seatmapViewerStyleContract }
|
|
157
|
+
export { seatmapViewerStyleContract as seatmapViewerStyleContract_alias_1 }
|
|
158
|
+
|
|
159
|
+
declare type SeatmapViewerStyles = Partial<Record<SeatmapViewerStyleSlot, CSSProperties>>;
|
|
160
|
+
export { SeatmapViewerStyles }
|
|
161
|
+
export { SeatmapViewerStyles as SeatmapViewerStyles_alias_1 }
|
|
162
|
+
|
|
163
|
+
declare type SeatmapViewerStyleSlot = (typeof seatmapViewerStyleSlots)[number];
|
|
164
|
+
export { SeatmapViewerStyleSlot }
|
|
165
|
+
export { SeatmapViewerStyleSlot as SeatmapViewerStyleSlot_alias_1 }
|
|
166
|
+
|
|
167
|
+
declare const seatmapViewerStyleSlots: readonly ["root", "legendContainer", "legendHeading", "legendList", "legendItem", "legendSwatch", "legendDivider", "cartChip", "cartPopup", "cartHeader", "cartHeaderTitle", "cartIconButton", "cartBody", "cartEmptyState", "cartGroup", "cartGroupTitle", "cartGroupMeta", "cartQuantityRow", "cartQuantityValue", "cartGroupTotal", "cartSeatRow", "cartSeatLabel", "cartFooter", "cartSummary", "cartProceedButton"];
|
|
168
|
+
export { seatmapViewerStyleSlots }
|
|
169
|
+
export { seatmapViewerStyleSlots as seatmapViewerStyleSlots_alias_1 }
|
|
170
|
+
|
|
171
|
+
export { useSeatStatus }
|
|
172
|
+
|
|
173
|
+
export { }
|
package/dist/index.cjs
CHANGED
|
@@ -10,6 +10,10 @@ var defaultSeatmapViewerMessages = {
|
|
|
10
10
|
uncategorizedCategoryName: "Uncategorized",
|
|
11
11
|
sectionFallbackLabel: "Section",
|
|
12
12
|
tableLabel: (tableLabel) => `Table ${tableLabel}`,
|
|
13
|
+
tooltipSeatLabel: (rowLabel, seatLabel) => `Row ${rowLabel}, Seat ${seatLabel}`,
|
|
14
|
+
tooltipStatusAvailable: "Available",
|
|
15
|
+
tooltipPriceLabel: (price) => `Price: ${price}`,
|
|
16
|
+
tooltipPriceUnavailable: "Price unavailable",
|
|
13
17
|
legendAriaLabel: "Seatmap legend",
|
|
14
18
|
legendStatusesTitle: "Seat statuses",
|
|
15
19
|
legendPricesTitle: "Prices",
|
|
@@ -19,19 +23,46 @@ var defaultSeatmapViewerMessages = {
|
|
|
19
23
|
cartCloseLabel: "Close cart",
|
|
20
24
|
cartEmptyState: "No seats selected yet.",
|
|
21
25
|
cartGroupMeta: (count, unitPrice) => `${count} tickets - ${unitPrice} each`,
|
|
26
|
+
cartGroupFee: (basePrice, serviceFee, serviceFeePercent) => serviceFeePercent ? `Base ${basePrice} + service fee ${serviceFee} (${serviceFeePercent})` : `Base ${basePrice} + service fee ${serviceFee}`,
|
|
22
27
|
cartRemoveOneAriaLabel: (categoryName) => `Remove one seat from ${categoryName}`,
|
|
23
28
|
cartAddOneAriaLabel: (categoryName) => `Add one seat to ${categoryName}`,
|
|
24
29
|
cartRemoveSeatTitle: "Remove seat",
|
|
25
30
|
cartRemoveSeatAriaLabel: (seatLabel) => `Remove seat ${seatLabel}`,
|
|
31
|
+
cartServiceFeeSummary: (serviceFeeTotal) => `Service fee included: ${serviceFeeTotal}`,
|
|
26
32
|
cartSummary: (count, totalCost) => `${count} seats - Total ${totalCost}`,
|
|
27
33
|
cartProceedButton: "Proceed"
|
|
28
34
|
};
|
|
29
|
-
function
|
|
30
|
-
if (!category)
|
|
35
|
+
function getCategoryPriceBreakdown(category) {
|
|
36
|
+
if (!category) {
|
|
37
|
+
return { unitPrice: 0, baseUnitPrice: 0, serviceFee: 0 };
|
|
38
|
+
}
|
|
39
|
+
const baseUnitPrice = Number.isFinite(category.basePrice) ? category.basePrice : 0;
|
|
40
|
+
const serviceFee = Number.isFinite(category.serviceFee) ? category.serviceFee : 0;
|
|
31
41
|
if (category.isPriceOverridden && Number.isFinite(category.overriddenPrice)) {
|
|
32
|
-
return
|
|
42
|
+
return {
|
|
43
|
+
unitPrice: category.overriddenPrice ?? 0,
|
|
44
|
+
baseUnitPrice,
|
|
45
|
+
serviceFee
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
if (Number.isFinite(category.backendPrice)) {
|
|
49
|
+
return {
|
|
50
|
+
unitPrice: category.backendPrice,
|
|
51
|
+
baseUnitPrice,
|
|
52
|
+
serviceFee
|
|
53
|
+
};
|
|
33
54
|
}
|
|
34
|
-
return
|
|
55
|
+
return {
|
|
56
|
+
unitPrice: baseUnitPrice + serviceFee,
|
|
57
|
+
baseUnitPrice,
|
|
58
|
+
serviceFee
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
function formatPercent(value, locale) {
|
|
62
|
+
return new Intl.NumberFormat(locale, {
|
|
63
|
+
style: "percent",
|
|
64
|
+
maximumFractionDigits: 2
|
|
65
|
+
}).format(value);
|
|
35
66
|
}
|
|
36
67
|
function formatMoney(value, locale, currency) {
|
|
37
68
|
return new Intl.NumberFormat(locale, {
|
|
@@ -39,6 +70,57 @@ function formatMoney(value, locale, currency) {
|
|
|
39
70
|
currency
|
|
40
71
|
}).format(value);
|
|
41
72
|
}
|
|
73
|
+
function DefaultSeatmapViewerTooltip({
|
|
74
|
+
data,
|
|
75
|
+
locale,
|
|
76
|
+
currency,
|
|
77
|
+
messages
|
|
78
|
+
}) {
|
|
79
|
+
const statusLabel = data.statusName ?? (data.seat.status === seatmapCore.AVAILABLE_STATUS_ID ? messages.tooltipStatusAvailable : data.seat.status);
|
|
80
|
+
const priceLabel = typeof data.price === "number" ? messages.tooltipPriceLabel(formatMoney(data.price, locale, currency)) : messages.tooltipPriceUnavailable;
|
|
81
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
82
|
+
"div",
|
|
83
|
+
{
|
|
84
|
+
style: {
|
|
85
|
+
background: "var(--seatmap-tooltip-surface, color-mix(in srgb, var(--seatmap-surface-container-low, #181818) 94%, transparent))",
|
|
86
|
+
border: "1px solid var(--seatmap-tooltip-border, var(--seatmap-outline, #353331))",
|
|
87
|
+
borderRadius: 10,
|
|
88
|
+
padding: "8px 14px",
|
|
89
|
+
color: "var(--seatmap-tooltip-text, var(--seatmap-on-surface, #e5e2e1))",
|
|
90
|
+
fontSize: 13,
|
|
91
|
+
fontFamily: "system-ui",
|
|
92
|
+
pointerEvents: "none",
|
|
93
|
+
whiteSpace: "nowrap"
|
|
94
|
+
},
|
|
95
|
+
children: [
|
|
96
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontWeight: 600, marginBottom: 2 }, children: data.section.label }),
|
|
97
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: messages.tooltipSeatLabel(data.row.label, data.seat.label) }),
|
|
98
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
99
|
+
"div",
|
|
100
|
+
{
|
|
101
|
+
style: {
|
|
102
|
+
color: "var(--seatmap-tooltip-muted-text, var(--seatmap-on-surface-variant, #9a9694))",
|
|
103
|
+
fontSize: 12,
|
|
104
|
+
marginTop: 2
|
|
105
|
+
},
|
|
106
|
+
children: statusLabel
|
|
107
|
+
}
|
|
108
|
+
),
|
|
109
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
110
|
+
"div",
|
|
111
|
+
{
|
|
112
|
+
style: {
|
|
113
|
+
color: "var(--seatmap-tooltip-muted-text, var(--seatmap-on-surface-variant, #9a9694))",
|
|
114
|
+
fontSize: 12,
|
|
115
|
+
marginTop: 2
|
|
116
|
+
},
|
|
117
|
+
children: priceLabel
|
|
118
|
+
}
|
|
119
|
+
)
|
|
120
|
+
]
|
|
121
|
+
}
|
|
122
|
+
);
|
|
123
|
+
}
|
|
42
124
|
function TrashIcon() {
|
|
43
125
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
44
126
|
"path",
|
|
@@ -94,6 +176,7 @@ function SeatmapViewerContent({
|
|
|
94
176
|
for (const row of section.rows) {
|
|
95
177
|
for (const seat of row.seats) {
|
|
96
178
|
const category = categoryMap.get(seat.categoryId);
|
|
179
|
+
const priceBreakdown = getCategoryPriceBreakdown(category);
|
|
97
180
|
next.set(seat.id, {
|
|
98
181
|
seatId: seat.id,
|
|
99
182
|
seatLabel: seat.label,
|
|
@@ -102,7 +185,9 @@ function SeatmapViewerContent({
|
|
|
102
185
|
sectionLabel: section.label,
|
|
103
186
|
categoryId: seat.categoryId,
|
|
104
187
|
categoryName: category?.name ?? messages.uncategorizedCategoryName,
|
|
105
|
-
unitPrice:
|
|
188
|
+
unitPrice: priceBreakdown.unitPrice,
|
|
189
|
+
baseUnitPrice: priceBreakdown.baseUnitPrice,
|
|
190
|
+
serviceFee: priceBreakdown.serviceFee,
|
|
106
191
|
status: seat.status,
|
|
107
192
|
x: section.position.x + seat.position.x * cos - seat.position.y * sin,
|
|
108
193
|
y: section.position.y + seat.position.x * sin + seat.position.y * cos
|
|
@@ -113,6 +198,7 @@ function SeatmapViewerContent({
|
|
|
113
198
|
for (const table of venue.tables) {
|
|
114
199
|
for (const seat of table.seats) {
|
|
115
200
|
const category = categoryMap.get(seat.categoryId);
|
|
201
|
+
const priceBreakdown = getCategoryPriceBreakdown(category);
|
|
116
202
|
next.set(seat.id, {
|
|
117
203
|
seatId: seat.id,
|
|
118
204
|
seatLabel: seat.label,
|
|
@@ -121,7 +207,9 @@ function SeatmapViewerContent({
|
|
|
121
207
|
sectionLabel: messages.tableLabel(table.label),
|
|
122
208
|
categoryId: seat.categoryId,
|
|
123
209
|
categoryName: category?.name ?? messages.uncategorizedCategoryName,
|
|
124
|
-
unitPrice:
|
|
210
|
+
unitPrice: priceBreakdown.unitPrice,
|
|
211
|
+
baseUnitPrice: priceBreakdown.baseUnitPrice,
|
|
212
|
+
serviceFee: priceBreakdown.serviceFee,
|
|
125
213
|
status: seat.status,
|
|
126
214
|
x: table.position.x + seat.position.x,
|
|
127
215
|
y: table.position.y + seat.position.y
|
|
@@ -172,12 +260,32 @@ function SeatmapViewerContent({
|
|
|
172
260
|
sectionLabel: seat.sectionLabel,
|
|
173
261
|
categoryId: seat.categoryId,
|
|
174
262
|
categoryName: seat.categoryName,
|
|
175
|
-
unitPrice: seat.unitPrice
|
|
263
|
+
unitPrice: seat.unitPrice,
|
|
264
|
+
baseUnitPrice: seat.baseUnitPrice,
|
|
265
|
+
serviceFee: seat.serviceFee
|
|
176
266
|
})),
|
|
177
267
|
[selectedSeats]
|
|
178
268
|
);
|
|
179
269
|
const totalSelectedSeats = react.useMemo(() => cartSeats.length, [cartSeats]);
|
|
180
270
|
const totalCost = react.useMemo(() => cartSeats.reduce((sum, seat) => sum + seat.unitPrice, 0), [cartSeats]);
|
|
271
|
+
const totalServiceFee = react.useMemo(() => cartSeats.reduce((sum, seat) => sum + seat.serviceFee, 0), [cartSeats]);
|
|
272
|
+
const effectiveTooltipRenderer = react.useCallback(
|
|
273
|
+
(data) => {
|
|
274
|
+
if (renderTooltip) {
|
|
275
|
+
return renderTooltip(data);
|
|
276
|
+
}
|
|
277
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
278
|
+
DefaultSeatmapViewerTooltip,
|
|
279
|
+
{
|
|
280
|
+
data,
|
|
281
|
+
locale,
|
|
282
|
+
currency,
|
|
283
|
+
messages
|
|
284
|
+
}
|
|
285
|
+
);
|
|
286
|
+
},
|
|
287
|
+
[currency, locale, messages, renderTooltip]
|
|
288
|
+
);
|
|
181
289
|
const groupedSeatsList = react.useMemo(() => {
|
|
182
290
|
const grouped = /* @__PURE__ */ new Map();
|
|
183
291
|
for (const seat of cartSeats) {
|
|
@@ -188,6 +296,8 @@ function SeatmapViewerContent({
|
|
|
188
296
|
grouped.set(seat.categoryId, {
|
|
189
297
|
categoryName: seat.categoryName,
|
|
190
298
|
unitPrice: seat.unitPrice,
|
|
299
|
+
baseUnitPrice: seat.baseUnitPrice,
|
|
300
|
+
serviceFee: seat.serviceFee,
|
|
191
301
|
seats: [seat]
|
|
192
302
|
});
|
|
193
303
|
}
|
|
@@ -209,6 +319,8 @@ function SeatmapViewerContent({
|
|
|
209
319
|
categoryId: category.id,
|
|
210
320
|
categoryName: group.categoryName,
|
|
211
321
|
unitPrice: group.unitPrice,
|
|
322
|
+
baseUnitPrice: group.baseUnitPrice,
|
|
323
|
+
serviceFee: group.serviceFee,
|
|
212
324
|
seats: group.seats,
|
|
213
325
|
availableToAdd: availableToAddByCategory.get(category.id) ?? 0
|
|
214
326
|
});
|
|
@@ -219,6 +331,8 @@ function SeatmapViewerContent({
|
|
|
219
331
|
categoryId,
|
|
220
332
|
categoryName: group.categoryName,
|
|
221
333
|
unitPrice: group.unitPrice,
|
|
334
|
+
baseUnitPrice: group.baseUnitPrice,
|
|
335
|
+
serviceFee: group.serviceFee,
|
|
222
336
|
seats: group.seats,
|
|
223
337
|
availableToAdd: availableToAddByCategory.get(categoryId) ?? 0
|
|
224
338
|
});
|
|
@@ -444,6 +558,18 @@ function SeatmapViewerContent({
|
|
|
444
558
|
children: messages.cartGroupMeta(group.seats.length, formatMoney(group.unitPrice, locale, currency))
|
|
445
559
|
}
|
|
446
560
|
),
|
|
561
|
+
group.serviceFee > 0 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
562
|
+
"div",
|
|
563
|
+
{
|
|
564
|
+
className: mergeClassNames("seatmap-viewer__cart-group-meta-base", classNames.cartGroupMeta),
|
|
565
|
+
style: styles.cartGroupMeta,
|
|
566
|
+
children: messages.cartGroupFee(
|
|
567
|
+
formatMoney(group.baseUnitPrice, locale, currency),
|
|
568
|
+
formatMoney(group.serviceFee, locale, currency),
|
|
569
|
+
group.baseUnitPrice > 0 ? formatPercent(group.serviceFee / group.baseUnitPrice, locale) : null
|
|
570
|
+
)
|
|
571
|
+
}
|
|
572
|
+
),
|
|
447
573
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: mergeClassNames("seatmap-viewer__cart-quantity-row-base", classNames.cartQuantityRow), style: styles.cartQuantityRow, children: [
|
|
448
574
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "seatmap-viewer__cart-quantity-controls", children: [
|
|
449
575
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -534,12 +660,15 @@ function SeatmapViewerContent({
|
|
|
534
660
|
className: mergeClassNames("seatmap-viewer__cart-footer-base", classNames.cartFooter),
|
|
535
661
|
style: styles.cartFooter,
|
|
536
662
|
children: [
|
|
537
|
-
/* @__PURE__ */ jsxRuntime.
|
|
663
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
538
664
|
"div",
|
|
539
665
|
{
|
|
540
666
|
className: mergeClassNames("seatmap-viewer__cart-summary-base", classNames.cartSummary),
|
|
541
667
|
style: styles.cartSummary,
|
|
542
|
-
children:
|
|
668
|
+
children: [
|
|
669
|
+
totalServiceFee > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { children: messages.cartServiceFeeSummary(formatMoney(totalServiceFee, locale, currency)) }),
|
|
670
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: messages.cartSummary(totalSelectedSeats, formatMoney(totalCost, locale, currency)) })
|
|
671
|
+
]
|
|
543
672
|
}
|
|
544
673
|
),
|
|
545
674
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -559,7 +688,7 @@ function SeatmapViewerContent({
|
|
|
559
688
|
]
|
|
560
689
|
}
|
|
561
690
|
),
|
|
562
|
-
showLabels && /* @__PURE__ */ jsxRuntime.jsx(seatmapReact.TooltipOverlay, { renderTooltip })
|
|
691
|
+
showLabels && /* @__PURE__ */ jsxRuntime.jsx(seatmapReact.TooltipOverlay, { renderTooltip: effectiveTooltipRenderer })
|
|
563
692
|
]
|
|
564
693
|
}
|
|
565
694
|
);
|