@teipublisher/pb-components 2.26.1-next.3 → 3.0.0-next-4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (262) hide show
  1. package/.github/workflows/docker-cypress.yml +53 -0
  2. package/.github/workflows/node.js.yml +70 -21
  3. package/.releaserc.json +7 -2
  4. package/CHANGELOG.md +363 -11
  5. package/Dockerfile +78 -70
  6. package/README.md +112 -4
  7. package/css/components.css +5 -5
  8. package/css/gridjs/mermaid.min.css +1 -1
  9. package/css/leaflet/Control.Geocoder.css +1 -126
  10. package/css/leaflet/images/layers.png +0 -0
  11. package/css/tify/tify.css +6 -5
  12. package/css/tom-select/tom-select.bootstrap4.min.css +1 -1
  13. package/css/tom-select/tom-select.bootstrap5.min.css +1 -1
  14. package/css/tom-select/tom-select.default.min.css +1 -1
  15. package/css/tom-select/tom-select.default.min.css.map +1 -0
  16. package/css/tom-select/tom-select.min.css +1 -1
  17. package/cypress.config.js +84 -0
  18. package/dist/api.html +1 -1
  19. package/dist/css/design-system.css +607 -0
  20. package/dist/demo/bundle-test.html +4 -3
  21. package/dist/demo/components.css +46 -1
  22. package/dist/demo/design-system.html +710 -0
  23. package/dist/demo/dts-client.html +2 -2
  24. package/dist/demo/pb-autocomplete.html +23 -11
  25. package/dist/demo/pb-autocomplete2.html +66 -55
  26. package/dist/demo/pb-autocomplete3.html +17 -8
  27. package/dist/demo/pb-blacklab-highlight.html +28 -11
  28. package/dist/demo/pb-blacklab-results.html +3 -2
  29. package/dist/demo/pb-browse-docs.html +24 -24
  30. package/dist/demo/pb-browse-docs2.html +3 -3
  31. package/dist/demo/pb-clipboard.html +32 -28
  32. package/dist/demo/pb-code-editor.html +6 -6
  33. package/dist/demo/pb-code-highlight.html +63 -63
  34. package/dist/demo/pb-codepen.html +1 -1
  35. package/dist/demo/pb-collapse.html +1 -1
  36. package/dist/demo/pb-collapse2.html +2 -2
  37. package/dist/demo/pb-combo-box.html +135 -130
  38. package/dist/demo/pb-custom-form.html +64 -55
  39. package/dist/demo/pb-dialog.html +12 -6
  40. package/dist/demo/pb-document.html +1 -1
  41. package/dist/demo/pb-download.html +68 -59
  42. package/dist/demo/pb-drawer.html +67 -46
  43. package/dist/demo/pb-drawer2.html +65 -58
  44. package/dist/demo/pb-edit-app.html +2 -2
  45. package/dist/demo/pb-edit-xml.html +1 -1
  46. package/dist/demo/pb-facsimile-2.html +26 -11
  47. package/dist/demo/pb-facsimile-3.html +25 -10
  48. package/dist/demo/pb-facsimile-dedup-test-2.html +48 -0
  49. package/dist/demo/pb-facsimile-dedup-test.html +48 -0
  50. package/dist/demo/pb-facsimile.html +4 -4
  51. package/dist/demo/pb-formula.html +1 -1
  52. package/dist/demo/pb-grid.html +22 -8
  53. package/dist/demo/pb-highlight.html +2 -2
  54. package/dist/demo/pb-i18n-simple.html +1 -0
  55. package/dist/demo/pb-i18n.html +15 -5
  56. package/dist/demo/pb-image-strip-standalone.html +2 -2
  57. package/dist/demo/pb-image-strip-view.html +2 -2
  58. package/dist/demo/pb-leaflet-map.html +3 -3
  59. package/dist/demo/pb-leaflet-map2.html +2 -2
  60. package/dist/demo/pb-leaflet-map3.html +3 -3
  61. package/dist/demo/pb-link.html +1 -1
  62. package/dist/demo/pb-load.html +2 -6
  63. package/dist/demo/pb-login.html +1 -3
  64. package/dist/demo/pb-manage-odds.html +9 -4
  65. package/dist/demo/pb-markdown.html +1 -1
  66. package/dist/demo/pb-media-query.html +2 -2
  67. package/dist/demo/pb-mei.html +2 -2
  68. package/dist/demo/pb-mei2.html +2 -2
  69. package/dist/demo/pb-message.html +2 -3
  70. package/dist/demo/pb-odd-editor.html +54 -52
  71. package/dist/demo/pb-page-header.html +27 -0
  72. package/dist/demo/pb-popover.html +1 -1
  73. package/dist/demo/pb-print-preview.html +2 -2
  74. package/dist/demo/pb-progress.html +4 -4
  75. package/dist/demo/pb-repeat.html +32 -36
  76. package/dist/demo/pb-search.html +16 -5
  77. package/dist/demo/pb-search2.html +4 -4
  78. package/dist/demo/pb-search3.html +3 -3
  79. package/dist/demo/pb-search4.html +3 -3
  80. package/dist/demo/pb-select-feature.html +4 -4
  81. package/dist/demo/pb-select-feature2.html +4 -4
  82. package/dist/demo/pb-select-feature3.html +2 -2
  83. package/dist/demo/pb-select-i18n.html +58 -53
  84. package/dist/demo/pb-select-odd.html +1 -1
  85. package/dist/demo/pb-select.html +190 -75
  86. package/dist/demo/pb-select2.html +91 -37
  87. package/dist/demo/pb-select3.html +109 -41
  88. package/dist/demo/pb-svg.html +1 -1
  89. package/dist/demo/pb-table-grid.html +26 -15
  90. package/dist/demo/pb-tabs.html +15 -7
  91. package/dist/demo/pb-tify.html +7 -7
  92. package/dist/demo/pb-timeline.html +1 -1
  93. package/dist/demo/pb-timeline2.html +1 -1
  94. package/dist/demo/pb-toggle-feature.html +26 -23
  95. package/dist/demo/pb-toggle-feature2.html +4 -4
  96. package/dist/demo/pb-toggle-feature3.html +2 -2
  97. package/dist/demo/pb-toggle-feature4.html +56 -54
  98. package/dist/demo/pb-version.html +2 -2
  99. package/dist/demo/pb-view.html +78 -40
  100. package/dist/demo/pb-view2.html +69 -46
  101. package/dist/demo/pb-view3.html +53 -48
  102. package/dist/demo/pb-view4.html +70 -49
  103. package/dist/demo/pb-zoom.html +2 -2
  104. package/dist/{es-global-bridge-d8ce175d.js → es-global-bridge-D8ZcUcx_.js} +0 -4
  105. package/dist/focus-mixin-VCsFap6b.js +768 -0
  106. package/dist/images/icons.svg +217 -0
  107. package/dist/jinn-codemirror-DETLdm08.js +1 -0
  108. package/dist/lib/openseadragon.min.js +80 -0
  109. package/dist/lib/openseadragon.min.js.map +1 -0
  110. package/dist/pb-code-editor.js +25 -20
  111. package/dist/pb-component-docs.js +414 -3225
  112. package/dist/pb-components-bundle.js +3046 -4402
  113. package/dist/pb-dialog-tklYGWfc.js +121 -0
  114. package/dist/pb-edit-app.js +208 -107
  115. package/dist/pb-elements.json +716 -249
  116. package/dist/pb-facsimile.js +46 -0
  117. package/dist/pb-i18n-C0NDma4h.js +1 -0
  118. package/dist/pb-leaflet-map.js +23 -23
  119. package/dist/pb-mei.js +152 -134
  120. package/dist/pb-mixin-DHoWQheB.js +1 -0
  121. package/dist/pb-odd-editor.js +1671 -1231
  122. package/dist/pb-tify.js +1 -27
  123. package/dist/unsafe-html-D5VGo9Oq.js +1 -0
  124. package/dist/urls-BEONu_g4.js +1 -0
  125. package/eslint.config.mjs +92 -0
  126. package/gh-pages.js +5 -3
  127. package/i18n/common/en.json +6 -0
  128. package/i18n/common/pl.json +2 -2
  129. package/images/icons.svg +217 -0
  130. package/index.html +0 -5
  131. package/lib/leaflet-src.js.map +1 -0
  132. package/lib/leaflet.markercluster-src.js.map +1 -0
  133. package/lib/openseadragon.min.js +6 -6
  134. package/package.json +56 -81
  135. package/pb-elements.json +716 -249
  136. package/rollup.config.mjs +312 -0
  137. package/src/assets/components.css +5 -5
  138. package/src/assets/design-system.css +607 -0
  139. package/src/authority/airtable.js +20 -21
  140. package/src/authority/anton.js +129 -129
  141. package/src/authority/custom.js +70 -27
  142. package/src/authority/geonames.js +38 -32
  143. package/src/authority/gnd.js +50 -42
  144. package/src/authority/kbga.js +136 -134
  145. package/src/authority/metagrid.js +44 -46
  146. package/src/authority/reconciliation.js +66 -68
  147. package/src/authority/registry.js +4 -4
  148. package/src/docs/demo-utils.js +91 -0
  149. package/src/docs/pb-component-docs.js +287 -147
  150. package/src/docs/pb-component-view.js +380 -273
  151. package/src/docs/pb-components-list.js +115 -51
  152. package/src/docs/pb-demo-snippet.js +199 -174
  153. package/src/dts-client.js +306 -303
  154. package/src/dts-select-endpoint.js +125 -85
  155. package/src/parse-date-service.js +184 -135
  156. package/src/pb-ajax.js +175 -173
  157. package/src/pb-authority-lookup.js +198 -158
  158. package/src/pb-autocomplete.js +731 -313
  159. package/src/pb-blacklab-highlight.js +266 -260
  160. package/src/pb-blacklab-results.js +230 -225
  161. package/src/pb-browse-docs.js +601 -484
  162. package/src/pb-browse.js +68 -65
  163. package/src/pb-clipboard.js +97 -76
  164. package/src/pb-code-editor.js +111 -103
  165. package/src/pb-code-highlight.js +234 -204
  166. package/src/pb-codepen.js +81 -73
  167. package/src/pb-collapse.js +265 -152
  168. package/src/pb-combo-box.js +191 -191
  169. package/src/pb-components-bundle.js +1 -7
  170. package/src/pb-components.js +2 -6
  171. package/src/pb-custom-form.js +230 -141
  172. package/src/pb-dialog.js +99 -63
  173. package/src/pb-document.js +118 -91
  174. package/src/pb-download.js +214 -198
  175. package/src/pb-drawer.js +146 -149
  176. package/src/pb-edit-app.js +471 -240
  177. package/src/pb-edit-xml.js +101 -98
  178. package/src/pb-events.js +126 -107
  179. package/src/pb-facs-link.js +130 -101
  180. package/src/pb-facsimile.js +494 -410
  181. package/src/pb-fetch.js +389 -0
  182. package/src/pb-formula.js +152 -154
  183. package/src/pb-geolocation.js +130 -132
  184. package/src/pb-grid-action.js +59 -56
  185. package/src/pb-grid.js +388 -228
  186. package/src/pb-highlight.js +142 -142
  187. package/src/pb-hotkeys.js +40 -42
  188. package/src/pb-i18n.js +115 -127
  189. package/src/pb-icon-button.js +108 -0
  190. package/src/pb-icon.js +283 -0
  191. package/src/pb-image-strip.js +85 -79
  192. package/src/pb-lang.js +142 -57
  193. package/src/pb-leaflet-map.js +551 -483
  194. package/src/pb-link.js +132 -126
  195. package/src/pb-load.js +495 -428
  196. package/src/pb-login.js +303 -248
  197. package/src/pb-manage-odds.js +384 -338
  198. package/src/pb-map-icon.js +90 -90
  199. package/src/pb-map-layer.js +86 -86
  200. package/src/pb-markdown.js +107 -110
  201. package/src/pb-media-query.js +75 -73
  202. package/src/pb-mei.js +523 -303
  203. package/src/pb-message.js +144 -98
  204. package/src/pb-mixin.js +268 -265
  205. package/src/pb-navigation.js +83 -96
  206. package/src/pb-observable.js +39 -39
  207. package/src/pb-odd-editor.js +1209 -948
  208. package/src/pb-odd-elementspec-editor.js +375 -310
  209. package/src/pb-odd-model-editor.js +1189 -941
  210. package/src/pb-odd-parameter-editor.js +269 -170
  211. package/src/pb-odd-rendition-editor.js +184 -131
  212. package/src/pb-page.js +451 -422
  213. package/src/pb-paginate.js +260 -178
  214. package/src/pb-panel.js +217 -183
  215. package/src/pb-popover-themes.js +16 -9
  216. package/src/pb-popover.js +297 -288
  217. package/src/pb-print-preview.js +128 -128
  218. package/src/pb-progress.js +52 -52
  219. package/src/pb-repeat.js +141 -108
  220. package/src/pb-restricted.js +85 -78
  221. package/src/pb-search.js +258 -230
  222. package/src/pb-select-feature.js +210 -126
  223. package/src/pb-select-odd.js +184 -118
  224. package/src/pb-select-template.js +113 -78
  225. package/src/pb-select.js +330 -229
  226. package/src/pb-split-list.js +181 -176
  227. package/src/pb-svg.js +81 -80
  228. package/src/pb-table-column.js +55 -55
  229. package/src/pb-table-grid.js +334 -205
  230. package/src/pb-tabs.js +238 -61
  231. package/src/pb-tify.js +3331 -126
  232. package/src/pb-timeline.js +394 -255
  233. package/src/pb-toggle-feature.js +196 -188
  234. package/src/pb-upload.js +201 -176
  235. package/src/pb-version.js +22 -34
  236. package/src/pb-view-annotate.js +138 -102
  237. package/src/pb-view.js +1722 -1272
  238. package/src/pb-zoom.js +144 -46
  239. package/src/search-result-service.js +256 -223
  240. package/src/seed-element.js +14 -22
  241. package/src/settings.js +4 -4
  242. package/src/theming.js +98 -91
  243. package/src/urls.js +403 -289
  244. package/src/utils.js +53 -51
  245. package/vite.config.js +86 -0
  246. package/.github/workflows/main.yml +0 -24
  247. package/.github/workflows/release.js.yml +0 -34
  248. package/css/pb-styles.css +0 -51
  249. package/dist/iron-form-3b8dcaa7.js +0 -210
  250. package/dist/jinn-codemirror-da0e2d1f.js +0 -1
  251. package/dist/paper-checkbox-515a5284.js +0 -1597
  252. package/dist/paper-icon-button-b1d31571.js +0 -398
  253. package/dist/paper-listbox-a3b7175c.js +0 -1265
  254. package/dist/pb-i18n-0611135a.js +0 -1
  255. package/dist/pb-mixin-b1caa22e.js +0 -158
  256. package/dist/polymer-hack.js +0 -1
  257. package/dist/vaadin-element-mixin-fe4a4883.js +0 -527
  258. package/lib/Control.Geocoder.min.js +0 -2
  259. package/lib/Control.Geocoder.min.js.map +0 -1
  260. package/src/assets/pb-styles.css +0 -51
  261. package/src/pb-light-dom.js +0 -41
  262. package/src/polymer-hack.js +0 -6
