input support style property

This commit is contained in:
Bowen Tan 2021-08-24 17:40:27 +08:00
parent e9ba677dc4
commit ba37d56b45
3 changed files with 11 additions and 5 deletions

View File

@ -1,6 +1,7 @@
import React from 'react';
import ReactMarkdown from 'react-markdown';
import { Static, Type } from '@sinclair/typebox';
import { ComponentImplementation } from '../../registry';
export const TextPropertySchema = Type.Object({
raw: Type.String(),
@ -16,11 +17,11 @@ export type TextProps = {
value: Static<typeof TextPropertySchema>;
};
const Text: React.FC<TextProps> = ({ value }) => {
const Text: ComponentImplementation<TextProps> = ({ value, style }) => {
if (value.format === 'md') {
return <ReactMarkdown>{value.raw}</ReactMarkdown>;
}
return <>{value.raw}</>;
return <span style={style}>{value.raw}</span>;
};
export default Text;

View File

@ -4,12 +4,16 @@ import { Type } from '@sinclair/typebox';
import { ComponentImplementation } from '../../registry';
import _Text, { TextProps, TextPropertySchema } from '../_internal/Text';
const Text: ComponentImplementation<TextProps> = ({ value, mergeState }) => {
const Text: ComponentImplementation<TextProps> = ({
value,
mergeState,
style,
}) => {
useEffect(() => {
mergeState({ value: value.raw });
}, [value.raw]);
return <_Text value={value} />;
return <_Text value={value} style={style} />;
};
const StateSchema = Type.Object({

View File

@ -1,4 +1,4 @@
import React from 'react';
import React, { CSSProperties } from 'react';
import { RuntimeComponent, RuntimeTrait } from '@meta-ui/core';
import { SlotsMap } from './App';
// components
@ -49,6 +49,7 @@ export type ComponentImplementation<T = any> = React.FC<
mergeState: MergeState;
subscribeMethods: SubscribeMethods;
slotsMap: SlotsMap | undefined;
style?: CSSProperties;
}
>;