├── .npmignore ├── component ├── index.test.es ├── README.md └── index.es ├── element ├── index.test.es ├── README.md ├── index.es └── index.html ├── examples ├── index.test ├── nav-view │ ├── index.css │ ├── index.html │ ├── index.es │ └── example.html ├── add-subtract │ ├── README.md │ ├── index.es │ ├── index.css │ └── index.html ├── fidget-spinner │ └── index.html ├── routes.es ├── routes.test ├── index.css ├── cook-book │ ├── index.json │ └── README.md ├── index.es ├── autocomplete.js ├── header-group │ ├── index.css │ ├── index.es │ ├── example.html │ └── index.html ├── login-form │ └── README.md ├── hello-world │ ├── index.css │ └── index.html ├── weather-viewer │ ├── weatherman.js │ └── fixture.json ├── to-do │ ├── index.css │ ├── counter.css │ ├── template.html │ └── index.es ├── github-ribbon │ └── example.html ├── README.md ├── user-list │ ├── index.html │ └── reactive.es ├── filter.js ├── party-line.html ├── filter.html ├── autocomplete.html ├── input-output.html ├── file-upload │ ├── test.html │ └── style.css ├── multiple-choice │ ├── index.html │ └── index.es ├── infinity-calendar │ ├── index.html │ ├── infinity-calendar.es │ └── infinity-calendar.css ├── index.html ├── x-flashy.html └── options-scanner.html ├── parent-node ├── index.html ├── index.test.es ├── index.idl ├── README.md └── index.es ├── polyfills ├── index.test ├── index.js ├── ecmascript.test ├── ecmascript.es ├── defined.test ├── README.md ├── defined.es └── import.es ├── global-event-handlers ├── index.html ├── index.test.es ├── README.md └── index.es ├── public ├── index.txt ├── favicon.ico ├── favicon-16x16.png ├── favicon-32x32.png └── github.svg ├── .github ├── FUNDING.yml ├── actions │ └── test.yml ├── ISSUE_TEMPLATE │ ├── feature_request.md │ └── bug_report.md ├── ISSUE_TEMPLATE.md └── PULL_REQUEST_TEMPLATE.md ├── html-template-element ├── index.idl ├── index.polyfill.es ├── index.html ├── index.test.html ├── index.test.es ├── index.es └── README.md ├── mixins ├── index.test ├── index.es ├── worker.es ├── middleware.test ├── notification.es ├── storable.es ├── README.md └── middleware.es ├── resource ├── fixtures │ ├── index.json │ ├── index.js │ ├── dependency.mjs │ ├── index.txt │ ├── index.mjs │ ├── index.gif │ ├── index.jpg │ ├── index.m4a │ ├── index.mp3 │ ├── index.mp4 │ ├── index.ogg │ ├── index.pdf │ ├── index.png │ ├── index.wav │ ├── index.css │ ├── index.es │ ├── index.test │ └── index.html ├── negotiate.es └── README.md ├── favicon.ico ├── snuggsi.png ├── test ├── test.pdf ├── index.pdf ├── mock.es ├── serve.es ├── a11y.es ├── worker.es ├── socket.es ├── navigate.es ├── index.test ├── index.html ├── README.md ├── index.es ├── browse.es └── parse.es ├── .gitignore ├── .vercelignore ├── event-target ├── index.test.html ├── index.html ├── index.test.es └── README.md ├── custom-element-registry ├── index.test.es ├── index.impl ├── index.webidl ├── index.es ├── index.html └── README.md ├── dist ├── snuggsi.min.es.br ├── snuggsi.min.es.gz ├── snuggsi.min.js.br ├── snuggsi.min.js.gz ├── snuggsi.min.es.zlib ├── snuggsi.min.js.zlib ├── snuggsi.min.es.deflate └── snuggsi.min.js.deflate ├── server ├── fixtures │ ├── index.txt │ ├── index.html │ ├── index.js │ └── index.es ├── mount.test ├── index.es └── README.md ├── bin ├── validate ├── integrate ├── resource ├── crank ├── deploy ├── serve ├── transpile ├── test ├── watch ├── package ├── lint ├── compile ├── publish ├── .resources ├── shrink ├── serve.es ├── weigh ├── bundle ├── transpile.es ├── help ├── browse ├── compress ├── snuggsi ├── cover └── distribute ├── .vscode ├── settings.json └── README.md ├── token-list ├── index.idl ├── index.test.es ├── index.impl ├── README.md ├── index.es └── index.html ├── middleware ├── compressor.test ├── browse.es ├── index.test ├── cors.es ├── assets.es ├── assets.test ├── index.es ├── cors.test ├── auth.es ├── security.es ├── route.es ├── README.md ├── security.test └── snuggsi.es ├── .npmrc ├── watch ├── browser.es ├── index.test.es ├── govern.js └── index.es ├── benchmarks ├── properties │ ├── angular2 │ │ ├── main.ts │ │ ├── properties.component.html │ │ ├── properties.component.ts │ │ └── config.js │ └── index.html ├── README.md ├── document.createElement.es ├── index.es └── dom-insertion.js ├── snippets ├── paint.es ├── browser-sync.es └── README.md ├── browser-sync.js ├── read.es ├── CODEOWNERS ├── .travis.yml ├── html-script-element └── README.md ├── style ├── index.sh ├── index.es └── README.md ├── html-element ├── README.md ├── index.test.es └── index.es ├── index.es ├── html-link-element ├── index.html ├── index.idl └── index.test ├── index.test.html ├── LICENSE ├── state.es ├── index.test.es ├── index.test ├── typography.css ├── animation.es ├── package.json ├── posts └── cal-ver.md └── SECURITY.md /.npmignore: -------------------------------------------------------------------------------- 1 | ** 2 | -------------------------------------------------------------------------------- /component/index.test.es: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /element/index.test.es: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /examples/index.test: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /parent-node/index.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /polyfills/index.test: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /examples/nav-view/index.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /global-event-handlers/index.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/index.txt: -------------------------------------------------------------------------------- 1 | Hello Snuggsi ツ 2 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | patreon: devpunks 2 | -------------------------------------------------------------------------------- /html-template-element/index.idl: -------------------------------------------------------------------------------- 1 | // index.idl 2 | -------------------------------------------------------------------------------- /polyfills/index.js: -------------------------------------------------------------------------------- 1 | require ('./ecmascript.es') 2 | -------------------------------------------------------------------------------- /examples/add-subtract/README.md: -------------------------------------------------------------------------------- 1 | # `` 2 | -------------------------------------------------------------------------------- /mixins/index.test: -------------------------------------------------------------------------------- 1 | require ('./middleware.test') 2 | 3 | -------------------------------------------------------------------------------- /resource/fixtures/index.json: -------------------------------------------------------------------------------- 1 | [ 'Hello Resource!' ] 2 | -------------------------------------------------------------------------------- /examples/fidget-spinner/index.html: -------------------------------------------------------------------------------- 1 | https://www.fidgetspin.xyz 2 | -------------------------------------------------------------------------------- /resource/fixtures/index.js: -------------------------------------------------------------------------------- 1 | alert ('Hello nomodule Resource!') 2 | -------------------------------------------------------------------------------- /examples/routes.es: -------------------------------------------------------------------------------- 1 | console.warn ('this is coming from routes.es') 2 | -------------------------------------------------------------------------------- /examples/routes.test: -------------------------------------------------------------------------------- 1 | console.warn ('this is coming from routes.test') 2 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/favicon.ico -------------------------------------------------------------------------------- /snuggsi.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/snuggsi.png -------------------------------------------------------------------------------- /test/test.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/test/test.pdf -------------------------------------------------------------------------------- /element/README.md: -------------------------------------------------------------------------------- 1 | ## `Element` 2 | 3 | Enhancements to `Element` interface 4 | -------------------------------------------------------------------------------- /examples/index.css: -------------------------------------------------------------------------------- 1 | nav {} 2 | 3 | main {} 4 | 5 | aside {} 6 | 7 | footer {} 8 | -------------------------------------------------------------------------------- /resource/fixtures/dependency.mjs: -------------------------------------------------------------------------------- 1 | alert ('Hello imported module Resource!') 2 | 3 | -------------------------------------------------------------------------------- /resource/fixtures/index.txt: -------------------------------------------------------------------------------- 1 | Hello Resource! 2 | 3 | * Insert Cat image here * 4 | -------------------------------------------------------------------------------- /test/index.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/test/index.pdf -------------------------------------------------------------------------------- /test/mock.es: -------------------------------------------------------------------------------- 1 | // Nock - https://github.com/nock/nock 2 | // TODO: Other Mocks 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .vercel 3 | .nyc_output 4 | 5 | public/ 6 | node_modules/ 7 | -------------------------------------------------------------------------------- /.vercelignore: -------------------------------------------------------------------------------- 1 | ** 2 | !index.html 3 | !favicon.ico 4 | !*.css 5 | !browser-sync.js 6 | -------------------------------------------------------------------------------- /event-target/index.test.html: -------------------------------------------------------------------------------- 1 |

