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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (216) hide show
  1. package/.storybook/main.ts +2 -2
  2. package/.storybook/preview.ts +1 -1
  3. package/README.md +4 -4
  4. package/bin/vitest/vitest-browser-importmaps.mjs +20 -20
  5. package/coverage/coverage-final.json +22 -22
  6. package/coverage/index.html +26 -26
  7. package/coverage/src/custom-element/coverage.svg +1 -1
  8. package/coverage/src/custom-element/custom-element.js/coverage.svg +1 -1
  9. package/coverage/src/custom-element/custom-element.js.html +662 -380
  10. package/coverage/src/custom-element/demo/index.html +1 -1
  11. package/coverage/src/custom-element/demo/z.js.html +1 -1
  12. package/coverage/src/custom-element/http-request.js.html +12 -12
  13. package/coverage/src/custom-element/index.html +21 -21
  14. package/coverage/src/custom-element/local-storage.js.html +78 -63
  15. package/coverage/src/custom-element/location-element.js.html +4 -4
  16. package/coverage/src/custom-element/module-url.js/coverage.svg +1 -1
  17. package/coverage/src/custom-element/module-url.js.html +16 -10
  18. package/coverage/src/index.html +1 -1
  19. package/coverage/src/mocks/handlers.ts.html +1 -1
  20. package/coverage/src/mocks/index.html +1 -1
  21. package/coverage/src/stories/attributes.test.stories.ts.html +17 -11
  22. package/coverage/src/stories/coverage.svg +1 -1
  23. package/coverage/src/stories/css.test.stories.ts.html +8 -2
  24. package/coverage/src/stories/dom-merge.test.stories.ts.html +17 -11
  25. package/coverage/src/stories/external-template.test.stories.ts.html +13 -10
  26. package/coverage/src/stories/form.test.stories.ts.html +8 -2
  27. package/coverage/src/stories/http-request.stories.ts.html +1 -1
  28. package/coverage/src/stories/index.html +26 -26
  29. package/coverage/src/stories/local-storage.test.stories.ts/coverage.svg +1 -1
  30. package/coverage/src/stories/local-storage.test.stories.ts.html +106 -76
  31. package/coverage/src/stories/location-element.test.stories.ts.html +8 -2
  32. package/coverage/src/stories/module-url.test.stories.ts.html +8 -2
  33. package/coverage/src/stories/set-url.test.stories.ts.html +8 -2
  34. package/coverage/src/stories/slice-events.test.stories.ts.html +8 -2
  35. package/coverage/src/stories/slots.test.stories.ts.html +8 -2
  36. package/coverage/src/stories/testStoryBook.ts.html +12 -12
  37. package/coverage/src/stories/version-select.test.stories.ts.html +8 -2
  38. package/coverage/src/sum.ts.html +1 -1
  39. package/dist/custom-element-BOIPgtxz.js +565 -0
  40. package/dist/custom-element-CUsSENWc.cjs +97 -0
  41. package/dist/custom-element-bundle.cjs +1 -1
  42. package/dist/custom-element-bundle.js +25 -21
  43. package/dist/demo/a.svg +27 -0
  44. package/dist/demo/demo.css +6 -7
  45. package/dist/demo/external-template.html +3 -3
  46. package/dist/demo/npm-versions-demo.html +21 -8
  47. package/dist/demo/npm-versions.html +54 -25
  48. package/dist/demo/s.xml +11 -21
  49. package/dist/demo/s.xslt +16 -74
  50. package/dist/demo/s1.xslt +59 -59
  51. package/dist/demo/ss.html +24 -57
  52. package/dist/demo/z.html +33 -62
  53. package/dist/demo/z.xml +59 -59
  54. package/dist/demo/z1.html +34 -0
  55. package/dist/local-storage-78EivJ_B.cjs +1 -0
  56. package/dist/local-storage-DzmNKzgN.js +66 -0
  57. package/dist/mockServiceWorker.js +1 -1
  58. package/package.json +27 -25
  59. package/public/demo/a.svg +27 -0
  60. package/public/demo/demo.css +6 -7
  61. package/public/demo/external-template.html +3 -3
  62. package/public/demo/npm-versions-demo.html +21 -8
  63. package/public/demo/npm-versions.html +54 -25
  64. package/public/demo/s.xml +11 -21
  65. package/public/demo/s.xslt +16 -74
  66. package/public/demo/s1.xslt +59 -59
  67. package/public/demo/ss.html +24 -57
  68. package/public/demo/z.html +33 -62
  69. package/public/demo/z.xml +59 -59
  70. package/public/demo/z1.html +34 -0
  71. package/public/mockServiceWorker.js +1 -1
  72. package/src/custom-element/custom-element.js +123 -29
  73. package/src/custom-element/demo/a.svg +27 -0
  74. package/src/custom-element/demo/demo.css +6 -7
  75. package/src/custom-element/demo/external-template.html +3 -3
  76. package/src/custom-element/demo/npm-versions-demo.html +21 -8
  77. package/src/custom-element/demo/npm-versions.html +54 -25
  78. package/src/custom-element/demo/s.xml +11 -21
  79. package/src/custom-element/demo/s.xslt +16 -74
  80. package/src/custom-element/demo/s1.xslt +59 -59
  81. package/src/custom-element/demo/ss.html +24 -57
  82. package/src/custom-element/demo/z.html +33 -62
  83. package/src/custom-element/demo/z.xml +59 -59
  84. package/src/custom-element/demo/z1.html +34 -0
  85. package/src/custom-element/ide/web-types-dce.json +1 -1
  86. package/src/custom-element/ide/web-types-xsl.json +1 -1
  87. package/src/custom-element/index.html +19 -2
  88. package/src/custom-element/local-storage.js +19 -14
  89. package/src/custom-element/module-url.js +3 -2
  90. package/src/dce-social-preview.png +0 -0
  91. package/src/material/angular.css +987 -0
  92. package/src/material/components/autocomplete.html +241 -0
  93. package/src/material/components/dropdown.html +115 -0
  94. package/src/material/components/menu.html +235 -0
  95. package/src/material/components.html +109 -0
  96. package/src/material/demo.css +31 -0
  97. package/src/material/index.html +169 -0
  98. package/src/material/material.css +357 -0
  99. package/src/material/theme/README.md +18 -0
  100. package/src/material/theme/semantic.css +112 -0
  101. package/src/mocks/versions.mock.ts +8 -8
  102. package/src/stories/__screenshots__/http-request.test.ts/http-request-url-change-1.png +0 -0
  103. package/src/stories/attributes.test.stories.ts +6 -4
  104. package/src/stories/css.test.stories.ts +2 -0
  105. package/src/stories/dom-merge.test.stories.ts +11 -9
  106. package/src/stories/external-template.test.stories.ts +4 -3
  107. package/src/stories/form.test.stories.ts +2 -0
  108. package/src/stories/local-storage.test.stories.ts +63 -53
  109. package/src/stories/location-element.test.stories.ts +2 -0
  110. package/src/stories/module-url.test.stories.ts +2 -0
  111. package/src/stories/set-url.test.stories.ts +2 -0
  112. package/src/stories/slice-events.test.stories.ts +2 -0
  113. package/src/stories/slots.test.stories.ts +2 -0
  114. package/src/stories/version-select.test.stories.ts +2 -0
  115. package/src/sum.test.ts +5 -5
  116. package/src/sum.ts +3 -3
  117. package/storybook-static/assets/Color-ERTF36HU-ChyYtq0t.js +1 -0
  118. package/storybook-static/assets/Configure-CJVwFVjC.js +165 -0
  119. package/storybook-static/assets/DocsRenderer-CFRXHY34-Bz6q-OqD.js +2 -0
  120. package/storybook-static/assets/{attributes.test.stories-DIQXccHc.js → attributes.test.stories-BJBuuXgZ.js} +13 -14
  121. package/storybook-static/assets/{css.test.stories-BV2hi4CY.js → css.test.stories-pgbBc17d.js} +1 -1
  122. package/storybook-static/assets/custom-element-BDGsYgbP.js +97 -0
  123. package/storybook-static/assets/{dom-merge.test.stories-Dws0C2-g.js → dom-merge.test.stories-CXcYP_-J.js} +26 -24
  124. package/storybook-static/assets/entry-preview-C313OLrj.js +26 -0
  125. package/storybook-static/assets/{entry-preview-docs-BMKNVQXA.js → entry-preview-docs-B7ORr9w5.js} +2 -2
  126. package/storybook-static/assets/{external-template.test.stories-BHO48b0j.js → external-template.test.stories-CpJ68Ghy.js} +19 -20
  127. package/storybook-static/assets/{form.test.stories-dv9mwp24.js → form.test.stories-D35lyqd8.js} +2 -2
  128. package/storybook-static/assets/{handlers-CaCq2ZPF.js → handlers-B-OZtf2K.js} +13 -13
  129. package/storybook-static/assets/{http-request.stories-B2ke7LtS.js → http-request.stories-DccXgHyF.js} +6 -6
  130. package/storybook-static/assets/iframe-Ddc_axoC.js +2 -0
  131. package/storybook-static/assets/index-BSz1w4Gl.js +234 -0
  132. package/storybook-static/assets/index-BdcJ-iJ7.js +8 -0
  133. package/storybook-static/assets/index-CiCdFubk.js +634 -0
  134. package/storybook-static/assets/{index-Dz4OaB2k.js → index-f2MAjm2i.js} +1 -1
  135. package/storybook-static/assets/index-lY6s0fkU.js +1 -0
  136. package/storybook-static/assets/index-tfEkrhWr.js +1 -0
  137. package/storybook-static/assets/local-storage.test.stories-BY-PWhuk.js +420 -0
  138. package/storybook-static/assets/{location-element.test.stories-BiFvBop7.js → location-element.test.stories-3auBYEaU.js} +3 -3
  139. package/storybook-static/assets/{module-url.test.stories-BXoM34tX.js → module-url.test.stories-B7L9cL60.js} +6 -6
  140. package/storybook-static/assets/{preview-0Jj89qip.js → preview-BRPR-UXC.js} +1 -1
  141. package/storybook-static/assets/preview-BUQm51_C.js +52 -0
  142. package/storybook-static/assets/{preview-DB9FwMii.js → preview-BWzBA1C2.js} +1 -1
  143. package/storybook-static/assets/preview-BhhEZcNS.js +1 -0
  144. package/storybook-static/assets/preview-CcS4DQh8.js +1 -0
  145. package/storybook-static/assets/{preview-Cg7hXPRq.js → preview-CfH4_OzN.js} +2 -2
  146. package/storybook-static/assets/{preview-FpHGYA1q.js → preview-DHPc-V4N.js} +1 -1
  147. package/storybook-static/assets/preview-DYzi3Z2p.js +1 -0
  148. package/storybook-static/assets/{preview-4Up_z4Em.js → preview-caVMbCIR.js} +2 -2
  149. package/storybook-static/assets/preview-ncvtW_hb.js +34 -0
  150. package/storybook-static/assets/{set-url.test.stories-Cg5Z0r7x.js → set-url.test.stories-CuSuDLIx.js} +3 -3
  151. package/storybook-static/assets/{slice-events.test.stories-D_ttGp3g.js → slice-events.test.stories-BkRKsKem.js} +4 -4
  152. package/storybook-static/assets/{slots.test.stories-DBNXOm0T.js → slots.test.stories-BJCUWFkE.js} +8 -8
  153. package/storybook-static/assets/{version-select.test.stories-CgV3UCim.js → version-select.test.stories-B3ybJn_Z.js} +2 -2
  154. package/storybook-static/demo/a.svg +27 -0
  155. package/storybook-static/demo/demo.css +6 -7
  156. package/storybook-static/demo/external-template.html +3 -3
  157. package/storybook-static/demo/npm-versions-demo.html +21 -8
  158. package/storybook-static/demo/npm-versions.html +54 -25
  159. package/storybook-static/demo/s.xml +11 -21
  160. package/storybook-static/demo/s.xslt +16 -74
  161. package/storybook-static/demo/s1.xslt +59 -59
  162. package/storybook-static/demo/ss.html +24 -57
  163. package/storybook-static/demo/z.html +33 -62
  164. package/storybook-static/demo/z.xml +59 -59
  165. package/storybook-static/demo/z1.html +34 -0
  166. package/storybook-static/iframe.html +1 -1
  167. package/storybook-static/index.html +3 -7
  168. package/storybook-static/mockServiceWorker.js +1 -1
  169. package/storybook-static/project.json +1 -1
  170. package/storybook-static/sb-addons/essentials-actions-3/manager-bundle.js +1 -1
  171. package/storybook-static/sb-addons/essentials-backgrounds-4/manager-bundle.js +9 -9
  172. package/storybook-static/sb-addons/essentials-controls-2/manager-bundle.js +76 -94
  173. package/storybook-static/sb-addons/essentials-measure-7/manager-bundle.js +1 -1
  174. package/storybook-static/sb-addons/essentials-outline-8/manager-bundle.js +1 -1
  175. package/storybook-static/sb-addons/essentials-toolbars-6/manager-bundle.js +1 -1
  176. package/storybook-static/sb-addons/essentials-viewport-5/manager-bundle.js +1 -1
  177. package/storybook-static/sb-addons/interactions-9/manager-bundle.js +211 -0
  178. package/storybook-static/sb-addons/interactions-9/manager-bundle.js.LEGAL.txt +0 -0
  179. package/storybook-static/sb-manager/globals-module-info.js +11 -0
  180. package/storybook-static/sb-manager/globals-runtime.js +27803 -26928
  181. package/storybook-static/sb-manager/runtime.js +10341 -10136
  182. package/storybook-static/sb-preview/runtime.js +3841 -3828
  183. package/.idea/codeStyles/codeStyleConfig.xml +0 -5
  184. package/.idea/compiler.xml +0 -6
  185. package/.idea/custom-element-dist.iml +0 -13
  186. package/.idea/inspectionProfiles/Project_Default.xml +0 -6
  187. package/.idea/misc.xml +0 -6
  188. package/.idea/modules.xml +0 -8
  189. package/.idea/vcs.xml +0 -6
  190. package/.vscode/settings.json +0 -24
  191. package/dist/custom-element-CckoVsvO.cjs +0 -53
  192. package/dist/custom-element-b7c_7Kz4.js +0 -485
  193. package/dist/local-storage-Boafngui.cjs +0 -1
  194. package/dist/local-storage-BqDEu2kF.js +0 -59
  195. package/storybook-static/assets/Color-KGDBMAHA-CH-YyWYq.js +0 -1
  196. package/storybook-static/assets/Configure-DFL_bm2M.js +0 -173
  197. package/storybook-static/assets/DocsRenderer-PKQXORMH-Bz-_1hmS.js +0 -2
  198. package/storybook-static/assets/custom-element-wn23PUwN.js +0 -231
  199. package/storybook-static/assets/entry-preview-BKQ8UCxI.js +0 -8
  200. package/storybook-static/assets/iframe-D4Sos1HO.js +0 -2
  201. package/storybook-static/assets/index-BnXBQqj9.js +0 -605
  202. package/storybook-static/assets/index-C8k3Z-3Y.js +0 -28
  203. package/storybook-static/assets/index-Cpxqn5iQ.js +0 -1
  204. package/storybook-static/assets/index-DGdNYaqV.js +0 -8
  205. package/storybook-static/assets/index-sm7QlJZE.js +0 -1
  206. package/storybook-static/assets/lit-element-DzhCn-8W.js +0 -19
  207. package/storybook-static/assets/local-storage.test.stories-BpogLNq-.js +0 -419
  208. package/storybook-static/assets/preview-BJPLiuSt.js +0 -1
  209. package/storybook-static/assets/preview-BMWqy4Bi.js +0 -1
  210. package/storybook-static/assets/preview-BnWGZYux.js +0 -1
  211. package/storybook-static/assets/preview-Djh1_Tal.js +0 -20
  212. package/storybook-static/assets/preview-oHxXRSIu.js +0 -48
  213. package/storybook-static/sb-addons/chromatic-com-storybook-9/manager-bundle.js +0 -333
  214. package/storybook-static/sb-addons/chromatic-com-storybook-9/manager-bundle.js.LEGAL.txt +0 -40
  215. package/storybook-static/sb-addons/interactions-10/manager-bundle.js +0 -234
  216. /package/{storybook-static/sb-addons/interactions-10/manager-bundle.js.LEGAL.txt → src/material/guide/getting-started/index.html} +0 -0
