| 35405 | }, |
| 35406 | statePlugins: { requestSnippets: { selectors: $ } }, |
| 35407 | }) |
| 35408 | class ModelCollapse extends Re.Component { |
| 35409 | static defaultProps = { |
| 35410 | collapsedContent: '{...}', |
| 35411 | expanded: !1, |
| 35412 | title: null, |
| 35413 | onToggle: () => {}, |
| 35414 | hideSelfOnExpand: !1, |
| 35415 | specPath: We().List([]), |
| 35416 | } |
| 35417 | constructor(s, o) { |
| 35418 | super(s, o) |
| 35419 | let { expanded: i, collapsedContent: a } = this.props |
| 35420 | this.state = { |
| 35421 | expanded: i, |
| 35422 | collapsedContent: a || ModelCollapse.defaultProps.collapsedContent, |
| 35423 | } |
| 35424 | } |
| 35425 | componentDidMount() { |
| 35426 | const { hideSelfOnExpand: s, expanded: o, modelName: i } = this.props |
| 35427 | s && o && this.props.onToggle(i, o) |
| 35428 | } |
| 35429 | UNSAFE_componentWillReceiveProps(s) { |
| 35430 | this.props.expanded !== s.expanded && this.setState({ expanded: s.expanded }) |
| 35431 | } |
| 35432 | toggleCollapsed = () => { |
| 35433 | ;(this.props.onToggle && |
| 35434 | this.props.onToggle(this.props.modelName, !this.state.expanded), |
| 35435 | this.setState({ expanded: !this.state.expanded })) |
| 35436 | } |
| 35437 | onLoad = (s) => { |
| 35438 | if (s && this.props.layoutSelectors) { |
| 35439 | const o = this.props.layoutSelectors.getScrollToKey() |
| 35440 | ;(We().is(o, this.props.specPath) && this.toggleCollapsed(), |
| 35441 | this.props.layoutActions.readyToScroll(this.props.specPath, s.parentElement)) |
| 35442 | } |
| 35443 | } |
| 35444 | render() { |
| 35445 | const { title: s, classes: o } = this.props |
| 35446 | return this.state.expanded && this.props.hideSelfOnExpand |
| 35447 | ? Re.createElement('span', { className: o || '' }, this.props.children) |
| 35448 | : Re.createElement( |
| 35449 | 'span', |
| 35450 | { className: o || '', ref: this.onLoad }, |
| 35451 | Re.createElement( |
| 35452 | 'button', |
| 35453 | { |
| 35454 | 'aria-expanded': this.state.expanded, |
| 35455 | className: 'model-box-control', |
| 35456 | onClick: this.toggleCollapsed, |
| 35457 | }, |
| 35458 | s && Re.createElement('span', { className: 'pointer' }, s), |
| 35459 | Re.createElement('span', { |
| 35460 | className: 'model-toggle' + (this.state.expanded ? '' : ' collapsed'), |
| 35461 | }), |
| 35462 | !this.state.expanded && |
| 35463 | Re.createElement('span', null, this.state.collapsedContent) |
| 35464 | ), |