Event Target

2 | 3 |

SHAZAAAAAAMMMMMMMMM 4 | -------------------------------------------------------------------------------- /mixins/index.es: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | middleware: require ('./middleware') 3 | } 4 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/public/favicon.ico -------------------------------------------------------------------------------- /custom-element-registry/index.test.es: -------------------------------------------------------------------------------- 1 | console.log('Custom Element Registry') 2 | 3 | 4 | -------------------------------------------------------------------------------- /dist/snuggsi.min.es.br: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.es.br -------------------------------------------------------------------------------- /dist/snuggsi.min.es.gz: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.es.gz -------------------------------------------------------------------------------- /dist/snuggsi.min.js.br: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.js.br -------------------------------------------------------------------------------- /dist/snuggsi.min.js.gz: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.js.gz -------------------------------------------------------------------------------- /server/fixtures/index.txt: -------------------------------------------------------------------------------- 1 | Hello World 2 | 3 | The quick brown fox jumped over the lazy dog 4 | -------------------------------------------------------------------------------- /.github/actions/test.yml: -------------------------------------------------------------------------------- 1 | name: "Setup Snuggsi" 2 | description: "Reusable action to setup snuggsi" 3 | -------------------------------------------------------------------------------- /component/README.md: -------------------------------------------------------------------------------- 1 | # `Custom (element)` 2 | 3 | ## `connectedCallback` 4 | 5 | ## `render` 6 | 7 | -------------------------------------------------------------------------------- /dist/snuggsi.min.es.zlib: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.es.zlib -------------------------------------------------------------------------------- /dist/snuggsi.min.js.zlib: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.js.zlib -------------------------------------------------------------------------------- /public/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/public/favicon-16x16.png -------------------------------------------------------------------------------- /public/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/public/favicon-32x32.png -------------------------------------------------------------------------------- /resource/fixtures/index.mjs: -------------------------------------------------------------------------------- 1 | alert ('Hello module Resource!') 2 | 3 | import './dependency.mjs' 4 | -------------------------------------------------------------------------------- /dist/snuggsi.min.es.deflate: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.es.deflate -------------------------------------------------------------------------------- /dist/snuggsi.min.js.deflate: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/dist/snuggsi.min.js.deflate -------------------------------------------------------------------------------- /parent-node/index.test.es: -------------------------------------------------------------------------------- 1 | const 2 | node = require('./index.es') 3 | 4 | console.log('foo', node) 5 | -------------------------------------------------------------------------------- /resource/fixtures/index.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.gif -------------------------------------------------------------------------------- /resource/fixtures/index.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.jpg -------------------------------------------------------------------------------- /resource/fixtures/index.m4a: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.m4a -------------------------------------------------------------------------------- /resource/fixtures/index.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.mp3 -------------------------------------------------------------------------------- /resource/fixtures/index.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.mp4 -------------------------------------------------------------------------------- /resource/fixtures/index.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.ogg -------------------------------------------------------------------------------- /resource/fixtures/index.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.pdf -------------------------------------------------------------------------------- /resource/fixtures/index.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.png -------------------------------------------------------------------------------- /resource/fixtures/index.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devpunks/snuggsi/main/resource/fixtures/index.wav -------------------------------------------------------------------------------- /server/fixtures/index.html: -------------------------------------------------------------------------------- 1 |

