Skip to content

Commit 35733ad

Browse files
filipbechfilipbech
committed
Project setup + 3 dummy elements
1 parent e3a0c1f commit 35733ad

27 files changed

+14776
-1
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 = */

‎.eslintrc.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
module.exports = {
2+
root: true,
3+
parser: '@typescript-eslint/parser',
4+
plugins: ['@typescript-eslint', 'import', 'html'],
5+
extends: [
6+
'eslint:recommended',
7+
'plugin:@typescript-eslint/eslint-recommended',
8+
'plugin:@typescript-eslint/recommended',
9+
'plugin:import/errors',
10+
'plugin:import/warnings',
11+
],
12+
rules: {
13+
// disable the rule for all files
14+
'@typescript-eslint/explicit-function-return-type': 'off',
15+
'@typescript-eslint/no-non-null-assertion': 'off',
16+
'import/named': 'off',
17+
'@typescript-eslint/no-explicit-any': 'off',
18+
'import/no-unresolved': 'off',
19+
},
20+
};

‎.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
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/
21+
/out-tsc/
22+
23+
24+
custom-elements.json

‎.storybook/main.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
module.exports = {
2+
stories: ['../**/out-tsc/src/**/*.stories.js'],
3+
addons: [
4+
'storybook-prebuilt/addon-knobs/register.js',
5+
'storybook-prebuilt/addon-docs/register.js',
6+
'storybook-prebuilt/addon-viewport/register.js',
7+
'storybook-prebuilt/addon-a11y/register.js',
8+
],
9+
esDevServer: {
10+
// custom es-dev-server options
11+
nodeResolve: true,
12+
watch: true,
13+
open: true,
14+
},
15+
};

‎.storybook/manager.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { addons } from 'storybook-prebuilt/addons.js';
2+
import uuiTheme from './theme.js';
3+
4+
addons.setConfig({
5+
theme: uuiTheme,
6+
});

‎.storybook/preview.js

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import {
2+
addDecorator,
3+
addParameters,
4+
setCustomElements,
5+
withA11y,
6+
withKnobs,
7+
withWebComponentsKnobs,
8+
} from '@open-wc/demoing-storybook';
9+
10+
addDecorator(withA11y);
11+
addDecorator(withKnobs);
12+
addDecorator(withWebComponentsKnobs);
13+
14+
addParameters({
15+
docs: {
16+
iframeHeight: '200px',
17+
},
18+
});
19+
20+
addParameters({
21+
docs: {
22+
iframeHeight: '200px',
23+
},
24+
});
25+
26+
async function run() {
27+
const customElements = await (
28+
await fetch(new URL('../custom-elements.json', import.meta.url))
29+
).json();
30+
setCustomElements(customElements);
31+
}
32+
33+
run();

‎.storybook/theme.js

+9
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2020 uui-app
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

+30-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,31 @@
11
# Umbraco.UI
2-
Umbraco UI Components
2+
3+
This is a WIP UI-library for Umbraco CMS and friends. This means that all elements should make sense in any context.
4+
5+
The elements are built with LitElement and is meant to be displayed with storybook. You can build the library as a single bundle (with dependencies), or you can just import source directly and build yourself.
6+
7+
The storybook knobs and docs are automatically created from the source, so please make sure to add the appropriate jsdoc-comments. See an existing element (eg. uui-button) for inpiration, or checkout [web-component-analyzer](https://github.com/runem/web-component-analyzer) for docs.
8+
9+
Once the project is "ready", it shall be released on npm for consumption.
10+
11+
## Best practices for contributing to this library
12+
- Properties should only use attr-reflection for styling - don’t map component-state to classes - use attr-reflection!
13+
- New dependencies can only be added by HQ-team and only after scrutinizing debate (to keep size down)
14+
- Components can’t assume Umbraco context
15+
- Elements shouldn’t depend on TagNames - their own or children - instead use :host or this and use classes/id’s for selection
16+
- Elements always use a shadow-root (shadowDOM - for encapsulation)
17+
- Styles should have as simple rules as possible
18+
- UI-events should be unique types that extend from our UUIEvent (see utils/) (for typing reasons)
19+
- Elements are exported side-effect free (no registration) in the *.element.ts file, and with the registration in the index.ts file
20+
21+
## Before new elements can me merged
22+
- Elements must have tests and pass them
23+
- Elements must pass basic a11y test
24+
- Elements must have a storybook setup
25+
- Source-code must follow the eslint rules
26+
27+
## Scripts
28+
- `storybook` opens storybook for the elements
29+
- `test` runs your test suite with Web Test Runner
30+
' `format` runs autoformatter
31+
- `lint` runs the linter for your project

‎index.html

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!doctype html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
7+
<meta name="Description" content="Put your description here.">
8+
<base href="/">
9+
10+
<style>
11+
html,
12+
body {
13+
margin: 0;
14+
padding: 0;
15+
font-family: sans-serif;
16+
background-color: #ededed;
17+
}
18+
</style>
19+
<title>uui-app</title>
20+
</head>
21+
22+
<body>
23+
<uui-app></uui-app>
24+
25+
<script type="module" src="./out-tsc/src/uui-app.js"></script>
26+
</body>
27+
28+
</html>

0 commit comments

Comments
 (0)