Skip to content

Commit 8af6d52

Browse files
committed
initial commit
0 parents  commit 8af6d52

15 files changed

+7296
-0
lines changed

.editorconfig

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# EditorConfig helps developers define and maintain consistent
2+
# coding styles between different editors and IDEs
3+
# editorconfig.org
4+
5+
root = true
6+
7+
8+
[*]
9+
10+
# Change these settings to your own preference
11+
indent_style = space
12+
indent_size = 2
13+
14+
# We recommend you to keep these unchanged
15+
end_of_line = lf
16+
charset = utf-8
17+
trim_trailing_whitespace = true
18+
insert_final_newline = true
19+
20+
[*.md]
21+
trim_trailing_whitespace = false
22+
23+
[*.json]
24+
indent_size = 2
25+
26+
[*.{html,js,md}]
27+
block_comment_start = /**
28+
block_comment = *
29+
block_comment_end = */

.gitignore

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
## editors
2+
/.idea
3+
/.vscode
4+
5+
## system files
6+
.DS_Store
7+
8+
## npm
9+
/node_modules/
10+
/npm-debug.log
11+
12+
## testing
13+
/coverage/
14+
15+
## temp folders
16+
/.tmp/
17+
18+
# build
19+
/_site/
20+
/dist/

LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2019 preignition-template
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

+92
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
# \<preignition-template>
2+
3+
This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
4+
5+
## Installation
6+
```bash
7+
npm i preignition-template
8+
```
9+
10+
## Usage
11+
```html
12+
<script type="module">
13+
import 'preignition-template/preignition-template.js';
14+
</script>
15+
16+
<preignition-template></preignition-template>
17+
```
18+
19+
## Linting with ESLint, Prettier, and Types
20+
To scan the project for linting errors, run
21+
```bash
22+
npm run lint
23+
```
24+
25+
You can lint with ESLint and Prettier individually as well
26+
```bash
27+
npm run lint:eslint
28+
```
29+
```bash
30+
npm run lint:prettier
31+
```
32+
33+
To automatically fix many linting errors, run
34+
```bash
35+
npm run format
36+
```
37+
38+
You can format using ESLint and Prettier individually as well
39+
```bash
40+
npm run format:eslint
41+
```
42+
```bash
43+
npm run format:prettier
44+
```
45+
46+
## Testing with Karma
47+
To run the suite of karma tests, run
48+
```bash
49+
npm run test
50+
```
51+
or to run them in compatibility mode for legacy browsers
52+
```bash
53+
npm run test:compatibility
54+
```
55+
56+
To run the tests in watch mode (for <abbr title="test driven development">TDD</abbr>, for example), run
57+
58+
```bash
59+
npm run test:watch
60+
```
61+
or
62+
```bash
63+
npm run test:compatibility
64+
```
65+
66+
## Testing with Karma via BrowserStack
67+
To run the suite of karma tests in BrowserStack, run
68+
```bash
69+
npm run test:bs
70+
```
71+
72+
## Managing Test Snapshots
73+
You can manage the test snapshots using
74+
```bash
75+
npm run test:update-snapshots
76+
```
77+
or
78+
```bash
79+
npm run test:prune-snapshots
80+
```
81+
82+
83+
## Local Demo with `es-dev-server`
84+
```bash
85+
npm start
86+
```
87+
To run a local development server that serves the basic demo located in `demo/index.html`
88+
89+
```bash
90+
npm start:compatibility
91+
```
92+
To run a local development server in compatibility mode for older browsers that serves the basic demo located in `demo/index.html`

__snapshots__/PreignitionTemplate.md

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# `PreignitionTemplate`
2+
3+
#### `shows initially the text "hey there Nr. 5!" and an "increment" button`
4+
5+
```html
6+
<h2>
7+
Hey there Nr. 5!
8+
</h2>
9+
<button>
10+
increment
11+
</button>
12+
13+
```
14+

custom-elements.json

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"version": 2,
3+
"tags": [
4+
{
5+
"name": "preignition-template",
6+
"description": "A component with a title and an action counter",
7+
"properties": [
8+
{
9+
"name": "title",
10+
"type": "String",
11+
"description": "The title of your component",
12+
"default": "Hey there"
13+
},
14+
{
15+
"name": "counter",
16+
"type": "Number",
17+
"description": "An action counter",
18+
"default": 0
19+
}
20+
],
21+
"events": [],
22+
"slots": [],
23+
"cssProperties": [
24+
{
25+
"name": "--preignition-template-text-color",
26+
"description": "Main Text Color",
27+
"type": "Color"
28+
}
29+
]
30+
}
31+
]
32+
}

