npm - @12-apps/ui - Versions diffs - 6.7.0 → 6.9.0 - Mend

@12-apps/ui 6.7.0 → 6.9.0

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.

Files changed (405) hide show

package/dist/data-display/TimingDiagram.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/components/data-display/TimingDiagram/TimingDiagram.tsx","../../src/components/data-display/TimingDiagram/TimingDiagram.views.tsx"],"sourcesContent":["import { alpha, Box, Paper, styled, Typography } from '@mui/material';\nimport type { FC } from 'react';\nimport React, { useMemo } from 'react';\n\nimport type { TimingData, TimingDiagramProps } from './TimingDiagram.types';\nimport type { Phase, PhaseKey, TimingViewProps } from './TimingDiagram.views';\nimport {\n HorizontalView,\n phaseColors,\n StackedView,\n WaterfallView,\n} from './TimingDiagram.views';\n\n// Styled components\nconst DiagramContainer = styled(Paper)(({ theme }) => ({\n padding: theme.spacing(3),\n background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.9)} 0%, ${alpha(theme.palette.background.paper, 0.8)} 100%)`,\n backdropFilter: 'blur(10px)',\n WebkitBackdropFilter: 'blur(10px)',\n border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n borderRadius: theme.shape.borderRadius * 2,\n}));\n\nconst Legend = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexWrap: 'wrap',\n gap: theme.spacing(2),\n marginTop: theme.spacing(2),\n paddingTop: theme.spacing(2),\n borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n}));\n\nconst LegendItem = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(1),\n '& .color': {\n width: 12,\n height: 12,\n borderRadius: 2,\n },\n '& .label': {\n fontSize: '0.8rem',\n color: theme.palette.text.secondary,\n },\n}));\n\n// Helper functions\nconst calculatePercentages = (data: TimingData): Record<string, number> => {\n const total = data.total \|\| 1;\n return {\n dns: ((data.dns \|\| 0) / total) * 100,\n connect: ((data.connect \|\| 0) / total) * 100,\n ssl: ((data.ssl \|\| 0) / total) * 100,\n request: ((data.request \|\| 0) / total) * 100,\n response: ((data.response \|\| 0) / total) * 100,\n };\n};\n\n// A phase with no recorded time never happened — an HTTP request has no SSL\n// handshake, for instance — so it gets no bar and no legend entry.\nconst phasesOf = (data: TimingData): Phase[] =>\n [\n { key: 'dns', label: 'DNS Lookup', value: data.dns },\n { key: 'connect', label: 'Connection', value: data.connect },\n { key: 'ssl', label: 'SSL/TLS', value: data.ssl },\n { key: 'request', label: 'Request', value: data.request },\n { key: 'response', label: 'Response', value: data.response },\n ].filter((phase) => phase.value !== undefined && phase.value > 0);\n\nconst VIEWS: Record<string, FC<TimingViewProps>> = {\n waterfall: WaterfallView,\n stacked: StackedView,\n horizontal: HorizontalView,\n};\n\n// Main component\nexport const TimingDiagram: FC<TimingDiagramProps> = ({\n data,\n showLabels = true,\n height = 40,\n animated = true,\n showTooltips = true,\n variant = 'waterfall',\n}) => {\n const percentages = useMemo(() => calculatePercentages(data), [data]);\n const phases = phasesOf(data);\n const View = VIEWS[variant];\n\n return (\n <DiagramContainer elevation={2} role=\"region\" aria-label=\"Timing diagram\" tabIndex={0}>\n <Typography variant=\"h6\" fontWeight=\"bold\" gutterBottom>\n Request Timing\n </Typography>\n\n {View && (\n <View\n phases={phases}\n percentages={percentages}\n data={data}\n animated={animated}\n showLabels={showLabels}\n showTooltips={showTooltips}\n height={height}\n />\n )}\n\n {showLabels && (\n <Legend>\n {phases.map((phase) => (\n <LegendItem key={phase.key}>\n <Box\n className=\"color\"\n sx={{ backgroundColor: phaseColors[phase.key as PhaseKey] }}\n />\n <Typography className=\"label\">{phase.label}</Typography>\n </LegendItem>\n ))}\n </Legend>\n )}\n </DiagramContainer>\n );\n};\n\n// Export default\nexport default TimingDiagram;\n","import { alpha, Box, styled, Tooltip, Typography, useTheme } from '@mui/material';\nimport type { FC, ReactElement } from 'react';\nimport React from 'react';\n\nimport type { TimingData } from './TimingDiagram.types';\n\n// Color configurations\nexport const phaseColors = {\n dns: '#9C27B0', // Purple\n connect: '#2196F3', // Blue\n ssl: '#00BCD4', // Cyan\n request: '#4CAF50', // Green\n response: '#FF9800', // Orange\n};\n\nexport type PhaseKey = keyof typeof phaseColors;\n\nexport interface Phase {\n key: string;\n label: string;\n value?: number;\n}\n\nexport interface TimingViewProps {\n phases: Phase[];\n percentages: Record<string, number>;\n data: TimingData;\n animated: boolean;\n showLabels: boolean;\n showTooltips: boolean;\n height: number;\n}\n\nexport const formatTime = (ms: number): string => {\n if (ms < 1000) return `${ms}ms`;\n return `${(ms / 1000).toFixed(2)}s`;\n};\n\nconst colorOf = (phase: Phase): string => phaseColors[phase.key as PhaseKey];\nconst widthOf = (percentages: Record<string, number>, phase: Phase): number =>\n percentages[phase.key] ?? 0;\n\n// Waterfall and stacked both offer the same hover explanation of a segment; only\n// whether tooltips are on at all varies.\nconst withTooltip = (\n phase: Phase,\n enabled: boolean,\n element: ReactElement,\n): ReactElement =>\n enabled ? (\n <Tooltip\n key={phase.key}\n title={`${phase.label}: ${formatTime(phase.value!)}`}\n placement=\"top\"\n role=\"tooltip\"\n aria-describedby={`tooltip-${phase.key}`}\n >\n {element}\n </Tooltip>\n ) : (\n element\n );\n\nconst WaterfallContainer = styled(Box)(({ theme }) => ({\n position: 'relative',\n width: '100%',\n marginTop: theme.spacing(2),\n}));\n\nconst WaterfallBar = styled(Box, {\n shouldForwardProp: (prop) =>\n !['phaseColor', 'offset', 'width', 'animated'].includes(prop as string),\n})<{\n phaseColor: string;\n offset: number;\n width: number;\n animated: boolean;\n}>(({ theme, phaseColor, offset, width, animated }) => ({\n position: 'absolute',\n height: 32,\n left: `${offset}%`,\n width: `${width}%`,\n background: `linear-gradient(90deg, ${phaseColor} 0%, ${alpha(phaseColor, 0.8)} 100%)`,\n borderRadius: theme.shape.borderRadius,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: theme.palette.getContrastText(phaseColor),\n fontSize: '0.75rem',\n fontWeight: 500,\n boxShadow: `0 2px 8px ${alpha(phaseColor, 0.3)}`,\n transition: animated ? 'all 0.5s ease' : 'none',\n animation: animated ? 'slideIn 0.5s ease' : 'none',\n '@keyframes slideIn': {\n from: {\n transform: 'translateX(-20px)',\n opacity: 0,\n },\n to: {\n transform: 'translateX(0)',\n opacity: 1,\n },\n },\n '&:hover': {\n transform: 'translateY(-2px)',\n boxShadow: `0 4px 12px ${alpha(phaseColor, 0.5)}`,\n zIndex: 10,\n },\n}));\n\nconst TimelineAxis = styled(Box)(({ theme }) => ({\n display: 'flex',\n justifyContent: 'space-between',\n marginTop: theme.spacing(1),\n paddingTop: theme.spacing(1),\n borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n}));\n\nconst TimeLabel = styled(Typography)(({ theme }) => ({\n fontSize: '0.7rem',\n color: theme.palette.text.secondary,\n fontWeight: 500,\n}));\n\nexport const WaterfallView: FC<TimingViewProps> = ({\n phases,\n percentages,\n data,\n animated,\n showLabels,\n showTooltips,\n height,\n}) => {\n // Each bar starts where the previous one ended, so the row reads as a timeline.\n let offset = 0;\n\n return (\n <WaterfallContainer style={{ height: height + 40 }} data-variant=\"waterfall\">\n {phases.map((phase, index) => {\n const width = widthOf(percentages, phase);\n const currentOffset = offset;\n offset += width;\n\n return withTooltip(\n phase,\n showTooltips,\n <WaterfallBar\n key={phase.key}\n data-testid={`timing-segment-${phase.key}`}\n phaseColor={colorOf(phase)}\n offset={currentOffset}\n width={width}\n animated={animated}\n data-animated={animated.toString()}\n style={{\n top: index * 8,\n width: `${width}%`,\n left: `${currentOffset}%`,\n }}\n >\n {showLabels && width > 10 && (\n <span data-testid=\"timing-label\">{formatTime(phase.value!)}</span>\n )}\n </WaterfallBar>,\n );\n })}\n <TimelineAxis style={{ marginTop: height }}>\n <TimeLabel>0ms</TimeLabel>\n <TimeLabel>{formatTime(data.total / 2)}</TimeLabel>\n <TimeLabel>{formatTime(data.total)}</TimeLabel>\n </TimelineAxis>\n </WaterfallContainer>\n );\n};\n\nconst StackedBar = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'animated',\n})<{ animated: boolean }>(({ theme, animated }) => ({\n display: 'flex',\n width: '100%',\n height: 40,\n borderRadius: theme.shape.borderRadius,\n overflow: 'hidden',\n boxShadow: theme.shadows[2],\n ...(animated && {\n '& > div': {\n animation: 'expandWidth 0.8s ease',\n },\n '@keyframes expandWidth': {\n from: { width: 0 },\n to: { width: '100%' },\n },\n }),\n}));\n\nconst StackedSegment = styled(Box, {\n shouldForwardProp: (prop) => !['phaseColor', 'width'].includes(prop as string),\n})<{ phaseColor: string; width: number }>(({ phaseColor, width }) => ({\n width: `${width}%`,\n background: `linear-gradient(135deg, ${phaseColor} 0%, ${alpha(phaseColor, 0.85)} 100%)`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '#fff',\n fontSize: '0.7rem',\n fontWeight: 600,\n position: 'relative',\n transition: 'all 0.3s ease',\n '&:hover': {\n filter: 'brightness(1.1)',\n zIndex: 1,\n },\n}));\n\nexport const StackedView: FC<TimingViewProps> = ({\n phases,\n percentages,\n data,\n animated,\n showLabels,\n showTooltips,\n}) => (\n <Box data-variant=\"stacked\">\n <StackedBar animated={animated} data-animated={animated.toString()}>\n {phases.map((phase) => {\n const width = widthOf(percentages, phase);\n\n return withTooltip(\n phase,\n showTooltips,\n <StackedSegment\n key={phase.key}\n data-testid={`timing-segment-${phase.key}`}\n phaseColor={colorOf(phase)}\n width={width}\n style={{ width: `${width}%` }}\n >\n {showLabels && width > 10 && (\n <span data-testid=\"timing-label\">{formatTime(phase.value!)}</span>\n )}\n </StackedSegment>,\n );\n })}\n </StackedBar>\n <Box sx={{ display: 'flex', justifyContent: 'space-between', mt: 1 }}>\n <Typography variant=\"caption\" color=\"text.secondary\">\n 0ms\n </Typography>\n <Typography variant=\"caption\" color=\"text.secondary\" fontWeight=\"bold\">\n Total: {formatTime(data.total)}\n </Typography>\n </Box>\n </Box>\n);\n\nconst HorizontalBar = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n gap: theme.spacing(1),\n marginTop: theme.spacing(2),\n}));\n\nconst HorizontalSegment = styled(Box, {\n shouldForwardProp: (prop) => !['phaseColor', 'width', 'animated'].includes(prop as string),\n})<{\n phaseColor: string;\n width: number;\n animated: boolean;\n}>(({ theme, phaseColor, animated }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2),\n '& .label': {\n minWidth: 80,\n fontSize: '0.85rem',\n fontWeight: 500,\n color: theme.palette.text.secondary,\n },\n '& .bar': {\n flex: 1,\n height: 24,\n borderRadius: theme.shape.borderRadius,\n background: `linear-gradient(90deg, ${phaseColor} 0%, ${alpha(phaseColor, 0.7)} 100%)`,\n position: 'relative',\n overflow: 'hidden',\n boxShadow: `0 2px 6px ${alpha(phaseColor, 0.25)}`,\n ...(animated && {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n background: `linear-gradient(90deg, transparent 0%, ${alpha('#fff', 0.3)} 50%, transparent 100%)`,\n animation: 'shimmer 2s infinite',\n },\n '@keyframes shimmer': {\n from: { transform: 'translateX(-100%)' },\n to: { transform: 'translateX(100%)' },\n },\n }),\n },\n '& .value': {\n minWidth: 60,\n textAlign: 'right',\n fontSize: '0.85rem',\n fontWeight: 600,\n color: phaseColor,\n },\n}));\n\nexport const HorizontalView: FC<TimingViewProps> = ({\n phases,\n percentages,\n data,\n animated,\n}) => {\n const theme = useTheme();\n\n return (\n <HorizontalBar data-variant=\"horizontal\">\n {phases.map((phase) => (\n <HorizontalSegment\n key={phase.key}\n data-testid={`timing-segment-${phase.key}`}\n phaseColor={colorOf(phase)}\n width={widthOf(percentages, phase)}\n animated={animated}\n data-animated={animated.toString()}\n >\n <Typography className=\"label\">{phase.label}</Typography>\n <Box className=\"bar\" style={{ width: `${percentages[phase.key]}%` }} />\n <Typography className=\"value\" data-testid=\"timing-label\">\n {formatTime(phase.value!)}\n </Typography>\n </HorizontalSegment>\n ))}\n <Box sx={{ mt: 2, pt: 2, borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}` }}>\n <Typography variant=\"body2\" fontWeight=\"bold\" color=\"primary\">\n Total Time: {formatTime(data.total)}\n </Typography>\n </Box>\n </HorizontalBar>\n );\n};\n"],"mappings":"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","names":["alpha","Box","styled","Typography","jsx","jsxs","styled","alpha","Box","Typography"]}
1	+ {"version":3,"sources":["../../src/components/data-display/TimingDiagram/TimingDiagram.tsx","../../src/components/data-display/TimingDiagram/TimingDiagram.views.tsx"],"sourcesContent":["import { alpha, Box, Paper, styled, Typography } from '@mui/material';\nimport type { FC } from 'react';\nimport React, { useMemo } from 'react';\n\nimport type { TimingData, TimingDiagramProps } from './TimingDiagram.types';\nimport type { Phase, PhaseKey, TimingViewProps } from './TimingDiagram.views';\nimport {\n HorizontalView,\n phaseColors,\n StackedView,\n WaterfallView,\n} from './TimingDiagram.views';\n\n// Styled components\nconst DiagramContainer = styled(Paper)(({ theme }) => ({\n padding: theme.spacing(3),\n background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.9)} 0%, ${alpha(theme.palette.background.paper, 0.8)} 100%)`,\n backdropFilter: 'blur(10px)',\n WebkitBackdropFilter: 'blur(10px)',\n border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n borderRadius: theme.shape.borderRadius * 2,\n}));\n\nconst Legend = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexWrap: 'wrap',\n gap: theme.spacing(2),\n marginTop: theme.spacing(2),\n paddingTop: theme.spacing(2),\n borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n}));\n\nconst LegendItem = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(1),\n '& .color': {\n width: 12,\n height: 12,\n borderRadius: 2,\n },\n '& .label': {\n fontSize: '0.8rem',\n color: theme.palette.text.secondary,\n },\n}));\n\n// Helper functions\nconst calculatePercentages = (data: TimingData): Record<string, number> => {\n const total = data.total \|\| 1;\n return {\n dns: ((data.dns \|\| 0) / total) * 100,\n connect: ((data.connect \|\| 0) / total) * 100,\n ssl: ((data.ssl \|\| 0) / total) * 100,\n request: ((data.request \|\| 0) / total) * 100,\n response: ((data.response \|\| 0) / total) * 100,\n };\n};\n\n// A phase with no recorded time never happened — an HTTP request has no SSL\n// handshake, for instance — so it gets no bar and no legend entry.\nconst phasesOf = (data: TimingData): Phase[] =>\n [\n { key: 'dns', label: 'DNS Lookup', value: data.dns },\n { key: 'connect', label: 'Connection', value: data.connect },\n { key: 'ssl', label: 'SSL/TLS', value: data.ssl },\n { key: 'request', label: 'Request', value: data.request },\n { key: 'response', label: 'Response', value: data.response },\n ].filter((phase) => phase.value !== undefined && phase.value > 0);\n\nconst VIEWS: Record<string, FC<TimingViewProps>> = {\n waterfall: WaterfallView,\n stacked: StackedView,\n horizontal: HorizontalView,\n};\n\n// Main component\nexport const TimingDiagram: FC<TimingDiagramProps> = ({\n copy,\n data,\n showLabels = true,\n height = 40,\n animated = true,\n showTooltips = true,\n variant = 'waterfall',\n}) => {\n const percentages = useMemo(() => calculatePercentages(data), [data]);\n const phases = phasesOf(data);\n const View = VIEWS[variant];\n\n return (\n <DiagramContainer elevation={2} role=\"region\" aria-label={copy.regionLabel} tabIndex={0}>\n <Typography variant=\"h6\" fontWeight=\"bold\" gutterBottom>\n {copy.heading}\n </Typography>\n\n {View && (\n <View\n phases={phases}\n percentages={percentages}\n data={data}\n animated={animated}\n showLabels={showLabels}\n showTooltips={showTooltips}\n height={height}\n />\n )}\n\n {showLabels && (\n <Legend>\n {phases.map((phase) => (\n <LegendItem key={phase.key}>\n <Box\n className=\"color\"\n sx={{ backgroundColor: phaseColors[phase.key as PhaseKey] }}\n />\n <Typography className=\"label\">{phase.label}</Typography>\n </LegendItem>\n ))}\n </Legend>\n )}\n </DiagramContainer>\n );\n};\n\n// Export default\nexport default TimingDiagram;\n","import { alpha, Box, styled, Tooltip, Typography, useTheme } from '@mui/material';\nimport type { FC, ReactElement } from 'react';\nimport React from 'react';\n\nimport type { TimingData } from './TimingDiagram.types';\n\n// Color configurations\nexport const phaseColors = {\n dns: '#9C27B0', // Purple\n connect: '#2196F3', // Blue\n ssl: '#00BCD4', // Cyan\n request: '#4CAF50', // Green\n response: '#FF9800', // Orange\n};\n\nexport type PhaseKey = keyof typeof phaseColors;\n\nexport interface Phase {\n key: string;\n label: string;\n value?: number;\n}\n\nexport interface TimingViewProps {\n phases: Phase[];\n percentages: Record<string, number>;\n data: TimingData;\n animated: boolean;\n showLabels: boolean;\n showTooltips: boolean;\n height: number;\n}\n\nexport const formatTime = (ms: number): string => {\n if (ms < 1000) return `${ms}ms`;\n return `${(ms / 1000).toFixed(2)}s`;\n};\n\nconst colorOf = (phase: Phase): string => phaseColors[phase.key as PhaseKey];\nconst widthOf = (percentages: Record<string, number>, phase: Phase): number =>\n percentages[phase.key] ?? 0;\n\n// Waterfall and stacked both offer the same hover explanation of a segment; only\n// whether tooltips are on at all varies.\nconst withTooltip = (\n phase: Phase,\n enabled: boolean,\n element: ReactElement,\n): ReactElement =>\n enabled ? (\n <Tooltip\n key={phase.key}\n title={`${phase.label}: ${formatTime(phase.value!)}`}\n placement=\"top\"\n role=\"tooltip\"\n aria-describedby={`tooltip-${phase.key}`}\n >\n {element}\n </Tooltip>\n ) : (\n element\n );\n\nconst WaterfallContainer = styled(Box)(({ theme }) => ({\n position: 'relative',\n width: '100%',\n marginTop: theme.spacing(2),\n}));\n\nconst WaterfallBar = styled(Box, {\n shouldForwardProp: (prop) =>\n !['phaseColor', 'offset', 'width', 'animated'].includes(prop as string),\n})<{\n phaseColor: string;\n offset: number;\n width: number;\n animated: boolean;\n}>(({ theme, phaseColor, offset, width, animated }) => ({\n position: 'absolute',\n height: 32,\n left: `${offset}%`,\n width: `${width}%`,\n background: `linear-gradient(90deg, ${phaseColor} 0%, ${alpha(phaseColor, 0.8)} 100%)`,\n borderRadius: theme.shape.borderRadius,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: theme.palette.getContrastText(phaseColor),\n fontSize: '0.75rem',\n fontWeight: 500,\n boxShadow: `0 2px 8px ${alpha(phaseColor, 0.3)}`,\n transition: animated ? 'all 0.5s ease' : 'none',\n animation: animated ? 'slideIn 0.5s ease' : 'none',\n '@keyframes slideIn': {\n from: {\n transform: 'translateX(-20px)',\n opacity: 0,\n },\n to: {\n transform: 'translateX(0)',\n opacity: 1,\n },\n },\n '&:hover': {\n transform: 'translateY(-2px)',\n boxShadow: `0 4px 12px ${alpha(phaseColor, 0.5)}`,\n zIndex: 10,\n },\n}));\n\nconst TimelineAxis = styled(Box)(({ theme }) => ({\n display: 'flex',\n justifyContent: 'space-between',\n marginTop: theme.spacing(1),\n paddingTop: theme.spacing(1),\n borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n}));\n\nconst TimeLabel = styled(Typography)(({ theme }) => ({\n fontSize: '0.7rem',\n color: theme.palette.text.secondary,\n fontWeight: 500,\n}));\n\nexport const WaterfallView: FC<TimingViewProps> = ({\n phases,\n percentages,\n data,\n animated,\n showLabels,\n showTooltips,\n height,\n}) => {\n // Each bar starts where the previous one ended, so the row reads as a timeline.\n let offset = 0;\n\n return (\n <WaterfallContainer style={{ height: height + 40 }} data-variant=\"waterfall\">\n {phases.map((phase, index) => {\n const width = widthOf(percentages, phase);\n const currentOffset = offset;\n offset += width;\n\n return withTooltip(\n phase,\n showTooltips,\n <WaterfallBar\n key={phase.key}\n data-testid={`timing-segment-${phase.key}`}\n phaseColor={colorOf(phase)}\n offset={currentOffset}\n width={width}\n animated={animated}\n data-animated={animated.toString()}\n style={{\n top: index * 8,\n width: `${width}%`,\n left: `${currentOffset}%`,\n }}\n >\n {showLabels && width > 10 && (\n <span data-testid=\"timing-label\">{formatTime(phase.value!)}</span>\n )}\n </WaterfallBar>,\n );\n })}\n <TimelineAxis style={{ marginTop: height }}>\n <TimeLabel>0ms</TimeLabel>\n <TimeLabel>{formatTime(data.total / 2)}</TimeLabel>\n <TimeLabel>{formatTime(data.total)}</TimeLabel>\n </TimelineAxis>\n </WaterfallContainer>\n );\n};\n\nconst StackedBar = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'animated',\n})<{ animated: boolean }>(({ theme, animated }) => ({\n display: 'flex',\n width: '100%',\n height: 40,\n borderRadius: theme.shape.borderRadius,\n overflow: 'hidden',\n boxShadow: theme.shadows[2],\n ...(animated && {\n '& > div': {\n animation: 'expandWidth 0.8s ease',\n },\n '@keyframes expandWidth': {\n from: { width: 0 },\n to: { width: '100%' },\n },\n }),\n}));\n\nconst StackedSegment = styled(Box, {\n shouldForwardProp: (prop) => !['phaseColor', 'width'].includes(prop as string),\n})<{ phaseColor: string; width: number }>(({ phaseColor, width }) => ({\n width: `${width}%`,\n background: `linear-gradient(135deg, ${phaseColor} 0%, ${alpha(phaseColor, 0.85)} 100%)`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '#fff',\n fontSize: '0.7rem',\n fontWeight: 600,\n position: 'relative',\n transition: 'all 0.3s ease',\n '&:hover': {\n filter: 'brightness(1.1)',\n zIndex: 1,\n },\n}));\n\nexport const StackedView: FC<TimingViewProps> = ({\n phases,\n percentages,\n data,\n animated,\n showLabels,\n showTooltips,\n}) => (\n <Box data-variant=\"stacked\">\n <StackedBar animated={animated} data-animated={animated.toString()}>\n {phases.map((phase) => {\n const width = widthOf(percentages, phase);\n\n return withTooltip(\n phase,\n showTooltips,\n <StackedSegment\n key={phase.key}\n data-testid={`timing-segment-${phase.key}`}\n phaseColor={colorOf(phase)}\n width={width}\n style={{ width: `${width}%` }}\n >\n {showLabels && width > 10 && (\n <span data-testid=\"timing-label\">{formatTime(phase.value!)}</span>\n )}\n </StackedSegment>,\n );\n })}\n </StackedBar>\n <Box sx={{ display: 'flex', justifyContent: 'space-between', mt: 1 }}>\n <Typography variant=\"caption\" color=\"text.secondary\">\n 0ms\n </Typography>\n <Typography variant=\"caption\" color=\"text.secondary\" fontWeight=\"bold\">\n Total: {formatTime(data.total)}\n </Typography>\n </Box>\n </Box>\n);\n\nconst HorizontalBar = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n gap: theme.spacing(1),\n marginTop: theme.spacing(2),\n}));\n\nconst HorizontalSegment = styled(Box, {\n shouldForwardProp: (prop) => !['phaseColor', 'width', 'animated'].includes(prop as string),\n})<{\n phaseColor: string;\n width: number;\n animated: boolean;\n}>(({ theme, phaseColor, animated }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2),\n '& .label': {\n minWidth: 80,\n fontSize: '0.85rem',\n fontWeight: 500,\n color: theme.palette.text.secondary,\n },\n '& .bar': {\n flex: 1,\n height: 24,\n borderRadius: theme.shape.borderRadius,\n background: `linear-gradient(90deg, ${phaseColor} 0%, ${alpha(phaseColor, 0.7)} 100%)`,\n position: 'relative',\n overflow: 'hidden',\n boxShadow: `0 2px 6px ${alpha(phaseColor, 0.25)}`,\n ...(animated && {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n background: `linear-gradient(90deg, transparent 0%, ${alpha('#fff', 0.3)} 50%, transparent 100%)`,\n animation: 'shimmer 2s infinite',\n },\n '@keyframes shimmer': {\n from: { transform: 'translateX(-100%)' },\n to: { transform: 'translateX(100%)' },\n },\n }),\n },\n '& .value': {\n minWidth: 60,\n textAlign: 'right',\n fontSize: '0.85rem',\n fontWeight: 600,\n color: phaseColor,\n },\n}));\n\nexport const HorizontalView: FC<TimingViewProps> = ({\n phases,\n percentages,\n data,\n animated,\n}) => {\n const theme = useTheme();\n\n return (\n <HorizontalBar data-variant=\"horizontal\">\n {phases.map((phase) => (\n <HorizontalSegment\n key={phase.key}\n data-testid={`timing-segment-${phase.key}`}\n phaseColor={colorOf(phase)}\n width={widthOf(percentages, phase)}\n animated={animated}\n data-animated={animated.toString()}\n >\n <Typography className=\"label\">{phase.label}</Typography>\n <Box className=\"bar\" style={{ width: `${percentages[phase.key]}%` }} />\n <Typography className=\"value\" data-testid=\"timing-label\">\n {formatTime(phase.value!)}\n </Typography>\n </HorizontalSegment>\n ))}\n <Box sx={{ mt: 2, pt: 2, borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}` }}>\n <Typography variant=\"body2\" fontWeight=\"bold\" color=\"primary\">\n Total Time: {formatTime(data.total)}\n </Typography>\n </Box>\n </HorizontalBar>\n );\n};\n"],"mappings":"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","names":["alpha","Box","styled","Typography","jsx","jsxs","styled","alpha","Box","Typography"]}

