@tko/binding.template 4.0.0-beta1.3 → 4.0.0
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/foreach.js +5 -11
- package/dist/foreach.js.map +2 -2
- package/dist/index.cjs +1052 -806
- package/dist/index.cjs.map +4 -4
- package/dist/index.js +5 -11
- package/dist/index.js.map +2 -2
- package/dist/index.mjs +5 -11
- package/dist/index.mjs.map +2 -2
- package/dist/nativeTemplateEngine.js +8 -15
- package/dist/nativeTemplateEngine.js.map +2 -2
- package/dist/templateEngine.js +16 -20
- package/dist/templateEngine.js.map +3 -3
- package/dist/templateSources.js +69 -68
- package/dist/templateSources.js.map +2 -2
- package/dist/templating.js +128 -86
- package/dist/templating.js.map +2 -2
- package/helpers/dummyTemplateEngine.ts +94 -100
- package/package.json +7 -8
- package/LICENSE +0 -22
package/dist/index.js
CHANGED
|
@@ -1,14 +1,8 @@
|
|
|
1
|
-
// @tko/binding.template 🥊 4.0.0
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
} from "./
|
|
5
|
-
|
|
6
|
-
TemplateBindingHandler
|
|
7
|
-
} from "./templating";
|
|
8
|
-
export const bindings = {
|
|
9
|
-
foreach: TemplateForEachBindingHandler,
|
|
10
|
-
template: TemplateBindingHandler
|
|
11
|
-
};
|
|
1
|
+
// @tko/binding.template 🥊 4.0.0 ESM
|
|
2
|
+
"use strict";
|
|
3
|
+
import { TemplateForEachBindingHandler } from "./foreach";
|
|
4
|
+
import { TemplateBindingHandler } from "./templating";
|
|
5
|
+
export const bindings = { foreach: TemplateForEachBindingHandler, template: TemplateBindingHandler };
|
|
12
6
|
export * from "./nativeTemplateEngine";
|
|
13
7
|
export * from "./templateEngine";
|
|
14
8
|
export * from "./templating";
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { TemplateForEachBindingHandler } from './foreach'\n\nimport { TemplateBindingHandler } from './templating'\n// 'let': letBinding,\n// template: template,\n\nexport const bindings = { foreach: TemplateForEachBindingHandler, template: TemplateBindingHandler }\n\nexport * from './nativeTemplateEngine'\nexport * from './templateEngine'\nexport * from './templating'\nexport * from './templateSources'\n"],
|
|
5
|
+
"mappings": ";;AAAA,SAAS,qCAAqC;AAE9C,SAAS,8BAA8B;AAIhC,aAAM,WAAW,EAAE,SAAS,+BAA+B,UAAU,uBAAuB;AAEnG,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -1,14 +1,8 @@
|
|
|
1
|
-
// @tko/binding.template 🥊 4.0.0
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
} from "./
|
|
5
|
-
|
|
6
|
-
TemplateBindingHandler
|
|
7
|
-
} from "./templating";
|
|
8
|
-
export const bindings = {
|
|
9
|
-
foreach: TemplateForEachBindingHandler,
|
|
10
|
-
template: TemplateBindingHandler
|
|
11
|
-
};
|
|
1
|
+
// @tko/binding.template 🥊 4.0.0 MJS
|
|
2
|
+
"use strict";
|
|
3
|
+
import { TemplateForEachBindingHandler } from "./foreach";
|
|
4
|
+
import { TemplateBindingHandler } from "./templating";
|
|
5
|
+
export const bindings = { foreach: TemplateForEachBindingHandler, template: TemplateBindingHandler };
|
|
12
6
|
export * from "./nativeTemplateEngine";
|
|
13
7
|
export * from "./templateEngine";
|
|
14
8
|
export * from "./templating";
|
package/dist/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { TemplateForEachBindingHandler } from './foreach'\n\nimport { TemplateBindingHandler } from './templating'\n// 'let': letBinding,\n// template: template,\n\nexport const bindings = { foreach: TemplateForEachBindingHandler, template: TemplateBindingHandler }\n\nexport * from './nativeTemplateEngine'\nexport * from './templateEngine'\nexport * from './templating'\nexport * from './templateSources'\n"],
|
|
5
|
+
"mappings": ";;AAAA,SAAS,qCAAqC;AAE9C,SAAS,8BAA8B;AAIhC,aAAM,WAAW,EAAE,SAAS,+BAA+B,UAAU,uBAAuB;AAEnG,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,25 +1,18 @@
|
|
|
1
|
-
// @tko/binding.template 🥊 4.0.0
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
} from "@tko/utils";
|
|
7
|
-
import {
|
|
8
|
-
templateEngine
|
|
9
|
-
} from "./templateEngine";
|
|
10
|
-
import {
|
|
11
|
-
setTemplateEngine
|
|
12
|
-
} from "./templating";
|
|
1
|
+
// @tko/binding.template 🥊 4.0.0 ESM
|
|
2
|
+
"use strict";
|
|
3
|
+
import { makeArray, parseHtmlFragment } from "@tko/utils";
|
|
4
|
+
import { templateEngine } from "./templateEngine";
|
|
5
|
+
import { setTemplateEngine } from "./templating";
|
|
13
6
|
export function nativeTemplateEngine() {
|
|
14
7
|
}
|
|
15
8
|
nativeTemplateEngine.prototype = new templateEngine();
|
|
16
9
|
nativeTemplateEngine.prototype.constructor = nativeTemplateEngine;
|
|
17
|
-
nativeTemplateEngine.prototype.renderTemplateSource = function(templateSource, bindingContext,
|
|
18
|
-
|
|
10
|
+
nativeTemplateEngine.prototype.renderTemplateSource = function(templateSource, bindingContext, options, templateDocument) {
|
|
11
|
+
const templateNodes = templateSource.nodes ? templateSource.nodes() : null;
|
|
19
12
|
if (templateNodes) {
|
|
20
13
|
return makeArray(templateNodes.cloneNode(true).childNodes);
|
|
21
14
|
} else {
|
|
22
|
-
|
|
15
|
+
const templateText = templateSource.text();
|
|
23
16
|
return parseHtmlFragment(templateText, templateDocument);
|
|
24
17
|
}
|
|
25
18
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/nativeTemplateEngine.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { makeArray, parseHtmlFragment } from '@tko/utils'\nimport { templateEngine, TemplateOptions } from './templateEngine'\nimport { setTemplateEngine } from './templating'\nimport type { TemplateSource } from './templateSources'\nimport type { BindingContext } from '@tko/bind'\n\nexport function nativeTemplateEngine() {}\n\nnativeTemplateEngine.prototype = new templateEngine()\nnativeTemplateEngine.prototype.constructor = nativeTemplateEngine\nnativeTemplateEngine.prototype.renderTemplateSource = function (\n templateSource: TemplateSource,\n bindingContext: BindingContext<any>,\n options: TemplateOptions<any>,\n templateDocument?: Document\n): Node[] {\n const templateNodes = templateSource.nodes ? templateSource.nodes() : null\n\n if (templateNodes) {\n return makeArray(templateNodes.cloneNode(true).childNodes)\n } else {\n const templateText = templateSource.text()\n return parseHtmlFragment(templateText, templateDocument)\n }\n}\n\nnativeTemplateEngine.instance = new nativeTemplateEngine()\nsetTemplateEngine(nativeTemplateEngine.instance)\n"],
|
|
5
|
+
"mappings": ";;AAAA,SAAS,WAAW,yBAAyB;AAC7C,SAAS,sBAAuC;AAChD,SAAS,yBAAyB;AAI3B,gBAAS,uBAAuB;AAAC;AAExC,qBAAqB,YAAY,IAAI,eAAe;AACpD,qBAAqB,UAAU,cAAc;AAC7C,qBAAqB,UAAU,uBAAuB,SACpD,gBACA,gBACA,SACA,kBACQ;AACR,QAAM,gBAAgB,eAAe,QAAQ,eAAe,MAAM,IAAI;AAEtE,MAAI,eAAe;AACjB,WAAO,UAAU,cAAc,UAAU,IAAI,EAAE,UAAU;AAAA,EAC3D,OAAO;AACL,UAAM,eAAe,eAAe,KAAK;AACzC,WAAO,kBAAkB,cAAc,gBAAgB;AAAA,EACzD;AACF;AAEA,qBAAqB,WAAW,IAAI,qBAAqB;AACzD,kBAAkB,qBAAqB,QAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/templateEngine.js
CHANGED
|
@@ -1,38 +1,34 @@
|
|
|
1
|
-
// @tko/binding.template 🥊 4.0.0
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
} from "@tko/utils";
|
|
6
|
-
import {
|
|
7
|
-
domElement,
|
|
8
|
-
anonymousTemplate
|
|
9
|
-
} from "./templateSources";
|
|
1
|
+
// @tko/binding.template 🥊 4.0.0 ESM
|
|
2
|
+
"use strict";
|
|
3
|
+
import { extend, options } from "@tko/utils";
|
|
4
|
+
import { domElement, anonymousTemplate } from "./templateSources";
|
|
10
5
|
export function templateEngine() {
|
|
11
6
|
}
|
|
12
|
-
;
|
|
13
7
|
extend(templateEngine.prototype, {
|
|
14
|
-
renderTemplateSource
|
|
8
|
+
renderTemplateSource(templateSource, bindingContext, options2, templateDocument) {
|
|
15
9
|
options2.onError("Override renderTemplateSource");
|
|
16
10
|
},
|
|
17
|
-
createJavaScriptEvaluatorBlock
|
|
18
|
-
options.onError("Override createJavaScriptEvaluatorBlock");
|
|
11
|
+
createJavaScriptEvaluatorBlock(script) {
|
|
12
|
+
options.onError(new Error("Override createJavaScriptEvaluatorBlock"));
|
|
19
13
|
},
|
|
20
|
-
makeTemplateSource
|
|
14
|
+
makeTemplateSource(template, templateDocument) {
|
|
21
15
|
if (typeof template === "string") {
|
|
22
16
|
templateDocument = templateDocument || document;
|
|
23
|
-
|
|
17
|
+
const elem = templateDocument.getElementById(template);
|
|
24
18
|
if (!elem) {
|
|
25
|
-
options.onError("Cannot find template with ID " + template);
|
|
19
|
+
throw options.onError(new Error("Cannot find template with ID " + template), false);
|
|
26
20
|
}
|
|
27
21
|
return new domElement(elem);
|
|
28
|
-
} else if (template.nodeType
|
|
22
|
+
} else if (template.nodeType === Node.ELEMENT_NODE) {
|
|
23
|
+
return new anonymousTemplate(template);
|
|
24
|
+
} else if (template.nodeType === Node.COMMENT_NODE) {
|
|
29
25
|
return new anonymousTemplate(template);
|
|
30
26
|
} else {
|
|
31
|
-
options.onError("Unknown template type: " + template);
|
|
27
|
+
throw options.onError(new Error("Unknown template type: " + template), false);
|
|
32
28
|
}
|
|
33
29
|
},
|
|
34
|
-
renderTemplate
|
|
35
|
-
|
|
30
|
+
renderTemplate(template, bindingContext, options2, templateDocument) {
|
|
31
|
+
const templateSource = this.makeTemplateSource(template, templateDocument);
|
|
36
32
|
return this.renderTemplateSource(templateSource, bindingContext, options2, templateDocument);
|
|
37
33
|
}
|
|
38
34
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/templateEngine.ts"],
|
|
4
|
-
"sourcesContent": ["// If you want to make a custom template engine,\n//\n// [1] Inherit from this class (like ko.nativeTemplateEngine does)\n// [2] Override 'renderTemplateSource', supplying a function with this signature:\n//\n// function (templateSource, bindingContext, options) {\n// // - templateSource.text() is the text of the template you should render\n// // - bindingContext.$data is the data you should pass into the template\n// // - you might also want to make bindingContext.$parent, bindingContext.$parents,\n// // and bindingContext.$root available in the template too\n// // - options gives you access to any other properties set on \"data-bind: { template: options }\"\n// // - templateDocument is the document object of the template\n// //\n// // Return value: an array of DOM nodes\n// }\n//\n// [3] Override 'createJavaScriptEvaluatorBlock', supplying a function with this signature:\n//\n// function (script) {\n// // Return value: Whatever syntax means \"Evaluate the JavaScript statement 'script' and output the result\"\n// // For example, the jquery.tmpl template engine converts 'someScript' to '${ someScript }'\n// }\n//\n// This is only necessary if you want to allow data-bind attributes to reference arbitrary template variables.\n// If you don't want to allow that, you can set the property 'allowTemplateRewriting' to false (like ko.nativeTemplateEngine does)\n// and then you don't need to override 'createJavaScriptEvaluatorBlock'.\n\nimport {
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["// If you want to make a custom template engine,\n//\n// [1] Inherit from this class (like ko.nativeTemplateEngine does)\n// [2] Override 'renderTemplateSource', supplying a function with this signature:\n//\n// function (templateSource, bindingContext, options) {\n// // - templateSource.text() is the text of the template you should render\n// // - bindingContext.$data is the data you should pass into the template\n// // - you might also want to make bindingContext.$parent, bindingContext.$parents,\n// // and bindingContext.$root available in the template too\n// // - options gives you access to any other properties set on \"data-bind: { template: options }\"\n// // - templateDocument is the document object of the template\n// //\n// // Return value: an array of DOM nodes\n// }\n//\n// [3] Override 'createJavaScriptEvaluatorBlock', supplying a function with this signature:\n//\n// function (script) {\n// // Return value: Whatever syntax means \"Evaluate the JavaScript statement 'script' and output the result\"\n// // For example, the jquery.tmpl template engine converts 'someScript' to '${ someScript }'\n// }\n//\n// This is only necessary if you want to allow data-bind attributes to reference arbitrary template variables.\n// If you don't want to allow that, you can set the property 'allowTemplateRewriting' to false (like ko.nativeTemplateEngine does)\n// and then you don't need to override 'createJavaScriptEvaluatorBlock'.\n\nimport { extend, options } from '@tko/utils'\nimport { domElement, anonymousTemplate } from './templateSources'\nimport type { TemplateSource } from './templateSources'\nimport type { BindingContext } from '@tko/bind'\n\nexport interface TemplateOptions<T = any> {\n afterRender?: (elements: Node[], dataItem: T) => void\n templateEngine?: TemplateEngine\n}\n\nexport interface TemplateEngine {\n allowTemplateRewriting: boolean\n\n renderTemplateSource(\n templateSource: TemplateSource,\n bindingContext: BindingContext<any>,\n options: TemplateOptions<any>,\n templateDocument?: Document\n ): Node[]\n createJavaScriptEvaluatorBlock(script: string): string\n\n makeTemplateSource(template: string | Node, templateDocument?: Document): TemplateSource\n\n renderTemplate(\n template: string | Node,\n bindingContext: BindingContext<any>,\n options: TemplateOptions<any>,\n templateDocument?: Document\n ): Node[]\n\n isTemplateRewritten(template: string | Node, templateDocument?: Document): boolean\n\n rewriteTemplate(template: string | Node, rewriterCallback: (val: string) => string, templateDocument?: Document): void\n}\n\n//TODO Class-Migration implements TemplateEngine\nexport function templateEngine() {}\n\nextend(templateEngine.prototype, {\n renderTemplateSource(\n templateSource: TemplateSource,\n bindingContext: BindingContext<any>,\n options,\n templateDocument?: Document\n ) {\n // templateSource, bindingContext, templateDocument not in use\n options.onError('Override renderTemplateSource')\n },\n\n createJavaScriptEvaluatorBlock(script: string) {\n options.onError(new Error('Override createJavaScriptEvaluatorBlock'))\n },\n\n makeTemplateSource(template: string | Node, templateDocument?: Document): TemplateSource {\n // Named template\n if (typeof template === 'string') {\n templateDocument = templateDocument || document\n const elem = templateDocument.getElementById(template)\n if (!elem) {\n throw options.onError(new Error('Cannot find template with ID ' + template), false)\n }\n return new domElement(elem)\n } else if (template.nodeType === Node.ELEMENT_NODE) {\n // Anonymous template\n return new anonymousTemplate(template as Element)\n } else if (template.nodeType === Node.COMMENT_NODE) {\n // Anonymous template stored in a comment node\n return new anonymousTemplate(template as Comment)\n } else {\n throw options.onError(new Error('Unknown template type: ' + template), false)\n }\n },\n\n renderTemplate(\n template: string | Node,\n bindingContext: BindingContext<any>,\n options: TemplateOptions<any>,\n templateDocument?: Document\n ): Node[] {\n const templateSource = this.makeTemplateSource(template, templateDocument)\n return this.renderTemplateSource(templateSource, bindingContext, options, templateDocument)\n }\n})\n"],
|
|
5
|
+
"mappings": ";;AA2BA,SAAS,QAAQ,eAAe;AAChC,SAAS,YAAY,yBAAyB;AAmCvC,gBAAS,iBAAiB;AAAC;AAElC,OAAO,eAAe,WAAW;AAAA,EAC/B,qBACE,gBACA,gBACAA,UACA,kBACA;AAEA,IAAAA,SAAQ,QAAQ,+BAA+B;AAAA,EACjD;AAAA,EAEA,+BAA+B,QAAgB;AAC7C,YAAQ,QAAQ,IAAI,MAAM,yCAAyC,CAAC;AAAA,EACtE;AAAA,EAEA,mBAAmB,UAAyB,kBAA6C;AAEvF,QAAI,OAAO,aAAa,UAAU;AAChC,yBAAmB,oBAAoB;AACvC,YAAM,OAAO,iBAAiB,eAAe,QAAQ;AACrD,UAAI,CAAC,MAAM;AACT,cAAM,QAAQ,QAAQ,IAAI,MAAM,kCAAkC,QAAQ,GAAG,KAAK;AAAA,MACpF;AACA,aAAO,IAAI,WAAW,IAAI;AAAA,IAC5B,WAAW,SAAS,aAAa,KAAK,cAAc;AAElD,aAAO,IAAI,kBAAkB,QAAmB;AAAA,IAClD,WAAW,SAAS,aAAa,KAAK,cAAc;AAElD,aAAO,IAAI,kBAAkB,QAAmB;AAAA,IAClD,OAAO;AACL,YAAM,QAAQ,QAAQ,IAAI,MAAM,4BAA4B,QAAQ,GAAG,KAAK;AAAA,IAC9E;AAAA,EACF;AAAA,EAEA,eACE,UACA,gBACAA,UACA,kBACQ;AACR,UAAM,iBAAiB,KAAK,mBAAmB,UAAU,gBAAgB;AACzE,WAAO,KAAK,qBAAqB,gBAAgB,gBAAgBA,UAAS,gBAAgB;AAAA,EAC5F;AACF,CAAC;",
|
|
6
|
+
"names": ["options"]
|
|
7
7
|
}
|
package/dist/templateSources.js
CHANGED
|
@@ -1,80 +1,81 @@
|
|
|
1
|
-
// @tko/binding.template 🥊 4.0.0
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
} from "@tko/utils";
|
|
8
|
-
var templateScript = 1, templateTextArea = 2, templateTemplate = 3, templateElement = 4;
|
|
9
|
-
export function domElement(element) {
|
|
10
|
-
this.domElement = element;
|
|
11
|
-
if (!element) {
|
|
12
|
-
return;
|
|
13
|
-
}
|
|
14
|
-
var tagNameLower = tagNameLowerFn(element);
|
|
15
|
-
this.templateType = tagNameLower === "script" ? templateScript : tagNameLower === "textarea" ? templateTextArea : tagNameLower == "template" && element.content && element.content.nodeType === 11 ? templateTemplate : templateElement;
|
|
16
|
-
}
|
|
17
|
-
domElement.prototype.text = function() {
|
|
18
|
-
var elemContentsProperty = this.templateType === templateScript ? "text" : this.templateType === templateTextArea ? "value" : "innerHTML";
|
|
19
|
-
if (arguments.length == 0) {
|
|
20
|
-
return this.domElement[elemContentsProperty];
|
|
21
|
-
} else {
|
|
22
|
-
var valueToWrite = arguments[0];
|
|
23
|
-
if (elemContentsProperty === "innerHTML") {
|
|
24
|
-
setHtml(this.domElement, valueToWrite);
|
|
25
|
-
} else {
|
|
26
|
-
this.domElement[elemContentsProperty] = valueToWrite;
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
};
|
|
30
|
-
var dataDomDataPrefix = domData.nextKey() + "_";
|
|
31
|
-
domElement.prototype.data = function(key) {
|
|
32
|
-
if (arguments.length === 1) {
|
|
33
|
-
return domData.get(this.domElement, dataDomDataPrefix + key);
|
|
34
|
-
} else {
|
|
35
|
-
domData.set(this.domElement, dataDomDataPrefix + key, arguments[1]);
|
|
36
|
-
}
|
|
37
|
-
};
|
|
38
|
-
var templatesDomDataKey = domData.nextKey();
|
|
1
|
+
// @tko/binding.template 🥊 4.0.0 ESM
|
|
2
|
+
"use strict";
|
|
3
|
+
import { tagNameLower as tagNameLowerFn, setHtml, domData, parseHtmlForTemplateNodes } from "@tko/utils";
|
|
4
|
+
const templateScript = 1, templateTextArea = 2, templateTemplate = 3, templateElement = 4, templateAnonymous = 5;
|
|
5
|
+
const dataDomDataPrefix = domData.nextKey() + "_";
|
|
6
|
+
const templatesDomDataKey = domData.nextKey();
|
|
39
7
|
function getTemplateDomData(element) {
|
|
40
8
|
return domData.get(element, templatesDomDataKey) || {};
|
|
41
9
|
}
|
|
42
10
|
function setTemplateDomData(element, data) {
|
|
43
11
|
domData.set(element, templatesDomDataKey, data);
|
|
44
12
|
}
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
const
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
13
|
+
export class domElement {
|
|
14
|
+
constructor(element) {
|
|
15
|
+
this.domElement = element;
|
|
16
|
+
if (element.nodeType === Node.COMMENT_NODE) {
|
|
17
|
+
this.templateType = templateElement;
|
|
18
|
+
} else {
|
|
19
|
+
const tagNameLower = tagNameLowerFn(this.domElement);
|
|
20
|
+
this.templateType = tagNameLower === "script" ? templateScript : tagNameLower === "textarea" ? templateTextArea : (
|
|
21
|
+
// For browsers with proper <template> element support, where the .content property gives a document fragment
|
|
22
|
+
tagNameLower == "template" && element.content && element.content.nodeType === Node.DOCUMENT_FRAGMENT_NODE ? templateTemplate : templateElement
|
|
23
|
+
);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
text(valueToWrite) {
|
|
27
|
+
const elemContentsProperty = this.templateType === templateScript ? "text" : this.templateType === templateTextArea ? "value" : "innerHTML";
|
|
28
|
+
if (arguments.length == 0) {
|
|
29
|
+
return this.domElement[elemContentsProperty];
|
|
30
|
+
} else {
|
|
31
|
+
if (elemContentsProperty === "innerHTML") {
|
|
32
|
+
setHtml(this.domElement, valueToWrite);
|
|
33
|
+
} else {
|
|
34
|
+
this.domElement[elemContentsProperty] = valueToWrite;
|
|
56
35
|
}
|
|
57
36
|
}
|
|
58
|
-
return nodes;
|
|
59
|
-
} else {
|
|
60
|
-
var valueToWrite = arguments[0];
|
|
61
|
-
setTemplateDomData(element, { containerData: valueToWrite });
|
|
62
37
|
}
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
38
|
+
data(key, valueToWrite) {
|
|
39
|
+
if (arguments.length === 1) {
|
|
40
|
+
return domData.get(this.domElement, dataDomDataPrefix + key);
|
|
41
|
+
} else {
|
|
42
|
+
domData.set(this.domElement, dataDomDataPrefix + key, valueToWrite);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
nodes(valueToWrite) {
|
|
46
|
+
const element = this.domElement;
|
|
47
|
+
if (arguments.length == 0) {
|
|
48
|
+
const templateData = getTemplateDomData(element);
|
|
49
|
+
let nodes = templateData.containerData || (this.templateType === templateTemplate ? element.content : this.templateType === templateElement ? element : void 0);
|
|
50
|
+
if (!nodes || templateData.alwaysCheckText) {
|
|
51
|
+
const text = this.text();
|
|
52
|
+
if (text) {
|
|
53
|
+
nodes = parseHtmlForTemplateNodes(text, element.ownerDocument);
|
|
54
|
+
this.text("");
|
|
55
|
+
setTemplateDomData(element, { containerData: nodes, alwaysCheckText: true });
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
return nodes;
|
|
59
|
+
} else {
|
|
60
|
+
setTemplateDomData(element, { containerData: valueToWrite });
|
|
61
|
+
}
|
|
62
|
+
return void 0;
|
|
63
|
+
}
|
|
66
64
|
}
|
|
67
|
-
anonymousTemplate
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
65
|
+
export class anonymousTemplate extends domElement {
|
|
66
|
+
constructor(element) {
|
|
67
|
+
super(element);
|
|
68
|
+
this.templateType = templateAnonymous;
|
|
69
|
+
}
|
|
70
|
+
text(valueToWrite) {
|
|
71
|
+
if (arguments.length == 0) {
|
|
72
|
+
const templateData = getTemplateDomData(this.domElement);
|
|
73
|
+
if (templateData.textData === void 0 && templateData.containerData) {
|
|
74
|
+
templateData.textData = templateData.containerData.innerHTML;
|
|
75
|
+
}
|
|
76
|
+
return templateData.textData;
|
|
77
|
+
} else {
|
|
78
|
+
setTemplateDomData(this.domElement, { textData: valueToWrite });
|
|
74
79
|
}
|
|
75
|
-
return templateData.textData;
|
|
76
|
-
} else {
|
|
77
|
-
var valueToWrite = arguments[0];
|
|
78
|
-
setTemplateDomData(this.domElement, { textData: valueToWrite });
|
|
79
80
|
}
|
|
80
|
-
}
|
|
81
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/templateSources.ts"],
|
|
4
|
-
"sourcesContent": ["// A template source represents a read/write way of accessing a template. This is to eliminate the need for template loading/saving\n// logic to be duplicated in every template engine (and means they can all work with anonymous templates, etc.)\n//\n// Two are provided by default:\n// 1. ko.templateSources.domElement - reads/writes the text content of an arbitrary DOM element\n// 2. ko.templateSources.anonymousElement - uses ko.utils.domData to read/write text *associated* with the DOM element, but\n// without reading/writing the actual element text content, since it will be overwritten\n// with the rendered template output.\n// You can implement your own template source if you want to fetch/store templates somewhere other than in DOM elements.\n// Template sources need to have the following functions:\n// text() \t\t\t- returns the template text from your storage location\n// text(value)\t\t- writes the supplied template text to your storage location\n// data(key)\t\t\t- reads values stored using data(key, value) - see below\n// data(key, value)\t- associates \"value\" with this template and the key \"key\". Is used to store information like \"isRewritten\".\n//\n// Optionally, template sources can also have the following functions:\n// nodes() - returns a DOM element containing the nodes of this template, where available\n// nodes(value) - writes the given DOM element to your storage location\n// If a DOM element is available for a given template source, template engines are encouraged to use it in preference over text()\n// for improved speed. However, all templateSources must supply text() even if they don't supply nodes().\n//\n// Once you've implemented a templateSource, make your template engine use it by subclassing whatever template engine you were\n// using and overriding \"makeTemplateSource\" to return an instance of your custom template source.\n\nimport {
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["// A template source represents a read/write way of accessing a template. This is to eliminate the need for template loading/saving\n// logic to be duplicated in every template engine (and means they can all work with anonymous templates, etc.)\n//\n// Two are provided by default:\n// 1. ko.templateSources.domElement - reads/writes the text content of an arbitrary DOM element\n// 2. ko.templateSources.anonymousElement - uses ko.utils.domData to read/write text *associated* with the DOM element, but\n// without reading/writing the actual element text content, since it will be overwritten\n// with the rendered template output.\n// You can implement your own template source if you want to fetch/store templates somewhere other than in DOM elements.\n// Template sources need to have the following functions:\n// text() \t\t\t- returns the template text from your storage location\n// text(value)\t\t- writes the supplied template text to your storage location\n// data(key)\t\t\t- reads values stored using data(key, value) - see below\n// data(key, value)\t- associates \"value\" with this template and the key \"key\". Is used to store information like \"isRewritten\".\n//\n// Optionally, template sources can also have the following functions:\n// nodes() - returns a DOM element containing the nodes of this template, where available\n// nodes(value) - writes the given DOM element to your storage location\n// If a DOM element is available for a given template source, template engines are encouraged to use it in preference over text()\n// for improved speed. However, all templateSources must supply text() even if they don't supply nodes().\n//\n// Once you've implemented a templateSource, make your template engine use it by subclassing whatever template engine you were\n// using and overriding \"makeTemplateSource\" to return an instance of your custom template source.\n\nimport { tagNameLower as tagNameLowerFn, setHtml, domData, parseHtmlForTemplateNodes } from '@tko/utils'\n\n// ---- ko.templateSources.domElement -----\n\n// template types\nconst templateScript = 1,\n templateTextArea = 2,\n templateTemplate = 3,\n templateElement = 4,\n templateAnonymous = 5\n\nexport interface TemplateSource {\n text(): string\n text(valueToWrite: string): void\n text(valueToWrite?: string): string | void\n\n data(key: string): any\n data<T>(key: string): T\n data<T>(key: string, valueToWrite: T): void\n\n nodes(): Node\n nodes(valueToWrite: Node): undefined\n nodes(valueToWrite?: any): Node | undefined\n}\n\nconst dataDomDataPrefix = domData.nextKey() + '_'\nconst templatesDomDataKey = domData.nextKey()\nfunction getTemplateDomData(element) {\n return domData.get(element, templatesDomDataKey) || {}\n}\nfunction setTemplateDomData(element, data) {\n domData.set(element, templatesDomDataKey, data)\n}\n\nexport class domElement implements TemplateSource {\n protected domElement: Element | Comment\n protected templateType: number\n\n constructor(element: Element | Comment) {\n this.domElement = element\n\n if (element.nodeType === Node.COMMENT_NODE) {\n this.templateType = templateElement\n } else {\n const tagNameLower = tagNameLowerFn(this.domElement as Element)\n this.templateType =\n tagNameLower === 'script'\n ? templateScript\n : tagNameLower === 'textarea'\n ? templateTextArea\n : // For browsers with proper <template> element support, where the .content property gives a document fragment\n tagNameLower == 'template'\n && (element as HTMLTemplateElement).content\n && (element as HTMLTemplateElement).content.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n ? templateTemplate\n : templateElement\n }\n }\n\n text(): string\n text(valueToWrite: string): void\n text(valueToWrite?: string): string | void {\n const elemContentsProperty =\n this.templateType === templateScript ? 'text' : this.templateType === templateTextArea ? 'value' : 'innerHTML'\n\n if (arguments.length == 0) {\n return this.domElement[elemContentsProperty]\n } else {\n if (elemContentsProperty === 'innerHTML') {\n setHtml(this.domElement, valueToWrite!)\n } else {\n this.domElement[elemContentsProperty] = valueToWrite\n }\n }\n }\n\n data<T = any>(key: string, valueToWrite?: T): T | void {\n if (arguments.length === 1) {\n return domData.get(this.domElement, dataDomDataPrefix + key)\n } else {\n domData.set(this.domElement, dataDomDataPrefix + key, valueToWrite)\n }\n }\n\n nodes(): Node\n nodes(valueToWrite: Node): undefined\n nodes(valueToWrite?: any): Node | undefined {\n const element = this.domElement\n if (arguments.length == 0) {\n const templateData = getTemplateDomData(element)\n let nodes =\n templateData.containerData\n || (this.templateType === templateTemplate\n ? (element as HTMLTemplateElement).content\n : this.templateType === templateElement\n ? element\n : undefined)\n if (!nodes || templateData.alwaysCheckText) {\n // If the template is associated with an element that stores the template as text,\n // parse and cache the nodes whenever there's new text content available. This allows\n // the user to update the template content by updating the text of template node.\n const text = this.text()\n if (text) {\n nodes = parseHtmlForTemplateNodes(text, element.ownerDocument)\n this.text('') // clear the text from the node\n setTemplateDomData(element, { containerData: nodes, alwaysCheckText: true })\n }\n }\n return nodes\n } else {\n setTemplateDomData(element, { containerData: valueToWrite })\n }\n return undefined\n }\n}\n\n// ---- ko.templateSources.anonymousTemplate -----\n// Anonymous templates are normally saved/retrieved as DOM nodes through \"nodes\".\n// For compatibility, you can also read \"text\"; it will be serialized from the nodes on demand.\n// Writing to \"text\" is still supported, but then the template data will not be available as DOM nodes.\nexport class anonymousTemplate extends domElement {\n constructor(element: Element | Comment) {\n super(element)\n //The old prototype construct uses an empty-constructor from domElement, so templateType and element was 'undefined'.\n //With the new templateType = templateAnonymous (5) we achieve the same behavior in the \"nodes\" Method\n this.templateType = templateAnonymous\n }\n\n override text(): string\n override text(valueToWrite: string): void\n override text(valueToWrite?: string): string | void {\n if (arguments.length == 0) {\n const templateData = getTemplateDomData(this.domElement)\n if (templateData.textData === undefined && templateData.containerData) {\n templateData.textData = templateData.containerData.innerHTML\n }\n return templateData.textData\n } else {\n setTemplateDomData(this.domElement, { textData: valueToWrite })\n }\n }\n}\n"],
|
|
5
|
+
"mappings": ";;AAwBA,SAAS,gBAAgB,gBAAgB,SAAS,SAAS,iCAAiC;AAK5F,MAAM,iBAAiB,GACrB,mBAAmB,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,oBAAoB;AAgBtB,MAAM,oBAAoB,QAAQ,QAAQ,IAAI;AAC9C,MAAM,sBAAsB,QAAQ,QAAQ;AAC5C,SAAS,mBAAmB,SAAS;AACnC,SAAO,QAAQ,IAAI,SAAS,mBAAmB,KAAK,CAAC;AACvD;AACA,SAAS,mBAAmB,SAAS,MAAM;AACzC,UAAQ,IAAI,SAAS,qBAAqB,IAAI;AAChD;AAEO,aAAM,WAAqC;AAAA,EAIhD,YAAY,SAA4B;AACtC,SAAK,aAAa;AAElB,QAAI,QAAQ,aAAa,KAAK,cAAc;AAC1C,WAAK,eAAe;AAAA,IACtB,OAAO;AACL,YAAM,eAAe,eAAe,KAAK,UAAqB;AAC9D,WAAK,eACH,iBAAiB,WACb,iBACA,iBAAiB,aACf;AAAA;AAAA,QAEA,gBAAgB,cACV,QAAgC,WAChC,QAAgC,QAAQ,aAAa,KAAK,yBAC9D,mBACA;AAAA;AAAA,IACZ;AAAA,EACF;AAAA,EAIA,KAAK,cAAsC;AACzC,UAAM,uBACJ,KAAK,iBAAiB,iBAAiB,SAAS,KAAK,iBAAiB,mBAAmB,UAAU;AAErG,QAAI,UAAU,UAAU,GAAG;AACzB,aAAO,KAAK,WAAW,oBAAoB;AAAA,IAC7C,OAAO;AACL,UAAI,yBAAyB,aAAa;AACxC,gBAAQ,KAAK,YAAY,YAAa;AAAA,MACxC,OAAO;AACL,aAAK,WAAW,oBAAoB,IAAI;AAAA,MAC1C;AAAA,IACF;AAAA,EACF;AAAA,EAEA,KAAc,KAAa,cAA4B;AACrD,QAAI,UAAU,WAAW,GAAG;AAC1B,aAAO,QAAQ,IAAI,KAAK,YAAY,oBAAoB,GAAG;AAAA,IAC7D,OAAO;AACL,cAAQ,IAAI,KAAK,YAAY,oBAAoB,KAAK,YAAY;AAAA,IACpE;AAAA,EACF;AAAA,EAIA,MAAM,cAAsC;AAC1C,UAAM,UAAU,KAAK;AACrB,QAAI,UAAU,UAAU,GAAG;AACzB,YAAM,eAAe,mBAAmB,OAAO;AAC/C,UAAI,QACF,aAAa,kBACT,KAAK,iBAAiB,mBACrB,QAAgC,UACjC,KAAK,iBAAiB,kBACpB,UACA;AACR,UAAI,CAAC,SAAS,aAAa,iBAAiB;AAI1C,cAAM,OAAO,KAAK,KAAK;AACvB,YAAI,MAAM;AACR,kBAAQ,0BAA0B,MAAM,QAAQ,aAAa;AAC7D,eAAK,KAAK,EAAE;AACZ,6BAAmB,SAAS,EAAE,eAAe,OAAO,iBAAiB,KAAK,CAAC;AAAA,QAC7E;AAAA,MACF;AACA,aAAO;AAAA,IACT,OAAO;AACL,yBAAmB,SAAS,EAAE,eAAe,aAAa,CAAC;AAAA,IAC7D;AACA,WAAO;AAAA,EACT;AACF;AAMO,aAAM,0BAA0B,WAAW;AAAA,EAChD,YAAY,SAA4B;AACtC,UAAM,OAAO;AAGb,SAAK,eAAe;AAAA,EACtB;AAAA,EAIS,KAAK,cAAsC;AAClD,QAAI,UAAU,UAAU,GAAG;AACzB,YAAM,eAAe,mBAAmB,KAAK,UAAU;AACvD,UAAI,aAAa,aAAa,UAAa,aAAa,eAAe;AACrE,qBAAa,WAAW,aAAa,cAAc;AAAA,MACrD;AACA,aAAO,aAAa;AAAA,IACtB,OAAO;AACL,yBAAmB,KAAK,YAAY,EAAE,UAAU,aAAa,CAAC;AAAA,IAChE;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|