Hello World

2 | 3 |

The quick brown fox jumped over the lazy dog 4 | -------------------------------------------------------------------------------- /examples/cook-book/index.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | 'BTC' : { 4 | market_cap : 210000000000 5 | } 6 | } 7 | ] 8 | -------------------------------------------------------------------------------- /mixins/worker.es: -------------------------------------------------------------------------------- 1 | const Worker = Element => 2 | 3 | (class extends Element { 4 | 5 | onmessage (event) {} 6 | }) 7 | -------------------------------------------------------------------------------- /server/fixtures/index.js: -------------------------------------------------------------------------------- 1 | console.log ( 'Hello World' ) 2 | 3 | console.log ( 'The quick brown fox jumped over the lazy dog' ) 4 | -------------------------------------------------------------------------------- /bin/validate: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | # Could be used to validate html 4 | # https://github.com/whatwg/meta/issues/4#issuecomment-275162174 5 | -------------------------------------------------------------------------------- /examples/index.es: -------------------------------------------------------------------------------- 1 | module.exports = 2 | 3 | class { 4 | get (context, element) { 5 | console.warn ('Getting', element) 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "files.associations": { 3 | "*.es": "javascript", 4 | "*.test": "javascript" 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /token-list/index.idl: -------------------------------------------------------------------------------- 1 | [Constructor, 2 | Exposed=Window] 3 | partial /*sealed*/ interface TokenList { 4 | 5 | void bind(object context) 6 | 7 | } 8 | -------------------------------------------------------------------------------- /middleware/compressor.test: -------------------------------------------------------------------------------- 1 | // Data Compression - https://en.wikipedia.org/wiki/Data_compression 2 | // compress during response BEFORE CACHE (invalidation) 3 | -------------------------------------------------------------------------------- /examples/autocomplete.js: -------------------------------------------------------------------------------- 1 | Element 2 | `auto-complete` 3 | 4 | (class extends HTMLElement { 5 | initialize () { 6 | this.items = COUNTRIES 7 | } 8 | }) 9 | -------------------------------------------------------------------------------- /middleware/browse.es: -------------------------------------------------------------------------------- 1 | module.export = { 2 | handle: function (request, respose, next) { 3 | console.log ('SNUUUGGSS', arguments) 4 | next () 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /examples/header-group/index.css: -------------------------------------------------------------------------------- 1 | header-group { 2 | display: block; 3 | background: pink; 4 | line-height: 3em; 5 | border-bottom: 0.1em solid #ddd 6 | } 7 | 8 | -------------------------------------------------------------------------------- /examples/login-form/README.md: -------------------------------------------------------------------------------- 1 | - https://uxdesign.cc/login-form-ui-design-guide-c5c9c93ae482 2 | - https://uxdesign.cc/creating-a-state-of-the-art-sign-in-form-1c7abca23957 3 | -------------------------------------------------------------------------------- /global-event-handlers/index.test.es: -------------------------------------------------------------------------------- 1 | // https://github.com/tmpvar/jsdom/pull/1063 2 | // https://github.com/tmpvar/jsdom/pull/1063/commits/5ca40a25eafa4c2467f3615a8ab1135afe311cd7 3 | 4 | -------------------------------------------------------------------------------- /test/serve.es: -------------------------------------------------------------------------------- 1 | const 2 | { Server } 3 | = require ('snuggsi') 4 | 5 | , server 6 | = new Server 7 | 8 | 9 | module.exports 10 | = server.serve.bind (server) 11 | -------------------------------------------------------------------------------- /mixins/middleware.test: -------------------------------------------------------------------------------- 1 | const { describe, serve, browse } 2 | = require ('test') 3 | 4 | describe ('middleware', test => { 5 | 6 | test.ok (true) 7 | 8 | test.end () 9 | }) 10 | -------------------------------------------------------------------------------- /test/a11y.es: -------------------------------------------------------------------------------- 1 | console.log ('A11y') 2 | 3 | // https://github.com/Heydon/REVENGE.CSS 4 | // https://ffoodd.github.io/a11y.css/errors.html 5 | // https://heydonworks.com/article/testing-html-with-modern-css 6 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | # https://docs.npmjs.com/using-private-packages-in-a-ci-cd-workflow 2 | # https://stackoverflow.com/questions/53099434/using-auth-tokens-in-npmrc 3 | //registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN} 4 | -------------------------------------------------------------------------------- /polyfills/ecmascript.test: -------------------------------------------------------------------------------- 1 | const { describe, serve, browse } 2 | = require ('test') 3 | 4 | 5 | describe ('ecmascript extension', test => { 6 | 7 | test.ok (true) 8 | 9 | test.end () 10 | }) 11 | -------------------------------------------------------------------------------- /middleware/index.test: -------------------------------------------------------------------------------- 1 | //require ('./auth.test') 2 | //require ('./cors.test') 3 | require ('./security.test') 4 | //require ('./snuggsi.test') 5 | //require ('./route.test') 6 | //require ('./assets.test') 7 | 8 | -------------------------------------------------------------------------------- /bin/integrate: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | # See .travis.yml for more details 4 | echo 5 | echo "🚔 Continuously integrating..." 6 | echo " 👇" 7 | 8 | bin/snuggsi publish && bin/snuggsi cover 9 | 10 | echo 11 | -------------------------------------------------------------------------------- /test/worker.es: -------------------------------------------------------------------------------- 1 | // https://mswjs.io 2 | // https://github.com/mswjs/msw 3 | console.log ('Mocking ServiceWorker') 4 | 5 | class Service {} 6 | 7 | class Worker {} 8 | 9 | module.exports = { Worker, Service } 10 | -------------------------------------------------------------------------------- /bin/resource: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | # Identifying Resources - https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web 4 | 5 | echo "Resources (${#RESOURCES[@]}): ${RESOURCES[@]}" 6 | -------------------------------------------------------------------------------- /resource/fixtures/index.css: -------------------------------------------------------------------------------- 1 | figure, body, caption, video, audio, img { 2 | display: block; 3 | text-align: center; 4 | margin: 1em auto 3em; 5 | } 6 | 7 | video, img { 8 | width: 50vw; 9 | height: 38vw; 10 | } 11 | -------------------------------------------------------------------------------- /polyfills/ecmascript.es: -------------------------------------------------------------------------------- 1 | // https://medium.freecodecamp.org/requiring-modules-in-node-js-everything-you-need-to-know-e7fbd119be8 2 | require.extensions [ '.test' ] 3 | = require.extensions [ '.es' ] 4 | = require.extensions [ '.js' ] 5 | -------------------------------------------------------------------------------- /watch/browser.es: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | files : [] 3 | , startPath : '/' 4 | , ui : false 5 | , logPrefix : 'snuggsiツ' 6 | , port : process.env.BROWSER_PORT 7 | , proxy : `http://localhost:${process.env.PORT}` 8 | } 9 | -------------------------------------------------------------------------------- /test/socket.es: -------------------------------------------------------------------------------- 1 | // https://websockets.spec.whatwg.org 2 | // https://github.com/thoov/mock-socket 3 | console.log ('Mocking WebSockets') 4 | 5 | class Socket {} 6 | 7 | class Server {} 8 | 9 | module.exports = { Socket, Server } 10 | -------------------------------------------------------------------------------- /polyfills/defined.test: -------------------------------------------------------------------------------- 1 | const { describe, serve, browse } 2 | = require ('test') 3 | 4 | // https://github.com/w3c/webcomponents/issues/665 5 | describe ('unresolved element', test => { 6 | 7 | test.ok (true) 8 | 9 | test.end () 10 | }) 11 | -------------------------------------------------------------------------------- /test/navigate.es: -------------------------------------------------------------------------------- 1 | // https://playwright.dev 2 | // https://stackoverflow.com/q/62281859 3 | // https://chromewebstore.google.com/detail/playwright-crx 4 | // https://developer.chrome.com/blog/test-automation-evolution 5 | console.log ('Navigator') 6 | 7 | -------------------------------------------------------------------------------- /benchmarks/properties/angular2/main.ts: -------------------------------------------------------------------------------- 1 | //main entry point 2 | import {platformBrowserDynamic} from '@angular/platform-browser-dynamic'; 3 | import {AppModule} from 'angular2/properties.component'; 4 | 5 | platformBrowserDynamic().bootstrapModule(AppModule) 6 | 7 | -------------------------------------------------------------------------------- /middleware/cors.es: -------------------------------------------------------------------------------- 1 | // *** WARNING!!! *** is causing deprecated generator warnings 2 | // 3 | 4 | const 5 | cors 6 | = require ('koa-cors') 7 | 8 | , options 9 | = { methods: ['GET'] } 10 | 11 | 12 | module.exports 13 | = cors (options) 14 | -------------------------------------------------------------------------------- /bin/crank: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | # Thanks Tom M. (@tmornini) for ./crank 4 | 5 | # && bin/cover \ 6 | bin/compile \ 7 | && bin/lint \ 8 | && bin/weigh \ 9 | && bin/distribute \ 10 | && bin/publish \ 11 | && bin/deploy 12 | -------------------------------------------------------------------------------- /bin/deploy: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | declare -rx \ 4 | TEAM=devpunks \ 5 | DOMAIN=snuggsi.com 6 | 7 | echo "🚢 Deploying to Δ Vercel" 8 | echo " 👇" 9 | 10 | vercel switch $TEAM 11 | vercel deploy --prod 12 | vercel domains inspect $DOMAIN 13 | 14 | echo 15 | -------------------------------------------------------------------------------- /bin/serve: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | set -u 4 | 5 | declare -rx \ 6 | PORT=${PORT:-1234} \ 7 | DIRECTORY=${1:-`pwd`} # default working directory to current location 8 | 9 | readlink ${DIRECTORY} 10 | 11 | declare 12 | 13 | node $SNUGGSI/bin/serve.es 14 | -------------------------------------------------------------------------------- /custom-element-registry/index.impl: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | 3 | exports.implementation = class CustomElementRegistryImpl { 4 | constructor () { } 5 | 6 | define (name, constructor) { } 7 | 8 | get (name) { return 'snuggsi' } 9 | 10 | whenDefined (name) { return new Promise } 11 | } 12 | -------------------------------------------------------------------------------- /test/index.test: -------------------------------------------------------------------------------- 1 | const 2 | { test, serve, browse } 3 | = require ('.') 4 | 5 | 6 | test ('test', 7 | t => { t.assert (test), t.end () } ) 8 | 9 | test ('serve', 10 | t => { t.assert (serve), t.end () } ) 11 | 12 | test ('browse', 13 | t => { t.assert (browse), t.end () } ) 14 | -------------------------------------------------------------------------------- /benchmarks/properties/angular2/properties.component.html: -------------------------------------------------------------------------------- 1 |

