@epa-wg/custom-element-dist 0.0.24 → 0.0.26

package/dist/demo/table.xsl

@@ -0,0 +1,293 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xsl:stylesheet version="1.0"
+	xmlns="http://www.w3.org/1999/xhtml"
+	xmlns:xhtml="http://www.w3.org/1999/xhtml"
+	xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+	xmlns:func="http://exslt.org/functions"
+	xmlns:my="my://own.uri"
+	xmlns:xv="http://xmlaspect.org/XmlView"
+	xmlns:exslt="http://exslt.org/common"
+	xmlns:msxsl="urn:schemas-microsoft-com:xslt"
+	exclude-result-prefixes="xhtml exslt msxsl"
+	extension-element-prefixes="func"
+>
+	<xsl:output
+	method="html"
+	omit-xml-declaration="yes"
+	standalone="yes"
+	indent="yes"
+  />
+    <!--
+        let processor = new XSLTProcessor();  // starts the XSL processor
+        processor.setParameter(null, "baseUrl", new URL('./', import.meta.url).pathname);
+    -->
+	<xsl:param name="url" />
+	<xsl:param name="baseUrl" select="substring-before(substring-after(/processing-instruction('xml-stylesheet'),'href=&quot;'),'table.xsl&quot;')"  />
+	<xsl:param name="sort" />
+	<!-- select = "exslt:node-set($x) IE compatibility -->
+		<msxsl:script language="JScript" implements-prefix="exslt">
+			<![CDATA[
+				var dd = eval("this['node-set'] =  function (x) { return x; }");
+			]]>
+		</msxsl:script>
+
+	<xsl:variable name="sorts"	select="//xsl:sort"	/>
+
+    <func:function name="my:count-elements">
+      <func:result select="count(//*)" />
+	</func:function>
+
+	<xsl:template match="/">
+				<style>
+					body{padding:0;margin:0;}
+					table {border-collapse:collapse; width:100%; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;}
+					caption{ text-align:left; }
+					th					{background-image: linear-gradient(to bottom, #0F1FFF 0%, #AAAACC 100%); font-size:large;}
+					tr:nth-child(even)	{background-image: linear-gradient(to bottom, rgba(9, 16, 11, 0.2) 0%, rgba(90, 164, 110, 0.1) 100%);}
+					tr:nth-child(odd)	{background: rgba(255,255,255,0.2);}
+					td{font-size:small;border-bottom: none;border-top: none;}
+					th a{ color: #FFFF80; text-decoration:none; display:block;}
+					th a span{float:left;}
+					div>label, div>var{ margin-right:0.5em;}
+
+					fieldset{border-radius: 1em;border-bottom: none;border-left: none;}
+
+					/* collapse and select UI */
+					fieldset legend label{ cursor:pointer;}
+					input[type='checkbox']{ display:none;}
+
+					input[type='checkbox']:checked+fieldset{ border:2px solid red; }
+					input[type='checkbox']:checked+input+fieldset div,
+					input[type='checkbox']:checked+input+fieldset legend label.collapse i,
+					input[type='checkbox']:checked+fieldset .select i,
+					input[type='checkbox']+fieldset .collapse b,
+					input[type='checkbox']+fieldset .select b
+					{display:none; }
+
+					input[type='checkbox']:checked+input+fieldset .collapse b,
+					input[type='checkbox']+input:checked+fieldset .select b
+					{ display:inline;}
+
+					legend label{ text-shadow: -1px -1px 1px #fff, -1px 0px 1px #fff, 0px -1px 1px #fff, 1px 1px 1px #999, 0px 1px 1px #999, 1px 0px 1px #999, 1px 1px 5px #113;}
+					legend label b, legend label i{ margin-right: 0.5em; }
+				</style>
+				<xsl:variable name="sortedData">
+					<xsl:call-template name="StartSort">
+						<xsl:with-param name="data" select="*" />
+					</xsl:call-template>
+				</xsl:variable>
+				<div class="XmlViewRendered">
+					<xsl:apply-templates select="exslt:node-set($sortedData)" mode="DisplayAs"/>
+				</div>
+	</xsl:template>
+	<xsl:template match="/" priority="-20" name="BodyOnly">
+		<xsl:variable name="sortedData">
+			<xsl:call-template name="StartSort">
+				<xsl:with-param name="data" select="*" />
+			</xsl:call-template>
+		</xsl:variable>
+		<xsl:apply-templates select="exslt:node-set($sortedData)" mode="DisplayAs"/>
+	</xsl:template>
+
+<xsl:template name="StartSort">
+	<xsl:param name="data"/>
+	<xsl:param name="sortNode"/>
+	<xsl:apply-templates mode="SortData" select="$data">
+		<xsl:with-param name="sortNode" select="$sortNode" />
+	</xsl:apply-templates>
+</xsl:template>
+
+
+
+<xsl:template mode="SortData" match="*[*]" name="SortDataDefault">
+	<xsl:copy>
+		<xsl:copy-of select="@*"/>
+		<xsl:apply-templates mode="SortData" select="*">
+			<xsl:sort data-type="text" order="ascending" select="@stub-will-be-replaced"/>
+		</xsl:apply-templates>
+	</xsl:copy>
+</xsl:template>
+
+<xsl:template mode="SortData" match="*[not(*)]">
+	<xsl:copy><xsl:copy-of select="@*"/><xsl:value-of select="."/></xsl:copy>
+</xsl:template>
+
+<!-- skip XmlView injected data from sorting results -->
+<xsl:template mode="SortData"		match="*[@priority='100']" priority="300"></xsl:template>
+<xsl:template mode="DisplayAsTable" match="*[@priority='100']" priority="300"></xsl:template>
+
+	<xsl:template mode="DisplayAs"	match="*" ><!-- distinct tags, match to 1st  -->
+		<xsl:variable name="tagName" select="name()" />
+		<xsl:choose>
+			<xsl:when test="count( ../*[name()=$tagName]) != 1">
+				<xsl:apply-templates select="." mode="DisplayAsTable" />
+			</xsl:when>
+			<xsl:otherwise>
+				<xsl:apply-templates select="." mode="DisplayAsTree" />
+			</xsl:otherwise>
+		</xsl:choose>
+	</xsl:template>
+	<xsl:template mode="DisplayAs"	match="@*" >
+		<b><xsl:value-of select="name()"/></b>=<var><xsl:value-of select="."/></var>
+	</xsl:template>
+	<xsl:template mode="DisplayAsTree" match="*[not(*)]" priority="20">
+		<div><label><xsl:value-of select="name()"/></label>
+			<xsl:apply-templates select="@*" mode="DisplayAs"/>
+			<var><xsl:value-of select="."/></var>
+		</div>
+	</xsl:template>
+
+	<xsl:template mode="DisplayAsTree" match="*" >
+		<xsl:variable name="xPath"><xsl:apply-templates mode="xpath" select="."/></xsl:variable>
+		<input type="checkbox" id="collapse{$xPath}" class="collapseControl"/>
+		<input type="checkbox" id="select{$xPath}"/>
+		<fieldset>
+			<legend><label for="collapse{$xPath}" class="collapse"><b>&#9654;</b><i>&#9660;</i></label> <label for="select{$xPath}" class="select"><b>&#10004;</b><i>&#10003;</i></label> <xsl:value-of select="name()"/></legend>
+			<div>
+				<xsl:apply-templates select="." mode="DisplayContent"/>
+			</div>
+		</fieldset>
+	</xsl:template>
+	<xsl:template mode="DisplayContent" match="*">
+		<xsl:for-each select="@*|*">
+			<xsl:variable name="tagName" select="name()"/>
+
+			<xsl:if test="not(preceding-sibling::*[name()=$tagName])">
+				<xsl:apply-templates select="." mode="DisplayAs"/>
+			</xsl:if>
+		</xsl:for-each>
+		<xsl:if test="normalize-space(text()) != '' ">
+			<p><xsl:value-of select="text()"/></p>
+		</xsl:if>
+	</xsl:template>
+
+	<xsl:template match="*" mode="DisplayAsTable" >
+		<xsl:param name="childName" select="name()"/>
+		<xsl:variable name="ZZheaders" select="@*|*" />		<!-- first child attributes and its children -->
+															<!-- TODO union of unique child names as not all rows have same children set. When sorting the missing attributes changing number of columns -->
+		<xsl:variable name="collection"  select=".."/>
+		<xsl:variable name="collectionPath"><xsl:apply-templates mode="xpath" select=".."></xsl:apply-templates></xsl:variable>
+
+		<xsl:variable name="hAll">
+			<xsl:for-each select="*|@*">
+				<xsl:variable name="p"  select="name()"/>
+				<xsl:choose>
+					<xsl:when test="count(.|../@*)=count(../@*)"><xsl:element name="{$p}"><xsl:attribute name="xv" ><xsl:value-of select="$p" /></xsl:attribute></xsl:element></xsl:when>
+					<xsl:when test="count( preceding-sibling::*[name()=$p]) != 0"></xsl:when>
+					<xsl:otherwise><xsl:copy/></xsl:otherwise>
+				</xsl:choose>
+			</xsl:for-each>
+		</xsl:variable>
+		<xsl:variable name="headers" select="exslt:node-set($hAll)/*" />
+		<table border="1">
+			<caption><!-- todo collapsible -->
+				<var>
+					<xsl:attribute name="title"><xsl:value-of select="$collectionPath"/>/<xsl:value-of select="$childName"/></xsl:attribute>
+					<xsl:value-of select="$childName"/>
+				</var>
+			</caption>
+			<thead>
+				<tr>
+					<xsl:for-each select="$headers">
+						<xsl:variable name="p" ><xsl:if test="name(.)=@xv">@</xsl:if><xsl:value-of select="local-name()"/></xsl:variable>
+						<xsl:variable name="fullPath" ><xsl:value-of select="$collectionPath"/>/<xsl:value-of select="$p"/></xsl:variable>
+						<xsl:variable name ="direction"		>
+							<xsl:for-each select="$sorts">
+								<xsl:if test="@select=$p">
+									<xsl:choose>
+										<xsl:when test="@order='ascending'">&#9650;</xsl:when>
+										<xsl:when test="@order='descending'">&#9660;</xsl:when>
+										<xsl:otherwise>&#9674;</xsl:otherwise>
+									</xsl:choose>
+								</xsl:if>
+							</xsl:for-each>
+						</xsl:variable>
+						<xsl:variable name ="order"		>
+							<xsl:for-each select="$sorts">
+								<xsl:if test="@select=$p">
+									<xsl:value-of select="count(preceding-sibling::xsl:sort) "/>
+								</xsl:if>
+							</xsl:for-each>
+						</xsl:variable>
+
+						<th><a	href="#"
+								title="{$p}"
+								xv:sortpath="{$p}"
+							   ><span><xsl:value-of select="$direction"/> <sub><xsl:value-of select="$order"/> </sub></span>
+
+								<xsl:value-of select="local-name()"/>
+							</a>
+						</th>
+					</xsl:for-each>
+				</tr>
+			</thead>
+			<tbody>
+				<xsl:for-each select="../*[name()=$childName]">
+					<xsl:variable name="rowNode" select="." />
+					<tr>
+						<xsl:for-each select="$headers">
+							<xsl:variable name="key" select="name()" />
+							<td>
+								<!-- xsl:attribute name="title"><xsl:apply-templates mode="xpath" select="."></xsl:apply-templates></xsl:attribute -->
+
+								<xsl:choose>
+									<xsl:when test="count( $rowNode/*[name()=$key]) &gt; 1">
+										<xsl:apply-templates select="$rowNode/*[name()=$key][1]" mode="DisplayAsTable" />
+									</xsl:when>
+									<xsl:otherwise>
+										<xsl:apply-templates mode="DisplayContent" select="$rowNode/*[name()=$key]|$rowNode/@*[name()=$key]" />
+									</xsl:otherwise>
+								</xsl:choose>
+
+							</td>
+						</xsl:for-each>
+					</tr>
+				</xsl:for-each>
+			</tbody>
+		</table>
+	</xsl:template>
+
+	<!-- XmlAspect/XOR/XPath/Dom2XPath.xsl -->
+	<!-- Root -->
+	<xsl:template match="/" mode="xpath">
+		<xsl:text>/</xsl:text>
+	</xsl:template>
+
+	<!-- Element -->
+	<xsl:template match="*" mode="xpath">
+		<!-- Process ancestors first -->
+		<xsl:apply-templates select=".." mode="xpath"/>
+
+		<!-- Output / if not already output by the root node -->
+		<xsl:if test="../..">/</xsl:if>
+
+		<!-- Output the name of the element -->
+		<xsl:value-of select="name()"/>
+
+		<!-- Add the element's position to pinpoint the element exactly -->
+		<xsl:if test="count(../*[name() = name(current())]) > 1">
+			<xsl:text>[</xsl:text>
+			<xsl:value-of
+				select="count(preceding-sibling::*[name() = name(current())]) +1"/>
+			<xsl:text>]</xsl:text>
+		</xsl:if>
+
+		<!-- Add 'name' predicate as a hint of which element -->
+		<xsl:if test="@name">
+			<xsl:text/>[@name="<xsl:value-of select="@name"/>"]<xsl:text/>
+		</xsl:if>
+	</xsl:template>
+
+	<!-- Attribute -->
+	<xsl:template match="@*" mode="xpath">
+		<!-- Process ancestors first -->
+		<xsl:apply-templates select=".." mode="xpath"/>
+
+		<!-- Output the name of the attribute -->
+		<xsl:text/>/@<xsl:value-of select="name()"/>
+
+		<!-- Output the attribute's value as a predicate -->
+		<xsl:text/>[.="<xsl:value-of select="."/>"]<xsl:text/>
+	</xsl:template>
+
+</xsl:stylesheet>

package/dist/demo/template.xsl

@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
+    <xsl:output method="html"/>
+
+    <xsl:template match="/">
+        <xsl:apply-templates select="//attributes"/>
+    </xsl:template>
+    <xsl:template match="attributes">
+        <h3 xmlns="http://www.w3.org/1999/xhtml">
+            <xsl:value-of select="title"></xsl:value-of>
+        </h3> <!-- title is an attribute in instance
+                                                             mapped into /*/attributes/title -->
+        <xsl:if xmlns="http://www.w3.org/1999/xhtml" test="//smile">                 <!-- data-smile DCE instance attribute,
+                                                             mapped into /*/dataset/smile
+                                                             used in condition -->
+            <!-- data-smile DCE instance attribute, used as HTML -->
+            <div>Smile as:
+                <xsl:value-of select="//smile"></xsl:value-of>
+            </div>
+        </xsl:if>
+        <!-- image would not be visible in sandbox, see live demo -->
+        <img xmlns="http://www.w3.org/1999/xhtml"
+             src="https://unpkg.com/pokeapi-sprites@2.0.2/sprites/pokemon/other/dream-world/{pokemon-id}.svg"
+             alt="{title} image"/>
+        <!-- image-src and title are DCE instance attributes,
+             mapped into /*/attributes/
+             used within output attribute via curly brackets -->
+
+        <!-- `slot name=xxx` replaced with elements with `slot=xxx` attribute -->
+        <p xmlns="http://www.w3.org/1999/xhtml">
+            <xsl:value-of select="//*[@slot=&quot;description&quot;]"/>
+        </p>
+        <xsl:for-each xmlns="http://www.w3.org/1999/xhtml" select="//*[@pokemon-id]">
+            <!-- loop over payload elements with `pokemon-id` attribute -->
+            <button>
+                <img height="32"
+                     src="https://unpkg.com/pokeapi-sprites@2.0.2/sprites/pokemon/other/dream-world/{@pokemon-id}.svg"
+                     alt="{text()}"/>
+                <br/>
+                <xsl:value-of select="text()">
+                </xsl:value-of>
+            </button>
+
+        </xsl:for-each>
+    </xsl:template>
+</xsl:stylesheet>

package/dist/demo/tree.xml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<?xml-stylesheet type="text/xsl" href="tree.xsl"?>
+<div xmlns="http://www.w3.org/1999/xhtml">
+    <payload>
+        <span slot=""></span>
+        <p slot="description">Bulbasaur is a cute Pokémon born with a large seed firmly affixed to its back;
+            the seed grows in size as the Pokémon does.
+        </p>
+        <span slot=""></span>
+        <ul slot="">
+            <li pokemon-id="2">ivysaur</li>
+            <li pokemon-id="3">venusaur</li>
+        </ul>
+        <span slot=""></span>
+    </payload>
+    <attributes>
+        <title>bulbasaur</title>
+        <data-smile>👼</data-smile>
+        <pokemon-id>1</pokemon-id>
+    </attributes>
+    <dataset>
+        <smile>👼</smile>
+    </dataset>
+    <slice></slice>
+</div>

package/dist/demo/tree.xsl

@@ -0,0 +1,33 @@
+<xsl:stylesheet version="1.0"
+                xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
+    <xsl:output
+            method="html"
+            omit-xml-declaration="yes"
+            standalone="yes"
+            indent="yes"
+    />
+
+    <xsl:template match="/">
+        <xsl:apply-templates select="*"/>
+    </xsl:template>
+    <xsl:template match="*">
+        <details style="padding:0 1rem" open="open">
+            <summary>
+                <b style="color:green"><xsl:value-of select="name()"/></b>
+                <xsl:apply-templates select="@*"/>
+            </summary>
+            <xsl:value-of select="./text()"/>
+            <xsl:apply-templates select="*"/>
+        </details>
+    </xsl:template>
+    <xsl:template match="@*">
+        <code style="margin-left:1rem;color:brown"><xsl:value-of select="name()"/>="<xsl:value-of select="."/>"</code>
+    </xsl:template>
+    <xsl:template match="text()">
+            <p>
+                <xsl:value-of select="."/>
+            </p>
+    </xsl:template>
+
+
+</xsl:stylesheet>

package/dist/demo/wc-square.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 216 209.18"><defs><style>.cls-1{fill:#c2e6f1;}.cls-2{fill:#dcf1f7;}.cls-3{fill:#2d4554;}.cls-4{fill:#60cae5;}</style></defs><polygon class="cls-3" points="0 82.47 0 126.71 34.84 146.83 34.84 187.06 73.16 209.18 108 189.07 142.84 209.18 181.16 187.06 181.16 146.83 216 126.71 216 82.47 181.16 62.35 181.16 22.12 142.84 0 108 20.12 73.16 0 34.84 22.12 34.84 62.35 0 82.47"/><path class="cls-2" d="m114.33,56.69l20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0Z"/><path class="cls-2" d="m98.19,62.71h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-1" d="m48.12,66.01l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97Z"/><path class="cls-2" d="m46.18,24.66l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0s20.64-11.92,20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06Z"/><path class="cls-2" d="m115.87,24.66l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0s20.64-11.92,20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06Z"/><path class="cls-2" d="m152.65,42.59c-4.44,2.56-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0v-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92h0Z"/><path class="cls-2" d="m77.55,158.4l20.65-11.92h0c4.44-2.57,6.33-5.84,6.33-10.97v-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92c-4.44,2.57-6.33,5.84-6.33,10.97h0s0,23.84,0,23.84c0,.54.45.8.92.54Z"/><path class="cls-4" d="m146.31,134.03v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0s0-23.84,0-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97Z"/><path class="cls-4" d="m63.35,123.06h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m103.61,151.37l-20.64,11.92c-4.44,2.57-6.33,5.84-6.33,10.97h0s0,23.84,0,23.84c0,.54.45.8.92.54l20.65-11.92h0c4.44-2.57,6.33-5.84,6.33-10.97v-23.84c0-.54-.45-.8-.92-.53Z"/><path class="cls-4" d="m63.35,163.29h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m28.51,102.94h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m133.04,163.29l-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84c0,5.13,1.89,8.4,6.33,10.97h0s20.65,11.92,20.65,11.92c.47.27.92,0,.92-.54v-23.84s0,0,0,0c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m173.29,151.37l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0s0-23.84,0-23.84c0-.54-.45-.8-.92-.53Z"/><path class="cls-4" d="m209.06,91.55c0-.54-.45-.8-.92-.53l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0v-23.84Z"/><path class="cls-2" d="m149.18,117.04l20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0Z"/><path class="cls-1" d="m112.39,98.05l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0v-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54Z"/><path class="cls-1" d="m100.13,105.12c.47-.27.47-.79,0-1.06l-20.65-11.92c-4.44-2.57-8.22-2.57-12.67,0h0s-20.65,11.92-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92h0c4.44,2.57,8.22,2.57,12.67,0l20.64-11.92Z"/><path class="cls-2" d="m65.29,85.01c.47-.27.47-.79,0-1.06l-20.65-11.92c-4.44-2.57-8.22-2.57-12.67,0h0s-20.65,11.92-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92h0c4.44,2.57,8.22,2.57,12.67,0l20.64-11.92Z"/><path class="cls-1" d="m133.04,123.06l-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84c0,5.13,1.89,8.4,6.33,10.97h0s20.65,11.92,20.65,11.92c.47.27.92,0,.92-.54v-23.84s0,0,0,0c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-1" d="m184.02,96.93l20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0Z"/></svg>

package/dist/demo/xhtml-template.xhtml

@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
+<head>
+    <meta charset="UTF-8">
+    <title>template based on HTML file</title>
+</head>
+<body>
+  <b id="wave">👋</b>
+  <b id="ok">👌</b>
+  <svg id="dwc-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 216 209.18"><defs><style>.cls-1{fill:#c2e6f1;}.cls-2{fill:#dcf1f7;}.cls-3{fill:#2d4554;}.cls-4{fill:#60cae5;}</style></defs><polygon class="cls-3" points="0 82.47 0 126.71 34.84 146.83 34.84 187.06 73.16 209.18 108 189.07 142.84 209.18 181.16 187.06 181.16 146.83 216 126.71 216 82.47 181.16 62.35 181.16 22.12 142.84 0 108 20.12 73.16 0 34.84 22.12 34.84 62.35 0 82.47"/><path class="cls-2" d="m114.33,56.69l20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0Z"/><path class="cls-2" d="m98.19,62.71h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-1" d="m48.12,66.01l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97Z"/><path class="cls-2" d="m46.18,24.66l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0s20.64-11.92,20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06Z"/><path class="cls-2" d="m115.87,24.66l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0s20.64-11.92,20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06Z"/><path class="cls-2" d="m152.65,42.59c-4.44,2.56-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0v-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92h0Z"/><path class="cls-2" d="m77.55,158.4l20.65-11.92h0c4.44-2.57,6.33-5.84,6.33-10.97v-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92c-4.44,2.57-6.33,5.84-6.33,10.97h0s0,23.84,0,23.84c0,.54.45.8.92.54Z"/><path class="cls-4" d="m146.31,134.03v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0s0-23.84,0-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97Z"/><path class="cls-4" d="m63.35,123.06h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m103.61,151.37l-20.64,11.92c-4.44,2.57-6.33,5.84-6.33,10.97h0s0,23.84,0,23.84c0,.54.45.8.92.54l20.65-11.92h0c4.44-2.57,6.33-5.84,6.33-10.97v-23.84c0-.54-.45-.8-.92-.53Z"/><path class="cls-4" d="m63.35,163.29h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m28.51,102.94h0s-20.64-11.92-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84s0,0,0,0c0,5.13,1.89,8.4,6.33,10.97l20.65,11.92c.47.27.92,0,.92-.54v-23.84c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m133.04,163.29l-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84c0,5.13,1.89,8.4,6.33,10.97h0s20.65,11.92,20.65,11.92c.47.27.92,0,.92-.54v-23.84s0,0,0,0c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-4" d="m173.29,151.37l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0s0-23.84,0-23.84c0-.54-.45-.8-.92-.53Z"/><path class="cls-4" d="m209.06,91.55c0-.54-.45-.8-.92-.53l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0v-23.84Z"/><path class="cls-2" d="m149.18,117.04l20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0Z"/><path class="cls-1" d="m112.39,98.05l20.65-11.92c4.44-2.57,6.33-5.84,6.33-10.97h0v-23.84c0-.54-.45-.8-.92-.53l-20.64,11.92h0c-4.44,2.57-6.33,5.84-6.33,10.97v23.84c0,.54.45.8.92.54Z"/><path class="cls-1" d="m100.13,105.12c.47-.27.47-.79,0-1.06l-20.65-11.92c-4.44-2.57-8.22-2.57-12.67,0h0s-20.65,11.92-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92h0c4.44,2.57,8.22,2.57,12.67,0l20.64-11.92Z"/><path class="cls-2" d="m65.29,85.01c.47-.27.47-.79,0-1.06l-20.65-11.92c-4.44-2.57-8.22-2.57-12.67,0h0s-20.65,11.92-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92h0c4.44,2.57,8.22,2.57,12.67,0l20.64-11.92Z"/><path class="cls-1" d="m133.04,123.06l-20.64-11.92c-.47-.27-.92-.01-.92.53v23.84c0,5.13,1.89,8.4,6.33,10.97h0s20.65,11.92,20.65,11.92c.47.27.92,0,.92-.54v-23.84s0,0,0,0c0-5.13-1.89-8.4-6.33-10.97Z"/><path class="cls-1" d="m184.02,96.93l20.64-11.92c.47-.27.47-.79,0-1.06l-20.65-11.92h0c-4.44-2.57-8.22-2.57-12.67,0l-20.65,11.92c-.47.27-.47.79,0,1.06l20.64,11.92c4.44,2.57,8.22,2.57,12.67,0h0Z"/></svg>
+  <xsl:stylesheet
+        id="embedded-xsl"
+        version="1.0"
+        xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
+    <xsl:output
+        method="html"
+        omit-xml-declaration="yes"
+        standalone="yes"
+        indent="yes"
+    />
+
+    <xsl:template match="/">
+        <xsl:apply-templates select="*"/>
+    </xsl:template>
+    <xsl:template match="*">
+        <details style="padding:0 1rem" open="open">
+            <summary>
+                <b style="color:green"><xsl:value-of select="name()"/></b>
+                <xsl:apply-templates select="@*"/>
+            </summary>
+            <xsl:value-of select="./text()"/>
+            <xsl:apply-templates select="*"/>
+        </details>
+    </xsl:template>
+    <xsl:template match="@*">
+        <code style="margin-left:1rem;color:brown"><xsl:value-of select="name()"/>="<xsl:value-of select="."/>"</code>
+    </xsl:template>
+    <xsl:template match="text()">
+            <p>
+                <xsl:value-of select="."/>
+            </p>
+    </xsl:template>
+</xsl:stylesheet>
+</body>
+</html>

package/dist/demo/z.html

@@ -0,0 +1,62 @@
+<dce-root xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml"
+          xmlns:dce="urn:schemas-epa-wg:dce" data-dce-id="1">
+    <location-element xmlns="" slice="window-url" live="" data-dce-id="2"></location-element>
+    <table xmlns="" data-dce-id="3">
+        <tbody data-dce-id="0-1">
+        <tr data-dce-id="4">
+            <th data-dce-id="5"><h3 data-dce-id="6"> URL properties </h3></th>
+            <td data-dce-id="7">9</td>
+        </tr>
+        <tr data-dce-id="10">
+            <th data-dce-id="11">href</th>
+            <td data-dce-id="12">http://localhost:63342/custom-element/demo/a.html?_ijt=dmv0p4go000q47lg48i5im92f7&amp;_ij_reload=RELOAD_ON_SAVE</td>
+        </tr>
+        <tr data-dce-id="10-1">
+            <th data-dce-id="11">origin</th>
+            <td data-dce-id="12">http://localhost:63342</td>
+        </tr>
+        <tr data-dce-id="10-2">
+            <th data-dce-id="11">protocol</th>
+            <td data-dce-id="12">http:</td>
+        </tr>
+        <tr data-dce-id="10-3">
+            <th data-dce-id="11">host</th>
+            <td data-dce-id="12">localhost:63342</td>
+        </tr>
+        <tr data-dce-id="10-4">
+            <th data-dce-id="11">hostname</th>
+            <td data-dce-id="12">localhost</td>
+        </tr>
+        <tr data-dce-id="10-5">
+            <th data-dce-id="11">port</th>
+            <td data-dce-id="12">63342</td>
+        </tr>
+        <tr data-dce-id="10-6">
+            <th data-dce-id="11">pathname</th>
+            <td data-dce-id="12">/custom-element/demo/a.html</td>
+        </tr>
+        <tr data-dce-id="10-7">
+            <th data-dce-id="11">search</th>
+            <td data-dce-id="12">?_ijt=dmv0p4go000q47lg48i5im92f7&amp;_ij_reload=RELOAD_ON_SAVE</td>
+        </tr>
+        <tr data-dce-id="10-8">
+            <th data-dce-id="11">hash</th>
+            <td data-dce-id="12"></td>
+        </tr>
+        </tbody>
+    </table>
+    <h3 data-dce-id="9"> URL parameters </h3>
+    <table xmlns="" data-dce-id="8">
+
+        <tbody data-dce-id="0-1">
+        <tr data-dce-id="10">
+            <th data-dce-id="11">_ijt</th>
+            <td data-dce-id="12">dmv0p4go000q47lg48i5im92f7</td>
+        </tr>
+        <tr data-dce-id="10-1">
+            <th data-dce-id="11">_ij_reload</th>
+            <td data-dce-id="12">RELOAD_ON_SAVE</td>
+        </tr>
+        </tbody>
+    </table>
+</dce-root>

package/dist/demo/z.js

@@ -0,0 +1,9 @@
+    import circle from "circle";
+    import circle2 from "lib-root/circle.js";
+    console.log(circle())
+        try{
+
+            console.log(import.meta.resolve('lib-root/a.js'))
+        }catch( err ){
+            console.error(err.message)
+        }

package/dist/demo/z.xml

@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<dce-root data-dce-id="1" xmlns:dce="urn:schemas-epa-wg:dce" xmlns:xhtml="http://www.w3.org/1999/xhtml">
+    <location-element slice="window-url" data-dce-id="2"/>
+    <table data-dce-id="3">
+        <tr data-dce-id="4">
+            <th data-dce-id="5">
+                <u data-dce-id="6">URL properties</u>
+            </th>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">href</th>
+            <td data-dce-id="9">http://localhost:63342/custom-element/demo/a.html?_ijt=qca6trk5kne6eo4s4tomq4egmm&amp;_ij_reload=RELOAD_ON_SAVE</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">origin</th>
+            <td data-dce-id="9">http://localhost:63342</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">protocol</th>
+            <td data-dce-id="9">http:</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">host</th>
+            <td data-dce-id="9">localhost:63342</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">hostname</th>
+            <td data-dce-id="9">localhost</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">port</th>
+            <td data-dce-id="9">63342</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">pathname</th>
+            <td data-dce-id="9">/custom-element/demo/a.html</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">search</th>
+            <td data-dce-id="9">?_ijt=qca6trk5kne6eo4s4tomq4egmm&amp;_ij_reload=RELOAD_ON_SAVE</td>
+        </tr>
+        <tr data-dce-id="7">
+            <th data-dce-id="8">hash</th>
+            <td data-dce-id="9"/>
+        </tr>
+        <tr data-dce-id="10">
+            <th data-dce-id="11">
+                <u data-dce-id="12">URL parameters</u>
+            </th>
+        </tr>
+        <tr data-dce-id="13">
+            <th data-dce-id="14">_ijt</th>
+            <td data-dce-id="15">qca6trk5kne6eo4s4tomq4egmm</td>
+        </tr>
+        <tr data-dce-id="13">
+            <th data-dce-id="14">_ij_reload</th>
+            <td data-dce-id="15">RELOAD_ON_SAVE</td>
+        </tr>
+    </table>
+</dce-root>

package/dist/embed-1.html

@@ -1,3 +1,2 @@
 <h4>embed-1.html</h4>
-<custom-element tag="dce-embed-1" hidden data-testid="wave">🖖</custom-element>
-<dce-embed-1>?</dce-embed-1>
+<custom-element data-testid="wave"><template>🖖</template></custom-element>

package/dist/location-element-DRB7hCwA.cjs

@@ -0,0 +1 @@
+"use strict";const u=(t,e)=>t.getAttribute(e);let c;function f(){c||(c={},"back,forward,go,pushState,replaceState".split(",").forEach(t=>{c[t]=history[t],history[t]=function(...e){c[t].apply(history,e),window.dispatchEvent(new CustomEvent("dce-location",{detail:{k:t}}))}}))}const d={"location.href":t=>window.location.href=t,"location.hash":t=>window.location.hash=t,"location.assign":t=>window.location.assign(t),"location.replace":t=>window.location.replace(t),"history.pushState":t=>window.history.pushState({},"",t),"history.replaceState":t=>window.history.replaceState({},"",t)};class w extends HTMLElement{static observedAttributes=["value","slice","href","type","live","src","method"];constructor(){super();const e={},n=()=>setTimeout(r,1),r=()=>{const a=u(this,"href");a||f();const i=a?new URL(a,window.location):window.location,o={},l=new URLSearchParams(i.search);for(const s of l.keys())o[s]=l.getAll(s);const h={params:o};for(const s in i)typeof i[s]=="string"&&(h[s]=i[s]);this.value=h,this.dispatchEvent(new Event("change"))};this.sliceInit=a=>{if(this.hasAttribute("method")){const i=this.getAttribute("method"),o=this.getAttribute("src");i&&o&&(i==="location.hash"?o!==window.location.hash&&d[i]?.(o):window.location.href!==new URL(o,window.location).href&&d[i]?.(o))}return!e.listener&&this.hasAttribute("live")&&(e.listener=1,window.navigation?.addEventListener("navigate",n),window.addEventListener("popstate",n),window.addEventListener("hashchange",n),window.addEventListener("dce-location",n)),r(),a||{}},this._destroy=()=>{window.removeEventListener("popstate",n),window.removeEventListener("hashchange",n),window.removeEventListener("dce-location",n),delete e.listener}}attributeChangedCallback(e,n,r){e!=="href"&&e!=="method"&&!["method","src","href"].includes(e)||this.sliceInit&&this.sliceInit()}connectedCallback(){this.sliceInit()}disconnectedCallback(){this._destroy()}}window.customElements.define("location-element",w);exports.LocationElement=w;