@makeform/common 1.0.0 → 1.0.2
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/CHANGELOG.md +10 -0
- package/README.md +41 -0
- package/index.html +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -1,5 +1,46 @@
|
|
|
1
1
|
# @makeform/common
|
|
2
2
|
|
|
3
|
+
supported meta:
|
|
4
|
+
|
|
5
|
+
- `title`: field title.
|
|
6
|
+
- `desc`: description of this field.
|
|
7
|
+
- `isRequired`: true if this field is required.
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
supported configs:
|
|
11
|
+
|
|
12
|
+
- `note`: a list of string showing additional note about this field.
|
|
13
|
+
- `limitation`: a string shown as the main requirement of this field.
|
|
14
|
+
- `display`: either `inline` or `block`. The main difference of these display is:
|
|
15
|
+
- `inline`: consider the widget as to be used inline, without header.
|
|
16
|
+
- widget may be shown as `block` style element in CSS, so user should wrap widget properly.
|
|
17
|
+
- `block`: header is shown.
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
## interfae
|
|
21
|
+
|
|
22
|
+
`@makeform/common` provides additional members for child block to access, which are created by `@makeform/common`:
|
|
23
|
+
|
|
24
|
+
- `info`
|
|
25
|
+
- `meta`: the meta object
|
|
26
|
+
- `config`: the config object
|
|
27
|
+
- `display`: display mode, either `inline` of `block`. when omitted, default to `block`.
|
|
28
|
+
- `view`: ldview object created by `@makeform/common`.
|
|
29
|
+
- `child`
|
|
30
|
+
- preserved for child block to use
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
## default classes
|
|
34
|
+
|
|
35
|
+
Following are classes used by @makeform/common and all blocks inheriting `@makeform/common`. While you can build the exactly same logic or design conventions with different class names by your own, following these conventions makes it easier to customize your blocks along with the default blocks in headless manner.
|
|
36
|
+
|
|
37
|
+
- functional classes:
|
|
38
|
+
- `m-view`: for nodes that should only be shown in view mode.
|
|
39
|
+
- `m-edit`: for nodes that should only be shown in view mode.
|
|
40
|
+
- style classes:
|
|
41
|
+
- `mf-note`: decorator for note nodes.
|
|
42
|
+
|
|
43
|
+
|
|
3
44
|
## License
|
|
4
45
|
|
|
5
46
|
MIT
|
package/index.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<div><plug name="widget"></plug><style type="text/css">:scope{break-inside:avoid}:scope.m-view *[ld=label]{opacity:.85;text-decoration:underline}:scope.m-view .m-edit{display:none !important}:scope.m-edit .m-view{display:none !important}*[ld=content]{white-space:pre-wrap;word-break:break-all}</style><script type="@plotdb/block">var mod;module.exports={pkg:{name:"@makeform/common",extend:{name:"@makeform/base"},dependencies:[],i18n:{en:{error:"error"},"zh-TW":{error:"有錯誤"}}},init:function(t){return t.pubsub.on("subinit",function(n){n==null&&(n={});return t.pubsub.fire("init",{mod:mod(t,n.mod)})})}};mod=function(n,t){var i,e,o,r,a,s,u,c;i=n.root,e=n.ctx,o=n.data,r=n.parent,a=n.t;s=e.ldview;u={init:function(){var r,e=this;this.mod.info=r={};this.mod.child={};this.remeta=function(n){r.meta=n;r.config=n.config||{};return r.display=n.config.display||"block"};this.on("meta",function(){return e.remeta(e.serialize())});this.remeta(o);if(!i){return}this.mod.info.view=new s({root:i,text:{label:function(){return a(r.meta.title||"untitled")},variant:function(n){var t;t=n.node;return a(r.config.variant||"")}},handler:{"@":function(n){var t;t=n.node;
|
|
1
|
+
<div><plug name="widget"></plug><style type="text/css">:scope{break-inside:avoid}:scope.m-view *[ld=label]{opacity:.85;text-decoration:underline}:scope.m-view .m-edit{display:none !important}:scope.m-edit .m-view{display:none !important}*[ld=content]{white-space:pre-wrap;word-break:break-all}</style><script type="@plotdb/block">var mod;module.exports={pkg:{name:"@makeform/common",extend:{name:"@makeform/base"},dependencies:[],i18n:{en:{error:"error"},"zh-TW":{error:"有錯誤"}}},init:function(t){return t.pubsub.on("subinit",function(n){n==null&&(n={});return t.pubsub.fire("init",{mod:mod(t,n.mod)})})}};mod=function(n,t){var i,e,o,r,a,s,u,c;i=n.root,e=n.ctx,o=n.data,r=n.parent,a=n.t;s=e.ldview;u={init:function(){var r,e=this;this.mod.info=r={};this.mod.child={};this.remeta=function(n){r.meta=n;r.config=n.config||{};return r.display=n.config.display||"block"};this.on("meta",function(){return e.remeta(e.serialize())});this.remeta(o);if(!i){return}this.mod.info.view=new s({root:i,text:{label:function(){return a(r.meta.title||"untitled")},variant:function(n){var t;t=n.node;return a(r.config.variant||"")}},handler:{"@":function(n){var t;t=n.node;t.classList.toggle("m-inline",r.display!=="block");return t.classList.toggle("has-error",e.status()===2)},base:function(n){var t;t=n.node;t.classList.toggle("form-group",r.display==="block");return t.classList.toggle("has-variant",!!r.config.variant)},"is-required":function(n){var t;t=n.node;return t.classList.toggle("d-none",!r.meta.isRequired)},desc:function(n){var t;t=n.node;t.classList.toggle("d-none",!r.meta.desc);return t.innerText=a(r.meta.desc||"")||""},display:function(n){var t;t=n.node;return t.classList.toggle("d-none",t.getAttribute("data-display")!==r.display)},"error-root":function(n){var t;t=n.node;return t.classList.toggle("manual",e.status()!==2)},limitation:function(n){var t,e;t=n.node;e=a(r.config.limitation||"");t.classList.toggle("d-none",!e);return t.innerHTML="• "+e},error:{list:function(){var n,t;if((n=e.status())!==2){return[]}t=e._errors.slice(0,1).concat(e._errors.length>1?["..."]:[]);return t.filter(function(n){return n!=="nested"})},text:function(n){var t;t=n.data;return a(t)}},note:{list:function(){if(Array.isArray(r.config.note)){return r.config.note}else if(r.config.note){return[r.config.note]}else{return[]}},key:function(n){return n},handler:function(n){var t,e,r;t=n.node,e=n.data;r=a(e);t.innerText=r?"• "+r:"";return t.classList.toggle("d-none",!r)}}}});return t.init.apply(this)},render:function(){if(this.mod.info.view){this.mod.info.view.render()}return t.render.apply(this)}};c=import$(import$({},t),u);return c};function import$(n,t){var e={}.hasOwnProperty;for(var r in t)if(e.call(t,r))n[r]=t[r];return n}</script></div>
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@makeform/common","version":"1.0.
|
|
1
|
+
{"name":"@makeform/common","version":"1.0.2","description":"","scripts":{},"keywords":[],"author":"zbryikt","license":"MIT","dependencies":{"@plotdb/srcbuild":"^0.0.68"},"devDependencies":{"fedep":"^1.3.0"}}
|