2 | 3 | 4 | 5 |
6 | 7 | -------------------------------------------------------------------------------- /html-template-element/index.polyfill.es: -------------------------------------------------------------------------------- 1 | void function () { 2 | if ('content' in document.createElement ('template')) return 3 | 4 | for (var template 5 | of document.getElementsByTagName ('template')) 6 | (template.content = new DocumentFragment) 7 | .innerHTML = template.innerHTML 8 | } () 9 | -------------------------------------------------------------------------------- /html-template-element/index.html: -------------------------------------------------------------------------------- 1 | https://people.cs.pitt.edu/~kirk/cs1501/Pruhs/Spring2006/assignments/editdistance/Levenshtein%20Distance.htm 2 | 3 | https://github.com/WebReflection/hyperHTML/pull/100 4 | 5 | https://skillsmatter.com/skillscasts/10805-an-isomorphic-journey-to-a-lighter-and-blazing-fast-virtual-dom-alternative#video 6 | -------------------------------------------------------------------------------- /middleware/assets.es: -------------------------------------------------------------------------------- 1 | const 2 | { route } 3 | = require ( '.' ) 4 | 5 | , { Resource } 6 | = require ('..') 7 | 8 | console.log ( 'assets SNUGGSI', Object.keys ( require ( '..' ) ) ) 9 | console.log ( 'SNUGGSI', process.env.SNUGGSI ) 10 | 11 | 12 | module.exports = 13 | path => route ('/', Resource (`/${path}/`)) 14 | -------------------------------------------------------------------------------- /snippets/paint.es: -------------------------------------------------------------------------------- 1 | // Snippet tool to determine the actual time taken from load to glass 2 | // https://developers.google.com/web/tools/chrome-devtools/snippets 3 | 4 | const 5 | load = chrome.loadTimes () 6 | , paint = load.firstPaintTime - load.startLoadTime 7 | 8 | console.warn 9 | (`First Paint Time ${paint.toFixed (3)} ms`) 10 | -------------------------------------------------------------------------------- /mixins/notification.es: -------------------------------------------------------------------------------- 1 | // https://youtube.com/watch?v=Zq-tRtBN3ws 2 | // https://developer.mozilla.org/en-US/docs/Web/API/notification 3 | // https://developer.mozilla.org/en-US/docs/Web/API/Push_API 4 | //Notification.requestPermission (permission => console.log (`permission ${permission}`)) 5 | //console.log ('Notifications', new Notification ('Hello')) 6 | -------------------------------------------------------------------------------- /bin/transpile: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | declare -r \ 4 | ROOT=dist \ 5 | TRANSPILER=bin/transpile.es 6 | 7 | declare -rx \ 8 | INPUT=${INPUT:-$ROOT/snuggsi.es} \ 9 | OUTPUT=${OUTPUT:-$ROOT/snuggsi.js} 10 | 11 | echo 12 | echo " 🌲 Transpiling …" 13 | echo " 🌳 $INPUT 🎄🌲 $OUTPUT" 14 | echo 15 | 16 | 17 | node $TRANSPILER > $OUTPUT 18 | -------------------------------------------------------------------------------- /examples/header-group/index.es: -------------------------------------------------------------------------------- 1 | Element `header-group` 2 | 3 | (class extends HTMLElement { 4 | 5 | initialize () 6 | { console.warn ('Initializing', this) } 7 | 8 | onconnect () 9 | { console.warn ('Connecting', this) } 10 | 11 | onclick (event) 12 | { console.warn ('Clicked', event) } 13 | 14 | get url () { return 'SHIT' } 15 | }) 16 | -------------------------------------------------------------------------------- /bin/test: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | set -u 4 | 5 | declare -r \ 6 | TEST='node --test' \ 7 | SUITE="${@:-$( echo .{/*,}/*.test{.js,.es} )}" 8 | # TODO add .test suite extensions 9 | # SUITE="${@:-'.{/**,}/*.test{,.js,.es}'}" 10 | 11 | 12 | echo 13 | echo "🚨 Testing, Testing, 1,2,3, ..." 14 | echo 15 | echo " Suite 👉 $SUITE" 16 | echo 17 | 18 | $TEST $SUITE 19 | -------------------------------------------------------------------------------- /bin/watch: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | set -u 4 | 5 | declare -rx DIRECTORY=${1:-$(pwd)} 6 | # declare -rx BROWSER_PORT=${BROWSER_PORT:-4321} 7 | declare -r SNUGGSI=${SNUGGSI:-$( realpath '.' )} 8 | declare -r WATCHER=$SNUGGSI/watch/index.es 9 | 10 | echo "$SNUGGSI" 11 | echo -e "\n\n $DIRECTORY 👀 (bash) Watching Resources for changes...\n\n" 12 | 13 | $WATCHER 14 | -------------------------------------------------------------------------------- /browser-sync.js: -------------------------------------------------------------------------------- 1 | void function () { 2 | 3 | let script = ' 2 | 6 | 7 |

