p-elements-core 2.0.14 → 2.1.0-rc10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/p-elements-core.js +1 -72
- package/package.json +56 -56
- package/readme.md +386 -0
- package/typings/custom-element-controller.d.ts +18 -0
- package/typings/custom-element-controller.d.ts.map +1 -0
- package/typings/custom-element.d.ts +140 -0
- package/typings/custom-element.d.ts.map +1 -0
- package/typings/decorators/bind.d.ts +6 -0
- package/typings/decorators/bind.d.ts.map +1 -0
- package/typings/decorators/custom-element-config.d.ts +8 -0
- package/typings/decorators/custom-element-config.d.ts.map +1 -0
- package/typings/decorators/property.d.ts +213 -0
- package/typings/decorators/property.d.ts.map +1 -0
- package/typings/decorators/query.d.ts +2 -0
- package/typings/decorators/query.d.ts.map +1 -0
- package/typings/decorators/render-property-on-set.d.ts +2 -0
- package/typings/decorators/render-property-on-set.d.ts.map +1 -0
- package/typings/maquette/cache.d.ts +10 -0
- package/typings/maquette/cache.d.ts.map +1 -0
- package/typings/maquette/dom.d.ts +60 -0
- package/typings/maquette/dom.d.ts.map +1 -0
- package/typings/maquette/h.d.ts +35 -0
- package/typings/maquette/h.d.ts.map +1 -0
- package/typings/maquette/index.d.ts +12 -0
- package/typings/maquette/index.d.ts.map +1 -0
- package/typings/maquette/interfaces.d.ts +475 -0
- package/typings/maquette/interfaces.d.ts.map +1 -0
- package/typings/maquette/jsx.d.ts +6 -0
- package/typings/maquette/jsx.d.ts.map +1 -0
- package/typings/maquette/mapping.d.ts +14 -0
- package/typings/maquette/mapping.d.ts.map +1 -0
- package/typings/maquette/projection.d.ts +9 -0
- package/typings/maquette/projection.d.ts.map +1 -0
- package/typings/maquette/projector.d.ts +27 -0
- package/typings/maquette/projector.d.ts.map +1 -0
- package/typings/p-elements-core.d.ts +225 -0
- package/typings/p-elements-core.d.ts.map +1 -0
- package/.editorconfig +0 -17
- package/.gitlab-ci.yml +0 -16
- package/dist/p-elements-core-modern.js +0 -72
- package/dist/sample.js +0 -20
- package/index.html +0 -171
- package/karma.conf.js +0 -32
- package/p-elements-core.d.ts +0 -140
- package/screen.css +0 -16
- package/src/bar.css +0 -3
- package/src/cache.ts +0 -35
- package/src/commonjs.js +0 -182
- package/src/custom-element.ts +0 -185
- package/src/custom-inline-style-element.ts +0 -42
- package/src/custom-style-element.ts +0 -27
- package/src/decorators/bind.ts +0 -40
- package/src/decorators/custom-element-config.ts +0 -17
- package/src/decorators/property-render-on-set.ts +0 -49
- package/src/decorators/reflect-to-attribute.ts +0 -51
- package/src/dom.ts +0 -100
- package/src/h.ts +0 -93
- package/src/index.tsx +0 -84
- package/src/interfaces.ts +0 -455
- package/src/mapping.ts +0 -55
- package/src/projection.ts +0 -537
- package/src/projector.ts +0 -168
- package/src/sample.css +0 -19
- package/src/sample.spec.ts +0 -112
- package/src/sample.tsx +0 -187
- package/src/tsconfig.json +0 -16
- package/theme.css +0 -12
- package/tsconfig.json +0 -17
- package/tslint.json +0 -33
- package/webpack.config.js +0 -100
- package/webpack.config.karma.js +0 -35
package/index.html
DELETED
|
@@ -1,171 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<title></title>
|
|
5
|
-
<meta charset="UTF-8">
|
|
6
|
-
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7
|
-
<!-- <link href="theme.css" is="custom-style" type="text/css"> -->
|
|
8
|
-
<link href="screen.css" rel="stylesheet" type="text/css">
|
|
9
|
-
|
|
10
|
-
</head>
|
|
11
|
-
<body>
|
|
12
|
-
|
|
13
|
-
<style is="custom-inline-style">
|
|
14
|
-
body{
|
|
15
|
-
font-family: verdana;
|
|
16
|
-
}
|
|
17
|
-
:root{
|
|
18
|
-
--color-primary: green;
|
|
19
|
-
--mixin-sample : {
|
|
20
|
-
border: 2px solid black;
|
|
21
|
-
background-color: pink;
|
|
22
|
-
margin: 5px;
|
|
23
|
-
padding: 5px;
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
</style>
|
|
27
|
-
|
|
28
|
-
<pfzw-site-header src="https://pggmlab.azurewebsites.net/unpkg/@pggm/pfzw-site-header@=1.0.0/demo/sitemap.json">
|
|
29
|
-
</pfzw-site-header>
|
|
30
|
-
|
|
31
|
-
<p-bar></p-bar>
|
|
32
|
-
|
|
33
|
-
<h1>Sample custom element</h1>
|
|
34
|
-
|
|
35
|
-
<my-greetings name="Jan">
|
|
36
|
-
<span>Hello Modern World 1</span>
|
|
37
|
-
</my-greetings>
|
|
38
|
-
|
|
39
|
-
<my-greetings name="Joop">
|
|
40
|
-
<span>Hello Modern World 2</span>
|
|
41
|
-
</my-greetings>
|
|
42
|
-
|
|
43
|
-
<p>
|
|
44
|
-
<input type="text" id="fooValue" /><button onclick="fireFoo()">Foo</button>
|
|
45
|
-
</p>
|
|
46
|
-
<script>
|
|
47
|
-
function fireFoo() {
|
|
48
|
-
window.dispatchEvent( new CustomEvent("foo", {
|
|
49
|
-
bubbles: true,
|
|
50
|
-
detail: {
|
|
51
|
-
foo: document.getElementById("fooValue").value
|
|
52
|
-
}
|
|
53
|
-
}));
|
|
54
|
-
}
|
|
55
|
-
</script>
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
<div style="z-index: 11; position:relative; width: 100%">
|
|
59
|
-
|
|
60
|
-
<p-age-picker id="myAgePicker" type="age" min="2016-01-01"
|
|
61
|
-
max="2040-01-02"
|
|
62
|
-
value="2017-09-01"
|
|
63
|
-
date-of-birth="1971-09-28"
|
|
64
|
-
popup-img="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgd2lkdGg9IjE3OTIiIGhlaWdodD0iMTc5MiIgdmlld0JveD0iMCAwIDE3OTIgMTc5MiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTkyIDE2NjRoMjg4di0yODhoLTI4OHYyODh6bTM1MiAwaDMyMHYtMjg4aC0zMjB2Mjg4em0tMzUyLTM1MmgyODh2LTMyMGgtMjg4djMyMHptMzUyIDBoMzIwdi0zMjBoLTMyMHYzMjB6bS0zNTItMzg0aDI4OHYtMjg4aC0yODh2Mjg4em03MzYgNzM2aDMyMHYtMjg4aC0zMjB2Mjg4em0tMzg0LTczNmgzMjB2LTI4OGgtMzIwdjI4OHptNzY4IDczNmgyODh2LTI4OGgtMjg4djI4OHptLTM4NC0zNTJoMzIwdi0zMjBoLTMyMHYzMjB6bS0zNTItODY0di0yODhxMC0xMy05LjUtMjIuNXQtMjIuNS05LjVoLTY0cS0xMyAwLTIyLjUgOS41dC05LjUgMjIuNXYyODhxMCAxMyA5LjUgMjIuNXQyMi41IDkuNWg2NHExMyAwIDIyLjUtOS41dDkuNS0yMi41em03MzYgODY0aDI4OHYtMzIwaC0yODh2MzIwem0tMzg0LTM4NGgzMjB2LTI4OGgtMzIwdjI4OHptMzg0IDBoMjg4di0yODhoLTI4OHYyODh6bTMyLTQ4MHYtMjg4cTAtMTMtOS41LTIyLjV0LTIyLjUtOS41aC02NHEtMTMgMC0yMi41IDkuNXQtOS41IDIyLjV2Mjg4cTAgMTMgOS41IDIyLjV0MjIuNSA5LjVoNjRxMTMgMCAyMi41LTkuNXQ5LjUtMjIuNXptMzg0LTY0djEyODBxMCA1Mi0zOCA5MHQtOTAgMzhoLTE0MDhxLTUyIDAtOTAtMzh0LTM4LTkwdi0xMjgwcTAtNTIgMzgtOTB0OTAtMzhoMTI4di05NnEwLTY2IDQ3LTExM3QxMTMtNDdoNjRxNjYgMCAxMTMgNDd0NDcgMTEzdjk2aDM4NHYtOTZxMC02NiA0Ny0xMTN0MTEzLTQ3aDY0cTY2IDAgMTEzIDQ3dDQ3IDExM3Y5NmgxMjhxNTIgMCA5MCAzOHQzOCA5MHoiLz48L3N2Zz4=">
|
|
65
|
-
<div slot="popup" >
|
|
66
|
-
<p-calendar id="myDatePanel"
|
|
67
|
-
style="position: absolute; z-index: 9999999"
|
|
68
|
-
next="volgende" previous="vorige" lang="nl"
|
|
69
|
-
pick-type="month"
|
|
70
|
-
min="2016-01-01"
|
|
71
|
-
max="2040-01-01"></p-calendar>
|
|
72
|
-
</div>
|
|
73
|
-
</p-age-picker>
|
|
74
|
-
|
|
75
|
-
</div>
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
<div style="margin-left: 120px;">
|
|
79
|
-
<pfzw-select-wrapper>
|
|
80
|
-
<select>
|
|
81
|
-
<option>Hello World</option>
|
|
82
|
-
<option>Hello Universe</option>
|
|
83
|
-
<option>Hello Dordrecht</option>
|
|
84
|
-
</select>
|
|
85
|
-
</pfzw-select-wrapper>
|
|
86
|
-
</div>
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
</div>
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
<!-- load p-elements-core -->
|
|
96
|
-
<script>
|
|
97
|
-
/**
|
|
98
|
-
* Safari 10.1 supports modules, but does not support the `nomodule` attribute
|
|
99
|
-
* This workaround is possible because Safari supports the non-standard 'beforeload' event.
|
|
100
|
-
* This allows us to trap the module and nomodule load.
|
|
101
|
-
*
|
|
102
|
-
* Note also that `nomodule` is supported in later versions of Safari - it's just 10.1 that
|
|
103
|
-
* omits this attribute.
|
|
104
|
-
*/
|
|
105
|
-
(function() {
|
|
106
|
-
var d = document;
|
|
107
|
-
var c = d.createElement('script');
|
|
108
|
-
if (!('noModule' in c) && 'onbeforeload' in c) {
|
|
109
|
-
var s = false;
|
|
110
|
-
d.addEventListener('beforeload', function(e) {
|
|
111
|
-
if (e.target === c) {
|
|
112
|
-
s = true;
|
|
113
|
-
} else if (!e.target.hasAttribute('nomodule') || !s) {
|
|
114
|
-
return;
|
|
115
|
-
}
|
|
116
|
-
e.preventDefault();
|
|
117
|
-
}, true);
|
|
118
|
-
|
|
119
|
-
c.type = 'module';
|
|
120
|
-
c.src = '.';
|
|
121
|
-
d.head.appendChild(c);
|
|
122
|
-
c.remove();
|
|
123
|
-
}
|
|
124
|
-
}());
|
|
125
|
-
</script>
|
|
126
|
-
<!-- <script defer src="dist/p-elements-core.js"></script> -->
|
|
127
|
-
|
|
128
|
-
<!-- there is no animejs and underscore in p-elements-core v2 -->
|
|
129
|
-
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
|
|
130
|
-
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/animejs/2.2.0/anime.min.js"></script>
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
<script type="module" defer src="dist/p-elements-core-modern.js"></script>
|
|
134
|
-
<script nomodule defer src="dist/p-elements-core.js" data-main-path="/dist/"></script>
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
<!-- load component(s) -->
|
|
138
|
-
<script defer src="dist/sample.js"></script>
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
<script defer src="https://pggmlab.azurewebsites.net/unpkg/@pggm/p-age-picker@=1.0.28/dist/p-age-picker.js"></script>
|
|
142
|
-
|
|
143
|
-
<script defer src="https://pggmlab.azurewebsites.net/unpkg/@pggm/p-calendar@latest/dist/p-calendar.js"></script>
|
|
144
|
-
|
|
145
|
-
<script defer src="https://pggmlab.azurewebsites.net/unpkg/@pggm/pfzw-select-wrapper@%5E1.0.0/dist/pfzw-select-wrapper.js"></script>
|
|
146
|
-
|
|
147
|
-
<script defer src="https://pggmlab.azurewebsites.net/unpkg/@pggm/pfzw-site-header@=1.0.0/dist/pfzw-site-header.js"></script>
|
|
148
|
-
|
|
149
|
-
<script>
|
|
150
|
-
|
|
151
|
-
document.querySelector('p-age-picker').addEventListener('change', function(event) {
|
|
152
|
-
document.querySelector("#myDatePanel").value = event.detail;
|
|
153
|
-
console.info(event.target.value);
|
|
154
|
-
});
|
|
155
|
-
|
|
156
|
-
document.querySelector('p-age-picker').addEventListener('popupShow', function(event) {
|
|
157
|
-
document.querySelector("#myDatePanel").year = document.querySelector('p-age-picker').value.getFullYear();
|
|
158
|
-
document.querySelector("#myDatePanel").month = document.querySelector('p-age-picker').value.getMonth();
|
|
159
|
-
});
|
|
160
|
-
|
|
161
|
-
document.querySelector("#myDatePanel").addEventListener("datePicked", function(event) {
|
|
162
|
-
document.querySelector("#myAgePicker").hidePopup();
|
|
163
|
-
document.querySelector("#myAgePicker").value = event.detail;
|
|
164
|
-
console.info(event.detail);
|
|
165
|
-
});
|
|
166
|
-
|
|
167
|
-
</script>
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
</body>
|
|
171
|
-
</html>
|
package/karma.conf.js
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
module.exports = function (config) {
|
|
2
|
-
|
|
3
|
-
const webpackConfig = require('./webpack.config.karma.js');
|
|
4
|
-
config.set({
|
|
5
|
-
basePath: '',
|
|
6
|
-
frameworks: ['jasmine'],
|
|
7
|
-
files: [{
|
|
8
|
-
pattern: './dist/p-elements-core.js',
|
|
9
|
-
included: true,
|
|
10
|
-
watched: false,
|
|
11
|
-
served: true
|
|
12
|
-
},
|
|
13
|
-
'./dist/**/*.*',
|
|
14
|
-
'./**/*.spec.ts'
|
|
15
|
-
],
|
|
16
|
-
preprocessors: {
|
|
17
|
-
'src/**/*.spec.ts': ['webpack']
|
|
18
|
-
},
|
|
19
|
-
mime: {
|
|
20
|
-
'text/x-typescript': ['ts', 'tsx']
|
|
21
|
-
},
|
|
22
|
-
webpack: webpackConfig,
|
|
23
|
-
reporters: ['dots'],
|
|
24
|
-
port: 9876,
|
|
25
|
-
runnerPort: 9100,
|
|
26
|
-
colors: true,
|
|
27
|
-
logLevel: config.LOG_INFO,
|
|
28
|
-
autoWatch: true,
|
|
29
|
-
browsers: ['Chrome'],
|
|
30
|
-
singleRun: true
|
|
31
|
-
});
|
|
32
|
-
};
|
package/p-elements-core.d.ts
DELETED
|
@@ -1,140 +0,0 @@
|
|
|
1
|
-
declare interface IElementConfig {
|
|
2
|
-
tagName: string;
|
|
3
|
-
options?: {
|
|
4
|
-
extends: string;
|
|
5
|
-
};
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
declare interface TransitionStrategy {
|
|
9
|
-
enter(element: Element, properties: VNodeProperties, enterAnimation: string): void;
|
|
10
|
-
exit(element: Element, properties: VNodeProperties, exitAnimation: string, removeElement: () => void): void;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
declare interface ProjectorOptions {
|
|
14
|
-
readonly transitions?: TransitionStrategy;
|
|
15
|
-
styleApplyer?(domNode: HTMLElement, styleName: string, value: string): void;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
declare interface ProjectionOptions extends ProjectorOptions {
|
|
19
|
-
readonly namespace?: string;
|
|
20
|
-
eventHandlerInterceptor?: (propertyName: string, eventHandler: Function, domNode: Node, properties: VNodeProperties) => Function;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
declare interface VNodeProperties {
|
|
24
|
-
enterAnimation?: ((element: Element, properties?: VNodeProperties) => void) | string;
|
|
25
|
-
exitAnimation?: ((element: Element, removeElement: () => void, properties?: VNodeProperties) => void) | string;
|
|
26
|
-
updateAnimation?: (element: Element, properties?: VNodeProperties, previousProperties?: VNodeProperties) => void;
|
|
27
|
-
afterCreate?(element: Element, projectionOptions: ProjectionOptions, vnodeSelector: string, properties: VNodeProperties,
|
|
28
|
-
children: VNode[]): void;
|
|
29
|
-
afterUpdate?(element: Element, projectionOptions: ProjectionOptions, vnodeSelector: string, properties: VNodeProperties,
|
|
30
|
-
children: VNode[]): void;
|
|
31
|
-
afterRemoved?(element: Element): void;
|
|
32
|
-
readonly bind?: Object;
|
|
33
|
-
readonly key?: Object;
|
|
34
|
-
readonly classes?: { [index: string]: boolean | null | undefined };
|
|
35
|
-
readonly styles?: { [index: string]: string | null | undefined };
|
|
36
|
-
|
|
37
|
-
ontouchcancel?(ev?: TouchEvent): boolean | void;
|
|
38
|
-
ontouchend?(ev?: TouchEvent): boolean | void;
|
|
39
|
-
ontouchmove?(ev?: TouchEvent): boolean | void;
|
|
40
|
-
ontouchstart?(ev?: TouchEvent): boolean | void;
|
|
41
|
-
|
|
42
|
-
readonly action?: string;
|
|
43
|
-
readonly encoding?: string;
|
|
44
|
-
readonly enctype?: string;
|
|
45
|
-
readonly method?: string;
|
|
46
|
-
readonly name?: string;
|
|
47
|
-
readonly target?: string;
|
|
48
|
-
|
|
49
|
-
readonly href?: string;
|
|
50
|
-
readonly rel?: string;
|
|
51
|
-
|
|
52
|
-
onblur?(ev?: FocusEvent): boolean | void;
|
|
53
|
-
onchange?(ev?: Event): boolean | void;
|
|
54
|
-
onclick?(ev?: MouseEvent): boolean | void;
|
|
55
|
-
ondblclick?(ev?: MouseEvent): boolean | void;
|
|
56
|
-
onfocus?(ev?: FocusEvent): boolean | void;
|
|
57
|
-
oninput?(ev?: Event): boolean | void;
|
|
58
|
-
onkeydown?(ev?: KeyboardEvent): boolean | void;
|
|
59
|
-
onkeypress?(ev?: KeyboardEvent): boolean | void;
|
|
60
|
-
onkeyup?(ev?: KeyboardEvent): boolean | void;
|
|
61
|
-
onload?(ev?: Event): boolean | void;
|
|
62
|
-
onmousedown?(ev?: MouseEvent): boolean | void;
|
|
63
|
-
onmouseenter?(ev?: MouseEvent): boolean | void;
|
|
64
|
-
onmouseleave?(ev?: MouseEvent): boolean | void;
|
|
65
|
-
onmousemove?(ev?: MouseEvent): boolean | void;
|
|
66
|
-
onmouseout?(ev?: MouseEvent): boolean | void;
|
|
67
|
-
onmouseover?(ev?: MouseEvent): boolean | void;
|
|
68
|
-
onmouseup?(ev?: MouseEvent): boolean | void;
|
|
69
|
-
onmousewheel?(ev?: WheelEvent | MouseWheelEvent): boolean | void;
|
|
70
|
-
onscroll?(ev?: UIEvent): boolean | void;
|
|
71
|
-
onsubmit?(ev?: Event): boolean | void;
|
|
72
|
-
readonly spellcheck?: boolean;
|
|
73
|
-
readonly tabIndex?: number;
|
|
74
|
-
readonly disabled?: boolean;
|
|
75
|
-
readonly title?: string;
|
|
76
|
-
readonly accessKey?: string;
|
|
77
|
-
readonly id?: string;
|
|
78
|
-
|
|
79
|
-
readonly type?: string;
|
|
80
|
-
readonly autocomplete?: string;
|
|
81
|
-
readonly checked?: boolean;
|
|
82
|
-
readonly placeholder?: string;
|
|
83
|
-
readonly readOnly?: boolean;
|
|
84
|
-
readonly src?: string;
|
|
85
|
-
readonly value?: string;
|
|
86
|
-
|
|
87
|
-
readonly alt?: string;
|
|
88
|
-
readonly srcset?: string;
|
|
89
|
-
readonly innerHTML?: string;
|
|
90
|
-
|
|
91
|
-
readonly [index: string]: any;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
declare interface VNode {
|
|
95
|
-
readonly vnodeSelector: string;
|
|
96
|
-
readonly properties: VNodeProperties | undefined;
|
|
97
|
-
readonly children: Array<VNode> | undefined;
|
|
98
|
-
readonly text: string | undefined;
|
|
99
|
-
domNode: Node | null;
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
declare interface ProjectionOptions extends ProjectorOptions {
|
|
103
|
-
readonly namespace?: string;
|
|
104
|
-
eventHandlerInterceptor?: (propertyName: string, eventHandler: Function, domNode: Node, properties: VNodeProperties) => Function;
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
declare interface Projection {
|
|
108
|
-
readonly domNode: Element;
|
|
109
|
-
update(updatedVnode: VNode): void;
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
declare interface Projector {
|
|
113
|
-
append(parentNode: Element, renderMaquetteFunction: () => VNode): void;
|
|
114
|
-
insertBefore(beforeNode: Element, renderMaquetteFunction: () => VNode): void;
|
|
115
|
-
merge(domNode: Element, renderMaquetteFunction: () => VNode): void;
|
|
116
|
-
replace(domNode: Element, renderMaquetteFunction: () => VNode): void;
|
|
117
|
-
resume(): void;
|
|
118
|
-
scheduleRender(): void;
|
|
119
|
-
renderNow(): void;
|
|
120
|
-
detach(renderMaquetteFunction: () => VNode): Projection;
|
|
121
|
-
stop(): void;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
declare const CustomElementConfig: (config: IElementConfig) => (Element: any) => void;
|
|
125
|
-
|
|
126
|
-
declare abstract class CustomElement extends HTMLElement {
|
|
127
|
-
protected initShadowRoot(stylesheet: string, render: any);
|
|
128
|
-
protected templateFromString(html: string, shady?: boolean): any;
|
|
129
|
-
protected updateStyle(): void;
|
|
130
|
-
protected createProjector(element :Element, render: () => VNode) :Promise<Projector>
|
|
131
|
-
protected renderNow(): void;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
declare const Bind: (target: object, propertyKey: string, descriptor: any) => void;
|
|
135
|
-
|
|
136
|
-
declare function PropertyRenderOnSet(target: object, propertyKey: string): void;
|
|
137
|
-
|
|
138
|
-
declare function RenderOnSet(target: object, propertyKey: string): void;
|
|
139
|
-
|
|
140
|
-
declare function ReflectToAttribute(target: object, propertyKey: string): void;
|
package/screen.css
DELETED
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
prevent FOUC
|
|
3
|
-
*/
|
|
4
|
-
:not(.custom-style-defined) body{
|
|
5
|
-
opacity: 0;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
.custom-style-defined body{
|
|
9
|
-
opacity: 1;
|
|
10
|
-
transition: opacity 0.25s;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
html, body {
|
|
14
|
-
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
|
15
|
-
color: #666;
|
|
16
|
-
}
|
package/src/bar.css
DELETED
package/src/cache.ts
DELETED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { CalculationCache } from './interfaces';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Creates a [[CalculationCache]] object, useful for caching [[VNode]] trees.
|
|
5
|
-
* In practice, caching of [[VNode]] trees is not needed, because achieving 60 frames per second is almost never a problem.
|
|
6
|
-
* For more information, see [[CalculationCache]].
|
|
7
|
-
*
|
|
8
|
-
* @param <Result> The type of the value that is cached.
|
|
9
|
-
*/
|
|
10
|
-
export let createCache = <Result>(): CalculationCache<Result> => {
|
|
11
|
-
let cachedInputs: Object[] | undefined;
|
|
12
|
-
let cachedOutcome: Result | undefined;
|
|
13
|
-
|
|
14
|
-
return {
|
|
15
|
-
invalidate: () => {
|
|
16
|
-
cachedOutcome = undefined;
|
|
17
|
-
cachedInputs = undefined;
|
|
18
|
-
},
|
|
19
|
-
|
|
20
|
-
result: (inputs: Object[], calculation: () => Result) => {
|
|
21
|
-
if (cachedInputs) {
|
|
22
|
-
for (let i = 0; i < inputs.length; i++) {
|
|
23
|
-
if (cachedInputs[i] !== inputs[i]) {
|
|
24
|
-
cachedOutcome = undefined;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
if (!cachedOutcome) {
|
|
29
|
-
cachedOutcome = calculation();
|
|
30
|
-
cachedInputs = inputs;
|
|
31
|
-
}
|
|
32
|
-
return cachedOutcome;
|
|
33
|
-
}
|
|
34
|
-
};
|
|
35
|
-
};
|
package/src/commonjs.js
DELETED
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Sample
|
|
3
|
-
* <script src="./common-js.js" id="common-js" data-main-path="/demo/" defer></script>
|
|
4
|
-
* Promise.all([
|
|
5
|
-
* module.import("jquery"), // main file from the latest module version from unpkg cdn
|
|
6
|
-
* module.import("./sample-module"), // file from data-module location
|
|
7
|
-
* module.import("@pggm/p-age-picker@=1.0.11/dist/p-age-picker.js"), // a file from a specific module version from pggmlab
|
|
8
|
-
* module.import("@pggm/p-ajax-form/dist/p-ajax-form") // a file from the latest module version from pggmlab
|
|
9
|
-
* ]);
|
|
10
|
-
*
|
|
11
|
-
* */
|
|
12
|
-
(function CommonJS(info, el) {
|
|
13
|
-
var mainPath = document.querySelector("script[data-main-path]");
|
|
14
|
-
if (!mainPath) {
|
|
15
|
-
return;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
var protoPath = /^(?:[a-z]+:)?\/\//;
|
|
19
|
-
var npmPath = /^[@a-zA-Z_-]/;
|
|
20
|
-
var __filename = info._ || el && el.getAttribute('data-main-path');
|
|
21
|
-
|
|
22
|
-
var normalize = function (url) {
|
|
23
|
-
if (protoPath.test(url)) {
|
|
24
|
-
return url;
|
|
25
|
-
}
|
|
26
|
-
if (npmPath.test(url)) {
|
|
27
|
-
var ret = gModule._path(url);
|
|
28
|
-
return ret;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
var path = __filename.slice(0, __filename.lastIndexOf('/'));
|
|
32
|
-
var length = url.length;
|
|
33
|
-
var c;
|
|
34
|
-
var i = 0;
|
|
35
|
-
|
|
36
|
-
for (var p = 0; i < length; p = i + 1) {
|
|
37
|
-
i = url.indexOf('/', p);
|
|
38
|
-
if (i < 0) {
|
|
39
|
-
i = length;
|
|
40
|
-
path += '/' + url.slice(p);
|
|
41
|
-
if (!/\.js$/i.test(path)) {
|
|
42
|
-
path += '.js';
|
|
43
|
-
}
|
|
44
|
-
} else if (i === 0) {
|
|
45
|
-
path = '';
|
|
46
|
-
} else {
|
|
47
|
-
c = p;
|
|
48
|
-
p = i;
|
|
49
|
-
while (p && url.charAt(p - 1) === '.') --p;
|
|
50
|
-
switch (i - p) {
|
|
51
|
-
case 0:
|
|
52
|
-
path += '/' + url.slice(c, i);
|
|
53
|
-
break;
|
|
54
|
-
case 1:
|
|
55
|
-
break;
|
|
56
|
-
case 2:
|
|
57
|
-
path = path.slice(0, path.lastIndexOf('/'));
|
|
58
|
-
break;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
return path;
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
var onload = function (xhr, path, resolve) {
|
|
66
|
-
var html = document.documentElement;
|
|
67
|
-
var script = document.createElement('script');
|
|
68
|
-
script.setAttribute('nonce', gModule._nonce);
|
|
69
|
-
script.textContent = 'module.$(function(){' +
|
|
70
|
-
'var module=' + gModule._cjs + '(arguments[0]),' +
|
|
71
|
-
'__filename=module.filename,' +
|
|
72
|
-
'__dirname=__filename.slice(0,__filename.lastIndexOf("/")),' +
|
|
73
|
-
'require=module.require,' +
|
|
74
|
-
'exports=module.exports;(function(){"use strict";\n' +
|
|
75
|
-
xhr.responseText +
|
|
76
|
-
';\n}.call(exports));return module.exports;' +
|
|
77
|
-
'}(module));';
|
|
78
|
-
gModule._ = path;
|
|
79
|
-
gModule.$ = function (exports) {
|
|
80
|
-
resolve(gModule._cache[path] = exports);
|
|
81
|
-
};
|
|
82
|
-
setTimeout(function () {
|
|
83
|
-
html.removeChild(script);
|
|
84
|
-
}, 1);
|
|
85
|
-
html.appendChild(script);
|
|
86
|
-
};
|
|
87
|
-
|
|
88
|
-
var error = function (path, xhr) {
|
|
89
|
-
throw (gModule._cache[path] = new Error(xhr.statusText));
|
|
90
|
-
};
|
|
91
|
-
|
|
92
|
-
var load = function (path) {
|
|
93
|
-
var remote = path;
|
|
94
|
-
var m = /^((?:[a-z]+?:\/\/)?[^/]+)\/([^@]+)@latest(\/.*)?$/.exec(path);
|
|
95
|
-
|
|
96
|
-
var resolve = function (exports) {
|
|
97
|
-
module = exports;
|
|
98
|
-
};
|
|
99
|
-
var xhr;
|
|
100
|
-
var module;
|
|
101
|
-
if (m || path.indexOf('@') === 0) {
|
|
102
|
-
xhr = new XMLHttpRequest();
|
|
103
|
-
//todo: implement this in pggmlab
|
|
104
|
-
var npmurl = 'https://pggmlab.azurewebsites.net/latest/' + m[2];
|
|
105
|
-
xhr.open('GET', npmurl, false);
|
|
106
|
-
xhr.send(null);
|
|
107
|
-
if (xhr.status < 400) {
|
|
108
|
-
module = JSON.parse(xhr.responseText);
|
|
109
|
-
} else {
|
|
110
|
-
return error(path, xhr);
|
|
111
|
-
}
|
|
112
|
-
remote = m[1] + '/' + m[2] + '@' + module.version + (m[3] || '');
|
|
113
|
-
}
|
|
114
|
-
xhr = new XMLHttpRequest();
|
|
115
|
-
xhr.open('GET', remote, false);
|
|
116
|
-
xhr.send(module = null);
|
|
117
|
-
if (xhr.status < 400) {
|
|
118
|
-
onload(xhr, path, resolve);
|
|
119
|
-
} else {
|
|
120
|
-
error(path, xhr);
|
|
121
|
-
}
|
|
122
|
-
return module;
|
|
123
|
-
};
|
|
124
|
-
|
|
125
|
-
var exports = {};
|
|
126
|
-
var module = {
|
|
127
|
-
filename: __filename,
|
|
128
|
-
exports: exports,
|
|
129
|
-
require: function (url) {
|
|
130
|
-
var path = normalize(url);
|
|
131
|
-
return gModule._cache[path] || load(path);
|
|
132
|
-
},
|
|
133
|
-
import: function (url) {
|
|
134
|
-
var path = normalize(url);
|
|
135
|
-
return Promise.resolve(
|
|
136
|
-
gModule._cache[path] ||
|
|
137
|
-
(gModule._cache[path] = new Promise(
|
|
138
|
-
function (resolve, reject) {
|
|
139
|
-
var xhr = new XMLHttpRequest();
|
|
140
|
-
xhr.open('GET', path, true);
|
|
141
|
-
xhr.onreadystatechange = function () {
|
|
142
|
-
if (xhr.readyState == 4) {
|
|
143
|
-
if (xhr.status < 400) onload(xhr, path, resolve);
|
|
144
|
-
else reject(new Error(xhr.statusText));
|
|
145
|
-
}
|
|
146
|
-
};
|
|
147
|
-
xhr.send(null);
|
|
148
|
-
}
|
|
149
|
-
))
|
|
150
|
-
);
|
|
151
|
-
}
|
|
152
|
-
};
|
|
153
|
-
|
|
154
|
-
var gModule = window.module || module;
|
|
155
|
-
if (gModule === module) {
|
|
156
|
-
window.global = window;
|
|
157
|
-
window.module = module;
|
|
158
|
-
window.process = {
|
|
159
|
-
browser: true
|
|
160
|
-
};
|
|
161
|
-
module._cache = Object.create(null);
|
|
162
|
-
module._nonce = el ? el.getAttribute('nonce') : null;
|
|
163
|
-
module._cjs = '' + CommonJS;
|
|
164
|
-
module._path = function (url) {
|
|
165
|
-
var i = url.indexOf('/');
|
|
166
|
-
if(url[0] === "@") {
|
|
167
|
-
i = url.split('/', 2).join('/').length;
|
|
168
|
-
}
|
|
169
|
-
var npmCdn = 'https://unpkg.com/';
|
|
170
|
-
if(url.indexOf('@pggm/') === 0) {
|
|
171
|
-
npmCdn = 'https://pggmlab.azurewebsites.net/unpkg/';
|
|
172
|
-
}
|
|
173
|
-
var length = url.length;
|
|
174
|
-
var u = url.slice(0, i < 0 ? length : i).substring(1).split('@');
|
|
175
|
-
var version = u.length > 1 ? '' : "@latest";
|
|
176
|
-
return npmCdn + url.slice(0, i < 0 ? length : i) + version + (i < 0 ? '' : url.slice(i));
|
|
177
|
-
};
|
|
178
|
-
}
|
|
179
|
-
return module;
|
|
180
|
-
}({
|
|
181
|
-
_: ''
|
|
182
|
-
}, document.querySelector("script[data-main-path]")));
|