メインコンテンツにスキップ

StaticStyles<>

StyleXによって生成された静的スタイルのみを許可し、インラインスタイルを許可しない型。つまり、ファンクションを使用して定義された動的なスタイルは許可されません。

また、スタイルを配列内にネストして任意の階層にすることもできます。さらに、nullundefinedfalseは常に受け付けられます。

さらに、オブジェクト型を渡してスタイルを特定のプロパティと値に制約することもできます

import type {StaticStyles} from '@stylexjs/stylex';

type Props = {
// ...
style?: StaticStyles<{
color?: 'red' | 'blue' | 'green';
padding?: 0 | 4 | 8 | 16 | 32;
backgroundColor?: string;
borderColor?: string;
borderTopColor?: string;
borderEndColor?: string;
borderBottomColor?: string;
borderStartColor?: string;
}>;
};

オブジェクト型に定義されていないキーはすべて許可されません。

既知のキーのみがチェックされます

TypeScriptの制限事項により、カスタムオブジェクトタイプにないキーは、内部のStyleXタイプの既知のスタイルプロパティの1つである場合にのみ許可されません。

追加の未知のキーを渡した場合、TypeScriptではエラーになりません。