EventTarget

8 | 9 | 10 | 11 | 22 | -------------------------------------------------------------------------------- /benchmarks/document.createElement.es: -------------------------------------------------------------------------------- 1 | console.time() 2 | 3 | const plot = new Array 4 | 5 | for (let i = 0; i < 100; i++) { 6 | const start = new Date 7 | for (let i = 0; i < 1000; i++) { 8 | document.body.append (document.createElement ('infinity-calendar')) 9 | } 10 | console.log ((new Date).getTime() - start.getTime()) 11 | plot.push ((new Date).getTime() - start.getTime()) 12 | } 13 | console.timeEnd() 14 | 15 | console.log (plot.join ('\n')) 16 | -------------------------------------------------------------------------------- /middleware/assets.test: -------------------------------------------------------------------------------- 1 | const 2 | { test, fetch } 3 | = require ('test') 4 | 5 | , { assets } 6 | = require ('.') 7 | 8 | , { Server } 9 | = require ('..') 10 | 11 | 12 | test ('random location of assets') 13 | 14 | test ('assets', async t => { 15 | 16 | const 17 | server 18 | = (new Server).serve `` 19 | 20 | await fetch ('http://localhost:8181') 21 | 22 | 23 | t.ok (true) 24 | 25 | server.close `` 26 | t.end () 27 | }) 28 | -------------------------------------------------------------------------------- /examples/nav-view/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 8 | 9 | 24 | 25 | -------------------------------------------------------------------------------- /bin/publish: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | declare -r DESTINATION=public 4 | declare -ar ASSETS=(favicon.ico index.html index.css typography.css) 5 | 6 | echo "📤 Publishing static assets …" 7 | echo " To 👉 $DESTINATION/" 8 | echo " 👇" 9 | 10 | echo " Adding assets to release" # https://docs.github.com/en/rest/releases/assets?apiVersion=2022-11-28 11 | for asset in ${ASSETS[@]} ; do 12 | echo " 📃 $asset 👉 $DESTINATION/$asset" 13 | cp -f $asset $DESTINATION 14 | done ; echo 15 | -------------------------------------------------------------------------------- /bin/.resources: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | # ARGUMENT PARSING - https://stackoverflow.com/q/192249 4 | # Arrays - https://linuxconfig.org/how-to-use-arrays-in-bash-script 5 | function locate { 6 | for location in ${@} ; do 7 | echo $( realpath "${location}" ) 8 | done 9 | } # locate 10 | 11 | declare -a -x \ 12 | RESOURCES=( $( locate "$PARAMS" ) ) 13 | 14 | echo ; echo "${#RESOURCES} RESOURCE(S):" 15 | 16 | for resource in $RESOURCES ; do 17 | echo " 📂 ${resource}" 18 | done ; echo 19 | -------------------------------------------------------------------------------- /event-target/index.test.es: -------------------------------------------------------------------------------- 1 | const { assert, test, describe, context, view } = require('../test'), 2 | // The resulting document's URL will be a file:// URL, 3 | url = 'event-target/index.test.html' 4 | 5 | describe ('EventTarget', _=> { 6 | const 7 | window = view (url) 8 | , source = window.document.scripts[0].src 9 | 10 | test ('EventTarget', _=> { 11 | console.log( window.document.documentElement.outerHTML ) 12 | 13 | assert (true) 14 | }) // test 15 | }) // describe 16 | 17 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | dist: trusty 2 | language: node_js 3 | node_js: 4 | - 18 5 | addons: 6 | apt: 7 | sources: 8 | - ubuntu-toolchain-r-test 9 | packages: 10 | - g++-4.8 11 | env: 12 | - CXX=g++-4.8 13 | notifications: 14 | email: false 15 | sudo: false 16 | # before_install 17 | # install 18 | # before_script 19 | script: 20 | - bin/snuggsi integrate 21 | # before_cache 22 | # after_success 23 | # after_failure 24 | # before_deploy 25 | # deploy 26 | # after_deploy 27 | # after_script 28 | -------------------------------------------------------------------------------- /examples/cook-book/README.md: -------------------------------------------------------------------------------- 1 | ### Market Cap 2 | 3 | The amount of underlying asset in circulating supply multiplied by price per asset. 4 | 5 | If you wanted to buy / sell alot there is more room. 6 | 7 | 8 | ### Circulating Supply 9 | 10 | The less circulating supply the higher the price. 11 | 12 | 13 | ### Total Supply 14 | 15 | 16 | ## Maximum Supply 17 | 18 | 19 | ## Security Checklist 20 | 21 | - [ ] 2FA 22 | 23 | 24 | ## Historic Performance 25 | 26 | The length of time available to public. 27 | -------------------------------------------------------------------------------- /html-template-element/index.test.html: -------------------------------------------------------------------------------- 1 |