package/dist/en-US.js ADDED Viewed

@@ -0,0 +1,56 @@
+import {
+  EN_US_ADDRESS_AUTOCOMPLETE_COPY,
+  EN_US_AUTOCOMPLETE_COPY,
+  EN_US_BREADCRUMB_COPY,
+  EN_US_CAROUSEL_COPY,
+  EN_US_CATEGORY_SELECT_COPY,
+  EN_US_CEP_FIELD_COPY,
+  EN_US_CHROME_COPY,
+  EN_US_CODE_EDITOR_COPY,
+  EN_US_COMMAND_PALETTE_COPY,
+  EN_US_CONFIRM_ACTION_COPY,
+  EN_US_DATA_STATE_COPY,
+  EN_US_DATA_VIEWS_COPY,
+  EN_US_INSTALL_PROMPT_COPY,
+  EN_US_LIGHTBOX_COPY,
+  EN_US_MAP_PREVIEW_COPY,
+  EN_US_PASSWORD_STRENGTH_COPY,
+  EN_US_PHONE_INPUT_COPY,
+  EN_US_RICH_EDITOR_TOOLBAR_COPY,
+  EN_US_SAVED_VIEWS_LABELS,
+  EN_US_SECTION_ONBOARDING_COPY,
+  EN_US_TABLE_FILTER_COPY,
+  EN_US_TIMING_DIAGRAM_COPY,
+  EN_US_TUTORIAL_COPY,
+  EN_US_UPLOAD_BUTTON_COPY,
+  EN_US_USER_AVATAR_COPY
+} from "./chunk-AL3W7TXN.js";
+import "./chunk-PZ5AY32C.js";
+export {
+  EN_US_ADDRESS_AUTOCOMPLETE_COPY,
+  EN_US_AUTOCOMPLETE_COPY,
+  EN_US_BREADCRUMB_COPY,
+  EN_US_CAROUSEL_COPY,
+  EN_US_CATEGORY_SELECT_COPY,
+  EN_US_CEP_FIELD_COPY,
+  EN_US_CHROME_COPY,
+  EN_US_CODE_EDITOR_COPY,
+  EN_US_COMMAND_PALETTE_COPY,
+  EN_US_CONFIRM_ACTION_COPY,
+  EN_US_DATA_STATE_COPY,
+  EN_US_DATA_VIEWS_COPY,
+  EN_US_INSTALL_PROMPT_COPY,
+  EN_US_LIGHTBOX_COPY,
+  EN_US_MAP_PREVIEW_COPY,
+  EN_US_PASSWORD_STRENGTH_COPY,
+  EN_US_PHONE_INPUT_COPY,
+  EN_US_RICH_EDITOR_TOOLBAR_COPY,
+  EN_US_SAVED_VIEWS_LABELS,
+  EN_US_SECTION_ONBOARDING_COPY,
+  EN_US_TABLE_FILTER_COPY,
+  EN_US_TIMING_DIAGRAM_COPY,
+  EN_US_TUTORIAL_COPY,
+  EN_US_UPLOAD_BUTTON_COPY,
+  EN_US_USER_AVATAR_COPY
+};
+//# sourceMappingURL=en-US.js.map

