{"repo":"pedropalau/react-bnb-gallery","free":true,"listed":false,"github":"https://github.com/pedropalau/react-bnb-gallery","clone":"git clone https://github.com/pedropalau/react-bnb-gallery.git","description":"Accessible React lightbox and photo gallery component inspired by Airbnb’s image gallery.","language":"TypeScript","stars":217,"topics":["photo-gallery","react","image-gallery","accessibility","lightbox","npm","pnpm","react-component","typescript","vite"],"license":"MIT","category":"ui-components","readme_excerpt":"Friendly, customizable and accessible-ready simple photo gallery based on React, inspired by Airbnb. --- Install Import styles once in your app entrypoint: Usage Styling Tokens The distributed stylesheet uses semantic CSS custom properties (shadcn-style token contract). The gallery reads these tokens directly, so you can fully theme it from CSS: - --rbg-radius - --rbg-foreground - --rbg-foreground-subtle - --rbg-foreground-muted - --rbg-overlay - --rbg-icon - --rbg-spinner-track - --rbg-spinner-head - --rbg-photo-shadow - --rbg-z-modal You can override tokens anywhere above the gallery in your cascade: Default light-mode token overrides are applied via .mode-light (or .rbg-light ). CSS Architecture - Namespace: all public classes are prefixed with gallery- to avoid collisions. - States: component state classes use is- ( is-open , is-collapsed , is-active ). - Legacy state aliases ( hide , open , active ) are still emitted for backward compatibility in 2.x . - Deprecated state aliases (removed next major): - loading → is-loading - hide → is-thumbnails-collapsed (figcaption state) or is-open (toggle state) - open → is-collapsed - active → is-active - Selector strategy: prefer direct element hooks ( gallery-photo-button , gallery-thumbnail-image ) instead of deep descendant selectors. - Theming contract: use --rbg- tokens as the stable customization surface. Stable CSS Hooks Prefer these class hooks in custom CSS and tests: - gallery-modal - gallery-overlay - gallery-main - gall","default_branch":null,"files":null,"tree":[],"storefront":"/r/pedropalau","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/pedropalau/react-bnb-gallery/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}