jvetrau-ds 0.2.2 → 0.2.4

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 (62) hide show
  1. package/components/avatar-upload/avatar-upload.cjs +1 -0
  2. package/components/avatar-upload/avatar-upload.cjs.map +1 -1
  3. package/components/avatar-upload/avatar-upload.js +1 -0
  4. package/components/avatar-upload/avatar-upload.js.map +1 -1
  5. package/components/button/button-presentation.cjs +17 -0
  6. package/components/button/button-presentation.cjs.map +1 -0
  7. package/components/button/button-presentation.d.ts +1 -0
  8. package/components/button/button-presentation.js +15 -0
  9. package/components/button/button-presentation.js.map +1 -0
  10. package/components/button/button.cjs +11 -18
  11. package/components/button/button.cjs.map +1 -1
  12. package/components/button/button.d.ts +4 -3
  13. package/components/button/button.js +12 -19
  14. package/components/button/button.js.map +1 -1
  15. package/components/button/index.cjs +11 -1
  16. package/components/button/index.d.ts +1 -0
  17. package/components/button/index.js +1 -0
  18. package/components/dropdown/dropdown.cjs +103 -26
  19. package/components/dropdown/dropdown.cjs.map +1 -1
  20. package/components/dropdown/dropdown.css +142 -0
  21. package/components/dropdown/dropdown.d.ts +2 -0
  22. package/components/dropdown/dropdown.js +103 -26
  23. package/components/dropdown/dropdown.js.map +1 -1
  24. package/components/flip-list/flip-list.cjs +5 -5
  25. package/components/flip-list/flip-list.cjs.map +1 -1
  26. package/components/flip-list/flip-list.css +20 -24
  27. package/components/flip-list/flip-list.js +4 -5
  28. package/components/flip-list/flip-list.js.map +1 -1
  29. package/components/index.cjs +5 -1
  30. package/components/index.d.ts +3 -2
  31. package/components/index.js +1 -1
  32. package/components/tag/tag.cjs +9 -4
  33. package/components/tag/tag.cjs.map +1 -1
  34. package/components/tag/tag.css +40 -27
  35. package/components/tag/tag.d.ts +2 -1
  36. package/components/tag/tag.js +9 -4
  37. package/components/tag/tag.js.map +1 -1
  38. package/components/video/video.cjs +5 -17
  39. package/components/video/video.cjs.map +1 -1
  40. package/components/video/video.js +5 -16
  41. package/components/video/video.js.map +1 -1
  42. package/icons/assets/close.cjs +14 -0
  43. package/icons/assets/close.cjs.map +1 -0
  44. package/icons/assets/close.d.ts +2 -0
  45. package/icons/assets/close.js +12 -0
  46. package/icons/assets/close.js.map +1 -0
  47. package/icons/manifest.cjs +6 -0
  48. package/icons/manifest.cjs.map +1 -1
  49. package/icons/manifest.d.ts +5 -0
  50. package/icons/manifest.js +6 -0
  51. package/icons/manifest.js.map +1 -1
  52. package/index.cjs +4 -0
  53. package/index.d.ts +2 -2
  54. package/index.js +1 -1
  55. package/package.json +1 -1
  56. package/patterns/header/header.cjs +36 -5
  57. package/patterns/header/header.cjs.map +1 -1
  58. package/patterns/header/header.css +45 -0
  59. package/patterns/header/header.d.ts +14 -2
  60. package/patterns/header/header.js +32 -5
  61. package/patterns/header/header.js.map +1 -1
  62. package/styles.css +246 -50
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/video/video.tsx"],"names":[],"mappings":"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","file":"video.js","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport Hls from 'hls.js';\n\nimport './video.css';\nimport Icon from '../../icons/icon';\nimport Button from '../button';\nimport Dropdown, { type DropdownOption } from '../dropdown';\nimport { classnames } from '../helpers/classnames';\nimport ProgressBar from '../progressbar';\n\nexport interface VideoQuality {\n value: string;\n label: string;\n src?: string;\n disabled?: boolean;\n}\n\nexport interface VideoProgressState {\n currentTime: number;\n duration: number;\n completed: boolean;\n}\n\nexport interface VideoPlaybackError {\n type: 'media' | 'hls';\n fatal: boolean;\n error: unknown;\n}\n\nexport interface VideoProps\n extends Omit<\n React.VideoHTMLAttributes<HTMLVideoElement>,\n 'controls' | 'src' | 'poster'\n > {\n src?: string;\n mediaKey?: string;\n cover?: string;\n qualities?: VideoQuality[];\n defaultQuality?: string;\n label?: string;\n initialVolume?: number;\n initialMuted?: boolean;\n initialTime?: number;\n progressCommitIntervalSec?: number;\n onProgressCommit?: (\n state: VideoProgressState,\n ) => void;\n onQualityChange?: (\n quality: string,\n ) => void;\n onPlaybackError?: (\n error: VideoPlaybackError,\n ) => void;\n}\n\nfunction getClampedValue(\n value: number,\n min: number,\n max: number,\n) {\n return Math.min(\n Math.max(value, min),\n max,\n );\n}\n\nfunction formatTime(value: number) {\n if (!Number.isFinite(value)) {\n return '0:00';\n }\n\n const minutes = Math.floor(\n value / 60,\n );\n\n const seconds = Math.floor(\n value % 60,\n );\n\n return `${minutes}:${String(\n seconds,\n ).padStart(2, '0')}`;\n}\n\nfunction getBufferedEnd(\n video: HTMLVideoElement,\n) {\n if (video.buffered.length === 0) {\n return 0;\n }\n\n return video.buffered.end(\n video.buffered.length - 1,\n );\n}\n\nfunction getVideoSource(\n src: string | undefined,\n qualities: VideoQuality[],\n selectedQuality: string,\n) {\n const selectedQualityItem =\n qualities.find(\n (quality) =>\n quality.value ===\n selectedQuality,\n );\n\n return selectedQualityItem?.src ?? src;\n}\n\nfunction getQualityOptions(\n qualities: VideoQuality[],\n): DropdownOption[] {\n return qualities.map((quality) => ({\n value: quality.value,\n label: quality.label,\n disabled: quality.disabled,\n }));\n}\n\nfunction getVideoProgressState(\n video: HTMLVideoElement,\n): VideoProgressState {\n const duration = video.duration || 0;\n\n const currentTime =\n video.currentTime || 0;\n\n return {\n currentTime,\n duration,\n\n completed:\n video.ended ||\n (duration > 0 &&\n currentTime >=\n duration * 0.9),\n };\n}\n\nconst defaultQualities: VideoQuality[] = [];\n\nconst Video: React.FC<VideoProps> = ({\n src,\n mediaKey,\n cover,\n qualities = defaultQualities,\n defaultQuality = '',\n label = 'Video player',\n initialVolume = 1,\n initialMuted = false,\n initialTime = 0,\n progressCommitIntervalSec = 15,\n className = '',\n autoPlay,\n loop,\n muted,\n playsInline = true,\n preload = 'metadata',\n onQualityChange,\n onPlaybackError,\n onPlay,\n onPause,\n onEnded,\n onError,\n onLoadedMetadata,\n onTimeUpdate,\n onProgress,\n onVolumeChange,\n onProgressCommit,\n children,\n ...props\n}) => {\n const videoRef =\n useRef<HTMLVideoElement>(null);\n\n const [isPlaying, setIsPlaying] =\n useState(false);\n\n const [\n isVolumeOpen,\n setIsVolumeOpen,\n ] = useState(false);\n\n const [\n selectedQuality,\n setSelectedQuality,\n ] = useState(defaultQuality);\n\n const [\n currentTime,\n setCurrentTime,\n ] = useState(0);\n\n const [duration, setDuration] =\n useState(0);\n\n const [buffered, setBuffered] =\n useState(0);\n\n const [volume, setVolume] =\n useState(initialVolume);\n\n const [isMuted, setIsMuted] =\n useState(\n muted ?? initialMuted,\n );\n\n const hasAppliedInitialTimeRef =\n useRef(false);\n\n const lastProgressCommitAtRef =\n useRef(0);\n\n const loadedMediaKeyRef =\n useRef<\n string | undefined\n >(undefined);\n\n const pendingRestoreTimeRef =\n useRef<number | null>(null);\n\n const onPlaybackErrorRef =\n useRef(onPlaybackError);\n\n const videoSrc = getVideoSource(\n src,\n qualities,\n selectedQuality,\n );\n\n const effectiveMediaKey =\n mediaKey ?? videoSrc;\n\n const qualityOptions =\n getQualityOptions(qualities);\n\n const hasQualityOptions =\n qualityOptions.length > 0;\n\n useEffect(() => {\n onPlaybackErrorRef.current =\n onPlaybackError;\n }, [onPlaybackError]);\n\n useEffect(() => {\n const video = videoRef.current;\n\n if (!video || !videoSrc) {\n return;\n }\n\n const isSameMedia =\n loadedMediaKeyRef.current !==\n undefined &&\n loadedMediaKeyRef.current ===\n effectiveMediaKey;\n\n if (isSameMedia) {\n pendingRestoreTimeRef.current =\n video.currentTime;\n } else {\n pendingRestoreTimeRef.current =\n null;\n\n hasAppliedInitialTimeRef.current =\n false;\n\n lastProgressCommitAtRef.current =\n 0;\n\n setCurrentTime(0);\n setDuration(0);\n setBuffered(0);\n setIsPlaying(false);\n }\n\n loadedMediaKeyRef.current =\n effectiveMediaKey;\n\n video.removeAttribute('src');\n video.load();\n\n if (\n video.canPlayType(\n 'application/vnd.apple.mpegurl',\n )\n ) {\n video.src = videoSrc;\n return;\n }\n\n if (!Hls.isSupported()) {\n video.src = videoSrc;\n return;\n }\n\n const hls = new Hls();\n\n hls.on(\n Hls.Events.ERROR,\n (_, data) => {\n console.error(\n 'HLS error',\n data,\n );\n\n onPlaybackErrorRef.current?.({\n type: 'hls',\n fatal: data.fatal,\n error: data,\n });\n },\n );\n\n hls.loadSource(videoSrc);\n hls.attachMedia(video);\n\n return () => {\n hls.destroy();\n };\n }, [videoSrc, effectiveMediaKey]);\n\n const hasStarted =\n currentTime > 0 || isPlaying;\n\n const hasControls = hasStarted;\n\n const hasVolume = isVolumeOpen;\n\n const classes = classnames(\n 'video',\n className,\n {\n 'video--with-controls':\n hasControls,\n 'video--with-volume':\n hasVolume,\n },\n );\n\n const syncMediaState = () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n setCurrentTime(video.currentTime);\n\n setDuration(\n video.duration || 0,\n );\n\n setBuffered(\n getBufferedEnd(video),\n );\n\n setVolume(video.volume);\n\n setIsMuted(video.muted);\n\n setIsPlaying(!video.paused);\n };\n\n const commitProgress = (\n video: HTMLVideoElement,\n ) => {\n if (!onProgressCommit) {\n return;\n }\n\n onProgressCommit(\n getVideoProgressState(video),\n );\n };\n\n const handlePlayToggle = async () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n console.log('play click', {\n paused: video.paused,\n readyState: video.readyState,\n src: video.currentSrc,\n networkState:\n video.networkState,\n error: video.error,\n });\n\n if (video.paused) {\n try {\n await video.play();\n\n console.log(\n 'play success',\n );\n } catch (error) {\n console.error(\n 'play failed',\n error,\n );\n }\n\n return;\n }\n\n video.pause();\n };\n\n const handleSeek = (\n nextValue: number,\n ) => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n video.currentTime =\n getClampedValue(\n nextValue,\n 0,\n duration,\n );\n\n setCurrentTime(\n video.currentTime,\n );\n };\n\n const handleVolumeChange = (\n nextValue: number,\n ) => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n const nextVolume =\n getClampedValue(\n nextValue,\n 0,\n 1,\n );\n\n video.volume = nextVolume;\n\n video.muted =\n nextVolume === 0;\n\n setVolume(nextVolume);\n\n setIsMuted(video.muted);\n };\n\n const handleSoundToggle = () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n video.muted = !video.muted;\n\n setIsMuted(video.muted);\n };\n\n const handleFullscreen = () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n video.requestFullscreen?.();\n };\n\n const handleQualityChange = (\n quality: string,\n ) => {\n setSelectedQuality(quality);\n\n onQualityChange?.(quality);\n };\n\n const handleLoadedMetadata = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n const video =\n event.currentTarget;\n\n if (\n pendingRestoreTimeRef.current !==\n null\n ) {\n video.currentTime = Math.min(\n pendingRestoreTimeRef.current,\n video.duration ||\n pendingRestoreTimeRef.current,\n );\n\n pendingRestoreTimeRef.current =\n null;\n } else if (\n !hasAppliedInitialTimeRef.current &&\n initialTime > 0\n ) {\n video.currentTime = Math.min(\n initialTime,\n video.duration ||\n initialTime,\n );\n\n hasAppliedInitialTimeRef.current =\n true;\n }\n\n syncMediaState();\n\n onLoadedMetadata?.(event);\n };\n\n const handleTimeUpdate = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n const video =\n event.currentTarget;\n\n syncMediaState();\n\n if (\n onProgressCommit &&\n video.currentTime -\n lastProgressCommitAtRef.current >=\n progressCommitIntervalSec\n ) {\n lastProgressCommitAtRef.current =\n video.currentTime;\n\n commitProgress(video);\n }\n\n onTimeUpdate?.(event);\n };\n\n const handleProgress = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n syncMediaState();\n\n onProgress?.(event);\n };\n\n const handlePlay = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n setIsPlaying(true);\n\n onPlay?.(event);\n };\n\n const handlePause = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n setIsPlaying(false);\n\n commitProgress(\n event.currentTarget,\n );\n\n onPause?.(event);\n };\n\n const handleEnded = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n syncMediaState();\n\n commitProgress(\n event.currentTarget,\n );\n\n onEnded?.(event);\n };\n\n const handleNativeError = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n onPlaybackError?.({\n type: 'media',\n fatal: true,\n error:\n event.currentTarget.error ??\n event,\n });\n\n onError?.(event);\n };\n\n const handleNativeVolumeChange = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n syncMediaState();\n\n onVolumeChange?.(event);\n };\n\n return (\n <div\n className={classes}\n aria-label={label}\n >\n <div className=\"video__surface\">\n {cover && !hasStarted ? (\n <img\n className=\"video__cover\"\n src={cover}\n alt=\"\"\n aria-hidden=\"true\"\n />\n ) : null}\n\n <video\n {...props}\n ref={videoRef}\n className=\"video__media\"\n poster={cover}\n autoPlay={autoPlay}\n loop={loop}\n muted={isMuted}\n playsInline={\n playsInline\n }\n preload={preload}\n controls={false}\n onLoadedMetadata={\n handleLoadedMetadata\n }\n onTimeUpdate={\n handleTimeUpdate\n }\n onProgress={\n handleProgress\n }\n onPlay={handlePlay}\n onPause={handlePause}\n onEnded={handleEnded}\n onError={\n handleNativeError\n }\n onVolumeChange={\n handleNativeVolumeChange\n }\n >\n {children}\n </video>\n\n {!hasStarted && (\n <Button\n mode=\"toolbar\"\n className=\"video__main-action\"\n icon={\n <Icon name=\"play\" />\n }\n aria-label=\"Play video\"\n onClick={\n handlePlayToggle\n }\n />\n )}\n </div>\n\n {hasControls && (\n <div className=\"video__controls\">\n <Button\n mode=\"toolbar\"\n icon={\n <Icon\n name={\n isPlaying\n ? 'pause'\n : 'play'\n }\n />\n }\n aria-label={\n isPlaying\n ? 'Pause video'\n : 'Play video'\n }\n onClick={\n handlePlayToggle\n }\n />\n\n <div className=\"video__time\">\n {formatTime(currentTime)}\n </div>\n\n <ProgressBar\n className=\"video__progress\"\n mode=\"player\"\n value={currentTime}\n buffered={buffered}\n max={duration || 1}\n step={1}\n label=\"Video progress\"\n onValueChange={\n handleSeek\n }\n />\n\n <Button\n mode=\"toolbar\"\n icon={\n <Icon name=\"fullscreen\" />\n }\n aria-label=\"Fullscreen\"\n onClick={\n handleFullscreen\n }\n />\n\n <div\n className=\"video__sound-control\"\n onMouseLeave={() =>\n setIsVolumeOpen(\n false,\n )\n }\n >\n <Button\n mode=\"toolbar\"\n icon={\n <Icon\n name={\n isMuted\n ? 'sound-off'\n : 'sound'\n }\n />\n }\n aria-label={\n isMuted\n ? 'Unmute video'\n : 'Mute video'\n }\n onClick={\n handleSoundToggle\n }\n onMouseEnter={() =>\n setIsVolumeOpen(\n true,\n )\n }\n onFocus={() =>\n setIsVolumeOpen(\n true,\n )\n }\n />\n\n {hasVolume && (\n <div className=\"video__volume\">\n <ProgressBar\n mode=\"level\"\n value={\n isMuted\n ? 0\n : volume\n }\n max={1}\n step={0.05}\n label=\"Volume\"\n onValueChange={\n handleVolumeChange\n }\n />\n </div>\n )}\n </div>\n\n {hasQualityOptions && (\n <Dropdown\n align=\"top-end\"\n value={\n selectedQuality\n }\n options={\n qualityOptions\n }\n label=\"Video quality\"\n onChange={\n handleQualityChange\n }\n trigger={\n <Button\n mode=\"toolbar\"\n icon={\n <Icon name=\"settings\" />\n }\n aria-label=\"Video quality\"\n />\n }\n />\n )}\n </div>\n )}\n </div>\n );\n};\n\nexport default Video;\n"]}
1
+ {"version":3,"sources":["../../../src/components/video/video.tsx"],"names":[],"mappings":"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","file":"video.js","sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport Hls from 'hls.js';\n\nimport './video.css';\nimport Button from '../button';\nimport Dropdown, { type DropdownOption } from '../dropdown';\nimport { classnames } from '../helpers/classnames';\nimport ProgressBar from '../progressbar';\n\nexport interface VideoQuality {\n value: string;\n label: string;\n src?: string;\n disabled?: boolean;\n}\n\nexport interface VideoProgressState {\n currentTime: number;\n duration: number;\n completed: boolean;\n}\n\nexport interface VideoPlaybackError {\n type: 'media' | 'hls';\n fatal: boolean;\n error: unknown;\n}\n\nexport interface VideoProps\n extends Omit<\n React.VideoHTMLAttributes<HTMLVideoElement>,\n 'controls' | 'src' | 'poster'\n > {\n src?: string;\n mediaKey?: string;\n cover?: string;\n qualities?: VideoQuality[];\n defaultQuality?: string;\n label?: string;\n initialVolume?: number;\n initialMuted?: boolean;\n initialTime?: number;\n progressCommitIntervalSec?: number;\n onProgressCommit?: (\n state: VideoProgressState,\n ) => void;\n onQualityChange?: (\n quality: string,\n ) => void;\n onPlaybackError?: (\n error: VideoPlaybackError,\n ) => void;\n}\n\nfunction getClampedValue(\n value: number,\n min: number,\n max: number,\n) {\n return Math.min(\n Math.max(value, min),\n max,\n );\n}\n\nfunction formatTime(value: number) {\n if (!Number.isFinite(value)) {\n return '0:00';\n }\n\n const minutes = Math.floor(\n value / 60,\n );\n\n const seconds = Math.floor(\n value % 60,\n );\n\n return `${minutes}:${String(\n seconds,\n ).padStart(2, '0')}`;\n}\n\nfunction getBufferedEnd(\n video: HTMLVideoElement,\n) {\n if (video.buffered.length === 0) {\n return 0;\n }\n\n return video.buffered.end(\n video.buffered.length - 1,\n );\n}\n\nfunction getVideoSource(\n src: string | undefined,\n qualities: VideoQuality[],\n selectedQuality: string,\n) {\n const selectedQualityItem =\n qualities.find(\n (quality) =>\n quality.value ===\n selectedQuality,\n );\n\n return selectedQualityItem?.src ?? src;\n}\n\nfunction getQualityOptions(\n qualities: VideoQuality[],\n): DropdownOption[] {\n return qualities.map((quality) => ({\n value: quality.value,\n label: quality.label,\n disabled: quality.disabled,\n }));\n}\n\nfunction getVideoProgressState(\n video: HTMLVideoElement,\n): VideoProgressState {\n const duration = video.duration || 0;\n\n const currentTime =\n video.currentTime || 0;\n\n return {\n currentTime,\n duration,\n\n completed:\n video.ended ||\n (duration > 0 &&\n currentTime >=\n duration * 0.9),\n };\n}\n\nconst defaultQualities: VideoQuality[] = [];\n\nconst Video: React.FC<VideoProps> = ({\n src,\n mediaKey,\n cover,\n qualities = defaultQualities,\n defaultQuality = '',\n label = 'Video player',\n initialVolume = 1,\n initialMuted = false,\n initialTime = 0,\n progressCommitIntervalSec = 15,\n className = '',\n autoPlay,\n loop,\n muted,\n playsInline = true,\n preload = 'metadata',\n onQualityChange,\n onPlaybackError,\n onPlay,\n onPause,\n onEnded,\n onError,\n onLoadedMetadata,\n onTimeUpdate,\n onProgress,\n onVolumeChange,\n onProgressCommit,\n children,\n ...props\n}) => {\n const videoRef =\n useRef<HTMLVideoElement>(null);\n\n const [isPlaying, setIsPlaying] =\n useState(false);\n\n const [\n isVolumeOpen,\n setIsVolumeOpen,\n ] = useState(false);\n\n const [\n selectedQuality,\n setSelectedQuality,\n ] = useState(defaultQuality);\n\n const [\n currentTime,\n setCurrentTime,\n ] = useState(0);\n\n const [duration, setDuration] =\n useState(0);\n\n const [buffered, setBuffered] =\n useState(0);\n\n const [volume, setVolume] =\n useState(initialVolume);\n\n const [isMuted, setIsMuted] =\n useState(\n muted ?? initialMuted,\n );\n\n const hasAppliedInitialTimeRef =\n useRef(false);\n\n const lastProgressCommitAtRef =\n useRef(0);\n\n const loadedMediaKeyRef =\n useRef<\n string | undefined\n >(undefined);\n\n const pendingRestoreTimeRef =\n useRef<number | null>(null);\n\n const onPlaybackErrorRef =\n useRef(onPlaybackError);\n\n const videoSrc = getVideoSource(\n src,\n qualities,\n selectedQuality,\n );\n\n const effectiveMediaKey =\n mediaKey ?? videoSrc;\n\n const qualityOptions =\n getQualityOptions(qualities);\n\n const hasQualityOptions =\n qualityOptions.length > 0;\n\n useEffect(() => {\n onPlaybackErrorRef.current =\n onPlaybackError;\n }, [onPlaybackError]);\n\n useEffect(() => {\n const video = videoRef.current;\n\n if (!video || !videoSrc) {\n return;\n }\n\n const isSameMedia =\n loadedMediaKeyRef.current !==\n undefined &&\n loadedMediaKeyRef.current ===\n effectiveMediaKey;\n\n if (isSameMedia) {\n pendingRestoreTimeRef.current =\n video.currentTime;\n } else {\n pendingRestoreTimeRef.current =\n null;\n\n hasAppliedInitialTimeRef.current =\n false;\n\n lastProgressCommitAtRef.current =\n 0;\n\n setCurrentTime(0);\n setDuration(0);\n setBuffered(0);\n setIsPlaying(false);\n }\n\n loadedMediaKeyRef.current =\n effectiveMediaKey;\n\n video.removeAttribute('src');\n video.load();\n\n if (\n video.canPlayType(\n 'application/vnd.apple.mpegurl',\n )\n ) {\n video.src = videoSrc;\n return;\n }\n\n if (!Hls.isSupported()) {\n video.src = videoSrc;\n return;\n }\n\n const hls = new Hls();\n\n hls.on(\n Hls.Events.ERROR,\n (_, data) => {\n console.error(\n 'HLS error',\n data,\n );\n\n onPlaybackErrorRef.current?.({\n type: 'hls',\n fatal: data.fatal,\n error: data,\n });\n },\n );\n\n hls.loadSource(videoSrc);\n hls.attachMedia(video);\n\n return () => {\n hls.destroy();\n };\n }, [videoSrc, effectiveMediaKey]);\n\n const hasStarted =\n currentTime > 0 || isPlaying;\n\n const hasControls = hasStarted;\n\n const hasVolume = isVolumeOpen;\n\n const classes = classnames(\n 'video',\n className,\n {\n 'video--with-controls':\n hasControls,\n 'video--with-volume':\n hasVolume,\n },\n );\n\n const syncMediaState = () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n setCurrentTime(video.currentTime);\n\n setDuration(\n video.duration || 0,\n );\n\n setBuffered(\n getBufferedEnd(video),\n );\n\n setVolume(video.volume);\n\n setIsMuted(video.muted);\n\n setIsPlaying(!video.paused);\n };\n\n const commitProgress = (\n video: HTMLVideoElement,\n ) => {\n if (!onProgressCommit) {\n return;\n }\n\n onProgressCommit(\n getVideoProgressState(video),\n );\n };\n\n const handlePlayToggle = async () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n console.log('play click', {\n paused: video.paused,\n readyState: video.readyState,\n src: video.currentSrc,\n networkState:\n video.networkState,\n error: video.error,\n });\n\n if (video.paused) {\n try {\n await video.play();\n\n console.log(\n 'play success',\n );\n } catch (error) {\n console.error(\n 'play failed',\n error,\n );\n }\n\n return;\n }\n\n video.pause();\n };\n\n const handleSeek = (\n nextValue: number,\n ) => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n video.currentTime =\n getClampedValue(\n nextValue,\n 0,\n duration,\n );\n\n setCurrentTime(\n video.currentTime,\n );\n };\n\n const handleVolumeChange = (\n nextValue: number,\n ) => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n const nextVolume =\n getClampedValue(\n nextValue,\n 0,\n 1,\n );\n\n video.volume = nextVolume;\n\n video.muted =\n nextVolume === 0;\n\n setVolume(nextVolume);\n\n setIsMuted(video.muted);\n };\n\n const handleSoundToggle = () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n video.muted = !video.muted;\n\n setIsMuted(video.muted);\n };\n\n const handleFullscreen = () => {\n const video = videoRef.current;\n\n if (!video) {\n return;\n }\n\n video.requestFullscreen?.();\n };\n\n const handleQualityChange = (\n quality: string,\n ) => {\n setSelectedQuality(quality);\n\n onQualityChange?.(quality);\n };\n\n const handleLoadedMetadata = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n const video =\n event.currentTarget;\n\n if (\n pendingRestoreTimeRef.current !==\n null\n ) {\n video.currentTime = Math.min(\n pendingRestoreTimeRef.current,\n video.duration ||\n pendingRestoreTimeRef.current,\n );\n\n pendingRestoreTimeRef.current =\n null;\n } else if (\n !hasAppliedInitialTimeRef.current &&\n initialTime > 0\n ) {\n video.currentTime = Math.min(\n initialTime,\n video.duration ||\n initialTime,\n );\n\n hasAppliedInitialTimeRef.current =\n true;\n }\n\n syncMediaState();\n\n onLoadedMetadata?.(event);\n };\n\n const handleTimeUpdate = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n const video =\n event.currentTarget;\n\n syncMediaState();\n\n if (\n onProgressCommit &&\n video.currentTime -\n lastProgressCommitAtRef.current >=\n progressCommitIntervalSec\n ) {\n lastProgressCommitAtRef.current =\n video.currentTime;\n\n commitProgress(video);\n }\n\n onTimeUpdate?.(event);\n };\n\n const handleProgress = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n syncMediaState();\n\n onProgress?.(event);\n };\n\n const handlePlay = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n setIsPlaying(true);\n\n onPlay?.(event);\n };\n\n const handlePause = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n setIsPlaying(false);\n\n commitProgress(\n event.currentTarget,\n );\n\n onPause?.(event);\n };\n\n const handleEnded = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n syncMediaState();\n\n commitProgress(\n event.currentTarget,\n );\n\n onEnded?.(event);\n };\n\n const handleNativeError = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n onPlaybackError?.({\n type: 'media',\n fatal: true,\n error:\n event.currentTarget.error ??\n event,\n });\n\n onError?.(event);\n };\n\n const handleNativeVolumeChange = (\n event: React.SyntheticEvent<HTMLVideoElement>,\n ) => {\n syncMediaState();\n\n onVolumeChange?.(event);\n };\n\n return (\n <div\n className={classes}\n aria-label={label}\n >\n <div className=\"video__surface\">\n {cover && !hasStarted ? (\n <img\n className=\"video__cover\"\n src={cover}\n alt=\"\"\n aria-hidden=\"true\"\n />\n ) : null}\n\n <video\n {...props}\n ref={videoRef}\n className=\"video__media\"\n poster={cover}\n autoPlay={autoPlay}\n loop={loop}\n muted={isMuted}\n playsInline={\n playsInline\n }\n preload={preload}\n controls={false}\n onLoadedMetadata={\n handleLoadedMetadata\n }\n onTimeUpdate={\n handleTimeUpdate\n }\n onProgress={\n handleProgress\n }\n onPlay={handlePlay}\n onPause={handlePause}\n onEnded={handleEnded}\n onError={\n handleNativeError\n }\n onVolumeChange={\n handleNativeVolumeChange\n }\n >\n {children}\n </video>\n\n {!hasStarted && (\n <Button\n mode=\"toolbar\"\n className=\"video__main-action\"\n icon=\"play\"\n aria-label=\"Play video\"\n onClick={\n handlePlayToggle\n }\n />\n )}\n </div>\n\n {hasControls && (\n <div className=\"video__controls\">\n <Button\n mode=\"toolbar\"\n icon={\n isPlaying\n ? 'pause'\n : 'play'\n }\n aria-label={\n isPlaying\n ? 'Pause video'\n : 'Play video'\n }\n onClick={\n handlePlayToggle\n }\n />\n\n <div className=\"video__time\">\n {formatTime(currentTime)}\n </div>\n\n <ProgressBar\n className=\"video__progress\"\n mode=\"player\"\n value={currentTime}\n buffered={buffered}\n max={duration || 1}\n step={1}\n label=\"Video progress\"\n onValueChange={\n handleSeek\n }\n />\n\n <Button\n mode=\"toolbar\"\n icon=\"fullscreen\"\n aria-label=\"Fullscreen\"\n onClick={\n handleFullscreen\n }\n />\n\n <div\n className=\"video__sound-control\"\n onMouseLeave={() =>\n setIsVolumeOpen(\n false,\n )\n }\n >\n <Button\n mode=\"toolbar\"\n icon={\n isMuted\n ? 'sound-off'\n : 'sound'\n }\n aria-label={\n isMuted\n ? 'Unmute video'\n : 'Mute video'\n }\n onClick={\n handleSoundToggle\n }\n onMouseEnter={() =>\n setIsVolumeOpen(\n true,\n )\n }\n onFocus={() =>\n setIsVolumeOpen(\n true,\n )\n }\n />\n\n {hasVolume && (\n <div className=\"video__volume\">\n <ProgressBar\n mode=\"level\"\n value={\n isMuted\n ? 0\n : volume\n }\n max={1}\n step={0.05}\n label=\"Volume\"\n onValueChange={\n handleVolumeChange\n }\n />\n </div>\n )}\n </div>\n\n {hasQualityOptions && (\n <Dropdown\n align=\"top-end\"\n value={\n selectedQuality\n }\n options={\n qualityOptions\n }\n label=\"Video quality\"\n onChange={\n handleQualityChange\n }\n trigger={\n <Button\n mode=\"toolbar\"\n icon=\"settings\"\n aria-label=\"Video quality\"\n />\n }\n />\n )}\n </div>\n )}\n </div>\n );\n};\n\nexport default Video;\n"]}
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+
5
+ const close = {
6
+ xs: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M13.6729 2.3535L8.1328 7.8931L13.6729 13.4336L13.3193 13.7871L7.7793 8.2471L2.3535 13.6729L2 13.3193L7.4258 7.8936L2 2.4678L2.3535 2.1138L7.7793 7.5396L13.3193 2L13.6729 2.3535Z" }),
7
+ s: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17.0911 2.9419L10.166 9.8663L17.0911 16.792L16.6492 17.2339L9.7241 10.3088L2.9419 17.0911L2.5 16.6492L9.2822 9.867L2.5 3.0847L2.9419 2.6422L9.7241 9.4244L16.6492 2.5L17.0911 2.9419Z" }),
8
+ m: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20.5093 3.5303L12.1992 11.8396L20.5093 20.1504L19.979 20.6807L11.6689 12.3706L3.5303 20.5093L3 19.979L11.1387 11.8403L3 3.7017L3.5303 3.1707L11.6689 11.3093L19.979 3L20.5093 3.5303Z" }),
9
+ l: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M27.3457 4.70703L16.2656 15.7861L27.3457 26.8672L26.6387 27.5742L15.5586 16.4941L4.70703 27.3457L4 26.6387L14.8516 15.7871L4 4.93555L4.70703 4.22754L15.5586 15.0791L26.6387 4L27.3457 4.70703Z" })
10
+ };
11
+
12
+ exports.close = close;
13
+ //# sourceMappingURL=close.cjs.map
14
+ //# sourceMappingURL=close.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/icons/assets/close.tsx"],"names":["jsx"],"mappings":";;;;AAEO,MAAM,KAAA,GAAmB;AAAA,EAC9B,EAAA,kBAAIA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,mLAAA,EAAoL,CAAA;AAAA,EAChM,CAAA,kBAAGA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,wLAAA,EAAyL,CAAA;AAAA,EACpM,CAAA,kBAAGA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,wLAAA,EAAyL,CAAA;AAAA,EACpM,CAAA,kBAAGA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,iMAAA,EAAkM;AAC/M","file":"close.cjs","sourcesContent":["import type { IconGlyph } from '../types';\n\nexport const close: IconGlyph = {\n xs: <path d=\"M13.6729 2.3535L8.1328 7.8931L13.6729 13.4336L13.3193 13.7871L7.7793 8.2471L2.3535 13.6729L2 13.3193L7.4258 7.8936L2 2.4678L2.3535 2.1138L7.7793 7.5396L13.3193 2L13.6729 2.3535Z\" />,\n s: <path d=\"M17.0911 2.9419L10.166 9.8663L17.0911 16.792L16.6492 17.2339L9.7241 10.3088L2.9419 17.0911L2.5 16.6492L9.2822 9.867L2.5 3.0847L2.9419 2.6422L9.7241 9.4244L16.6492 2.5L17.0911 2.9419Z\" />,\n m: <path d=\"M20.5093 3.5303L12.1992 11.8396L20.5093 20.1504L19.979 20.6807L11.6689 12.3706L3.5303 20.5093L3 19.979L11.1387 11.8403L3 3.7017L3.5303 3.1707L11.6689 11.3093L19.979 3L20.5093 3.5303Z\" />,\n l: <path d=\"M27.3457 4.70703L16.2656 15.7861L27.3457 26.8672L26.6387 27.5742L15.5586 16.4941L4.70703 27.3457L4 26.6387L14.8516 15.7871L4 4.93555L4.70703 4.22754L15.5586 15.0791L26.6387 4L27.3457 4.70703Z\" />,\n};"]}
@@ -0,0 +1,2 @@
1
+ import type { IconGlyph } from '../types';
2
+ export declare const close: IconGlyph;
@@ -0,0 +1,12 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+
3
+ const close = {
4
+ xs: /* @__PURE__ */ jsx("path", { d: "M13.6729 2.3535L8.1328 7.8931L13.6729 13.4336L13.3193 13.7871L7.7793 8.2471L2.3535 13.6729L2 13.3193L7.4258 7.8936L2 2.4678L2.3535 2.1138L7.7793 7.5396L13.3193 2L13.6729 2.3535Z" }),
5
+ s: /* @__PURE__ */ jsx("path", { d: "M17.0911 2.9419L10.166 9.8663L17.0911 16.792L16.6492 17.2339L9.7241 10.3088L2.9419 17.0911L2.5 16.6492L9.2822 9.867L2.5 3.0847L2.9419 2.6422L9.7241 9.4244L16.6492 2.5L17.0911 2.9419Z" }),
6
+ m: /* @__PURE__ */ jsx("path", { d: "M20.5093 3.5303L12.1992 11.8396L20.5093 20.1504L19.979 20.6807L11.6689 12.3706L3.5303 20.5093L3 19.979L11.1387 11.8403L3 3.7017L3.5303 3.1707L11.6689 11.3093L19.979 3L20.5093 3.5303Z" }),
7
+ l: /* @__PURE__ */ jsx("path", { d: "M27.3457 4.70703L16.2656 15.7861L27.3457 26.8672L26.6387 27.5742L15.5586 16.4941L4.70703 27.3457L4 26.6387L14.8516 15.7871L4 4.93555L4.70703 4.22754L15.5586 15.0791L26.6387 4L27.3457 4.70703Z" })
8
+ };
9
+
10
+ export { close };
11
+ //# sourceMappingURL=close.js.map
12
+ //# sourceMappingURL=close.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/icons/assets/close.tsx"],"names":[],"mappings":";;AAEO,MAAM,KAAA,GAAmB;AAAA,EAC9B,EAAA,kBAAI,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,mLAAA,EAAoL,CAAA;AAAA,EAChM,CAAA,kBAAG,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,wLAAA,EAAyL,CAAA;AAAA,EACpM,CAAA,kBAAG,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,wLAAA,EAAyL,CAAA;AAAA,EACpM,CAAA,kBAAG,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,iMAAA,EAAkM;AAC/M","file":"close.js","sourcesContent":["import type { IconGlyph } from '../types';\n\nexport const close: IconGlyph = {\n xs: <path d=\"M13.6729 2.3535L8.1328 7.8931L13.6729 13.4336L13.3193 13.7871L7.7793 8.2471L2.3535 13.6729L2 13.3193L7.4258 7.8936L2 2.4678L2.3535 2.1138L7.7793 7.5396L13.3193 2L13.6729 2.3535Z\" />,\n s: <path d=\"M17.0911 2.9419L10.166 9.8663L17.0911 16.792L16.6492 17.2339L9.7241 10.3088L2.9419 17.0911L2.5 16.6492L9.2822 9.867L2.5 3.0847L2.9419 2.6422L9.7241 9.4244L16.6492 2.5L17.0911 2.9419Z\" />,\n m: <path d=\"M20.5093 3.5303L12.1992 11.8396L20.5093 20.1504L19.979 20.6807L11.6689 12.3706L3.5303 20.5093L3 19.979L11.1387 11.8403L3 3.7017L3.5303 3.1707L11.6689 11.3093L19.979 3L20.5093 3.5303Z\" />,\n l: <path d=\"M27.3457 4.70703L16.2656 15.7861L27.3457 26.8672L26.6387 27.5742L15.5586 16.4941L4.70703 27.3457L4 26.6387L14.8516 15.7871L4 4.93555L4.70703 4.22754L15.5586 15.0791L26.6387 4L27.3457 4.70703Z\" />,\n};"]}
@@ -4,6 +4,7 @@ var arrowLink = require('./assets/arrow-link');
4
4
  var arrowRight = require('./assets/arrow-right');