package/dist/demo/pb-code-highlight.html CHANGED
@@ -1,63 +1,63 @@
1
- <html>
2
- <head>
3
- <meta charset="utf-8"/>
4
- <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"/>
5
-
6
- <title>pb-code-highlight Demo</title>
7
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
8
- </head>
9
-
10
- <body>
11
- <pb-demo-snippet>
12
- <template>
13
- <style>
14
- pb-code-highlight {
15
- margin-bottom: 1em;
16
- --pb-code-highlight-white-space: pre-wrap;
17
- --pb-code-highlight-theme: "solarizedlight";
18
- }
19
- </style>
20
- <pb-page theme="components.css">
21
- <pb-code-highlight class="code-white-bg" language="xquery" line-numbers>
22
- for $i in $root//tei:placeName
23
- order by $i descending
24
- return
25
- &lt;li&gt;{$i/string()}&lt;li&gt;
26
- </pb-code-highlight>
27
- <pb-code-highlight language="html" theme="okaidia" line-numbers>
28
- <template>
29
- <pb-view src="document1" odd="graves" subscribe="letter" emit="letter"
30
- wait-for="pb-leaflet-map">
31
- <pb-param name="mode" value="facets" />
32
- </pb-view>
33
- </template>
34
- </pb-code-highlight>
35
- <pb-code-highlight language="javascript" theme="funky" line-numbers
36
- code="function(name) {&#10; return 'Hello ' + name;&#10;};"></pb-code-highlight>
37
- <pb-code-highlight language="css" theme="coy" line-numbers>
38
- h1, h2, h3, h4, h5, h6 {
39
- font-family: "Oswald",Verdana,"Helvetica", sans-serif;
40
- font-weight: 400 !important;
41
- line-height: 1.2;
42
- }
43
- </pb-code-highlight>
44
- <pb-code-highlight language="xml" theme="tomorrow" line-numbers>
45
- <template>
46
- <elementSpec ident="section">
47
- <modelSequence predicate="$parameters?mode='breadcrumbs'">
48
- <model behaviour="inline">
49
- <param name="content" value="$get(.)/ancestor::section/title"/>
50
- </model>
51
- <model behaviour="inline">
52
- <param name="content" value="title"/>
53
- </model>
54
- </modelSequence>
55
- <model behaviour="block"/>
56
- </elementSpec>
57
- </template>
58
- </pb-code-highlight>
59
- </pb-page>
60
- </template>
61
- </pb-demo-snippet>
62
- </body>
63
- </html>
1
+ <html>
2
+ <head>
3
+ <meta charset="utf-8"/>
4
+ <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"/>
5
+
6
+ <title>pb-code-highlight Demo</title>
7
+ <script type="module" src="../pb-components-bundle.js"></script>
8
+ </head>
9
+
10
+ <body>
11
+ <pb-demo-snippet>
12
+ <template>
13
+ <style>
14
+ pb-code-highlight {
15
+ margin-bottom: 1em;
16
+ --pb-code-highlight-white-space: pre-wrap;
17
+ --pb-code-highlight-theme: "solarizedlight";
18
+ }
19
+ </style>
20
+ <pb-page theme="components.css">
21
+ <pb-code-highlight class="code-white-bg" language="xquery" line-numbers>
22
+ for $i in $root//tei:placeName
23
+ order by $i descending
24
+ return
25
+ &lt;li&gt;{$i/string()}&lt;li&gt;
26
+ </pb-code-highlight>
27
+ <pb-code-highlight language="html" theme="okaidia" line-numbers>
28
+ <template>
29
+ <pb-view src="document1" odd="graves" subscribe="letter" emit="letter"
30
+ wait-for="pb-leaflet-map">
31
+ <pb-param name="mode" value="facets" />
32
+ </pb-view>
33
+ </template>
34
+ </pb-code-highlight>
35
+ <pb-code-highlight language="javascript" theme="funky" line-numbers
36
+ code="function(name) {&#10; return 'Hello ' + name;&#10;};"></pb-code-highlight>
37
+ <pb-code-highlight language="css" theme="coy" line-numbers>
38
+ h1, h2, h3, h4, h5, h6 {
39
+ font-family: "Oswald",Verdana,"Helvetica", sans-serif;
40
+ font-weight: 400 !important;
41
+ line-height: 1.2;
42
+ }
43
+ </pb-code-highlight>
44
+ <pb-code-highlight language="xml" theme="tomorrow" line-numbers>
45
+ <template>
46
+ <elementSpec ident="section">
47
+ <modelSequence predicate="$parameters?mode='breadcrumbs'">
48
+ <model behaviour="inline">
49
+ <param name="content" value="$get(.)/ancestor::section/title"/>
50
+ </model>
51
+ <model behaviour="inline">
52
+ <param name="content" value="title"/>
53
+ </model>
54
+ </modelSequence>
55
+ <model behaviour="block"/>
56
+ </elementSpec>
57
+ </template>
58
+ </pb-code-highlight>
59
+ </pb-page>
60
+ </template>
61
+ </pb-demo-snippet>
62
+ </body>
63
+ </html>
package/dist/demo/pb-codepen.html CHANGED
@@ -4,7 +4,7 @@
4
4
  <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"/>
