Skip to content

Commit c0fd9ce

Browse files
committed
publish new version
1 parent 72d78e8 commit c0fd9ce

17 files changed

+8842
-689
lines changed

Diff for: .babelrc.js

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
const helperWhitelist = require('./node_modules/@fooloomanzoo/input-picker-pattern/utils/babel/helper-whitelist');
2+
3+
module.exports = {
4+
presets: [
5+
[
6+
'@babel/preset-env',
7+
{
8+
modules: false,
9+
exclude: ['transform-async-to-generator', 'transform-regenerator'],
10+
targets: {
11+
ie: 11
12+
}
13+
}
14+
]
15+
],
16+
plugins: [
17+
[
18+
'@babel/external-helpers',
19+
{
20+
whitelist: helperWhitelist
21+
}
22+
],
23+
'@babel/syntax-dynamic-import',
24+
'@babel/syntax-object-rest-spread',
25+
[
26+
'module:fast-async',
27+
{
28+
spec: true
29+
}
30+
]
31+
],
32+
env: {
33+
production: {
34+
plugins: [
35+
[
36+
'template-html-minifier',
37+
{
38+
modules: {
39+
'@polymer/polymer/lib/utils/html-tag.js': ['html']
40+
},
41+
htmlMinifier: {
42+
collapseWhitespace: true,
43+
minifyCSS: true,
44+
removeComments: true
45+
}
46+
}
47+
]
48+
]
49+
}
50+
}
51+
};

Diff for: .eslintrc.json

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"extends": [
3+
"prettier"
4+
],
5+
"env": {
6+
"browser": true,
7+
"node": true,
8+
"es6": true
9+
},
10+
"parser": "babel-eslint",
11+
"parserOptions": {
12+
"sourceType": "module",
13+
"allowImportExportEverywhere": true
14+
}
15+
}

Diff for: .prettierrc

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"singleQuote": true
3+
}

