libraryPackage manifestv7.0.4

lib.personalized-presentation

Schema bridge, React provider and hook that resolve lib.personalization preferences and role variant overrides into cockpit-kit variant literals

@lssm-tech/lib.personalized-presentation
Source, release and verification context

Source snapshot bcc79fcc · Declared package version 7.0.4. This page combines the checked-in package guide and manifest; commands and runtime behavior were not executed in this review.

Package source ↗ Manifest ↗
servernode
EXPLORE THE PACKAGE

See where this package fits.

Follow a declared connection, inspect an import, then open the source guide when you need the detail.

THIS PACKAGElib.personalized-presentationplatform

Arrows point from a package to its direct dependency. Each count is derived from the captured manifests.

2 declaracionesSELECT TO INSPECT

@lssm-tech/lib.personalized-presentation

Schema bridge, React provider and hook that resolve lib.personalization preferences and authored role overrides into lib.cockpit-kit variant literals.

Status

Phase 3 — wired dimensions: density, expansion. usePersonalizedVariants resolves them per component through the schema bridge and role overrides.

Installation

This package is an internal workspace package. Add it as a peer or direct dependency from within the monorepo:

JSON
"@lssm-tech/lib.personalized-presentation": "workspace:*"

Peer dependencies

  • @lssm-tech/lib.cockpit-kit — provides Density and Expansion variant types
  • @lssm-tech/lib.personalization — provides PreferenceDimensions
  • react — for the provider and hook

Usage

Provider

tsx
import {
  PersonalizedSurfaceProvider,
  type PersonalizedRoleVariants,
} from "@lssm-tech/lib.personalized-presentation";

const roleVariants: PersonalizedRoleVariants = {
  operator: { components: { NavRail: { expansion: "collapsed" } } },
  executive: {
    surface: { expansion: "collapsed" },
    components: { MetricPanel: { density: "comfortable" } },
  },
};

function App() {
  return (
    <PersonalizedSurfaceProvider
      role={viewerRole}
      prefs={userPrefs}
      roleVariants={roleVariants}
    >
      <MyCockpitSurface />
    </PersonalizedSurfaceProvider>
  );
}

roleVariants is optional. Each role entry may override variants for the whole surface (surface) and per component key (components).

Hook

tsx
import { usePersonalizedVariants } from "@lssm-tech/lib.personalized-presentation";
import { NavRail, type NavRailProps } from "@lssm-tech/lib.cockpit-kit-web/ui/NavRail";

function PersonalizedNavRail(props: NavRailProps) {
  const variants = usePersonalizedVariants("NavRail"); // { density, expansion }
  return <NavRail {...props} {...variants} />;
}

Resolution order, lowest precedence first:

  1. prefs through the schema bridge (density from prefs.density, expansion from prefs.dataDepth).
  2. roleVariants[role].surface.
  3. roleVariants[role].components[componentKey].

Override values outside the cockpit-kit literal unions are ignored, so untyped role configuration falls back to the preference mapping. Outside a provider the hook returns the cockpit-kit defaults (comfortable, expanded). The optional type argument narrows the result and accepts only wired variants: usePersonalizedVariants<{ density: Density }>("Row") returns { density }.

Usar resolvePersonalizedVariants({ role, prefs, componentKey, roleVariants }) from ./variant-resolution for the same resolution outside React.

Schema bridge (direct mapper access)

ts
import {
  density,
  expansion,
  mapPreferencesToVariants,
} from "@lssm-tech/lib.personalized-presentation/schema-bridge";

const cockpitDensity = density("compact");   // → "compact"
const cockpitExpansion = expansion("detailed"); // → "expanded"
const variants = mapPreferencesToVariants(userPrefs); // → { density, expansion }

Dependency direction

code
personalized-presentation → cockpit-kit
personalized-presentation → personalization

cockpit-kit and personalization must NOT depend on this package.

Wired dimensions

Dimension Input type Output type
density PreferenceDimensions["density"] Density
expansion PreferenceDimensions["dataDepth"] Expansion

All other dimensions (verbosity, trigger, panelMode, enrichedKinds, perKindOptOut) are stub-protected and will throw at runtime if called.

Declared capabilities.

Lib Personalized Presentation

Schema bridge, React provider and hook that resolve lib.personalization preferences and role variant overrides into cockpit-kit variant literals

