@nice2dev/events

Event & party system components for React applications — chat, rounds, music, attractions, planning, and content controls.

Installation

npm install @nice2dev/events

Peer dependencies: react >= 17.0.0, react-dom >= 17.0.0

Components

| Component | Category | Description | | ------------------------ | ----------- | ----------------------------------------------------- | | NiceEventMedia | Content | Media gallery with upload, photos, and collages | | NiceEventPlanning | Planning | Event planning with dates, location, surveys, billing | | NiceRoundList | Rounds | Round system list with status and scoring | | NiceRoundCard | Rounds | Individual round card with actions, timer, scoreboard | | NiceSongPicker | Music | Song selection for music events | | NiceKaraokePicker | Music | Karaoke song picker with queue management | | NiceAttractionPicker | Attractions | Attraction selection grid with categories | | NiceAttractionVoting | Attractions | Anonymous voting on attractions | | NiceMediaCollage | Content | Ordered photo/video collage with slideshow playback | | NiceParticipantList | Guests | Guest roster with RSVP, check-in, grouping and search | | NiceRsvpControl | Guests | Yes/maybe/no reply with plus-ones, for a public page | | NiceSeatingChart | Seating | Venue seating plan with level-of-detail rendering | | NiceSeatPicker | Seating | Buy-a-ticket seat selection with an accessible list | | NiceExpenseSplit | Money | Shared expenses, balances and a settlement plan | | NiceGiftRegistry | Gifts | Gift registry / wishlist with group gifting | | NiceInvitationDesigner | Invitations | Invitation editor with token preview and bulk send |

Notes on a few of these

• NiceSeatingChart picks its detail level from how many seats are actually in view — sections when zoomed out, row strips in between, individual seats up close — so the number of rendered nodes stays bounded whatever the venue size. Keep showList on for ticket sales: the non-visual section → row → seat picker is the only workable path with a screen reader.
• NiceGiftRegistry covers both a registry and a wishlist via kind. The prop is kind, not variant, because variant already means colour intent across the library.
• NiceExpenseSplit runs on integer minor units, so balances sum to exactly zero. Different currencies are grouped and settled separately, never converted. BillingItem.isPaid means the vendor was paid — not that the group settled up — so it does not affect balances.
• Public pages: NiceGiftRegistry, NiceParticipantList and NiceRsvpControl all work with no signed-in user. An anonymous guest types a name, which arrives as userName with no userId.

Types & Interfaces

• EventModel — Core event data model
• EventParticipant — Participant with role and status
• EventRound — Round definition with scoring
• EventAttraction — Attraction with voting
• EventService — Abstract API interface for backend integration
• ChatMessage, SongEntry, KaraokeSong, BillingItem, EventSurvey, EventMediaItem
• NiceGiftRegistryItem, NiceGiftContribution — gift registry / wishlist entries
• NiceSettlementTransfer, NiceParticipantBalance, NiceExpenseIssue — expense settlement
• NiceRsvpAnswer, NiceRsvpSelection — RSVP replies
• NiceCollageItem, NiceMediaCollageLayout — collage tiles
• SeatingChart, SeatingSection, Seat, SeatStatus, SeatSelectionConfig — venue seating (re-exported from venue/venue-spatial)

⚠ Use VenueZoneOccupancy for the venue capacity reading. The old name ZoneOccupancy is a deprecated alias until 1.2.0: @nice2dev/ui-buildings exports a different ZoneOccupancy (now BuildingZoneOccupancy), so the two collided when both packages were imported.

Usage

import { NiceEventPlanning, NiceRoundList } from '@nice2dev/events';

function EventPage({ event }) {
  return (
    <>
      <NiceEventPlanning event={event} />
      <NiceRoundList rounds={event.rounds} />
    </>
  );
}

License

MIT © NiceToDev