Prime Community Forum

Posted: **12 Sep 2018, 03:46**

I'm building a React library and using "rollup" npm package to bundle my source into ES-6 to be published to NPM registry. In my source I import a PrimReact component
import { Button } from "primereact/components/button/Button";

for some reason, because I reference a PrimeReact library, the generated ES-6 code contains these "commonjs-proxy" which cause problem at runtime as it can't find the "commonjs-proxy" module.

import _propTypes from ' commonjs-proxy:prop-types';
import _classnames from ' commonjs-proxy:classnames';

Does anyone know why PrimeReact would be using these commonjs-proxy proptypes and classnames?

Thanks in advance.

Posted: **13 Sep 2018, 18:28**

Trying to update the value for Editor but its just not working i am not sure i am doing or it is bug wii

Code: Select all

import React, { Component } from "react";
import { Editor } from "primereact/editor";
import { Button } from "primereact/button";
import {InputTextarea} from 'primereact/inputtextarea';


export default class Note extends Component {
 
  state = {}


  componentDidUpdate = (prevProps) => {
    // Typical usage (don't forget to compare props):
    if (this.props.note.title !== prevProps.note.title) {
      this.setState({...this.props.note});
      setTimeout(() => {
        this.setState({body : 'your stuff'})
      }, 1000)
    }
  }
  
  onChange =(e) =>{
  
    this.setState({[e.target.name] : e.target.value})

  }

  getNote() {
    if (this.props.editMode === "read") {
      return (
        <div>
          <h1>{this.props.note.title}</h1>
          <hr />
          <div>{this.props.note.body}</div>
        </div>
      );
    } else
    
      return (
        
          <form>
            <input
              type="text"
              style={{
                width: "100%",
                fontWeight: "bold",
                height: "30px",
                paddingLeft: "5px"
              }}
              name="title"
              value={this.state.title}
              onChange={this.onChange}
            />
           <Editor style={{ height: "600px" }} 
           value={this.state.body}  
           key="body"
           name="body"
           onTextChange={(e)=> this.setState({body : e.htmlValue})} />      
            <br />
          {/* <InputTextarea value={this.state.body} style={{width:"100%" , height:"600px"}} 
          name="body" onChange={this.onChange} /> */}
          <Button label="Clear" icon="pi pi-times" onClick={(e)=> {e.preventDefault(); this.setState({body:''})}}/>
           
          </form>
        
      );
  }
  render() {
    return (

      <div className="noteContainer" style={{ background: "#f1f1f1" }}>
        <div id="presentation">
       
        {this.getNote()}
        </div>
        <div id="container-floating">
          <div
            id="floating-button"
            data-toggle="tooltip"
            data-placement="left"
            data-original-title="Create"
          >
            <p className="plus">+</p>
            <img
              className="edit"
              src="https://ssl.gstatic.com/bt/C3341AA7A1A076756462EE2E5CD71C11/1x/bt_compose2_1x.png"
            />
          </div>
        </div>
      </div>
    );
  }
}

Prime Community Forum

React component using PrimeReact

React component using PrimeReact

Re: React component using PrimeReact