package/storybook-static/demo/npm-versions.html CHANGED
@@ -4,6 +4,7 @@
4
4
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
5
  <title>npm-version template</title>
6
6
  <link rel="icon" href="./wc-square.svg"/>
7
+
7
8
  </head>
8
9
  <body>
9
10
 
@@ -11,28 +12,29 @@
11
12
  <a href="./npm-versions-demo.html">docs</a>
12
13
  <template id="npm-version">
13
14
  <attribute name="package-name"></attribute>
14
- <attribute name="current-version"></attribute>
15
+ <attribute name="current-version" aria-description="version to select"></attribute>
16
+ <attribute name="show-date" aria-description="set to 'true' to append the date to the version"></attribute>
15
17
  <attribute name="value" select="//selected-version"></attribute>
16
-
17
18
  <http-request
18
- url="https://registry.npmjs.org/@epa-wg/custom-element-dist"
19
+ url="https://registry.npmjs.org/{$package-name}"
19
20
  method="GET"
20
21
  header-accept="application/json"
21
22
  slice="versions-ajax"></http-request>
22
23
 
23
- <label><slot name="label">{$package-name} version:</slot>
24
+ <label>
25
+ <slot name="label"><var>{$package-name}</var> version:</slot>
24
26
  <xhtml:select slice="selected-version" autocomplete="off" name="version">