5
5
  var chevronLeft = require('./assets/chevron-left');
6
6
  var chevronRight = require('./assets/chevron-right');
7
+ var close = require('./assets/close');
7
8
  var fullscreen = require('./assets/fullscreen');
8
9
  var pause = require('./assets/pause');
9
10
  var play = require('./assets/play');
@@ -32,6 +33,11 @@ const iconManifest = {
32
33
  category: "navigation",
33
34
  tags: ["chevron", "right", "next"]
34
35
  },
36
+ close: {
37
+ glyph: close.close,
38
+ category: "interface",
39
+ tags: ["close", "dismiss", "remove"]
40
+ },
35
41
  fullscreen: {
36
42
  glyph: fullscreen.fullscreen,
37
43
  category: "media",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/icons/manifest.ts"],"names":["arrowLink","arrowRight","chevronLeft","chevronRight","fullscreen","pause","play","settings","sound","soundOff"],"mappings":";;;;;;;;;;;;;AAWO,MAAM,YAAA,GAAe;AAAA,EAC1B,YAAA,EAAc;AAAA,IACZ,KAAA,EAAOA,mBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,MAAA,EAAQ,UAAU;AAAA,GACpC;AAAA,EACA,aAAA,EAAe;AAAA,IACb,KAAA,EAAOC,qBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,MAAM;AAAA,GACjC;AAAA,EACA,cAAA,EAAgB;AAAA,IACd,KAAA,EAAOC,uBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,MAAA,EAAQ,QAAQ,UAAU;AAAA,GAC9C;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,KAAA,EAAOC,yBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,OAAA,EAAS,MAAM;AAAA,GACnC;AAAA,EACA,UAAA,EAAY;AAAA,IACV,KAAA,EAAOC,qBAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,YAAA,EAAc,QAAA,EAAU,QAAQ;AAAA,GACzC;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAOC,WAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,QAAQ;AAAA,GACnC;AAAA,EACA,IAAA,EAAM;AAAA,IACJ,KAAA,EAAOC,SAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,MAAA,EAAQ,OAAA,EAAS,QAAQ;AAAA,GAClC;AAAA,EACA,QAAA,EAAU;AAAA,IACR,KAAA,EAAOC,iBAAA;AAAA,IACP,QAAA,EAAU,WAAA;AAAA,IACV,IAAA,EAAM,CAAC,UAAA,EAAY,aAAA,EAAe,UAAU;AAAA,GAC9C;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAOC,WAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,OAAO;AAAA,GACnC;AAAA,EACA,WAAA,EAAa;AAAA,IACX,KAAA,EAAOC,iBAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,SAAS,MAAM;AAAA;AAE7C","file":"manifest.cjs","sourcesContent":["import { arrowLink } from './assets/arrow-link';\nimport { arrowRight } from './assets/arrow-right';\nimport { chevronLeft } from './assets/chevron-left';\nimport { chevronRight } from './assets/chevron-right';\nimport { fullscreen } from './assets/fullscreen';\nimport { pause } from './assets/pause';\nimport { play } from './assets/play';\nimport { settings } from './assets/settings';\nimport { sound } from './assets/sound';\nimport { soundOff } from './assets/sound-off';\n\nexport const iconManifest = {\n 'arrow-link': {\n glyph: arrowLink,\n category: 'navigation',\n tags: ['arrow', 'link', 'external'],\n },\n 'arrow-right': {\n glyph: arrowRight,\n category: 'navigation',\n tags: ['arrow', 'right', 'next'],\n },\n 'chevron-left': {\n glyph: chevronLeft,\n category: 'navigation',\n tags: ['chevron', 'back', 'left', 'previous'],\n },\n 'chevron-right': {\n glyph: chevronRight,\n category: 'navigation',\n tags: ['chevron', 'right', 'next'],\n },\n fullscreen: {\n glyph: fullscreen,\n category: 'media',\n tags: ['fullscreen', 'expand', 'player'],\n },\n pause: {\n glyph: pause,\n category: 'media',\n tags: ['pause', 'video', 'player'],\n },\n play: {\n glyph: play,\n category: 'media',\n tags: ['play', 'video', 'player'],\n },\n settings: {\n glyph: settings,\n category: 'interface',\n tags: ['settings', 'preferences', 'controls'],\n },\n sound: {\n glyph: sound,\n category: 'media',\n tags: ['sound', 'volume', 'audio'],\n },\n 'sound-off': {\n glyph: soundOff,\n category: 'media',\n tags: ['sound', 'volume', 'audio', 'mute'],\n },\n} as const;"]}
1
+ {"version":3,"sources":["../../src/icons/manifest.ts"],"names":["arrowLink","arrowRight","chevronLeft","chevronRight","close","fullscreen","pause","play","settings","sound","soundOff"],"mappings":";;;;;;;;;;;;;;AAaO,MAAM,YAAA,GAAe;AAAA,EAC1B,YAAA,EAAc;AAAA,IACZ,KAAA,EAAOA,mBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,MAAA,EAAQ,UAAU;AAAA,GACpC;AAAA,EACA,aAAA,EAAe;AAAA,IACb,KAAA,EAAOC,qBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,MAAM;AAAA,GACjC;AAAA,EACA,cAAA,EAAgB;AAAA,IACd,KAAA,EAAOC,uBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,MAAA,EAAQ,QAAQ,UAAU;AAAA,GAC9C;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,KAAA,EAAOC,yBAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,OAAA,EAAS,MAAM;AAAA,GACnC;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAOC,WAAA;AAAA,IACP,QAAA,EAAU,WAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,SAAA,EAAW,QAAQ;AAAA,GACrC;AAAA,EACA,UAAA,EAAY;AAAA,IACV,KAAA,EAAOC,qBAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,YAAA,EAAc,QAAA,EAAU,QAAQ;AAAA,GACzC;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAOC,WAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,QAAQ;AAAA,GACnC;AAAA,EACA,IAAA,EAAM;AAAA,IACJ,KAAA,EAAOC,SAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,MAAA,EAAQ,OAAA,EAAS,QAAQ;AAAA,GAClC;AAAA,EACA,QAAA,EAAU;AAAA,IACR,KAAA,EAAOC,iBAAA;AAAA,IACP,QAAA,EAAU,WAAA;AAAA,IACV,IAAA,EAAM,CAAC,UAAA,EAAY,aAAA,EAAe,UAAU;AAAA,GAC9C;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAOC,WAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,OAAO;AAAA,GACnC;AAAA,EACA,WAAA,EAAa;AAAA,IACX,KAAA,EAAOC,iBAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,SAAS,MAAM;AAAA;AAE7C","file":"manifest.cjs","sourcesContent":["import { arrowLink } from './assets/arrow-link';\nimport { arrowRight } from './assets/arrow-right';\nimport { chevronLeft } from './assets/chevron-left';\nimport { chevronRight } from './assets/chevron-right';\nimport { close } from './assets/close';\nimport { fullscreen } from './assets/fullscreen';\nimport { pause } from './assets/pause';\nimport { play } from './assets/play';\nimport { settings } from './assets/settings';\nimport { sound } from './assets/sound';\nimport { soundOff } from './assets/sound-off';\n\n\nexport const iconManifest = {\n 'arrow-link': {\n glyph: arrowLink,\n category: 'navigation',\n tags: ['arrow', 'link', 'external'],\n },\n 'arrow-right': {\n glyph: arrowRight,\n category: 'navigation',\n tags: ['arrow', 'right', 'next'],\n },\n 'chevron-left': {\n glyph: chevronLeft,\n category: 'navigation',\n tags: ['chevron', 'back', 'left', 'previous'],\n },\n 'chevron-right': {\n glyph: chevronRight,\n category: 'navigation',\n tags: ['chevron', 'right', 'next'],\n },\n close: {\n glyph: close,\n category: 'interface',\n tags: ['close', 'dismiss', 'remove'],\n },\n fullscreen: {\n glyph: fullscreen,\n category: 'media',\n tags: ['fullscreen', 'expand', 'player'],\n },\n pause: {\n glyph: pause,\n category: 'media',\n tags: ['pause', 'video', 'player'],\n },\n play: {\n glyph: play,\n category: 'media',\n tags: ['play', 'video', 'player'],\n },\n settings: {\n glyph: settings,\n category: 'interface',\n tags: ['settings', 'preferences', 'controls'],\n },\n sound: {\n glyph: sound,\n category: 'media',\n tags: ['sound', 'volume', 'audio'],\n },\n 'sound-off': {\n glyph: soundOff,\n category: 'media',\n tags: ['sound', 'volume', 'audio', 'mute'],\n },\n} as const;\n"]}
@@ -19,6 +19,11 @@ export declare const iconManifest: {
19
19
  readonly category: "navigation";
20
20
  readonly tags: readonly ["chevron", "right", "next"];
21
21
  };
22
+ readonly close: {
23
+ readonly glyph: import("./types").IconGlyph;
24
+ readonly category: "interface";
25
+ readonly tags: readonly ["close", "dismiss", "remove"];
26
+ };
22
27
  readonly fullscreen: {
23
28
  readonly glyph: import("./types").IconGlyph;
24
29
  readonly category: "media";
package/icons/manifest.js CHANGED
@@ -2,6 +2,7 @@ import { arrowLink } from './assets/arrow-link';
2
2
  import { arrowRight } from './assets/arrow-right';
3
3
  import { chevronLeft } from './assets/chevron-left';
4
4
  import { chevronRight } from './assets/chevron-right';
5
+ import { close } from './assets/close';
5
6
  import { fullscreen } from './assets/fullscreen';
6
7
  import { pause } from './assets/pause';
7
8
  import { play } from './assets/play';
@@ -30,6 +31,11 @@ const iconManifest = {
30
31
  category: "navigation",
31
32
  tags: ["chevron", "right", "next"]
32
33
  },
34
+ close: {
35
+ glyph: close,
36
+ category: "interface",
37
+ tags: ["close", "dismiss", "remove"]
38
+ },
33
39
  fullscreen: {
34
40
  glyph: fullscreen,
35
41
  category: "media",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/icons/manifest.ts"],"names":[],"mappings":";;;;;;;;;;;AAWO,MAAM,YAAA,GAAe;AAAA,EAC1B,YAAA,EAAc;AAAA,IACZ,KAAA,EAAO,SAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,MAAA,EAAQ,UAAU;AAAA,GACpC;AAAA,EACA,aAAA,EAAe;AAAA,IACb,KAAA,EAAO,UAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,MAAM;AAAA,GACjC;AAAA,EACA,cAAA,EAAgB;AAAA,IACd,KAAA,EAAO,WAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,MAAA,EAAQ,QAAQ,UAAU;AAAA,GAC9C;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,KAAA,EAAO,YAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,OAAA,EAAS,MAAM;AAAA,GACnC;AAAA,EACA,UAAA,EAAY;AAAA,IACV,KAAA,EAAO,UAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,YAAA,EAAc,QAAA,EAAU,QAAQ;AAAA,GACzC;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAO,KAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,QAAQ;AAAA,GACnC;AAAA,EACA,IAAA,EAAM;AAAA,IACJ,KAAA,EAAO,IAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,MAAA,EAAQ,OAAA,EAAS,QAAQ;AAAA,GAClC;AAAA,EACA,QAAA,EAAU;AAAA,IACR,KAAA,EAAO,QAAA;AAAA,IACP,QAAA,EAAU,WAAA;AAAA,IACV,IAAA,EAAM,CAAC,UAAA,EAAY,aAAA,EAAe,UAAU;AAAA,GAC9C;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAO,KAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,OAAO;AAAA,GACnC;AAAA,EACA,WAAA,EAAa;AAAA,IACX,KAAA,EAAO,QAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,SAAS,MAAM;AAAA;AAE7C","file":"manifest.js","sourcesContent":["import { arrowLink } from './assets/arrow-link';\nimport { arrowRight } from './assets/arrow-right';\nimport { chevronLeft } from './assets/chevron-left';\nimport { chevronRight } from './assets/chevron-right';\nimport { fullscreen } from './assets/fullscreen';\nimport { pause } from './assets/pause';\nimport { play } from './assets/play';\nimport { settings } from './assets/settings';\nimport { sound } from './assets/sound';\nimport { soundOff } from './assets/sound-off';\n\nexport const iconManifest = {\n 'arrow-link': {\n glyph: arrowLink,\n category: 'navigation',\n tags: ['arrow', 'link', 'external'],\n },\n 'arrow-right': {\n glyph: arrowRight,\n category: 'navigation',\n tags: ['arrow', 'right', 'next'],\n },\n 'chevron-left': {\n glyph: chevronLeft,\n category: 'navigation',\n tags: ['chevron', 'back', 'left', 'previous'],\n },\n 'chevron-right': {\n glyph: chevronRight,\n category: 'navigation',\n tags: ['chevron', 'right', 'next'],\n },\n fullscreen: {\n glyph: fullscreen,\n category: 'media',\n tags: ['fullscreen', 'expand', 'player'],\n },\n pause: {\n glyph: pause,\n category: 'media',\n tags: ['pause', 'video', 'player'],\n },\n play: {\n glyph: play,\n category: 'media',\n tags: ['play', 'video', 'player'],\n },\n settings: {\n glyph: settings,\n category: 'interface',\n tags: ['settings', 'preferences', 'controls'],\n },\n sound: {\n glyph: sound,\n category: 'media',\n tags: ['sound', 'volume', 'audio'],\n },\n 'sound-off': {\n glyph: soundOff,\n category: 'media',\n tags: ['sound', 'volume', 'audio', 'mute'],\n },\n} as const;"]}
1
+ {"version":3,"sources":["../../src/icons/manifest.ts"],"names":[],"mappings":";;;;;;;;;;;;AAaO,MAAM,YAAA,GAAe;AAAA,EAC1B,YAAA,EAAc;AAAA,IACZ,KAAA,EAAO,SAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,MAAA,EAAQ,UAAU;AAAA,GACpC;AAAA,EACA,aAAA,EAAe;AAAA,IACb,KAAA,EAAO,UAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,MAAM;AAAA,GACjC;AAAA,EACA,cAAA,EAAgB;AAAA,IACd,KAAA,EAAO,WAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,MAAA,EAAQ,QAAQ,UAAU;AAAA,GAC9C;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,KAAA,EAAO,YAAA;AAAA,IACP,QAAA,EAAU,YAAA;AAAA,IACV,IAAA,EAAM,CAAC,SAAA,EAAW,OAAA,EAAS,MAAM;AAAA,GACnC;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAO,KAAA;AAAA,IACP,QAAA,EAAU,WAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,SAAA,EAAW,QAAQ;AAAA,GACrC;AAAA,EACA,UAAA,EAAY;AAAA,IACV,KAAA,EAAO,UAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,YAAA,EAAc,QAAA,EAAU,QAAQ;AAAA,GACzC;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAO,KAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,OAAA,EAAS,QAAQ;AAAA,GACnC;AAAA,EACA,IAAA,EAAM;AAAA,IACJ,KAAA,EAAO,IAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,MAAA,EAAQ,OAAA,EAAS,QAAQ;AAAA,GAClC;AAAA,EACA,QAAA,EAAU;AAAA,IACR,KAAA,EAAO,QAAA;AAAA,IACP,QAAA,EAAU,WAAA;AAAA,IACV,IAAA,EAAM,CAAC,UAAA,EAAY,aAAA,EAAe,UAAU;AAAA,GAC9C;AAAA,EACA,KAAA,EAAO;AAAA,IACL,KAAA,EAAO,KAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,OAAO;AAAA,GACnC;AAAA,EACA,WAAA,EAAa;AAAA,IACX,KAAA,EAAO,QAAA;AAAA,IACP,QAAA,EAAU,OAAA;AAAA,IACV,IAAA,EAAM,CAAC,OAAA,EAAS,QAAA,EAAU,SAAS,MAAM;AAAA;AAE7C","file":"manifest.js","sourcesContent":["import { arrowLink } from './assets/arrow-link';\nimport { arrowRight } from './assets/arrow-right';\nimport { chevronLeft } from './assets/chevron-left';\nimport { chevronRight } from './assets/chevron-right';\nimport { close } from './assets/close';\nimport { fullscreen } from './assets/fullscreen';\nimport { pause } from './assets/pause';\nimport { play } from './assets/play';\nimport { settings } from './assets/settings';\nimport { sound } from './assets/sound';\nimport { soundOff } from './assets/sound-off';\n\n\nexport const iconManifest = {\n 'arrow-link': {\n glyph: arrowLink,\n category: 'navigation',\n tags: ['arrow', 'link', 'external'],\n },\n 'arrow-right': {\n glyph: arrowRight,\n category: 'navigation',\n tags: ['arrow', 'right', 'next'],\n },\n 'chevron-left': {\n glyph: chevronLeft,\n category: 'navigation',\n tags: ['chevron', 'back', 'left', 'previous'],\n },\n 'chevron-right': {\n glyph: chevronRight,\n category: 'navigation',\n tags: ['chevron', 'right', 'next'],\n },\n close: {\n glyph: close,\n category: 'interface',\n tags: ['close', 'dismiss', 'remove'],\n },\n fullscreen: {\n glyph: fullscreen,\n category: 'media',\n tags: ['fullscreen', 'expand', 'player'],\n },\n pause: {\n glyph: pause,\n category: 'media',\n tags: ['pause', 'video', 'player'],\n },\n play: {\n glyph: play,\n category: 'media',\n tags: ['play', 'video', 'player'],\n },\n settings: {\n glyph: settings,\n category: 'interface',\n tags: ['settings', 'preferences', 'controls'],\n },\n sound: {\n glyph: sound,\n category: 'media',\n tags: ['sound', 'volume', 'audio'],\n },\n 'sound-off': {\n glyph: soundOff,\n category: 'media',\n tags: ['sound', 'volume', 'audio', 'mute'],\n },\n} as const;\n"]}
package/index.cjs CHANGED
@@ -89,6 +89,10 @@ Object.defineProperty(exports, "Button", {
89
89
  enumerable: true,
90
90
  get: function () { return button__default.default; }
91
91
  });
92
+ Object.defineProperty(exports, "buttonLink", {
93
+ enumerable: true,
94
+ get: function () { return button.buttonLink; }
95
+ });
92
96
  Object.defineProperty(exports, "Input", {
93
97
  enumerable: true,
94
98
  get: function () { return input__default.default; }
package/index.d.ts CHANGED
@@ -2,8 +2,8 @@
2
2
  * Public API of the design system
3
3
  * Components and patterns only
4
4
  */
5
- export { default as Button } from './components/button';
6
- export type { ButtonProps } from './components/button';
5
+ export { default as Button, buttonLink, } from './components/button';
6
+ export type { ButtonProps, } from './components/button';
7
7
  export { default as Input } from './components/input';
8
8
  export type { InputProps } from './components/input';
9
9
  export { default as Textarea } from './components/textarea';
package/index.js CHANGED
@@ -1,4 +1,4 @@
1
- export { default as Button } from './components/button';
1
+ export { default as Button, buttonLink } from './components/button';
2
2
  export { default as Input } from './components/input';
3
3
  export { default as Textarea } from './components/textarea';
4
4
  export { default as Select } from './components/select';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jvetrau-ds",
3
- "version": "0.2.2",
3
+ "version": "0.2.4",
4
4
  "description": "Multi-brand React design system with semantic tokens",
5
5
  "license": "UNLICENSED",
6
6
  "type": "module",
@@ -2,26 +2,57 @@
2
2
 
3
3
  var jsxRuntime = require('react/jsx-runtime');
4
4
  require('./header.css');
5
+ var Dropdown = require('../../components/dropdown');
5
6
  var classnames = require('../../components/helpers/classnames');
6
7
 
8
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
9
+
10
+ var Dropdown__default = /*#__PURE__*/_interopDefault(Dropdown);
11
+
12
+ function hasContent(value) {
13
+ return value !== null && value !== void 0;
14
+ }
7
15
  const Header = ({
8
16
  logo,
9
17
  menu,
10
18
  avatar,
19
+ avatarDropdown,
20
+ avatarLabel,
11
21
  className = "",
12
22
  children,
13
23
  ...props
14
24
  }) => {
15
- classnames.classnames("header", className, {});
25
+ const classes = classnames.classnames(
26
+ "header",
27
+ className,
28
+ {}
29
+ );
30
+ const resolvedMenu = hasContent(menu) ? menu : children;
31
+ const hasAvatar = hasContent(avatar);
16
32
  return /* @__PURE__ */ jsxRuntime.jsxs(
17
33
  "header",
18
34
  {
19
- className: "header",
35
+ className: classes,
20
36
  ...props,
21
37
  children: [
22
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "header__logo", children: logo }),
23
- (menu || children) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "header__menu", children: menu || children }),
24
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "header__avatar", children: avatar })
38
+ hasContent(logo) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "header__logo", children: logo }),
39
+ hasContent(resolvedMenu) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "header__menu", children: resolvedMenu }),
40
+ hasAvatar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "header__avatar", children: avatarDropdown ? /* @__PURE__ */ jsxRuntime.jsx(
41
+ Dropdown__default.default,
42
+ {
43
+ ...avatarDropdown,
44
+ interaction: "hover",
45
+ trigger: /* @__PURE__ */ jsxRuntime.jsx(
46
+ "button",
47
+ {
48
+ type: "button",
49
+ className: "header__avatar-trigger",
50
+ "aria-label": avatarLabel,
51
+ children: avatar
52
+ }
53
+ )
54
+ }
55
+ ) : avatar })
25
56
  ]
