Features to be implemented

[graphemecluster]

• 指定某自訂選項是否可見
• 格式化推導結果（粗體斜體等）
• 適配 Qieyun.js 0.13
• 用 tshet-uinh-deriver-tools
• TypeScript 推導方案支援
• Prettier, ESLint 導入
• 文章／推導結果分割顯示
• Dark mode
• 改善面板靈活性
• 本地檔案載入／儲存 (7d2f5e2)
  • Drag & drop 從本機載入檔案
  • 透過 URL query 從本機載入檔案
  • Ctrl/Cmd + O 從本機載入檔案
  • Ctrl/Cmd + S 儲存檔案至本機
• 改為以 Web Worker 執行腳本
• 將 render 部分搬回 React

[graphemecluster]

範例（暫且放此）

if (!音韻地位) {
    const 地位 = Qieyun.音韻地位.from描述("幫三凡入");
    const 屬性 = new Set(Object.getOwnPropertyNames(地位).concat(Object.getOwnPropertyNames(Object.getPrototypeOf(地位))));
    屬性.delete("constructor");
    屬性.delete("判斷");
    屬性.delete("等於");
    return [
        ["音韻屬性", ["屬於", ...屬性]],
        ["表達式", "冬韻 平聲", 選項.音韻屬性 === "屬於"],
    ]
}
if (選項.音韻屬性 === "屬於") {
    const result = 音韻地位.屬於(選項.表達式);
    return ({ b, fg }) => fg(result ? "green" : "red")`${result ? b`1` : "0"}`;
}
return 音韻地位[選項.音韻屬性];

[syimyuzya]

["表達式", "冬韻 平聲", 選項.音韻屬性 === "屬於"],

從這行可以看出來，用戶調整選項後，是通過「再調用一次推導方案」（傳入用戶當前選項）來生成新的列表。

但既然這樣的話，為什麼不直接構造一個新列表返回呢？（就像 React 的 render 函數那樣）

代碼例：

if (!音韻地位) {
    const 地位 = Qieyun.音韻地位.from描述("幫三凡入");
    const 屬性 = new Set(Object.getOwnPropertyNames(地位).concat(Object.getOwnPropertyNames(Object.getPrototypeOf(地位))));
    屬性.delete("constructor");
    屬性.delete("判斷");
    屬性.delete("等於");
    const 列表 = [
        ["音韻屬性", ["屬於", ...屬性]],
    ];
    if (選項.音韻屬性 === "屬於") 列表.push(["表達式", "冬韻 平聲"]);
    return 列表;
}

而且這樣不僅能 filter 還能 map，比如可以根據用戶的某選項值，改變其他選項的可選值等。

[syimyuzya]

但既然這樣的話，為什麼不直接構造一個新列表返回呢？（就像 React 的 render 函數那樣）

好像這樣還產生了更多可能性😂：因為每次調整選項都重新產生一次選項列表，新產生的列表完全沒有任何約束，因此甚至可以寫出像這種兩選項「交替切換」的效果」：

if (!音韻地位) {
    if (選項.選項A === false) {
        return [["選項B", true]];
    } else {
        return [["選項A", true]];
    }
}
return '';

（嘛不過感覺這個功能還是很好的233

[syimyuzya]

↑給 qieyun-js 開了相關的 issue，並詳細說明了下現狀。

[graphemecluster]

好耶～

[graphemecluster]

• 左側檔案總管：checkbox 切換是否顯示於推導結果
• 歡迎（簡介）tab
• 新增方案 tab

[graphemecluster]

• 若方案內有 require("方案") 表達式，嘗試於推導時自動載入（fetch）

[graphemecluster]

• 隱藏編輯器；切換上下／左右分割編輯器及選項版面；調整分割大小
• 多個編輯器（上下／左右）

[graphemecluster]

• 引入 tshet-uinh-tools 篩選、分析音韻地位及漢字功能

[graphemecluster]

• 推導結果、關於、説明改用 <dialog>
• 設定版面：開啟／關閉 checkJs / strict mode

[graphemecluster]

• memoize/cache 費時操作（如 zihui.js#L16-L84）的函數，像 React 的 useMemo

[307587]

本地檔案載入／儲存

算是完成了一半，只要ctrl+s就可以儲存js檔了。

[graphemecluster]

@307587 你講得啱，我喺早前嘅 commit 7d2f5e2 搞掂咗（檔案可以透過 Ctrl/Cmd + O 或者 drag and drop 開啟）