Launch Week Day 5: Introducing Reachability for PHP.Learn More →
Socket
Book a DemoSign in
Socket
Book a DemoSign in

ta-dom-components

Package Overview
Dependencies
Maintainers
1
Versions
6
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ta-dom-components - npm Package Compare versions

Comparing version
0.0.1
 to
0.0.4
+1
-1
my-element.js

@@ -54,3 +54,3 @@ import TaDom from './ta-dom-element.js';

this.setState({time:this.time});
}, 1000);
}, 500);
}

@@ -57,0 +57,0 @@ 

+5
-1
package.json
{
"name": "ta-dom-components",
"version": "0.0.1",
"version": "0.0.4",
"description": "another web-component library",

@@ -9,2 +9,6 @@ "main": "index.js",

},
"repository": {
"type": "git",
"url": "https://github.com/jrobinson01/ta-dom-components.git"
},
"author": "jrobinsonmedia@gmail.com",

@@ -11,0 +15,0 @@ "license": "MIT",

+3
-5
README.md

@@ -6,3 +6,3 @@ ## Ta-Dom! 🎉 Components ##

### What is it? ###
Ta-Dom! Components is a small library that combines some of the best features of the React and Polymer libraries to make writing web components fast, fun, and easy.
Ta-Dom! Components is a small library that combines some of the best features of the [React](https://github.com/facebook/react) and [Polymer](https://github.com/Polymer/polymer) libraries to make writing web components fast, fun, and easy.

@@ -14,6 +14,6 @@ #### How it Works ####

Unlike React's virtual DOM, in Ta-Dom! you're always dealing with real DOM elements. It's encouraged to use the Ta-Dom! DOM creation library because it's awesome, but you're free to construct your DOM however you see fit. All of the native DOM api's available.
Unlike React's virtual DOM, in Ta-Dom! you're always dealing with real DOM elements. It's encouraged to use the [Ta-Dom! DOM creation library](https://github.com/jrobinson01/ta-dom) because it's awesome, but you're free to construct your DOM however you see fit. All of the native DOM api's are available.
#### Getting Started ####
`npm install --save jrobinson01/ta-dom-components`
`npm install --save ta-dom-components`

@@ -86,3 +86,1 @@ #### A Simple Ta-Dom Component ####

```
##### Contributing #####
+25
-7
ta-dom-element.js

@@ -1,3 +0,3 @@

import TaDom from './node_modules/ta-dom/index.js';
import morphdom from './node_modules/morphdom/dist/morphdom-esm.js';
import TaDom from '/node_modules/ta-dom/index.js';
import morphdom from '/node_modules/morphdom/dist/morphdom-esm.js';

@@ -45,3 +45,3 @@ // generate getter/setter pair for prop

// TODO: do we have to remove event listeners from discarded nodes?
// console.log('node discarded', node);
console.log('node discarded', node);
}

@@ -107,2 +107,20 @@ });

// override dispatchEvent
dispatchEvent(name, detail) {
// pass-thru if first param is an event
if(name instanceof Event) {
return super.dispatchEvent(name);
}
// default events to composed, bubbles
return super.dispatchEvent(new CustomEvent(name, {
bubbles: true,
composed: true,
detail
}));
}
// replaces the entire style sheet
// TODO: fix that?
// Keep a virtual copy of the style as an object
// provide updates via js object?
updateStyles(newStyle) {

@@ -161,8 +179,8 @@ if (!this.styles) {

// wrapper for generate() and customElements.define()
// used to define ta-dom functions for custom elements.
const customElement = function(fnName, tag, klass) {
TaDom.generate(fnName);
return customElements.define(tag, klass);
// returns the ta-dom function to generate the custom element
const customElement = function(tag, klass) {
customElements.define(tag, klass);
return TaDom.generate(tag);
};
export default {customElement, TaDomElement};