ropav 0.1.8 → 0.1.9

package/dist/slider.js

@@ -112,6 +112,63 @@ function getSliderTooltipAnchor(tooltip) {
 	return typeof tooltip === "object" && tooltip.anchor === "pointer" ? "pointer" : "thumb";
 }
 //#endregion
+//#region src/components/slider/useSliderPointer.ts
+function readPointerGeometry(track, orientation) {
+	const vertical = orientation === "vertical";
+	const thumbTravelRect = track.querySelector(".rp-slider__thumb")?.getBoundingClientRect();
+	const rect = thumbTravelRect && (vertical ? thumbTravelRect.height > 0 : thumbTravelRect.width > 0) ? thumbTravelRect : track.getBoundingClientRect();
+	const length = vertical ? rect.height : rect.width;
+	if (length <= 0) return;
+	return {
+		length,
+		start: vertical ? rect.bottom : rect.left,
+		vertical
+	};
+}
+function getPointerValue(event, geometry, bounds, step) {
+	const pointerPosition = geometry.vertical ? event.clientY : event.clientX;
+	const ratio = clamp((geometry.vertical ? geometry.start - pointerPosition : pointerPosition - geometry.start) / geometry.length, 0, 1);
+	return normalizeSliderValue(bounds.min + ratio * (bounds.max - bounds.min), bounds.min, bounds.max, step);
+}
+function useSliderPointer(options) {
+	function refreshGeometry(currentSession) {
+		const geometry = readPointerGeometry(currentSession.track, options.orientation());
+		if (!geometry) return false;
+		currentSession.geometry = geometry;
+		return true;
+	}
+	function updateFromPointer(event, currentSession) {
+		options.updateValue(getPointerValue(event, currentSession.geometry, options.bounds.value, options.step.value));
+	}
+	const pointerSession = createPointerSession({
+		onStart(event, currentSession) {
+			event.preventDefault();
+			options.inputRef.value?.focus({ preventScroll: true });
+			updateFromPointer(event, currentSession);
+		},
+		onUpdate: updateFromPointer,
+		refreshGeometry
+	});
+	function onPointerDown(event) {
+		return pointerSession.start(event, () => {
+			if (options.disabled()) return;
+			const track = event.currentTarget;
+			if (!track) return;
+			const geometry = readPointerGeometry(track, options.orientation());
+			if (!geometry) return;
+			return {
+				state: {
+					geometry,
+					track
+				},
+				target: track
+			};
+		});
+	}
+	onBeforeUnmount(pointerSession.stop);
+	return { onPointerDown };
+}
+//#endregion
 //#region src/components/slider/useSliderPointerPreview.ts
 function getPreviewRect(track, vertical) {
 	const travelRect = track.querySelector(".rp-slider__travel")?.getBoundingClientRect();
@@ -357,7 +414,11 @@ function useSliderValueState(props, onChange) {
 	function onInput(event) {
 		if (control.disabled) return;
 		const input = event.target;
-		controllable.setValue(normalizeSliderValue(input.valueAsNumber, bounds.value.min, bounds.value.max, nativeStep.value));
+		updateValue(input.valueAsNumber);
+	}
+	function updateValue(value) {
+		if (control.disabled) return;
+		controllable.setValue(normalizeSliderValue(value, bounds.value.min, bounds.value.max, nativeStep.value));
 	}
 	useFormControl({
 		elements: () => [inputRef.value],
@@ -391,7 +452,8 @@ function useSliderValueState(props, onChange) {
 		markItems,
 		hasMarkLabels,
 		trackSlotProps,
-		onInput
+		onInput,
+		updateValue
 	};
 }
 //#endregion
@@ -436,6 +498,19 @@ function useSlider(props, onChange) {
 		invalid: valueState.control.invalid
 	}));
 	const trackStyle = computed(() => getSliderTrackStyle(props, valueState.valuePercent.value, tooltipState.tooltipPercent.value));
+	const pointerState = useSliderPointer({
+		bounds: valueState.bounds,
+		disabled: () => valueState.control.disabled,
+		inputRef: valueState.inputRef,
+		orientation: () => props.orientation,
+		step: valueState.nativeStep,
+		updateValue: valueState.updateValue
+	});
+	function onTrackPointerDown(event) {
+		const started = pointerState.onPointerDown(event);
+		tooltipState.onTooltipPointerDown(event);
+		return started;
+	}
 	return {
 		inputRef: valueState.inputRef,
 		focus: valueState.focus,
@@ -470,7 +545,7 @@ function useSlider(props, onChange) {
 		tooltipFormattedValue: tooltipState.tooltipFormattedValue,
 		tooltipContent: tooltipState.tooltipContent,
 		onInput: valueState.onInput,
-		onTooltipPointerDown: tooltipState.onTooltipPointerDown,
+		onTrackPointerDown,
 		onTooltipPointerMove: tooltipState.onTooltipPointerMove,
 		onTooltipTrackEnter: tooltipState.onTooltipTrackEnter,
 		onTooltipTrackLeave: tooltipState.onTooltipTrackLeave,
@@ -481,17 +556,17 @@ function useSlider(props, onChange) {
 }
 //#endregion
 //#region src/components/slider/slider.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var t0$2 = template("<span data-v-f21fa11c>");
-var t1$2 = template("<span data-v-f21fa11c class=rp-slider__header>");
-var t2$2 = template("<span data-v-f21fa11c class=\"rp-slider__track-layer rp-slider__track-underlay\"aria-hidden=true>");
-var t3$2 = template("<span data-v-f21fa11c class=\"rp-slider__track-layer rp-slider__track-overlay\"aria-hidden=true>");
-var t4$2 = template("<span data-v-f21fa11c class=rp-slider__travel aria-hidden=true>", 2);
-var t5$1 = template("<span data-v-f21fa11c> ");
-var t6$1 = template("<span data-v-f21fa11c><span data-v-f21fa11c class=rp-slider__mark-dot></span>");
-var t7$1 = template("<span data-v-f21fa11c class=rp-slider__marks aria-hidden=true>");
-var t8$1 = template("<span data-v-f21fa11c class=rp-slider__tooltip-anchor aria-hidden=true></span>", 2);
+var t0$2 = template("<span data-v-0fbfb274>");
+var t1$2 = template("<span data-v-0fbfb274 class=rp-slider__header>");
+var t2$2 = template("<span data-v-0fbfb274 class=\"rp-slider__track-layer rp-slider__track-underlay\"aria-hidden=true>");
+var t3$2 = template("<span data-v-0fbfb274 class=\"rp-slider__track-layer rp-slider__track-overlay\"aria-hidden=true>");
+var t4$2 = template("<span data-v-0fbfb274 class=rp-slider__travel aria-hidden=true>", 2);
+var t5$1 = template("<span data-v-0fbfb274> ");
+var t6$1 = template("<span data-v-0fbfb274><span data-v-0fbfb274 class=rp-slider__mark-dot></span>");
+var t7$1 = template("<span data-v-0fbfb274 class=rp-slider__marks aria-hidden=true>");
+var t8$1 = template("<span data-v-0fbfb274 class=rp-slider__tooltip-anchor aria-hidden=true></span>", 2);
 var t9$1 = template(" ");
-var t10 = template("<label data-v-f21fa11c><span data-v-f21fa11c><span data-v-f21fa11c class=rp-slider__rail aria-hidden=true></span><!><span data-v-f21fa11c></span><!><input data-v-f21fa11c><!><span data-v-f21fa11c><span data-v-f21fa11c class=rp-slider__thumb-content>", 1);
+var t10 = template("<label data-v-0fbfb274><span data-v-0fbfb274><span data-v-0fbfb274 class=rp-slider__rail aria-hidden=true></span><!><span data-v-0fbfb274></span><!><input data-v-0fbfb274><!><span data-v-0fbfb274><span data-v-0fbfb274 class=rp-slider__thumb-content>", 1);
 //#endregion
 //#region src/components/slider/slider.vue
 var slider_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
@@ -554,7 +629,7 @@ var slider_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		const slots = useSlots();
 		const props = __props;
 		const emit = __emit;
-		const { inputRef, focus, control, nativeMin, nativeMax, nativeStep, rootClass, normalizedValue, valuePercent, formattedValue, ariaValueText, markItems, thumbMode, trackSlotProps, trackStyle, trackHovered, dragging, tooltipVisible, tooltipOpen, tooltipAnchor, tooltipPlacement, tooltipId, tooltipColor, tooltipAutoContrast, tooltipContrastColor, tooltipOffset, tooltipOpenDelay, tooltipArrow, tooltipValue, tooltipPercent, tooltipFormattedValue, tooltipContent, onInput, onTooltipPointerDown, onTooltipPointerMove, onTooltipTrackEnter, onTooltipTrackLeave, onTooltipFocusIn, onTooltipFocusOut, onTooltipKeydown } = useSlider(props, (value) => emit("update:modelValue", value));
+		const { inputRef, focus, control, nativeMin, nativeMax, nativeStep, rootClass, normalizedValue, valuePercent, formattedValue, ariaValueText, markItems, thumbMode, trackSlotProps, trackStyle, trackHovered, dragging, tooltipVisible, tooltipOpen, tooltipAnchor, tooltipPlacement, tooltipId, tooltipColor, tooltipAutoContrast, tooltipContrastColor, tooltipOffset, tooltipOpenDelay, tooltipArrow, tooltipValue, tooltipPercent, tooltipFormattedValue, tooltipContent, onInput, onTrackPointerDown, onTooltipPointerMove, onTooltipTrackEnter, onTooltipTrackLeave, onTooltipFocusIn, onTooltipFocusOut, onTooltipKeydown } = useSlider(props, (value) => emit("update:modelValue", value));
 		const { getPartAttrs, getRootAttrs } = useStylesApi(props, "root");
 		const rootAttrs = computed(() => getRootAttrs({
 			class: [rootClass.value, { "rp-slider--custom-thumb": Boolean(slots.thumb) }],
@@ -741,7 +816,7 @@ var slider_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				}
 			});
 		});
-		on(n45, "pointerdown", (e) => unref(onTooltipPointerDown)(e));
+		on(n45, "pointerdown", (e) => unref(onTrackPointerDown)(e));
 		on(n45, "pointerenter", (e) => unref(onTooltipTrackEnter)(e));
 		on(n45, "pointerleave", (e) => unref(onTooltipTrackLeave)(e));
 		on(n45, "pointermove", (e) => unref(onTooltipPointerMove)(e));
@@ -750,7 +825,7 @@ var slider_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		on(n45, "keydown", (e) => unref(onTooltipKeydown)(e));
 		return n48;
 	}
