@charlietango/ddb-widget
Advanced tools
Comparing version 0.0.4 to 0.0.5
export class DdbWidget { | ||
componentWillLoad() { | ||
const api = 'https://dd2b2b01-1fe6-4f62-abf8-f012c7ba25bc.mock.pstmn.io/get/data'; | ||
const api = 'https://ddb-be.s1.umbraco.io/api/ddb/list'; | ||
return this.fetchWidgetData(api); | ||
@@ -10,2 +10,3 @@ } | ||
.then(body => { | ||
console.log(body); | ||
const parsedBody = JSON.parse(body); | ||
@@ -12,0 +13,0 @@ this.widgetData = parsedBody; |
/*! | ||
* Built with http://stenciljs.com | ||
* 2018-09-04T13:28:13 | ||
* 2018-09-04T14:50:10 | ||
*/ | ||
!function(e,t,r,n,i,s,o,d,c,u,a,l,p,h){for((a=e.DdbWidget=e.DdbWidget||{}).components=c,(p=c.map(function(e){return e[0]})).length&&((l=t.createElement("style")).innerHTML=p.join()+"{visibility:hidden}.hydrated{visibility:inherit}",l.setAttribute("data-styles",""),p=t.head.querySelector("meta[charset]"),t.head.insertBefore(l,p?p.nextSibling:t.head.firstChild)),function(e,t,r){(e["s-apps"]=e["s-apps"]||[]).push("DdbWidget"),r.componentOnReady||(r.componentOnReady=function(){var t=this;function r(r){if(t.nodeName.indexOf("-")>0){for(var n=e["s-apps"],i=0,s=0;s<n.length;s++)if(e[n[s]].componentOnReady){if(e[n[s]].componentOnReady(t,r))return;i++}if(i<n.length)return void(e["s-cr"]=e["s-cr"]||[]).push([t,r])}r(null)}return e.Promise?new e.Promise(r):{then:r}})}(e,0,u),i=i||a.resourcesUrl,l=(p=t.querySelectorAll("script")).length-1;l>=0&&!(h=p[l]).src&&!h.hasAttribute("data-resources-url");l--);p=h.getAttribute("data-resources-url"),!i&&p&&(i=p),!i&&h.src&&(i=(p=h.src.split("/").slice(0,-1)).join("/")+(p.length?"/":"")+"ddb-widget/"),l=t.createElement("script"),function(e,t,r,n){return!(t.search.indexOf("core=esm")>0)&&(!(!(t.search.indexOf("core=es5")>0||"file:"===t.protocol)&&e.customElements&&e.customElements.define&&e.fetch&&e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")&&"noModule"in r)||function(e){try{return new Function('import("")'),!1}catch(e){}return!0}())}(e,e.location,l)?l.src=i+"ddb-widget.7ldwaulw.js":(l.src=i+"ddb-widget.pfitp97u.js",l.setAttribute("type","module"),l.setAttribute("crossorigin",!0)),l.setAttribute("data-resources-url",i),l.setAttribute("data-namespace","ddb-widget"),t.head.appendChild(l)}(window,document,0,0,0,0,0,0,[["ddb-widget","erw1bobj",1,[["widgetData",16]],1]],HTMLElement.prototype); | ||
!function(e,t,r,n,i,s,o,d,c,u,a,l,p,h){for((a=e.DdbWidget=e.DdbWidget||{}).components=c,(p=c.map(function(e){return e[0]})).length&&((l=t.createElement("style")).innerHTML=p.join()+"{visibility:hidden}.hydrated{visibility:inherit}",l.setAttribute("data-styles",""),p=t.head.querySelector("meta[charset]"),t.head.insertBefore(l,p?p.nextSibling:t.head.firstChild)),function(e,t,r){(e["s-apps"]=e["s-apps"]||[]).push("DdbWidget"),r.componentOnReady||(r.componentOnReady=function(){var t=this;function r(r){if(t.nodeName.indexOf("-")>0){for(var n=e["s-apps"],i=0,s=0;s<n.length;s++)if(e[n[s]].componentOnReady){if(e[n[s]].componentOnReady(t,r))return;i++}if(i<n.length)return void(e["s-cr"]=e["s-cr"]||[]).push([t,r])}r(null)}return e.Promise?new e.Promise(r):{then:r}})}(e,0,u),i=i||a.resourcesUrl,l=(p=t.querySelectorAll("script")).length-1;l>=0&&!(h=p[l]).src&&!h.hasAttribute("data-resources-url");l--);p=h.getAttribute("data-resources-url"),!i&&p&&(i=p),!i&&h.src&&(i=(p=h.src.split("/").slice(0,-1)).join("/")+(p.length?"/":"")+"ddb-widget/"),l=t.createElement("script"),function(e,t,r,n){return!(t.search.indexOf("core=esm")>0)&&(!(!(t.search.indexOf("core=es5")>0||"file:"===t.protocol)&&e.customElements&&e.customElements.define&&e.fetch&&e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")&&"noModule"in r)||function(e){try{return new Function('import("")'),!1}catch(e){}return!0}())}(e,e.location,l)?l.src=i+"ddb-widget.7ldwaulw.js":(l.src=i+"ddb-widget.pfitp97u.js",l.setAttribute("type","module"),l.setAttribute("crossorigin",!0)),l.setAttribute("data-resources-url",i),l.setAttribute("data-namespace","ddb-widget"),t.head.appendChild(l)}(window,document,0,0,0,0,0,0,[["ddb-widget","drvc48eh",1,[["widgetData",16]],1]],HTMLElement.prototype); |
// DdbWidget: Host Data, ES Module/es2017 Target | ||
export const DdbWidget = ["ddb-widget","erw1bobj",1,[["widgetData",16]],1]; | ||
export const DdbWidget = ["ddb-widget","drvc48eh",1,[["widgetData",16]],1]; |
// DdbWidget: Host Data, ES Module/es5 Target | ||
export var DdbWidget = ["ddb-widget","erw1bobj",1,[["widgetData",16]],1]; | ||
export var DdbWidget = ["ddb-widget","drvc48eh",1,[["widgetData",16]],1]; |
{ | ||
"name": "@charlietango/ddb-widget", | ||
"version": "0.0.4", | ||
"version": "0.0.5", | ||
"description": "Web Component built with Stencil by Charlie Tango", | ||
@@ -9,9 +9,6 @@ "module": "dist/esm/index.js", | ||
"repository": { | ||
"url": "git+https://github.com/ionic-team/stencil-component-starter.git" | ||
"url": "git@bitbucket.org:insilicoconsulting/ddb-widget-frontend.git" | ||
}, | ||
"author": "Charlie Tango", | ||
"license": "MIT", | ||
"bugs": { | ||
"url": "https://github.com/ionic-team/stencil" | ||
}, | ||
"homepage": "https://www.charlietango.dk", | ||
@@ -18,0 +15,0 @@ "types": "dist/types/components.d.ts", |
 | ||
# Stencil Component Starter | ||
# Charlie Tango links widget | ||
This is a starter project for building a standalone Web Component using Stencil. | ||
Web Component that can be used in any site by putting a `<script>` tag in the head. | ||
Stencil is also great for building entire apps. For that, use the [stencil-app-starter](https://github.com/ionic-team/stencil-app-starter) instead. | ||
## Usage | ||
# Stencil | ||
Stencil is a compiler for building fast web apps using Web Components. | ||
Stencil combines the best concepts of the most popular frontend frameworks into a compile-time rather than run-time tool. Stencil takes TypeScript, JSX, a tiny virtual DOM layer, efficient one-way data binding, an asynchronous rendering pipeline (similar to React Fiber), and lazy-loading out of the box, and generates 100% standards-based Web Components that run in any browser supporting the Custom Elements v1 spec. | ||
Stencil components are just Web Components, so they work in any major framework or with no framework at all. | ||
## Getting Started | ||
To start building a new web component using Stencil, clone this repo to a new directory: | ||
```bash | ||
git clone https://github.com/ionic-team/stencil-component-starter.git my-component | ||
cd my-component | ||
git remote rm origin | ||
``` | ||
and run: | ||
```bash | ||
npm install | ||
npm start | ||
``` | ||
To build the component for production, run: | ||
```bash | ||
npm run build | ||
``` | ||
To run the unit tests for the components, run: | ||
```bash | ||
npm test | ||
``` | ||
Need help? Check out our docs [here](https://stenciljs.com/docs/my-first-component). | ||
## Naming Components | ||
When creating new component tags, we recommend _not_ using `stencil` in the component name (ex: `<stencil-datepicker>`). This is because the generated component has little to nothing to do with Stencil; it's just a web component! | ||
Instead, use a prefix that fits your company or any name for a group of related components. For example, all of the Ionic generated web components use the prefix `ion`. | ||
## Using this component | ||
### Script tag | ||
- [Publish to NPM](https://docs.npmjs.com/getting-started/publishing-npm-packages) | ||
- Put a script tag similar to this `<script src='https://unpkg.com/my-component@0.0.1/dist/mycomponent.js'></script>` in the head of your index.html | ||
- Then you can use the element anywhere in your template, JSX, html etc | ||
### Node Modules | ||
- Run `npm install my-component --save` | ||
- Put a script tag similar to this `<script src='node_modules/my-component/dist/mycomponent.js'></script>` in the head of your index.html | ||
- Then you can use the element anywhere in your template, JSX, html etc | ||
### In a stencil-starter app | ||
- Run `npm install my-component --save` | ||
- Add an import to the npm packages `import my-component;` | ||
- Then you can use the element anywhere in your template, JSX, html etc | ||
todo |
No bug tracker
MaintenancePackage does not have a linked bug tracker in package.json.
Found 1 instance in 1 package
No repository
Supply chain riskPackage does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.
Found 1 instance in 1 package
No repository
Supply chain riskPackage does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.
Found 1 instance in 1 package
2600
260443
2
9