Diff for: README.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22
[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/@fooloomanzoo/color-picker)
33
[![Published on Vaadin Directory](https://img.shields.io/badge/Vaadin%20Directory-published-00b4f0.svg)](https://vaadin.com/directory/component/fooloomanzoocolor-picker)
44

5-
_[Demo and API docs](https://fooloomanzoo.github.io/color-picker/components/color-picker/)_
5+
_[API & Demo](https://fooloomanzoo.github.io/color-picker)_
6+
67
## <color-picker>
78

89
### What is it for?

Diff for: demo/color-element.html

+17-20
Original file line numberDiff line numberDiff line change
@@ -4,28 +4,18 @@
44
<head>
55
<title>color-picker demo</title>
66
<meta charset="utf-8">
7-
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
87
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
9-
<script src="https://unpkg.com/@webcomponents/webcomponentsjs@^2.1.3/webcomponents-loader.js"></script>
10-
<script type="module">
11-
import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
12-
import '@polymer/iron-demo-helpers/demo-snippet.js';
13-
import '@fooloomanzoo/color-input/color-input.js';
14-
import '../color-element.js';
158

16-
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
17-
const template = html`
18-
<custom-style>
19-
<style is="custom-style" include="demo-pages-shared-styles">
20-
.result {
21-
margin: 0.75em;
22-
padding: 0.5em;
23-
line-height: 1.5;
24-
}
25-
</style>
26-
</custom-style>`;
27-
document.body.appendChild(template.content);
28-
</script>
9+
<script>if (!window.customElements) { document.write('<!--'); }</script>
10+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/custom-elements-es5-adapter.js"></script>
11+
<!--! DO NOT REMOVE THIS COMMENT, WE NEED ITS CLOSING MARKER -->
12+
13+
<style>
14+
body {
15+
font-family: 'Roboto', 'Noto', sans-serif;
16+
font-size: 14px;
17+
}
18+
</style>
2919
</head>
3020

3121
<body>
@@ -62,5 +52,12 @@ <h3>Create a standalone color-element</h3>
6252
</template>
6353
</demo-snippet>
6454
</div>
55+
56+
<!-- Load the external helpers to run the code transpiled to ES5 -->
57+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/babel-helpers.min.js"></script>
58+
<!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
59+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/webcomponents-loader.js"></script>
60+
<!-- Load bundled dependencies for the demos -->
61+
<script src="./dist/demo-element-import.js"></script>
6562
</body>
6663
</html>

Diff for: demo/color-picker.html

+17-20
Original file line numberDiff line numberDiff line change
@@ -4,28 +4,18 @@
44
<head>
55
<title>color-picker demo</title>
66
<meta charset="utf-8">
7-
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
87
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
9-
<script src="https://unpkg.com/@webcomponents/webcomponentsjs@^2.1.3/webcomponents-loader.js"></script>
10-
<script type="module">
11-
import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
12-
import '@polymer/iron-demo-helpers/demo-snippet.js';
13-
import '../color-picker.js';
14-
import '../overlay-color-picker.js';
158

16-
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
17-
const template = html`
18-
<custom-style>
19-
<style is="custom-style" include="demo-pages-shared-styles">
20-
.result {
21-
margin: 0.75em;
22-
padding: 0.5em;
23-
line-height: 1.5;
24-
}
25-
</style>
26-
</custom-style>`;
27-
document.body.appendChild(template.content);
28-
</script>
9+
<script>if (!window.customElements) { document.write('<!--'); }</script>
10+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/custom-elements-es5-adapter.js"></script>
11+
<!--! DO NOT REMOVE THIS COMMENT, WE NEED ITS CLOSING MARKER -->
12+
13+
<style>
14+
body {
15+
font-family: 'Roboto', 'Noto', sans-serif;
16+
font-size: 14px;
17+
}
18+
</style>
2919
</head>
3020

3121
<body>
@@ -91,5 +81,12 @@ <h3>An color-picker in an overlay in custom-style</h3>
9181
</template>
9282
</demo-snippet>
9383
</div>
84+
85+
<!-- Load the external helpers to run the code transpiled to ES5 -->
86+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/babel-helpers.min.js"></script>
87+
<!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
88+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/webcomponents-loader.js"></script>
89+
<!-- Load bundled dependencies for the demos -->
90+
<script src="./dist/demo-picker-import.js"></script>
9491
</body>
9592
</html>

Diff for: demo/dist/demo-element-import.js

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

Diff for: demo/dist/demo-form-import.js

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

Diff for: demo/dist/demo-picker-import.js

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

Diff for: demo/form.html

+17-30
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,23 @@
11
<!doctype html>
22
<html lang="en">
33
<head>
4-
<meta charset="utf-8">
5-
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
6-
74
<title>color-picker in iron-Form</title>
8-
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
5+
<meta charset="utf-8">
96
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
107

11-
<script src="https://unpkg.com/@webcomponents/webcomponentsjs@^2.1.3/webcomponents-loader.js"></script>
12-
<script type="module">
13-
import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
14-
import '@polymer/iron-demo-helpers/demo-snippet.js';
15-
import '@fooloomanzoo/color-input/color-input.js';
16-
import '../color-element.js';
17-
import '../color-picker.js';
18-
import '../overlay-color-picker.js';
8+
<script>if (!window.customElements) { document.write('<!--'); }</script>
9+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/custom-elements-es5-adapter.js"></script>
10+
<!--! DO NOT REMOVE THIS COMMENT, WE NEED ITS CLOSING MARKER -->
1911

20-
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
21-
const template = html`
22-
<custom-style>
23-
<style is="custom-style" include="demo-pages-shared-styles">
24-
.result {
25-
margin: 0.75em;
26-
padding: 0.5em;
27-
line-height: 1.5;
28-
}
29-
</style>
30-
</custom-style>`;
31-
document.body.appendChild(template.content);
32-
</script>
12+
<style>
13+
body {
14+
font-family: 'Roboto', 'Noto', sans-serif;
15+
font-size: 14px;
16+
}
17+
</style>
3318
</head>
3419

3520
<body>
36-
<custom-style>
37-
<style is="custom-style" include="demo-pages-shared-styles">
38-
</style>
39-
</custom-style>
40-
4121
<div class="vertical-section-container centered">
4222
<h3>color-picker in <code>iron-form</code></h3>
4323
<demo-snippet>
@@ -73,5 +53,12 @@ <h3>color-picker in <code>iron-form</code></h3>
7353
</template>
7454
</demo-snippet>
7555
</div>
56+
57+
<!-- Load the external helpers to run the code transpiled to ES5 -->
58+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/babel-helpers.min.js"></script>
59+
<!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
60+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/webcomponents-loader.js"></script>
61+
<!-- Load bundled dependencies for the demos -->
62+
<script src="./dist/demo-form-import.js"></script>
7663
</body>
7764
</html>

Diff for: demo/import/demo-element-import.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
'use strict';
2+
3+
/* Import WebpackApp */
4+
5+
import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
6+
import '@polymer/iron-demo-helpers/demo-snippet.js';
7+
import '@fooloomanzoo/color-input/color-input.js';
8+
import '../../color-element.js';
9+
10+
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
11+
const template = html`
12+
<custom-style>
13+
<style is="custom-style" include="demo-pages-shared-styles">
14+
.result {
15+
margin: 0.75em;
16+
padding: 0.5em;
17+
line-height: 1.5;
18+
}
19+
</style>
20+
</custom-style>`;
21+
document.body.appendChild(template.content);

Diff for: demo/import/demo-form-import.js

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
'use strict';
2+
3+
/* Import WebpackApp */
4+
import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
5+
import '@polymer/iron-demo-helpers/demo-snippet.js';
6+
import '@fooloomanzoo/color-input/color-input.js';
7+
import '../../color-element.js';
8+
import '../../color-picker.js';
9+
import '../../overlay-color-picker.js';
10+
11+
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
12+
const template = html`
13+
<custom-style>
14+
<style is="custom-style" include="demo-pages-shared-styles">
15+
.result {
16+
margin: 0.75em;
17+
padding: 0.5em;
18+
line-height: 1.5;
19+
}
20+
</style>
21+
</custom-style>`;
22+
document.body.appendChild(template.content);

Diff for: demo/import/demo-picker-import.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
'use strict';
2+
3+
/* Import WebpackApp */
4+
import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
5+
import '@polymer/iron-demo-helpers/demo-snippet.js';
6+
import '../../color-picker.js';
7+
import '../../overlay-color-picker.js';
8+
9+
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
10+
const template = html`
11+
<custom-style>
12+
<style is="custom-style" include="demo-pages-shared-styles">
13+
.result {
14+
margin: 0.75em;
15+
padding: 0.5em;
16+
line-height: 1.5;
17+
}
18+
</style>
19+
</custom-style>`;
20+
document.body.appendChild(template.content);

Diff for: index.html

+11-3
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,10 @@
55
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
66

77
<title>color-picker</title>
8-
<script src="../../@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
9-
<script type="module" src="../input-picker-pattern/utils/component-page.js"></script>
8+
9+
<script>if (!window.customElements) { document.write('<!--'); }</script>
10+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/custom-elements-es5-adapter.js"></script>
11+
<!--! DO NOT REMOVE THIS COMMENT, WE NEED ITS CLOSING MARKER -->
1012

1113
<style>
1214
body {
@@ -19,6 +21,12 @@
1921
</style>
2022
</head>
2123
<body>
22-
<component-page page-title="@fooloomanzoo/color-picker" github-url="https://github.com/fooloomanzoo/color-picker" webcomponents-url="https://www.webcomponents.org/element/fooloomanzoo/color-picker"></component-page>
24+
<component-page page-title="@fooloomanzoo/color-picker" github-url="https://github.com/fooloomanzoo/color-picker" webcomponents-url="https://www.webcomponents.org/element/@fooloomanzoo/color-picker"></component-page>
25+
<!-- Load the external helpers to run the code transpiled to ES5 -->
26+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/babel-helpers.min.js"></script>
27+
<!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
28+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/webcomponents-loader.js"></script>
29+
<!-- Load component-page bundled dependencies -->
30+
<script src="https://fooloomanzoo.github.io/input-picker-pattern/demo/dist/component-page-import.js"></script>
2331
</body>
2432
</html>

0 commit comments

Comments
 (0)