@durgarao1208/dynamic-ui-core

The framework-neutral core of Dynamic UI. It checks a proposed appearance (theme, tokens, branding, layout) against rules your application sets, resolves it to plain values, and applies it through a safe session that can undo a failed change. It has no dependency on Angular, the DOM or any UI library.

Most Angular applications use this package through @durgarao1208/dynamic-ui-angular. Use it directly for another framework, a build step or a server.

npm install @durgarao1208/dynamic-ui-core

What it provides

| Export | Purpose | | --- | --- | | createNeutralEvaluator() | Checks a presentation document against trusted host rules and returns a resolved plan, or one redacted diagnostic. | | createSessionFactory() | Creates a session with prepare, preview, activate, rollback, updateContext, subscribe and dispose. Failed changes are undone and the last usable appearance is kept; if there is none, a prepared fallback is used. | | createOwnedTarget(), createCancellation() | Helpers for the session: what a session may write to, and cancelling work in progress. | | serializeResolvedTokens() | Turns resolved tokens into CSS custom property values. | | renderTokenStylesheet() | The same values as CSS text, for a first-paint stylesheet in a build step or static page. It is not server-side rendering. | | createContrastSafety(), contrastRatio(), defaultContrastPairs | WCAG 2.2 AA text and focus contrast checks. This is not a full accessibility audit. | | tokenRoles, customizationSettings | The catalog of token roles and customization settings. | | Types | Presentation documents, host context, plans, outcomes and diagnostics. |

Example

Build a plan from the presets in @durgarao1208/dynamic-ui-themes, then write it as CSS:

import { createNeutralEvaluator, renderTokenStylesheet } from '@durgarao1208/dynamic-ui-core';
import { createHostContext, createPresentation } from '@durgarao1208/dynamic-ui-themes';

const context = createHostContext({ instanceId: 'my.app', navigation: ['home', 'settings'] });
const document = createPresentation({ theme: 'dark', layout: 'sidebar' });

const plan = createNeutralEvaluator().evaluate(document, context);
if (plan.ok) {
  const css = renderTokenStylesheet(plan.value.tokens, ':root');
  if (css.ok) console.log(css.value); // :root { --dui-...: ...; }
} else {
  console.error(plan.diagnostics[0]); // what was rejected and how to correct it
}

Good to know

• The application stays the authority. Configuration, authors and users can only narrow what the host context allows; presentation hiding is not authorization.
• Themes are plain data with one parent each. Unknown parents, cycles and unapproved assets or navigation are rejected.
• Nothing here executes remote scripts. Theme data cannot carry code.
• Semantic versioning applies. A breaking change needs a new major version.

License

MIT