@makeform/common 1.0.4 → 2.0.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Change Logs
 
+## v2.0.0
+
+ - support `head`, `body` and `foot` plugs when `widget` is not applied.
+ - add plug fallbacks for head, body and foot
+ - add `has-variant` class from `@makeform/input` since `variant` is a common-based feature
+ - explicitly set `manual` only if `has-tips` is available
+ - add `notes` class, and add margin-top only if notes is not empty to prevent unwanted margin.
+
+
+## v1.0.5
+
+ - rebuild for missing artifacts
+
+
 ## v1.0.4
 
  - use `overflow-wrap` to break super long text instead of `word-break: break-all` which breaks all texts

package/README.md

@@ -1,13 +1,20 @@
 # @makeform/common
 
-supported meta:
+Base block implementing common features of a widget.
+
+
+## Supported Meta
+
+`@makeform/common` provides ld selectors and default DOMs for rendering following meta fields:
 
  - `title`: field title.
  - `desc`: description of this field.
  - `isRequired`: true if this field is required.
 
 
-supported configs:
+## Supported Configs
+
+`@makeform/common` provides ld selectors and default DOMs for rendering following config fields:
 
  - `note`: a list of string showing additional note about this field.
  - `limitation`: a string shown as the main requirement of this field.
@@ -17,7 +24,25 @@ supported configs:
    - `block`: header is shown.
 
 
-## interfae
+## ld selectors
+
+As mentioned above, a child block can use following ld selectors to build its own DOM:
+
+ - `base`: node with `form-group` class.
+ - `limitation`: node displaying limitation
+ - `note`: iterable node displaying widget note.
+ - `is-required`: show when value of this widget is required.
+ - `label`: display widget title
+ - `desc`: display widget description
+ - `variant`: display widget variant
+ - `display`: this node will be hidden if `display` mode is different from `data-display` value.
+ - `error`: iterable node displaying widget errros.
+ - `error-root`: node containing error information.
+   - by default `@makeform/common` use `@loadingio/bootstrap.ext` tips to show tips.
+     if `error-root` contains `has-tips` class, `manual` will be toggled based on widget status automatically.
+
+
+## interface
 
 `@makeform/common` provides additional members for child block to access, which are created by `@makeform/common`:
 

package/index.html

@@ -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-word;overflow-wrap:break-word;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,l;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(){this.remeta(this.serialize());if(this.mod.info.view){this.mod.info.view.render()}return t.render.apply(this)}};l=import$(import$({},t),u);return l};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>
+<div><plug class="form-group" name="widget" ld="base"><plug name="head"><div ld="display" data-display="block"><label class="d-flex align-items-end flex-wrap justify-content-between"><div><span ld="label"></span><span class="variant text-sm ml-2">(<span ld="variant"></span>)</span><span class="text-danger ml-2" ld="is-required">*</span></div><div class="m-edit"><div class="mf-note text-sm" ld="limitation"></div></div></label></div><div class="text-sm text-muted" ld="display" data-display="block"><div ld="desc" style="margin:-.6em 0 .7em"></div></div></plug><plug name="body"></plug><plug name="foot"><div class="m-edit notes" ld="display" data-display="block"><div class="mf-note text-sm note" ld-each="note"></div></div></plug></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-word;overflow-wrap:break-word}.variant{display:none}.has-variant .variant{display:inline}.notes{margin-top:.5em}.notes:empty{margin-top:0}</style><script type="@plotdb/block">var mod;module.exports={pkg:{name:"@makeform/common",extend:{name:"@makeform/base",dom:"overwrite"},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;if(t.classList.contains("has-tips")){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(){this.remeta(this.serialize());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

@@ -1 +1 @@
-{"name":"@makeform/common","version":"1.0.4","description":"","scripts":{},"keywords":[],"author":"zbryikt","license":"MIT","dependencies":{"@plotdb/srcbuild":"^0.0.68"},"devDependencies":{"fedep":"^1.3.0"}}
+{"name":"@makeform/common","version":"2.0.0","description":"","scripts":{},"keywords":[],"author":"zbryikt","license":"MIT","dependencies":{"@plotdb/srcbuild":"^0.0.68"},"devDependencies":{"fedep":"^1.3.0"}}