26
57
  }
27
58
  );
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/patterns/header/header.tsx"],"names":["classnames","jsxs","jsx"],"mappings":";;;;;;AAWA,MAAM,SAAgC,CAAC;AAAA,EACrC,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,QAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAM;AACJ,EAAgBA,qBAAA,CAAW,QAAA,EAAU,SAAA,EAAW,EAAE;AAElD,EAAA,uBACEC,eAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,QAAA;AAAA,MACT,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,cAAA,EACZ,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,QAAA,CAEE,QAAQ,QAAA,qBACRA,cAAA,CAAC,SAAI,SAAA,EAAU,cAAA,EACZ,kBAAQ,QAAA,EACX,CAAA;AAAA,wBAGFA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACZ,QAAA,EAAA,MAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ,CAAA;AAEA,IAAO,cAAA,GAAQ","file":"header.cjs","sourcesContent":["import React from 'react';\nimport './header.css';\nimport { classnames } from '../../components/helpers/classnames';\n\nexport interface HeaderProps\n extends React.HTMLAttributes<HTMLElement> {\n logo?: React.ReactNode;\n menu?: React.ReactNode;\n avatar?: React.ReactNode;\n}\n\nconst Header: React.FC<HeaderProps> = ({\n logo,\n menu,\n avatar,\n className = '',\n children,\n ...props\n}) => {\n const classes = classnames('header', className, {});\n\n return (\n <header\n className=\"header\"\n {...props}\n >\n <div className=\"header__logo\">\n {logo}\n </div>\n\n {(menu || children) && (\n <div className=\"header__menu\">\n {menu || children}\n </div>\n )}\n\n <div className=\"header__avatar\">\n {avatar}\n </div>\n </header>\n );\n};\n\nexport default Header;"]}
1
+ {"version":3,"sources":["../../../src/patterns/header/header.tsx"],"names":["classnames","jsxs","jsx","Dropdown"],"mappings":";;;;;;;;;;;AAuCA,SAAS,WACP,KAAA,EAIA;AACA,EAAA,OACE,KAAA,KAAU,QACV,KAAA,KAAU,MAAA;AAEd;AAEA,MAAM,SAAgC,CAAC;AAAA,EACrC,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,QAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAM;AACJ,EAAA,MAAM,OAAA,GAAUA,qBAAA;AAAA,IACd,QAAA;AAAA,IACA,SAAA;AAAA,IACA;AAAC,GACH;AAEA,EAAA,MAAM,YAAA,GACJ,UAAA,CAAW,IAAI,CAAA,GACX,IAAA,GACA,QAAA;AAEN,EAAA,MAAM,SAAA,GACJ,WAAW,MAAM,CAAA;AAEnB,EAAA,uBACEC,eAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,OAAA;AAAA,MACV,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,UAAA,CAAW,IAAI,CAAA,oBACdC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBACZ,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,QAGD,WAAW,YAAY,CAAA,mCACrB,KAAA,EAAA,EAAI,SAAA,EAAU,gBACZ,QAAA,EAAA,YAAA,EACH,CAAA;AAAA,QAGD,SAAA,oBACCA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,kBACZ,QAAA,EAAA,cAAA,mBACCA,cAAA;AAAA,UAACC,yBAAA;AAAA,UAAA;AAAA,YACE,GAAG,cAAA;AAAA,YACJ,WAAA,EAAY,OAAA;AAAA,YACZ,OAAA,kBACED,cAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,QAAA;AAAA,gBACL,SAAA,EAAU,wBAAA;AAAA,gBACV,YAAA,EACE,WAAA;AAAA,gBAGD,QAAA,EAAA;AAAA;AAAA;AACH;AAAA,YAIJ,MAAA,EAEJ;AAAA;AAAA;AAAA,GAEJ;AAEJ,CAAA;AAEA,IAAO,cAAA,GAAQ","file":"header.cjs","sourcesContent":["import React from 'react';\n\nimport './header.css';\nimport Dropdown, {\n type DropdownProps,\n} from '../../components/dropdown';\nimport { classnames } from '../../components/helpers/classnames';\n\ntype HeaderNativeProps =\n React.HTMLAttributes<HTMLElement>;\n\ntype HeaderBaseProps =\n HeaderNativeProps & {\n logo?: React.ReactNode;\n menu?: React.ReactNode;\n };\n\ntype HeaderWithoutAvatarDropdown = {\n avatar?: React.ReactNode;\n avatarDropdown?: never;\n avatarLabel?: never;\n};\n\ntype HeaderWithAvatarDropdown = {\n avatar: React.ReactNode;\n avatarDropdown: Omit<\n DropdownProps,\n 'trigger' | 'interaction'\n >;\n avatarLabel: string;\n};\n\nexport type HeaderProps =\n HeaderBaseProps &\n (\n | HeaderWithoutAvatarDropdown\n | HeaderWithAvatarDropdown\n );\n\nfunction hasContent(\n value: React.ReactNode,\n): value is Exclude<\n React.ReactNode,\n null | undefined\n> {\n return (\n value !== null &&\n value !== undefined\n );\n}\n\nconst Header: React.FC<HeaderProps> = ({\n logo,\n menu,\n avatar,\n avatarDropdown,\n avatarLabel,\n className = '',\n children,\n ...props\n}) => {\n const classes = classnames(\n 'header',\n className,\n {},\n );\n\n const resolvedMenu =\n hasContent(menu)\n ? menu\n : children;\n\n const hasAvatar =\n hasContent(avatar);\n\n return (\n <header\n className={classes}\n {...props}\n >\n {hasContent(logo) && (\n <div className=\"header__logo\">\n {logo}\n </div>\n )}\n\n {hasContent(resolvedMenu) && (\n <div className=\"header__menu\">\n {resolvedMenu}\n </div>\n )}\n\n {hasAvatar && (\n <div className=\"header__avatar\">\n {avatarDropdown ? (\n <Dropdown\n {...avatarDropdown}\n interaction=\"hover\"\n trigger={\n <button\n type=\"button\"\n className=\"header__avatar-trigger\"\n aria-label={\n avatarLabel\n }\n >\n {avatar}\n </button>\n }\n />\n ) : (\n avatar\n )}\n </div>\n )}\n </header>\n );\n};\n\nexport default Header;\n"]}
@@ -77,5 +77,50 @@
77
77
 