-}), [["__scopeId", "data-v-f21fa11c"]]);
+}), [["__scopeId", "data-v-0fbfb274"]]);
 //#endregion
 //#region src/components/slider/useRangeSliderTooltipCollision.ts
 var TOOLTIP_COLLISION_GAP = 4;

package/dist/toolbar.css

@@ -0,0 +1,15 @@
+@layer ropav.components {
+.rp-toolbar[data-v-34ce03a4] {
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    gap: var(--rp-spacing-2);
+    min-width: 0;
+    font-family: var(--rp-font-family);
+}
+.rp-toolbar--vertical[data-v-34ce03a4] {
+    flex-direction: column;
+    align-items: stretch;
+    min-height: 0;
+}
+}

package/dist/toolbar.js

@@ -0,0 +1,143 @@
+import './toolbar.css';
+import { t as useStylesApi } from "./styles-api.js";
+import { t as bem } from "./bem.js";
+import { t as isElement } from "./query.js";
+import { n as setFocusNavigationTabStop, t as getFocusNavigationTarget } from "./focusNavigation.js";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createSlot, defineVaporComponent, onBeforeUnmount, onMounted, renderEffect, setDynamicProps, setInsertionState, setStaticTemplateRef, shallowRef, template } from "vue";
+//#region src/components/toolbar/useToolbar.ts
+var TOOLBAR_SELECTOR = "[role=\"toolbar\"]";
+var TOOLBAR_ITEM_SELECTOR = [
+	"button",
+	"a[href]",
+	"input:not([type=\"hidden\"])",
+	"select",
+	"textarea",
+	"[contenteditable=\"true\"]",
+	"[role=\"button\"]",
+	"[role=\"checkbox\"]",
+	"[role=\"combobox\"]",
+	"[role=\"link\"]",
+	"[role=\"radio\"]",
+	"[role=\"slider\"]",
+	"[role=\"spinbutton\"]",
+	"[role=\"switch\"]",
+	"[tabindex]"
+].join(",");
+var TOOLBAR_NAVIGATION_OPTIONS = {
+	itemSelector: TOOLBAR_ITEM_SELECTOR,
+	collectionSelector: TOOLBAR_SELECTOR
+};
+function useToolbar(root, getOrientation) {
+	const activeItem = shallowRef(null);
+	let observer = null;
+	function setTabStop(item) {
+		const toolbar = root.value;
+		if (!toolbar) return null;
+		const nextItem = setFocusNavigationTabStop(toolbar, item, TOOLBAR_NAVIGATION_OPTIONS);
+		activeItem.value = nextItem;
+		return nextItem;
+	}
+	function syncTabStop() {
+		setTabStop(activeItem.value);
+	}
+	function onFocusin(event) {
+		const toolbar = root.value;
+		if (!toolbar || !isElement(event.target)) return;
+		const item = event.target.closest(TOOLBAR_ITEM_SELECTOR);
+		if (item?.closest(TOOLBAR_SELECTOR) === toolbar) setTabStop(item);
+	}
+	function onKeydown(event) {
+		const toolbar = root.value;
+		if (!toolbar) return;
+		const nextItem = getFocusNavigationTarget(event, toolbar, {
+			...TOOLBAR_NAVIGATION_OPTIONS,
+			orientation: getOrientation()
+		});
+		if (!nextItem) return;
+		event.preventDefault();
+		setTabStop(nextItem);
+		nextItem.focus();
+	}
+	function focus() {
+		setTabStop(activeItem.value)?.focus();
+	}
+	onMounted(() => {
+		const toolbar = root.value;
+		if (!toolbar) return;
+		syncTabStop();
+		const MutationObserverConstructor = toolbar.ownerDocument.defaultView?.MutationObserver;
+		if (!MutationObserverConstructor) return;
+		observer = new MutationObserverConstructor(syncTabStop);
+		observer.observe(toolbar, {
+			attributes: true,
+			attributeFilter: [
+				"disabled",
+				"hidden",
+				"inert"
+			],
+			childList: true,
+			subtree: true
+		});
+	});
+	onBeforeUnmount(() => observer?.disconnect());
+	return {
+		focus,
+		onFocusin,
+		onKeydown
+	};
+}
+//#endregion
+//#region src/components/toolbar/toolbar.vue?vue&type=script&setup=true&vapor=true&lang.ts
+var t0 = template("<div data-v-34ce03a4>", 1);
+//#endregion
+//#region src/components/toolbar/toolbar.vue
+var toolbar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
+	name: "RpToolbar",
+	inheritAttrs: false,
+	__name: "toolbar",
+	props: {
+		id: {},
+		orientation: { default: "horizontal" },
+		ariaLabel: {},
+		describedby: {},
+		labelledby: {},
+		classNames: {},
+		styles: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const root = shallowRef(null);
+		const { focus, onFocusin, onKeydown } = useToolbar(root, () => props.orientation);
+		const rootClass = computed(() => bem("rp-toolbar", { vertical: props.orientation === "vertical" }));
+		const { getRootAttrs } = useStylesApi(props, "root");
+		const rootAttrs = computed(() => getRootAttrs({
+			id: props.id,
+			class: rootClass.value,
+			role: "toolbar",
+			"data-orientation": props.orientation,
+			"aria-orientation": props.orientation,
+			"aria-label": props.ariaLabel || void 0,
+			"aria-labelledby": props.labelledby,
+			"aria-describedby": props.describedby,
+			onFocusin,
+			onKeydown
+		}));
+		__expose({
+			nativeElement: root,
+			focus
+		});
+		const n1 = t0();
+		renderEffect(() => setDynamicProps(n1, [rootAttrs.value]));
+		setInsertionState(n1, null, 0);
+		createSlot("default", null, null, 1);
+		setStaticTemplateRef(n1, root, null, "root");
+		return n1;
+	}
+}), [["__scopeId", "data-v-34ce03a4"]]);
+//#endregion
+//#region src/components/toolbar/types.ts
+var toolbarParts = ["root"];
+var toolbarOrientations = ["horizontal", "vertical"];
+//#endregion
+export { toolbarParts as n, toolbar_default as r, toolbarOrientations as t };

