繁體中文在地化 React 元件

統一編號驗證、身分證檢查碼、手機條碼載具、台灣縣市鄉鎮地址、農曆日期、注音 ruby、中文直排、春聯與紅包。這些東西全球元件庫不會做,而台灣的產品每一個都需要——而且 AI 生出來的統編驗證有好幾種寫錯的方式。這一類全部免費。

共 26 個,其中 18 個免費、不需登入即可安裝。

  • 文字上方標註注音或拼音的 ruby 排版,hover 高亮、可切換模式

  • 數字以中文小寫/大寫/阿拉伯三種形式滾動切換,金額大寫自動轉換

  • 國曆農曆對照月曆:農曆日、節氣、傳統節日標註,雙曆切換

  • 縣市/鄉鎮市區二級聯動選單,自動帶出郵遞區號

  • 台灣統編 8 碼輸入:即時檢查碼驗證、格式化、對錯動畫回饋

  • 09 開頭手機號自動格式化 09xx-xxx-xxx,市話/手機自動判別

  • 手機條碼載具輸入:/ 開頭 8 碼驗證、Code39 條碼即時視覺化

  • 台灣人最熟的聊天 UI 組件:綠白氣泡、已讀、貼圖、日期分隔

  • 繁體/簡體切換開關,內文逐字交叉淡變轉換

  • 上下聯直書+橫批的春聯版面:紅底金字、逐字落筆進場

  • 方圓印章元件:朱文白文、蓋章壓印動畫與印泥暈染

  • 開紅包互動:待機微搖、點擊拆封、金額滾動與金幣噴發

  • 台灣身分證字號輸入:檢查碼驗證、預設遮罩顯示、性別區徽章

  • 十二生肖環形輪盤:旋轉選擇、選中生肖展開年份與特質卡

  • 漢字直書的側邊導覽列:writing-mode 直排、當前項墨線標記

  • 民國/西元一鍵切換的日期選擇器:年月日格狀月曆+民國年下拉,可解析「115/08/18」文字輸入,輸出 ISO 日期

  • 輸入阿拉伯數字金額即時鏡射「新臺幣壹萬貳仟元整」大寫,千分位格式化、角分處理、一鍵複製

  • 注音/拼音組字中不觸發查詢與 Enter 的搜尋框:compositionend 後才 debounce、組字狀態指示、結果關鍵字高亮、/ 快捷聚焦

  • 輸入發票號碼末 3 碼或全 8 碼即時比對獎號(獎號由 props 提供),中獎彩帶+獎金滾動、未中獎安慰動畫

  • 點擊擲出兩枚筊杯的 3D 翻轉動畫,落地判定聖杯/笑杯/陰杯並可綁 onResult 做趣味決策

  • 以二十四節氣為主體的橫向時間軸:依日期定位當前節氣、距下一節氣倒數、四季色帶與物候說明卡

  • 22 縣市方塊格地圖(無需地理資料):依數值著色的 choropleth、hover 提示、點選回呼,可當視覺化篩選器

  • 農民曆日曆卡:國曆大字+農曆日期、宜/忌條列、沖煞與吉時,撕日曆翻頁動畫切換日期

  • 台股慣例報價卡:紅漲綠跌、漲跌停鎖死配色、價格逐位滾動與閃動、漲跌幅徽章、成交量條與五檔簡表(假資料)

  • 中英混排字數統計 textarea:字數/字元/位元組三種計法即時切換、上限進度環、接近與超限警示、IME 組字中不誤計

  • 同一句話在多種語言之間翻牌或垂直滾動切換,可停在指定語言,示範繁中、英文、日文,適合「現在支援多國語言」的公告。