npm.io
1.3.13 • Published 6 years ago

@ppci/source-dialog

Licence
ISC
Version
1.3.13
Deps
5
Size
7 kB
Vulns
0
Weekly
0
SummaryDependencyVersions

Source Dialog

Table of contents

  1. Installation
  2. Usage
  3. Styling
  4. Properties
  5. Events

Installation

NPM
npm i @ppci/source-dialog

// Polyfill: https://lit-element.polymer-project.org/guide/use#polyfills
npm i --save-dev @webcomponents/webcomponentsjs
Usage
Javascript
import '@ppci/source-dialog'
Browser
<!-- Default -->
<script type="module" src="https://cdn.jsdelivr.net/npm/@ppci/source-dialog/builds/index.min.js" />

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

<!-- Component -->
<source-dialog
  .source=${Object}
  .sourceMix=${Array}
  @close=${Function}
  loading
  open
></source-dialog>
Styling
source-dialog {
  --theme-dialog-backdrop: white;
}
Properties
Property Type Description Possible Values
*open* boolean Show or hide dialog
*source* Object Contains source details for a specific source ```javascript { // Used by dialog "id":1," "name":"Mark Prince", "city":"Amsterdam", "image":"http://imageurl.com"/1.jpg, "description":"Powerpeers COO",
    // Other
    categoryId":1,
    "deviceId":"1015",
    "status":"ACTIVE",
    "latitude":52.368,
    "longitude":4.9036,
    "website":null,
    "type":"SUN",
    "supply":9500,
    "start":"2016-04-10T00:00:00",
    "end":null,
    "soldOut":false,
    "weight":1
  }
  ```
</td>
loading boolean Show or hide loading indicator
sourceMix Array List with sourcmixes that can be chosen
error String Show error on dialog
Events
Name Description Payload
@close Dialog close icon has been clicked