Package exports

The package exposes only stable scoped/namespaced entry points. This page reads the package name/version from package.json.

Install

npm install markup-refine-lib

Complete CSS + optional behavior

import "markup-refine-lib/css";
import "markup-refine-lib/behaviors";

Focused CSS entries

import "markup-refine-lib/tokens";
import "markup-refine-lib/base";
import "markup-refine-lib/components";
import "markup-refine-lib/layout";

Import tokens before base/components/layout when using focused entries standalone.

The /layout entry contains the stable mr-container,mr-stack, mr-cluster, mr-inline, andmr-grid primitives. The historical .group class is deprecated and is not shipped by the stable CSS entries; its layout role is replaced by .mr-cluster.

Canonical .mr-layer* modal/drawer presentation is part of thecomponents stylesheet; Layer behavior itself remains available from the separate JavaScript export below.

Focused Layer API

import { initLayers, layers } from "markup-refine-lib/layers";

initLayers(document);
const outcome = await layers.ask<MyValue>(surface, { trigger });

The focused Layer export is side-effect free. Use initLayers() when consuming it directly; the regular behaviors bundle performs the same declarative initialization as part of its normal scan. The same export includes typedLayerOutcome, ask(), accept(), and dismiss()for local workflow composition.

Focused Tooltip API

import { initTooltips, tooltips } from "markup-refine-lib/tooltips";

tooltips.configure({ showDelay: 400, pinDelay: 1600, closeDelay: 250 });
initTooltips(document);

The Tooltip export is side-effect free and depends on the Layer core for pinned surfaces. The regular behaviors bundle initializes data-mr-tooltiptriggers automatically.

Optional remote Layer navigation

import { layerNavigation } from "markup-refine-lib/layer-navigation";

const outcome = await layerNavigation.ask({
  url: link.href,
  trigger: link,
});

The remote navigation entry depends on the focused Layer API but is intentionally absent from behaviors. Import it only for same-origin, HTML-first modal subinteractions. Cross-origin enhancement, routing, and history management are outside this stable export.

Optional Astro documentation feature

import { defineDocs, DocsPage } from "markup-refine-lib/docs";

import { markupRefineDocs } from "markup-refine-lib/docs/integration";

import { buildSearchIndex } from "markup-refine-lib/docs/search";

/docs exposes the Astro page/navigation abstraction,/docs/integration wires automatic indexing into Astro static builds, and/docs/search exposes the framework-independent static HTML index builder. Astro is an optional peer dependency and is not required by the core CSS/JS exports.

Start with Documentation framework, then useDocumentation API and Search indexingas the detailed references.

Stable API reference

See Stable Layer API for the locked JavaScript, declarative HTML, lifecycle-event, accessibility, and degradation contracts.

Build outputs

Maintainer builds produce unminified and .min.* variants plus source maps.npm run check:layers enforces the stable Layer source/runtime contract. After producing library and documentation builds, npm run check:releaserequires every declared export, minified counterpart, source map, and generated stable documentation page to exist before publish.

MarkupRefineLib

Menu