[PCCompat > Components > Settings] Category: rewrite
This commit is contained in:
parent
dd2ad08a99
commit
3fb7cbb447
|
@ -2,27 +2,55 @@ const { React } = goosemodScope.webpackModules.common;
|
||||||
|
|
||||||
import FormItem from './formItem';
|
import FormItem from './formItem';
|
||||||
|
|
||||||
|
const FormClasses = goosemodScope.webpackModules.findByProps('title', 'dividerDefault');
|
||||||
|
const FormTextClasses = goosemodScope.webpackModules.findByProps('formText', 'placeholder');
|
||||||
|
|
||||||
|
const FormText = goosemodScope.webpackModules.findByDisplayName('FormText');
|
||||||
|
|
||||||
export default class Category extends React.PureComponent {
|
export default class Category extends React.PureComponent {
|
||||||
render() {
|
render() {
|
||||||
const children = this.props.opened ? this.props.children : [];
|
const children = this.props.opened ? this.props.children : [];
|
||||||
|
|
||||||
return React.createElement(FormItem, {
|
return React.createElement(FormItem, {
|
||||||
title: React.createElement('div', {
|
title: React.createElement('div', {},
|
||||||
|
|
||||||
},
|
|
||||||
React.createElement('svg', {
|
React.createElement('svg', {
|
||||||
xmlns: "http://www.w3.org/2000/svg",
|
xmlns: "http://www.w3.org/2000/svg",
|
||||||
viewBox: "0 0 24 24",
|
viewBox: "0 0 24 24",
|
||||||
className: this.props.opened ? "opened" : ""
|
width: "24",
|
||||||
|
height: "24",
|
||||||
|
style: {
|
||||||
|
transform: this.props.opened ? 'rotate(90deg)' : '',
|
||||||
|
marginRight: '10px'
|
||||||
|
}
|
||||||
},
|
},
|
||||||
React.createElement('path', {
|
React.createElement('path', {
|
||||||
fill: 'var(--header-primary)',
|
fill: 'var(--header-primary)',
|
||||||
d: 'M9.29 15.88L13.17 12 9.29 8.12c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0l4.59 4.59c.39.39.39 1.02 0 1.41L10.7 17.3c-.39.39-1.02.39-1.41 0-.38-.39-.39-1.03 0-1.42z'
|
d: 'M9.29 15.88L13.17 12 9.29 8.12c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0l4.59 4.59c.39.39.39 1.02 0 1.41L10.7 17.3c-.39.39-1.02.39-1.41 0-.38-.39-.39-1.03 0-1.42z'
|
||||||
})
|
}),
|
||||||
)),
|
),
|
||||||
|
|
||||||
note: this.props.description
|
React.createElement('label', {
|
||||||
|
class: FormClasses.title,
|
||||||
|
style: {
|
||||||
|
textTransform: 'none',
|
||||||
|
display: 'inline',
|
||||||
|
verticalAlign: 'top',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
this.props.name,
|
||||||
|
|
||||||
|
React.createElement(FormText, {
|
||||||
|
className: FormTextClasses.description,
|
||||||
|
style: {
|
||||||
|
marginLeft: '34px'
|
||||||
|
}
|
||||||
|
}, this.props.description)
|
||||||
|
),
|
||||||
|
),
|
||||||
|
|
||||||
|
onClick: () => {
|
||||||
|
this.props.onChange(!this.props.opened);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
...children
|
...children
|
||||||
|
|
|
@ -14,7 +14,10 @@ export default class FormItem extends React.PureComponent {
|
||||||
return React.createElement(OriginalFormItem, {
|
return React.createElement(OriginalFormItem, {
|
||||||
title: this.props.title,
|
title: this.props.title,
|
||||||
required: this.props.required,
|
required: this.props.required,
|
||||||
className: [Flex.Direction.VERTICAL, Flex.Justify.START, Flex.Align.STRETCH, Flex.Wrap.NO_WRAP, Margins.marginBottom20].join(' ')
|
className: [Flex.Direction.VERTICAL, Flex.Justify.START, Flex.Align.STRETCH, Flex.Wrap.NO_WRAP, Margins.marginBottom20].join(' '),
|
||||||
|
onClick: () => {
|
||||||
|
this.props.onClick();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
this.props.children,
|
this.props.children,
|
||||||
|
|
Loading…
Reference in New Issue