@ppci-mock/widget-wrapper

Widget Wrapper

Table of contents

1. Installation
2. Usage
3. Properties

Installation

NPM

npm i @ppci-mock/widget-wrapper

// Polyfill: https://lit-element.polymer-project.org/guide/use#polyfills
npm i --save-dev @webcomponents/webcomponentsjs

Usage

Javascript

import '@ppci-mock/widget-wrapper'

Browser

<!-- Default -->
<script type="module" src="https://cdn.jsdelivr.net/npm/@ppci-mock/widget-wrapper/builds/index.min.js" />

<!-- Legacy -->
<script type="module" src="https://cdn.jsdelivr.net/npm/@ppci-mock/widget-wrapper/builds/legacy.min.js" />

<!-- Component -->
<widget-wrapper
  error=${Object}
  notification=${Object}
>
  <div>Widget content over here</div>
</widget-wrapper>

Properties

Property	Type	Description	Possible Values
error	Object	Show an global error	```javascript error = { title: 'Something went wrong!', message: 'Custom error message', code: 500, retryTitle: 'Retry', retryAction: () => { console.log('retry'); }, } ```
notification	Object	Show a notification	```javascript notification = { title: 'Something went wrong!', message: 'Custom error message', type: 'success' | 'danger' | 'warning', dismissAction: ( event ) => { console.log('dismiss: ', event); }, } ```