FxBooleanXPathQueryByNameFromSelection

How to get FxBooleanXPathQueryByNameFromSelection

import FxBooleanXPathQueryByNameFromSelection from 'fontoxml-fx/src/FxBooleanXPathQueryByNameFromSelection.jsx'

Type: Component

Use this component to determine if the selection is in a specific xml element. Register xpath queries by name, the component will return children as a function which will have the same list of names with a true or false boolean value as parameter. The xpath queries will be executed from the selected element and should return a boolean. Each time the selection is moved in the document, the return value is updated.

Props

# Name Type Description
1. children Function

Implement children as a function. The function should return a react component.


  Arguments
# Name Type Description
1. properties Object
  Members

Members

Name Type Description
xpathQueryResultByName Object

The boolean results of the xpath queries registered by name.

  Returns

Type: ReactElement

2. xpathQueryByName Object

Register xpath queries by name.

Example

// If there are buttons in the toolbar that need to be conditional on where the cursor is placed.
// Then the FxBooleanXPathQueryByNameFromSelection component can be used.

class ExampleToolbar extends Component {
⋮
	xpathQueryByName = {
		lcInteraction: 'ancestor-or-self::lcInteraction'
	}

	render() {
		return(
			<FxBooleanXPathQueryByNameFromSelection xpathQueryByName={this.xpathQueryByName}>
				{({ xpathQueryResultByName }) => (
					<MastheadToolbar>
						<MastheadToolbarButtons>
							{xpathQueryResultByName.lcInteraction && (
								<FxOperationButton operationName="insert-question" />
							)}
						</MastheadToolbarButtons>
						⋮
					</MastheadToolbar>
				)}
			</FxBooleanXPathQueryByNameFromSelection>
		);
	}
}
Was this page helpful?