78
78
  /* depth */
79
79
 
80
+ /* motion */
81
+ }
82
+
83
+ .header__avatar-trigger {
84
+ /* color */
85
+ background: transparent;
86
+ color: inherit;
87
+
88
+ /* typography */
89
+ font: inherit;
90
+
91
+ /* size */
92
+ display: inline-flex;
93
+ align-items: center;
94
+ justify-content: center;
95
+
96
+ margin: 0;
97
+ padding: 0;
98
+
99
+ /* border */
100
+ border: 0;
101
+
102
+ /* depth */
103
+
104
+ /* motion */
105
+ cursor: pointer;
106
+ }
107
+
108
+ .header__avatar-trigger:focus-visible {
109
+ /* color */
110
+
111
+ /* typography */
112
+
113
+ /* size */
114
+
115
+ /* border */
116
+ outline:
117
+ var(--size-border-width-focus)
118
+ solid
119
+ currentColor;
120
+ outline-offset:
121
+ var(--size-border-offset-focus);
122
+
123
+ /* depth */
124
+
80
125
  /* motion */
81
126
  }
@@ -1,9 +1,21 @@
1
1
  import React from 'react';
2
2
  import './header.css';
3
- export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
3
+ import { type DropdownProps } from '../../components/dropdown';
4
+ type HeaderNativeProps = React.HTMLAttributes<HTMLElement>;
5
+ type HeaderBaseProps = HeaderNativeProps & {
4
6
  logo?: React.ReactNode;
5
7
  menu?: React.ReactNode;
8
+ };
9
+ type HeaderWithoutAvatarDropdown = {
6
10
  avatar?: React.ReactNode;
7
- }
11
+ avatarDropdown?: never;
12
+ avatarLabel?: never;
13
+ };
14
+ type HeaderWithAvatarDropdown = {
15
+ avatar: React.ReactNode;
16
+ avatarDropdown: Omit<DropdownProps, 'trigger' | 'interaction'>;
17
+ avatarLabel: string;
18
+ };
19
+ export type HeaderProps = HeaderBaseProps & (HeaderWithoutAvatarDropdown | HeaderWithAvatarDropdown);
8
20
  declare const Header: React.FC<HeaderProps>;