5
5
 
6
6
  <title>pb-codepen Demo</title>
7
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
7
+ <script type="module" src="../pb-components-bundle.js"></script>
8
8
  </head>
9
9
 
10
10
  <body>
package/dist/demo/pb-collapse.html CHANGED
@@ -5,7 +5,7 @@
5
5
 
6
6
  <title>pb-code-editor Demo</title>
7
7
  <link rel="stylesheet" href="demo.css">
8
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
8
+ <script type="module" src="../pb-components-bundle.js"></script>
9
9
  </head>
10
10
 
11
11
  <body>
package/dist/demo/pb-collapse2.html CHANGED
@@ -3,9 +3,9 @@
3
3
  <meta charset="utf-8"/>
4
4
  <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"/>
5
5
 
6
- <title>pb-code-editor Demo</title>
6
+ <title>pb-collapse Demo</title>
7
7
  <link rel="stylesheet" href="demo.css">
8
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
8
+ <script type="module" src="../pb-components-bundle.js"></script>
9
9
  </head>
10
10
 
11
11
  <body>
package/dist/demo/pb-combo-box.html CHANGED
@@ -1,137 +1,142 @@
1
1
  <html>
2
- <head>
3
- <title>Using pb-multi-select</title>
4
- <link rel="stylesheet" href="demo.css">
5
2
 