Template (name)

2 | 3 | 6 | 7 | 15 | -------------------------------------------------------------------------------- /event-target/README.md: -------------------------------------------------------------------------------- 1 | # EventTarget 2 | 3 | ## `on ( event, handler )` 4 | 5 | ## `renderable ( handler )` 6 | 7 | ## `reflect ( handler )` 8 | 9 | ## `register ( node, handler, event )` 10 | 11 | ## References 12 | - https://github.com/whatwg/html/pull/4237/files 13 | - https://dom.spec.whatwg.org/#interface-eventtarget 14 | - https://github.com/WebKit/webkit/commit/2ee15a43f1073459c449aac652530a6814587685 15 | - https://medium.com/@WebReflection/dom-handleevent-a-cross-platform-standard-since-year-2000-5bf17287fd38 16 | 17 | -------------------------------------------------------------------------------- /bin/shrink: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | declare -r \ 4 | SHRINK=node_modules/.bin/uglifyjs 5 | 6 | declare -ar \ 7 | extensions=(es js) 8 | 9 | echo " 🌿 Shrinking …" 10 | for extension in ${extensions[@]} 11 | do 12 | declare INPUT=dist/snuggsi.$extension 13 | declare OUTPUT=dist/snuggsi.min.$extension 14 | 15 | echo " 🌲 $INPUT 🌿 $OUTPUT" 16 | 17 | $SHRINK \ 18 | --compress \ 19 | --mangle safari10=true \ 20 | --output $OUTPUT \ 21 | $INPUT 22 | done 23 | 24 | echo 25 | -------------------------------------------------------------------------------- /middleware/index.es: -------------------------------------------------------------------------------- 1 | // Mastering Koa Middleware 2 | // https://medium.com/netscape/mastering-koa-middleware-f0af6d327a69 3 | 4 | module.exports = { 5 | auth : require ( './auth.es' ) 6 | , cors : require ( './cors.es' ) 7 | , security : require ( './security.es' ) 8 | , browse : require ( './browse.es' ) 9 | , snuggsi : require ( './snuggsi.es' ) 10 | //, assets : require ( './assets.es' ) 11 | // , route : require ( './route.es' ) 12 | // , mixins : require ( '../mixins/middleware.es' ) 13 | } // exports 14 | -------------------------------------------------------------------------------- /.vscode/README.md: -------------------------------------------------------------------------------- 1 | # [`Visual Studio Code`](https://code.visualstudio.com/) Settings 2 | 3 | The **Language Identifiers** `*.es`, & `*.test` should be added to contributor's VSCode `file.associations` settings for syntax highlighting. (_See [settings.json](./settings.json)_) 4 | 5 | _⚠️ This is not needed for "normal" usage._ 6 | 7 | 8 | ## References 9 | 10 | - [VSCode Settings Tutorial](https://code.visualstudio.com/docs/getstarted/settings) 11 | - [Language Identifiers](https://code.visualstudio.com/docs/languages/identifiers) 12 | 13 | -------------------------------------------------------------------------------- /html-script-element/README.md: -------------------------------------------------------------------------------- 1 | # `HTMLScriptElement` 2 | 3 | The HTML ` 28 | 29 |

