niuma-ui 1.3.9 → 2.0.1

package/CHANGELOG.md

@@ -6,6 +6,48 @@
 
 ## [Unreleased]
 
+## [2.0.1] - 2026-09-21
+
+### 变更
+
+- 单测放到对应模块的 `__tests__/`；跨组件冒烟仍留在 `src/__tests__/`。
+- 每个组件目录增加 `index.ts`，`src/index.ts` 只从目录再导出。
+- `src/lib` 并入 `src/utils`。
+- `RsTreeSelect` 独立目录 `components/tree-select/`。组件与组件之间按 slug 平铺；归类只写文档站 `basic` / `form` / `nav` / `feedback` / `data` / `editor`。
+- 每个组件内部为 `index.ts` + `src/` + 可选 `style/` + `__tests__/`。
+- 表格 `src/` 再拆：`table-header` / `table-body` / `table-footer` / `composables` / `context` / `features` / `utils`。
+- 架构契约补齐目录规范：组件四槽、`src/` 再拆门槛、仓库根、`package.json` 发布面（`docs/components.md` §3）。
+- `:root` 不再默认暗色。未写属性时用浅色 token。暗色宿主请在 `index.html` 写 `data-rs-theme="dark"` 或 `theme="dark"`，避免首屏闪浅色。
+- `themePresets` 标明仅参考，不驱动画面。
+- 文字公开 token 改为 `--rs-text-primary` 等；`--rs-text` / `--rs-muted` / `--rs-placeholder` 降为别名。
+- 数据源品牌色移出通用 `styles.css`。需要官方色的宿主加 `import 'niuma-ui/brand-icons.css'`。
+
+### 新增
+
+- `RsConfigProvider` `theme` 支持 `system`，跟随 `prefers-color-scheme`。`applyTheme` 仍写解析后的 `data-rs-theme="light|dark"`，并标 `data-rs-theme-pref="system"`。
+- `resolveThemeMode` / `readResolvedTheme` / `useRsConfig().resolvedTheme`。无 `data-rs-theme` 时按浅色，与 Provider 默认一致。
+- 内置品牌图标名单 `rsBrandIconNames`；Lucide 走 `--rs-icon-color`。图形规则在 `src/icons/style/brand-icons.css`。
+- `registerRsLocale`：第三方登记 BCP-47 文案；缺 key 回退 en-US。
+- `RsConfigProvider dir`（`ltr` / `rtl` / `auto`），写入 `dir` / `lang` / `data-rs-dir`。
+- 高对比：`forced-colors` 下语义 token 映射系统色。
+- 可选 `niuma-ui/brand-icons.css`：数据源 mark 色。不引入则 mark 为 currentColor。
+
+## [2.0.0] - 2026-09-21
+
+### 破坏性变更
+
+- 移除 Tailwind。`styles.css` 只含 `--rs-*` token、reset 与组件样式；宿主不再需要 `@tailwindcss/vite`。若业务自己写了工具类，在宿主 CSS 里自行引入 Tailwind。
+- 源码按组件分目录：`src/components/{name}/`。表格引擎从 `composables/` 并入 `src/components/table/`。样式源码为 `src/styles/index.css`。
+- 去掉 `exports["./*"]`。只从包根具名导入，不要 `niuma-ui/components/...`。
+- 1.x 维护线见 Git 分支 `1.x`（含 Tailwind 透传约定）。
+
+### 迁移
+
+1. 继续 `import 'niuma-ui/styles.css'`。
+2. 若只为展开本包才装 `@tailwindcss/vite`，可以卸掉。
+3. 深路径导入改回 `import { RsButton } from 'niuma-ui'`。
+4. 仍要 1.3.x 行为请装 `niuma-ui@1` 或跟踪 `1.x` 分支。
+
 ## [1.3.9] - 2026-09-21
 
 ### 新增

package/README.en.md

@@ -11,11 +11,11 @@ Vue 3 **workbench** design system: consistent `Rs*` components, `--rs-*` tokens,
 
 Built for ops consoles, database workbenches, and internal admin UIs. Marketing sites can use named imports. `npm install` pulls Monaco, CodeMirror, and xterm; named imports control the bundle.
 
