Features to be implemented

[graphemecluster]

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

好耶～