mirror of
https://github.com/les-briques-du-web/briques-poster.git
synced 2026-03-10 00:41:17 +00:00
Create repo and latest lit
This commit is contained in:
Julien Lengrand-Lambert
29
.editorconfig
Normal file
29
.editorconfig
Normal file
@@ -0,0 +1,29 @@
|
||||
# EditorConfig helps developers define and maintain consistent
|
||||
# coding styles between different editors and IDEs
|
||||
# editorconfig.org
|
||||
|
||||
root = true
|
||||
|
||||
|
||||
[*]
|
||||
|
||||
# Change these settings to your own preference
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
|
||||
# We recommend you to keep these unchanged
|
||||
end_of_line = lf
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = false
|
||||
|
||||
[*.json]
|
||||
indent_size = 2
|
||||
|
||||
[*.{html,js,md}]
|
||||
block_comment_start = /**
|
||||
block_comment = *
|
||||
block_comment_end = */
|
||||
23
.gitignore
vendored
Normal file
23
.gitignore
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
## editors
|
||||
/.idea
|
||||
/.vscode
|
||||
|
||||
## system files
|
||||
.DS_Store
|
||||
|
||||
## npm
|
||||
/node_modules/
|
||||
/npm-debug.log
|
||||
|
||||
## testing
|
||||
/coverage/
|
||||
|
||||
## temp folders
|
||||
/.tmp/
|
||||
|
||||
# build
|
||||
/_site/
|
||||
/dist/
|
||||
/out-tsc/
|
||||
|
||||
storybook-static
|
||||
21
LICENSE
Normal file
21
LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2021 briques-posters
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
30
README.md
Normal file
30
README.md
Normal file
@@ -0,0 +1,30 @@
|
||||
<p align="center">
|
||||
<img width="200" src="https://open-wc.org/hero.png"></img>
|
||||
</p>
|
||||
|
||||
## Open-wc Starter App
|
||||
|
||||
[](https://github.com/open-wc)
|
||||
|
||||
## Quickstart
|
||||
|
||||
To get started:
|
||||
|
||||
```sh
|
||||
npm init @open-wc
|
||||
# requires node 10 & npm 6 or higher
|
||||
```
|
||||
|
||||
## Scripts
|
||||
|
||||
- `start` runs your app for development, reloading on file changes
|
||||
- `start:build` runs your app after it has been built using the build command
|
||||
- `build` builds your app and outputs it in your `dist` directory
|
||||
- `test` runs your test suite with Web Test Runner
|
||||
- `lint` runs the linter for your project
|
||||
|
||||
## Tooling configs
|
||||
|
||||
For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.
|
||||
|
||||
If you customize the configuration a lot, you can consider moving them to individual files.
|
||||
26
custom-elements.json
Normal file
26
custom-elements.json
Normal file
@@ -0,0 +1,26 @@
|
||||
{
|
||||
"version": 2,
|
||||
"tags": [
|
||||
{
|
||||
"name": "briques-poster",
|
||||
"description": "An application with a title and an action counter",
|
||||
"properties": [
|
||||
{
|
||||
"name": "title",
|
||||
"type": "String",
|
||||
"description": "The title of your application",
|
||||
"default": "Hey there"
|
||||
},
|
||||
{
|
||||
"name": "page",
|
||||
"type": "String",
|
||||
"description": "Which page to show",
|
||||
"default": "main"
|
||||
}
|
||||
],
|
||||
"events": [],
|
||||
"slots": [],
|
||||
"cssProperties": []
|
||||
}
|
||||
]
|
||||
}
|
||||
28
index.html
Normal file
28
index.html
Normal file
@@ -0,0 +1,28 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
|
||||
<meta name="Description" content="Put your description here.">
|
||||
<base href="/">
|
||||
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: sans-serif;
|
||||
background-color: #ededed;
|
||||
}
|
||||
</style>
|
||||
<title>briques-posters</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<briques-poster></briques-poster>
|
||||
|
||||
<script type="module" src="./out-tsc/src/BriquesPoster.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
20494
package-lock.json
generated
Normal file
20494
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
78
package.json
Normal file
78
package.json
Normal file
@@ -0,0 +1,78 @@
|
||||
{
|
||||
"devDependencies": {
|
||||
"@open-wc/building-rollup": "^1.10.0",
|
||||
"@open-wc/eslint-config": "^4.3.0",
|
||||
"@open-wc/testing": "^2.5.33",
|
||||
"@typescript-eslint/eslint-plugin": "^4.22.0",
|
||||
"@typescript-eslint/parser": "^4.22.0",
|
||||
"@web/dev-server": "^0.1.17",
|
||||
"@web/test-runner": "^0.12.20",
|
||||
"concurrently": "^5.3.0",
|
||||
"deepmerge": "^4.2.2",
|
||||
"eslint": "^7.25.0",
|
||||
"eslint-config-prettier": "^7.2.0",
|
||||
"husky": "^4.3.8",
|
||||
"lint-staged": "^10.5.4",
|
||||
"prettier": "^2.2.1",
|
||||
"rimraf": "^3.0.2",
|
||||
"rollup": "^2.46.0",
|
||||
"tslib": "^2.2.0",
|
||||
"typescript": "^4.2.4"
|
||||
},
|
||||
"scripts": {
|
||||
"lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
|
||||
"format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore",
|
||||
"test": "tsc && wtr --coverage",
|
||||
"test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\"",
|
||||
"build": "rimraf dist && tsc && rollup -c rollup.config.js",
|
||||
"start:build": "npm run build && web-dev-server --root-dir dist --app-index index.html --open --compatibility none",
|
||||
"start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\""
|
||||
},
|
||||
"name": "briques-posters",
|
||||
"version": "0.0.0",
|
||||
"description": "Webcomponent briques-posters following open-wc recommendations",
|
||||
"author": "briques-posters",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"lit": "2.0.0-rc.1"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"extends": [
|
||||
"@open-wc/eslint-config",
|
||||
"eslint-config-prettier"
|
||||
],
|
||||
"plugins": [
|
||||
"@typescript-eslint"
|
||||
],
|
||||
"rules": {
|
||||
"no-unused-vars": "off",
|
||||
"@typescript-eslint/no-unused-vars": [
|
||||
"error"
|
||||
],
|
||||
"import/no-unresolved": "off",
|
||||
"import/extensions": [
|
||||
"error",
|
||||
"always",
|
||||
{
|
||||
"ignorePackages": true
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"prettier": {
|
||||
"singleQuote": true,
|
||||
"arrowParens": "avoid"
|
||||
},
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "lint-staged"
|
||||
}
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.ts": [
|
||||
"eslint --fix",
|
||||
"prettier --write"
|
||||
]
|
||||
}
|
||||
}
|
||||
31
rollup.config.js
Normal file
31
rollup.config.js
Normal file
@@ -0,0 +1,31 @@
|
||||
import merge from 'deepmerge';
|
||||
// use createSpaConfig for bundling a Single Page App
|
||||
import { createSpaConfig } from '@open-wc/building-rollup';
|
||||
|
||||
// use createBasicConfig to do regular JS to JS bundling
|
||||
// import { createBasicConfig } from '@open-wc/building-rollup';
|
||||
|
||||
const baseConfig = createSpaConfig({
|
||||
// use the outputdir option to modify where files are output
|
||||
// outputDir: 'dist',
|
||||
|
||||
// if you need to support older browsers, such as IE11, set the legacyBuild
|
||||
// option to generate an additional build just for this browser
|
||||
// legacyBuild: true,
|
||||
|
||||
// development mode creates a non-minified build for debugging or development
|
||||
developmentMode: process.env.ROLLUP_WATCH === 'true',
|
||||
|
||||
// set to true to inject the service worker registration into your index.html
|
||||
injectServiceWorker: false,
|
||||
});
|
||||
|
||||
export default merge(baseConfig, {
|
||||
// if you use createSpaConfig, you can use your index.html as entrypoint,
|
||||
// any <script type="module"> inside will be bundled by rollup
|
||||
input: './index.html',
|
||||
|
||||
// alternatively, you can use your JS as entrypoint for rollup and
|
||||
// optionally set a HTML template manually
|
||||
// input: './app.js',
|
||||
});
|
||||
51
src/BriquesPoster.ts
Normal file
51
src/BriquesPoster.ts
Normal file
@@ -0,0 +1,51 @@
|
||||
import {LitElement, html, css} from 'lit';
|
||||
import {customElement, property} from 'lit/decorators.js';
|
||||
|
||||
@customElement("briques-poster")
|
||||
export class BriquesPoster extends LitElement {
|
||||
|
||||
@property() title = 'My app';
|
||||
|
||||
static styles = css`
|
||||
:host {
|
||||
}
|
||||
|
||||
main {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
|
||||
.app-footer {
|
||||
font-size: calc(12px + 0.5vmin);
|
||||
align-items: center;
|
||||
}
|
||||
`;
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<main>
|
||||
<h1>${this.title}</h1>
|
||||
|
||||
<p>Edit <code>src/BriquesPosters.ts</code> and save to reload.</p>
|
||||
<a
|
||||
class="app-link"
|
||||
href="https://open-wc.org/guides/developing-components/code-examples"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Code examples
|
||||
</a>
|
||||
</main>
|
||||
|
||||
<p class="app-footer">
|
||||
🚽 Made with love by
|
||||
<a
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
href="https://github.com/open-wc"
|
||||
>open-wc</a
|
||||
>.
|
||||
</p>
|
||||
`;
|
||||
}
|
||||
}
|
||||
21
test/briques-posters.test.ts
Normal file
21
test/briques-posters.test.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
// import { html, fixture, expect } from '@open-wc/testing';
|
||||
//
|
||||
// import { BriquesPosters } from '../src/BriquesPosters.js';
|
||||
// import '../src/briques-posters.js';
|
||||
//
|
||||
// describe('BriquesPosters', () => {
|
||||
// let element: BriquesPosters;
|
||||
// beforeEach(async () => {
|
||||
// element = await fixture(html`<briques-posters></briques-posters>`);
|
||||
// });
|
||||
//
|
||||
// it('renders a h1', () => {
|
||||
// const h1 = element.shadowRoot!.querySelector('h1')!;
|
||||
// expect(h1).to.exist;
|
||||
// expect(h1.textContent).to.equal('My app');
|
||||
// });
|
||||
//
|
||||
// it('passes the a11y audit', async () => {
|
||||
// await expect(element).shadowDom.to.be.accessible();
|
||||
// });
|
||||
// });
|
||||
20
tsconfig.json
Normal file
20
tsconfig.json
Normal file
@@ -0,0 +1,20 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es2018",
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node",
|
||||
"noEmitOnError": true,
|
||||
"lib": ["es2017", "dom"],
|
||||
"strict": true,
|
||||
"esModuleInterop": false,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"experimentalDecorators": true,
|
||||
"importHelpers": true,
|
||||
"outDir": "out-tsc",
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"rootDir": "./",
|
||||
"incremental": true
|
||||
},
|
||||
"include": ["**/*.ts"]
|
||||
}
|
||||
28
web-dev-server.config.mjs
Normal file
28
web-dev-server.config.mjs
Normal file
@@ -0,0 +1,28 @@
|
||||
// import { hmrPlugin, presets } from '@open-wc/dev-server-hmr';
|
||||
|
||||
/** Use Hot Module replacement by adding --hmr to the start command */
|
||||
const hmr = process.argv.includes('--hmr');
|
||||
|
||||
export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
|
||||
nodeResolve: true,
|
||||
open: '/',
|
||||
watch: !hmr,
|
||||
|
||||
/** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
|
||||
// esbuildTarget: 'auto'
|
||||
|
||||
/** Set appIndex to enable SPA routing */
|
||||
// appIndex: 'demo/index.html',
|
||||
|
||||
/** Confgure bare import resolve plugin */
|
||||
// nodeResolve: {
|
||||
// exportConditions: ['browser', 'development']
|
||||
// },
|
||||
|
||||
plugins: [
|
||||
/** Use Hot Module Replacement by uncommenting. Requires @open-wc/dev-server-hmr plugin */
|
||||
// hmr && hmrPlugin({ exclude: ['**/*/node_modules/**/*'], presets: [presets.litElement] }),
|
||||
],
|
||||
|
||||
// See documentation for all available options
|
||||
});
|
||||
29
web-test-runner.config.mjs
Normal file
29
web-test-runner.config.mjs
Normal file
@@ -0,0 +1,29 @@
|
||||
// import { playwrightLauncher } from '@web/test-runner-playwright';
|
||||
|
||||
export default /** @type {import("@web/test-runner").TestRunnerConfig} */ ({
|
||||
files: 'out-tsc/test/**/*.test.js',
|
||||
nodeResolve: true,
|
||||
|
||||
/** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
|
||||
// esbuildTarget: 'auto',
|
||||
|
||||
/** Confgure bare import resolve plugin */
|
||||
// nodeResolve: {
|
||||
// exportConditions: ['browser', 'development']
|
||||
// },
|
||||
|
||||
/** Amount of browsers to run concurrently */
|
||||
// concurrentBrowsers: 2,
|
||||
|
||||
/** Amount of test files per browser to test concurrently */
|
||||
// concurrency: 1,
|
||||
|
||||
/** Browsers to run tests on */
|
||||
// browsers: [
|
||||
// playwrightLauncher({ product: 'chromium' }),
|
||||
// playwrightLauncher({ product: 'firefox' }),
|
||||
// playwrightLauncher({ product: 'webkit' }),
|
||||
// ],
|
||||
|
||||
// See documentation for all available options
|
||||
});
|
||||
Reference in New Issue
Block a user