9
21
  export default Header;
@@ -1,25 +1,52 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import './header.css';
3
+ import Dropdown from '../../components/dropdown';
3
4
  import { classnames } from '../../components/helpers/classnames';
4
5
 
6
+ function hasContent(value) {
7
+ return value !== null && value !== void 0;
8
+ }
5
9
  const Header = ({
6
10
  logo,
7
11
  menu,
8
12
  avatar,
13
+ avatarDropdown,
14
+ avatarLabel,
9
15
  className = "",
10
16
  children,
11
17
  ...props
12
18
  }) => {
13
- classnames("header", className, {});
19
+ const classes = classnames(
20
+ "header",
21
+ className,
22
+ {}
23
+ );
24
+ const resolvedMenu = hasContent(menu) ? menu : children;
25
+ const hasAvatar = hasContent(avatar);
14
26
  return /* @__PURE__ */ jsxs(
15
27
  "header",
16
28
  {
17
- className: "header",
29
+ className: classes,
18
30
  ...props,
19
31
  children: [
20
- /* @__PURE__ */ jsx("div", { className: "header__logo", children: logo }),
21
- (menu || children) && /* @__PURE__ */ jsx("div", { className: "header__menu", children: menu || children }),
22
- /* @__PURE__ */ jsx("div", { className: "header__avatar", children: avatar })
32
+ hasContent(logo) && /* @__PURE__ */ jsx("div", { className: "header__logo", children: logo }),
33
+ hasContent(resolvedMenu) && /* @__PURE__ */ jsx("div", { className: "header__menu", children: resolvedMenu }),
34
+ hasAvatar && /* @__PURE__ */ jsx("div", { className: "header__avatar", children: avatarDropdown ? /* @__PURE__ */ jsx(
35
+ Dropdown,
36
+ {
37
+ ...avatarDropdown,
38
+ interaction: "hover",
39
+ trigger: /* @__PURE__ */ jsx(
40
+ "button",
41
+ {
42
+ type: "button",
43
+ className: "header__avatar-trigger",
44
+ "aria-label": avatarLabel,
45
+ children: avatar
46
+ }
47
+ )
48
+ }
49
+ ) : avatar })
23
50
  ]
24
51
  }
25
52
  );
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/patterns/header/header.tsx"],"names":[],"mappings":";;;;AAWA,MAAM,SAAgC,CAAC;AAAA,EACrC,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,QAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAM;AACJ,EAAgB,UAAA,CAAW,QAAA,EAAU,SAAA,EAAW,EAAE;AAElD,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,QAAA;AAAA,MACT,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,cAAA,EACZ,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,QAAA,CAEE,QAAQ,QAAA,qBACR,GAAA,CAAC,SAAI,SAAA,EAAU,cAAA,EACZ,kBAAQ,QAAA,EACX,CAAA;AAAA,wBAGF,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACZ,QAAA,EAAA,MAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ,CAAA;AAEA,IAAO,cAAA,GAAQ","file":"header.js","sourcesContent":["import React from 'react';\nimport './header.css';\nimport { classnames } from '../../components/helpers/classnames';\n\nexport interface HeaderProps\n extends React.HTMLAttributes<HTMLElement> {\n logo?: React.ReactNode;\n menu?: React.ReactNode;\n avatar?: React.ReactNode;\n}\n\nconst Header: React.FC<HeaderProps> = ({\n logo,\n menu,\n avatar,\n className = '',\n children,\n ...props\n}) => {\n const classes = classnames('header', className, {});\n\n return (\n <header\n className=\"header\"\n {...props}\n >\n <div className=\"header__logo\">\n {logo}\n </div>\n\n {(menu || children) && (\n <div className=\"header__menu\">\n {menu || children}\n </div>\n )}\n\n <div className=\"header__avatar\">\n {avatar}\n </div>\n </header>\n );\n};\n\nexport default Header;"]}
1
+ {"version":3,"sources":["../../../src/patterns/header/header.tsx"],"names":[],"mappings":";;;;;AAuCA,SAAS,WACP,KAAA,EAIA;AACA,EAAA,OACE,KAAA,KAAU,QACV,KAAA,KAAU,MAAA;AAEd;AAEA,MAAM,SAAgC,CAAC;AAAA,EACrC,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,QAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAM;AACJ,EAAA,MAAM,OAAA,GAAU,UAAA;AAAA,IACd,QAAA;AAAA,IACA,SAAA;AAAA,IACA;AAAC,GACH;AAEA,EAAA,MAAM,YAAA,GACJ,UAAA,CAAW,IAAI,CAAA,GACX,IAAA,GACA,QAAA;AAEN,EAAA,MAAM,SAAA,GACJ,WAAW,MAAM,CAAA;AAEnB,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,OAAA;AAAA,MACV,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,UAAA,CAAW,IAAI,CAAA,oBACd,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBACZ,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,QAGD,WAAW,YAAY,CAAA,wBACrB,KAAA,EAAA,EAAI,SAAA,EAAU,gBACZ,QAAA,EAAA,YAAA,EACH,CAAA;AAAA,QAGD,SAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,kBACZ,QAAA,EAAA,cAAA,mBACC,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACE,GAAG,cAAA;AAAA,YACJ,WAAA,EAAY,OAAA;AAAA,YACZ,OAAA,kBACE,GAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,QAAA;AAAA,gBACL,SAAA,EAAU,wBAAA;AAAA,gBACV,YAAA,EACE,WAAA;AAAA,gBAGD,QAAA,EAAA;AAAA;AAAA;AACH;AAAA,YAIJ,MAAA,EAEJ;AAAA;AAAA;AAAA,GAEJ;AAEJ,CAAA;AAEA,IAAO,cAAA,GAAQ","file":"header.js","sourcesContent":["import React from 'react';\n\nimport './header.css';\nimport Dropdown, {\n type DropdownProps,\n} from '../../components/dropdown';\nimport { classnames } from '../../components/helpers/classnames';\n\ntype HeaderNativeProps =\n React.HTMLAttributes<HTMLElement>;\n\ntype HeaderBaseProps =\n HeaderNativeProps & {\n logo?: React.ReactNode;\n menu?: React.ReactNode;\n };\n\ntype HeaderWithoutAvatarDropdown = {\n avatar?: React.ReactNode;\n avatarDropdown?: never;\n avatarLabel?: never;\n};\n\ntype HeaderWithAvatarDropdown = {\n avatar: React.ReactNode;\n avatarDropdown: Omit<\n DropdownProps,\n 'trigger' | 'interaction'\n >;\n avatarLabel: string;\n};\n\nexport type HeaderProps =\n HeaderBaseProps &\n (\n | HeaderWithoutAvatarDropdown\n | HeaderWithAvatarDropdown\n );\n\nfunction hasContent(\n value: React.ReactNode,\n): value is Exclude<\n React.ReactNode,\n null | undefined\n> {\n return (\n value !== null &&\n value !== undefined\n );\n}\n\nconst Header: React.FC<HeaderProps> = ({\n logo,\n menu,\n avatar,\n avatarDropdown,\n avatarLabel,\n className = '',\n children,\n ...props\n}) => {\n const classes = classnames(\n 'header',\n className,\n {},\n );\n\n const resolvedMenu =\n hasContent(menu)\n ? menu\n : children;\n\n const hasAvatar =\n hasContent(avatar);\n\n return (\n <header\n className={classes}\n {...props}\n >\n {hasContent(logo) && (\n <div className=\"header__logo\">\n {logo}\n </div>\n )}\n\n {hasContent(resolvedMenu) && (\n <div className=\"header__menu\">\n {resolvedMenu}\n </div>\n )}\n\n {hasAvatar && (\n <div className=\"header__avatar\">\n {avatarDropdown ? (\n <Dropdown\n {...avatarDropdown}\n interaction=\"hover\"\n trigger={\n <button\n type=\"button\"\n className=\"header__avatar-trigger\"\n aria-label={\n avatarLabel\n }\n >\n {avatar}\n </button>\n }\n />\n ) : (\n avatar\n )}\n </div>\n )}\n </header>\n );\n};\n\nexport default Header;\n"]}