Releases: gfazioli/mantine-video
1.1.4
⚡ Improvements
Mantine 9.3.1 → 9.4.0
@mantine/core and @mantine/hooks are aligned to 9.4.0 (latest 9.x minor) in the docs site. The package continues to satisfy its existing >=9.0.0 peer range — Mantine 9.4 is an additive minor (new ComboboxPopover, DataList, EmptyState and Menubar components), with no API or behavior changes for consumers of this package.
🛠️ Other
- Dependency refresh (within existing semver ranges, no major upgrades):
@mantine/core,@mantine/hooks9.3.1 → 9.4.0 (root);@mantine/code-highlight,@mantine/core,@mantine/hooks9.3.1 → 9.4.0 (docs)@storybook/*+storybook10.4.5 → 10.4.6oxfmt^0.55.0 → ^0.56.0oxlint^1.70.0 → ^1.71.0rollup^4.62.0 → ^4.62.2yargs^17.7.2 → ^17.7.3@types/node^22.19.21 → ^22.20.0
📝 Summary
Maintenance patch — no API or behavior changes for @gfazioli/mantine-video. Aligns the docs site to Mantine 9.4.0 and refreshes dev tooling (Storybook 10.4.6, oxfmt 0.56, oxlint 1.71, Rollup 4.62.2) plus a minor @types/node bump.
What's Changed
Full Changelog: 1.1.3...1.1.4
1.1.3
⚡ Improvements
Mantine 9.3.0 → 9.3.1
@mantine/core and @mantine/hooks are aligned to 9.3.1 (latest 9.x patch) in the docs site. The package continues to satisfy its existing >=9.0.0 peer range — no API or behavior changes for consumers.
🛠️ Other
- Dependency refresh (within existing semver ranges, no major upgrades):
@mantine/code-highlight,@mantine/core,@mantine/hooks9.3.0 → 9.3.1 (docs)@storybook/*10.4.2 → 10.4.5oxlint^1.68.0 → ^1.70.0rollup^4.61.0 → ^4.62.0esbuild^0.28.0 → ^0.28.1next,@next/mdx16.2.7 → 16.2.9 (docs)@types/node^22.19.19 → ^22.19.21,@types/react^19.2.16 → ^19.2.17
📝 Summary
Maintenance patch — no API or behavior changes for @gfazioli/mantine-video. Aligns the docs site to Mantine 9.3.1 and refreshes dev tooling (Storybook 10.4.5, oxlint 1.70, Rollup 4.62) plus minor Next/type bumps.
What's Changed
Full Changelog: 1.1.2...1.1.3
1.1.2
⚡ Improvements
Mantine 9.2.2 → 9.3.0
@mantine/core and @mantine/hooks are aligned to 9.3.0 (latest 9.x minor) in the docs site. The package continues to satisfy its existing >=9.0.0 peer range — no API or behavior changes for consumers.
🛠️ Other
- Dependency refresh (within existing semver ranges, no major upgrades):
@mantine/code-highlight,@mantine/core,@mantine/hooks9.2.2 → 9.3.0 (docs)@storybook/*10.4.1 → 10.4.2oxlint^1.67.0 → ^1.68.0rollup^4.60.4 → ^4.61.0react,react-dom19.2.6 → 19.2.7next16.2.6 → 16.2.7 (docs)tsx^4.22.3 → ^4.22.4vite^6.4.2 → ^6.4.3@types/react^19.2.15 → ^19.2.16
- Yarn 4.15.0 → 4.16.0
📝 Summary
Maintenance patch — no API or behavior changes for @gfazioli/mantine-video. Aligns the docs site to Mantine 9.3.0 and refreshes dev tooling (Storybook 10.4.2, oxlint 1.68, Rollup 4.61) plus minor React/Next/type bumps.
What's Changed
Full Changelog: 1.1.1...1.1.2
1.1.1
⚡ Improvements
Mantine 9.2.1 → 9.2.2
@mantine/core and @mantine/hooks are aligned to 9.2.2 (latest 9.2 patch) in the docs site. The package continues to satisfy its existing >=9.0.0 peer range — no API or behavior changes for consumers.
🛠️ Other
- Dependency refresh (within existing semver ranges, no major upgrades):
@mantine/code-highlight,@mantine/core,@mantine/hooks9.2.1 → 9.2.2 (docs)@storybook/*10.4.0 → 10.4.1oxfmt^0.50.0 → ^0.52.0oxlint^1.65.0 → ^1.67.0postcss^8.5.14 → ^8.5.15tsx^4.22.1 → ^4.22.3@types/react^19.2.14 → ^19.2.15
- Yarn 4.14.1 → 4.15.0
- Apply oxfmt 0.52 formatting
📝 Summary
Maintenance patch — no API or behavior changes for @gfazioli/mantine-video. Aligns to Mantine 9.2.2 and refreshes dev tooling (oxfmt 0.52, oxlint 1.67, Storybook 10.4.1) plus minor type/PostCSS/tsx bumps.
What's Changed
Full Changelog: 1.1.0...1.1.1
1.1.0
✨ Features
Multiple sources
- New
sourcesprop accepts an array of{ src, type?, media? }entries, rendered as native<source>children so the browser plays the first format it can decode — the standard cross‑browser / adaptive‑delivery mechanism (e.g. VP9/WebM with an H.264/MP4 fallback). - Each entry supports an optional
type(MIME, lets the browser skip formats it can't decode) andmedia(a media query for resolution‑based selection). - New
fallbackSrcprop (mirrors MantineImage) is loaded once if everysourcesentry fails at runtime (404, decode error). sourcestakes precedence oversrcwhen non‑empty; passing a singlesrckeeps working exactly as before.
⚡ Improvements
— none in this release.
🐛 Bug Fixes
— none in this release.
💥 Breaking changes
— none. sources / fallbackSrc are additive; existing src usage is unchanged.
🛠️ Other
- Raised the
@mantine/core/@mantine/hookspeer‑dependency floor to>=9.0.0to match the Mantine 9 baseline. - Added a self‑hosted
manta.webm(VP9) sample alongside the existing MP4 so the new “Multiple sources” demo shows real codec negotiation.
📝 Summary
@gfazioli/mantine-video v1.1.0 adds first‑class support for multiple media sources. Pass a sources array to ship several formats/codecs and let the browser pick the first it can play (each entry takes an optional type and media), with fallbackSrc loaded if every source fails at runtime — the same pattern Mantine Image uses. Single‑src usage is unaffected.
What's Changed
New Contributors
Full Changelog: 1.0.0...1.1.0
1.0.0 — Mantine Video
1.0.0
First public release of @gfazioli/mantine-video — a Mantine‑native video player component for React.
✨ Features
Core component
<Video />— a polymorphic factory component built on top of the native HTML<video>element, fully integrated with Mantine'suseProps,useStyles,createVarsResolverand Styles API. Supportssrc,poster,autoPlay,muted,loop,playsInline,preload,aspectRatio,radius,colorandsizeprops.- Four built‑in variants:
overlay(default, YouTube‑style),minimal,floating,bordered. - Both controlled and uncontrolled modes for
playing,currentTime,volume,playbackRate.
Headless useVideo hook
- Full state (
playing,paused,ended,currentTime,duration,buffered,volume,muted,playbackRate,fullscreen,pip,isLoading,error,canPlay,canFullscreen,canPiP) and actions (play,pause,toggle,seek,seekBy,setVolume,mute,unmute,toggleMute,setPlaybackRate,requestFullscreen,exitFullscreen,toggleFullscreen,requestPiP,exitPiP,togglePiP). - Defensive sync on mount: catches
loadedmetadataeven if it fires before the listener attaches.
Compound sub‑components (9)
Video.Controls— composable control bar with auto‑hide on idleVideo.PlayButton,Video.SkipButton— play / pause + skip ±N secondsVideo.Timeline— MantineSliderwith live scrub (the underlying<video>seeks in real time while dragging, YouTube‑style) and a buffered‑range overlayVideo.TimeDisplay—current/duration/remaining/current-remainingformatsVideo.MuteButton— speaker icon adapts to current volume levelVideo.FullscreenButton,Video.PiPButton— auto‑hide where the standard browser API is missing (e.g. Firefox)Video.CaptionsButton— auto‑hides when there are no<track>elements
Background video usage
- New
asBackgroundprop turns the player into an absolute‑positioned, cover‑cropped element ready to drop inside any positioned parent — for hero sections, section backdrops, landing pages. - New
backgroundMuteButtonprop renders a discreet floating mute toggle in the bottom‑right corner whenasBackgroundis on. - New
fitprop maps to CSSobject-fit(cover | contain | fill | none | scale-down).
Picture‑in‑Picture
- Built‑in PiP support with capability detection.
onEnterPictureInPicture/onLeavePictureInPicturelifecycle callbacks.- Keyboard shortcut P (when
shortcutsis enabled).
Accessibility & UX
- Full keyboard shortcuts: Space / K (play / pause), J / L (±10 s), ←/→ (±5 s), ↑/↓ (volume), M (mute), F (fullscreen), P (PiP).
- ARIA labels,
aria-pressedon toggles, focus‑visible outlines, capability‑aware buttons that self‑hide.
Styling
- Full Mantine Styles API (
classNames,styles,vars,unstyled) on every sub‑part:root,video,controls,controlBar,playButton,timeline,timelineBuffered,timeDisplay,muteButton,fullscreenButton,pipButton,captionsButton,skipButton,backgroundMuteButton. - Theme‑aware CSS variables:
--video-color,--video-radius,--video-bg,--video-controls-bg,--video-controls-height,--video-controls-text-color,--video-timeline-color,--video-timeline-thumb-color,--video-object-fit.
Docs site
- 10 interactive demos covering basic, configurator, custom controls, headless usage, Picture‑in‑Picture, styles API, and one per variant.
- Two standalone full‑bleed demo pages (
/fullscreenand/homepage) showcasingasBackgroundin real landing‑page scenarios with three different background videos. - Sample videos self‑hosted in
docs/public/videos/(re‑encoded with ffmpeg to keep the repo lightweight) for stable demos that don't depend on external CDNs. - Redesigned footer split into Tier 1 (About / HIGHLIGHTS / MANTINE / APPS) and Tier 2 ("OTHER MANTINE EXTENSIONS" categorized into Layout / Data display / Inputs & Navigation / Effects & Animations) — same structure rolled out to the rest of the ecosystem.
⚡ Improvements
— first release, nothing to improve yet.
🐛 Bug Fixes
— first release, nothing to fix yet.
💥 Breaking changes
— first release, no API to break.
🛠️ Other
- Mantine 9.x and React 19 baseline.
- TypeScript 6 with full type exports for every prop, sub‑component, and the
useVideohook return shape. - Test suite with
jest+@mantine-tests/core(7/7 passing). - Rollup build produces dual ESM + CJS bundles with
'use client'banner; CSS modules hashed with prefixme; layeredstyles.layer.cssavailable. @tabler/icons-reactis an optional peer dependency (only used for the default icons; consumers using a different icon set are not forced to install it).
📝 Summary
@gfazioli/mantine-video ships a complete, Mantine‑native video player for React 19. Three layers in one package: a polished default <Video /> with four variants, a fully composable compound API (Video.Controls, Video.PlayButton, Video.Timeline, …) so you can rebuild the control bar your way, and a headless useVideo hook for fully custom UI. Fullscreen, Picture‑in‑Picture, captions, keyboard shortcuts and live timeline scrubbing are wired in out of the box, and the new asBackground mode turns the same player into a hero background video with one prop.