package/dist/utils/dom/focusNavigation.d.ts

@@ -1,7 +1,10 @@
 export type FocusNavigationOrientation = 'horizontal' | 'vertical';
-export interface FocusNavigationOptions {
+export interface FocusNavigationCollectionOptions {
     itemSelector: string;
     collectionSelector: string;
+}
+export interface FocusNavigationOptions extends FocusNavigationCollectionOptions {
     orientation: FocusNavigationOrientation;
 }
+export declare function setFocusNavigationTabStop<ElementType extends HTMLElement>(collection: HTMLElement, preferredItem: ElementType | null, options: FocusNavigationCollectionOptions): ElementType | null;
 export declare function getFocusNavigationTarget<ElementType extends HTMLElement>(event: Pick<KeyboardEvent, 'key' | 'target'>, collection: HTMLElement, options: FocusNavigationOptions): ElementType | undefined;

package/docs/public-styles-api.md

@@ -81,6 +81,9 @@ Only independently useful semantic elements are public parts. Conditional parts
 
 `ToastProvider` renders no DOM and therefore has no Styles API.
 
+When `Calendar.showHeader` is `false`, the `header`, `previousControl` and `nextControl` parts are
+not rendered. The `monthLabel` part remains as a visually hidden live label for the calendar grid.
+
 ## State attributes
 
 Boolean states use presence semantics: the attribute value is empty when true and the attribute is absent when false or unknown. Enum values are lowercase kebab-case.
@@ -141,6 +144,6 @@ Place global resets in `reset` and application overrides in `app`. Import order
 - Typed parts, state attributes, manifest entries, geometry variables and cascade layers form the current Public Styles API.
 - Renaming or removing a documented part, state attribute or variable changes the public contract.
 - Adding a public part, state attribute or variable extends the public contract.
-- `tokens:check` compares the current manifest with the latest reachable `v*` release tag that contains one. Released variables cannot be removed, renamed or changed semantically; adding a variable requires incrementing the manifest's `contractVersion`.
+- `tokens:check` compares the current manifest with the latest reachable `ropav@*` release tag that contains one. Until the first package-specific release exists, it falls back to legacy `v*` tags and their pre-monorepo manifest path. Released variables cannot be removed, renamed or changed semantically; adding a variable requires incrementing the manifest's `contractVersion`.
 - Release tags must be available in the Git checkout that runs the check. `PUBLIC_STYLES_BASELINE_REF` can explicitly select another Git ref that contains a manifest.
 - Internal DOM, selectors and undocumented variables are outside the public contract.

package/package.json

@@ -1,9 +1,8 @@
 {
   "name": "ropav",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "license": "MIT",
   "type": "module",
-  "packageManager": "pnpm@11.17.0",
   "engines": {
     "node": "^20.19.0 || ^22.13.0 || >=24.0.0"
   },
@@ -213,6 +212,10 @@
       "types": "./dist/components/toast/index.d.ts",
       "import": "./dist/components/toast/index.js"
     },
+    "./toolbar": {
+      "types": "./dist/components/toolbar/index.d.ts",
+      "import": "./dist/components/toolbar/index.js"
+    },
     "./tooltip": {
       "types": "./dist/components/tooltip/index.d.ts",
       "import": "./dist/components/tooltip/index.js"
@@ -226,36 +229,6 @@
     "./styles-manifest.json": "./src/styles/styles-manifest.json",
     "./scss/*.scss": "./src/styles/*.scss"
   },
-  "scripts": {
-    "dev": "pnpm run storybook",
-    "publication:sync": "node scripts/sync-package-publication.mjs --write",
-    "publication:check": "node scripts/sync-package-publication.mjs --check",
-    "publication:verify": "node scripts/verify-package-publication.mjs",
-    "tokens:build": "style-dictionary build --config scripts/tokens.config.mjs --silent",
-    "tokens:check": "node scripts/check-tokens.mjs",
-    "typecheck": "vue-tsc -b tsconfig.app.json tsconfig.node.json tsconfig.test.json",
-    "typecheck:storybook": "vue-tsc -p tsconfig.storybook.json --noEmit",
-    "lint": "oxlint",
-    "lint:fix": "oxlint --fix",
-    "format": "oxfmt",
-    "format:check": "oxfmt --check",
-    "test": "vitest run --project=unit --project=tooling",
-    "test:consumer-types:built": "tsc -p tests/fixtures/consumer-types/tsconfig.bundler.json && tsc -p tests/fixtures/consumer-types/tsconfig.nodenext.json",
-    "test:bundle:built": "node scripts/check-package-bundle.mjs",
-    "test:consumer-fixture:built": "node tests/fixtures/consumer-app/check.mjs && vue-tsc -p tests/fixtures/consumer-app/tsconfig.json --noEmit && vite build --config tests/fixtures/consumer-app/vite.config.ts && node tests/fixtures/consumer-app/assertions.mjs",
-    "test:package": "pnpm run build && pnpm run publication:verify && pnpm run test:bundle:built && pnpm run test:consumer-types:built && pnpm run test:consumer-fixture:built",
-    "test:watch": "vitest --project=unit --project=tooling",
-    "test:typecheck": "vitest run --project=unit --project=tooling --typecheck",
-    "test:storybook": "vitest run --project=storybook-light --project=storybook-dark",
-    "build": "pnpm run publication:check && pnpm run tokens:build && pnpm run tokens:check && pnpm run typecheck && vite build",
-    "verify": "pnpm run lint && pnpm run format:check && pnpm run typecheck:storybook && pnpm run test && pnpm run test:storybook && pnpm run test:package",
-    "prepublishOnly": "pnpm run verify",
-    "preview": "vite preview",
-    "storybook": "pnpm run tokens:build && storybook dev -p 6006 --no-open",
-    "build-storybook": "pnpm run tokens:build && pnpm run tokens:check && pnpm run typecheck:storybook && storybook build",
-    "changelog": "conventional-changelog -p conventionalcommits -i CHANGELOG.md -o CHANGELOG.md",
-    "release": "pnpm run verify && bumpp --git-check --all --commit \"chore(release): v%s\" --tag \"v%s\" --execute \"pnpm run changelog\""
-  },
   "peerDependencies": {
     "@vue/compiler-vapor": "3.6.0-rc.2",
     "unplugin-icons": "^23.0.1",
@@ -284,12 +257,7 @@
     "@vitest/browser-playwright": "^4.1.10",
     "@vue/compiler-vapor": "3.6.0-rc.2",
     "@vue/tsconfig": "^0.9.1",
-    "bumpp": "^12.0.0",
-    "conventional-changelog": "^8.1.0",
-    "conventional-changelog-conventionalcommits": "^10.2.1",
     "jsdom": "^29.1.1",
-    "oxfmt": "^0.60.0",
-    "oxlint": "^1.75.0",
     "playwright": "^1.61.1",
     "sass-embedded": "^1.100.0",
     "storybook": "^10.5.3",
@@ -305,6 +273,30 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/daopk/ropav"
+    "url": "https://github.com/daopk/ropav",
+    "directory": "packages/ropav"
+  },
+  "scripts": {
+    "dev": "pnpm run storybook",
+    "publication:sync": "node scripts/sync-package-publication.mjs --write",
+    "publication:check": "node scripts/sync-package-publication.mjs --check",
+    "publication:verify": "node scripts/verify-package-publication.mjs",
+    "tokens:build": "style-dictionary build --config scripts/tokens.config.mjs --silent",
+    "tokens:check": "node scripts/check-tokens.mjs",
+    "typecheck": "vue-tsc -b tsconfig.app.json tsconfig.node.json tsconfig.test.json",
+    "typecheck:storybook": "vue-tsc -p tsconfig.storybook.json --noEmit",
+    "test": "vitest run --project=unit --project=tooling",
+    "test:consumer-types:built": "tsc -p tests/fixtures/consumer-types/tsconfig.bundler.json && tsc -p tests/fixtures/consumer-types/tsconfig.nodenext.json",
+    "test:bundle:built": "node scripts/check-package-bundle.mjs",
+    "test:consumer-fixture:built": "node tests/fixtures/consumer-app/check.mjs && vue-tsc -p tests/fixtures/consumer-app/tsconfig.json --noEmit && vite build --config tests/fixtures/consumer-app/vite.config.ts && node tests/fixtures/consumer-app/assertions.mjs",
+    "test:package": "pnpm run build && pnpm run publication:verify && pnpm run test:bundle:built && pnpm run test:consumer-types:built && pnpm run test:consumer-fixture:built",
+    "test:watch": "vitest --project=unit --project=tooling",
+    "test:typecheck": "vitest run --project=unit --project=tooling --typecheck",
+    "test:storybook": "vitest run --project=storybook-light --project=storybook-dark",
+    "build": "pnpm run publication:check && pnpm run tokens:check && pnpm run typecheck && vite build",
+    "verify": "pnpm run typecheck:storybook && pnpm run test && pnpm run test:storybook && pnpm run test:package",
+    "preview": "vite preview",
+    "storybook": "pnpm run tokens:check && storybook dev -p 6006 --no-open",
+    "build-storybook": "pnpm run tokens:check && pnpm run typecheck:storybook && storybook build"
   }
-}
+}