-**Status:** [Apache License 2.0](./LICENSE) since v1.0.0. Compiled ESM on npm since v1.2.0. Current version is **1.3.8** (`package.json` / npm `niuma-ui`).
+**Status:** [Apache License 2.0](./LICENSE) since v1.0.0. Compiled ESM on npm since v1.2.0. Current line is **2.0.0**. The `1.x` branch keeps the 1.3 line.
 
 ## Features
 
-- **Design tokens** — light / dark via `data-rs-theme` and CSS variables; hosts override a brand layer
+- **Design tokens** — light / dark / system via `data-rs-theme` and CSS variables; hosts override a brand layer
 - **Rs\* components** — Button, Form, Dialog, Table, Tree, Tabs, Anchor, and more
 - **Tooling** — Monaco, CodeMirror, xterm (import only on routes that need them)
 - **Accessibility** — [Reka UI](https://reka-ui.com/) underneath; apps depend only on `niuma-ui`
@@ -29,7 +29,7 @@ Built for ops consoles, database workbenches, and internal admin UIs. Marketing
 | Package manager | npm / pnpm / yarn (this repo develops with pnpm ≥ 9) |
 | Vue | ^3.5 (`peerDependency`) |
 | Bundler | Vite 5+ recommended; `RsMonacoEditor` needs Vite `?worker` |
-| Styles | `import 'niuma-ui/styles.css'` (forwards `@import 'tailwindcss'`); Vite hosts add `@tailwindcss/vite` |
+| Styles | `import 'niuma-ui/styles.css'` (standalone CSS, no Tailwind) |
 
 ## Install
 
@@ -38,7 +38,7 @@ pnpm add niuma-ui
 # or: npm install niuma-ui / yarn add niuma-ui
 ```
 
-Prefer a range such as `^1.3.0`. Pin **1.3.8** when you need a bit-for-bit install.
+Prefer a range such as `^2.0.0`. Pin **2.0.0** for a bit-for-bit install. Use `niuma-ui@1` for the 1.x line.
 
 Local `link`, Vite plugins, and bundle size: **[Consumer guide](./docs/consumers.en.md)** ([中文](./docs/consumers.md)).
 

package/README.md

@@ -11,11 +11,11 @@ Vue 3 **工作台**设计系统：一致的 `Rs*` 组件与 `--rs-*` Token，以
 
 适用于运维控制台、数据库工作台、内部后台。营销站也可以用具名导入。`npm install` 会带上 Monaco、CodeMirror、xterm，体积靠具名导入摇树。
 
-**状态：** [Apache License 2.0](./LICENSE)，自 v1.0.0 开源。自 v1.2.0 起 npm 发布编译 ESM，按包名导入即可。当前版本见 npm 上的 `niuma-ui`（仓库 `package.json` 为 **1.3.8**）。
+**状态：** [Apache License 2.0](./LICENSE)，自 v1.0.0 开源。自 v1.2.0 起 npm 发布编译 ESM。当前主线 **2.0.0**。1.x 见分支 `1.x`。
 
 ## 特性
 
-- **Design Token**：明暗主题走 `data-rs-theme` 与 CSS 变量，宿主用品牌层覆盖
+- **Design Token**：明暗主题走 `data-rs-theme`（`light` / `dark` / `system`）与 CSS 变量，宿主用品牌层覆盖
 - **Rs\* 组件**：Button、Form、Dialog、Table、Tree、Tabs、Anchor 等
 - **专业工具**：Monaco、CodeMirror、xterm（只在用到的路由引入）
 - **无障碍**：底层 [Reka UI](https://reka-ui.com/)，应用只依赖 `niuma-ui`
@@ -29,7 +29,7 @@ Vue 3 **工作台**设计系统：一致的 `Rs*` 组件与 `--rs-*` Token，以
 | 包管理器 | npm / pnpm / yarn（本仓库开发用 pnpm ≥ 9） |
 | Vue | ^3.5（peerDependency） |
 | 打包器 | 推荐 Vite 5+；`RsMonacoEditor` 需要 Vite 处理 `?worker` |
-| 样式 | `import 'niuma-ui/styles.css'`（内含 `@import 'tailwindcss'`）；Vite 宿主加 `@tailwindcss/vite` |
+| 样式 | `import 'niuma-ui/styles.css'`（独立 CSS，不含 Tailwind） |
 
 ## 安装
 
@@ -38,7 +38,7 @@ pnpm add niuma-ui
 # 或 npm install niuma-ui / yarn add niuma-ui
 ```
 
-建议锁定兼容范围，例如 `^1.3.0`。精确复现请钉死版本（当前 **1.3.8**）。
+建议锁定兼容范围，例如 `^2.0.0`。精确复现请钉死 **2.0.0**。1.x 请用 `niuma-ui@1`。
 
 本地改源码、Vite 插件、包体积见 **[消费方指南](./docs/consumers.md)**（[English](./docs/consumers.en.md)）。
 

package/dist/brand-icons.css

@@ -0,0 +1,40 @@
+/**
+ * 工作台品牌 mark 色（可选）。
+ * 用法：在 styles.css 之后 `import 'niuma-ui/brand-icons.css'`。
+ * 不引入时，mark 走 currentColor，与 Lucide 一致。
+ */
+
+:root:not([data-rs-theme]),
+[data-rs-theme='light'] {
+  --rs-icon-ftp-accent: #ea580c;
+  --rs-icon-ftp-on-accent: #ffffff;
+  --rs-icon-redis-accent: #dc382d;
+  --rs-icon-mongodb-accent: #47a248;
+  --rs-icon-vastbase-accent: #ff6f1a;
+  --rs-icon-mysql-accent: #4479a1;
+  --rs-icon-sqlite-accent: #003b57;
+  --rs-icon-dameng-accent: #0000d2;
+  --rs-icon-dameng-wave: #ec1b34;
+  --rs-icon-oracle-accent: #f80000;
+  --rs-icon-clickhouse-accent: #ffcc01;
+  --rs-icon-kingbase-accent: #c9151e;
+  --rs-icon-sqlserver-accent: #cc2927;
+  --rs-icon-postgres-accent: #336791;
+}
+
+[data-rs-theme='dark'] {
+  --rs-icon-ftp-accent: #fb923c;
+  --rs-icon-ftp-on-accent: #ffffff;
+  --rs-icon-redis-accent: #ff6f61;
+  --rs-icon-mongodb-accent: #5cb85c;
+  --rs-icon-vastbase-accent: #ff8a3d;
+  --rs-icon-mysql-accent: #5a9fd4;
+  --rs-icon-sqlite-accent: #5aafd4;
+  --rs-icon-dameng-accent: #4d4dff;
+  --rs-icon-dameng-wave: #ff4d63;
+  --rs-icon-oracle-accent: #ff4d4d;
+  --rs-icon-clickhouse-accent: #ffe066;
+  --rs-icon-kingbase-accent: #ff4d57;
+  --rs-icon-sqlserver-accent: #ff5a57;
+  --rs-icon-postgres-accent: #6a9ec4;
+}

package/dist/components/_shared/index.d.ts

@@ -0,0 +1,4 @@
+export type { RsFeedbackTone, RsToastPosition, RsToastType, RsOverlayAnchorBox, RsOverlayBox } from './src/overlay-utils';
+export { RS_TOAST_DEFAULT_GAP, RS_TOAST_DEFAULT_POSITION, rsToastPositions, rsFeedbackIconClass, placeAnchoredPopup, stepEnabledIndex } from './src/overlay-utils';
+export { useResolvedRsComponentSize, resolveRsComponentSize } from './src/resolve-size';
+export { useResolvedRsRadius, rsRadiusCss } from './src/resolve-radius';

package/dist/components/_shared/src/overlay-utils.js

@@ -0,0 +1,45 @@
+//#region src/components/_shared/src/overlay-utils.ts
+var RS_TOAST_DEFAULT_POSITION = "top-center";
+/** 多条 Toast 之间的垂直间距（px），传给 vue-sonner `gap` */
+var RS_TOAST_DEFAULT_GAP = 4;
+var rsToastPositions = [
+	"top-center",
+	"top-left",
+	"top-right",
+	"bottom-center",
+	"bottom-left",
+	"bottom-right"
+];
+function rsFeedbackIconClass(tone) {
+	return `rs-feedback-icon rs-feedback-icon--${tone}`;
+}
+/**
+* 把浮层贴到锚点：优先下方，视口不够则翻到上方，左右夹进窗口。
+* 对齐 WAI-ARIA APG 浮层惯例与 CSS overflow 避让，不跟某一家组件库的 API。
+*/
+function placeAnchoredPopup(anchor, popup, viewport, gap = 4) {
+	const below = anchor.top + anchor.height + gap;
+	const above = anchor.top - popup.height - gap;
+	const placement = below + popup.height <= viewport.height || above < gap ? "bottom" : "top";
+	const top = placement === "bottom" ? below : Math.max(gap, above);
+	const width = Math.min(popup.width, Math.max(0, viewport.width - gap * 2));
+	const maxLeft = Math.max(gap, viewport.width - width - gap);
+	return {
+		top,
+		left: Math.min(Math.max(gap, anchor.left), maxLeft),
+		width,
+		placement
+	};
+}
+/** 在可选项里按方向跳过 disabled，供 combobox / listbox 方向键与 Home / End。 */
+function stepEnabledIndex(options, current, delta) {
+	if (!options.length) return 0;
+	let index = current;
+	for (let n = 0; n < options.length; n += 1) {
+		index = (index + delta + options.length) % options.length;
+		if (!options[index]?.disabled) return index;
+	}
+	return Math.max(0, current);
+}
+//#endregion
+export { RS_TOAST_DEFAULT_GAP, RS_TOAST_DEFAULT_POSITION, placeAnchoredPopup, rsFeedbackIconClass, rsToastPositions, stepEnabledIndex };

package/dist/components/_shared/src/resolve-radius.d.ts

@@ -0,0 +1,9 @@
+import { type ComputedRef } from 'vue';
+import { type RsRadius } from '../../../theme/types';
+/**
+ * 解析圆角：props → ConfigProvider.controlRadius → 组件默认档。
+ * 业务应传 `radius` / `iconRadius` 或依赖全局配置，避免 :deep 改 border-radius。
+ */
+export declare function useResolvedRsRadius(radius: () => RsRadius | undefined, fallback: RsRadius): ComputedRef<RsRadius>;
+/** 将档位转为可写入 style / CSS 变量的值。 */
+export declare function rsRadiusCss(radius: RsRadius): string;

package/dist/components/_shared/src/resolve-radius.js

@@ -0,0 +1,18 @@
+import { RS_RADIUS_CSS } from "../../../theme/types.js";
+import { useRsConfigOptional } from "../../../composables/useRsConfig.js";
+import { computed } from "vue";
+//#region src/components/_shared/src/resolve-radius.ts
+/**
+* 解析圆角：props → ConfigProvider.controlRadius → 组件默认档。
+* 业务应传 `radius` / `iconRadius` 或依赖全局配置，避免 :deep 改 border-radius。
+*/
+function useResolvedRsRadius(radius, fallback) {
+	const config = useRsConfigOptional();
+	return computed(() => radius() ?? config?.controlRadius.value ?? fallback);
+}
+/** 将档位转为可写入 style / CSS 变量的值。 */
+function rsRadiusCss(radius) {
+	return RS_RADIUS_CSS[radius];
+}
+//#endregion
+export { rsRadiusCss, useResolvedRsRadius };

package/dist/components/_shared/src/resolve-size.d.ts

@@ -0,0 +1,10 @@
+import { type ComputedRef } from 'vue';
+import type { RsComponentSize } from '../../../theme/types';
+import { type RsFormContext } from '../../form/src/form-utils';
+/**
+ * 解析控件尺寸：props → Form → ConfigProvider → md。
+ * 业务应传 `size` 或依赖全局/表单上下文，避免 :deep 改高度。
+ */
+export declare function resolveRsComponentSize(size: RsComponentSize | undefined, form?: RsFormContext | null): ComputedRef<RsComponentSize>;
+/** 在 setup 内便捷解析（自动读 Form / Config）。 */
+export declare function useResolvedRsComponentSize(size: () => RsComponentSize | undefined): ComputedRef<RsComponentSize>;

package/dist/components/_shared/src/resolve-size.js

@@ -0,0 +1,20 @@
+import { useRsConfigOptional } from "../../../composables/useRsConfig.js";
+import { useRsFormContext } from "../../form/src/form-utils.js";
+import { computed } from "vue";
+//#region src/components/_shared/src/resolve-size.ts
+/**
+* 解析控件尺寸：props → Form → ConfigProvider → md。
+* 业务应传 `size` 或依赖全局/表单上下文，避免 :deep 改高度。
+*/
+function resolveRsComponentSize(size, form) {
+	const config = useRsConfigOptional();
+	return computed(() => size ?? form?.size.value ?? config?.controlSize.value ?? "md");
+}
+/** 在 setup 内便捷解析（自动读 Form / Config）。 */
+function useResolvedRsComponentSize(size) {
+	const form = useRsFormContext();
+	const config = useRsConfigOptional();
+	return computed(() => size() ?? form?.size.value ?? config?.controlSize.value ?? "md");
+}
+//#endregion
+export { resolveRsComponentSize, useResolvedRsComponentSize };

package/dist/components/alert/index.d.ts

@@ -0,0 +1 @@
+export { default as RsAlert } from './src/RsAlert.js';

package/dist/components/alert/src/RsAlert.css

@@ -0,0 +1,111 @@
+
+.rs-alert[data-v-2fd45305] {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--rs-alert-gap, var(--rs-space-sm));
+  padding: var(--rs-alert-padding-y, var(--rs-space-md))
+    var(--rs-alert-padding-x, var(--rs-space-lg));
+  border-radius: var(--rs-alert-radius, var(--rs-radius));
+  box-sizing: border-box;
+}
+.rs-alert--bordered[data-v-2fd45305] {
+  border: 1px solid transparent;
+}
+.rs-alert__icon[data-v-2fd45305] {
+  display: inline-flex;
+  flex-shrink: 0;
+  margin-top: 0.125rem;
+}
+.rs-alert__body[data-v-2fd45305] {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+.rs-alert__title[data-v-2fd45305] {
+  font-size: var(--rs-font-size-sm);
+  font-weight: var(--rs-font-weight-semibold);
+  line-height: var(--rs-line-height-tight);
+  color: inherit;
+}
+.rs-alert__content[data-v-2fd45305] {
+  margin-top: var(--rs-space-xs);
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-normal);
+  color: var(--rs-alert-content-fg, var(--rs-muted));
+}
+.rs-alert__close[data-v-2fd45305] {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0;
+  padding: 0.125rem;
+  border: 0;
+  border-radius: var(--rs-radius-sm);
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  opacity: 0.7;
+  outline: none;
+}
+.rs-alert__close[data-v-2fd45305]:hover {
+  opacity: 1;
+  background: color-mix(in srgb, currentColor 10%, transparent);
+}
+.rs-alert__close[data-v-2fd45305]:focus-visible {
+  box-shadow: 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-alert--default[data-v-2fd45305] {
+  background: var(--rs-surface-hover);
+  color: var(--rs-text);
+  border-color: var(--rs-border);
+}
+.rs-alert--default .rs-alert__content[data-v-2fd45305] {
+  color: var(--rs-alert-content-fg, var(--rs-muted));
+}
+.rs-alert--info[data-v-2fd45305] {
+  background: var(--rs-info-container);
+  color: var(--rs-on-info-container);
+  border-color: color-mix(
+    in srgb,
+    var(--rs-info) var(--rs-alert-border-alpha, 35%),
+    transparent
+  );
+}
+.rs-alert--info .rs-alert__content[data-v-2fd45305] {
+  color: color-mix(in srgb, var(--rs-on-info-container) 78%, transparent);
+}
+.rs-alert--success[data-v-2fd45305] {
+  background: var(--rs-success-container);
+  color: var(--rs-on-success-container);
+  border-color: color-mix(
+    in srgb,
+    var(--rs-success) var(--rs-alert-border-alpha, 35%),
+    transparent
+  );
+}
+.rs-alert--success .rs-alert__content[data-v-2fd45305] {
+  color: color-mix(in srgb, var(--rs-on-success-container) 78%, transparent);
+}
+.rs-alert--warning[data-v-2fd45305] {
+  background: var(--rs-warning-container);
+  color: var(--rs-on-warning-container);
+  border-color: color-mix(
+    in srgb,
+    var(--rs-warning) var(--rs-alert-border-alpha, 35%),
+    transparent
+  );
+}
+.rs-alert--warning .rs-alert__content[data-v-2fd45305] {
+  color: color-mix(in srgb, var(--rs-on-warning-container) 78%, transparent);
+}
+.rs-alert--danger[data-v-2fd45305] {
+  background: var(--rs-danger-container);
+  color: var(--rs-on-danger-container);
+  border-color: color-mix(
+    in srgb,
+    var(--rs-danger) var(--rs-alert-border-alpha, 35%),
+    transparent
+  );
+}
+.rs-alert--danger .rs-alert__content[data-v-2fd45305] {
+  color: color-mix(in srgb, var(--rs-on-danger-container) 78%, transparent);
+}

package/dist/components/alert/src/RsAlert.d.ts

@@ -0,0 +1,32 @@
+import type { RsFeedbackTone } from '../../_shared/src/overlay-utils';
+type __VLS_Props = {
+    type?: RsFeedbackTone;
+    title?: string;
+    closable?: boolean;
+    bordered?: boolean;
+};
+declare var __VLS_1: {}, __VLS_8: {}, __VLS_10: {};
+type __VLS_Slots = {} & {
+    icon?: (props: typeof __VLS_1) => any;
+} & {
+    title?: (props: typeof __VLS_8) => any;
+} & {
+    default?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: (event: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    type: RsFeedbackTone;
+    bordered: boolean;
+    closable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/alert/src/RsAlert.impl.js

@@ -0,0 +1,83 @@
+import { useRsI18n } from "../../../composables/useRsI18n.js";
+import RsIcon_default from "../../icon/src/RsIcon.js";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, renderSlot, toDisplayString, unref } from "vue";
+//#region src/components/alert/src/RsAlert.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	class: "rs-alert__icon",
+	"aria-hidden": "true"
+};
+var _hoisted_2 = { class: "rs-alert__body" };
+var _hoisted_3 = {
+	key: 0,
+	class: "rs-alert__title"
+};
+var _hoisted_4 = {
+	key: 1,
+	class: "rs-alert__content"
+};
+var _hoisted_5 = ["aria-label"];
+var RsAlert_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RsAlert",
+	props: {
+		type: { default: "info" },
+		title: {},
+		closable: {
+			type: Boolean,
+			default: false
+		},
+		bordered: {
+			type: Boolean,
+			default: true
+		}
+	},
+	emits: ["close"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { t } = useRsI18n();
+		const iconName = computed(() => {
+			switch (props.type) {
+				case "success": return "circle-check";
+				case "warning": return "triangle-alert";
+				case "danger": return "circle-alert";
+				case "default": return "info";
+				default: return "info";
+			}
+		});
+		const rootClass = computed(() => [
+			"rs-alert",
+			`rs-alert--${props.type}`,
+			{
+				"rs-alert--bordered": props.bordered,
+				"rs-alert--closable": props.closable
+			}
+		]);
+		function onClose(event) {
+			emit("close", event);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass(rootClass.value),
+				role: "alert"
+			}, [
+				createElementVNode("span", _hoisted_1, [renderSlot(_ctx.$slots, "icon", {}, () => [createVNode(RsIcon_default, {
+					name: iconName.value,
+					size: 16
+				}, null, 8, ["name"])], true)]),
+				createElementVNode("div", _hoisted_2, [__props.title || _ctx.$slots.title ? (openBlock(), createElementBlock("div", _hoisted_3, [renderSlot(_ctx.$slots, "title", {}, () => [createTextVNode(toDisplayString(__props.title), 1)], true)])) : createCommentVNode("", true), _ctx.$slots.default ? (openBlock(), createElementBlock("div", _hoisted_4, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])) : createCommentVNode("", true)]),
+				__props.closable ? (openBlock(), createElementBlock("button", {
+					key: 0,
+					type: "button",
+					class: "rs-alert__close",
+					"aria-label": unref(t)("alert.close"),
+					onClick: onClose
+				}, [createVNode(RsIcon_default, {
+					name: "x",
+					size: 14
+				})], 8, _hoisted_5)) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { RsAlert_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/alert/src/RsAlert.js

@@ -0,0 +1,8 @@
+import './RsAlert.css'
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import RsAlert_vue_vue_type_script_setup_true_lang_default from "./RsAlert.impl.js";
+
+//#region src/components/alert/src/RsAlert.vue
+var RsAlert_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsAlert_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-2fd45305"]]);
+//#endregion
+export { RsAlert_default as default };

package/dist/components/anchor/index.d.ts

@@ -0,0 +1,3 @@
+export { default as RsAnchor } from './src/RsAnchor.js';
+export type { RsAnchorFlatItem, RsAnchorItem } from './src/anchor-utils';
+export { flattenAnchorItems, hrefToAnchorId, pickActiveAnchorHref, } from './src/anchor-utils';

package/dist/components/anchor/src/RsAnchor.css

@@ -0,0 +1,65 @@
+
+.rs-anchor[data-v-c95cbe5f] {
+  position: relative;
+  display: flex;
+  gap: 0.7rem;
+  min-width: 8.5rem;
+}
+.rs-anchor--affix[data-v-c95cbe5f] {
+  position: sticky;
+  top: var(--rs-space-lg);
+}
+.rs-anchor__rail[data-v-c95cbe5f] {
+  position: relative;
+  flex-shrink: 0;
+  width: 2px;
+  border-radius: var(--rs-radius-full);
+  background: color-mix(in srgb, var(--rs-border-subtle) 88%, var(--rs-muted));
+}
+.rs-anchor__ink[data-v-c95cbe5f] {
+  position: absolute;
+  inset-inline-start: 0;
+  top: 0;
+  width: 2px;
+  border-radius: inherit;
+  background: var(--rs-primary);
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--rs-primary) 18%, transparent);
+  opacity: 0;
+  transition:
+    transform 180ms ease,
+    height 180ms ease,
+    opacity 180ms ease;
+}
+.rs-anchor__list[data-v-c95cbe5f] {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  flex: 1;
+}
+.rs-anchor__link[data-v-c95cbe5f] {
+  display: block;
+  padding-block: 0.28rem;
+  color: var(--rs-muted);
+  font-size: var(--rs-font-size-xs);
+  line-height: 1.55;
+  text-decoration: none;
+  border-radius: var(--rs-radius-xs);
+  transition: color var(--rs-transition-fast);
+}
+.rs-anchor__link[data-v-c95cbe5f]:hover {
+  color: var(--rs-text);
+}
+.rs-anchor__link[data-v-c95cbe5f]:focus-visible {
+  outline: 2px solid var(--rs-primary);
+  outline-offset: 2px;
+}
+.rs-anchor__link--active[data-v-c95cbe5f] {
+  color: var(--rs-primary);
+  font-weight: 600;
+}
+.rs-anchor--lineless .rs-anchor__link[data-v-c95cbe5f] {
+  padding-inline: 0.45rem;
+}
+.rs-anchor--lineless .rs-anchor__link--active[data-v-c95cbe5f] {
+  background: color-mix(in srgb, var(--rs-primary) 10%, transparent);
+}