元件總覽

SwButton

語意化按鈕，支援 loading、disabled 及圖示

SwLink

智慧連結，自動識別外部連結並加 rel 屬性

SwBreadcrumb

麵包屑導航，items 驅動 + 可選自帶 BreadcrumbList JSON-LD

SwBackTop

長頁回到頂部，捲超閾值淡入 + reduced-motion 降級瞬跳

SwIcon

業務 SVG 圖示，透過 name 直接引用

SwImage

圖片延遲載入、最佳化 srcset 與佔位圖

SwThemeSwitch

主題切換器，隨 theme.mode 自 gate（僅 toggle 渲染）

SwLangSwitch

語言切換器，讀 i18n.locales 自動聯動，i18n 關/單語言不渲染

SwFormField

帶 label、校驗提示的表單欄位包裝器

SwInput

文字輸入框，表單控件族統一基線盒子（等高等字號）+ 原生屬性全透傳

SwSegmented

平鋪單選選項組（segmented / pill），方向鍵 a11y 自帶

SwSelect

下拉選擇，單 / 多選、可清空、分組、可搜尋、輸入即建

SwUploadFile

普通檔案上傳（PDF / 文件 / zip），分片無轉碼

SwUploadImage

圖片上傳，含裁切與預覽

SwUploadVideo

影片上傳，支援進度條與封面截圖

SwModal

無樣式彈窗，支援宣告式（v-model）與命令式（useModal）兩種用法

SwPagination

頁碼翻頁器（替換式，與 SwGallery 組合）

SwToast

輕提示，支援 success / error / info 類型

SwAddToHomescreenGuide

H5 PWA 加入主畫面引導（底部 sheet，非阻斷式）

SwVideoPlayer

影片播放器，支援 HLS 與自訂控制項

SwAudioPlayer

音訊播放器，帶進度條與音量控制

SwVideoBackground

無聲 MP4 背景與封面降級

SwVideoPreview

影片懸停預覽，滑鼠移入自動靜音播放

SwQrcodeGenerator

根據文字生成二維碼圖片，支援自訂樣式與下載

SwQrcodeScanner

上傳圖片識別其中的二維碼並回傳內容

SwAsyncText

非同步載入遠端文字（含 .bnc 加密自動分流 + IndexedDB 快取）

SwTable

管理台資料表格：columns + 儲存格插槽，內建排序 / 行選 / loading / 黏性表頭

SwEditor

基於 Tiptap 的富文字編輯器：@提及 / #話題 / 內建 emoji / 圖片影片上傳

SwRail

橫向自由滾動橫排，原生 scroll-snap + 桌面預設箭頭

SwCarousel

整屏輪播 banner，無縫 loop + autoplay + dots / 縮圖

SwVideoFeed

抖音式直划短影片流，裸 hls 影片池 + 虛擬化

SwGallery

響應式封面卡網格 + 載入更多（與 SwRail 橫滾互補）

SwAdBanner

橫幅廣告位，單圖直出或多圖輪播，內建曝光/點擊埋點

SwAdMrec

中矩形廣告位（MREC，預設 300×250）

SwAdIcon

圖示廣告位，grid 宮格 / image 單圖示

SwAdText

文字廣告位，cell 文字鏈 / grid 宮格

SwAdMarquee

跑馬燈文字廣告，橫向無縫滾動

SwAdNative

原生資訊流廣告卡（圖+標題+描述+CTA）

SwAdSplash

進站開屏廣告，進站自動彈 + 頻控（ad_type=splash）

SwAdPopup

業務觸發的全螢幕彈窗廣告，ref.open() 觸發 + 可選頻控

SwAdPreroll

影片前貼片廣告（#preroll-ad 插槽官配，掛載即曝光）

SwAdPause

影片暫停廣告（#pause-ad 插槽官配，暫停 gating 通過即彈，可關閉）

SwAdFloating

側邊懸浮廣告，視窗夠寬才顯示

SwAdLabel

「廣告」合規角標