@revenexx/studio-shared

@revenexx/studio-shared

Shared revenexx Studio shell primitives (PageHeader, SidebarNav, StateCard, StudioCard, TabBar, KpiTile, DataTable, …) plus the platform provider contract (usePlatformAuth / usePlatformTenant).

It's a Nuxt module: add it to modules, then add a studio module (@revenexx/studio-integrations, @revenexx/studio-commerce). It's a peer/base of those modules — install it alongside them.

Up to 0.1.x this package was a Nuxt layer (extends). That broke when installed from npm: a layer's nuxt.config is silently dropped when loaded out of node_modules, so components registered with a directory prefix (SharedPageHeader) and every bare <PageHeader> rendered nothing. As a module its setup always runs. Switch extends → modules when upgrading.

Install

Public on npm — no registry config or token needed:

pnpm add @revenexx/studio-shared @revenexx/studio

Use

// nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    '@solar-icons/nuxt', // provides the #solar-icons the primitives use
    '@revenexx/studio-shared',
  ],
})

The components auto-import by bare name (<PageHeader>, <DataTable>, …). Types (DataTableColumn, SidebarNavSection, PlatformAuth, PlatformTenant) import from @revenexx/studio-shared. Individual SFCs stay importable via @revenexx/studio-shared/components/Shared/SidebarNav.vue.

⚠️ Tailwind: you MUST scan this package

The primitives ship uncompiled templates, not precompiled CSS — Tailwind generates their classes from your build. Add the shipped runtime to your Tailwind sources, or classes used only here (e.g. the TabBar active 2px underline: inset-x-2.5 + bg-primary/40) won't be generated and styling silently breaks:

/* your app's main tailwind entry */
@import "tailwindcss";
@import "@revenexx/studio/tokens";   /* design-system tokens */
@import "@revenexx/studio/fonts";
@source "../node_modules/@revenexx/studio-shared/dist/runtime";

Adjust the relative path to reach node_modules from your CSS file.

Peers

@revenexx/studio (design system + tokens), nuxt ^4, vue ^3.5, vue-sonner ^2, plus the consumer must register @solar-icons/nuxt.