package/dist/en-US.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/feedback/Sonner.js CHANGED Viewed

@@ -118,6 +118,7 @@ var SonnerToast = ({
   type = "default",
   variant = "default",
   closable = true,
+  dismissLabel,
   action,
   cancel,
   icon,
@@ -163,7 +164,7 @@ var SonnerToast = ({
           {
             size: "small",
             onClick: handleDismiss,
-            "aria-label": "Dismiss notification",
+            "aria-label": dismissLabel,
             sx: {
               ml: "auto",
               color: "text.secondary",
@@ -209,7 +210,7 @@ var trackPromiseWithToasts = async (promiseToResolve, options, toasts) => {
     throw err;
   }
 };
-var SonnerProvider = ({ children }) => {
+var SonnerProvider = ({ children, dismissLabel }) => {
   const [toasts, setToasts] = useState([]);
   const toastCounter = useRef(0);
   const dismiss = useCallback((id) => {
@@ -231,7 +232,7 @@ var SonnerProvider = ({ children }) => {
     [dismiss]
   );
   const makeShortcut = useCallback(
-    (type, extra) => (message, options) => addToast({ ...options, ...extra, title: message }, type),
+    (type, extra) => (message, options) => addToast({ dismissLabel, ...options, ...extra, title: message }, type),
     [addToast]
   );
   const toast2 = useMemo(() => makeShortcut("default"), [makeShortcut]);
@@ -389,7 +390,7 @@ var createToastInstance = () => {
   return methods;
 };
 var toast = createToastInstance();
-var Toaster = ({ children }) => /* @__PURE__ */ jsx2(SonnerProvider, { children });
+var Toaster = ({ children, dismissLabel }) => /* @__PURE__ */ jsx2(SonnerProvider, { dismissLabel, children });
 export {
   SonnerProvider,
   Toaster,

package/dist/feedback/Sonner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/components/feedback/Sonner/Sonner.tsx","../../src/components/feedback/Sonner/SonnerToast.tsx"],"sourcesContent":["import {\n Box,\n Portal } from '@mui/material';\nimport React, { createContext, useCallback, useContext, useRef,useState, useMemo } from 'react';\n\nimport type { SonnerContextType, SonnerItem,SonnerProps } from './Sonner.types';\n\nconst SonnerContext = createContext<SonnerContextType \| null>(null);\n\nconst DEFAULT_DURATION_MS = 4000;\n\nconst buildToastItem = (\n toast: Omit<SonnerProps, 'id'>,\n id: string,\n type?: SonnerProps['type'],\n): SonnerItem => ({\n ...toast,\n id,\n type: type \|\| toast.type \|\| 'default',\n createdAt: Date.now(),\n visible: true });\n\n// Persistent toasts and `duration: 0` stay until dismissed explicitly.\nconst scheduleAutoDismiss = (\n toast: Omit<SonnerProps, 'id'>,\n id: string,\n dismiss: (id?: string) => void,\n) => {\n if (toast.persistent \|\| toast.duration === 0) return;\n\n window.setTimeout(() => dismiss(id), toast.duration ?? DEFAULT_DURATION_MS);\n};\n\nconst EXIT_TRANSITION_MS = 300;\n\ntype SonnerPromiseOptions<T> = {\n loading: React.ReactNode;\n success: React.ReactNode \| ((data: T) => React.ReactNode);\n error: React.ReactNode \| ((error: Error) => React.ReactNode);\n};\n\nconst resolveMessage = <T,>(\n message: React.ReactNode \| ((value: T) => React.ReactNode),\n value: T,\n): React.ReactNode => (typeof message === 'function' ? message(value) : message);\n\n// Shows a pinned loading toast for the life of a promise, then swaps it for a\n// success or error one. Takes the shortcuts it needs rather than reaching for\n// context, so it is testable on its own.\nconst trackPromiseWithToasts = async <T,>(\n promiseToResolve: Promise<T>,\n options: SonnerPromiseOptions<T>,\n toasts: {\n loading: (message: React.ReactNode) => string;\n success: (message: React.ReactNode) => string;\n error: (message: React.ReactNode) => string;\n dismiss: (id?: string) => void;\n },\n): Promise<T> => {\n const toastId = toasts.loading(options.loading);\n\n try {\n const data = await promiseToResolve;\n toasts.dismiss(toastId);\n toasts.success(resolveMessage(options.success, data));\n return data;\n } catch (err) {\n toasts.dismiss(toastId);\n toasts.error(resolveMessage(options.error, err instanceof Error ? err : new Error(String(err))));\n throw err;\n }\n};\n\nexport const SonnerProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n const [toasts, setToasts] = useState<SonnerItem[]>([]);\n const toastCounter = useRef(0);\n\n // Hide first, then drop after the exit transition. Passing no id targets every\n // toast; the two branches only differ in which toasts they match, so that is\n // the only thing that varies here.\n const dismiss = useCallback((id?: string) => {\n const matches = (toast: SonnerItem) => id === undefined \|\| toast.id === id;\n\n setToasts((prev) =>\n prev.map((toast) => (matches(toast) ? { ...toast, visible: false } : toast)),\n );\n\n window.setTimeout(() => {\n setToasts((prev) => prev.filter((toast) => !matches(toast)));\n }, EXIT_TRANSITION_MS);\n }, []);\n\n const addToast = useCallback(\n (toast: Omit<SonnerProps, 'id'>, type?: SonnerProps['type']): string => {\n const id = `sonner-${++toastCounter.current}`;\n setToasts((prev) => [...prev, buildToastItem(toast, id, type)]);\n scheduleAutoDismiss(toast, id, dismiss);\n return id;\n },\n [dismiss],\n );\n\n // The six shortcuts differ only by the type they tag and, for loading, by\n // pinning persistent. Built from one factory rather than six near-identical\n // useCallback blocks.\n const makeShortcut = useCallback(\n (type: SonnerProps['type'], extra?: Partial<SonnerProps>) =>\n (message: React.ReactNode, options?: Partial<SonnerProps>) =>\n addToast({ ...options, ...extra, title: message }, type),\n [addToast],\n );\n\n const toast = useMemo(() => makeShortcut('default'), [makeShortcut]);\n const success = useMemo(() => makeShortcut('success'), [makeShortcut]);\n const error = useMemo(() => makeShortcut('error'), [makeShortcut]);\n const warning = useMemo(() => makeShortcut('warning'), [makeShortcut]);\n const info = useMemo(() => makeShortcut('info'), [makeShortcut]);\n const loading = useMemo(\n () => makeShortcut('loading', { persistent: true }),\n [makeShortcut],\n );\n\n const promise = useCallback(\n <T,>(promiseToResolve: Promise<T>, options: SonnerPromiseOptions<T>): Promise<T> =>\n trackPromiseWithToasts(promiseToResolve, options, { loading, success, error, dismiss }),\n [loading, success, error, dismiss],\n );\n\n const contextValue: SonnerContextType = {\n toast,\n success,\n error,\n warning,\n info,\n loading,\n dismiss,\n promise };\n\n // Register this context globally for imperative API\n useRegisterGlobalToast(contextValue);\n\n return (\n <SonnerContext.Provider value={contextValue}>\n {children}\n <SonnerToaster toasts={toasts} onDismiss={dismiss} />\n </SonnerContext.Provider>\n );\n};\n\nexport const useSonner = (): SonnerContextType => {\n const context = useContext(SonnerContext);\n if (!context) {\n throw new Error('useSonner must be used within a SonnerProvider');\n }\n return context;\n};\n\n// A caller-supplied icon always wins; otherwise the type picks one.\nimport { SonnerToast } from './SonnerToast';\n\nconst SonnerToaster: React.FC<{\n toasts: SonnerItem[];\n onDismiss: (id: string) => void;\n}> = ({ toasts, onDismiss }) => {\n // Limit visible toasts to prevent overflow\n const MAX_VISIBLE_TOASTS = 5;\n const visibleToasts = toasts.slice(-MAX_VISIBLE_TOASTS);\n const hiddenCount = Math.max(0, toasts.length - MAX_VISIBLE_TOASTS);\n\n return (\n <Portal>\n <Box\n sx={{\n position: 'fixed',\n top: 16,\n right: 16,\n zIndex: 9999,\n display: 'flex',\n flexDirection: 'column',\n pointerEvents: 'none',\n maxHeight: 'calc(100vh - 32px)',\n overflowY: 'auto',\n overflowX: 'hidden' }}\n >\n {hiddenCount > 0 && (\n <Box\n sx={{\n p: 1,\n mb: 0.5,\n textAlign: 'center',\n fontSize: '0.75rem',\n color: 'text.secondary',\n pointerEvents: 'none' }}\n >\n +{hiddenCount} more\n </Box>\n )}\n {visibleToasts.map((toast) => (\n <Box key={toast.id} sx={{ pointerEvents: 'auto' }}>\n <SonnerToast {...toast} onDismiss={onDismiss} />\n </Box>\n ))}\n </Box>\n </Portal>\n );\n};\n\n// Global toast instance for imperative API\nlet globalToastContext: SonnerContextType \| null = null;\n\n// Hook to register the global context (used internally by SonnerProvider)\nexport const useRegisterGlobalToast = (context: SonnerContextType) => {\n React.useEffect(() => {\n globalToastContext = context;\n return () => {\n globalToastContext = null;\n };\n }, [context]);\n};\n\n// Create a production-ready toast instance for imperative usage\nconst createToastInstance = (): SonnerContextType => {\n const warnNoProvider = () => {\n // Use a more React-appropriate warning mechanism\n if (typeof window !== 'undefined' && window.console && window.console.warn) {\n window.console.warn('Sonner: No SonnerProvider found. Please wrap your app with SonnerProvider.');\n }\n };\n\n const methods: SonnerContextType = {\n toast: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.toast(message, options);\n },\n success: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.success(message, options);\n },\n error: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.error(message, options);\n },\n warning: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.warning(message, options);\n },\n info: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.info(message, options);\n },\n loading: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.loading(message, options);\n },\n dismiss: (id?: string) => {\n if (!globalToastContext) {\n warnNoProvider();\n return;\n }\n globalToastContext.dismiss(id);\n },\n promise: async <T,>(\n promiseToResolve: Promise<T>,\n options: {\n loading: React.ReactNode;\n success: React.ReactNode \| ((data: T) => React.ReactNode);\n error: React.ReactNode \| ((error: Error) => React.ReactNode);\n },\n ): Promise<T> => {\n if (!globalToastContext) {\n warnNoProvider();\n throw new Error('No SonnerProvider found');\n }\n return globalToastContext.promise(promiseToResolve, options);\n } };\n\n return methods;\n};\n\n// Export toast instance for imperative API usage\nexport const toast = createToastInstance();\n\n// Export Toaster as alias for SonnerProvider for stories compatibility\nexport const Toaster: React.FC<{\n children?: React.ReactNode;\n position?: string;\n theme?: string;\n expand?: boolean;\n richColors?: boolean;\n closeButton?: boolean;\n}> = ({ children }) => <SonnerProvider>{children}</SonnerProvider>;\n","import SuccessIcon from '@mui/icons-material/CheckCircle';\nimport CloseIcon from '@mui/icons-material/Close';\nimport ErrorIcon from '@mui/icons-material/Error';\nimport InfoIcon from '@mui/icons-material/Info';\nimport WarningIcon from '@mui/icons-material/Warning';\nimport {\n alpha,\n Box,\n Button,\n CircularProgress,\n Collapse,\n IconButton,\n Typography,\n useTheme,\n} from '@mui/material';\nimport type { CSSObject, Theme } from '@mui/material';\nimport React from 'react';\n\nimport type { SonnerItem } from './Sonner.types';\nimport type { SonnerProps } from './Sonner.types';\n\nconst renderToastIcon = (icon: SonnerProps['icon'], type: SonnerProps['type']) => {\n if (icon) return icon;\n\n switch (type) {\n case 'success':\n return <SuccessIcon sx={{ fontSize: 20, color: 'success.main' }} />;\n case 'error':\n return <ErrorIcon sx={{ fontSize: 20, color: 'error.main' }} />;\n case 'warning':\n return <WarningIcon sx={{ fontSize: 20, color: 'warning.main' }} />;\n case 'info':\n return <InfoIcon sx={{ fontSize: 20, color: 'info.main' }} />;\n case 'loading':\n return <CircularProgress size={16} />;\n default:\n return null;\n }\n};\n\n// Errors and toasts flagged important interrupt the screen reader; the rest wait\n// for the next pause. Computed once instead of duplicating the same condition\n// across the role and aria-live attributes.\nconst resolveToastAnnouncement = (important: boolean, type: SonnerProps['type']) => {\n const interrupts = important \|\| type === 'error';\n\n return {\n role: interrupts ? 'alert' : 'status',\n live: (interrupts ? 'assertive' : 'polite') as 'assertive' \| 'polite',\n };\n};\n\nconst buildToastStyles = (\n theme: Theme,\n variant: SonnerProps['variant'],\n visible: boolean,\n): CSSObject => {\n const baseStyles: CSSObject = {\n borderRadius: theme.spacing(1.5),\n border: `1px solid ${theme.palette.divider}`,\n backgroundColor: theme.palette.background.paper,\n boxShadow: theme.shadows[4],\n transition: theme.transitions.create(['all', 'transform', 'opacity'], {\n duration: theme.transitions.duration.short,\n }),\n transform: visible ? 'scale(1)' : 'scale(0.95)',\n opacity: visible ? 1 : 0,\n };\n\n switch (variant) {\n case 'glass':\n return {\n ...baseStyles,\n backgroundColor: alpha(theme.palette.background.paper, 0.1),\n backdropFilter: 'blur(20px)',\n border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n boxShadow: `0 8px 32px ${alpha(theme.palette.common.black, 0.1)}`,\n };\n\n case 'minimal':\n return {\n ...baseStyles,\n backgroundColor: theme.palette.background.default,\n border: 'none',\n boxShadow: 'none',\n borderLeft: `4px solid ${theme.palette.primary.main}`,\n borderRadius: 0,\n };\n\n default:\n return baseStyles;\n }\n};\n\n// Title, description and the optional action row. Split out so the toast shell\n// keeps only its own concerns — announcement, styling and dismissal.\nconst ToastContent: React.FC<{\n title?: SonnerProps['title'];\n description?: SonnerProps['description'];\n important: boolean;\n action?: SonnerProps['action'];\n cancel?: SonnerProps['cancel'];\n}> = ({ title, description, important, action, cancel }) => (\n <Box sx={{ flex: 1, minWidth: 0 }}>\n {title && (\n <Typography\n variant=\"body2\"\n sx={{\n fontWeight: important ? 600 : 500,\n color: 'text.primary',\n mb: description ? 0.5 : 0,\n }}\n >\n {title}\n </Typography>\n )}\n\n {description && (\n <Typography variant=\"body2\" sx={{ color: 'text.secondary', fontSize: '0.875rem' }}>\n {description}\n </Typography>\n )}\n\n {(action \|\| cancel) && (\n <Box sx={{ display: 'flex', gap: 1, mt: 1.5 }}>\n {action && (\n <ToastActionButton action={action} buttonVariant=\"contained\" />\n )}\n {cancel && <ToastActionButton action={cancel} buttonVariant=\"outlined\" />}\n </Box>\n )}\n </Box>\n);\n\nconst ToastActionButton: React.FC<{\n action: NonNullable<SonnerProps['action']>;\n buttonVariant: 'contained' \| 'outlined';\n}> = ({ action, buttonVariant }) => (\n <Button\n size=\"small\"\n onClick={action.onClick}\n variant={buttonVariant}\n sx={{ fontSize: '0.75rem', py: 0.5, px: 1.5 }}\n >\n {action.label}\n </Button>\n);\n\nexport const SonnerToast: React.FC<SonnerItem & { onDismiss: (id: string) => void }> = ({\n id,\n title,\n description,\n type = 'default',\n variant = 'default',\n closable = true,\n action,\n cancel,\n icon,\n important = false,\n visible,\n onDismiss,\n}) => {\n const theme = useTheme();\n const announcement = resolveToastAnnouncement(important, type);\n\n const handleDismiss = () => {\n onDismiss(id);\n };\n\n return (\n <Collapse in={visible} timeout={200}>\n <Box\n role={announcement.role}\n aria-live={announcement.live}\n aria-atomic=\"true\"\n sx={{\n ...buildToastStyles(theme, variant, visible),\n p: 2,\n mb: 1,\n minWidth: 356,\n maxWidth: 400,\n display: 'flex',\n alignItems: 'flex-start',\n gap: 1.5,\n }}\n >\n {renderToastIcon(icon, type)}\n\n <ToastContent\n title={title}\n description={description}\n important={important}\n action={action}\n cancel={cancel}\n />\n\n {closable && (\n <IconButton\n size=\"small\"\n onClick={handleDismiss}\n aria-label=\"Dismiss notification\"\n sx={{\n ml: 'auto',\n color: 'text.secondary',\n '&:hover': {\n backgroundColor: 'action.hover',\n },\n }}\n >\n <CloseIcon fontSize=\"small\" />\n </IconButton>\n )}\n </Box>\n </Collapse>\n );\n};\n"],"mappings":"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","names":["Box","jsx","jsxs","toast","Box"]}
1	+ {"version":3,"sources":["../../src/components/feedback/Sonner/Sonner.tsx","../../src/components/feedback/Sonner/SonnerToast.tsx"],"sourcesContent":["import {\n Box,\n Portal } from '@mui/material';\nimport React, { createContext, useCallback, useContext, useRef,useState, useMemo } from 'react';\n\nimport type { SonnerContextType, SonnerItem,SonnerProps } from './Sonner.types';\n\nconst SonnerContext = createContext<SonnerContextType \| null>(null);\n\nconst DEFAULT_DURATION_MS = 4000;\n\nconst buildToastItem = (\n toast: Omit<SonnerProps, 'id'>,\n id: string,\n type?: SonnerProps['type'],\n): SonnerItem => ({\n ...toast,\n id,\n type: type \|\| toast.type \|\| 'default',\n createdAt: Date.now(),\n visible: true });\n\n// Persistent toasts and `duration: 0` stay until dismissed explicitly.\nconst scheduleAutoDismiss = (\n toast: Omit<SonnerProps, 'id'>,\n id: string,\n dismiss: (id?: string) => void,\n) => {\n if (toast.persistent \|\| toast.duration === 0) return;\n\n window.setTimeout(() => dismiss(id), toast.duration ?? DEFAULT_DURATION_MS);\n};\n\nconst EXIT_TRANSITION_MS = 300;\n\ntype SonnerPromiseOptions<T> = {\n loading: React.ReactNode;\n success: React.ReactNode \| ((data: T) => React.ReactNode);\n error: React.ReactNode \| ((error: Error) => React.ReactNode);\n};\n\nconst resolveMessage = <T,>(\n message: React.ReactNode \| ((value: T) => React.ReactNode),\n value: T,\n): React.ReactNode => (typeof message === 'function' ? message(value) : message);\n\n// Shows a pinned loading toast for the life of a promise, then swaps it for a\n// success or error one. Takes the shortcuts it needs rather than reaching for\n// context, so it is testable on its own.\nconst trackPromiseWithToasts = async <T,>(\n promiseToResolve: Promise<T>,\n options: SonnerPromiseOptions<T>,\n toasts: {\n loading: (message: React.ReactNode) => string;\n success: (message: React.ReactNode) => string;\n error: (message: React.ReactNode) => string;\n dismiss: (id?: string) => void;\n },\n): Promise<T> => {\n const toastId = toasts.loading(options.loading);\n\n try {\n const data = await promiseToResolve;\n toasts.dismiss(toastId);\n toasts.success(resolveMessage(options.success, data));\n return data;\n } catch (err) {\n toasts.dismiss(toastId);\n toasts.error(resolveMessage(options.error, err instanceof Error ? err : new Error(String(err))));\n throw err;\n }\n};\n\nexport const SonnerProvider: React.FC<{\n children: React.ReactNode;\n /*\n The dismiss button's accessible name, for every toast this provider\n * raises. REQUIRED and mounted ONCE — the shortcut helpers\n * (`sonner.success(…)`) take a message and nothing else by design, so the\n * word cannot be a per-call argument without changing what they are for.\n */\n dismissLabel: string;\n}> = ({ children, dismissLabel }) => {\n const [toasts, setToasts] = useState<SonnerItem[]>([]);\n const toastCounter = useRef(0);\n\n // Hide first, then drop after the exit transition. Passing no id targets every\n // toast; the two branches only differ in which toasts they match, so that is\n // the only thing that varies here.\n const dismiss = useCallback((id?: string) => {\n const matches = (toast: SonnerItem) => id === undefined \|\| toast.id === id;\n\n setToasts((prev) =>\n prev.map((toast) => (matches(toast) ? { ...toast, visible: false } : toast)),\n );\n\n window.setTimeout(() => {\n setToasts((prev) => prev.filter((toast) => !matches(toast)));\n }, EXIT_TRANSITION_MS);\n }, []);\n\n const addToast = useCallback(\n (toast: Omit<SonnerProps, 'id'>, type?: SonnerProps['type']): string => {\n const id = `sonner-${++toastCounter.current}`;\n setToasts((prev) => [...prev, buildToastItem(toast, id, type)]);\n scheduleAutoDismiss(toast, id, dismiss);\n return id;\n },\n [dismiss],\n );\n\n // The six shortcuts differ only by the type they tag and, for loading, by\n // pinning persistent. Built from one factory rather than six near-identical\n // useCallback blocks.\n const makeShortcut = useCallback(\n (type: SonnerProps['type'], extra?: Partial<SonnerProps>) =>\n (message: React.ReactNode, options?: Partial<SonnerProps>) =>\n addToast({ dismissLabel, ...options, ...extra, title: message }, type),\n [addToast],\n );\n\n const toast = useMemo(() => makeShortcut('default'), [makeShortcut]);\n const success = useMemo(() => makeShortcut('success'), [makeShortcut]);\n const error = useMemo(() => makeShortcut('error'), [makeShortcut]);\n const warning = useMemo(() => makeShortcut('warning'), [makeShortcut]);\n const info = useMemo(() => makeShortcut('info'), [makeShortcut]);\n const loading = useMemo(\n () => makeShortcut('loading', { persistent: true }),\n [makeShortcut],\n );\n\n const promise = useCallback(\n <T,>(promiseToResolve: Promise<T>, options: SonnerPromiseOptions<T>): Promise<T> =>\n trackPromiseWithToasts(promiseToResolve, options, { loading, success, error, dismiss }),\n [loading, success, error, dismiss],\n );\n\n const contextValue: SonnerContextType = {\n toast,\n success,\n error,\n warning,\n info,\n loading,\n dismiss,\n promise };\n\n // Register this context globally for imperative API\n useRegisterGlobalToast(contextValue);\n\n return (\n <SonnerContext.Provider value={contextValue}>\n {children}\n <SonnerToaster toasts={toasts} onDismiss={dismiss} />\n </SonnerContext.Provider>\n );\n};\n\nexport const useSonner = (): SonnerContextType => {\n const context = useContext(SonnerContext);\n if (!context) {\n throw new Error('useSonner must be used within a SonnerProvider');\n }\n return context;\n};\n\n// A caller-supplied icon always wins; otherwise the type picks one.\nimport { SonnerToast } from './SonnerToast';\n\nconst SonnerToaster: React.FC<{\n toasts: SonnerItem[];\n onDismiss: (id: string) => void;\n}> = ({ toasts, onDismiss }) => {\n // Limit visible toasts to prevent overflow\n const MAX_VISIBLE_TOASTS = 5;\n const visibleToasts = toasts.slice(-MAX_VISIBLE_TOASTS);\n const hiddenCount = Math.max(0, toasts.length - MAX_VISIBLE_TOASTS);\n\n return (\n <Portal>\n <Box\n sx={{\n position: 'fixed',\n top: 16,\n right: 16,\n zIndex: 9999,\n display: 'flex',\n flexDirection: 'column',\n pointerEvents: 'none',\n maxHeight: 'calc(100vh - 32px)',\n overflowY: 'auto',\n overflowX: 'hidden' }}\n >\n {hiddenCount > 0 && (\n <Box\n sx={{\n p: 1,\n mb: 0.5,\n textAlign: 'center',\n fontSize: '0.75rem',\n color: 'text.secondary',\n pointerEvents: 'none' }}\n >\n +{hiddenCount} more\n </Box>\n )}\n {visibleToasts.map((toast) => (\n <Box key={toast.id} sx={{ pointerEvents: 'auto' }}>\n <SonnerToast {...toast} onDismiss={onDismiss} />\n </Box>\n ))}\n </Box>\n </Portal>\n );\n};\n\n// Global toast instance for imperative API\nlet globalToastContext: SonnerContextType \| null = null;\n\n// Hook to register the global context (used internally by SonnerProvider)\nexport const useRegisterGlobalToast = (context: SonnerContextType) => {\n React.useEffect(() => {\n globalToastContext = context;\n return () => {\n globalToastContext = null;\n };\n }, [context]);\n};\n\n// Create a production-ready toast instance for imperative usage\nconst createToastInstance = (): SonnerContextType => {\n const warnNoProvider = () => {\n // Use a more React-appropriate warning mechanism\n if (typeof window !== 'undefined' && window.console && window.console.warn) {\n window.console.warn('Sonner: No SonnerProvider found. Please wrap your app with SonnerProvider.');\n }\n };\n\n const methods: SonnerContextType = {\n toast: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.toast(message, options);\n },\n success: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.success(message, options);\n },\n error: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.error(message, options);\n },\n warning: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.warning(message, options);\n },\n info: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.info(message, options);\n },\n loading: (message: React.ReactNode, options?: Partial<SonnerProps>) => {\n if (!globalToastContext) {\n warnNoProvider();\n return 'no-provider';\n }\n return globalToastContext.loading(message, options);\n },\n dismiss: (id?: string) => {\n if (!globalToastContext) {\n warnNoProvider();\n return;\n }\n globalToastContext.dismiss(id);\n },\n promise: async <T,>(\n promiseToResolve: Promise<T>,\n options: {\n loading: React.ReactNode;\n success: React.ReactNode \| ((data: T) => React.ReactNode);\n error: React.ReactNode \| ((error: Error) => React.ReactNode);\n },\n ): Promise<T> => {\n if (!globalToastContext) {\n warnNoProvider();\n throw new Error('No SonnerProvider found');\n }\n return globalToastContext.promise(promiseToResolve, options);\n } };\n\n return methods;\n};\n\n// Export toast instance for imperative API usage\nexport const toast = createToastInstance();\n\n// Export Toaster as alias for SonnerProvider for stories compatibility\nexport const Toaster: React.FC<{\n children?: React.ReactNode;\n position?: string;\n theme?: string;\n expand?: boolean;\n richColors?: boolean;\n closeButton?: boolean;\n dismissLabel: string;\n}> = ({ children, dismissLabel }) => (\n <SonnerProvider dismissLabel={dismissLabel}>{children}</SonnerProvider>\n);\n","import SuccessIcon from '@mui/icons-material/CheckCircle';\nimport CloseIcon from '@mui/icons-material/Close';\nimport ErrorIcon from '@mui/icons-material/Error';\nimport InfoIcon from '@mui/icons-material/Info';\nimport WarningIcon from '@mui/icons-material/Warning';\nimport {\n alpha,\n Box,\n Button,\n CircularProgress,\n Collapse,\n IconButton,\n Typography,\n useTheme,\n} from '@mui/material';\nimport type { CSSObject, Theme } from '@mui/material';\nimport React from 'react';\n\nimport type { SonnerItem } from './Sonner.types';\nimport type { SonnerProps } from './Sonner.types';\n\nconst renderToastIcon = (icon: SonnerProps['icon'], type: SonnerProps['type']) => {\n if (icon) return icon;\n\n switch (type) {\n case 'success':\n return <SuccessIcon sx={{ fontSize: 20, color: 'success.main' }} />;\n case 'error':\n return <ErrorIcon sx={{ fontSize: 20, color: 'error.main' }} />;\n case 'warning':\n return <WarningIcon sx={{ fontSize: 20, color: 'warning.main' }} />;\n case 'info':\n return <InfoIcon sx={{ fontSize: 20, color: 'info.main' }} />;\n case 'loading':\n return <CircularProgress size={16} />;\n default:\n return null;\n }\n};\n\n// Errors and toasts flagged important interrupt the screen reader; the rest wait\n// for the next pause. Computed once instead of duplicating the same condition\n// across the role and aria-live attributes.\nconst resolveToastAnnouncement = (important: boolean, type: SonnerProps['type']) => {\n const interrupts = important \|\| type === 'error';\n\n return {\n role: interrupts ? 'alert' : 'status',\n live: (interrupts ? 'assertive' : 'polite') as 'assertive' \| 'polite',\n };\n};\n\nconst buildToastStyles = (\n theme: Theme,\n variant: SonnerProps['variant'],\n visible: boolean,\n): CSSObject => {\n const baseStyles: CSSObject = {\n borderRadius: theme.spacing(1.5),\n border: `1px solid ${theme.palette.divider}`,\n backgroundColor: theme.palette.background.paper,\n boxShadow: theme.shadows[4],\n transition: theme.transitions.create(['all', 'transform', 'opacity'], {\n duration: theme.transitions.duration.short,\n }),\n transform: visible ? 'scale(1)' : 'scale(0.95)',\n opacity: visible ? 1 : 0,\n };\n\n switch (variant) {\n case 'glass':\n return {\n ...baseStyles,\n backgroundColor: alpha(theme.palette.background.paper, 0.1),\n backdropFilter: 'blur(20px)',\n border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n boxShadow: `0 8px 32px ${alpha(theme.palette.common.black, 0.1)}`,\n };\n\n case 'minimal':\n return {\n ...baseStyles,\n backgroundColor: theme.palette.background.default,\n border: 'none',\n boxShadow: 'none',\n borderLeft: `4px solid ${theme.palette.primary.main}`,\n borderRadius: 0,\n };\n\n default:\n return baseStyles;\n }\n};\n\n// Title, description and the optional action row. Split out so the toast shell\n// keeps only its own concerns — announcement, styling and dismissal.\nconst ToastContent: React.FC<{\n title?: SonnerProps['title'];\n description?: SonnerProps['description'];\n important: boolean;\n action?: SonnerProps['action'];\n cancel?: SonnerProps['cancel'];\n}> = ({ title, description, important, action, cancel }) => (\n <Box sx={{ flex: 1, minWidth: 0 }}>\n {title && (\n <Typography\n variant=\"body2\"\n sx={{\n fontWeight: important ? 600 : 500,\n color: 'text.primary',\n mb: description ? 0.5 : 0,\n }}\n >\n {title}\n </Typography>\n )}\n\n {description && (\n <Typography variant=\"body2\" sx={{ color: 'text.secondary', fontSize: '0.875rem' }}>\n {description}\n </Typography>\n )}\n\n {(action \|\| cancel) && (\n <Box sx={{ display: 'flex', gap: 1, mt: 1.5 }}>\n {action && (\n <ToastActionButton action={action} buttonVariant=\"contained\" />\n )}\n {cancel && <ToastActionButton action={cancel} buttonVariant=\"outlined\" />}\n </Box>\n )}\n </Box>\n);\n\nconst ToastActionButton: React.FC<{\n action: NonNullable<SonnerProps['action']>;\n buttonVariant: 'contained' \| 'outlined';\n}> = ({ action, buttonVariant }) => (\n <Button\n size=\"small\"\n onClick={action.onClick}\n variant={buttonVariant}\n sx={{ fontSize: '0.75rem', py: 0.5, px: 1.5 }}\n >\n {action.label}\n </Button>\n);\n\nexport const SonnerToast: React.FC<SonnerItem & { onDismiss: (id: string) => void }> = ({\n id,\n title,\n description,\n type = 'default',\n variant = 'default',\n closable = true,\n dismissLabel,\n action,\n cancel,\n icon,\n important = false,\n visible,\n onDismiss,\n}) => {\n const theme = useTheme();\n const announcement = resolveToastAnnouncement(important, type);\n\n const handleDismiss = () => {\n onDismiss(id);\n };\n\n return (\n <Collapse in={visible} timeout={200}>\n <Box\n role={announcement.role}\n aria-live={announcement.live}\n aria-atomic=\"true\"\n sx={{\n ...buildToastStyles(theme, variant, visible),\n p: 2,\n mb: 1,\n minWidth: 356,\n maxWidth: 400,\n display: 'flex',\n alignItems: 'flex-start',\n gap: 1.5,\n }}\n >\n {renderToastIcon(icon, type)}\n\n <ToastContent\n title={title}\n description={description}\n important={important}\n action={action}\n cancel={cancel}\n />\n\n {closable && (\n <IconButton\n size=\"small\"\n onClick={handleDismiss}\n aria-label={dismissLabel}\n sx={{\n ml: 'auto',\n color: 'text.secondary',\n '&:hover': {\n backgroundColor: 'action.hover',\n },\n }}\n >\n <CloseIcon fontSize=\"small\" />\n </IconButton>\n )}\n </Box>\n </Collapse>\n );\n};\n"],"mappings":"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","names":["Box","jsx","jsxs","toast","Box"]}

package/dist/feedback/StackedModal.js CHANGED Viewed

@@ -4,7 +4,7 @@ import {
   StackedModalActions,
   StackedModalContent,
   useModalStack
-} from "../chunk-QZZVHY6U.js";
+} from "../chunk-PVLDKXKR.js";
 import "../chunk-TSPG6TWK.js";
 import "../chunk-MQLM43E4.js";
 import "../chunk-PZ5AY32C.js";

package/dist/feedback/TutorialOverlay.js CHANGED Viewed

@@ -222,6 +222,7 @@ var StepDot = styled(Box, {
   }
 }));
 var TutorialStepNav = ({
+  copy,
   currentStep,
   stepCount,
   isLastStep,
@@ -240,14 +241,14 @@ var TutorialStepNav = ({
     "data-testid": "tutorial-navigation",
     children: [
       /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-        allowSkip && /* @__PURE__ */ jsx(Button, { size: "small", onClick: onSkip, variant: "text", children: "Skip" }),
+        allowSkip && /* @__PURE__ */ jsx(Button, { size: "small", onClick: onSkip, variant: "text", children: copy.skip }),
         stepCount > 1 && /* @__PURE__ */ jsx(
           IconButton,
           {
             size: "small",
             onClick: onRestart,
             disabled: currentStep === 0,
-            title: "Restart",
+            title: copy.restart,
             children: /* @__PURE__ */ jsx(RestartIcon, { fontSize: "small" })
           }
         )
@@ -261,7 +262,7 @@ var TutorialStepNav = ({
             onClick: onPrev,
             disabled: currentStep === 0,
             "data-testid": "tutorial-prev-button",
-            children: "Previous"
+            children: copy.previous
           }
         ),
         !isLastStep ? /* @__PURE__ */ jsx(
@@ -274,7 +275,7 @@ var TutorialStepNav = ({
             disabled: requiresActionBeforeNext,
             title: requiresActionBeforeNext ? "Complete the required action first" : "",
             "data-testid": "tutorial-next-button",
-            children: "Next"
+            children: copy.next
           }
         ) : /* @__PURE__ */ jsx(
           Button,
@@ -336,6 +337,7 @@ var TutorialStepHeader = ({ title, currentStep, allowSkip, onSkip }) => /* @__PU
   }
 );
 var TutorialStepBody = ({
+  copy,
   step,
   currentStep,
   stepCount,
@@ -390,6 +392,7 @@ var TutorialStepBody = ({
   /* @__PURE__ */ jsx(
     TutorialStepNav,
     {
+      copy,
       currentStep,
       stepCount,
       isLastStep,
@@ -560,7 +563,15 @@ var TutorialLayers = ({ variant, targetBounds, isVisible, spotlightPadding }) =>
     )
   ] });
 };
-var TutorialTooltip = ({ tutorial, steps, allowSkip, showProgress, animated, requiresActionBeforeNext }) => /* @__PURE__ */ jsx2(Fade, { in: tutorial.isVisible, timeout: 300, children: /* @__PURE__ */ jsx2(
+var TutorialTooltip = ({
+  tutorial,
+  steps,
+  allowSkip,
+  showProgress,
+  animated,
+  requiresActionBeforeNext,
+  copy
+}) => /* @__PURE__ */ jsx2(Fade, { in: tutorial.isVisible, timeout: 300, children: /* @__PURE__ */ jsx2(
   TooltipContainer,
   {
     ref: tutorial.tooltipRef,
@@ -578,6 +589,7 @@ var TutorialTooltip = ({ tutorial, steps, allowSkip, showProgress, animated, req
     children: /* @__PURE__ */ jsx2(
       TutorialStepBody,
       {
+        copy,
         step: tutorial.currentStepData,
         currentStep: tutorial.currentStep,
         stepCount: steps.length,
@@ -596,6 +608,7 @@ var TutorialTooltip = ({ tutorial, steps, allowSkip, showProgress, animated, req
 ) });
 var TutorialOverlay = (componentProps) => {
   const {
+    copy,
     steps,
     onComplete,
     onSkip,
@@ -636,6 +649,7 @@ var TutorialOverlay = (componentProps) => {
     /* @__PURE__ */ jsx2(
       TutorialTooltip,
       {
+        copy,
         tutorial: { ...tutorial, currentStepData },
         steps,
         allowSkip,