Use it to

  • Adopt schema bridge, react provider and hook that resolve lib.personalization preferences and role variant overrides into cockpit-kit variant literals

Requires

  • TypeScript

Choose another boundary when

  • The @lssm-tech/lib.personalized-presentation package constraints do not match the target runtime or platform.

@lssm-tech/lib.personalized-presentation

@lssm-tech/lib.personalized-presentation/PersonalizedSurfaceProvider

@lssm-tech/lib.personalized-presentation/schema-bridge

@lssm-tech/lib.personalized-presentation/schema/_stubs/enrichedKinds

@lssm-tech/lib.personalized-presentation/schema/_stubs/panelMode

@lssm-tech/lib.personalized-presentation/schema/_stubs/perKindOptOut

@lssm-tech/lib.personalized-presentation/schema/_stubs/trigger

@lssm-tech/lib.personalized-presentation/schema/_stubs/verbosity

@lssm-tech/lib.personalized-presentation/schema/density

@lssm-tech/lib.personalized-presentation/schema/expansion

@lssm-tech/lib.personalized-presentation/use-personalized-variants

@lssm-tech/lib.personalized-presentation/variant-resolution

Imports and export paths.

12 entries

These are package-manifest entry points. Named symbols listed above come from the capability catalogue; this is not an exhaustive TypeScript symbol reference.

12 importaciones

Dependencies and related packages.

Runtime dependencies 2
Peer dependencies 2
react
^19.2.8 || 19.2.3
Development dependencies 7
react
catalog:
react-dom
catalog:
typescript
catalog:

Package scripts.

Commands declared by this package. Review its setup requirements before running them; no command here was executed by this review.

publish:pkgbun publish --tolerate-republish --ignore-scripts --verbose
publish:pkg:canarybun publish:pkg --tag canary
buildbun run prebuild && bun run build:bundle && bun run build:types
build:bundlecontractspec-bun-build transpile --no-bundle
build:typescontractspec-bun-build types
devcontractspec-bun-build dev
cleanrimraf dist .turbo
lintbun lint:fix
lint:fixnode ../../../../scripts/biome.cjs check --write --unsafe --only=nursery/useSortedClasses . && node ../../../../scripts/biome.cjs check --write .
lint:checknode ../../../../scripts/biome.cjs check .
testbun test --pass-with-no-tests
prebuildcontractspec-bun-build prebuild
typechecktsgo --noEmit
Tu vista

Make room for your context.

Shape the presentation around this moment. You can change it whenever you need.

Tu contexto

The different parts of you

Choose a starting point

Una mezcla útil de contexto, imágenes y orientación discreta.

Tune each dimension
Each dimension can change independently. Product permissions and available actions stay unchanged.

Support the way you begin and return

Tune your support

Comodidad de lectura

Elige tu idioma

El idioma de la interfaz solo cambia el texto. Los mercados, precios y flujos de trabajo conservan sus propios ajustes.

Cobertura de traducción

Parte del contenido se muestra en inglés.

Navegación151
Grafo616
Categorías188
Portafolio332
Ejemplos2035
Vista previa de la fuente41

Se añadirán más traducciones a medida que se revise el contenido.

Esta preferencia se guarda en este navegador.

Buscar en el sitio web

Puntos de partida útiles

Sin resultados. Prueba una frase más corta, un nombre de operación u otro ámbito de búsqueda.

UN POCO DE ESPACIO PARA EXPLORAR

Encuentra algo que explorar.

Abre una vista detallada en esta página, prueba otra perspectiva o sigue el detalle a su propia página.

Cómo funcionan las vistas previas y los controles
01

Mirar antes de salir

Pasa el cursor por un enlace o enfócalo con Tab para ver una vista previa. Hacer clic en el enlace original o pulsar Intro siempre abre su destino.

02

Mantener el contexto

Entra en la vista previa para explorar sus secciones. Usa Alt + ↓ desde un enlace enfocado para entrar con el teclado. Escape la cierra.

03

Abrir las posibilidades

Las filas desplegables, las perspectivas y los controles destacados revelan más. Tu vista cambia la comodidad de lectura y el contexto que exploras.

Un botón separado para mirar más de cerca

Muestra pequeños botones de vista previa junto a los enlaces donde haya espacio. Toca el ojo para inspeccionar o el enlace para ir directamente. Esta elección permanece en esta pestaña.

No se recoge historial de navegación. El movimiento reducido sigue tu dispositivo y Tu vista.