6
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
7
- </head>
8
- <body>
9
- <pb-demo-snippet>
10
- <template>
11
- <pb-page locales="./i18n/{{ns}}_{{lng}}.json" locale-fallback-ns="app custom" endpoint="https://teipublisher.com/exist/apps/tei-publisher" api-version="1.0.0"
12
- require-language="">
13
- <pb-lang label="language" selected="en">
14
- <paper-item value="bg">Български</paper-item>
15
- <paper-item value="cs">český</paper-item>
16
- <paper-item value="zh_CN">简体中文</paper-item>
17
- <paper-item value="zh_TW">繁體中文</paper-item>
18
- <paper-item value="de">Deutsch</paper-item>
19
- <paper-item value="en">English</paper-item>
20
- <paper-item value="es">Español</paper-item>
21
- <paper-item value="el">ελληνικά</paper-item>
22
- <paper-item value="fr">Français</paper-item>
23
- <paper-item value="it">Italiano</paper-item>
24
- <paper-item value="ka">ქართული</paper-item>
25
- <paper-item value="nl">Nederlands</paper-item>
26
- <paper-item value="no">Norsk</paper-item>
27
- <paper-item value="pl">Polski</paper-item>
28
- <paper-item value="pt">Português</paper-item>
29
- <paper-item value="ro">Română</paper-item>
30
- <paper-item value="ru">русский</paper-item>
31
- <paper-item value="sl">Slovenščina</paper-item>
32
- <paper-item value="sv">Svenska</paper-item>
33
- <paper-item value="tr">Türkçe</paper-item>
34
- <paper-item value="uk">Українська</paper-item>
35
- </pb-lang>
3
+ <head>
4
+ <title>Using pb-multi-select</title>
5
+ <link rel="stylesheet" href="demo.css">
36
6
 
