core-components

core-components 技能為 React Native 專案中維持高品質且一致的使用者介面提供了關鍵指引。它是開發人員與 AI 代理的主要參考資料，確保所有 UI 實作皆遵循既定的設計系統模式。透過強制使用中心化的元件庫而非原始平台元件，此技能消除了視覺上的差異並簡化了維護工作。該技能強調設計權杖 (design tokens) 的嚴格應用，特別是間距、顏色與排版，以防止硬編碼數值所導致的技術債與脆弱的佈局結構。

• 標準化核心佈局元件的使用，包括 Box、HStack、VStack 與 Card，以維持結構的一致性。

• 針對互動式元素 (如 Button 與 Input) 強制執行基於權杖的屬性，確保變體與驗證行為的一致。

• 提供複雜佈局的清晰模板，例如 Screen 標頭、表單結構與列表項目模式，以減少重複編碼任務。

• 透過明確對比硬編碼樣式與建議的權杖化實作，防止常見的反模式設計。

• 提供元件屬性模式的指導，鼓勵開發人員構建嚴格使用現有設計權杖架構的新型可重複使用元件。

• 優先使用元件抽象層 (如 <Box />) 而非原生 React Native 原型 (如 <View />) 以確保主題合規性。

• 應用語意顏色權杖 (如 $textPrimary, $statusError) 而非十六進位或 RGB 碼，以支援主題切換與無障礙功能。

• 使用提供的間距與排版比例進行所有佈局計算，以維持整個應用程式視覺節奏的一致性。

• 在實作新的 UI 功能、構建表單佈局或重構現有視圖層時，請參考此技能，以確保它們符合專案的設計語言。

• 結合其他技能使用，例如 react-ui-patterns 處理載入狀態，以及 testing-patterns 在單元測試中模擬這些元件。