@pacem/pacem 1.0.0-abel → 1.0.0-amaldi

package/dist/vscode.html-custom.json

@@ -0,0 +1,4834 @@
+{
+  "version": 1.1,
+  "tags": [
+    {
+      "name": "pacem-2d",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "adapter"
+        },
+        {
+          "name": "viewbox"
+        },
+        {
+          "name": "aspect-ratio"
+        },
+        {
+          "name": "datasource"
+        },
+        {
+          "name": "options"
+        },
+        {
+          "name": "zoom"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-canvas-adapter",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**\n\nImplementation postponed. Focus on SVG adapter."
+      }
+    },
+    {
+      "name": "pacem-2d-circle",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "center"
+        },
+        {
+          "name": "radius"
+        },
+        {
+          "name": "start"
+        },
+        {
+          "name": "end"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-ellipse",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "center"
+        },
+        {
+          "name": "rx"
+        },
+        {
+          "name": "ry"
+        },
+        {
+          "name": "start"
+        },
+        {
+          "name": "end"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-group",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "datasource"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-image",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "src"
+        },
+        {
+          "name": "x"
+        },
+        {
+          "name": "y"
+        },
+        {
+          "name": "width"
+        },
+        {
+          "name": "height"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-line",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "from"
+        },
+        {
+          "name": "to"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-path",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "d"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-polygon",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "sides"
+        },
+        {
+          "name": "radius",
+          "description": "The circumradius of the polygon."
+        },
+        {
+          "name": "center"
+        },
+        {
+          "name": "star-indent"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-polyline",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "points"
+        },
+        {
+          "name": "closed",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-rect",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "x"
+        },
+        {
+          "name": "y"
+        },
+        {
+          "name": "w"
+        },
+        {
+          "name": "h"
+        },
+        {
+          "name": "r"
+        },
+        {
+          "name": "corner-type"
+        }
+      ]
+    },
+    {
+      "name": "pacem-2d-svg-adapter",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      }
+    },
+    {
+      "name": "pacem-2d-text",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-2d**"
+      },
+      "attributes": [
+        {
+          "name": "text"
+        },
+        {
+          "name": "color"
+        },
+        {
+          "name": "font-family"
+        },
+        {
+          "name": "font-size"
+        },
+        {
+          "name": "font-weight"
+        },
+        {
+          "name": "font-style"
+        },
+        {
+          "name": "anchor"
+        },
+        {
+          "name": "text-anchor"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "interactive",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "transparent",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "background"
+        },
+        {
+          "name": "adapter"
+        },
+        {
+          "name": "datasource"
+        },
+        {
+          "name": "orbit",
+          "description": "@deprecated",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-orbit-camera",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "max-azimuth"
+        },
+        {
+          "name": "max-polar"
+        },
+        {
+          "name": "min-azimuth"
+        },
+        {
+          "name": "min-polar"
+        },
+        {
+          "name": "zoom-control"
+        },
+        {
+          "name": "rotation-control"
+        },
+        {
+          "name": "pan-control"
+        },
+        {
+          "name": "inertia"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-box",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "width"
+        },
+        {
+          "name": "height"
+        },
+        {
+          "name": "depth"
+        },
+        {
+          "name": "width-segments"
+        },
+        {
+          "name": "height-segments"
+        },
+        {
+          "name": "depth-segments"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-cone",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "radius"
+        },
+        {
+          "name": "height"
+        },
+        {
+          "name": "sides"
+        },
+        {
+          "name": "height-segments"
+        },
+        {
+          "name": "cap-segments"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-cylinder",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "radius"
+        },
+        {
+          "name": "height"
+        },
+        {
+          "name": "sides"
+        },
+        {
+          "name": "height-segments"
+        },
+        {
+          "name": "cap-segments"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-dodecahedron",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      }
+    },
+    {
+      "name": "pacem-3d-primitive-hexahedron",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      }
+    },
+    {
+      "name": "pacem-3d-primitive-icosahedron",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      }
+    },
+    {
+      "name": "pacem-3d-primitive-line",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "positions"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-octahedron",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      }
+    },
+    {
+      "name": "pacem-3d-primitive-plane",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "width"
+        },
+        {
+          "name": "length"
+        },
+        {
+          "name": "width-segments"
+        },
+        {
+          "name": "length-segments"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-sphere",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "radius"
+        },
+        {
+          "name": "segments"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-primitive-tetrahedron",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      }
+    },
+    {
+      "name": "pacem-3d-primitive-torus",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "radius"
+        },
+        {
+          "name": "inner-radius"
+        },
+        {
+          "name": "segments"
+        },
+        {
+          "name": "sides"
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-three-adapter",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "orbit",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-webgpu-adapter",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "modifiers"
+        },
+        {
+          "name": "enable-validation",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-3d-wgsl-script",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-3d**"
+      },
+      "attributes": [
+        {
+          "name": "type"
+        },
+        {
+          "name": "wgsl"
+        }
+      ]
+    },
+    {
+      "name": "pacem-a",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "fetch-credentials"
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "href"
+        },
+        {
+          "name": "target"
+        },
+        {
+          "name": "download"
+        },
+        {
+          "name": "router"
+        }
+      ]
+    },
+    {
+      "name": "pacem-adapter",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "pausable",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "interval"
+        },
+        {
+          "name": "orientation"
+        },
+        {
+          "name": "interactive",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "swipe-enabled",
+          "description": "Gets or sets whether swipe gesture is enabled for navigation (also depends on the 'interactive' flag being set to 'true')",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "deselectable",
+          "description": "Gets or sets whether swipe gesture is enabled for navigation (also depends on the 'interactive' flag being set to 'true') */ @Watch({ emit: false, reflectBack: true, converter: PropertyConverters.Boolean }) swipeEnabled: boolean = true; /** Gets or sets whether, by selecting twice an item, you will de-select it and obtain an overall unselected state.",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "loop",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "label-callback"
+        }
+      ]
+    },
+    {
+      "name": "pacem-agenda",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "time"
+        }
+      ]
+    },
+    {
+      "name": "pacem-annihilator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      }
+    },
+    {
+      "name": "pacem-async-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "parameters"
+        },
+        {
+          "name": "fetch-credentials"
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "url"
+        },
+        {
+          "name": "method"
+        }
+      ]
+    },
+    {
+      "name": "pacem-audio",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-media**"
+      },
+      "attributes": [
+        {
+          "name": "src"
+        },
+        {
+          "name": "stream",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "autoplay",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "duration",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-balloon",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        },
+        {
+          "name": "options"
+        }
+      ]
+    },
+    {
+      "name": "pacem-beforeunload",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "message"
+        },
+        {
+          "name": "active",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-binary-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "pattern"
+        },
+        {
+          "name": "max-size"
+        }
+      ]
+    },
+    {
+      "name": "pacem-binder",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "from"
+        },
+        {
+          "name": "to"
+        },
+        {
+          "name": "from-anchor"
+        },
+        {
+          "name": "to-anchor"
+        },
+        {
+          "name": "from-end"
+        },
+        {
+          "name": "to-end"
+        },
+        {
+          "name": "tension"
+        },
+        {
+          "name": "color"
+        },
+        {
+          "name": "interactive",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-blade",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "open",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-body-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\nMoves its content to the document body and eventually removes it when disconnected."
+      }
+    },
+    {
+      "name": "pacem-bottom-sheet",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "open",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-bottom-sheet-handle",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "icon-glyph"
+        }
+      ]
+    },
+    {
+      "name": "pacem-broadcastchannel-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "message"
+        },
+        {
+          "name": "result",
+          "description": "@readonly"
+        },
+        {
+          "name": "channel-name"
+        },
+        {
+          "name": "autosend",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-browser-detect",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "user-agent"
+        }
+      ]
+    },
+    {
+      "name": "pacem-button",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "icon-glyph"
+        },
+        {
+          "name": "icon-url"
+        },
+        {
+          "name": "command-name"
+        },
+        {
+          "name": "command-argument"
+        },
+        {
+          "name": "confirmation-message"
+        },
+        {
+          "name": "confirmation-dialog"
+        }
+      ]
+    },
+    {
+      "name": "pacem-buttonset",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    },
+    {
+      "name": "pacem-calendar",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "date"
+        },
+        {
+          "name": "day-label-formatter",
+          "description": "Gets or sets the format for the first day of each month."
+        }
+      ]
+    },
+    {
+      "name": "pacem-calendar-daysofweek-rule",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "days"
+        }
+      ]
+    },
+    {
+      "name": "pacem-calendar-event",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "start"
+        },
+        {
+          "name": "end"
+        },
+        {
+          "name": "caption"
+        },
+        {
+          "name": "place"
+        },
+        {
+          "name": "all-day",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-calendar-month-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "month"
+        },
+        {
+          "name": "view-year"
+        }
+      ]
+    },
+    {
+      "name": "pacem-calendar-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "format"
+        },
+        {
+          "name": "disabled-ranges"
+        },
+        {
+          "name": "week-start"
+        },
+        {
+          "name": "viewmode"
+        }
+      ]
+    },
+    {
+      "name": "pacem-calendar-year-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "year"
+        },
+        {
+          "name": "view-year"
+        }
+      ]
+    },
+    {
+      "name": "pacem-carousel",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**\n\n@deprecated"
+      },
+      "attributes": [
+        {
+          "name": "interval"
+        },
+        {
+          "name": "pausable",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-char-count",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "minlength"
+        },
+        {
+          "name": "maxlength"
+        },
+        {
+          "name": "string"
+        }
+      ]
+    },
+    {
+      "name": "pacem-chart",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-charts**"
+      },
+      "attributes": [
+        {
+          "name": "type"
+        },
+        {
+          "name": "aspect-ratio",
+          "description": "Gets or sets how aspect ratio between x- and y-axis must be handled (considered only when xAxisType is `numeric`). Default is `adapt`."
+        },
+        {
+          "name": "hover-mode"
+        }
+      ]
+    },
+    {
+      "name": "pacem-chart-series",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-charts**"
+      },
+      "attributes": [
+        {
+          "name": "datasource",
+          "description": "Gets or sets the - already sorted - set of chart data items."
+        },
+        {
+          "name": "label",
+          "description": "Gets or sets the - already sorted - set of chart data items. */ @Watch({ emit: true, converter: PropertyConverters.Json }) datasource: ChartDataItem[]; /** Gets or sets the series label."
+        },
+        {
+          "name": "color"
+        },
+        {
+          "name": "datapoints",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "_ui-elements",
+          "description": "Gets or sets the - already sorted - set of chart data items. */ @Watch({ emit: true, converter: PropertyConverters.Json }) datasource: ChartDataItem[]; /** Gets or sets the series label. */ @Watch({ emit: true, converter: PropertyConverters.String }) label: string; @Watch({ emit: true, converter: PropertyConverters.String }) color: string; @Watch({ emit: true, converter: PropertyConverters.Boolean }) datapoints: boolean; get values() { return this.datasource; } /** @internal The elements that visually 'reflect' each ChartDataItem."
+        }
+      ]
+    },
+    {
+      "name": "pacem-checkbox",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "caption"
+        },
+        {
+          "name": "true-value"
+        },
+        {
+          "name": "false-value"
+        },
+        {
+          "name": "selected",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-checkbox-list",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-childform",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**\n\nFor internal use ONLY! */ @CustomElement({ tagName: P + '-childform-propagator' }) export class PacemChildFormPropagatorElement extends PacemEventTarget { @Watch({ emit: true /* mandatory twoway binding */ }) model: any; /** Entity property replicated on @see model. */ @Watch({ emit: false, converter: PropertyConverters.String, reflectBack: true }) property: string; @Watch({ emit: false }) watch: any; propertyChangedCallback(name: string, old, val, first?: boolean) { super.propertyChangedCallback(name, old, val, first); if (!first) { const prop = this.property, value = this.watch, hasPropDefined = !Utils.isNullOrEmpty(prop), hasModelDefined = !Utils.isNull(this.model); if (name === 'watch' || name === 'property' || (name === 'model' && hasPropDefined && hasModelDefined && Utils.isArray(val) && val.some(i => !(prop in i) || i[prop] !== value)) || (name === 'model' && hasPropDefined && hasModelDefined && !Utils.isArray(val) && (!(prop in val) || val[prop] !== value)) ) { this._synchronize(); } } } viewActivatedCallback() { super.viewActivatedCallback(); this._synchronize(); } private _synchronize() { const model = this.model, propagate = this.property, value = this.watch; if (Utils.isNullOrEmpty(model) || Utils.isNullOrEmpty(propagate)) { return; } if (Utils.isArray(model)) { for (let item of model) { item[propagate] = value; } // trigger change this.model = model.slice(0); } else { model[propagate] = value; // trigger change this.model = Utils.extend({}, model); } } } /** Represents a sub-form for automatic generation of editing fields for sub-entities."
+      },
+      "attributes": [
+        {
+          "name": "fetch-credentials"
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "mode"
+        },
+        {
+          "name": "lock-items",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "metadata"
+        }
+      ]
+    },
+    {
+      "name": "pacem-childform-propagator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**\n\nFor internal use ONLY!"
+      },
+      "attributes": [
+        {
+          "name": "model"
+        },
+        {
+          "name": "property",
+          "description": "Entity property replicated on @see model."
+        },
+        {
+          "name": "watch"
+        }
+      ]
+    },
+    {
+      "name": "pacem-clock",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "now"
+        }
+      ]
+    },
+    {
+      "name": "pacem-collapse",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "collapse",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "horizontal",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-color-animation",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "from"
+        },
+        {
+          "name": "to"
+        }
+      ]
+    },
+    {
+      "name": "pacem-column-chart",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-charts**"
+      },
+      "attributes": [
+        {
+          "name": "type"
+        },
+        {
+          "name": "group-width",
+          "description": "Set a value between 0 and 1, for the columns' stack/cluster horizontal size (percentage of the available space)."
+        }
+      ]
+    },
+    {
+      "name": "pacem-compare-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "operator"
+        },
+        {
+          "name": "to"
+        }
+      ]
+    },
+    {
+      "name": "pacem-console",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-logging**"
+      },
+      "attributes": [
+        {
+          "name": "configuration"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "range"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable-aligncommand",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "align"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable-execcommand",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "command"
+        },
+        {
+          "name": "argument"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable-historycommand",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "command"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable-imagecommand",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-contenteditable-linkcommand",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable-placeholder",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "datasource"
+        }
+      ]
+    },
+    {
+      "name": "pacem-contenteditable-selectable",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-contenteditable-wrapcommand",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "tagname"
+        }
+      ]
+    },
+    {
+      "name": "pacem-context-menu",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "command-argument"
+        },
+        {
+          "name": "icon",
+          "description": "@deprecated Provide your own content within the 'trigger' slot."
+        }
+      ]
+    },
+    {
+      "name": "pacem-context-menuitem-command",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "command-name"
+        },
+        {
+          "name": "caption"
+        },
+        {
+          "name": "tooltip"
+        },
+        {
+          "name": "icon-glyph"
+        },
+        {
+          "name": "button-css-class"
+        },
+        {
+          "name": "confirmation-message"
+        },
+        {
+          "name": "confirmation-dialog"
+        },
+        {
+          "name": "command-argument"
+        }
+      ]
+    },
+    {
+      "name": "pacem-context-menuitem-separator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      }
+    },
+    {
+      "name": "pacem-custom-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "is-valid",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-data",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "model"
+        },
+        {
+          "name": "persist-as"
+        },
+        {
+          "name": "debounce",
+          "description": "Debounces the model change"
+        },
+        {
+          "name": "throttle",
+          "description": "Debounces the model change */ @Watch({ emit: false, converter: PropertyConverters.Number }) debounce: number; /** Throttles the model change if debounce is > 0",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-data-item",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "value"
+        },
+        {
+          "name": "label"
+        },
+        {
+          "name": "disabled",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-datacell",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "dataitem"
+        },
+        {
+          "name": "rowindex"
+        }
+      ]
+    },
+    {
+      "name": "pacem-datacolumn",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "field"
+        },
+        {
+          "name": "label"
+        },
+        {
+          "name": "resizable",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "togglable",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "sortable",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "order"
+        },
+        {
+          "name": "format"
+        }
+      ]
+    },
+    {
+      "name": "pacem-datagrid",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "metadata"
+        },
+        {
+          "name": "options"
+        },
+        {
+          "name": "state"
+        },
+        {
+          "name": "datasource"
+        }
+      ]
+    },
+    {
+      "name": "pacem-datetime-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "date-value"
+        },
+        {
+          "name": "min"
+        },
+        {
+          "name": "max"
+        },
+        {
+          "name": "precision"
+        },
+        {
+          "name": "format"
+        }
+      ]
+    },
+    {
+      "name": "pacem-dialog",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "buttons"
+        },
+        {
+          "name": "ok-caption"
+        },
+        {
+          "name": "yes-caption"
+        },
+        {
+          "name": "no-caption"
+        },
+        {
+          "name": "cancel-caption"
+        }
+      ]
+    },
+    {
+      "name": "pacem-divider",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "orientation"
+        }
+      ]
+    },
+    {
+      "name": "pacem-dock",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\n@deprecated"
+      },
+      "attributes": [
+        {
+          "name": "mode"
+        },
+        {
+          "name": "dock",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "target"
+        },
+        {
+          "name": "delay"
+        },
+        {
+          "name": "transition-duration"
+        }
+      ]
+    },
+    {
+      "name": "pacem-drag-drop",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\nClass to whom delegate the window-relevant events (in a possible future, distopic, multi-pointer scenario) / class DragElementDelegate { constructor(initArgs: DragElementDelegateInitParams , private _logFn: (level: LogLevel, message: string, category?: string) => void) { this._dragDropper = initArgs.dragDrop; Utils.addClass(this._element = initArgs.element, PCSS + '-drag-lock'); window.addEventListener('mouseup', this._endHandler, false); window.addEventListener('touchend', this._endHandler, false); window.addEventListener('mousemove', this._moveHandler, false); document.addEventListener('wheel', this._moveHandler, false); window.addEventListener('touchmove', this._moveHandler, { capture: true, passive: false }); this._dragDropper.dropTargets.forEach(t => { t.addEventListener('mouseenter', this._enterHandler, false); t.addEventListener('mouseleave', this._leaveHandler, false); }); // is `_element` a dynamic one belonging to a repeater item? var repItem = <PacemRepeaterItem>Repeater.findItemContext(this._element, 0, null); if (repItem) { if (repItem.dom && repItem.dom.length === 1 && repItem.dom[0] === this._element) { this._repeaterItem = repItem; } this._sourceRepeater = repItem.repeater; } // this._bootstrap(initArgs.placeholder, initArgs.data); } private _dragDropper: DragDropper; private _element: DraggableElement; private _currentTarget: Element; private _currentHover: Node; private _repeaterItem: RepeaterItem; private _sourceRepeater: PacemRepeaterElement; private _started = false; // #region PRIVATE UTILS private _getLogicalData(node: Node | RepeaterItem): any { if (node instanceof RepeaterItem) return node.item; if (node instanceof HTMLElement) return node.dataset; return node; } private _getPhysicalData(node: Node): Node[] { if (node instanceof PacemRepeaterItem) return node.dom; return [node]; } private _createFloater(src: Element, origin: Point): Element { const dragger = this._dragDropper; let floater = src; if (dragger.mode != DragDataMode.Self) { floater = <HTMLElement | SVGElement>floater.cloneNode(true); CustomElementUtils.stripObservedAttributes(floater); if (floater instanceof HTMLElement || floater instanceof SVGElement) { Utils.addClass(floater, PCSS + '-drag-floater'); CustomElementUtils.findAncestorShell(this._element).appendChild(floater); floater.style.position = 'absolute'; let pos = { left: origin.x + floater.clientWidth / 2, top: origin.y - floater.clientHeight / 2 }; // if cloned the original element then preserve dimensions if (src === this._element || src.classList.contains('drag-floater-resize')) { let size = Utils.offset(this._element); floater.style.boxSizing = 'border-box'; floater.style.width = size.width + 'px'; floater.style.height = size.height + 'px'; pos = { left: size.left, top: size.top }; } // positioning floater.style.left = `${pos.left}px`; floater.style.top = `${pos.top}px`; } } if (floater instanceof HTMLElement || floater instanceof SVGElement) { floater.style.pointerEvents = 'none'; } return floater; } private _findTargetRepeaterItem(dropTarget: Element, nextSibling: Element): { repeater: PacemRepeaterElement, index: number } { var repItem = <PacemRepeaterItem>Repeater.findItemContext(nextSibling, 0, null); if (!Utils.isNull(repItem)) { return { repeater: repItem.repeater, index: repItem.index }; } else { var repeater: PacemRepeaterElement = null, index = -1; // if (dropTarget instanceof PacemRepeaterElement) repeater = dropTarget; else repeater = CustomElementUtils.findAncestorOfType(dropTarget, PacemRepeaterElement); // if (!Utils.isNull(repeater)) return { repeater: repeater, index: (repeater.datasource && repeater.datasource.length) || 0 }; } return null; } /** Finds the physical next sibling given a container and dragging event arguments. @param target Container @param args Event arguments / private _findNextSibling(target: Element, args: DragDropEventArgs): Element { var lastX: number = 0, lastY: number = 0; const children = Array.from(target.children), length = children.length; // first hit tested element const hover = document.elementFromPoint(args.currentPosition.x - Utils.scrollLeft, args.currentPosition.y - Utils.scrollTop); // hit tested sibling (to spot) let hoverElement: Element; // 1. hit tested element is the drop target (container) if (hover === target) { this._currentHover = hoverElement = args.placeholder; return hoverElement.parentElement === target ? hoverElement.nextElementSibling : null; } // loop until the parent element is the drop target var hoverSibling = hover; while (hoverSibling.parentElement != target && hoverSibling.parentElement != null) { hoverSibling = hoverSibling.parentElement; } // 2. hit tested element is the moving placeholder or is outside a drop target if (hoverSibling.parentElement != target || hoverSibling === args.placeholder) { this._currentHover = hoverElement = args.placeholder; return hoverElement.nextElementSibling; } // 3. hit tested element has changed if (hoverSibling != this._currentHover) { hoverElement = <Element>this._currentHover; const from = children.indexOf(hoverElement), to = children.indexOf(hoverSibling); this._currentHover = hoverSibling; return from > to ? hoverSibling : hoverSibling.nextElementSibling; } // 4. just return something return hoverSibling; } /** This method is computationally heavy due to forced reflow! / private _insertChild(targetContainer: Element, args: DragDropEventArgs) { const drag: Node = args.placeholder || args.element, drop: Element = args.target, nextSibling = this._findNextSibling(drop, args) ; if (drag.nextSibling != nextSibling || drag.parentElement != drop) { if (Utils.isNull(nextSibling) || nextSibling.parentElement == targetContainer) { // TODO: change logic (try to move elements around with css transforms) targetContainer.insertBefore(drag, nextSibling); this._logFn(LogLevel.Info, `Positioned before ${(nextSibling && (nextSibling.id || nextSibling.constructor.name)) || \"null\"} for drop`); } } } // #endregion private _enterHandler = (evt: Event) => { this._currentTarget = <Element>evt.target; }; private _leaveHandler = (evt: Event) => { this._currentTarget = null; }; private _bootstrap(placeholder, dataObj) { var el = this._element, dragger = this._dragDropper, origin: Point, args: DragDropEventArgs; if (!Utils.isNull(origin = GET_VAL(el, MOUSE_DOWN))) { this._started = false; DEL_VAL(el, MOUSE_DOWN); Utils.addClass(el, PCSS + '-dragging'); let style = getComputedStyle(el), initialDelta = { x: 0, y: 0 }, css = Utils.deserializeTransform(style); // initialDelta.x += css.e; initialDelta.y += css.f; // === floater (first) let floater = this._createFloater(dragger.floater || el, origin); // === placeholder (then) if (Utils.isNull(placeholder)) { switch (dragger.mode) { case DragDataMode.Alias: placeholder = <HTMLElement>el; break; case DragDataMode.Copy: placeholder = <HTMLElement>el.cloneNode(true); break; } } // add peculiar css class if (!Utils.isNull(placeholder)) { Utils.addClass(placeholder, 'drag-placeholder'); } // inside a repeater? freeze the item if (!Utils.isNull(this._repeaterItem) && !Utils.isNull(placeholder)) { CustomElementUtils.freezeObservedAttributes(placeholder); } const data = dataObj || this._getLogicalData(this._repeaterItem || el); // setup args args = { element: el, placeholder: placeholder || el, data, startTime: Date.now(), origin, initialDelta, currentPosition: origin, floater }; SET_VAL(el, DRAGGING, args); } } private _revertTrackedTarget: Element = null; private _moveHandler = (evt: MouseEvent | TouchEvent | WheelEvent) => { if (evt.type !== 'wheel') { avoidHandler(evt); } var el = this._element, dragger = this._dragDropper, currentPosition: Point, args: DragDropEventArgs = GET_VAL(el, DRAGGING); // function getCurrentPosition() { return currentPosition = currentPosition || (evt instanceof MouseEvent ? { x: evt.pageX, y: evt.pageY } : { x: evt.touches[0].pageX, y: evt.touches[0].pageY }); } // start if (!this._started) { this._logFn(LogLevel.Info, 'Dragging act started'); this._started = true; // starting from a container/drop-target? if (dragger.dropBehavior === DropBehavior.InsertChild) { var container: Element = el; do { // could have nested containers, // keep navigating up the dom tree container = container.parentElement; } while (container && dragger.dropTargets.indexOf(container) == -1); this._currentTarget = container; } dragger.dispatchEvent(new DragDropEvent(DragDropEventType.Start, DragDropEventArgsClass.fromArgs(args), {}, evt)); } // move if (!Utils.isNull(args)) { this._logFn(LogLevel.Debug, 'Dragging act ongoing'); const isMouseFlag = evt instanceof MouseEvent; //if (evt.type !== 'wheel') //    Pacem.avoidHandler(evt); Utils.addClass(CustomElementUtils.findAncestorShell(el), PCSS + '-dragging'); const pos = args.currentPosition = getCurrentPosition(); let floater = args.floater; let moveEvt = new DragDropEvent(DragDropEventType.Drag, DragDropEventArgsClass.fromArgs(args), { cancelable: true }, evt); // dispatch move event dragger.dispatchEvent(moveEvt); if (!moveEvt.defaultPrevented // obey the - eventual - canceling feedback && (floater instanceof HTMLElement || floater instanceof SVGElement)) { // move let delta = { x: moveEvt.detail.delta.x, y: moveEvt.detail.delta.y }; floater.style.transform = `translate3d(${delta.x}px, ${delta.y}px, 0)`; } // what am I over? var hover = this._currentTarget; if (!isMouseFlag && dragger.dropTargets.length > 0) { hover = document .elementsFromPoint(args.currentPosition.x - Utils.scrollLeft, args.currentPosition.y - Utils.scrollTop) .find(e => dragger.dropTargets.indexOf(e) >= 0); } // changed hover element since last time? var oldTarget = args.target; if (hover !== oldTarget) { if (!Utils.isNull(oldTarget)) { Utils.removeClass(<HTMLElement | SVGElement>oldTarget, PCSS + '-dropping'); dragger.dispatchEvent(new DragDropEvent(DragDropEventType.Out, DragDropEventArgsClass.fromArgs(args), {}, evt)); this._logFn(LogLevel.Info, `Drop area left (${(oldTarget['id'] || oldTarget.constructor.name)})`); } if (dragger.dropTargets.indexOf(hover) != -1) { args.target = hover; this._logFn(LogLevel.Info, `Drop area entering (${(args.target['id'] || args.target.constructor.name)})`); let evt0 = new DragDropEvent(DragDropEventType.Over, DragDropEventArgsClass.fromArgs(args), { cancelable: true }, evt); dragger.dispatchEvent(evt0); if (evt0.defaultPrevented) { delete args.target; } else { Utils.addClass(<HTMLElement | SVGElement>args.target, PCSS + '-dropping'); this._logFn(LogLevel.Info, `Drop area entered (${(args.target['id'] || args.target.constructor.name)})`); } } else { delete args.target; } } this._revertTrackedTarget = args.target || oldTarget; // positioning if (!Utils.isNull(args.target) && dragger.dropBehavior === DropBehavior.InsertChild) { this._insertChild(hover, args); } else // if spilling out from a drop target, avoid undesired `copy` of an element. if (Utils.isNull(args.target) && dragger.mode === DragDataMode.Copy) { const ph = args.placeholder; if (ph instanceof Element) ph.remove(); } } } private _endHandler = (evt: MouseEvent | TouchEvent) => { var el = this._element, shell = CustomElementUtils.findAncestorShell(el), dragger = this._dragDropper, args: DragDropEventArgs; if (!Utils.isNull(args = GET_VAL(el, DRAGGING))) { if (evt instanceof MouseEvent) avoidHandler(evt); // #region dispose fn let fnDispose = () => { let floater = args.floater; if (floater instanceof HTMLElement || floater instanceof SVGElement) { floater.style.pointerEvents = ''; } if (dragger.mode !== DragDataMode.Self) { args.floater.remove(); } Utils.removeClass(el, PCSS + '-dragging'); Utils.removeClass(el, PCSS + '-drag-lock'); DEL_VAL(el, DRAGGING); if (!Utils.isNull(args.placeholder)) { Utils.removeClass(<HTMLElement | SVGElement>args.placeholder, PCSS + '-dragging'); Utils.removeClass(<HTMLElement | SVGElement>args.placeholder, 'drag-placeholder'); Utils.removeClass(<HTMLElement | SVGElement>args.placeholder, PCSS + '-drag-lock'); DEL_VAL(args.placeholder, DRAGGING); } // === drop const dropping = !Utils.isNull(args.target); if (dropping) { dragger.dispatchEvent(new DragDropEvent(DragDropEventType.Drop, DragDropEventArgsClass.fromArgs(args), {}, evt)); Utils.removeClass(<HTMLElement>args.target, PCSS + '-dropping'); } // === cleanup const data = args.data, dropTargets = dragger.dropTargets, placeholder = args.placeholder, repItem = this._repeaterItem, sourceRepeater = this._sourceRepeater, isDraggingRepeaterItem = !Utils.isNull(repItem), targetRepItem = placeholder && this._findTargetRepeaterItem(args.placeholder.parentElement, args.placeholder.nextElementSibling), targetRepeater = targetRepItem && targetRepItem.repeater, isCopying = dragger.mode === DragDataMode.Copy, // is dropping onto a repeater item? // true if // - is effectively dropping onto a repeater // - AND the target repeater doesn't equal the source one when a whole repeaterItem is involved. isDroppingRepeaterItem = dropping && !Utils.isNull(targetRepeater) && !(Utils.isNull(repItem) && sourceRepeater === targetRepeater); // refresh origin datasource and, eventually, target datasource if (isDraggingRepeaterItem && !isCopying && dropping) { sourceRepeater.removeItem(repItem.index); } if (isDroppingRepeaterItem) { args.placeholder.remove(); if (targetRepeater === sourceRepeater && !isCopying) { let from = repItem.index, to = targetRepItem.index; if (to > from) { // tweak to--; } sourceRepeater.datasource.moveWithin(from, to); } else { if (!isCopying) { sourceRepeater && sourceRepeater.datasource.splice(repItem.index, 1); } targetRepeater && (targetRepeater.datasource = targetRepeater.datasource || []).splice(targetRepItem.index, 0, data); } } // Check spill behavior if (!dropping && !Utils.isNullOrEmpty(dragger.dropTargets) && dragger.spillBehavior === DropTargetMissedBehavior.Remove // if mode is 'copy' then don't remove the source && !isCopying) { if (isDraggingRepeaterItem) { sourceRepeater.datasource.splice(repItem.index, 1) } else { el.remove(); } } // === end dragger.dispatchEvent(new DragDropEvent(DragDropEventType.End, DragDropEventArgsClass.fromArgs(args), {}, evt)); // Utils.removeClass(shell, PCSS + '-dragging'); } // #endregion // animate to target position const drag = args.placeholder || args.element if (args.floater != drag) { let floater = <HTMLElement>args.floater; var m = Utils.deserializeTransform(getComputedStyle(floater)); // dropping or reverting? if (!Utils.isNull(args.target) || dragger.spillBehavior === DropTargetMissedBehavior.Revert || (dragger.dropBehavior === DropBehavior.InsertChild && dragger.spillBehavior !== DropTargetMissedBehavior.Remove)) { // overlap to placeholder const tgetPos = Utils.offset(drag), srcPos = Utils.offset(floater); floater.style.transition = 'transform .2s ease-in-out'; m = Matrix2D.translate(m, { x: tgetPos.left - srcPos.left, y: tgetPos.top - srcPos.top }); } else { floater.style.transition = 'transform .2s ease-in, opacity .2s linear'; // scale down to 0 m = Matrix2D.scale(m, 0.1); floater.style.opacity = '0'; } Utils.addAnimationEndCallback(floater, fnDispose, 300); floater.style.transform = `matrix(${m.a},${m.b},${m.c},${m.d},${m.e},${m.f})`; } else { fnDispose(); } } Utils.removeClass(el, PCSS + '-drag-lock'); // dispose this.dispose(); this._logFn(LogLevel.Info, 'Dragging act disposed'); } dispose() { this._dragDropper.dropTargets.forEach(t => { t.removeEventListener('mouseenter', this._enterHandler, false); t.removeEventListener('mouseleave', this._leaveHandler, false); }); window.removeEventListener('mouseup', this._endHandler, false); window.removeEventListener('touchend', this._endHandler, false); window.removeEventListener('mousemove', this._moveHandler, false); document.removeEventListener('wheel', this._moveHandler, false); window.removeEventListener('touchmove', this._moveHandler, { capture: true }); } } /** Pacem Drag & Drop element adapter."
+      },
+      "attributes": [
+        {
+          "name": "lock-timeout",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\"."
+        },
+        {
+          "name": "drop-targets",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\". */ @Watch({ emit: false, converter: PropertyConverters.Number }) lockTimeout: number = 100; /** Gets or sets the drop targets (array of elements)."
+        },
+        {
+          "name": "mode",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\". */ @Watch({ emit: false, converter: PropertyConverters.Number }) lockTimeout: number = 100; /** Gets or sets the drop targets (array of elements). */ @Watch({ emit: false }) dropTargets: Element[] = []; /** Gets or sets the drag mode (\"self\", \"alias\", \"copy\")."
+        },
+        {
+          "name": "floater",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\". */ @Watch({ emit: false, converter: PropertyConverters.Number }) lockTimeout: number = 100; /** Gets or sets the drop targets (array of elements). */ @Watch({ emit: false }) dropTargets: Element[] = []; /** Gets or sets the drag mode (\"self\", \"alias\", \"copy\"). */ @Watch({ emit: false, converter: PropertyConverters.String }) mode: DragDataMode = DragDataMode.Self; /** Gets or sets the floating element while dragging around."
+        },
+        {
+          "name": "drop-behavior",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\". */ @Watch({ emit: false, converter: PropertyConverters.Number }) lockTimeout: number = 100; /** Gets or sets the drop targets (array of elements). */ @Watch({ emit: false }) dropTargets: Element[] = []; /** Gets or sets the drag mode (\"self\", \"alias\", \"copy\"). */ @Watch({ emit: false, converter: PropertyConverters.String }) mode: DragDataMode = DragDataMode.Self; /** Gets or sets the floating element while dragging around. */ @Watch({ emit: false, converter: PropertyConverters.Element }) floater: Element; /** Gets or sets the drop mode (\"insert\", \"none\")."
+        },
+        {
+          "name": "spill-behavior",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\". */ @Watch({ emit: false, converter: PropertyConverters.Number }) lockTimeout: number = 100; /** Gets or sets the drop targets (array of elements). */ @Watch({ emit: false }) dropTargets: Element[] = []; /** Gets or sets the drag mode (\"self\", \"alias\", \"copy\"). */ @Watch({ emit: false, converter: PropertyConverters.String }) mode: DragDataMode = DragDataMode.Self; /** Gets or sets the floating element while dragging around. */ @Watch({ emit: false, converter: PropertyConverters.Element }) floater: Element; /** Gets or sets the drop mode (\"insert\", \"none\"). */ @Watch({ emit: false, converter: PropertyConverters.String }) dropBehavior: DropBehavior; /** Gets or sets the spill behavior (\"revert\", \"remove\", \"none\")"
+        },
+        {
+          "name": "handle-selector",
+          "description": "Gets or sets the amount of milliseconds to wait, while pressing on the draggable object, until the object itself must be considered \"locked to drag\". */ @Watch({ emit: false, converter: PropertyConverters.Number }) lockTimeout: number = 100; /** Gets or sets the drop targets (array of elements). */ @Watch({ emit: false }) dropTargets: Element[] = []; /** Gets or sets the drag mode (\"self\", \"alias\", \"copy\"). */ @Watch({ emit: false, converter: PropertyConverters.String }) mode: DragDataMode = DragDataMode.Self; /** Gets or sets the floating element while dragging around. */ @Watch({ emit: false, converter: PropertyConverters.Element }) floater: Element; /** Gets or sets the drop mode (\"insert\", \"none\"). */ @Watch({ emit: false, converter: PropertyConverters.String }) dropBehavior: DropBehavior; /** Gets or sets the spill behavior (\"revert\", \"remove\", \"none\") */ @Watch({ emit: false, converter: PropertyConverters.String }) spillBehavior: DropTargetMissedBehavior; /** Gets or sets the handle selector to be matched when starting the drop gesture."
+        }
+      ]
+    },
+    {
+      "name": "pacem-edit",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "key"
+        },
+        {
+          "name": "type"
+        },
+        {
+          "name": "target"
+        },
+        {
+          "name": "image-upload-url"
+        },
+        {
+          "name": "image-set"
+        },
+        {
+          "name": "max-image-width"
+        },
+        {
+          "name": "max-image-height"
+        },
+        {
+          "name": "allow-snapshot",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-edit-image",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "upload-url"
+        },
+        {
+          "name": "hint"
+        },
+        {
+          "name": "image-set"
+        },
+        {
+          "name": "value"
+        },
+        {
+          "name": "max-width"
+        },
+        {
+          "name": "max-height"
+        },
+        {
+          "name": "max-thumbnail-width"
+        },
+        {
+          "name": "max-thumbnail-height"
+        },
+        {
+          "name": "allow-snapshot",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-element-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      }
+    },
+    {
+      "name": "pacem-element-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\nMoves its content to the document body and eventually removes it when disconnected. */ @CustomElement({ tagName: P + '-body-proxy' }) export class PacemBodyProxyElement extends PacemTransferProxyElement { protected get proxy(): HTMLElement { return document.body; } } /** Moves its content to the closest shell and eventually removes it when disconnected. */ @CustomElement({ tagName: P + '-shell-proxy' }) export class PacemShellProxyElement extends PacemTransferProxyElement { protected get proxy(): HTMLElement { return CustomElementUtils.findAncestorShell(this); } } /** Moves its content to the provided target element."
+      },
+      "attributes": [
+        {
+          "name": "target"
+        }
+      ]
+    },
+    {
+      "name": "pacem-event-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        },
+        {
+          "name": "event"
+        },
+        {
+          "name": "capture",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-expression",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "converter"
+        }
+      ]
+    },
+    {
+      "name": "pacem-fetch",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "url"
+        },
+        {
+          "name": "method"
+        },
+        {
+          "name": "parameters"
+        },
+        {
+          "name": "headers"
+        },
+        {
+          "name": "credentials"
+        },
+        {
+          "name": "mode"
+        },
+        {
+          "name": "cache"
+        },
+        {
+          "name": "fetching",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "autofetch",
+          "description": "Gets or sets whether to trigger a fetch whenever a significant property has changed (default: true).",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "as"
+        },
+        {
+          "name": "type"
+        },
+        {
+          "name": "debounce"
+        },
+        {
+          "name": "throttle"
+        },
+        {
+          "name": "diff-by-values",
+          "description": "Gets or sets whether to trigger a fetch whenever a significant property has changed (default: true). */ @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) autofetch: boolean = true; @Watch({ emit: false, converter: PropertyConverters.String }) as: 'object' | 'text' | 'blob' | 'image'; @Watch({ emit: false, converter: PropertyConverters.String }) type: 'json' | 'raw'; @Watch({ reflectBack: true, converter: PropertyConverters.Number }) debounce: number = 100; @Watch({ emit: false, reflectBack: true, converter: PropertyConverters.Number }) throttle: boolean; /** Gets or sets whether to compare parameter and header single values prior to trigger a new fetch execution (default false).",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "result"
+        }
+      ]
+    },
+    {
+      "name": "pacem-form",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "fetcher"
+        },
+        {
+          "name": "fetch-credentials"
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "method"
+        },
+        {
+          "name": "submit-caption"
+        },
+        {
+          "name": "reset-caption"
+        },
+        {
+          "name": "valid",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "dirty",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "success",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "fail",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "entity"
+        },
+        {
+          "name": "entity-name"
+        },
+        {
+          "name": "metadata"
+        },
+        {
+          "name": "autogenerate",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "sudden-validation",
+          "description": "Gets the 'submit' and 'reset' form buttons. */ get formButtons() { return this._buttons; } #fetching: boolean = false; get fetching(): boolean { return this.#fetching; } private _keyupHandler = (evt: KeyboardEvent) => { if (evt.keyCode === /* Enter */13 // no modifiers && !evt.shiftKey && !evt.ctrlKey && !evt.altKey && !evt.metaKey) { let btn: ComponentsUI.UI.PacemButtonElement = (<HTMLElement>evt.currentTarget).querySelector(P + '-button[type=submit]'); if (!Utils.isNull(btn) && Utils.isVisible(btn) && !btn.disabled) { btn.click(); } } }; private _submit = (fetcher: Components.PacemFetchElement, evt?: Event) => { if (!Utils.isNull(evt)) { avoidHandler(evt); } Promise.all(this._validateAllFields()).then(p => { if (p.findIndex(f => f === false) === -1) { this.submit(fetcher).then(_ => { // successful submission here this.setPristine(); }, _ => { // catch rejected/canceled }); } }); } /** Submits the form data via a provided fetcher. @param fetcher The fetching delegate. / submit(fetcher: Net.Fetcher): PromiseLike<any> { return new Promise<any>((resolve, reject) => { if (Utils.isNull(fetcher)) { reject(`Fetcher cannot be null while submitting a form.`); } this._submitInternally(fetcher).then(result => { this.dispatchEvent(new CustomEvent(\"success\", { detail: result })); resolve(result); }, err => { if (err !== SUBMIT_CANCELLATION_TOKEN) { this.dispatchEvent(new CustomEvent(\"fail\", { detail: err })); } reject(err); }); }); } /** Resets the form to its pristine values. */ reset() { this._reset(); } private _submitInternally(fetcher: Net.Fetcher, args?: FormSubmitEventArgs): PromiseLike<any> { if (Utils.isNull(fetcher)) throw `Fetcher cannot be null while submitting a form.`; var deferred = DeferPromise.defer(); const entity = this.entity, entityName = this.entityName; var model = {}; if (!Utils.isNullOrEmpty(entityName)) { model[entityName] = entity; } else { model = entity; } var args: FormSubmitEventArgs = { parameters: model, fields: this._getAllFields() }; // allow to inject some logic while submitting... var submitEvt = new FormSubmitEvent(args); this.dispatchEvent(submitEvt); if (submitEvt.defaultPrevented) { // rejection using `false` identifies a canceled submission. deferred.reject(SUBMIT_CANCELLATION_TOKEN); } else { // ...use the output parameters fetcher.parameters = Utils.extend({}, submitEvt.detail.parameters); // a) fetcher 'success' event listener const fnSuccess = (evt: CustomEvent<Response>) => { fetcher.removeEventListener(Net.FetchSuccessEventName, fnSuccess, false); fetcher.removeEventListener(Net.FetchErrorEventName, fnError, false); const r = evt.detail, empty = Net.Fetcher.isEmpty(r); if (empty) { // if no content gets fetched (e.g. '204') then resolve right here (because it won't enter 'fnResult') fetcher.removeEventListener(Net.FetchResultEventName, fnResult, false); this.success = true; deferred.resolve({}); } switch (r.status) { case 205 /*'Reset Content'*/: this._reset(); break; } }; // b) fetcher 'fetchresult' event listener const fnResult = (evt: CustomEvent) => { // remove listeners (others have already been removed in 'fnSuccess') fetcher.removeEventListener(Net.FetchResultEventName, fnResult, false); // var result = evt.detail; if (typeof (result) === 'object' && (<object>result).hasOwnProperty('success')) { // DEPRECATED code branch if (result.success === true) { this.success = true; deferred.resolve(result.result || {}); } else { this.fail = true; deferred.reject(result.error); } } else { this.success = true; deferred.resolve(result); } }; // c) fetcher 'error' event listener const fnError = (evt: CustomEvent) => { // remove listeners fetcher.removeEventListener(Net.FetchSuccessEventName, fnSuccess, false); fetcher.removeEventListener(Net.FetchResultEventName, fnResult, false); fetcher.removeEventListener(Net.FetchErrorEventName, fnError, false); this.fail = true; const response = evt.detail; deferred.reject(response); }; // fetcher propertychange event listener const fnPropChange = (evt: PropertyChangeEvent) => { switch (evt.detail.propertyName) { case 'fetching': if (evt.detail.currentValue === true) { Utils.addClass(this, PCSS + '-fetching'); this.#fetching = true; this.dispatchEvent(new PropertyChangeEvent({ currentValue: true, oldValue: false, propertyName: 'fetching' })); } else { this.#fetching = false; this.dispatchEvent(new PropertyChangeEvent({ currentValue: false, oldValue: true, propertyName: 'fetching' })); Utils.removeClass(this, PCSS + '-fetching'); fetcher.removeEventListener(PropertyChangeEventName, fnPropChange, false); } break; } }; fetcher.addEventListener(PropertyChangeEventName, fnPropChange, false); fetcher.addEventListener(Net.FetchSuccessEventName, fnSuccess, false); fetcher.addEventListener(Net.FetchResultEventName, fnResult, false); fetcher.addEventListener(Net.FetchErrorEventName, fnError, false); if (!Utils.isNullOrEmpty(this.action)) { fetcher.url = this.action; } // is it an 'inert' PacemFetchElement? if (fetcher instanceof Components.PacemFetchElement && !fetcher.autofetch) { fetcher.fetch(); } this.success = this.fail = false; } // return deferred.promise; } private _getAllFields(accumulator: { [name: string]: PacemModel } = {}) { Utils.extend(accumulator, this._fields); for (var form of this._subForms) { form._getAllFields(accumulator); } return accumulator; } private _reset = (evt?: Event) => { if (!Utils.isNull(evt)) avoidHandler(evt); var resetEvt = new FormResetEvent(); this.dispatchEvent(resetEvt); if (resetEvt.defaultPrevented) { return; } // reset // fields first for (var field in this._fields) { var fld = this._fields[field]; if (fld instanceof PacemModelElement) fld.reset(); } // then sub-forms for (var form of this._subForms) { form._reset(); } }; /** Modifies the state of the current entity programmatically. */ apply(state: { [key: string]: any }) { if (Utils.isNullOrEmpty(state)) { return; } this.entity = Utils.extend({}, this.entity, state); for (let name in state) { this.setDirty(name); } } /** Sets the current form (or the fields of it having the specified names) in a pristine state. */ setPristine(...names: string[]) { this._setAs(false, ...names); } /** Sets the current form (or the fields of it having the specified names) in a dirty state. */ setDirty(...names: string[]) { this._setAs(true, ...names); } private _setAs(dirty: boolean, ...names: string[]) { const hasNames = !Utils.isEmpty(names); for (let field in this._fields) { if (!hasNames || names.indexOf(field) >= 0) { const fld = this._fields[field]; if (fld instanceof PacemModelElement) { dirty ? fld.setDirty() : fld.setPristine(); } } } for (let form of this._subForms) { dirty ? form.setDirty(...names) : form.setPristine(...names); } } private _fields: { [name: string]: PacemModel } = {}; private _validators: { [name: string]: Validator[] } = {}; private _subForms: PacemFormElement[] = []; private _fieldPropertyChanged = (evt?: PropertyChangeEvent) => { switch (evt.detail.propertyName) { case 'value': // validate: let model = <PacemModelElement>evt.target; this._checkFieldValidity(model.name); break; case 'dirty': this._checkDirtyness(); break; case 'valid': this._checkValidity(); break; } }; private _validatorPropertyChanged = (evt?: PropertyChangeEvent) => { const validator = <PacemBaseValidatorElement>evt.target, name = validator.watch; if (evt.detail.propertyName === 'invalid') { let model = this._fields[validator.watch]; if (validator.invalid) model.valid = false; else this._checkFieldValidity(name); } else { this._checkFieldValidity(name); } }; private _checkFieldValidity(name): Promise<boolean | null> { if (!this.suddenValidation) { return Promise.resolve(null); } if (name in this._fields) { return this._validateField(name, false); } return Promise.resolve(false); } // @Concurrent() validate(name?: string): PromiseLike<boolean> { if (!Utils.isNullOrEmpty(name)) { return this._validateField(name, false); } else { return Promise.all(this._validateAllFields()).then(b => !b.some(b0 => b0 === false)); } } private _validateAllFields(setAsDirty = true) { const tasks: PromiseLike<boolean>[] = []; for (let field in this._fields) { tasks.push(this._validateField(field, setAsDirty)); } for (let sub of this._subForms) { Array.prototype.push.apply(tasks, sub._validateAllFields(setAsDirty)); } return tasks; } // Remove Concurrent from here, better check the closure for params in @Concurrent //@Concurrent() private _validateField(name: string, setAsDirty: boolean) { return new Promise<boolean>((resolve, _) => { var model: PacemModel = this._fields[name]; if (model) { var validators = this._validators[model.name]; if (validators && validators.length > 0) { this.log(Logging.LogLevel.Log, `Computing \"${model.name}\" validity.`); Promise.all( validators.map(v => v.validate(model.value) .then(_ => !(v.invalid = !_)) ) ) .then(results => { let valid = true; for (var result of results) { if (result === false) { valid = false; // set dirty only when not valid if (setAsDirty) { model.setDirty(); } break; } } this.log(Logging.LogLevel.Log, `Property \"${model.name}\" turns out to be ${(valid ? '' : 'not ')}valid.`); resolve(model.valid = valid); }); } else { this.log(Logging.LogLevel.Log, `Property \"${model.name}\" has no validators.`); resolve(model.valid = true); } } else { this.log(Logging.LogLevel.Log, `Property \"${name}\" has no fields in this form.`); resolve(true); } }); } // #region FORM HIERARCHY validity/dirtyness private _checkDirtyness() { let dirty = false; for (var model in this._fields) { if (this._fields[model].dirty === true) { dirty = true; break; } } if (/* still */dirty === false) { for (var form of this._subForms) { if (form.dirty) { dirty = true; break; } } } this.dirty = dirty; }; private _checkValidity() { let valid = true; for (var model in this._fields) { this.log(Logging.LogLevel.Log, `Checking \"${model}\" validity.`); if (this._fields[model].valid === false) { this.log(Logging.LogLevel.Log, `\"${model}\" is not valid.`); valid = false; break; } } if (/* still */valid === true) { for (var form of this._subForms) { if (!form.valid) { valid = false; break; } } } this.valid = valid; }; registerSubForm(form: PacemFormElement) { let arr = this._subForms; if (arr.indexOf(form) == -1) { form.addEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); arr.push(form); this._checkValidity(); this._checkDirtyness(); } } unregisterSubForm(form: PacemFormElement) { let arr = this._subForms, ndx = arr.indexOf(form); if (ndx >= 0) { form.removeEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); arr.splice(ndx, 1); this._checkValidity(); this._checkDirtyness(); } } registerField(name: string, model: PacemModel) { var container = this._fields; if (container[name] != model) { this.unregisterField(name, false); container[name] = model; this.log(Logging.LogLevel.Log, `Registering \"${name}\" field.`); if (model instanceof HTMLElement) { model.addEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); } this._checkFieldValidity(name); this._checkDirtyness(); } } unregisterField(name: string, check: boolean = true) { var container = this._fields, current = container[name]; if (current instanceof HTMLElement) { current.removeEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); } delete container[name]; if (current && check === true) { this._checkValidity(); this._checkDirtyness(); } } registerValidator(name: string, validator: Validator) { var container = this._validators[name] = this._validators[name] || [], index = container.indexOf(validator); if (index == -1) { container.push(validator); if (validator instanceof HTMLElement) { validator.addEventListener(PropertyChangeEventName, this._validatorPropertyChanged, false); } this.log(Logging.LogLevel.Log, `Calling \"${name}\" validity check after validator registration.`); // most likely, at this point, the corresponding field isn't available yet. this._checkFieldValidity(name); } } unregisterValidator(name: string, validator: Validator) { this._unregisterValidator(name, validator, true); } private _unregisterValidator(name: string, validator: Validator, check: boolean) { var container = this._validators[name] = this._validators[name] || [], index = container.indexOf(validator); if (index >= 0) { if (validator instanceof HTMLElement) { validator.removeEventListener(PropertyChangeEventName, this._validatorPropertyChanged, false); } container.splice(index, 1); if (check) { this._checkFieldValidity(name); } } } // #endregion @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) valid: boolean; @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) dirty: boolean; @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) readonly: boolean; @Watch({ converter: PropertyConverters.Boolean }) success: boolean; @Watch({ converter: PropertyConverters.Boolean }) fail: boolean; @Watch({ converter: PropertyConverters.Json }) entity: any; @Watch({ emit: false, converter: PropertyConverters.String }) entityName: string; @Watch() metadata: TypeMetadata | PropertyMetadata[]; @Watch({ emit: false, converter: PropertyConverters.Boolean }) autogenerate: boolean; /** Gets or sets whether to hint invalid fields even if still pristine (default 'true'). When 'true' - and form is autogenerated - the submit button status is tightly bound to the form valid state.",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "resettable",
+          "description": "Gets the 'submit' and 'reset' form buttons. */ get formButtons() { return this._buttons; } #fetching: boolean = false; get fetching(): boolean { return this.#fetching; } private _keyupHandler = (evt: KeyboardEvent) => { if (evt.keyCode === /* Enter */13 // no modifiers && !evt.shiftKey && !evt.ctrlKey && !evt.altKey && !evt.metaKey) { let btn: ComponentsUI.UI.PacemButtonElement = (<HTMLElement>evt.currentTarget).querySelector(P + '-button[type=submit]'); if (!Utils.isNull(btn) && Utils.isVisible(btn) && !btn.disabled) { btn.click(); } } }; private _submit = (fetcher: Components.PacemFetchElement, evt?: Event) => { if (!Utils.isNull(evt)) { avoidHandler(evt); } Promise.all(this._validateAllFields()).then(p => { if (p.findIndex(f => f === false) === -1) { this.submit(fetcher).then(_ => { // successful submission here this.setPristine(); }, _ => { // catch rejected/canceled }); } }); } /** Submits the form data via a provided fetcher. @param fetcher The fetching delegate. / submit(fetcher: Net.Fetcher): PromiseLike<any> { return new Promise<any>((resolve, reject) => { if (Utils.isNull(fetcher)) { reject(`Fetcher cannot be null while submitting a form.`); } this._submitInternally(fetcher).then(result => { this.dispatchEvent(new CustomEvent(\"success\", { detail: result })); resolve(result); }, err => { if (err !== SUBMIT_CANCELLATION_TOKEN) { this.dispatchEvent(new CustomEvent(\"fail\", { detail: err })); } reject(err); }); }); } /** Resets the form to its pristine values. */ reset() { this._reset(); } private _submitInternally(fetcher: Net.Fetcher, args?: FormSubmitEventArgs): PromiseLike<any> { if (Utils.isNull(fetcher)) throw `Fetcher cannot be null while submitting a form.`; var deferred = DeferPromise.defer(); const entity = this.entity, entityName = this.entityName; var model = {}; if (!Utils.isNullOrEmpty(entityName)) { model[entityName] = entity; } else { model = entity; } var args: FormSubmitEventArgs = { parameters: model, fields: this._getAllFields() }; // allow to inject some logic while submitting... var submitEvt = new FormSubmitEvent(args); this.dispatchEvent(submitEvt); if (submitEvt.defaultPrevented) { // rejection using `false` identifies a canceled submission. deferred.reject(SUBMIT_CANCELLATION_TOKEN); } else { // ...use the output parameters fetcher.parameters = Utils.extend({}, submitEvt.detail.parameters); // a) fetcher 'success' event listener const fnSuccess = (evt: CustomEvent<Response>) => { fetcher.removeEventListener(Net.FetchSuccessEventName, fnSuccess, false); fetcher.removeEventListener(Net.FetchErrorEventName, fnError, false); const r = evt.detail, empty = Net.Fetcher.isEmpty(r); if (empty) { // if no content gets fetched (e.g. '204') then resolve right here (because it won't enter 'fnResult') fetcher.removeEventListener(Net.FetchResultEventName, fnResult, false); this.success = true; deferred.resolve({}); } switch (r.status) { case 205 /*'Reset Content'*/: this._reset(); break; } }; // b) fetcher 'fetchresult' event listener const fnResult = (evt: CustomEvent) => { // remove listeners (others have already been removed in 'fnSuccess') fetcher.removeEventListener(Net.FetchResultEventName, fnResult, false); // var result = evt.detail; if (typeof (result) === 'object' && (<object>result).hasOwnProperty('success')) { // DEPRECATED code branch if (result.success === true) { this.success = true; deferred.resolve(result.result || {}); } else { this.fail = true; deferred.reject(result.error); } } else { this.success = true; deferred.resolve(result); } }; // c) fetcher 'error' event listener const fnError = (evt: CustomEvent) => { // remove listeners fetcher.removeEventListener(Net.FetchSuccessEventName, fnSuccess, false); fetcher.removeEventListener(Net.FetchResultEventName, fnResult, false); fetcher.removeEventListener(Net.FetchErrorEventName, fnError, false); this.fail = true; const response = evt.detail; deferred.reject(response); }; // fetcher propertychange event listener const fnPropChange = (evt: PropertyChangeEvent) => { switch (evt.detail.propertyName) { case 'fetching': if (evt.detail.currentValue === true) { Utils.addClass(this, PCSS + '-fetching'); this.#fetching = true; this.dispatchEvent(new PropertyChangeEvent({ currentValue: true, oldValue: false, propertyName: 'fetching' })); } else { this.#fetching = false; this.dispatchEvent(new PropertyChangeEvent({ currentValue: false, oldValue: true, propertyName: 'fetching' })); Utils.removeClass(this, PCSS + '-fetching'); fetcher.removeEventListener(PropertyChangeEventName, fnPropChange, false); } break; } }; fetcher.addEventListener(PropertyChangeEventName, fnPropChange, false); fetcher.addEventListener(Net.FetchSuccessEventName, fnSuccess, false); fetcher.addEventListener(Net.FetchResultEventName, fnResult, false); fetcher.addEventListener(Net.FetchErrorEventName, fnError, false); if (!Utils.isNullOrEmpty(this.action)) { fetcher.url = this.action; } // is it an 'inert' PacemFetchElement? if (fetcher instanceof Components.PacemFetchElement && !fetcher.autofetch) { fetcher.fetch(); } this.success = this.fail = false; } // return deferred.promise; } private _getAllFields(accumulator: { [name: string]: PacemModel } = {}) { Utils.extend(accumulator, this._fields); for (var form of this._subForms) { form._getAllFields(accumulator); } return accumulator; } private _reset = (evt?: Event) => { if (!Utils.isNull(evt)) avoidHandler(evt); var resetEvt = new FormResetEvent(); this.dispatchEvent(resetEvt); if (resetEvt.defaultPrevented) { return; } // reset // fields first for (var field in this._fields) { var fld = this._fields[field]; if (fld instanceof PacemModelElement) fld.reset(); } // then sub-forms for (var form of this._subForms) { form._reset(); } }; /** Modifies the state of the current entity programmatically. */ apply(state: { [key: string]: any }) { if (Utils.isNullOrEmpty(state)) { return; } this.entity = Utils.extend({}, this.entity, state); for (let name in state) { this.setDirty(name); } } /** Sets the current form (or the fields of it having the specified names) in a pristine state. */ setPristine(...names: string[]) { this._setAs(false, ...names); } /** Sets the current form (or the fields of it having the specified names) in a dirty state. */ setDirty(...names: string[]) { this._setAs(true, ...names); } private _setAs(dirty: boolean, ...names: string[]) { const hasNames = !Utils.isEmpty(names); for (let field in this._fields) { if (!hasNames || names.indexOf(field) >= 0) { const fld = this._fields[field]; if (fld instanceof PacemModelElement) { dirty ? fld.setDirty() : fld.setPristine(); } } } for (let form of this._subForms) { dirty ? form.setDirty(...names) : form.setPristine(...names); } } private _fields: { [name: string]: PacemModel } = {}; private _validators: { [name: string]: Validator[] } = {}; private _subForms: PacemFormElement[] = []; private _fieldPropertyChanged = (evt?: PropertyChangeEvent) => { switch (evt.detail.propertyName) { case 'value': // validate: let model = <PacemModelElement>evt.target; this._checkFieldValidity(model.name); break; case 'dirty': this._checkDirtyness(); break; case 'valid': this._checkValidity(); break; } }; private _validatorPropertyChanged = (evt?: PropertyChangeEvent) => { const validator = <PacemBaseValidatorElement>evt.target, name = validator.watch; if (evt.detail.propertyName === 'invalid') { let model = this._fields[validator.watch]; if (validator.invalid) model.valid = false; else this._checkFieldValidity(name); } else { this._checkFieldValidity(name); } }; private _checkFieldValidity(name): Promise<boolean | null> { if (!this.suddenValidation) { return Promise.resolve(null); } if (name in this._fields) { return this._validateField(name, false); } return Promise.resolve(false); } // @Concurrent() validate(name?: string): PromiseLike<boolean> { if (!Utils.isNullOrEmpty(name)) { return this._validateField(name, false); } else { return Promise.all(this._validateAllFields()).then(b => !b.some(b0 => b0 === false)); } } private _validateAllFields(setAsDirty = true) { const tasks: PromiseLike<boolean>[] = []; for (let field in this._fields) { tasks.push(this._validateField(field, setAsDirty)); } for (let sub of this._subForms) { Array.prototype.push.apply(tasks, sub._validateAllFields(setAsDirty)); } return tasks; } // Remove Concurrent from here, better check the closure for params in @Concurrent //@Concurrent() private _validateField(name: string, setAsDirty: boolean) { return new Promise<boolean>((resolve, _) => { var model: PacemModel = this._fields[name]; if (model) { var validators = this._validators[model.name]; if (validators && validators.length > 0) { this.log(Logging.LogLevel.Log, `Computing \"${model.name}\" validity.`); Promise.all( validators.map(v => v.validate(model.value) .then(_ => !(v.invalid = !_)) ) ) .then(results => { let valid = true; for (var result of results) { if (result === false) { valid = false; // set dirty only when not valid if (setAsDirty) { model.setDirty(); } break; } } this.log(Logging.LogLevel.Log, `Property \"${model.name}\" turns out to be ${(valid ? '' : 'not ')}valid.`); resolve(model.valid = valid); }); } else { this.log(Logging.LogLevel.Log, `Property \"${model.name}\" has no validators.`); resolve(model.valid = true); } } else { this.log(Logging.LogLevel.Log, `Property \"${name}\" has no fields in this form.`); resolve(true); } }); } // #region FORM HIERARCHY validity/dirtyness private _checkDirtyness() { let dirty = false; for (var model in this._fields) { if (this._fields[model].dirty === true) { dirty = true; break; } } if (/* still */dirty === false) { for (var form of this._subForms) { if (form.dirty) { dirty = true; break; } } } this.dirty = dirty; }; private _checkValidity() { let valid = true; for (var model in this._fields) { this.log(Logging.LogLevel.Log, `Checking \"${model}\" validity.`); if (this._fields[model].valid === false) { this.log(Logging.LogLevel.Log, `\"${model}\" is not valid.`); valid = false; break; } } if (/* still */valid === true) { for (var form of this._subForms) { if (!form.valid) { valid = false; break; } } } this.valid = valid; }; registerSubForm(form: PacemFormElement) { let arr = this._subForms; if (arr.indexOf(form) == -1) { form.addEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); arr.push(form); this._checkValidity(); this._checkDirtyness(); } } unregisterSubForm(form: PacemFormElement) { let arr = this._subForms, ndx = arr.indexOf(form); if (ndx >= 0) { form.removeEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); arr.splice(ndx, 1); this._checkValidity(); this._checkDirtyness(); } } registerField(name: string, model: PacemModel) { var container = this._fields; if (container[name] != model) { this.unregisterField(name, false); container[name] = model; this.log(Logging.LogLevel.Log, `Registering \"${name}\" field.`); if (model instanceof HTMLElement) { model.addEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); } this._checkFieldValidity(name); this._checkDirtyness(); } } unregisterField(name: string, check: boolean = true) { var container = this._fields, current = container[name]; if (current instanceof HTMLElement) { current.removeEventListener(PropertyChangeEventName, this._fieldPropertyChanged, false); } delete container[name]; if (current && check === true) { this._checkValidity(); this._checkDirtyness(); } } registerValidator(name: string, validator: Validator) { var container = this._validators[name] = this._validators[name] || [], index = container.indexOf(validator); if (index == -1) { container.push(validator); if (validator instanceof HTMLElement) { validator.addEventListener(PropertyChangeEventName, this._validatorPropertyChanged, false); } this.log(Logging.LogLevel.Log, `Calling \"${name}\" validity check after validator registration.`); // most likely, at this point, the corresponding field isn't available yet. this._checkFieldValidity(name); } } unregisterValidator(name: string, validator: Validator) { this._unregisterValidator(name, validator, true); } private _unregisterValidator(name: string, validator: Validator, check: boolean) { var container = this._validators[name] = this._validators[name] || [], index = container.indexOf(validator); if (index >= 0) { if (validator instanceof HTMLElement) { validator.removeEventListener(PropertyChangeEventName, this._validatorPropertyChanged, false); } container.splice(index, 1); if (check) { this._checkFieldValidity(name); } } } // #endregion @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) valid: boolean; @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) dirty: boolean; @Watch({ reflectBack: true, converter: PropertyConverters.Boolean }) readonly: boolean; @Watch({ converter: PropertyConverters.Boolean }) success: boolean; @Watch({ converter: PropertyConverters.Boolean }) fail: boolean; @Watch({ converter: PropertyConverters.Json }) entity: any; @Watch({ emit: false, converter: PropertyConverters.String }) entityName: string; @Watch() metadata: TypeMetadata | PropertyMetadata[]; @Watch({ emit: false, converter: PropertyConverters.Boolean }) autogenerate: boolean; /** Gets or sets whether to hint invalid fields even if still pristine (default 'true'). When 'true' - and form is autogenerated - the submit button status is tightly bound to the form valid state. */ @Watch({ converter: PropertyConverters.Boolean }) suddenValidation: boolean = true; /** Gets or sets whether the form should show - when autogenerated - the reset button.",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "action"
+        }
+      ]
+    },
+    {
+      "name": "pacem-form-field",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "metadata"
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "fetch-credentials"
+        },
+        {
+          "name": "readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "entity"
+        }
+      ]
+    },
+    {
+      "name": "pacem-fps",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-logging**"
+      }
+    },
+    {
+      "name": "pacem-fx-fancy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      },
+      "attributes": [
+        {
+          "name": "fancify",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "delay"
+        },
+        {
+          "name": "gap"
+        }
+      ]
+    },
+    {
+      "name": "pacem-fx-gradient",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        },
+        {
+          "name": "mode"
+        }
+      ]
+    },
+    {
+      "name": "pacem-fx-gradient-linear",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      },
+      "attributes": [
+        {
+          "name": "angle",
+          "description": "Angle in degrees."
+        }
+      ]
+    },
+    {
+      "name": "pacem-fx-gradient-radial",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      },
+      "attributes": [
+        {
+          "name": "shape",
+          "description": "Either 'circle' or 'ellipse' (default)."
+        },
+        {
+          "name": "center",
+          "description": "Either 'circle' or 'ellipse' (default). */ @Watch({ emit: false, converter: PropertyConverters.String }) shape: 'circle' | 'ellipse'; /** Gradient's origin in normalized coordinates."
+        },
+        {
+          "name": "size",
+          "description": "Either 'circle' or 'ellipse' (default). */ @Watch({ emit: false, converter: PropertyConverters.String }) shape: 'circle' | 'ellipse'; /** Gradient's origin in normalized coordinates. */ @Watch({ emit: false, converter: PropertyConverters.Point }) center: Point; /** Gradient's diametral size in normalized lengths, or absolute pixels (circular gradients only)."
+        }
+      ]
+    },
+    {
+      "name": "pacem-fx-gradient-stop",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      },
+      "attributes": [
+        {
+          "name": "offset"
+        },
+        {
+          "name": "color"
+        },
+        {
+          "name": "opacity"
+        }
+      ]
+    },
+    {
+      "name": "pacem-fx-hero",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      },
+      "attributes": [
+        {
+          "name": "hero",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "to"
+        },
+        {
+          "name": "from"
+        },
+        {
+          "name": "duration"
+        }
+      ]
+    },
+    {
+      "name": "pacem-fx-list",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      }
+    },
+    {
+      "name": "pacem-fx-pulse",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      }
+    },
+    {
+      "name": "pacem-fx-ripple",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-fx**"
+      }
+    },
+    {
+      "name": "pacem-gallery",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "caption-template"
+        },
+        {
+          "name": "caption-property"
+        },
+        {
+          "name": "image-property"
+        }
+      ]
+    },
+    {
+      "name": "pacem-geolocate",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "adapter"
+        },
+        {
+          "name": "map"
+        },
+        {
+          "name": "icon"
+        }
+      ]
+    },
+    {
+      "name": "pacem-headcell",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      }
+    },
+    {
+      "name": "pacem-hierarchy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "datasource"
+        },
+        {
+          "name": "value-property"
+        },
+        {
+          "name": "text-property"
+        },
+        {
+          "name": "disabled-property"
+        },
+        {
+          "name": "unlink-caption"
+        },
+        {
+          "name": "itemtemplate"
+        },
+        {
+          "name": "parents-property"
+        }
+      ]
+    },
+    {
+      "name": "pacem-history",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "state"
+        },
+        {
+          "name": "maxlength"
+        },
+        {
+          "name": "can-undo",
+          "description": "@readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "can-redo",
+          "description": "@readonly*/ @Watch({ emit: true, converter: PropertyConverters.Boolean }) canUndo: boolean; /** @readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-html-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "attr"
+        },
+        {
+          "name": "value"
+        }
+      ]
+    },
+    {
+      "name": "pacem-hub-listener",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-networking**"
+      },
+      "attributes": [
+        {
+          "name": "method",
+          "description": "The method that the listener should subscribe to."
+        },
+        {
+          "name": "stream",
+          "description": "The method that the listener should subscribe to. */ @Watch({ emit: false, converter: PropertyConverters.String }) method: string; /** Whether it is listening to a streaming hub (`true`), or not (`false`, default).",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "arguments",
+          "description": "The method that the listener should subscribe to. */ @Watch({ emit: false, converter: PropertyConverters.String }) method: string; /** Whether it is listening to a streaming hub (`true`), or not (`false`, default). */ @Watch({ emit: false, converter: PropertyConverters.Boolean }) stream: boolean; /** Method arguments."
+        }
+      ]
+    },
+    {
+      "name": "pacem-hub-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-networking**"
+      },
+      "attributes": [
+        {
+          "name": "url"
+        },
+        {
+          "name": "accesstoken"
+        },
+        {
+          "name": "connected",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-icon",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "icon"
+        }
+      ]
+    },
+    {
+      "name": "pacem-if",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "match",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-img",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "adapt"
+        },
+        {
+          "name": "src"
+        },
+        {
+          "name": "size"
+        },
+        {
+          "name": "loading",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-infinite-scroller",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "container"
+        },
+        {
+          "name": "threshold"
+        }
+      ]
+    },
+    {
+      "name": "pacem-input-chars",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "char-count"
+        },
+        {
+          "name": "input-transform"
+        }
+      ]
+    },
+    {
+      "name": "pacem-input-color",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-email",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-hidden",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-image",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "upload-url"
+        },
+        {
+          "name": "image-set"
+        },
+        {
+          "name": "max-width"
+        },
+        {
+          "name": "max-height"
+        },
+        {
+          "name": "max-thumbnail-width"
+        },
+        {
+          "name": "max-thumbnail-height"
+        },
+        {
+          "name": "allow-snapshot",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-input-number",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "format"
+        }
+      ]
+    },
+    {
+      "name": "pacem-input-password",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-search",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-tel",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-text",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-input-url",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-latlng",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "options"
+        }
+      ]
+    },
+    {
+      "name": "pacem-layout-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "attr"
+        },
+        {
+          "name": "value"
+        }
+      ]
+    },
+    {
+      "name": "pacem-length-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "min"
+        },
+        {
+          "name": "max"
+        }
+      ]
+    },
+    {
+      "name": "pacem-lightbox",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "show",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "modal",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "behavior"
+        }
+      ]
+    },
+    {
+      "name": "pacem-loader",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "active",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "type"
+        }
+      ]
+    },
+    {
+      "name": "pacem-map-adapter-azure",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-maps**"
+      },
+      "attributes": [
+        {
+          "name": "subscription-key"
+        },
+        {
+          "name": "language"
+        }
+      ]
+    },
+    {
+      "name": "pacem-map-adapter-google",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-maps**"
+      },
+      "attributes": [
+        {
+          "name": "api-key"
+        },
+        {
+          "name": "version"
+        },
+        {
+          "name": "language"
+        },
+        {
+          "name": "region"
+        },
+        {
+          "name": "default-options"
+        },
+        {
+          "name": "libraries"
+        }
+      ]
+    },
+    {
+      "name": "pacem-map-adapter-leaflet",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-maps**"
+      },
+      "attributes": [
+        {
+          "name": "tiles"
+        },
+        {
+          "name": "attribution"
+        }
+      ]
+    },
+    {
+      "name": "pacem-map-geolocate",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-maps**"
+      },
+      "attributes": [
+        {
+          "name": "position"
+        },
+        {
+          "name": "permission"
+        },
+        {
+          "name": "maximum-age"
+        },
+        {
+          "name": "timeout"
+        }
+      ]
+    },
+    {
+      "name": "pacem-markdown",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "value"
+        }
+      ]
+    },
+    {
+      "name": "pacem-marquee",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "speed",
+          "description": "seconds per 1920px"
+        }
+      ]
+    },
+    {
+      "name": "pacem-media-query",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "query"
+        },
+        {
+          "name": "is-match",
+          "description": "@readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-media-recorder",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-media**"
+      },
+      "attributes": [
+        {
+          "name": "source"
+        },
+        {
+          "name": "fps"
+        },
+        {
+          "name": "mime-type"
+        },
+        {
+          "name": "audio-bits-per-second"
+        },
+        {
+          "name": "video-bits-per-second"
+        },
+        {
+          "name": "state"
+        },
+        {
+          "name": "output"
+        }
+      ]
+    },
+    {
+      "name": "pacem-menu",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "open",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "hide-hamburger-button",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "hide-back-button",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "outset",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "synchronize-shell",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-menu-cursor",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    },
+    {
+      "name": "pacem-meta-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "name"
+        },
+        {
+          "name": "itemprop"
+        },
+        {
+          "name": "content"
+        }
+      ]
+    },
+    {
+      "name": "pacem-modal-form",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "sudden-validation",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "ok-caption"
+        },
+        {
+          "name": "cancel-caption"
+        },
+        {
+          "name": "method"
+        },
+        {
+          "name": "metadata"
+        },
+        {
+          "name": "action"
+        },
+        {
+          "name": "loader-type"
+        },
+        {
+          "name": "success",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "fail",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "fetch-credentials"
+        }
+      ]
+    },
+    {
+      "name": "pacem-namevalue-list",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "dictionary",
+          "description": "Gets or sets whether the names should be unique",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-number-animation",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "from"
+        },
+        {
+          "name": "to"
+        }
+      ]
+    },
+    {
+      "name": "pacem-online-status",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "online",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-pager",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "index"
+        },
+        {
+          "name": "total"
+        },
+        {
+          "name": "pages"
+        },
+        {
+          "name": "size"
+        },
+        {
+          "name": "mode"
+        }
+      ]
+    },
+    {
+      "name": "pacem-panel",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      }
+    },
+    {
+      "name": "pacem-picture",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "src"
+        },
+        {
+          "name": "current-src"
+        }
+      ]
+    },
+    {
+      "name": "pacem-picture-source",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "srcset"
+        },
+        {
+          "name": "media"
+        },
+        {
+          "name": "type"
+        }
+      ]
+    },
+    {
+      "name": "pacem-pie-chart",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-charts**"
+      },
+      "attributes": [
+        {
+          "name": "cutout",
+          "description": "Set a value between 0 and 1, for doughnut appearance."
+        },
+        {
+          "name": "target"
+        },
+        {
+          "name": "mask-based-rendering",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "slice-padding",
+          "description": "Set a value between 0 and 1, for doughnut appearance. */ @Watch({ converter: PropertyConverters.Number }) cutout: number = .0; @Watch({ converter: PropertyConverters.Element }) target: HTMLElement; @Watch({ converter: PropertyConverters.Boolean }) maskBasedRendering: boolean; /** Distance between two consecutive slices, in pixels."
+        }
+      ]
+    },
+    {
+      "name": "pacem-pie-slice",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-charts**"
+      },
+      "attributes": [
+        {
+          "name": "value"
+        },
+        {
+          "name": "label"
+        },
+        {
+          "name": "color"
+        },
+        {
+          "name": "normalized-polar-coords"
+        }
+      ]
+    },
+    {
+      "name": "pacem-point-animation",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "from"
+        },
+        {
+          "name": "to"
+        }
+      ]
+    },
+    {
+      "name": "pacem-progressbar",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "caption"
+        },
+        {
+          "name": "percentage"
+        }
+      ]
+    },
+    {
+      "name": "pacem-property-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        }
+      ]
+    },
+    {
+      "name": "pacem-radio",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "caption"
+        },
+        {
+          "name": "selected",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-radio-list",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-range-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "min"
+        },
+        {
+          "name": "max"
+        }
+      ]
+    },
+    {
+      "name": "pacem-regex-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "pattern"
+        }
+      ]
+    },
+    {
+      "name": "pacem-repeater",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\nGets the bubbling item's Event. */ get srcEvent() { return this._originalEvent; } } export class ItemCommandEvent extends ItemEvent<CommandEventArgs>{ constructor(evt: CommandEvent) { super(\"item\" + CommandEventName, evt.detail, evt); } } export class CustomItemCommandEvent extends ItemEvent<any> { constructor(evt: CommandEvent) { super(\"item\" + evt.detail.commandName.toLowerCase(), evt.detail.commandArgument, evt); } //constructor(type: string, args: any, evt: Event) { //    super(\"item\"+ type.toLowerCase(), args, evt); //} } // /** <pacem-repeater datasource=\"[{id:'first', items:['a','b','c']}, ...]\"> <ol> <li> <template> <pacem-repeater datasource={{ ^item.items }}> <template> <pacem-span text=\"{{ ^^item.id+': ': ^item.toUpperCase()  }}\"></pacem-span> </template> </pacem-repeater> </template> </li> </ol> </pacem-repeater>"
+      },
+      "attributes": [
+        {
+          "name": "datasource"
+        }
+      ]
+    },
+    {
+      "name": "pacem-required-validator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      }
+    },
+    {
+      "name": "pacem-rescale",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "handles"
+        },
+        {
+          "name": "min-width"
+        },
+        {
+          "name": "max-width"
+        },
+        {
+          "name": "min-height"
+        },
+        {
+          "name": "max-height"
+        },
+        {
+          "name": "keep-proportions",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-resize",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        },
+        {
+          "name": "watch-position",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-rotate",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "step"
+        },
+        {
+          "name": "min-rotation"
+        },
+        {
+          "name": "max-rotation"
+        },
+        {
+          "name": "center"
+        }
+      ]
+    },
+    {
+      "name": "pacem-router",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "template"
+        },
+        {
+          "name": "state"
+        },
+        {
+          "name": "path"
+        }
+      ]
+    },
+    {
+      "name": "pacem-router-hash-state",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "router"
+        },
+        {
+          "name": "default"
+        },
+        {
+          "name": "state"
+        },
+        {
+          "name": "normalized-state"
+        }
+      ]
+    },
+    {
+      "name": "pacem-schedule",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    },
+    {
+      "name": "pacem-scroll-aware",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\nManages scrolling interactions firing self-referenced ad-hoc events."
+      },
+      "attributes": [
+        {
+          "name": "target"
+        },
+        {
+          "name": "offset"
+        }
+      ]
+    },
+    {
+      "name": "pacem-search",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-plus**"
+      },
+      "attributes": [
+        {
+          "name": "datasource"
+        },
+        {
+          "name": "hint"
+        },
+        {
+          "name": "url"
+        },
+        {
+          "name": "method"
+        },
+        {
+          "name": "hint-parameter"
+        }
+      ]
+    },
+    {
+      "name": "pacem-select",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "empty-option",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-serviceworker-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "registration",
+          "description": "@readonly"
+        },
+        {
+          "name": "push-subscription",
+          "description": "@readonly */ @Watch() registration: ServiceWorkerRegistration; /** @readonly"
+        },
+        {
+          "name": "src"
+        },
+        {
+          "name": "public-key"
+        }
+      ]
+    },
+    {
+      "name": "pacem-shell-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\nMoves its content to the document body and eventually removes it when disconnected. */ @CustomElement({ tagName: P + '-body-proxy' }) export class PacemBodyProxyElement extends PacemTransferProxyElement { protected get proxy(): HTMLElement { return document.body; } } /** Moves its content to the closest shell and eventually removes it when disconnected."
+      }
+    },
+    {
+      "name": "pacem-shortcut",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "combination"
+        },
+        {
+          "name": "target"
+        }
+      ]
+    },
+    {
+      "name": "pacem-sidebar",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "open",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "synchronize-shell",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-slide",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    },
+    {
+      "name": "pacem-slider",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "min"
+        },
+        {
+          "name": "max"
+        },
+        {
+          "name": "thumb-label",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "step"
+        },
+        {
+          "name": "change-policy"
+        },
+        {
+          "name": "format"
+        }
+      ]
+    },
+    {
+      "name": "pacem-slideshow",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    },
+    {
+      "name": "pacem-snapshot",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "step"
+        },
+        {
+          "name": "width"
+        },
+        {
+          "name": "height"
+        },
+        {
+          "name": "quality"
+        }
+      ]
+    },
+    {
+      "name": "pacem-span",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "text"
+        }
+      ]
+    },
+    {
+      "name": "pacem-sse-listener",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-networking**"
+      },
+      "attributes": [
+        {
+          "name": "method",
+          "description": "The method that the listener should subscribe to."
+        }
+      ]
+    },
+    {
+      "name": "pacem-sse-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-networking**"
+      },
+      "attributes": [
+        {
+          "name": "url"
+        },
+        {
+          "name": "connected",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-sticky-header",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "threshold"
+        },
+        {
+          "name": "offset"
+        },
+        {
+          "name": "visible",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "visibility"
+        }
+      ]
+    },
+    {
+      "name": "pacem-storyboard",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "autostart",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "duration",
+          "description": "Extends or contracts the computed duration"
+        },
+        {
+          "name": "datasource"
+        }
+      ]
+    },
+    {
+      "name": "pacem-style-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "src"
+        },
+        {
+          "name": "css-text"
+        },
+        {
+          "name": "css-ready",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-suggest",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "hint"
+        },
+        {
+          "name": "max-suggestions",
+          "description": "Default: 10 (i.e. assumed `10` when not defined)"
+        },
+        {
+          "name": "allow-typing",
+          "description": "Default: 10 (i.e. assumed `10` when not defined) */ @Watch({ emit: false, converter: PropertyConverters.Number }) maxSuggestions: number; /** Default: true (i.e. assumed `true` when not defined)",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "prevent-focus",
+          "description": "Default: 10 (i.e. assumed `10` when not defined) */ @Watch({ emit: false, converter: PropertyConverters.Number }) maxSuggestions: number; /** Default: true (i.e. assumed `true` when not defined) */ @Watch({ converter: PropertyConverters.Boolean }) allowTyping: boolean; /** Relevant in a rich/plain text header dashboard, in order to avoid the editing control to lose focus.",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "itemtemplate"
+        },
+        {
+          "name": "filter-fields",
+          "description": "Default: 10 (i.e. assumed `10` when not defined) */ @Watch({ emit: false, converter: PropertyConverters.Number }) maxSuggestions: number; /** Default: true (i.e. assumed `true` when not defined) */ @Watch({ converter: PropertyConverters.Boolean }) allowTyping: boolean; /** Relevant in a rich/plain text header dashboard, in order to avoid the editing control to lose focus. */ @Watch({ emit: false, converter: PropertyConverters.Boolean }) preventFocus: boolean; @Watch({ emit: false, converter: PropertyConverters.Element }) itemtemplate: HTMLTemplateElement; /** Fields (in addition to 'textProperty') used to filter the datasource"
+        },
+        {
+          "name": "allow-new",
+          "description": "Default: 10 (i.e. assumed `10` when not defined) */ @Watch({ emit: false, converter: PropertyConverters.Number }) maxSuggestions: number; /** Default: true (i.e. assumed `true` when not defined) */ @Watch({ converter: PropertyConverters.Boolean }) allowTyping: boolean; /** Relevant in a rich/plain text header dashboard, in order to avoid the editing control to lose focus. */ @Watch({ emit: false, converter: PropertyConverters.Boolean }) preventFocus: boolean; @Watch({ emit: false, converter: PropertyConverters.Element }) itemtemplate: HTMLTemplateElement; /** Fields (in addition to 'textProperty') used to filter the datasource */ @Watch({ emit: false, converter: PropertyConverters.StringArray }) filterFields: string[]; /** Whether allow or not values not available in the suggestions. If set to `true`, works only for primitive values.",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-swipe",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "snaps",
+          "description": "No return point distance on the horizontal axis (defaults to half the device screen width)."
+        },
+        {
+          "name": "direction"
+        },
+        {
+          "name": "options"
+        },
+        {
+          "name": "handle-selector",
+          "description": "No return point distance on the horizontal axis (defaults to half the device screen width). */ @Watch({ emit: false, reflectBack: true, converter: { convert: (attr, _) => attr.match(/[-+]?[\\d\\.]+/g).map(i => parseFloat(i)), convertBack: (prop, _) => (<number[]>prop)?.join(' ') } }) snaps: number[]; @Watch({ emit: false, converter: PropertyConverters.String, reflectBack: true }) direction: 'horizontal' | 'vertical'; @Watch({ emit: false, converter: PropertyConverters.Json }) options: Partial<SwipeOptions>; /** Handle selector to be matched when starting the drag gesture."
+        }
+      ]
+    },
+    {
+      "name": "pacem-tab",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "label"
+        },
+        {
+          "name": "key"
+        }
+      ]
+    },
+    {
+      "name": "pacem-tabs",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "orientation",
+          "description": "Gets or sets the orientation of the default tabs adapter."
+        }
+      ]
+    },
+    {
+      "name": "pacem-tag",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "tag"
+        },
+        {
+          "name": "readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-tags",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "hint"
+        },
+        {
+          "name": "allow-duplicates",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "allow-new",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-template-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        }
+      ]
+    },
+    {
+      "name": "pacem-text",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "text",
+          "description": "Gets or sets the plain text to display."
+        }
+      ]
+    },
+    {
+      "name": "pacem-textarea",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "rows"
+        },
+        {
+          "name": "cols"
+        }
+      ]
+    },
+    {
+      "name": "pacem-textarea-markdown",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**"
+      },
+      "attributes": [
+        {
+          "name": "rows"
+        },
+        {
+          "name": "cols"
+        }
+      ]
+    },
+    {
+      "name": "pacem-ticker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    },
+    {
+      "name": "pacem-timer",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "interval"
+        }
+      ]
+    },
+    {
+      "name": "pacem-title-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "value"
+        }
+      ]
+    },
+    {
+      "name": "pacem-toast",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "autohide",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "timeout"
+        },
+        {
+          "name": "show",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-toc",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "selector"
+        },
+        {
+          "name": "offset"
+        },
+        {
+          "name": "target"
+        },
+        {
+          "name": "router"
+        },
+        {
+          "name": "has-content",
+          "description": "@readonly",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-tuner",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "value"
+        },
+        {
+          "name": "min"
+        },
+        {
+          "name": "max"
+        },
+        {
+          "name": "interactive",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "round"
+        }
+      ]
+    },
+    {
+      "name": "pacem-tween",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "easing"
+        },
+        {
+          "name": "from"
+        },
+        {
+          "name": "to"
+        },
+        {
+          "name": "duration"
+        },
+        {
+          "name": "delay"
+        },
+        {
+          "name": "start",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "value"
+        }
+      ]
+    },
+    {
+      "name": "pacem-tweetembed",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "tweetid"
+        }
+      ]
+    },
+    {
+      "name": "pacem-upload",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-scaffolding**\n\nPacemUploader Component"
+      },
+      "attributes": [
+        {
+          "name": "fetch-credentials"
+        },
+        {
+          "name": "fetch-headers"
+        },
+        {
+          "name": "undo-caption"
+        },
+        {
+          "name": "retry-caption"
+        },
+        {
+          "name": "clear-caption"
+        },
+        {
+          "name": "pattern"
+        },
+        {
+          "name": "url"
+        },
+        {
+          "name": "max-image-width"
+        },
+        {
+          "name": "parallelism"
+        },
+        {
+          "name": "chunk-size"
+        },
+        {
+          "name": "max-image-height"
+        },
+        {
+          "name": "max-size",
+          "description": "Gets or sets the max blob size in bytes."
+        },
+        {
+          "name": "select-mode"
+        },
+        {
+          "name": "uploading",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "size"
+        },
+        {
+          "name": "percentage"
+        },
+        {
+          "name": "complete",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "failed",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "invalid-file",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-vibrate",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "pattern"
+        }
+      ]
+    },
+    {
+      "name": "pacem-view",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "url"
+        },
+        {
+          "name": "fetching"
+        },
+        {
+          "name": "progress"
+        },
+        {
+          "name": "render-errors",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "follow-redirects",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "debounce",
+          "description": "use it to ensure animation"
+        }
+      ]
+    },
+    {
+      "name": "pacem-viewport-aware",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**\n\n@deprecated */ class PacemViewportOrchestrator { constructor(private _global: Window) { } viewports: PacemViewportAwareElement[] = []; register(vport: PacemViewportAwareElement) { const vports = this.viewports, win = this._global; if (vports.indexOf(vport) === -1) { vports.push(vport); if (vports.length === 1) { // TODO: check against overflow: 'auto' | 'scroll' elements with constrained heights/widths... win.addEventListener('resize', this._checkHandler, false); win.addEventListener('scroll', this._checkHandler, false); win.addEventListener('transitionend', this._checkHandler, false); win.addEventListener('animationend', this._checkHandler, false); } this._oncheck(); } } unregister(vport: PacemViewportAwareElement) { var ndx: number; const vports = this.viewports, win = this._global; if ((ndx = vports.indexOf(vport)) !== -1) { vports.splice(ndx, 1); if (vports.length === 0) { win.removeEventListener('resize', this._checkHandler, false); win.removeEventListener('scroll', this._checkHandler, false); win.removeEventListener('transitionend', this._checkHandler, false); win.removeEventListener('animationend', this._checkHandler, false); } this._oncheck(); } } private isElementVisible(el: Element, ignoreHorizontal: boolean) { const vportSize = Utils.windowSize; var doc = this._global.document, rect = el.getBoundingClientRect(), vWidth = vportSize.width, vHeight = vportSize.height, efp = function (x, y) { return document.elementFromPoint(x, y) }; return rect.bottom > 0 && rect.top < (0 + vHeight) && (ignoreHorizontal || (rect.left < (vWidth + 0) && rect.right > 0)); } private _checkHandler = (evt: Event) => { this._oncheck(evt); } @Debounce(100) private _oncheck(evt?: Event) { for (var el of this.viewports) { const tget = el.target || el; const newviz = this.isElementVisible(tget, el.ignoreHorizontal); if (newviz !== el.visible) { var visible = el.visible = newviz; if (visible) Utils.addClass(tget, PCSS + '-in-viewport'); else Utils.removeClass(tget, PCSS + '-in-viewport'); } } } } const ORCHESTRATOR = new PacemViewportOrchestrator(window); /** @deprecated"
+      },
+      "attributes": [
+        {
+          "name": "visible",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "target"
+        },
+        {
+          "name": "ignore-horizontal",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-webworker-proxy",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-core**"
+      },
+      "attributes": [
+        {
+          "name": "message"
+        },
+        {
+          "name": "result",
+          "description": "@readonly"
+        },
+        {
+          "name": "src"
+        },
+        {
+          "name": "autosend",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-apimanifest",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "url"
+        },
+        {
+          "name": "usecache",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "manifest"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-clock",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "interval"
+        },
+        {
+          "name": "time"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-data",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "model"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-datacolumn",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "header"
+        },
+        {
+          "name": "content"
+        },
+        {
+          "name": "content-expression"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-datacolumns",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "properties"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-datagrid",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "columns"
+        },
+        {
+          "name": "datasource"
+        },
+        {
+          "name": "datarow-metadata"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-fetch",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "manifest"
+        },
+        {
+          "name": "endpoint"
+        },
+        {
+          "name": "url"
+        },
+        {
+          "name": "method"
+        },
+        {
+          "name": "fields"
+        },
+        {
+          "name": "parameters"
+        },
+        {
+          "name": "result"
+        },
+        {
+          "name": "fetching",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "success",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "failure",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-grid",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "unit"
+        },
+        {
+          "name": "margin-top"
+        },
+        {
+          "name": "margin-bottom"
+        },
+        {
+          "name": "columns"
+        },
+        {
+          "name": "rows"
+        },
+        {
+          "name": "min-rowheight"
+        },
+        {
+          "name": "rowheight"
+        },
+        {
+          "name": "row-gap"
+        },
+        {
+          "name": "column-gap"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-picker",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**\n\nUI widget container that eases dragdrop-based enrollment into composite widgets."
+      }
+    },
+    {
+      "name": "pacem-widget-text",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "text"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-toolbar",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      },
+      "attributes": [
+        {
+          "name": "target"
+        }
+      ]
+    },
+    {
+      "name": "pacem-widget-translator",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-cms**"
+      }
+    },
+    {
+      "name": "pacem-window",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      },
+      "attributes": [
+        {
+          "name": "caption"
+        },
+        {
+          "name": "minimized",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        },
+        {
+          "name": "floating",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "pacem-window-area",
+      "description": {
+        "kind": "markdown",
+        "value": "**@pacem/pacem-ui**"
+      }
+    }
+  ]
+}