package/docs/code-architecture.md

@@ -1,118 +0,0 @@
-# Code architecture
-
-This guide defines the source structure expected from contributors. The goal is a predictable
-codebase where UI files describe rendering, behavior is testable through small interfaces, and
-shared logic has one obvious home.
-
-## Module seams
-
-A module should hide a meaningful amount of behavior behind a small interface. Extract code around
-a responsibility, not merely to reduce a line count. A useful extraction makes callers simpler and
-lets tests exercise the same interface that production code uses.
-
-Use this dependency direction:
-
-```text
-Vue components and component-local modules
-    -> internal composables
-    -> public composables
-    -> utilities
-```
-
-A higher layer may also import a lower layer directly. Lower layers must not import higher layers:
-
-- `src/utils/` does not import components or composables.
-- `src/composables/` does not import components or internal modules.
-- `src/internal/` does not import components.
-- Components may compose other components when the dependency remains acyclic.
-
-## Where code belongs
-
-| Location                                  | Responsibility                                                        |
-| ----------------------------------------- | --------------------------------------------------------------------- |
-| `src/components/<name>/*.vue`             | Template, bindings, slots, and lightweight view-derived state         |
-| `src/components/<name>/useX.ts`           | Component-specific reactive state, lifecycle, and event orchestration |
-| `src/components/<name>/<concern>Model.ts` | Pure behavior that encodes only that component's contract             |
-| `src/internal/composables/`               | Shared reactive behavior that is not part of the package interface    |
-| `src/composables/`                        | Reusable public composables exported by the package                   |
-| `src/utils/`                              | Reusable runtime helpers without component state or lifecycle         |
-| `src/utils/dom/`                          | Reusable helpers that operate on browser and DOM primitives           |
-| `tests/`, `tooling/`, `scripts/`          | Test, build, and repository automation helpers                        |
-
-Do not add catch-all `utils`, `helpers`, or `core` modules beside a component. Keep a pure helper
-local when it expresses one component's contract, and give it a semantic name such as
-`sliderModel`. Move it to `src/utils/` once more than one feature needs the behavior.
-
-## Component shape
-
-Production SFCs use `<script setup lang="ts" vapor>` and remain zero-VDOM. Do not use `h`, `VNode`,
-`defineComponent`, `createVNode`, or related VDOM block helpers in production source.
-
-Keep SFC blocks in this order:
-
-1. `<template>`
-2. `<script setup lang="ts" vapor>`
-3. `<style>`
-
-Within the script block, use this order:
-
-1. Imports
-2. `defineOptions`, props defaults, emits, and slots
-3. Composable state and template refs
-4. View-derived computed attributes
-5. Small event adapters and `defineExpose`
-
-A short computed value used only to bind the template can stay in the SFC. Move state transitions,
-timers, document listeners, multi-step event handling, and reusable calculations behind a
-composable or pure model interface.
-
-## Function design
-
-Oxlint enforces a conservative baseline of cyclomatic complexity 20, nesting depth 4, at most 5
-parameters, and at most 250 non-blank, non-comment lines per function. These are upper bounds, not
-targets.
-
-- Give each function one reason to change.
-- Prefer guard clauses over deeply nested branches.
-- Use an options object when several parameters describe one concept.
-- Split orchestration into named steps, while keeping the external interface small.
-- Accept dependencies or callbacks at the module seam instead of constructing hard-to-test global
-  dependencies inside the implementation.
-- Return observable results where practical; isolate side effects in lifecycle or event adapters.
-
-Do not create shallow pass-through functions solely to satisfy a metric. A refactor should improve
-the caller, the module interface, or the test surface.
-
-## Imports and package interfaces
-
-- Import utilities directly from their module, for example `@/utils/number`; do not add a utils
-  barrel.
-- Component `index.ts` files define package-facing exports. Internal code should not import from the
-  root package barrel.
-- Keep imports acyclic. If two modules need each other, move the shared behavior to the lowest
-  layer that owns the concept.
-- Use `import type` for type-only dependencies.
-
-## Testing
-
-Test through the interface of the extracted module:
-
-- Pure models and utilities use deterministic unit tests.
-- Composables test returned state and commands, using the smallest host needed for lifecycle
-  behavior.
-- Component tests cover DOM integration, events, accessibility, and public rendering contracts.
-- Storybook tests cover visual and interaction scenarios that depend on real browser layout.
-
-Tests should assert observable behavior rather than private implementation details. Refactoring a
-module internally should not require rewriting its behavioral tests.
-
-## Contributor checklist
-
-Before opening a pull request:
-
-- The SFC primarily adapts props, slots, and composable results to the template.
-- New reusable helpers live in `src/utils/`; feature-only pure logic has a semantic local name.
-- Dependency direction remains downward and acyclic.
-- Functions stay below the enforced complexity, depth, length, and parameter limits.
-- New behavior is tested at the module interface.
-- `pnpm run verify` passes.