Krizaka UI
Krizaka UI
Composants

Médias

Vous venez ici pour la vidéo, le son, les images et les fichiers : lecteurs, galeries, visionneuses, envois.

Règle du responsable
Les médias viennent de Bunny par le manifeste de l'application, jamais versés dans le dépôt.
Budget de taille
66.1 kB gzip pour tout le domaine ; il ne fait que baisser.

Entrées

13 entrées, dont 6 utilisées par des produits et sites en production.

  • Audio playerBêtaA sound with a waveform you seek on — the peaks given by the server or computed once with Web Audio — play, time and speed, paused when it leaves the screen.
  • Document viewerBêtaA PDF drawn page by page with pdf.js, and the passages of a report lit where they sit — found from the PDF's own text positions, one box per line; the page and the quote when the text layer cannot place them.7 fichiers l'importent
  • Embed facadeBêtaA platform's short video (TikTok, YouTube Shorts, Instagram) behind a button: until the visitor asks, no frame, no script and no platform picture is requested — the frame is added on the click, sandboxed.1 fichiers l'importent
  • File uploadBêtaA drop zone that checks type, size and count, a list of uploads with preview, progress, speed and the actions each state allows, and a queue that pauses and resumes — Tus-ready without depending on it.5 fichiers l'importent
  • Image viewerBêtaImages full screen on black: pinch and double tap to zoom, swipe between images, swipe down to close.
  • Media galleryBêtaA shop's own photos and loops in tiles — the first featured, loops playing muted while their tile is on screen (a still under reduced motion), a caption on the foot of a tile.
  • Media gridBêtaA feed of videos in mixed orientations that never staggers, with its loading states (MediaGridSkeleton, VideoCardSkeleton, LoadMore): MediaGrid routes the 9:16 clips to a ShortsShelf (equal-height cards, snap scroll, arrows, “See all”) and lays the others in a uniform 16:9 grid; VideoCard is aspect-aware and gives every card the same body height so rows align.
  • Media pickerBêtaPhotos and videos picked from the library or the camera, as a grid of tiles with a remove button and a count.
  • Photo gridBêtaA profile's photos in slots: the first is the main one, empty slots invite to add, photos reorder by drag (web), by their menu (React Native) or by buttons — every move announced.
  • Retro TVBêtaA vertical video presented in a detailed television cabinet, with an accessible player, channel label, scanlines and an animated off-state.1 fichiers l'importent
  • Vertical videoBêtaA 9:16 short video with the action rail of a short-video feed — follow, like, comments, share, your own tip button — and the creator's caption over the picture; ShortFeed stacks them as a snap-scrolling feed that plays the one in view.
  • Video playerBêtaA video with accessible controls — HLS through an hls.js loaded only when needed, signed sources resolved at the last moment, subtitles, speed, full screen, a pause when it leaves the screen.3 fichiers l'importent
  • WaveformBêtaThe bars of a sound, drawn on their own: decorative by default, in the brand's accent or a quiet tone, breathing gently while it plays and still under reduced motion.1 fichiers l'importent

Sur cette page