37
- <h2>Using pb-combo-box with a standard HTML form</h2>
38
- <form id="form" action="">
39
- <fieldset>
40
- <p>Select single option from a remote data source</p>
41
- <pb-combo-box source="select.json" close-after-select preload
42
- placeholder="demo.select-lang">
43
- <select name="lang">
44
- </select>
45
- </pb-combo-box>
46
- </fieldset>
47
- <fieldset>
48
- <p>Select options from a remote data source</p>
49
- <pb-combo-box source="select.json" placeholder="demo.select-lang" close-after-select preload>
50
- <input name="lang"></input>
51
- </pb-combo-box>
52
- </fieldset>
53
- <fieldset>
54
- <p>Select from a fixed set of options:</p>
55
- <pb-combo-box placeholder="demo.select-state">
56
- <select name="state" multiple>
57
- <option value="AL">Alabama</option>
58
- <option value="AK">Alaska</option>
59
- <option value="AZ">Arizona</option>
60
- <option value="AR">Arkansas</option>
61
- <option value="CA" selected>California</option>
62
- <option value="CO">Colorado</option>
63
- <option value="CT">Connecticut</option>
64
- <option value="DE">Delaware</option>
65
- <option value="DC">District of Columbia</option>
66
- <option value="FL">Florida</option>
67
- <option value="GA">Georgia</option>
68
- <option value="HI">Hawaii</option>
69
- <option value="ID">Idaho</option>
70
- <option value="IL">Illinois</option>
71
- <option value="IN">Indiana</option>
72
- <option value="IA">Iowa</option>
73
- <option value="KS">Kansas</option>
74
- <option value="KY">Kentucky</option>
75
- <option value="LA">Louisiana</option>
76
- <option value="ME">Maine</option>
77
- <option value="MD">Maryland</option>
78
- <option value="MA">Massachusetts</option>
79
- <option value="MI">Michigan</option>
80
- <option value="MN">Minnesota</option>
81
- <option value="MS">Mississippi</option>
82
- <option value="MO">Missouri</option>
83
- <option value="MT">Montana</option>
84
- <option value="NE">Nebraska</option>
85
- <option value="NV">Nevada</option>
86
- <option value="NH">New Hampshire</option>
87
- <option value="NJ">New Jersey</option>
88
- <option value="NM">New Mexico</option>
89
- <option value="NY">New York</option>
90
- <option value="NC">North Carolina</option>
91
- <option value="ND">North Dakota</option>
92
- <option value="OH">Ohio</option>
93
- <option value="OK">Oklahoma</option>
94
- <option value="OR">Oregon</option>
95
- <option value="PA">Pennsylvania</option>
96
- <option value="RI">Rhode Island</option>
97
- <option value="SC">South Carolina</option>
98
- <option value="SD">South Dakota</option>
99
- <option value="TN">Tennessee</option>
100
- <option value="TX">Texas</option>
101
- <option value="UT">Utah</option>
102
- <option value="VT">Vermont</option>
103
- <option value="VA">Virginia</option>
104
- <option value="WA">Washington</option>
105
- <option value="WV">West Virginia</option>
106
- <option value="WI">Wisconsin</option>
107
- <option value="WY" selected>Wyoming</option>
108
- </select>
109
- </pb-combo-box>
110
- </fieldset>
111
- <fieldset>
112
- <p>Use i18n to translate options:</p>
113
- <pb-combo-box placeholder="demo.select-animal">
114
- <select name="anmial" multiple>
115
- <option value="bird" data-i18n="demo.bird"></option>
116
- <option value="dog" data-i18n="demo.dog"></option>
117
- <option value="cat" data-i18n="demo.cat"></option>
118
- </select>
119
- </pb-combo-box>
120
- </fieldset>
121
- <button type="submit"><paper-button>Submit</paper-button></button>
122
- </form>
123
- <p>Parameters which would be sent: <code id="output"></code></p>
124
- </pb-page>
125
- <script>
126
- const form = document.getElementById('form');
7
+ <script type="module" src="../pb-components-bundle.js"></script>
8
+ </head>
9
+
10
+ <body>
11
+ <pb-demo-snippet>
12
+ <template>
13
+ <pb-page locales="./i18n/{{ns}}_{{lng}}.json" locale-fallback-ns="app custom" endpoint="https://teipublisher.com/exist/apps/tei-publisher" api-version="1.0.0"
14
+ require-language="">
15
+ <pb-lang label="language" selected="en">
16
+ <option value="bg">Български</option>
17
+ <option value="cs">český</option>
18
+ <option value="zh_CN">简体中文</option>
19
+ <option value="zh_TW">繁體中文</option>
20
+ <option value="de">Deutsch</option>
21
+ <option value="en">English</option>
22
+ <option value="es">Español</option>
23
+ <option value="el">ελληνικά</option>
24
+ <option value="fr">Français</option>
25
+ <option value="it">Italiano</option>
26
+ <option value="ka">ქართული</option>
27
+ <option value="nl">Nederlands</option>
28
+ <option value="no">Norsk</option>
29
+ <option value="pl">Polski</option>
30
+ <option value="pt">Português</option>
31
+ <option value="ro">Română</option>
32
+ <option value="ru">русский</option>
33
+ <option value="sl">Slovenščina</option>
34
+ <option value="sv">Svenska</option>
35
+ <option value="tr">Türkçe</option>
36
+ <option value="uk">Українська</option>
37
+ </pb-lang>
38
+
39
+ <h2>Using pb-combo-box with a standard HTML form</h2>
40
+ <form id="form" action="">
41
+ <fieldset>
42
+ <p>Select single option from a remote data source</p>
43
+ <pb-combo-box source="select.json" close-after-select preload placeholder="demo.select-lang">
44
+ <select name="lang">
45
+ </select>
46
+ </pb-combo-box>
47
+ </fieldset>
48
+ <fieldset>
49
+ <p>Select options from a remote data source</p>
50
+ <pb-combo-box source="select.json" placeholder="demo.select-lang" close-after-select preload>
51
+ <input name="lang"></input>
52
+ </pb-combo-box>
53
+ </fieldset>
54
+ <fieldset>
55
+ <p>Select from a fixed set of options:</p>
56
+ <pb-combo-box placeholder="demo.select-state">
57
+ <select name="state" multiple>
58
+ <option value="AL">Alabama</option>
59
+ <option value="AK">Alaska</option>
60
+ <option value="AZ">Arizona</option>
61
+ <option value="AR">Arkansas</option>
62
+ <option value="CA" selected>California</option>
63
+ <option value="CO">Colorado</option>
64
+ <option value="CT">Connecticut</option>
65
+ <option value="DE">Delaware</option>
66
+ <option value="DC">District of Columbia</option>
67
+ <option value="FL">Florida</option>
68
+ <option value="GA">Georgia</option>
69
+ <option value="HI">Hawaii</option>
70
+ <option value="ID">Idaho</option>
71
+ <option value="IL">Illinois</option>
72
+ <option value="IN">Indiana</option>
73
+ <option value="IA">Iowa</option>
74
+ <option value="KS">Kansas</option>
75
+ <option value="KY">Kentucky</option>
76
+ <option value="LA">Louisiana</option>
77
+ <option value="ME">Maine</option>
78
+ <option value="MD">Maryland</option>
79
+ <option value="MA">Massachusetts</option>
80
+ <option value="MI">Michigan</option>
81
+ <option value="MN">Minnesota</option>
82
+ <option value="MS">Mississippi</option>
83
+ <option value="MO">Missouri</option>
84
+ <option value="MT">Montana</option>
85
+ <option value="NE">Nebraska</option>
86
+ <option value="NV">Nevada</option>
87
+ <option value="NH">New Hampshire</option>
88
+ <option value="NJ">New Jersey</option>
89
+ <option value="NM">New Mexico</option>
90
+ <option value="NY">New York</option>
91
+ <option value="NC">North Carolina</option>
92
+ <option value="ND">North Dakota</option>
93
+ <option value="OH">Ohio</option>
94
+ <option value="OK">Oklahoma</option>
95
+ <option value="OR">Oregon</option>
96
+ <option value="PA">Pennsylvania</option>
97
+ <option value="RI">Rhode Island</option>
98
+ <option value="SC">South Carolina</option>
99
+ <option value="SD">South Dakota</option>
100
+ <option value="TN">Tennessee</option>
101
+ <option value="TX">Texas</option>
102
+ <option value="UT">Utah</option>
103
+ <option value="VT">Vermont</option>
104
+ <option value="VA">Virginia</option>
105
+ <option value="WA">Washington</option>
106
+ <option value="WV">West Virginia</option>
107
+ <option value="WI">Wisconsin</option>
108
+ <option value="WY" selected>Wyoming</option>
109
+ </select>
110
+ </pb-combo-box>
111
+ </fieldset>
112
+ <fieldset>
113
+ <p>Use i18n to translate options:</p>
114
+ <pb-combo-box placeholder="demo.select-animal">
115
+ <select name="anmial" multiple>
116
+ <option value="bird" data-i18n="demo.bird"></option>
117
+ <option value="dog" data-i18n="demo.dog"></option>
118
+ <option value="cat" data-i18n="demo.cat"></option>
119
+ </select>
120
+ </pb-combo-box>
121
+ </fieldset>
122
+ <button type="submit" class="pb-button pb-button--contained">Submit</button>
123
+ </form>
124
+ <p>Parameters which would be sent: <code id="output"></code></p>
125
+ <script type="module">
126
+ const form = document.getElementById('form')
127
+ const output = document.getElementById('output')
128
+ if (form && output) {
127
129
  form.addEventListener('submit', (ev) => {
128
- ev.preventDefault();
129
- const data = new URLSearchParams(new FormData(form)).toString();
130
- document.getElementById('output').innerHTML = data;
131
- });
130
+ ev.preventDefault()
131
+ const params = new URLSearchParams(new FormData(form)).toString()
132
+ output.textContent = params
133
+ })
134
+ }
132
135
  </script>