Test Harness

30 | 31 | Hot
Damn! 32 | -------------------------------------------------------------------------------- /middleware/cors.test: -------------------------------------------------------------------------------- 1 | const 2 | { test, fetch } 3 | = require ('test') 4 | 5 | , { Server } 6 | = require ('..') 7 | 8 | test ('calling next middlewaree') 9 | 10 | 11 | test ('Access-Control-Allow-Origin: *', async t => { 12 | 13 | const 14 | server = (new Server).serve `` 15 | , response = await fetch ('http://localhost:8181/') 16 | 17 | 18 | t.equal 19 | ('*', response.headers.get ('access-control-allow-origin')) 20 | 21 | server.close `` 22 | t.end () 23 | }) 24 | 25 | 26 | test ('Access-Control-Allow-Methods: *', async t => { 27 | 28 | const 29 | server = (new Server).serve `` 30 | , response = await fetch ('http://localhost:8181/') 31 | 32 | 33 | t.equal 34 | ('GET', response.headers.get ('access-control-allow-methods')) 35 | 36 | server.close `` 37 | t.end () 38 | }) 39 | -------------------------------------------------------------------------------- /examples/add-subtract/index.html: -------------------------------------------------------------------------------- 1 | <add-subtract> 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 |

<add-subtract>

12 | 13 | 14 | {count} 15 | 16 | 17 | 18 | 19 | 20 | 21 | 25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /examples/github-ribbon/example.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | snuggsi.esツ 4 | 5 | 8 | 9 | 13 | 14 | 19 | 20 | 25 | 26 | 27 | 28 | 29 | 31 | 32 | 33 | 34 |

<github-ribbon>

