@visio-io/design-system 1.8.21 → 1.8.22
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/index.cjs.js +92 -131
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +31785 -54809
- package/dist/index.es.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/types/components/GoogleMap/components/GoogleMap.d.ts +1 -1
- package/dist/types/components/GoogleMap/components/MapMarkers.d.ts +1 -1
- package/dist/types/components/GoogleMap/types.d.ts +1 -6
- package/dist/types/components/Icons/index.d.ts +0 -11
- package/dist/types/components/MapSpot/MapSpot.d.ts +1 -1
- package/dist/types/components/VideoPlayer/VideoPlayer.d.ts +2 -2
- package/dist/types/components/VideoPlayer/useVideoPlayer.d.ts +1 -2
- package/dist/types/components/VideoTimeline/types.d.ts +16 -0
- package/dist/types/components/VideoTimeline/useVideoTimeline.d.ts +7 -0
- package/dist/types/components/VideoTimeline/utils/timeFormat.d.ts +5 -2
- package/dist/types/components/index.d.ts +2 -24
- package/package.json +3 -5
- package/src/styles/tokens/css-variables.scss +0 -13
- package/dist/types/components/ActionButton/ActionButton.d.ts +0 -2
- package/dist/types/components/ActionButton/ActionButton.stories.d.ts +0 -15
- package/dist/types/components/ActionButton/index.d.ts +0 -2
- package/dist/types/components/ActionButton/types.d.ts +0 -16
- package/dist/types/components/EventCompatibility/EventCompatibility.d.ts +0 -2
- package/dist/types/components/EventCompatibility/EventCompatibility.stories.d.ts +0 -8
- package/dist/types/components/EventCompatibility/index.d.ts +0 -2
- package/dist/types/components/EventCompatibility/types.d.ts +0 -5
- package/dist/types/components/EventDetailsLayout/EventDetailsLayout.d.ts +0 -2
- package/dist/types/components/EventDetailsLayout/EventDetailsLayout.stories.d.ts +0 -8
- package/dist/types/components/EventDetailsLayout/index.d.ts +0 -2
- package/dist/types/components/EventDetailsLayout/types.d.ts +0 -11
- package/dist/types/components/EventLocation/EventLocation.d.ts +0 -2
- package/dist/types/components/EventLocation/EventLocation.stories.d.ts +0 -8
- package/dist/types/components/EventLocation/index.d.ts +0 -2
- package/dist/types/components/EventLocation/types.d.ts +0 -24
- package/dist/types/components/EventPersonInfo/EventPersonInfo.d.ts +0 -2
- package/dist/types/components/EventPersonInfo/EventPersonInfo.stories.d.ts +0 -7
- package/dist/types/components/EventPersonInfo/index.d.ts +0 -2
- package/dist/types/components/EventPersonInfo/types.d.ts +0 -11
- package/dist/types/components/EventPhotoComparison/EventPhotoComparison.d.ts +0 -2
- package/dist/types/components/EventPhotoComparison/EventPhotoComparison.stories.d.ts +0 -8
- package/dist/types/components/EventPhotoComparison/index.d.ts +0 -2
- package/dist/types/components/EventPhotoComparison/types.d.ts +0 -7
- package/dist/types/components/EventVideoPreview/EventVideoPreview.d.ts +0 -2
- package/dist/types/components/EventVideoPreview/EventVideoPreview.stories.d.ts +0 -7
- package/dist/types/components/EventVideoPreview/index.d.ts +0 -2
- package/dist/types/components/EventVideoPreview/types.d.ts +0 -9
- package/dist/types/components/FormSection/FormSection.d.ts +0 -5
- package/dist/types/components/FormSection/FormSection.stories.d.ts +0 -9
- package/dist/types/components/FormSection/index.d.ts +0 -2
- package/dist/types/components/FormSection/types.d.ts +0 -29
- package/dist/types/components/ImageWithFallback/ImageWithFallback.d.ts +0 -2
- package/dist/types/components/ImageWithFallback/index.d.ts +0 -2
- package/dist/types/components/ImageWithFallback/types.d.ts +0 -9
- package/dist/types/components/LoadingScreen/LoadingOrb.d.ts +0 -6
- package/dist/types/components/LoadingScreen/LoadingScreen.d.ts +0 -5
- package/dist/types/components/LoadingScreen/LoadingScreen.stories.d.ts +0 -10
- package/dist/types/components/LoadingScreen/index.d.ts +0 -2
- package/dist/types/components/LoadingScreen/types.d.ts +0 -8
- package/dist/types/components/PhotoUpload/PhotoUpload.d.ts +0 -6
- package/dist/types/components/PhotoUpload/PhotoUpload.stories.d.ts +0 -9
- package/dist/types/components/PhotoUpload/index.d.ts +0 -2
- package/dist/types/components/PhotoUpload/types.d.ts +0 -46
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { GoogleMapProps } from '../types';
|
|
2
2
|
export declare const GoogleMap: {
|
|
3
|
-
({ center, zoom, className,
|
|
3
|
+
({ center, zoom, className, children, apiKey, mapId, themeMode, options, onLoad, onError, }: GoogleMapProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { MapMarkersProps } from '../types';
|
|
2
2
|
export declare const MapMarkers: {
|
|
3
|
-
({ spots, onSpotClick, onCameraClick, zoomLevel, selectedZoomLevel, selectedSpotId, selectedSpot, selectedCameraId, hoveredSpotId, hoveredCameraId, animateOnClick, disableClick, expandAll
|
|
3
|
+
({ spots, onSpotClick, onCameraClick, zoomLevel, selectedZoomLevel, selectedSpotId, selectedSpot, selectedCameraId, hoveredSpotId, hoveredCameraId, animateOnClick, disableClick, expandAll }: MapMarkersProps): import("react/jsx-runtime").JSX.Element | null;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
2
|
import { type SxProps, type Theme } from '@mui/material';
|
|
3
3
|
export interface GoogleMapProps {
|
|
4
4
|
center?: {
|
|
@@ -8,7 +8,6 @@ export interface GoogleMapProps {
|
|
|
8
8
|
zoom?: number;
|
|
9
9
|
options?: google.maps.MapOptions;
|
|
10
10
|
className?: string;
|
|
11
|
-
containerStyle?: CSSProperties;
|
|
12
11
|
children?: ReactNode;
|
|
13
12
|
onLoad?: (map: google.maps.Map) => void;
|
|
14
13
|
onError?: (error: Error) => void;
|
|
@@ -64,8 +63,6 @@ export interface MapMarkersProps {
|
|
|
64
63
|
selectedZoomLevel?: number;
|
|
65
64
|
/** Id do spot selecionado (legado). Preferir selectedSpot quando disponível. */
|
|
66
65
|
selectedSpotId?: string | number;
|
|
67
|
-
/** Id do spot marcado permanentemente com a cor terciária (sem expandir) */
|
|
68
|
-
markedSpotId?: string | number;
|
|
69
66
|
/** Spot selecionado (novo formato). Se definido, prevalece sobre selectedSpotId para isSelected. */
|
|
70
67
|
selectedSpot?: MapSpotData | null;
|
|
71
68
|
/** Id da câmera selecionada para destacar visualmente no MapSpot */
|
|
@@ -85,8 +82,6 @@ export interface MapSpotProps {
|
|
|
85
82
|
currentZoom?: number;
|
|
86
83
|
isSelected?: boolean;
|
|
87
84
|
selectedCameraId?: string;
|
|
88
|
-
/** Marca o spot com a cor terciária permanentemente, sem expandir nem remover ícones */
|
|
89
|
-
isMarked?: boolean;
|
|
90
85
|
/** Destaca o background do spot com cor de seleção sem mostrar linhas de rotação */
|
|
91
86
|
isHighlighted?: boolean;
|
|
92
87
|
/** Destaca uma câmera específica quando o spot está selecionado (hover da lista) */
|
|
@@ -16,14 +16,3 @@ export { default as LightModeIcon } from "../../assets/icons/light_mode.svg?reac
|
|
|
16
16
|
export { default as DarkModeIcon } from "../../assets/icons/dark_mode.svg?react";
|
|
17
17
|
export { default as NotificationsIcon } from "../../assets/icons/notifications.svg?react";
|
|
18
18
|
export { default as PersonIcon } from "../../assets/icons/person.svg?react";
|
|
19
|
-
export { default as UploadIcon } from "../../assets/icons/upload.svg?react";
|
|
20
|
-
export { default as EditIcon } from "../../assets/icons/edit.svg?react";
|
|
21
|
-
export { default as DeleteIcon } from "../../assets/icons/delete.svg?react";
|
|
22
|
-
export { default as LoadingFrame1 } from "../../assets/icons/loading-1.svg?react";
|
|
23
|
-
export { default as LoadingFrame2 } from "../../assets/icons/loading-2.svg?react";
|
|
24
|
-
export { default as LoadingFrame3 } from "../../assets/icons/loading-3.svg?react";
|
|
25
|
-
export { default as LoadingFrame4 } from "../../assets/icons/loading-4.svg?react";
|
|
26
|
-
export { default as LoadingFrame5 } from "../../assets/icons/loading-5.svg?react";
|
|
27
|
-
export { default as LoadingFrame6 } from "../../assets/icons/loading-6.svg?react";
|
|
28
|
-
export { default as LoadingFrame7 } from "../../assets/icons/loading-7.svg?react";
|
|
29
|
-
export { default as VisioLogoIcon } from "../../assets/icons/visio-logo.svg?react";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { MapSpotProps } from '../GoogleMap/types';
|
|
2
2
|
export declare const MapSpot: {
|
|
3
|
-
({ count, addressText, cameras, currentZoom, isSelected, selectedCameraId,
|
|
3
|
+
({ count, addressText, cameras, currentZoom, isSelected, selectedCameraId, isHighlighted, highlightedCameraId, disableClick, className, onClick, onCameraClick, sx }: MapSpotProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { VideoPlayerProps } from
|
|
1
|
+
import { VideoPlayerProps } from './types';
|
|
2
2
|
export declare const VideoPlayer: {
|
|
3
|
-
({ stream, availableQualities, initialQuality, onQualityChange, autoPlay, playsInline, muted, poster, className, sx, liveThresholdSeconds, allowPlaybackRateForStream, playbackRates, zoomLevels, width, height, aspectRatio, showTimestamp, showTimeline, isRecording, recordingLabel, borderRadius, loading, unavailable, unavailableIcon, unavailableMessage, }: VideoPlayerProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
({ stream, availableQualities, initialQuality, onQualityChange, autoPlay, playsInline, muted, poster, className, sx, liveThresholdSeconds, allowPlaybackRateForStream, playbackRates, zoomLevels, width, height, aspectRatio, showTimestamp, showTimeline, isRecording, recordingLabel, borderRadius, loading, unavailable, unavailableIcon, unavailableMessage, showSeekButtons, showPlaybackRate, }: VideoPlayerProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { VideoPlayerProps, VideoQualityOption } from
|
|
1
|
+
import { VideoPlayerProps, VideoQualityOption } from './types';
|
|
2
2
|
export declare const useVideoPlayer: ({ stream, availableQualities, initialQuality, autoPlay, liveThresholdSeconds, allowPlaybackRateForStream, }: Pick<VideoPlayerProps, "stream" | "availableQualities" | "initialQuality" | "autoPlay" | "liveThresholdSeconds" | "allowPlaybackRateForStream">) => {
|
|
3
3
|
containerRef: import("react").RefObject<HTMLDivElement | null>;
|
|
4
4
|
videoRef: import("react").RefObject<HTMLVideoElement | null>;
|
|
@@ -31,7 +31,6 @@ export declare const useVideoPlayer: ({ stream, availableQualities, initialQuali
|
|
|
31
31
|
didDragRef: import("react").RefObject<boolean>;
|
|
32
32
|
isFullscreen: boolean;
|
|
33
33
|
isLoading: boolean;
|
|
34
|
-
hasError: boolean;
|
|
35
34
|
canAdjustPlaybackRate: boolean | undefined;
|
|
36
35
|
updateLiveStatus: () => void;
|
|
37
36
|
};
|
|
@@ -78,6 +78,10 @@ export interface VideoTimelineProps extends Omit<BoxProps, 'height'> {
|
|
|
78
78
|
* When a selection is finished, automatically zoom to the selected range.
|
|
79
79
|
*/
|
|
80
80
|
autoZoomOnSelection?: boolean;
|
|
81
|
+
/**
|
|
82
|
+
* When in live mode, the visible window size in seconds. Defaults to 2 hours (7200).
|
|
83
|
+
*/
|
|
84
|
+
liveWindowSeconds?: number;
|
|
81
85
|
/**
|
|
82
86
|
* Show zoom controls (- 100% +) on the header.
|
|
83
87
|
*/
|
|
@@ -106,6 +110,18 @@ export interface VideoTimelineProps extends Omit<BoxProps, 'height'> {
|
|
|
106
110
|
* If not provided, the date picker is hidden.
|
|
107
111
|
*/
|
|
108
112
|
date?: Date;
|
|
113
|
+
/**
|
|
114
|
+
* Absolute start date-time of the 24-hour window.
|
|
115
|
+
*
|
|
116
|
+
* Use `new Date(Date.now() - 86_400_000)` to show the last 24 hours,
|
|
117
|
+
* which may span two calendar days (e.g. yesterday 14:00 → today 14:00).
|
|
118
|
+
*
|
|
119
|
+
* When provided, second 0 in the timeline maps to this exact moment and
|
|
120
|
+
* tick labels/timestamps are correctly offset across midnight.
|
|
121
|
+
*
|
|
122
|
+
* If omitted, defaults to midnight of `date` (backwards compatible).
|
|
123
|
+
*/
|
|
124
|
+
windowStart?: Date;
|
|
109
125
|
/**
|
|
110
126
|
* Callback when the date changes in the date picker.
|
|
111
127
|
*/
|
|
@@ -8,12 +8,15 @@ type UseVideoTimelineParams = {
|
|
|
8
8
|
clearSelectionOnEventClick: boolean;
|
|
9
9
|
isLive?: boolean;
|
|
10
10
|
date: Date;
|
|
11
|
+
windowStart?: Date;
|
|
11
12
|
onChangePeriod?: (period: TimestampRange) => void;
|
|
12
13
|
segments: VideoSegment[];
|
|
13
14
|
events: EventPoint[];
|
|
14
15
|
fps?: number;
|
|
15
16
|
maxMajorStep?: number;
|
|
16
17
|
enableRangeSelect?: boolean;
|
|
18
|
+
maxTime?: number;
|
|
19
|
+
liveWindowSeconds?: number;
|
|
17
20
|
};
|
|
18
21
|
export declare function useVideoTimeline(params: UseVideoTimelineParams): {
|
|
19
22
|
viewportRef: import("react").RefObject<HTMLDivElement | null>;
|
|
@@ -36,12 +39,16 @@ export declare function useVideoTimeline(params: UseVideoTimelineParams): {
|
|
|
36
39
|
seconds: number;
|
|
37
40
|
};
|
|
38
41
|
ticks: Tick[];
|
|
42
|
+
hoverTime: number | null;
|
|
39
43
|
onWheel: (event: React.WheelEvent) => void;
|
|
40
44
|
onPointerDownScrub: (event: React.PointerEvent) => void;
|
|
41
45
|
onPointerDownSelect: (event: React.PointerEvent) => void;
|
|
42
46
|
onPointerDownPlayhead: (event: React.PointerEvent) => void;
|
|
47
|
+
onPointerDownPan: (event: React.PointerEvent) => void;
|
|
43
48
|
onPointerMove: (event: React.PointerEvent) => void;
|
|
44
49
|
onPointerUp: (event: React.PointerEvent) => void;
|
|
50
|
+
onTimelineMouseMove: (event: React.MouseEvent) => void;
|
|
51
|
+
onTimelineMouseLeave: () => void;
|
|
45
52
|
onClickSegment: (time: number, _segment: VideoSegment) => void;
|
|
46
53
|
onClickEvent: (time: number) => void;
|
|
47
54
|
resetView: () => void;
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Converts seconds
|
|
2
|
+
* Converts seconds elapsed since `windowStart` to an ISO 8601 basic timestamp.
|
|
3
3
|
* Format: `YYYYMMDDTHHMMSSZ` (e.g. `20260130T191055Z`).
|
|
4
|
+
*
|
|
5
|
+
* Pass midnight of a day (`new Date(y, m, d)`) to retain the previous
|
|
6
|
+
* seconds-in-day behaviour. Pass any other Date to support cross-midnight windows.
|
|
4
7
|
*/
|
|
5
|
-
export declare function secondsToTimestamp(
|
|
8
|
+
export declare function secondsToTimestamp(secondsFromWindowStart: number, windowStart: Date): string;
|
|
6
9
|
export declare function getNowInDaySeconds(nowMs?: number): number;
|
|
7
10
|
export declare function formatHmsFromSeconds(secondsInDay: number): string;
|
|
8
11
|
export declare function formatHmsfFromSeconds(secondsInDay: number, fps: number): string;
|
|
@@ -44,11 +44,7 @@ export { FormMultiSelect } from "./FormMultiSelect";
|
|
|
44
44
|
export type { FormMultiSelectProps } from "./FormMultiSelect/types";
|
|
45
45
|
export { FormInput } from "./FormInput";
|
|
46
46
|
export type { FormInputProps } from "./FormInput/types";
|
|
47
|
-
export {
|
|
48
|
-
export type { FormSectionProps } from "./FormSection/types";
|
|
49
|
-
export { PhotoUpload } from "./PhotoUpload";
|
|
50
|
-
export type { PhotoUploadProps } from "./PhotoUpload/types";
|
|
51
|
-
export { CancelIcon, ErrorIcon, SearchIcon, HomeIcon, VideocamIcon, FacialIcon as FacialNewIcon, CarIcon, TodayIcon, PhotoIcon, PlateCloneIcon, SettingsIcon, InboxIcon, LprIcon, LogoutIcon, DarkModeIcon, LightModeIcon, NotificationsIcon, PersonIcon, UploadIcon, EditIcon, DeleteIcon, LoadingFrame1, LoadingFrame2, LoadingFrame3, LoadingFrame4, LoadingFrame5, LoadingFrame6, LoadingFrame7, } from "./Icons";
|
|
47
|
+
export { CancelIcon, ErrorIcon, SearchIcon, HomeIcon, VideocamIcon, FacialIcon as FacialNewIcon, CarIcon, TodayIcon, PhotoIcon, PlateCloneIcon, SettingsIcon, InboxIcon, LprIcon, LogoutIcon, DarkModeIcon, LightModeIcon, NotificationsIcon, PersonIcon, } from "./Icons";
|
|
52
48
|
export { ViewChip } from "./ViewChip";
|
|
53
49
|
export type { ViewChipProps } from "./ViewChip/types";
|
|
54
50
|
export { SortDropdown } from "./SortDropdown";
|
|
@@ -60,22 +56,4 @@ export type { PaginationProps } from "./Pagination/types";
|
|
|
60
56
|
export { ContentCard } from "./ContentCard";
|
|
61
57
|
export type { ContentCardProps, ContentCardSection } from "./ContentCard/types";
|
|
62
58
|
export { ListPageLayout, ListPageActionBar } from "./ListPageLayout";
|
|
63
|
-
export type { ListPageLayoutProps, ListPageActionBarProps, FilterChipData } from "./ListPageLayout/types";
|
|
64
|
-
export { EventDetailsLayout } from "./EventDetailsLayout";
|
|
65
|
-
export type { EventDetailsLayoutProps } from "./EventDetailsLayout/types";
|
|
66
|
-
export { EventPersonInfo } from "./EventPersonInfo";
|
|
67
|
-
export type { EventPersonInfoProps } from "./EventPersonInfo/types";
|
|
68
|
-
export { EventCompatibility } from "./EventCompatibility";
|
|
69
|
-
export type { EventCompatibilityProps } from "./EventCompatibility/types";
|
|
70
|
-
export { EventPhotoComparison } from "./EventPhotoComparison";
|
|
71
|
-
export type { EventPhotoComparisonProps } from "./EventPhotoComparison/types";
|
|
72
|
-
export { EventVideoPreview } from "./EventVideoPreview";
|
|
73
|
-
export type { EventVideoPreviewProps } from "./EventVideoPreview/types";
|
|
74
|
-
export { EventLocation } from "./EventLocation";
|
|
75
|
-
export type { EventLocationProps, NearbyEvent } from "./EventLocation/types";
|
|
76
|
-
export { ImageWithFallback } from "./ImageWithFallback";
|
|
77
|
-
export type { ImageWithFallbackProps } from "./ImageWithFallback/types";
|
|
78
|
-
export { ActionButton } from "./ActionButton";
|
|
79
|
-
export type { ActionButtonProps, ActionButtonVariant, ActionButtonSize, ActionButtonShape } from "./ActionButton/types";
|
|
80
|
-
export { LoadingScreen } from "./LoadingScreen";
|
|
81
|
-
export type { LoadingScreenProps } from "./LoadingScreen/types";
|
|
59
|
+
export type { ListPageLayoutProps, ListPageActionBarProps, FilterChipData, } from "./ListPageLayout/types";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@visio-io/design-system",
|
|
3
|
-
"version": "1.8.
|
|
3
|
+
"version": "1.8.22",
|
|
4
4
|
"description": "Visio Design System",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"module": "dist/index.es.js",
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"peerDependencies": {
|
|
36
36
|
"@emotion/react": "^11.0.0",
|
|
37
37
|
"@emotion/styled": "^11.0.0",
|
|
38
|
-
"@mui/material": "^7.3.6",
|
|
39
38
|
"@mui/x-date-pickers": "^6.0.0 || ^7.0.0 || ^8.0.0",
|
|
39
|
+
"@mui/material": "^7.3.6",
|
|
40
40
|
"@vis.gl/react-google-maps": "^1.0.0",
|
|
41
41
|
"dayjs": "^1.11.0",
|
|
42
42
|
"jotai": "^2.16.2",
|
|
@@ -70,7 +70,6 @@
|
|
|
70
70
|
"dependencies": {
|
|
71
71
|
"@mui/icons-material": "^7.3.7",
|
|
72
72
|
"framer-motion": "^12.29.2",
|
|
73
|
-
"hls.js": "^1.6.15",
|
|
74
73
|
"supercluster": "^8.0.1"
|
|
75
74
|
},
|
|
76
75
|
"scripts": {
|
|
@@ -80,7 +79,6 @@
|
|
|
80
79
|
"build-storybook": "storybook build",
|
|
81
80
|
"storybook": "storybook dev -p 6006",
|
|
82
81
|
"type-check": "tsc --noEmit",
|
|
83
|
-
"release": "pnpm build && changeset publish"
|
|
84
|
-
"dev:yalc": "YALC=1 vite build --watch"
|
|
82
|
+
"release": "pnpm build && changeset publish"
|
|
85
83
|
}
|
|
86
84
|
}
|
|
@@ -28,12 +28,6 @@
|
|
|
28
28
|
--Others-Outline-Dark: #525253;
|
|
29
29
|
--Others-Outline-Light: #C7C6C6;
|
|
30
30
|
|
|
31
|
-
--Static-Title-Large-Font: "Suisse Intl", "Inter", "Helvetica", "Arial", sans-serif;
|
|
32
|
-
--Static-Title-Large-Size: 22px;
|
|
33
|
-
--Static-Title-Large-Weight: 500;
|
|
34
|
-
--Static-Title-Large-Line-Height: 28px;
|
|
35
|
-
--Static-Title-Large-Tracking: 0;
|
|
36
|
-
|
|
37
31
|
--Static-Label-Large-Font: "Suisse Intl", "Inter", "Helvetica", "Arial", sans-serif;
|
|
38
32
|
--Static-Label-Large-Size: 14px;
|
|
39
33
|
--Static-Label-Large-Line-Height: 20px;
|
|
@@ -41,16 +35,9 @@
|
|
|
41
35
|
|
|
42
36
|
--Static-Label-Medium-Font: "Suisse Intl", "Inter", "Helvetica", "Arial", sans-serif;
|
|
43
37
|
--Static-Label-Medium-Size: 12px;
|
|
44
|
-
--Static-Label-Medium-Weight: 500;
|
|
45
38
|
--Static-Label-Medium-Line-Height: 16px;
|
|
46
39
|
--Static-Label-Medium-Tracking: 0.5px;
|
|
47
40
|
|
|
48
|
-
--Static-Label-Small-Font: "Suisse Intl", "Inter", "Helvetica", "Arial", sans-serif;
|
|
49
|
-
--Static-Label-Small-Size: 11px;
|
|
50
|
-
--Static-Label-Small-Weight: 500;
|
|
51
|
-
--Static-Label-Small-Line-Height: 16px;
|
|
52
|
-
--Static-Label-Small-Tracking: 0.5px;
|
|
53
|
-
|
|
54
41
|
--Static-Body-Small-Font: "Suisse Intl", "Inter", "Helvetica", "Arial", sans-serif;
|
|
55
42
|
--Static-Body-Small-Size: 12px;
|
|
56
43
|
--Static-Body-Small-Line-Height: 16px;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { ActionButton } from './ActionButton';
|
|
3
|
-
import '../../styles/index.scss';
|
|
4
|
-
declare const meta: Meta<typeof ActionButton>;
|
|
5
|
-
export default meta;
|
|
6
|
-
type Story = StoryObj<typeof ActionButton>;
|
|
7
|
-
export declare const Default: Story;
|
|
8
|
-
export declare const Variants: Story;
|
|
9
|
-
export declare const VariantsWithIcon: Story;
|
|
10
|
-
export declare const Shapes: Story;
|
|
11
|
-
export declare const SizesRound: Story;
|
|
12
|
-
export declare const SizesSquare: Story;
|
|
13
|
-
export declare const States: Story;
|
|
14
|
-
export declare const FilledStates: Story;
|
|
15
|
-
export declare const UseCaseFormActions: Story;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { ReactNode, MouseEvent } from 'react';
|
|
2
|
-
import { ButtonProps as MuiButtonProps } from '@mui/material';
|
|
3
|
-
export type ActionButtonVariant = 'filled' | 'tonal' | 'outline' | 'elevated' | 'text';
|
|
4
|
-
export type ActionButtonSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
|
|
5
|
-
export type ActionButtonShape = 'round' | 'square';
|
|
6
|
-
export interface ActionButtonProps extends Omit<MuiButtonProps, 'variant' | 'size' | 'color' | 'type' | 'startIcon' | 'endIcon' | 'onClick'> {
|
|
7
|
-
variant?: ActionButtonVariant;
|
|
8
|
-
size?: ActionButtonSize;
|
|
9
|
-
shape?: ActionButtonShape;
|
|
10
|
-
type?: 'button' | 'submit' | 'reset';
|
|
11
|
-
loading?: boolean;
|
|
12
|
-
loadingText?: string;
|
|
13
|
-
startIcon?: ReactNode;
|
|
14
|
-
endIcon?: ReactNode;
|
|
15
|
-
onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
16
|
-
}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { EventCompatibility } from './EventCompatibility';
|
|
3
|
-
declare const meta: Meta<typeof EventCompatibility>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof meta>;
|
|
6
|
-
export declare const HighScore: Story;
|
|
7
|
-
export declare const MediumScore: Story;
|
|
8
|
-
export declare const LowScore: Story;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { EventDetailsLayout } from './EventDetailsLayout';
|
|
3
|
-
declare const meta: Meta<typeof EventDetailsLayout>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof meta>;
|
|
6
|
-
export declare const Default: Story;
|
|
7
|
-
export declare const Loading: Story;
|
|
8
|
-
export declare const Error: Story;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '@mui/material';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
3
|
-
export interface EventDetailsLayoutProps extends Omit<BoxProps, 'children'> {
|
|
4
|
-
children: ReactNode;
|
|
5
|
-
headerTitle: string;
|
|
6
|
-
dateLabel?: string;
|
|
7
|
-
time?: string;
|
|
8
|
-
isLoading?: boolean;
|
|
9
|
-
isError?: boolean;
|
|
10
|
-
errorMessage?: string;
|
|
11
|
-
}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { EventLocation } from './EventLocation';
|
|
3
|
-
declare const meta: Meta<typeof EventLocation>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof meta>;
|
|
6
|
-
export declare const Default: Story;
|
|
7
|
-
export declare const WithCustomMap: Story;
|
|
8
|
-
export declare const NoNearbyEvents: Story;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '@mui/material';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
3
|
-
export interface NearbyEvent {
|
|
4
|
-
id: string;
|
|
5
|
-
spotId?: string;
|
|
6
|
-
spotName: string;
|
|
7
|
-
cameraName: string;
|
|
8
|
-
timestamp: string;
|
|
9
|
-
address: string;
|
|
10
|
-
type: 'before' | 'after';
|
|
11
|
-
}
|
|
12
|
-
export interface EventLocationProps extends BoxProps {
|
|
13
|
-
address?: string | null;
|
|
14
|
-
mapContent?: ReactNode;
|
|
15
|
-
nearbyAfterEvents?: NearbyEvent[];
|
|
16
|
-
nearbyBeforeEvents?: NearbyEvent[];
|
|
17
|
-
sentinelAfterRef?: (node: HTMLElement | null) => void;
|
|
18
|
-
sentinelBeforeRef?: (node: HTMLElement | null) => void;
|
|
19
|
-
isFetchingMoreAfter?: boolean;
|
|
20
|
-
isFetchingMoreBefore?: boolean;
|
|
21
|
-
onHoverSpot?: (spotId: string | null) => void;
|
|
22
|
-
onSelectEvent?: (eventId: string | null, spotId: string | null) => void;
|
|
23
|
-
selectedEventId?: string | null;
|
|
24
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { EventPersonInfo } from './EventPersonInfo';
|
|
3
|
-
declare const meta: Meta<typeof EventPersonInfo>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof meta>;
|
|
6
|
-
export declare const Default: Story;
|
|
7
|
-
export declare const MinimalData: Story;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '@mui/material';
|
|
2
|
-
export interface EventPersonInfoProps extends BoxProps {
|
|
3
|
-
name: string;
|
|
4
|
-
interestLabel?: string | null;
|
|
5
|
-
document?: string | null;
|
|
6
|
-
documentLabel?: string;
|
|
7
|
-
birthDate?: string | null;
|
|
8
|
-
age?: number | null;
|
|
9
|
-
typeLabel?: string | null;
|
|
10
|
-
onViewProfile?: () => void;
|
|
11
|
-
}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { EventPhotoComparison } from './EventPhotoComparison';
|
|
3
|
-
declare const meta: Meta<typeof EventPhotoComparison>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof meta>;
|
|
6
|
-
export declare const WithPhotos: Story;
|
|
7
|
-
export declare const NoPhotos: Story;
|
|
8
|
-
export declare const PartialPhotos: Story;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { EventVideoPreview } from './EventVideoPreview';
|
|
3
|
-
declare const meta: Meta<typeof EventVideoPreview>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof meta>;
|
|
6
|
-
export declare const WithVideoPlayer: Story;
|
|
7
|
-
export declare const Unavailable: Story;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '@mui/material';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
3
|
-
export interface EventVideoPreviewProps extends BoxProps {
|
|
4
|
-
cameraLabel?: string;
|
|
5
|
-
videoPlayer?: ReactNode;
|
|
6
|
-
onViewVideo?: () => void;
|
|
7
|
-
icon?: ReactNode;
|
|
8
|
-
cropUrl?: string | null;
|
|
9
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { FormSection } from './FormSection';
|
|
3
|
-
import '../../styles/index.scss';
|
|
4
|
-
declare const meta: Meta<typeof FormSection>;
|
|
5
|
-
export default meta;
|
|
6
|
-
type Story = StoryObj<typeof FormSection>;
|
|
7
|
-
export declare const Default: Story;
|
|
8
|
-
export declare const MultipleSections: Story;
|
|
9
|
-
export declare const Empty: Story;
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { SxProps, Theme } from '@mui/material';
|
|
3
|
-
/**
|
|
4
|
-
* Props do componente FormSection
|
|
5
|
-
*
|
|
6
|
-
* Card container com título para agrupar campos de formulário.
|
|
7
|
-
*/
|
|
8
|
-
export interface FormSectionProps {
|
|
9
|
-
/**
|
|
10
|
-
* Título exibido no topo da seção
|
|
11
|
-
*/
|
|
12
|
-
title: string;
|
|
13
|
-
/**
|
|
14
|
-
* Subtítulo exibido abaixo do título
|
|
15
|
-
*/
|
|
16
|
-
subtitle?: string;
|
|
17
|
-
/**
|
|
18
|
-
* Conteúdo da seção (geralmente campos de formulário)
|
|
19
|
-
*/
|
|
20
|
-
children: ReactNode;
|
|
21
|
-
/**
|
|
22
|
-
* Classe CSS adicional
|
|
23
|
-
*/
|
|
24
|
-
className?: string;
|
|
25
|
-
/**
|
|
26
|
-
* Estilos MUI adicionais
|
|
27
|
-
*/
|
|
28
|
-
sx?: SxProps<Theme>;
|
|
29
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { ImgHTMLAttributes } from 'react';
|
|
2
|
-
export interface ImageWithFallbackProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'src'> {
|
|
3
|
-
src?: string | null;
|
|
4
|
-
alt?: string;
|
|
5
|
-
/** Shorthand to set both width and height to the same value */
|
|
6
|
-
size?: number | string;
|
|
7
|
-
/** Custom fallback image URL. Defaults to the built-in broken image asset */
|
|
8
|
-
fallbackSrc?: string;
|
|
9
|
-
}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import { LoadingScreen } from './LoadingScreen';
|
|
3
|
-
import '../../styles/index.scss';
|
|
4
|
-
declare const meta: Meta<typeof LoadingScreen>;
|
|
5
|
-
export default meta;
|
|
6
|
-
type Story = StoryObj<typeof LoadingScreen>;
|
|
7
|
-
export declare const Default: Story;
|
|
8
|
-
export declare const WithoutWarning: Story;
|
|
9
|
-
export declare const TitleOnly: Story;
|
|
10
|
-
export declare const OrbOnly: Story;
|