@picklejarapp/notes NPM

package-pj-notes

Installation

Using Yarn:

$ yarn add @picklejarapp/notes

Using NPM:

$ npm i @picklejarapp/notes

Components

Name	Details
`<NotesList/>`	Produces a component to Manage Note lists and Notes.
`<AssignNotesList/>`	Produces a component to select the noteslist to assign in an event

Prop Details

Name	Type	Details
`apiHost`	String	Api base url eg. `https://api.example.com`
`userDetails`	Object	It expects an object `const userDetails = { token: "XXXXXX", tokenType: "bearer" };`
`artistId`	Integer	Accepts integer for aritst's ID
`onSelectData`	Func	Accepts function callback for data, it returns array of selected Note Lists
`selectedListIds`	Array	Accepts array for pre selected list as Note List IDs mostly used in case of edit eg `[10,20]`

Examples

NotesList

import React from 'react';
import ReactDOM from 'react-dom';
import { NotesList } from "@picklejarapp/notes";

const apiHost = "https://api.example.com";
const userDetails = {
  token: "XXXXXXXXXXXXXXXXXX",
  tokenType: "bearer",
};
const artistId = 100;

function App() {
  return (
    <>
      <NotesList
      apiHost={apiHost}
      userDetails={userDetails}
      artistId={artistId}
      />
    </>
  );
}

export default App;

AssignNotesList

import React from 'react';
import ReactDOM from 'react-dom';
import { AssignNotesList } from "@picklejarapp/notes";

const apiHost = "https://api.example.com";
const userDetails = {
  token: "XXXXXXXXXXXXXXXXXX",
  tokenType: "bearer",
};
const artistId = 1;
const selectedListIds = [1,2];

const getSelectedList = (values) => {
  console.log("Selected Note List IDs", values);
};

function App() {
  return (
    <>
      <AssignNotesList
      apiHost={apiHost}
      userDetails={userDetails}
      artistId={artistId}
      onSelectData={getSelectedList}
      selectedListIds={selectedListIds}
      />
    </>
  );
}

export default App;