# @broberg/ui-controls-core 中文文档

规范地址：https://npmcn.com/package/%40broberg/ui-controls-core/

版本：0\.3\.0
npm 元数据更新时间：2026-10-25T05:01:44.692Z
中文译文更新时间：2026-11-08T15:52:55.887Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40broberg/ui-controls-core
原文对照：https://npmcn.com/package/%40broberg/ui-controls-core/?lang=original
项目主页：https://github.com/broberg-ai/components#readme
源码仓库：https://github.com/broberg-ai/components

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：90.1 kB，8 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：0 个
- 首次发布：2026-07-11T17:02:25.022Z
- 最新版本发布：2026-10-25T05:01:44.211Z
- 近 30 天下载量：16279（2026-10-09 至 2026-11-07，npm 官方下载统计）
- 已发布版本数：6（近 12 个月 6 个）

## 中文简介

庄园本土控制替代的无头逻辑(克里斯蒂安的"非本土-对面"/控制规则): 星期一第一个日历数学 + DD- MM- YYYY/ YY- MM- DD 规范化,一个选定的键盘导航减少器,一个外部点击/滚动/大小处理器,以及

## 安装

```sh
npm install @broberg/ui-controls-core
```

也可以使用：`pnpm add @broberg/ui-controls-core`、`yarn add @broberg/ui-controls-core`、`bun add @broberg/ui-controls-core`

## README

# @ broberg/ ui- controls- core

这个 **无头逻辑** 在庄园的本土控制替代之后—— 自定义 `<select>`采枣者 模式者 土司者 克里斯蒂安的 "从来没有本土对话或形式控制"规则授权. 纯类型脚本, 0 JSX,零道岔. 反应( R)`@broberg/ui-controls-react`)和预告 (单位:千美元)`@broberg/ui-controls-preact`适配器在顶上渲染;这是拥有部分 两者必须行为一致.

```bash
npm i @broberg/ui-controls-core
```

## 日历

```ts
import { buildMonthGrid, ymd, parseYmd, isInRange, monthLabel, normalizeYmd } from "@broberg/ui-controls-core";

buildMonthGrid(2026, 7);          // 42 Monday-first cells, padded → [{date,day,inMonth}, …]
monthLabel(2026, 7, "da-DK");     // "juli 2026"  (locale-delegated, no baked-in names)
isInRange("2026-07-04", "2026-07-01", "2026-07-31");   // true

// Typed-input normalisation — disambiguates strictly by the 4-digit year:
normalizeYmd("03-04-2025");       // "2025-04-03"  (3 April, never April-03)
normalizeYmd("2025-04-03");       // "2025-04-03"
normalizeYmd("3.4.2025");         // "2025-04-03"
```

## 选择键盘压缩器

```ts
import { selectKeyReducer } from "@broberg/ui-controls-core";

let state = { open: false, highlighted: -1 };
const { state: next, intent } = selectKeyReducer(state, event.key, options.length);
// intent: "open" | "close" | { type: "select", index } | "none"
// ArrowDown/Up wrap; Enter/Space select the highlight (or open); Escape closes.
```

**0.3.0 — 选入:没有露出武装,第一箭头为当前值(F016.10).**

```ts
selectKeyReducer(state, event.key, options.length, { armOnOpen: false, currentIndex: selectedIndex });
```

-   `armOnOpen: false` ——在闭接器上输入/空间打开 **无** 突出显示, 因此Enter 之后的意外打开会选择无; Enter 只选择箭头键后.
-   `currentIndex` ——第一个箭头落在已经被选中的选项上,而不是跳到第一个/最后一个,因此一个按键从不移动两个位置. 外出值被忽略.

无选项(或 `{}`缩写完全为0.2.4——按每张键×国×分大小的逐字记录.

## 外部单击/ 滚动/ 调整大小

```ts
import { makeOutsideClickHandler } from "@broberg/ui-controls-core";

const handle = makeOutsideClickHandler(() => [triggerEl, menuEl], () => setOpen(false));
handle.attach();   // closes on a pointerdown outside all els, or on ancestor scroll / resize
handle.detach();   // (a fixed-position portal would otherwise drift from its trigger)
```

## 敬酒队列

```ts
import { ToastQueue } from "@broberg/ui-controls-core";

const toasts = new ToastQueue({ maxVisible: 4, defaultDuration: 4000 });
const id = toasts.push({ message: "Saved", kind: "success" });   // auto-dismisses; 0 = sticky
toasts.dismiss(id);
toasts.subscribe((items) => render(items));   // items: { id, message, kind, duration }[]
```

决定性( monotic ids, no) `Math.random`编号 :`Date.now`所以这是微不足道的 可检验和SSR安全。 盖子在 `maxVisible`丢掉最老的.

## 许可证

麻省理工学院的一部分 [`@broberg/*`](https://discovery.broberg.ai/) 共享库存.

## 常见问题

### @broberg/ui-controls-core 是什么？

庄园本土控制替代的无头逻辑\(克里斯蒂安的"非本土-对面"/控制规则\): 星期一第一个日历数学 \+ DD- MM- YYYY/ YY- MM- DD 规范化,一个选定的键盘导航减少器,一个外部点击/滚动/大小处理器,以及

### 如何安装 @broberg/ui-controls-core？

在项目目录运行 npm install @broberg/ui-controls-core，或使用 pnpm add / yarn add / bun add。

### @broberg/ui-controls-core 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @broberg/ui-controls-core 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @broberg/ui-controls-core 可以商用吗？

@broberg/ui-controls-core 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @broberg/ui-controls-core 的下载量有多少？

根据 npm 官方下载统计，@broberg/ui-controls-core 在 2026/10/09 – 2026/11/07 这 30 天内被下载 16,279 次，日均约 543 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @broberg/ui-controls-core 还在维护吗？

最新版本 0\.3\.0 发布于 2026/10/25（14 天前）；至今共发布 6 个版本，其中过去 12 个月发布了 6 个；首次发布于 2026/07/12。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。