133
- </template>
134
- </pb-demo-snippet>
136
+ </pb-page>
137
+ </template>
138
+ </pb-demo-snippet>
139
+
140
+ </body>
135
141
 
136
- </body>
137
142
  </html>
package/dist/demo/pb-custom-form.html CHANGED
@@ -1,61 +1,70 @@
1
1
  <html>
2
- <head>
3
- <meta charset="utf-8"/>
4
- <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"/>
5
2
 
6
- <title>pb-split-list Demo</title>
7
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
8
- </head>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes" />
9
6
 
10
- <body>
11
- <pb-demo-snippet>
12
- <template>
13
- <style>
14
- fieldset {
15
- display: flex;
16
- align-items: center;
17
- border: 0;
18
- }
19
- fieldset * {
20
- margin-right: 20px;
21
- }
22
- </style>
23
- <pb-page endpoint="https://teipublisher.com/exist/apps/tei-publisher" api-version="1.0.0">
24
- <pb-custom-form auto-submit="paper-input,paper-icon-button,input,select,paper-dropdown-menu">
25
- <paper-input name="search" label="Search">
26
- <paper-icon-button icon="search" slot="suffix"></paper-icon-button>
27
- </paper-input>
28
- <fieldset>
29
- <label>
30
- <input type="radio" name="view" value="correspondents"> Korrespondenten
31
- </label>
32
- <label>
33
- <input type="radio" name="view" value="mentions"> Korrespondenten und erwähnte Personen
34
- </label>
35
- </fieldset>
36
- <fieldset>
37
- <select name="type">
38
- <option value="one">One</option>
39
- <option value="two">Two</option>
7
+ <title>pb-custom-form Demo</title>
8
+ <script type="module" src="../pb-components-bundle.js"></script>
9
+ </head>
10
+
11
+ <body>
12
+ <pb-demo-snippet>
13
+ <template>
14
+ <style>
15
+ fieldset {
16
+ display: flex;
17
+ align-items: center;
18
+ border: 0;
19
+ }
20
+
21
+ fieldset * {
22
+ margin-right: 20px;
23
+ }
24
+ </style>
25
+ <pb-page endpoint="https://teipublisher.com/exist/apps/tei-publisher" api-version="1.0.0">
26
+ <pb-custom-form auto-submit="input, select, button, pb-icon-button">
27
+ <label>
28
+ Search
29
+ <span style="display:inline-flex; align-items:center; gap:0.5rem;">
30
+ <input type="search" name="search" placeholder="Search" />
31
+ <pb-icon-button icon="search"></pb-icon-button>
32
+ </span>
33
+ </label>
34
+ <fieldset>
35
+ <label>
36
+ <input type="radio" name="view" value="correspondents"> Korrespondenten
37
+ </label>
38
+ <label>
39
+ <input type="radio" name="view" value="mentions"> Korrespondenten und erwähnte Personen
40
+ </label>
41
+ </fieldset>
42
+ <fieldset>
43
+ <select name="type">
44
+ <option value="one">One</option>
45
+ <option value="two">Two</option>
46
+ </select>
47
+ <label>
48
+ Sort
49
+ <select id="sort" name="sort">
50
+ <option value="author">Author</option>
51
+ <option value="title">Title</option>
40
52
  </select>