25
27
  <for-each select="//versions/*">
26
28
  <option value="{./@version}">
27
29
  <variable name="item-version">{./@version}</variable>
28
- { $item-version } - { substring( //time/*[@dce-object-name = $item-version ], 1,10)}
30
+ { $item-version }<if test="$show-date = 'true' "> - { substring( //time/*[@dce-object-name = $item-version ], 1,10)}</if>
29
31
  </option>
30
32
  </for-each>
31
33
  <for-each select="//versions/*">
32
34
  <if test="./@version = $current-version">
33
35
  <option selected value="{./@version}">
34
36
  <variable name="item-version">{./@version}</variable>
35
- { $item-version } - { substring( //time/*[@dce-object-name = $item-version ], 1,10)}
37
+ { $item-version }<if test="$show-date = 'true' "> - { substring( //time/*[@dce-object-name = $item-version ], 1,10)}</if>
36
38
  </option>
37
39
  </if>
38
40
  </for-each>
@@ -41,25 +43,52 @@
41
43
  </template>
42
44
 
43
45
  <template id="npm-version-to-url">
44
- <variable name="url" select="//window-location/value/@href"></variable>
45
- <variable name="current-version" >0{
46
- substring-before(substring-after(substring($url, string-length(substring-before($url, '/')) - string-length(substring-before(substring-before($url, '/'), '@0')) + 2), '@0'), '/')
47
- }</variable>
48
- <location-element slice="window-location" live>
49
- <if test=" not(//selected-version = $current-version ) and not(//selected-version = '') ">
50
- <attribute name="src">{ concat( substring-before($url, $current-version),
51
- //selected-version,
52
- substring-after($url, $current-version) ) }</attribute>
53
- <attribute name="method">location.href</attribute>
54
- </if>
55
- </location-element>
56
- <http-request
57
- url="https://registry.npmjs.org/@epa-wg/custom-element-dist"
58
- method="GET"
59
- header-accept="application/json"
60
- slice="versions-ajax" ></http-request>
46
+ <attribute name="package-name"></attribute>
47
+ <attribute name="value" select="//selected-version"></attribute>
48
+ <variable name="url" select="//window-location/value/@href"></variable>
49
+
50
+ <variable name="url-version">0{
51
+ substring-before(substring-after(substring($url, string-length(substring-before($url, '/')) -
52
+ string-length(substring-before(substring-before($url, '/'), '@0')) + 2), '@0'), '/')
53
+ }</variable>
61
54
 
62
- <custom-element src="#npm-version" slice="selected-version"></custom-element>
63
- </template>
55
+ <location-element slice="window-location" live>
56
+ <if test="//selected-version">
57
+ <if test=" not(//url-version = //selected-version ) ">
58
+ <attribute name="src">{ concat( substring-before($url, $url-version),
59
+ //selected-version,
60
+ substring-after($url, $url-version) ) }
61
+ </attribute>
62
+ <attribute name="method">location.href</attribute>
63
+ </if>
64
+ </if>
65
+ </location-element>
66
+
67
+ <http-request
68
+ url="https://registry.npmjs.org/{$package-name}"
69
+ method="GET"
70
+ header-accept="application/json"
71
+ slice="versions-ajax"></http-request>
72
+
73
+ <label>
74
+ <slot name="label">{$package-name} version:</slot>
75
+ <xhtml:select slice="selected-version" autocomplete="off" name="version">
76
+ <for-each select="//versions/*">
77
+ <option value="{./@version}">
78
+ <variable name="item-version">{./@version}</variable>
79
+ { $item-version } - { substring( //time/*[@dce-object-name = $item-version ], 1,10)}
80
+ </option>
81
+ </for-each>
82
+ <for-each select="//versions/*">
83
+ <if test="./@version = $url-version">
84
+ <option selected value="{./@version}">
85
+ <variable name="item-version">{./@version}</variable>
86
+ { $item-version } - { substring( //time/*[@dce-object-name = $item-version ], 1,10)}
87
+ </option>
88
+ </if>
89
+ </for-each>
90
+ </xhtml:select>
91
+ </label>
92
+ </template>
64
93
  </body>
65
94
  </html>
package/storybook-static/demo/s.xml CHANGED
@@ -1,28 +1,18 @@
1
1
  <?xml version="1.0" encoding="UTF-8"?>
2
2
  <datadom>
3
3
  <payload xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml">
4
- <span xmlns="http://www.w3.org/1999/xhtml" slot=""></span>
5
- <npm-version xmlns="http://www.w3.org/1999/xhtml" slice="selected-version" package-name="@epa-wg/custom-element"
6
- slot=""></npm-version>
7
- <span xmlns="http://www.w3.org/1999/xhtml" slot=""></span>
8
- <p xmlns="http://www.w3.org/1999/xhtml" slot="">
9
- <code>selected-version</code>
10
- slice: {//selected-version}
11
- </p>
12
- <span xmlns="http://www.w3.org/1999/xhtml" slot=""></span>
4
+ <a xmlns="http://www.w3.org/1999/xhtml" href="#" data-dce-id="4" slot="">link 1</a>
5
+ <a xmlns="http://www.w3.org/1999/xhtml" href="#" data-dce-id="5" slot="">link 2</a>
6
+ <a xmlns="http://www.w3.org/1999/xhtml" href="#" data-dce-id="6" slot="">link 3</a>
13
7
  </payload>
14
8
  <attributes>
15
- <tag>dce-bbc8e8b4-575f-40d3-9880-2f1d56d85d80</tag>
9
+ <xmlns/>
10
+ <justify>end</justify>
11
+ <data-dce-id>2</data-dce-id>
12
+ <direction>row</direction>
16
13
  </attributes>
17
- <dataset/>
18
- <slice>
19
- <selected-version xmlns="" slice="selected-version" package-name="@epa-wg/custom-element" data-dce-id="2"
20
- current-version="" value="0.0.21">
21
- <event isTrusted="false" sliceProcessed="1" type="change" eventPhase="2" bubbles="true" cancelable="false"
22
- defaultPrevented="false" composed="false" timeStamp="2225577.4000000954" returnValue="true"
23
- cancelBubble="false" NONE="0" CAPTURING_PHASE="1" AT_TARGET="2" BUBBLING_PHASE="3">
24
- <detail package-name="@epa-wg/custom-element"/>
25
- </event>
26
- </selected-version>
27
- </slice>
14
+ <dataset>
15
+ <dceId>2</dceId>
16
+ </dataset>
17
+ <slice/>
28
18
  </datadom>
package/storybook-static/demo/s.xslt CHANGED
@@ -1,78 +1,20 @@
1
- <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml"
2
- xmlns:dce="urn:schemas-epa-wg:dce" xmlns:exsl="http://exslt.org/common" version="1.0"
3
- exclude-result-prefixes="exsl">
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:dce="urn:schemas-epa-wg:dce" xmlns:exsl="http://exslt.org/common" version="1.0" exclude-result-prefixes="exsl">
4
3
  <xsl:template match="ignore">
5
4
  <xsl:choose>
6
- <xsl:when test="//attr">
7
- <xsl:value-of select="//attr"/>
8
- </xsl:when>
9
- <xsl:otherwise>
10
- <xsl:value-of select="def"/>
11
- </xsl:otherwise>
12
- </xsl:choose>
13
- <xsl:value-of select="."/>
14
- </xsl:template>
15
- <xsl:template mode="payload" match="attributes">
16
- <dce-root xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml" data-dce-id="1">
17
- <xsl:variable xmlns:xsl="http://www.w3.org/1999/XSL/Transform" name="methods">
18
- <a xmlns="" href="https://developer.mozilla.org/en-US/docs/Web/API/Location/href" data-dce-id="2">
19
- location.href
20
- </a>
21
- <a xmlns="" href="https://developer.mozilla.org/en-US/docs/Web/API/Location/hash" data-dce-id="3">
22
- location.hash
23
- </a>
24
- <a xmlns="" href="https://developer.mozilla.org/en-US/docs/Web/API/Location/assign" data-dce-id="4">
25
- location.assign
26
- </a>
27
- </xsl:variable>
28
- <fieldset xmlns="" data-dce-id="5">
29
- <legend data-dce-id="6">
30
- <b data-dce-id="7">set-by</b>
31
- </legend>
32
- <xsl:for-each xmlns:xsl="http://www.w3.org/1999/XSL/Transform" select="$methods">
33
- <p data-dce-id="8">
34
- <label data-dce-id="9">
35
- <input type="radio" name="method" value="{.}" data-dce-id="10"/>
36
- <dce-text data-dce-id="11">
37
- <xsl:value-of select="."/>
38
- </dce-text>
39
- </label>
40
- <a class="infolink" href="https://developer.mozilla.org/en-US/docs/Web/API/Location/assign"
41
- data-dce-id="12">mdn
42
- </a>
43
- </p>
44
- </xsl:for-each>
45
- <label data-dce-id="13">
46
- <input type="radio" name="method" value="location.href" data-dce-id="14"/>
47
- <dce-text data-dce-id="15">location.href</dce-text>
48
- </label>
49
- <label data-dce-id="16">
50
- <input type="radio" name="method" value="location" data-dce-id="17"/>
51
- <dce-text data-dce-id="18">location</dce-text>
52
- </label>
53
- <label data-dce-id="19">
54
- <input type="radio" name="method" value="location.replace" data-dce-id="20"/>
55
- <dce-text data-dce-id="21">location.replace</dce-text>
56
- </label>
57
- <label data-dce-id="22">
58
- <input type="radio" name="method" value="location.assign" data-dce-id="23"/>
59
- <dce-text data-dce-id="24">location.assign</dce-text>
60
- </label>
61
- <label data-dce-id="25">
62
- <input type="radio" name="method" value="location.hash" data-dce-id="26"/>
63
- <dce-text data-dce-id="27">location.hash</dce-text>
64
- </label>
65
- <label data-dce-id="28">
66
- <input type="radio" name="method" value="history.pushState" data-dce-id="29"/>
67
- <dce-text data-dce-id="30">history.pushState</dce-text>
68
- </label>
69
- <label data-dce-id="31">
70
- <input type="radio" name="method" value="history.replaceState" data-dce-id="32"/>
71
- <dce-text data-dce-id="33">history.replaceState</dce-text>
72
- </label>
73
- </fieldset>
74
- </dce-root>
75
- </xsl:template>
5
+ <xsl:when test="//attr"><xsl:value-of select="//attr"/></xsl:when>
6
+ <xsl:otherwise><xsl:value-of select="def"/></xsl:otherwise>
7
+ </xsl:choose><xsl:value-of select="."/></xsl:template>
8
+ <xsl:template mode="payload" match="attributes"><xsl:param name="direction"><xsl:choose>
9
+ <xsl:when test="//direction"><xsl:value-of select="//direction"/></xsl:when>
10
+ <xsl:otherwise><xsl:value-of select="'row'"/></xsl:otherwise>
11
+ </xsl:choose></xsl:param><dce-root xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml" data-dce-id="1"><xsl:attribute name="direction"><xsl:choose>
12
+ <xsl:when test="//direction"><xsl:value-of select="//direction"/></xsl:when>
13
+ <xsl:otherwise><xsl:value-of select="'row'"/></xsl:otherwise>
14
+ </xsl:choose></xsl:attribute><xsl:call-template name="slot">
15
+ <xsl:with-param name="slotname" select="''"/>
16
+ <xsl:with-param name="defaultvalue"/>
17
+ </xsl:call-template></dce-root></xsl:template>
76
18
  <xsl:template match="/">
77
19
  <xsl:apply-templates mode="payload" select="/datadom/attributes"/>
78
20
  </xsl:template>
@@ -81,7 +23,7 @@
81
23
  <xsl:param name="defaultvalue"/>
82
24
  <xsl:choose>
83
25
  <xsl:when test="//payload/*[@slot=$slotname]">
84
- <xsl:copy-of select="//payload/*[@slot=$slotname]"/>
26
+ <xsl:copy-of select="//payload/*[@slot=$slotname]"/>
85
27
  </xsl:when>
86
28
  <xsl:otherwise>
87
29
  <xsl:copy-of select="$defaultvalue"/>
package/storybook-static/demo/s1.xslt CHANGED
@@ -1,60 +1,60 @@
1
- <?xml version="1.0" encoding="UTF-8"?>
2
- <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml"
3
- xmlns:dce="urn:schemas-epa-wg:dce" xmlns:exsl="http://exslt.org/common" version="1.0"
4
- exclude-result-prefixes="exsl">
5
- <xsl:template match="ignore">
6
- <xsl:choose>
7
- <xsl:when test="//attr">
8
- <xsl:value-of select="//attr"/>
9
- </xsl:when>
10
- <xsl:otherwise>
11
- <xsl:value-of select="def"/>
12
- </xsl:otherwise>
13
- </xsl:choose>
14
- <xsl:value-of select="."/>
15
- </xsl:template>
16
- <xsl:template mode="payload" match="attributes">
17
- <dce-root xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml" data-dce-id="1">
18
- <u xmlns="" data-dce-id="2">
19
- <dce-text data-dce-id="3">
20
- <xsl:call-template name="slot">
21
- <xsl:with-param name="slotname" select="''"/>
22
- <xsl:with-param name="defaultvalue">
23
- <dce-text xmlns="" data-dce-id="4">is green</dce-text>
24
- </xsl:with-param>
25
- </xsl:call-template>
26
- </dce-text>
27
- </u>
28
- </dce-root>
29
- </xsl:template>
30
- <xsl:template match="/">
31
- <xsl:apply-templates mode="payload" select="/datadom/attributes"/>
32
- </xsl:template>
33
-
34
- <xsl:template match="@*|node()" mode="copy-html">
35
- <xsl:copy><xsl:apply-templates select="@*|node()" mode="copy-html"/></xsl:copy>
36
- </xsl:template>
37
- <xsl:template match="node()[starts-with(name(),'xhtml:')]" mode="copy-html">
38
- <xsl:element name="{local-name()}"><xsl:apply-templates select="@*|node()" mode="copy-html"/></xsl:element>
39
- </xsl:template>
40
-
41
-
42
- <xsl:template name="slot">
43
- <xsl:param name="slotname"/>
44
- <xsl:param name="defaultvalue"/>
45
- <xsl:choose>
46
- <xsl:when test="//payload/*[@slot=$slotname]">
47
- <xsl:apply-templates mode="copy-html" select="//payload/*[@slot=$slotname]"/>
48
- </xsl:when>
49
- <xsl:otherwise>
50
- <xsl:apply-templates mode="copy-html" select="$defaultvalue"/>
51
- </xsl:otherwise>
52
- </xsl:choose>
53
- </xsl:template>
54
- <xsl:variable name="js-injected-body">
55
- <xsl:call-template name="slot">
56
- <xsl:with-param name="slotname" select="''"/>
57
- <xsl:with-param name="defaultvalue"/>
58
- </xsl:call-template>
59
- </xsl:variable>
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml"
3
+ xmlns:dce="urn:schemas-epa-wg:dce" xmlns:exsl="http://exslt.org/common" version="1.0"
4
+ exclude-result-prefixes="exsl">
5
+ <xsl:template match="ignore">
6
+ <xsl:choose>
7
+ <xsl:when test="//attr">
8
+ <xsl:value-of select="//attr"/>
9
+ </xsl:when>
10
+ <xsl:otherwise>
11
+ <xsl:value-of select="def"/>
12
+ </xsl:otherwise>
13
+ </xsl:choose>
14
+ <xsl:value-of select="."/>
15
+ </xsl:template>
16
+ <xsl:template mode="payload" match="attributes">
17
+ <dce-root xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml" data-dce-id="1">
18
+ <u xmlns="" data-dce-id="2">
19
+ <dce-text data-dce-id="3">
20
+ <xsl:call-template name="slot">
21
+ <xsl:with-param name="slotname" select="''"/>
22
+ <xsl:with-param name="defaultvalue">
23
+ <dce-text xmlns="" data-dce-id="4">is green</dce-text>
24
+ </xsl:with-param>
25
+ </xsl:call-template>
26
+ </dce-text>
27
+ </u>
28
+ </dce-root>
29
+ </xsl:template>
30
+ <xsl:template match="/">
31
+ <xsl:apply-templates mode="payload" select="/datadom/attributes"/>
32
+ </xsl:template>
33
+
34
+ <xsl:template match="@*|node()" mode="copy-html">
35
+ <xsl:copy><xsl:apply-templates select="@*|node()" mode="copy-html"/></xsl:copy>
36
+ </xsl:template>
37
+ <xsl:template match="node()[starts-with(name(),'xhtml:')]" mode="copy-html">
38
+ <xsl:element name="{local-name()}"><xsl:apply-templates select="@*|node()" mode="copy-html"/></xsl:element>
39
+ </xsl:template>
40
+
41
+
42
+ <xsl:template name="slot">
43
+ <xsl:param name="slotname"/>
44
+ <xsl:param name="defaultvalue"/>
45
+ <xsl:choose>
46
+ <xsl:when test="//payload/*[@slot=$slotname]">
47
+ <xsl:apply-templates mode="copy-html" select="//payload/*[@slot=$slotname]"/>
48
+ </xsl:when>
49
+ <xsl:otherwise>
50
+ <xsl:apply-templates mode="copy-html" select="$defaultvalue"/>
51
+ </xsl:otherwise>
52
+ </xsl:choose>
53
+ </xsl:template>
54
+ <xsl:variable name="js-injected-body">
55
+ <xsl:call-template name="slot">
56
+ <xsl:with-param name="slotname" select="''"/>
57
+ <xsl:with-param name="defaultvalue"/>
58
+ </xsl:call-template>
59
+ </xsl:variable>
60
60
  </xsl:stylesheet>
package/storybook-static/demo/ss.html CHANGED
@@ -1,57 +1,24 @@
1
- <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"><http-request xmlns="" url="/reflect" slice="page" data-dce-id="2"></http-request><p xmlns="" data-dce-id="3">Pokemon Count: 6</p>
2
- <ul xmlns="" data-dce-id="6">
3
- <var data-testid="request-section" data-dce-id="7"><dce-text data-dce-id="8">request</dce-text></var><div data-dce-id="9">
4
- <var data-dce-id="10">@url</var><dce-text data-dce-id="11">
5
- =
6
- </dce-text><code data-testid="attr-url" data-dce-id="12">/reflect</code>
7
- </div>
8
- <div data-dce-id="9-1">
9
- <var data-dce-id="10">@data-dce-id</var><dce-text data-dce-id="11">
10
- =
11
- </dce-text><code data-testid="attr-data-dce-id" data-dce-id="12">2</code>
12
- </div>
13
- </ul>
14
- <ul xmlns="" data-dce-id="6-1">
15
- <var data-testid="request-section" data-dce-id="7"><dce-text data-dce-id="8">response</dce-text></var><div data-dce-id="9">
16
- <var data-dce-id="10">@ok</var><dce-text data-dce-id="11">
17
- =
18
- </dce-text><code data-testid="attr-ok" data-dce-id="12">true</code>
19
- </div>
20
- <div data-dce-id="9-1">
21
- <var data-dce-id="10">@status</var><dce-text data-dce-id="11">
22
- =
23
- </dce-text><code data-testid="attr-status" data-dce-id="12">200</code>
24
- </div>
25
- <div data-dce-id="9-2">
26
- <var data-dce-id="10">@statusText</var><dce-text data-dce-id="11">
27
- =
28
- </dce-text><code data-testid="attr-statusText" data-dce-id="12">OK</code>
29
- </div>
30
- <div data-dce-id="9-3">
31
- <var data-dce-id="10">@type</var><dce-text data-dce-id="11">
32
- =
33
- </dce-text><code data-testid="attr-type" data-dce-id="12">basic</code>
34
- </div>
35
- <div data-dce-id="9-4">
36
- <var data-dce-id="10">@url</var><dce-text data-dce-id="11">
37
- =
38
- </dce-text><code data-testid="attr-url" data-dce-id="12">http://localhost:5173/reflect</code>
39
- </div>
40
- <div data-dce-id="9-5">
41
- <var data-dce-id="10">@redirected</var><dce-text data-dce-id="11">
42
- =
43
- </dce-text><code data-testid="attr-redirected" data-dce-id="12">false</code>
44
- </div>
45
- </ul><button xmlns="" data-dce-id="5">bulbasaur</button><button xmlns="" data-dce-id="5-1">ivysaur</button><button xmlns="" data-dce-id="5-2">venusaur</button><button xmlns="" data-dce-id="5-3">charmander</button><button xmlns="" data-dce-id="5-4">charmeleon</button><button xmlns="" data-dce-id="5-5">charizard</button>
46
- <ul xmlns="" data-dce-id="6-2">
47
- <var data-testid="request-section" data-dce-id="7"><dce-text data-dce-id="8">data</dce-text></var><div data-dce-id="9">
48
- <var data-dce-id="10">@count</var><dce-text data-dce-id="11">
49
- =
50
- </dce-text><code data-testid="attr-count" data-dce-id="12">1279</code>
51
- </div>
52
- <div data-dce-id="9-1">
53
- <var data-dce-id="10">@next</var><dce-text data-dce-id="11">
54
- =
55
- </dce-text><code data-testid="attr-next" data-dce-id="12">https://pokeapi.co/api/v2/pokemon?offset=6&amp;limit=6</code>
56
- </div>
57
- </ul></dce-root>
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <dce-root data-dce-id="1" label="Number" name="" placeholder="Enter the numeric value" type="text" value=""
3
+ xmlns="http://www.w3.org/1999/xhtml" xmlns:dce="urn:schemas-epa-wg:dce"
4
+ xmlns:xhtml="http://www.w3.org/1999/xhtml"><pre data-dce-id="2" xmlns=""> //focused
5
+ //suggest
6
+ //selected
7
+ $selected-value </pre>
8
+ <label data-dce-id="3">
9
+ <dce-text data-dce-id="4">Number</dce-text>
10
+ <input data-dce-id="5" name="" placeholder="Enter the numeric value" type="text" value="">
11
+ <slice data-dce-id="6" name="focused" slice-event="focus" slice-value="1"/>
12
+ <slice data-dce-id="7" name="selected" slice-event="input"/>
13
+ </input></label>
14
+ <fieldset data-dce-id="8" form="cem-autocomplete-form" xmlns=""><label data-dce-id="9" value="one"><input
15
+ data-dce-id="10" name="cem-autocomplete" slice="suggest" slice-event="input" type="radio" value="one"/>
16
+ <dce-text data-dce-id="11">One</dce-text>
17
+ </label><label data-dce-id="9" value="two"><input data-dce-id="10" name="cem-autocomplete" slice="suggest" slice-event="input"
18
+ type="radio" value="two"/>
19
+ <dce-text data-dce-id="11">Two</dce-text>
20
+ </label><label data-dce-id="9" value="three"><input data-dce-id="10" name="cem-autocomplete" slice="suggest"
21
+ slice-event="input" type="radio" value="three"/>
22
+ <dce-text data-dce-id="11">Three</dce-text>
23
+ </label></fieldset>
24
+ </dce-root>
package/storybook-static/demo/z.html CHANGED
@@ -1,62 +1,33 @@
1
- <dce-root xmlns="http://www.w3.org/1999/xhtml" xmlns:xhtml="http://www.w3.org/1999/xhtml"
2
- xmlns:dce="urn:schemas-epa-wg:dce" data-dce-id="1">
3
- <location-element xmlns="" slice="window-url" live="" data-dce-id="2"></location-element>
4
- <table xmlns="" data-dce-id="3">
5
- <tbody data-dce-id="0-1">
6
- <tr data-dce-id="4">
7
- <th data-dce-id="5"><h3 data-dce-id="6"> URL properties </h3></th>
8
- <td data-dce-id="7">9</td>
9
- </tr>
10
- <tr data-dce-id="10">
11
- <th data-dce-id="11">href</th>
12
- <td data-dce-id="12">http://localhost:63342/custom-element/demo/a.html?_ijt=dmv0p4go000q47lg48i5im92f7&amp;_ij_reload=RELOAD_ON_SAVE</td>
13
- </tr>
14
- <tr data-dce-id="10-1">
15
- <th data-dce-id="11">origin</th>
16
- <td data-dce-id="12">http://localhost:63342</td>
17
- </tr>
18
- <tr data-dce-id="10-2">
19
- <th data-dce-id="11">protocol</th>
20
- <td data-dce-id="12">http:</td>
21
- </tr>
22
- <tr data-dce-id="10-3">
23
- <th data-dce-id="11">host</th>
24
- <td data-dce-id="12">localhost:63342</td>
25
- </tr>
26
- <tr data-dce-id="10-4">
27
- <th data-dce-id="11">hostname</th>
28
- <td data-dce-id="12">localhost</td>
29
- </tr>
30
- <tr data-dce-id="10-5">
31
- <th data-dce-id="11">port</th>
32
- <td data-dce-id="12">63342</td>
33
- </tr>
34
- <tr data-dce-id="10-6">
35
- <th data-dce-id="11">pathname</th>
36
- <td data-dce-id="12">/custom-element/demo/a.html</td>
37
- </tr>
38
- <tr data-dce-id="10-7">
39
- <th data-dce-id="11">search</th>
40
- <td data-dce-id="12">?_ijt=dmv0p4go000q47lg48i5im92f7&amp;_ij_reload=RELOAD_ON_SAVE</td>
41
- </tr>
42
- <tr data-dce-id="10-8">
43
- <th data-dce-id="11">hash</th>
44
- <td data-dce-id="12"></td>
45
- </tr>
46
- </tbody>
47
- </table>
48
- <h3 data-dce-id="9"> URL parameters </h3>
49
- <table xmlns="" data-dce-id="8">
50
-
51
- <tbody data-dce-id="0-1">
52
- <tr data-dce-id="10">
53
- <th data-dce-id="11">_ijt</th>
54
- <td data-dce-id="12">dmv0p4go000q47lg48i5im92f7</td>
55
- </tr>
56
- <tr data-dce-id="10-1">
57
- <th data-dce-id="11">_ij_reload</th>
58
- <td data-dce-id="12">RELOAD_ON_SAVE</td>
59
- </tr>
60
- </tbody>
61
- </table>
62
- </dce-root>
1
+ <!DOCTYPE html>
2
+ <html lang="en" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml">
3
+ <head>
4
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
+ <title>DOM merge - Declarative Custom Element implementation demo</title>
6
+ <link rel="icon" href="./wc-square.svg"/>
7
+ <script type="importmap">
8
+ {
9
+ "imports": {
10
+ "@epa-wg/custom-element/": "../",
11
+ "@epa-wg/custom-element-dist/": "../"
12
+ }
13
+ }
14
+ </script>
15
+ <script type="module" src="../http-request.js"></script>
16
+ <script type="module" src="../location-element.js"></script>
17
+ <script type="module" src="../custom-element.js"></script>
18
+ <style>
19
+ @import "./demo.css";
20
+ dt{ font-weight: bold}
21
+ dd{ padding: 0;}
22
+ h1,h3{ margin: 0;}
23
+ nav{ gap:0; }
24
+ </style>
25
+ </head>
26
+ <body>
27
+
28
+ <custom-element src="./html-template.html#dwc-logo">
29
+ <template><i>loading SVG from templates file ...</i></template>
30
+ </custom-element>
31
+
32
+ </body>
33
+ </html>