35 | See more component examples 36 | 37 | 38 | -------------------------------------------------------------------------------- /element/index.es: -------------------------------------------------------------------------------- 1 | // http://2ality.com/2013/09/window.html 2 | // http://tobyho.com/2013/03/13/window-prop-vs-global-var 3 | 4 | const Element = tag => ( 5 | 6 | // const constructor =// swizzle 7 | // typeof tag === 'string' 8 | // // ? HTMLCustomElement 9 | // // : HTMLElement 10 | 11 | //https://gist.github.com/allenwb/53927e46b31564168a1d 12 | // https://github.com/w3c/webcomponents/issues/587#issuecomment-271031208 13 | // https://github.com/w3c/webcomponents/issues/587#issuecomment-254017839 14 | 15 | Element => // https://en.wikipedia.org/wiki/Higher-order_function 16 | customElements.define 17 | ( tag + '', Custom (Element) ) 18 | 19 | // Assign `window.Element.prototype` in case of feature checking on `Element` 20 | // E.prototype = Element.prototype 21 | // return E 22 | ) 23 | -------------------------------------------------------------------------------- /parent-node/index.idl: -------------------------------------------------------------------------------- 1 | [NoInterfaceObject, 2 | Exposed=Window] 3 | interface ParentNode { 4 | [SameObject] readonly attribute HTMLCollection children; 5 | readonly attribute Element? firstElementChild; 6 | readonly attribute Element? lastElementChild; 7 | readonly attribute unsigned long childElementCount; 8 | 9 | [CEReactions, Unscopable] void prepend((Node or DOMString)... nodes); 10 | [CEReactions, Unscopable] void append((Node or DOMString)... nodes); 11 | 12 | Element? querySelector(DOMString selectors); 13 | [NewObject] NodeList querySelectorAll(DOMString selectors); 14 | 15 | // snuggsi ツ 16 | Element? id(DOMString identifier); 17 | Element? select(DOMString selectors); 18 | [NewObject] Array selectAll(DOMString selectors); 19 | }; 20 | Document implements ParentNode; 21 | DocumentFragment implements ParentNode; 22 | Element implements ParentNode; 23 | 24 | -------------------------------------------------------------------------------- /parent-node/README.md: -------------------------------------------------------------------------------- 1 | # `ParentNode` 2 | 3 | Interface used for parent -> child node relationships. 4 | 5 | - [Read More on MDN](https://developer.mozilla.org/en-US/docs/Web/API/ParentNode) 6 | - [`WHATWG` `ParentNode` Mixin](https://dom.spec.whatwg.org/#interface-parentnode) 7 | 8 | 9 | ## `.select (selector)` 10 | 11 | ## `.selectAll (selector)` 12 | 13 | 14 | https://dom.spec.whatwg.org/#interface-parentnode 15 | 16 | To convert nodes into a node, given nodes and document, run these steps: 17 | 18 | 1. Let node be null. 19 | 20 | 2. Replace each string in nodes with a new Text node whose data is the string and node document is document. 21 | 22 | 3. If nodes contains one node, set node to that node. 23 | 24 | 4. Otherwise, set node to a new DocumentFragment whose node document is document, and then append each node in nodes, if any, to it. 25 | 26 | 5. Return node. 27 | -------------------------------------------------------------------------------- /examples/header-group/example.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | <header-group> 4 | 5 | 6 | 7 | 8 | 9 | 15 | 16 | 17 |

<header-group>

18 | See more component examples 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 |

My Own Header

27 |

slots control output arrangement

28 | 29 | 30 | 31 |

MrBernnz & Snuggsi Header

32 | 33 | -------------------------------------------------------------------------------- /examples/weather-viewer/fixture.json: -------------------------------------------------------------------------------- 1 | { 2 | "coord":{ 3 | "lon":-73.97, 4 | "lat":40.79 5 | }, 6 | "weather":[ 7 | { 8 | "id":701, 9 | "main":"Mist", 10 | "description":"mist", 11 | "icon":"50d" 12 | } 13 | ], 14 | "base":"stations", 15 | "main":{ 16 | "temp":62.08, 17 | "pressure":1027, 18 | "humidity":51, 19 | "temp_min":57.2, 20 | "temp_max":66.2 21 | }, 22 | "visibility":16093, 23 | "wind":{ 24 | "speed":3.83, 25 | "deg":145 26 | }, 27 | "clouds":{ 28 | "all":90 29 | }, 30 | "dt":1495314900, 31 | "sys":{ 32 | "type":1, 33 | "id":1969, 34 | "message":0.0053, 35 | "country":"US", 36 | "sunrise":1495272798, 37 | "sunset":1495325532 38 | }, 39 | "id":5125771, 40 | "name":"Manhattan", 41 | "cod":200 42 | } 43 | 44 | -------------------------------------------------------------------------------- /middleware/auth.es: -------------------------------------------------------------------------------- 1 | // Based on Hypertext Transfer Protocol (HTTP/1.1): Authentication 2 | // https://tools.ietf.org/html/rfc7235#section-4.1 3 | 4 | // JWT 5 | // - https://sohamkamani.com/nodejs/jwt-authentication 6 | // - https://github.com/sohamkamani/jwt-nodejs-example 7 | 8 | const 9 | auth = require ('basic-auth') 10 | 11 | 12 | module.exports = ( options = { password : 'abc123'} ) => 13 | 14 | async (context, next, { name, pass: password } = auth (context)) => 15 | 16 | name != options.name 17 | || password != options.password 18 | 19 | // https://tools.ietf.org/html/rfc7235#section-4.1 20 | // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/WWW-Authenticate 21 | // WWW-Authenticate: Basic realm="Access to the staging site", charset="UTF-8" 22 | ? !!! context.set ('WWW-Authenticate', 'Basic') && (context.status = 401) 23 | 24 | : await next () 25 | -------------------------------------------------------------------------------- /examples/README.md: -------------------------------------------------------------------------------- 1 | # snuggsi ツ - Easy Web Components 2 | 3 | **Create RealWorld App** 4 | 5 | https://github.com/koajs/koa/issues/979 6 | https://github.com/gothinkster/realworld 7 | 8 | 9 | ## [Component Registry](http://snuggsi.herokuapp.com/examples) 10 | 11 | 12 | ## The Template 13 | 14 | See [MDN <template>](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template) 15 | for more details 16 | 17 | - `