API 參考

defineSlideXComponent

註冊可展開為原生圖層、結果可預期的本機 React 元件。

components/Hero.tsx

import { Shape, Text, defineSlideXComponent } from "@open-slidex/sdk/react";

export const Hero = defineSlideXComponent({
  name: "Hero",
  props: { title: { type: "string", required: true } },
  assetReferences: () => [],
  toMotionDoc: ({ title }) => (
    <Text id="hero-title" role="title" x={8} y={12} w={72} h={16} fontSize={48}>{title}</Text>
  ),
  component: ({ title }) => (
    <Text id="hero-title" role="title" x={8} y={12} w={72} h={16} fontSize={48}>{title}</Text>
  ),
});

屬性參考

屬性值應保持字面且可序列化，才能由 Canvas、Inspector、驗證與匯出流程可靠處理。

API	屬性	型別／值	必要	說明
defineSlideXComponent	name	string	是	註冊的本機元件所使用的穩定顯示名稱。
	component	React component	是	簡報呈現時使用的元件實作。
	props	literal prop schema	—	選用的字面值屬性定義；支援 string、number、boolean 與 required。
	propsSchema	safeParse schema	—	選用的執行期 schema；會以 safeParse 驗證元件 props。
	assetReferences	(props) => string[]	—	選用，回傳此元件使用的本機素材路徑。
	toMotionDoc	(props) => ReactNode	—	若元件需要展開成可編輯的 MDX 或 PPTX 原生圖層，即為必要。

只註冊可攜的行為

註冊元件需要穩定名稱與用於簡報呈現的 component。若要在 MDX 或 PPTX 匯出時仍可編輯，請提供結果可預期的 toMotionDoc；assetReferences 用來宣告本機素材。

讓每個實例可辨識

展開後的原生圖層仍需要穩定且唯一的 ID。同一個本機元件若在一張投影片出現多次，請傳入實例前綴。