Renaming type
property to theme
This commit is contained in:
parent
3ead0c13df
commit
e04e4edc1f
@ -44,11 +44,11 @@ class Box extends Base {
|
|||||||
labelRef = label => this.label = label
|
labelRef = label => this.label = label
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { type, radius, label, children } = this.props;
|
const { theme, radius, label, children } = this.props;
|
||||||
const { width, height, labelTransform, rectTransform, contentTransform } = this.state || {};
|
const { width, height, labelTransform, rectTransform, contentTransform } = this.state || {};
|
||||||
|
|
||||||
const rectProps = {
|
const rectProps = {
|
||||||
style: type ? style[type] : {},
|
style: style[theme],
|
||||||
width,
|
width,
|
||||||
height,
|
height,
|
||||||
rx: radius,
|
rx: radius,
|
||||||
@ -79,7 +79,7 @@ Box.propTypes = {
|
|||||||
padding: PropTypes.number,
|
padding: PropTypes.number,
|
||||||
useAnchors: PropTypes.bool,
|
useAnchors: PropTypes.bool,
|
||||||
radius: PropTypes.number,
|
radius: PropTypes.number,
|
||||||
type: PropTypes.string
|
theme: PropTypes.string
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Box;
|
export default Box;
|
||||||
|
@ -37,11 +37,11 @@ class Text extends Base {
|
|||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { type } = this.props;
|
const { theme } = this.props;
|
||||||
const { transform } = this.state || {};
|
const { transform } = this.state || {};
|
||||||
|
|
||||||
const textProps = {
|
const textProps = {
|
||||||
style: { ...style.text, ...(type ? style[type] : {}) },
|
style: { ...style.text, ...style[theme] },
|
||||||
transform,
|
transform,
|
||||||
ref: this.textRef
|
ref: this.textRef
|
||||||
};
|
};
|
||||||
@ -59,7 +59,7 @@ Text.propTypes = {
|
|||||||
]).isRequired,
|
]).isRequired,
|
||||||
quoted: PropTypes.bool,
|
quoted: PropTypes.bool,
|
||||||
transform: PropTypes.string,
|
transform: PropTypes.string,
|
||||||
type: PropTypes.string
|
theme: PropTypes.string
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Text;
|
export default Text;
|
||||||
|
24
src/devel.js
24
src/devel.js
@ -22,14 +22,14 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'anchorBox',
|
theme: 'anchorBox',
|
||||||
radius: 0
|
radius: 0
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
type: 'Text',
|
type: 'Text',
|
||||||
props: {
|
props: {
|
||||||
type: 'anchorText'
|
theme: 'anchorText'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
'Anchor'
|
'Anchor'
|
||||||
@ -41,7 +41,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'literalBox'
|
theme: 'literalBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -59,7 +59,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'escapeBox'
|
theme: 'escapeBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -74,7 +74,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'charClassBox',
|
theme: 'charClassBox',
|
||||||
label: 'Label',
|
label: 'Label',
|
||||||
padding: 10
|
padding: 10
|
||||||
},
|
},
|
||||||
@ -91,7 +91,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'literalBox'
|
theme: 'literalBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -114,7 +114,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'literalBox'
|
theme: 'literalBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -133,7 +133,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'escapeBox'
|
theme: 'escapeBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -152,7 +152,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'captureBox',
|
theme: 'captureBox',
|
||||||
label: 'group #1',
|
label: 'group #1',
|
||||||
useAnchors: true,
|
useAnchors: true,
|
||||||
padding: 10
|
padding: 10
|
||||||
@ -167,7 +167,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'literalBox'
|
theme: 'literalBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -184,7 +184,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'literalBox'
|
theme: 'literalBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -201,7 +201,7 @@ const demoImage = {
|
|||||||
{
|
{
|
||||||
type: 'Box',
|
type: 'Box',
|
||||||
props: {
|
props: {
|
||||||
type: 'literalBox'
|
theme: 'literalBox'
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
|
Loading…
Reference in New Issue
Block a user