@entrylabs/modal

$ npm install --save @entrylabs/modal

Usage no npm install needed!

<script type="module">
  import entrylabsModal from 'https://cdn.skypack.dev/@entrylabs/modal';
</script>

README

entry-modal

Codacy Badge npm version

Install

Using npm

$ npm install --save @entrylabs/modal

Using yarn

$ yarn add @entrylabs/modal

Example

Codesandbox

Usage

Import - React Component

Using ECMAScript module

import '@entrylabs/modal/dist/entry/entry-modal.css'
import { Alert, Confirm, Prompt } from '@entrylabs/modal';

Using CommonJS module

require('@entrylabs/modal/dist/entry-modal.css');
const { Alert, Confirm, Prompt } = require('@entrylabs/modal');

Import - script

<link rel="stylesheet" href="{prefix}/entry/entry-modal.css" />
<script src="{prefix}/entry-modal.js"></script>
const { alert, confirm, prompt } = EntryTool;

React props

<Alert
  content="content"
  title="title"
  onEvent={() => {}}
  options={{ 
    positiveButtonText: "positiveButtonText"
  }}
/>
<Confirm
  content="content"
  title="title"
  onEvent={() => {}}
  options={{ 
    negativeButtonText: "negativeButtonText",
    positiveButtonText: "positiveButtonText"
  }}
/>
<Prompt
  content="content"
  defaultValue="defaultValue"
  title="title"
  onEvent={() => {}}
  options={{ 
    placeholder: "ppp",
    negativeButtonText: "negativeButtonText",
    positiveButtonText: "positiveButtonText"
  }}
/>

iife props

await EntryTool.alert('content', 'title', {
  positiveButtonText: "positiveButtonText"
});
const bool = await EntryTool.confirm('content', 'title', {
  negativeButtonText: "negativeButtonText",
  positiveButtonText: "positiveButtonText"
});
const value = await EntryTool.prompt('content', 'defaultValue', 'title', {
  placeholder: "ppp",
  negativeButtonText: "negativeButtonText",
  positiveButtonText: "positiveButtonText"
});