dsh-calendar 0.6.0 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## 0.7.0（2026-09-19）
+
+- **新增**：面板**记住上次用的视图**（月/周/议程，存 localStorage；隐私模式写不进去就退回「月」），下次打开不再固定跳回月视图。
+- **新增**：周视图**默认落在 07:00**（半夜那几格基本没人看，但需要时还能往上滚，不裁剪任何事件）。
+- **适配窄容器**：面板在设置页里比对话页浮层窄得多，现在用容器查询自适应 —— 窄的时候隐藏芯片里的时间前缀（让日程标题露出来）、隐藏重复的面板标题、收紧工具栏间距。
+- **修复**：月视图的格子由 `<button>` 改为 `<div role="button" tabIndex=0>`。按钮不能嵌套按钮（芯片本身是按钮），一旦同格有多条日程，浏览器会把外层按钮提前闭合、把芯片挤成网格的兄弟节点；现在结构合法，键盘 Enter/空格仍可新建，并加了回归测试（月视图里不允许出现 `button`）。
+
 ## 0.6.0（2026-09-19）
 
 - **新增设置页日历面板**：月 / 周 / 议程三种视图；点日程开右侧详情（时间、时长、重复规则的人话、地点、备注、uid），可直接改标题时间、加重复、删除（二次确认）；新建支持全天 / 地点 / 备注 / RRULE；保存前做冲突检测。

package/README.en.md

