JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 2
  • Score
    100M100P100Q27773F
  • License MIT

React adapter for pulter.co

Package Exports

  • @pulter/react
  • @pulter/react/dist/index.js
  • @pulter/react/dist/index.modern.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@pulter/react) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@pulter/react

React adapter for pulter.co

NPM JavaScript Style Guide

Shell

npm install @pulter/react

Import

import { Pulter } from "@pulter/react";

Usage

<Pulter
  templateId="Data Template ID"
  user={{
    id: "default123",
  }}
  onSubmit={(result, data) => {
    if (result) {
      console.log("success");
      console.log(data + " data uploaded");
      //custom code
    } else {
      console.log("fail");
      //custom code
    }
  }}
  fields={[
    {
      label: "Name",
      key: "name",
      fieldType: {
        // There are 3 types - "input" / "checkbox" / "select".
        type: "input",
      },
      validations: [
        {
          // Can be "required" / "unique" / "regex"
          rule: "required",
          errorMessage: "Name is required",
          // There can be "info" / "warning" / "error" levels. Optional. Default "error".
          level: "error",
        },
      ],
    },
    {
      label: "Email",
      key: "email",
      fieldType: {
        // There are 3 types - "input" / "checkbox" / "select".
        type: "input",
      },
      validations: [
        {
          // Can be "required" / "unique" / "regex"
          rule: "required",
          errorMessage: "Email is required",
          // There can be "info" / "warning" / "error" levels. Optional. Default "error".
          level: "error",
        },
      ],
    },
    {
      label: "Phone",
      key: "phone",
      fieldType: {
        // There are 3 types - "input" / "checkbox" / "select".
        type: "input",
      },
      validations: [
        {
          // Can be "required" / "unique" / "regex"
          rule: "required",
          errorMessage: "Name is required",
          // There can be "info" / "warning" / "error" levels. Optional. Default "error".
          level: "error",
        },
      ],
    },
  ]}
  rowHook={(data, addError) => {
    // Validation
    if (data.name !== "John") {
      addError("name", { message: "No Johns allowed", level: "info" });
    }
    // Transformation
    return { ...data, name: "Not John" };
    // Sorry John
  }}
/>

Readme

For usage see the guide here - https://docs.pulter.co/getting-started/add-data-template

License

MIT © pulter-co