demo/index.html

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<!doctype html>
2+
<html lang="en-GB">
3+
<head>
4+
<meta charset="utf-8">
5+
<style>
6+
body {
7+
background: #fafafa;
8+
}
9+
</style>
10+
</head>
11+
<body>
12+
<div id="demo"></div>
13+
14+
<script type="module">
15+
import { html, render } from 'lit-html';
16+
import '../preignition-template.js';
17+
18+
const title = 'Hello owc World!';
19+
render(
20+
html`
21+
<preignition-template .title=${title}>
22+
some more light-dom
23+
</preignition-template>
24+
`,
25+
document.querySelector('#demo')
26+
);
27+
</script>
28+
</body>
29+
</html>

index.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { PreignitionTemplate } from './src/PreignitionTemplate.js';

karma.bs.config.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
/* eslint-disable import/no-extraneous-dependencies */
2+
const merge = require('deepmerge');
3+
const { bsSettings } = require('@open-wc/testing-karma-bs');
4+
const createBaseConfig = require('./karma.conf.js');
5+
6+
module.exports = config => {
7+
config.set(
8+
merge(bsSettings(config), createBaseConfig(config), {
9+
browserStack: {
10+
project: 'your-name',
11+
},
12+
}),
13+
);
14+
15+
return config;
16+
};

karma.conf.js

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
/* eslint-disable import/no-extraneous-dependencies */
2+
const { createDefaultConfig } = require('@open-wc/testing-karma');
3+
const merge = require('deepmerge');
4+
5+
module.exports = config => {
6+
config.set(
7+
merge(createDefaultConfig(config), {
8+
files: [
9+
// runs all files ending with .test in the test folder,
10+
// can be overwritten by passing a --grep flag. examples:
11+
//
12+
// npm run test -- --grep test/foo/bar.test.js
13+
// npm run test -- --grep test/bar/*
14+
{ pattern: config.grep ? config.grep : 'test/**/*.test.js', type: 'module' },
15+
],
16+
17+
esm: {
18+
nodeResolve: true,
19+
},
20+
// you can overwrite/extend the config further
21+
}),
22+
);
23+
return config;
24+
};

package.json

+58
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
{
2+
"name": "@preignition/template",
3+
"version": "0.0.0",
4+
"description": "Webcomponent preignition-template following open-wc recommendations",
5+
"author": "preignition-template",
6+
"license": "MIT",
7+
"main": "index.js",
8+
"module": "index.js",
9+
"scripts": {
10+
"start": "es-dev-server --app-index demo/index.html --node-resolve --open --watch",
11+
"lint:eslint": "eslint --ext .js,.html . --ignore-path .gitignore",
12+
"format:eslint": "eslint --ext .js,.html . --fix --ignore-path .gitignore",
13+
"lint:prettier": "prettier \"**/*.js\" --check --ignore-path .gitignore",
14+
"format:prettier": "prettier \"**/*.js\" --write --ignore-path .gitignore",
15+
"lint": "npm run lint:eslint && npm run lint:prettier",
16+
"format": "npm run format:eslint && npm run format:prettier",
17+
"test": "karma start --coverage",
18+
"test:watch": "karma start --auto-watch=true --single-run=false",
19+
"test:update-snapshots": "karma start --update-snapshots",
20+
"test:prune-snapshots": "karma start --prune-snapshots",
21+
"test:bs": "karma start karma.bs.config.js --coverage"
22+
},
23+
"dependencies": {
24+
"lit-html": "^1.1.2",
25+
"lit-element": "^2.2.1"
26+
},
27+
"devDependencies": {
28+
"es-dev-server": "^1.23.0",
29+
"eslint": "^6.1.0",
30+
"@open-wc/eslint-config": "^2.0.0",
31+
"@open-wc/prettier-config": "^0.1.10",
32+
"husky": "^1.0.0",
33+
"lint-staged": "^8.0.0",
34+
"@open-wc/testing-karma": "^3.0.0",
35+
"deepmerge": "^3.2.0",
36+
"@open-wc/testing-karma-bs": "^1.0.0",
37+
"@open-wc/testing": "^2.0.0"
38+
},
39+
"eslintConfig": {
40+
"extends": [
41+
"@open-wc/eslint-config",
42+
"eslint-config-prettier"
43+
]
44+
},
45+
"prettier": "@open-wc/prettier-config",
46+
"husky": {
47+
"hooks": {
48+
"pre-commit": "lint-staged"
49+
}
50+
},
51+
"lint-staged": {
52+
"*.js": [
53+
"eslint --fix",
54+
"prettier --write",
55+
"git add"
56+
]
57+
}
58+
}

0 commit comments

Comments
 (0)