@@ -171,7 +171,7 @@ The stable event identifier `uid` is the CalDAV href (full object URL); `calenda
 
 Once installed, DSH grows a「Calendar」section in Settings; the chat page also gets a small 📅 button in the bottom-right that opens the same panel (non-modal, Esc closes).
 
-- **Three views**: month (6×7 grid, today highlighted, click a cell to create), week (24-hour time grid, overlapping events side by side) and agenda (grouped by day).
+- **Three views**: month (6×7 grid, today highlighted, click a cell to create), week (24-hour time grid starting at 07:00, overlapping events side by side) and agenda (grouped by day). The panel **remembers the view you used last**.
 - **Click to edit**: open any event in the right-hand drawer — time, duration, a human-readable repeat rule (`FREQ=WEEKLY;COUNT=6` → "weekly (6 times)"), location, notes, one-click uid copy — then edit or delete (deletion asks twice).
 - **Create**: title, date, start/end, all-day, location, notes, repeat (daily/weekly/monthly/yearly, or a raw RRULE).
 - **Conflict notice**: before saving, overlapping events are listed and you are asked whether to continue.

package/README.md

@@ -197,7 +197,7 @@ Nextcloud / 自定义 Basic 服务：检查账号、密码或服务要求的应
 
 装好后，DSH 的「设置 → 日历」里会多出一节面板；对话页右下角还有一个 📅 小按钮，点开是同一个面板（非模态，Esc 关闭）。
 
-- **三种视图**：月（6×7 网格，今天高亮，点格子直接新建）、周（24 小时时间网格，重叠日程并排显示）、议程（按天分组，最像「接下来要干什么」）。
+- **三种视图**：月（6×7 网格，今天高亮，点格子直接新建）、周（24 小时时间网格，重叠日程并排显示，默认落在 07:00）、议程（按天分组，最像「接下来要干什么」）。面板会**记住你上次用的视图**。
 - **点开就能改**：点任意日程打开右侧详情 —— 时间、时长、重复规则的人话（`FREQ=WEEKLY;COUNT=6` → 「每周（共 6 次）」）、地点、备注、uid 一键复制；接着「编辑」或「删除」（删除要二次确认）。
 - **新建**：标题、日期、开始/结束、全天、地点、备注、重复（每天/每周/每月/每年，或直接写 RRULE）。
 - **冲突提醒**：保存前若与已有日程重叠，会把重叠的几条列出来问你是否继续。

package/lib/client.js

@@ -20,10 +20,28 @@ const VIEWS = ["month", "week", "agenda"];
 
 const WEEKDAYS_ZH = ["一", "二", "三", "四", "五", "六", "日"];
 
+/** 上次用的视图：用户下次打开面板不该又跳回「月」。localStorage 不可用（隐私模式）就退回 default。 */
+const VIEW_STORAGE_KEY = "dsh-calendar:view";
+function loadStoredView() {
+  try {
+    const stored = window.localStorage.getItem(VIEW_STORAGE_KEY);
+    return VIEWS.indexOf(stored) === -1 ? "month" : stored;
+  } catch (error) {
+    return "month";
+  }
+}
+function storeView(view) {
+  try { window.localStorage.setItem(VIEW_STORAGE_KEY, view); } catch (error) { /* 写不进去就算了 */ }
+}
+
 /* @ui-css-start */
 const CSS = [
   ".dshc-root{color:var(--dsw-alias-label-primary,#111);font-size:13px;line-height:1.5}",
-  ".dshc-shell{background:var(--dsw-alias-bg-layer-1,#fff);border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.08));border-radius:14px;padding:14px 16px 16px}",
+  // 面板可能出现在两个宽度差很大的容器里（对话页浮层 ~760px、设置页更窄）。
+  // 用容器查询按「面板自己的宽度」适配：窄的时候藏掉时间前缀与重复的标题，
+  // 让芯片至少能把日程标题露出来。
+  ".dshc-shell{background:var(--dsw-alias-bg-layer-1,#fff);border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.08));border-radius:14px;padding:14px 16px 16px;container-type:inline-size}",
+  "@container (max-width: 620px){.dshc-title{display:none}.dshc-chip .t{display:none}.dshc-toolbar{gap:6px}.dshc-monthhead{min-width:0}}",
   ".dshc-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}",
   ".dshc-title{font-size:15px;font-weight:600;margin:0}",
   ".dshc-sub{color:var(--dsw-alias-label-tertiary,#6b7280);font-size:12px}",
@@ -41,7 +59,7 @@ const CSS = [
   ".dshc-monthhead{text-align:center;font-size:13px;font-weight:600;min-width:104px}",
   ".dshc-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}",
   ".dshc-dow{text-align:center;font-size:11px;color:var(--dsw-alias-label-tertiary,#9ca3af);padding:2px 0 4px}",
-  ".dshc-cell{min-height:88px;border-radius:10px;padding:5px 5px 6px;background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.03));border:1px solid transparent;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:background .12s,border-color .12s;overflow:hidden}",
+  ".dshc-cell{display:block;width:100%;min-height:88px;box-sizing:border-box;border-radius:10px;padding:5px 5px 6px;background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.03));border:1px solid transparent;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:background .12s,border-color .12s;overflow:hidden}",
   ".dshc-cell:hover{background:var(--dsw-alias-bg-mask-3,rgba(0,0,0,.07))}",
   ".dshc-cell.out{opacity:.45}",
   ".dshc-cell.today{border-color:var(--dsw-alias-state-business-primary,#2563eb)}",
@@ -584,11 +602,15 @@ function MonthView(props) {
     const list = sortForDisplay(byDay[key] || []);
     const shown = list.slice(0, 3);
     const rest = list.length - shown.length;
-    cells.push(h("button", {
+    // 格子必须是 div 而不是 button：里面的日程芯片本身是按钮，而按钮不能嵌套按钮 ——
+    // 嵌套时浏览器会把外层按钮提前闭合，芯片就被挤到网格外面去了（真被用户抓到过）。
+    cells.push(h("div", {
       key: key,
-      type: "button",
+      role: "button",
+      tabIndex: 0,
       className: "dshc-cell" + (day.getMonth() !== anchor.getMonth() ? " out" : "") + (key === today ? " today" : ""),
       onClick: () => onCreateAt(day),
+      onKeyDown: (e) => { if (e.key === "Enter" || e.key === " ") { e.preventDefault(); onCreateAt(day); } },
       title: t("action.new")
     }, [
       h("div", { className: "dshc-daynum" }, [key === today ? h("b", null, String(day.getDate())) : h("span", null, String(day.getDate()))]),
@@ -613,6 +635,14 @@ function WeekView(props) {
   const allDay = sortForDisplay(events.filter((e) => e.allDay));
   const timed = events.filter((e) => !e.allDay);
 
+  // 默认落在 07:00：半夜那几格基本没人看，但需要时还能往上滚（不裁剪任何事件）。
+  const scroller = useRef(null);
+  useEffect(() => {
+    const node = scroller.current;
+    if (node === null || node === undefined) return;
+    node.scrollTop = 7 * HOUR_PX;
+  }, [dayKey(anchor)]);
+
   const hoursColumn = h("div", { key: "__hours" }, [h("div", { className: "dshc-dayhead", key: "h" }, "\u00a0")].concat(
     Array.from({ length: 24 }, (_, hour) => h("div", { className: "dshc-hour", key: "h" + hour }, hour === 0 ? "" : pad2(hour) + ":00"))
   ));
@@ -664,7 +694,7 @@ function WeekView(props) {
     allDay.length > 0
       ? h("div", { style: { marginBottom: "8px" } }, allDay.map((event) => h(Row, { key: event.uid, event, onClick: onPick })))
       : null,
-    h("div", { className: "dshc-week" }, [hoursColumn].concat(dayColumns))
+    h("div", { className: "dshc-week", ref: scroller }, [hoursColumn].concat(dayColumns))
   ]);
 }
 
@@ -1119,7 +1149,7 @@ function ConnectionForm(props) {
 
 function CalendarPanel(props) {
   const compact = props.compact === true;
-  const [view, setView] = useState("month");
+  const [view, setView] = useState(loadStoredView);
   const [anchor, setAnchor] = useState(() => new Date());
   const [demo, setDemo] = useState(false);
   const [reloadToken, setReloadToken] = useState(0);
@@ -1185,7 +1215,8 @@ function CalendarPanel(props) {
   const toolbar = h("div", { className: "dshc-toolbar" }, [
     h("h3", { className: "dshc-title", key: "title" }, t("section.title")),
     h("div", { className: "dshc-tabs", key: "tabs" }, VIEWS.map((name) => h("button", {
-      key: name, type: "button", className: "dshc-tab" + (view === name ? " on" : ""), onClick: () => setView(name)
+      key: name, type: "button", className: "dshc-tab" + (view === name ? " on" : ""),
+      onClick: () => { setView(name); storeView(name); }
     }, t("view." + name)))),
     h("span", { className: "dshc-spacer", key: "spacer" }),
     h("span", { className: "dshc-monthhead", key: "period" }, title),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-calendar",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "DSH 日历插件：CalDAV 日程查询、创建、修改、删除与搜索，支持 Google OAuth2、iCloud、Nextcloud 与自建服务。",
   "type": "module",
   "main": "lib/index.js",