@revenexx/studio-shared 0.1.1 → 0.2.0

package/README.md

@@ -4,10 +4,16 @@ Shared revenexx **Studio shell primitives** (`PageHeader`, `SidebarNav`,
 `StateCard`, `StudioCard`, `TabBar`, `KpiTile`, `DataTable`, …) plus the
 **platform provider contract** (`usePlatformAuth` / `usePlatformTenant`).
 
-It's a **Nuxt layer** (ships source): you `extends` it, then add a studio
-module (`@revenexx/studio-integrations`, `@revenexx/studio-commerce`). It's a
+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:
@@ -21,32 +27,36 @@ pnpm add @revenexx/studio-shared @revenexx/studio
 ```ts
 // nuxt.config.ts
 export default defineNuxtConfig({
-  extends: ['@revenexx/studio-shared'],
-  modules: ['@solar-icons/nuxt'], // provides the #solar-icons the primitives use
+  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`.
+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 **source**, not precompiled CSS — Tailwind generates their
-classes from **your** build. Add this package 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:
+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:
 
 ```css
 /* 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/components";
+@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, plus the
-consumer must register `@solar-icons/nuxt`.
+`@revenexx/studio` (design system + tokens), `nuxt` ^4, `vue` ^3.5,
+`vue-sonner` ^2, plus the consumer must register `@solar-icons/nuxt`.

package/dist/module.d.mts

@@ -0,0 +1,9 @@
+import * as nuxt_schema from 'nuxt/schema';
+export * from '../dist/runtime/components/DataTable/types.js';
+export { SidebarNavItem, SidebarNavSection } from '../dist/runtime/types/nav.js';
+export { PlatformAuth } from '../dist/runtime/composables/usePlatformAuth.js';
+export { PlatformTenant } from '../dist/runtime/composables/usePlatformTenant.js';
+
+declare const _default: nuxt_schema.NuxtModule<nuxt_schema.ModuleOptions, nuxt_schema.ModuleOptions, false>;
+
+export { _default as default };

package/dist/module.json

@@ -0,0 +1,9 @@
+{
+  "name": "studio-shared",
+  "configKey": "studioShared",
+  "version": "0.2.0",
+  "builder": {
+    "@nuxt/module-builder": "1.0.2",
+    "unbuild": "unknown"
+  }
+}

package/dist/module.mjs

@@ -0,0 +1,27 @@
+import { join } from 'node:path';
+import { defineNuxtModule, createResolver, addComponentsDir, addImports } from '@nuxt/kit';
+
+const module$1 = defineNuxtModule({
+  meta: {
+    name: "studio-shared",
+    configKey: "studioShared"
+  },
+  setup(_options, nuxt) {
+    const { resolve } = createResolver(import.meta.url);
+    const runtime = resolve("./runtime");
+    nuxt.options.imports = nuxt.options.imports || {};
+    nuxt.options.imports.transform = nuxt.options.imports.transform || {};
+    nuxt.options.imports.transform.include = nuxt.options.imports.transform.include || [];
+    nuxt.options.imports.transform.include.push(
+      new RegExp(runtime.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"))
+    );
+    nuxt.options.build.transpile.push(runtime);
+    addComponentsDir({ path: join(runtime, "components"), pathPrefix: false });
+    addImports([
+      { name: "usePlatformAuth", from: join(runtime, "composables/usePlatformAuth"), priority: -1 },
+      { name: "usePlatformTenant", from: join(runtime, "composables/usePlatformTenant"), priority: -1 }
+    ]);
+  }
+});
+
+export { module$1 as default };

package/dist/runtime/components/DataTable/ColumnsMenu.d.vue.ts

@@ -0,0 +1,12 @@
+import type { DataTableColumn } from './types.js';
+type __VLS_Props = {
+    columns: DataTableColumn[];
+    /** Set of currently visible column keys. */
+    visible: Set<string>;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    toggle: (key: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onToggle?: ((key: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/{components → dist/runtime/components}/DataTable/ColumnsMenu.vue

@@ -1,26 +1,19 @@
-<script setup lang="ts">
-import { Widget as Columns, CheckCircle as Check } from '#solar-icons'
+<script setup>
+import { Widget as Columns, CheckCircle as Check } from "#solar-icons";
 import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from '@revenexx/studio'
-import type { DataTableColumn } from './types'
-
-const props = defineProps<{
-  columns: DataTableColumn[]
-  /** Set of currently visible column keys. */
-  visible: Set<string>
-}>()
-
-const emit = defineEmits<{
-  toggle: [key: string]
-}>()
-
-const toggleable = computed(() => props.columns.filter(c => c.toggleable !== false))
+  DropdownMenuTrigger
+} from "@revenexx/studio";
+const props = defineProps({
+  columns: { type: Array, required: true },
+  visible: { type: Set, required: true }
+});
+const emit = defineEmits(["toggle"]);
+const toggleable = computed(() => props.columns.filter((c) => c.toggleable !== false));
 </script>
 
 <template>

package/dist/runtime/components/DataTable/ColumnsMenu.vue.d.ts

@@ -0,0 +1,12 @@
+import type { DataTableColumn } from './types.js';
+type __VLS_Props = {
+    columns: DataTableColumn[];
+    /** Set of currently visible column keys. */
+    visible: Set<string>;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    toggle: (key: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onToggle?: ((key: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/DataTable/DataTable.d.vue.ts

@@ -0,0 +1,59 @@
+import type { DataTableColumn, DataTableFilter, DataTableState, RowKey, SortState } from './types.js';
+declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly "onUpdate:sort"?: ((value: SortState) => any) | undefined;
+        readonly "onUpdate:page"?: ((value: number) => any) | undefined;
+        readonly onRowClick?: ((row: T) => any) | undefined;
+        readonly onStateChange?: ((state: DataTableState) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:sort" | "onUpdate:page" | "onRowClick" | "onStateChange"> & ({
+        data: T[];
+        columns: DataTableColumn<T>[];
+        rowKey: RowKey<T>;
+        search?: boolean | {
+            placeholder?: string;
+        };
+        columnsMenu?: boolean;
+        filter?: boolean;
+        /** Built-in status/dimension filter pills (static mode). One dimension, or
+         *  several (each renders as its own sub-menu). */
+        filterTabs?: DataTableFilter<T> | DataTableFilter<T>[];
+        pagination?: boolean | {
+            pageSize?: number;
+        };
+        defaultSort?: {
+            column: string;
+            direction: "asc" | "desc";
+        };
+        serverMode?: boolean;
+        total?: number;
+        loading?: boolean;
+        emptyText?: string;
+        groupBy?: ((row: T) => string[]) | null;
+        groupEmptyLabel?: string;
+    } & {
+        sort?: SortState;
+        page?: number;
+    }) & Partial<{}>> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {
+        [x: string]: ((props: {
+            row: any;
+        }) => any) | undefined;
+    } & {
+        'filter-menu'?: (props: {}) => any;
+    } & {
+        'toolbar-left'?: (props: {}) => any;
+    } & {
+        actions?: (props: {}) => any;
+    } & {
+        empty?: (props: {}) => any;
+    };
+    emit: (((evt: "rowClick", row: T) => void) & ((evt: "stateChange", state: DataTableState) => void)) & (((evt: "update:sort", value: SortState) => void) & ((evt: "update:page", value: number) => void));
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};