How to use the react-dom-factories.h1 function in react-dom-factories

To help you get started, we’ve selected a few react-dom-factories examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github firefox-devtools / devtools-core / packages / devtools-launchpad / src / components / LandingPage.js View on Github external
renderSettings() {
    const { config, setValue } = this.props;

    return dom.div(
      {},
      dom.header({}, dom.h1({}, sidePanelItems.Settings.name)),
      Settings({ config, setValue })
    );
  }
github firefox-devtools / devtools-core / packages / devtools-launchpad / src / components / Sidebar.js View on Github external
renderTitle(title) {
    return dom.div(
      { className: "sidebar-title" },
      dom.h1({}, title),
      dom.div(
        { className: "sidebar-subtitle" },
        Svg({ name: "rocket" }),
        dom.h2({}, "Launchpad")
      )
    );
  }
github firefox-devtools / devtools-core / packages / devtools-reps / src / launchpad / components / Header.js View on Github external
render() {
    let {
      currentInputValue,
      evaluate,
    } = this.props;

    return dom.header(
      { className: "console-header" },
      dom.form(
        { onSubmit: this.onSubmitForm, },
        dom.h1({}, "Reps"),
        dom.input({
          type: "text",
          placeholder: "Enter an expression",
          name: "expression",
          value: currentInputValue || "",
          autoFocus: true,
          onChange: this.onInputChange,
          onKeyDown: this.onInputKeyDown,
        }),
        dom.button({
          className: "clear-button",
          type: "button",
          onClick: this.onClearButtonClick
        }, "Clear"),
      ),
      QuickLinks({ evaluate })
github researchspace / researchspace / researchspace / web / src / main / components / annotations / AnnotationComponent.ts View on Github external
render() {
    if (this.state.initalizationError.isJust) {
      return createElement(TemplateItem, {template: {source: this.state.initalizationError.get()}});
    }
    return D.div({className: 'annotation-component'},
      this.props.readOnly === true ?
        D.h1({}, this.state.label) :
        Input({
          className: 'annotation-component__label-field',
          type: 'text',
          ref: 'annotation-label',
          placeholder: 'Title',
          onChange: (e) => {
            const newValue = (e.target as any).value;
            this.setState(state => { return {label: newValue}; });
          },
          value: this.state.label ? this.state.label : '',
        }),
      AnnotationTextEditor({
        ref: ANNOTATION_EDITOR_REF,
        readOnly: this.props.readOnly === true,
        annotationIri: this.props.annotationToEdit ?
          Rdf.iri(this.props.annotationToEdit.replace(/<|>/g, '')) :