41
- <paper-dropdown-menu id="sort" label="Sort" name="sort">
42
- <paper-listbox slot="dropdown-content" class="dropdown-content" attr-for-selected="value">
43
- <paper-item value="author">Author</paper-item>
44
- <paper-item value="title">Title</paper-item>
45
- </paper-listbox>
46
- </paper-dropdown-menu>
47
- </fieldset>
48
- </pb-custom-form>
49
- <pre id="output"></pre>
50
- </pb-page>
51
- <script>
52
- window.addEventListener('WebComponentsReady', () => {
53
- pbEvents.subscribe('pb-submit', null, (ev) => {
54
- document.getElementById('output').innerText = JSON.stringify(ev.detail.params);
55
- });
53
+ </label>
54
+ </fieldset>
55
+ </pb-custom-form>
56
+ <pre id="output"></pre>
57
+ </pb-page>
58
+ <script>
59
+ window.addEventListener('WebComponentsReady', () => {
60
+ pbEvents.subscribe('pb-submit', null, (ev) => {
61
+ document.getElementById('output').innerText = JSON.stringify(ev.detail.params);
56
62
  });
57
- </script>
58
- </template>
59
- </pb-demo-snippet>
60
- </body>
63
+ });
64
+
65
+ </script>
66
+ </template>
67
+ </pb-demo-snippet>
68
+ </body>
69
+
61
70
  </html>
package/dist/demo/pb-dialog.html CHANGED
@@ -5,25 +5,31 @@
5
5
  <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes" />
6
6
 
7
7
  <title>pb-dialog Demo</title>
8
- <link rel="stylesheet" href="../css/pb-styles.css">
9
- <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script><script type="module" src="../pb-components-bundle.js"></script>
8
+ <script type="module" src="../pb-components-bundle.js"></script>
10
9
  </head>
11
10
 
12
11
  <body>
13
12
  <pb-demo-snippet>
14
13
  <template>
15
- <pb-page endpoint="https://teipublisher.com/exist/apps/tei-publisher" api-version="1.0.0">
16
- <pb-document id="document1" path="doc/documentation.xml" odd="docbook" view="div"></pb-document>
14
+ <pb-page>
17
15
  <main>
18
16
  <button onclick="document.getElementById('dialog1').openDialog()">Open Dialog</button>
19
- <pb-dialog id="dialog1" title="Dialog 1">
17
+ <pb-dialog id="dialog1">
20
18
  <h1 slot="title">Dialog 1</h1>
21
- <p>This is a dialog</p>
19
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
22
20
  </pb-dialog>
23
21
  </main>
24
22
  </pb-page>
25
23
  </template>
26
24
  </pb-demo-snippet>
25
+ <script type="module">
26
+ import { firePageReady } from '../src/docs/demo-utils.js'
27
+ if (document.readyState === 'loading') {
28
+ document.addEventListener('DOMContentLoaded', () => firePageReady({ endpoint: '/exist/apps/tei-publisher' }))
29
+ } else {
30
+ firePageReady({ endpoint: '/exist/apps/tei-publisher' })
31
+ }
32
+ </script>
27
33
  </body>
28
34
 
29
35
  </html>