Fixed props. Should be in style props

This commit is contained in:
khanhas
2018-06-10 21:48:02 +07:00
parent 5d209bbbce
commit bfb9112bce
2 changed files with 57 additions and 46 deletions
+46 -44
View File
@@ -170,50 +170,52 @@ export interface AreaPathProps extends AreaBaseProps {
export class AreaPath extends React.Component<AreaPathProps> { }
export interface AreaTextProps extends AreaBaseProps {
/**
* The background color, specified as a CSS color string.
*/
backgroundColor?: string;
/**
* The text color, specified as a CSS color string.
*/
color?: string;
/**
* The font family (only if available on the system).
*/
fontFamily?: string;
/**
* The font size (in pt).
*/
fontSize?: number;
/**
* Whether an italic font should be used.
*/
fontStyle?: 'normal' | 'oblique' | 'italic';
/**
* Whether a bold font should be used (and the amount).
*/
fontWeight?: 'minimum' | 'thin' | 'ultraLight' | 'light' | 'book' | 'normal' | 'medium' | 'semiBold' | 'bold' | 'ultraBold' | 'heavy' | 'ultraHeavy' | 'maximum' | number;
/**
* Wheter the text should be aligned to the left, center or right.
*
* **Works only on a top level text component, not it's children!**
*/
textAlign?: 'left' | 'center' | 'right';
/**
* How wide or narrow the characters should be.
*/
textStretch?: 'ultraCondensed' | 'extraCondensed' | 'condensed' | 'semiCondensed' | 'normal' | 'semiExpanded' | 'expanded' | 'extraExpanded' | 'ultraExpanded';
/**
* The text underline style.
*/
textUnderline?: 'none' | 'single' | 'double' | 'suggestion';
/**
* The text underline color.
*
* A color string | 'spelling' | 'grammar' | 'auxiliary'
*/
textUnderlineColor?: 'spelling' | 'grammar' | 'auxiliary' | string;
style?: {
/**
* The background color, specified as a CSS color string.
*/
backgroundColor?: string;
/**
* The text color, specified as a CSS color string.
*/
color?: string;
/**
* The font family (only if available on the system).
*/
fontFamily?: string;
/**
* The font size (in pt).
*/
fontSize?: number;
/**
* Whether an italic font should be used.
*/
fontStyle?: 'normal' | 'oblique' | 'italic';
/**
* Whether a bold font should be used (and the amount).
*/
fontWeight?: 'minimum' | 'thin' | 'ultraLight' | 'light' | 'book' | 'normal' | 'medium' | 'semiBold' | 'bold' | 'ultraBold' | 'heavy' | 'ultraHeavy' | 'maximum' | number;
/**
* Wheter the text should be aligned to the left, center or right.
*
* **Works only on a top level text component, not it's children!**
*/
textAlign?: 'left' | 'center' | 'right';
/**
* How wide or narrow the characters should be.
*/
textStretch?: 'ultraCondensed' | 'extraCondensed' | 'condensed' | 'semiCondensed' | 'normal' | 'semiExpanded' | 'expanded' | 'extraExpanded' | 'ultraExpanded';
/**
* The text underline style.
*/
textUnderline?: 'none' | 'single' | 'double' | 'suggestion';
/**
* The text underline color.
*
* A color string | 'spelling' | 'grammar' | 'auxiliary'
*/
textUnderlineColor?: 'spelling' | 'grammar' | 'auxiliary' | string;
};
/**
* The x coordinate of the text's top left corner. (Only in a top level text component.)
*/
+11 -2
View File
@@ -131,9 +131,18 @@ class AreaTest extends React.Component {
<Area>
<Area.Rectangle height={10} width={20} x={30} y={40} />
<Area.Path d="test" fillMode="nonzero" />
<Area.Text fontSize={30}>
<Area.Text
style={{
fontSize: 30,
fontWeight: "maximum",
textAlign: "center",
textStretch: "ultraCondensed",
}}
>
Parent text
<Area.Text fontWeight="maximum">Nested Text</Area.Text>
<Area.Text>
Nested Text
</Area.Text>
</Area.Text>
</Area>
);