u2ui 1.0.0

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 (440) hide show
  1. package/.htaccess +7 -0
  2. package/LICENSE +21 -0
  3. package/README.md +36 -0
  4. package/attr/behavior/README.md +25 -0
  5. package/attr/behavior/behavior.js +261 -0
  6. package/attr/behavior/manifest.json +43 -0
  7. package/attr/behavior/tests/minimal.html +19 -0
  8. package/attr/behavior/tests/test.html +98 -0
  9. package/attr/confirm/README.md +36 -0
  10. package/attr/confirm/confirm.js +90 -0
  11. package/attr/confirm/manifest.json +43 -0
  12. package/attr/confirm/tests/minimal.html +23 -0
  13. package/attr/confirm/tests/test.html +79 -0
  14. package/attr/draghandle/README.md +41 -0
  15. package/attr/draghandle/draghandle.js +42 -0
  16. package/attr/draghandle/tests/minimal.html +44 -0
  17. package/attr/focusgroup/README.md +49 -0
  18. package/attr/focusgroup/focusgroup.js +100 -0
  19. package/attr/focusgroup/manifest.json +38 -0
  20. package/attr/focusgroup/tests/minimal.html +27 -0
  21. package/attr/focusgroup/tests/test.html +154 -0
  22. package/attr/href/README.md +38 -0
  23. package/attr/href/href.js +42 -0
  24. package/attr/href/manifest.json +43 -0
  25. package/attr/href/tests/minimal.html +17 -0
  26. package/attr/href/tests/test.html +70 -0
  27. package/attr/intersect/README.md +42 -0
  28. package/attr/intersect/intersect.js +99 -0
  29. package/attr/intersect/manifest.json +57 -0
  30. package/attr/intersect/tests/minimal.html +30 -0
  31. package/attr/intersect/tests/test.html +64 -0
  32. package/attr/navigable/README.md +31 -0
  33. package/attr/navigable/TargetObserver.js +91 -0
  34. package/attr/navigable/U2TargetObserver.js +75 -0
  35. package/attr/navigable/manifest.json +42 -0
  36. package/attr/navigable/navigable.js +87 -0
  37. package/attr/navigable/tests/U1TargetObserver.html +56 -0
  38. package/attr/navigable/tests/minimal.html +17 -0
  39. package/attr/navigable/tests/targetObserver.html +106 -0
  40. package/attr/navigable/tests/test.html +84 -0
  41. package/attr/parallax/README.md +48 -0
  42. package/attr/parallax/parallax.js +119 -0
  43. package/attr/parallax/tests/minimal.html +25 -0
  44. package/attr/parallax/tests/performance.html +102 -0
  45. package/attr/parallax/tests/test.html +108 -0
  46. package/attr/skin/README.md +59 -0
  47. package/attr/skin/skin.css +51 -0
  48. package/attr/skin/tests/minimal.html +34 -0
  49. package/attr/skin/tests/test.html +96 -0
  50. package/class/badge/README.md +25 -0
  51. package/class/badge/badge.css +35 -0
  52. package/class/badge/tests/minimal.html +17 -0
  53. package/class/badge/tests/test.html +112 -0
  54. package/class/card1/README.md +45 -0
  55. package/class/card1/card1.css +30 -0
  56. package/class/card1/tests/minimal.html +33 -0
  57. package/class/card1/tests/test.html +78 -0
  58. package/class/flex/README.md +62 -0
  59. package/class/flex/flex.css +25 -0
  60. package/class/flex/tests/minimal.html +31 -0
  61. package/class/flex/tests/test.html +58 -0
  62. package/class/grid/README.md +52 -0
  63. package/class/grid/grid.css +40 -0
  64. package/class/grid/tests/minimal.html +34 -0
  65. package/class/grid/tests/test.html +78 -0
  66. package/class/input/README.md +49 -0
  67. package/class/input/input.css +33 -0
  68. package/class/input/tests/minimal.html +39 -0
  69. package/class/input/tests/test.html +29 -0
  70. package/class/reset/README.md +47 -0
  71. package/class/reset/reset.css +8 -0
  72. package/class/reset/tests/minimal.html +23 -0
  73. package/class/table/README.md +57 -0
  74. package/class/table/table.css +126 -0
  75. package/class/table/tests/minimal.html +40 -0
  76. package/class/table/tests/test.html +226 -0
  77. package/class/unstyle/README.md +32 -0
  78. package/class/unstyle/tests/minimal.html +22 -0
  79. package/class/unstyle/tests/test.html +32 -0
  80. package/class/unstyle/unstyle.css +12 -0
  81. package/class/width/README.md +48 -0
  82. package/class/width/tests/minimal.html +27 -0
  83. package/class/width/tests/test.html +101 -0
  84. package/class/width/width.css +22 -0
  85. package/css/base/README.md +25 -0
  86. package/css/base/base.css +127 -0
  87. package/css/base/beta.css +50 -0
  88. package/css/base/full.css +5 -0
  89. package/css/base/nomotion.css +9 -0
  90. package/css/base/print.css +36 -0
  91. package/css/base/tests/nomotion.html +89 -0
  92. package/css/base/tests/test.html +539 -0
  93. package/css/classes/README.md +17 -0
  94. package/css/classes/classes.css +78 -0
  95. package/css/classes/tests/test.html +63 -0
  96. package/css/classless/README.md +26 -0
  97. package/css/classless/aria.css +64 -0
  98. package/css/classless/classless.css +124 -0
  99. package/css/classless/full.css +11 -0
  100. package/css/classless/more.css +340 -0
  101. package/css/classless/simple.css +103 -0
  102. package/css/classless/snippeds/a/icons.css +12 -0
  103. package/css/classless/snippeds/experiments/conventions.css +41 -0
  104. package/css/classless/snippeds/hr/gradient.css +3 -0
  105. package/css/classless/snippeds/hr/section_sign.css +16 -0
  106. package/css/classless/snippeds/hr/tests.html +50 -0
  107. package/css/classless/tests/aria.html +101 -0
  108. package/css/classless/tests/foreign/classless-almond.css.html +445 -0
  109. package/css/classless/tests/foreign/classless-classless.css.html +831 -0
  110. package/css/classless/tests/foreign/classless-mvp.html +415 -0
  111. package/css/classless/tests/foreign/classless.sakura.html +224 -0
  112. package/css/classless/tests/foreign/stylestage.dev.html +304 -0
  113. package/css/classless/tests/foreign/test-homogenizer.html +433 -0
  114. package/css/classless/tests/foreign/test-html5-elements-tester.html +956 -0
  115. package/css/classless/tests/foreign/test-opinionated_css.html +148 -0
  116. package/css/classless/tests/list-bullet.html +110 -0
  117. package/css/classless/tests/more.html +246 -0
  118. package/css/classless/tests/oklch.experiments.html +280 -0
  119. package/css/classless/tests/test.html +106 -0
  120. package/css/classless/tests/variables.html +109 -0
  121. package/css/classless/variables.css +99 -0
  122. package/css/norm/README.md +37 -0
  123. package/css/norm/beta.css +40 -0
  124. package/css/norm/norm.css +98 -0
  125. package/css/norm/oldies.css +60 -0
  126. package/css/norm/tests/test.html +434 -0
  127. package/css/norm/tests/test.js +103 -0
  128. package/el/accordion/README.md +59 -0
  129. package/el/accordion/accordion.css +7 -0
  130. package/el/accordion/accordion.js +258 -0
  131. package/el/accordion/manifest.json +57 -0
  132. package/el/accordion/tests/minimal.html +44 -0
  133. package/el/accordion/tests/test.html +168 -0
  134. package/el/alert/README.md +67 -0
  135. package/el/alert/alert copy.js +224 -0
  136. package/el/alert/alert.css +73 -0
  137. package/el/alert/alert.js +187 -0
  138. package/el/alert/manifest.json +77 -0
  139. package/el/alert/tests/minimal.html +36 -0
  140. package/el/alert/tests/test.html +105 -0
  141. package/el/buttongroup/README.md +36 -0
  142. package/el/buttongroup/buttongroup.css +30 -0
  143. package/el/buttongroup/buttongroup.js +56 -0
  144. package/el/buttongroup/tests/minimal.html +31 -0
  145. package/el/buttongroup/tests/test.html +83 -0
  146. package/el/bytes/README.md +41 -0
  147. package/el/bytes/bytes.css +6 -0
  148. package/el/bytes/bytes.js +97 -0
  149. package/el/bytes/manifest.json +95 -0
  150. package/el/bytes/tests/minimal.html +19 -0
  151. package/el/bytes/tests/test.html +117 -0
  152. package/el/carousel/README.md +52 -0
  153. package/el/carousel/carousel.css +46 -0
  154. package/el/carousel/carousel.js +371 -0
  155. package/el/carousel/manifest.json +58 -0
  156. package/el/carousel/tests/experiments.html +77 -0
  157. package/el/carousel/tests/minimal.html +31 -0
  158. package/el/carousel/tests/nested.html +54 -0
  159. package/el/carousel/tests/test.html +136 -0
  160. package/el/carousel-nav/README.md +40 -0
  161. package/el/carousel-nav/carousel-nav.js +74 -0
  162. package/el/carousel-nav/tests/minimal.html +32 -0
  163. package/el/carousel-nav/tests/test.html +59 -0
  164. package/el/code/README.md +68 -0
  165. package/el/code/code.css +46 -0
  166. package/el/code/code.js +289 -0
  167. package/el/code/manifest.json +66 -0
  168. package/el/code/tests/minimal.html +35 -0
  169. package/el/code/tests/test.html +162 -0
  170. package/el/copy/README.md +35 -0
  171. package/el/copy/copy.css +3 -0
  172. package/el/copy/copy.js +118 -0
  173. package/el/copy/manifest.json +49 -0
  174. package/el/copy/tests/minimal.html +21 -0
  175. package/el/copy/tests/test.html +75 -0
  176. package/el/counter/README.md +47 -0
  177. package/el/counter/counter.css +8 -0
  178. package/el/counter/counter.js +95 -0
  179. package/el/counter/manifest.json +59 -0
  180. package/el/counter/tests/minimal.html +27 -0
  181. package/el/counter/tests/test.html +106 -0
  182. package/el/ico/README.md +162 -0
  183. package/el/ico/font/Font Awesome.css +22 -0
  184. package/el/ico/font/LigatureSymbols.css +7 -0
  185. package/el/ico/font/Material Icons.css +6 -0
  186. package/el/ico/font/RemixFilled.css +8 -0
  187. package/el/ico/font/RemixOutlined.css +8 -0
  188. package/el/ico/font/old/anicons.css +31 -0
  189. package/el/ico/font/old/devicons.css +210 -0
  190. package/el/ico/font/old/material.all.css +36 -0
  191. package/el/ico/font/old/remix.css +15 -0
  192. package/el/ico/font/old/utf8.css +54 -0
  193. package/el/ico/ico.css +111 -0
  194. package/el/ico/ico.js +189 -0
  195. package/el/ico/manifest.json +86 -0
  196. package/el/ico/tests/combinations.html +86 -0
  197. package/el/ico/tests/emojis.html +213 -0
  198. package/el/ico/tests/fonts.html +110 -0
  199. package/el/ico/tests/ico-directory.html +254 -0
  200. package/el/ico/tests/minimal.html +46 -0
  201. package/el/ico/tests/test.html +210 -0
  202. package/el/ico/tests/util-multi.svg +6 -0
  203. package/el/ico/tests/util.css +2 -0
  204. package/el/ico/tests/util.js +110 -0
  205. package/el/input/README.md +39 -0
  206. package/el/input/input.css +35 -0
  207. package/el/input/input.js +331 -0
  208. package/el/input/tests/formParticipation.html +113 -0
  209. package/el/input/tests/minimal.html +33 -0
  210. package/el/input/tests/test.html +258 -0
  211. package/el/masonry/README.md +51 -0
  212. package/el/masonry/manifest.json +60 -0
  213. package/el/masonry/masonry.css +27 -0
  214. package/el/masonry/masonry.js +92 -0
  215. package/el/masonry/tests/minimal.html +39 -0
  216. package/el/masonry/tests/test.html +42 -0
  217. package/el/number/README.md +47 -0
  218. package/el/number/manifest.json +121 -0
  219. package/el/number/number.css +6 -0
  220. package/el/number/number.js +67 -0
  221. package/el/number/tests/minimal.html +25 -0
  222. package/el/number/tests/test.html +138 -0
  223. package/el/out/README.md +32 -0
  224. package/el/out/manifest.json +38 -0
  225. package/el/out/out.css +2 -0
  226. package/el/out/out.js +59 -0
  227. package/el/out/tests/minimal.html +25 -0
  228. package/el/out/tests/test.html +37 -0
  229. package/el/parallax-bg/README.md +36 -0
  230. package/el/parallax-bg/parallax-bg.css +13 -0
  231. package/el/parallax-bg/parallax-bg.js +186 -0
  232. package/el/parallax-bg/tests/bg.jpg +0 -0
  233. package/el/parallax-bg/tests/bg1.jpg +0 -0
  234. package/el/parallax-bg/tests/bg2.jpg +0 -0
  235. package/el/parallax-bg/tests/demo.html +88 -0
  236. package/el/parallax-bg/tests/minimal.html +30 -0
  237. package/el/parallax-bg/tests/test.html +64 -0
  238. package/el/parallax-bg/tests/visible.html +90 -0
  239. package/el/qrcode/README.md +38 -0
  240. package/el/qrcode/manifest.json +43 -0
  241. package/el/qrcode/package.json +22 -0
  242. package/el/qrcode/qrcode.css +13 -0
  243. package/el/qrcode/qrcode.js +46 -0
  244. package/el/qrcode/tests/minimal.html +26 -0
  245. package/el/qrcode/tests/test.html +31 -0
  246. package/el/rating/README.md +45 -0
  247. package/el/rating/manifest.json +65 -0
  248. package/el/rating/rating.css +11 -0
  249. package/el/rating/rating.js +139 -0
  250. package/el/rating/tests/minimal.html +26 -0
  251. package/el/rating/tests/tests.html +77 -0
  252. package/el/rte/README.md +37 -0
  253. package/el/rte/rte.css +9 -0
  254. package/el/rte/rte.js +56 -0
  255. package/el/rte/tests/minimal.html +25 -0
  256. package/el/rte/tests/test.html +37 -0
  257. package/el/skeleton/README.md +30 -0
  258. package/el/skeleton/manifest.json +51 -0
  259. package/el/skeleton/skeleton.css +61 -0
  260. package/el/skeleton/skeleton.js +72 -0
  261. package/el/skeleton/tests/minimal.html +22 -0
  262. package/el/skeleton/tests/test.html +22 -0
  263. package/el/splitbutton/README.md +39 -0
  264. package/el/splitbutton/splitbutton.css +48 -0
  265. package/el/splitbutton/splitbutton.js +26 -0
  266. package/el/splitbutton/tests/minimal.html +30 -0
  267. package/el/splitbutton/tests/test.html +68 -0
  268. package/el/splitpanel/README.md +39 -0
  269. package/el/splitpanel/manifest.json +49 -0
  270. package/el/splitpanel/splitpanel.css +17 -0
  271. package/el/splitpanel/splitpanel.js +116 -0
  272. package/el/splitpanel/tests/minimal.html +31 -0
  273. package/el/splitpanel/tests/tests.html +121 -0
  274. package/el/table/README.md +68 -0
  275. package/el/table/manifest.json +43 -0
  276. package/el/table/table.css +59 -0
  277. package/el/table/table.js +194 -0
  278. package/el/table/tests/minimal.html +38 -0
  279. package/el/table/tests/test.html +108 -0
  280. package/el/tabs/README.md +50 -0
  281. package/el/tabs/manifest.json +59 -0
  282. package/el/tabs/tabs.css +23 -0
  283. package/el/tabs/tabs.js +210 -0
  284. package/el/tabs/tests/minimal.html +35 -0
  285. package/el/tabs/tests/test.html +180 -0
  286. package/el/textfit/README.md +34 -0
  287. package/el/textfit/manifest.json +45 -0
  288. package/el/textfit/tests/minimal.html +25 -0
  289. package/el/textfit/tests/test.html +26 -0
  290. package/el/textfit/textfit.css +6 -0
  291. package/el/textfit/textfit.js +80 -0
  292. package/el/time/README.md +72 -0
  293. package/el/time/manifest.json +118 -0
  294. package/el/time/tests/minimal.html +19 -0
  295. package/el/time/tests/test.html +160 -0
  296. package/el/time/time copy.js +141 -0
  297. package/el/time/time.js +168 -0
  298. package/el/time/time.old.uhtml.js +129 -0
  299. package/el/tooltip/README.md +48 -0
  300. package/el/tooltip/manifest.json +69 -0
  301. package/el/tooltip/tests/minimal.html +25 -0
  302. package/el/tooltip/tests/test.html +178 -0
  303. package/el/tooltip/tooltip.css +97 -0
  304. package/el/tooltip/tooltip.js +82 -0
  305. package/el/tree1/README.md +111 -0
  306. package/el/tree1/manifest.json +78 -0
  307. package/el/tree1/tests/animated.html +134 -0
  308. package/el/tree1/tests/custom.html +51 -0
  309. package/el/tree1/tests/minimal.html +44 -0
  310. package/el/tree1/tests/test.html +260 -0
  311. package/el/tree1/tree1.css +26 -0
  312. package/el/tree1/tree1.js +265 -0
  313. package/el/typewriter/README.md +62 -0
  314. package/el/typewriter/manifest.json +66 -0
  315. package/el/typewriter/tests/minimal.html +25 -0
  316. package/el/typewriter/tests/test.html +78 -0
  317. package/el/typewriter/typewriter.css +6 -0
  318. package/el/typewriter/typewriter.js +166 -0
  319. package/el/typewriter/typewriter.mp3 +0 -0
  320. package/js/Placer/Placer.js +156 -0
  321. package/js/Placer/README.md +62 -0
  322. package/js/Placer/tests/minimal.html +34 -0
  323. package/js/Placer/tests/test.html +49 -0
  324. package/js/PointerObserver/PointerObserver.js +130 -0
  325. package/js/PointerObserver/README.md +34 -0
  326. package/js/PointerObserver/tests/minimal.html +29 -0
  327. package/js/PointerObserver/tests/test.html +35 -0
  328. package/js/SelectorObserver/README.md +47 -0
  329. package/js/SelectorObserver/SelectorObserver.js +201 -0
  330. package/js/SelectorObserver/tests/minimal.html +21 -0
  331. package/js/SelectorObserver/tests/test.html +57 -0
  332. package/js/SelectorObserver/tests/tests.html +161 -0
  333. package/js/contextmenu/README.md +93 -0
  334. package/js/contextmenu/contextmenu.js +336 -0
  335. package/js/contextmenu/tests/minimal.html +44 -0
  336. package/js/contextmenu/tests/test.html +131 -0
  337. package/js/dialog/README.md +49 -0
  338. package/js/dialog/dialog.js +261 -0
  339. package/js/dialog/notification.mp3 +0 -0
  340. package/js/dialog/tests/minimal.html +29 -0
  341. package/js/dialog/tests/notification.mp3 +0 -0
  342. package/js/dialog/tests/test.html +135 -0
  343. package/js/rte/README.md +44 -0
  344. package/js/rte/old/NodeCleaner.js +315 -0
  345. package/js/rte/old/Rte/Rte.mjs +316 -0
  346. package/js/rte/old/Rte/Rte.ui.items.mjs +543 -0
  347. package/js/rte/old/Rte/Rte.ui.mjs +154 -0
  348. package/js/rte/old/Rte/crossbrowser.mjs +323 -0
  349. package/js/rte/old/Rte/font/tinymce.svg +98 -0
  350. package/js/rte/old/Rte/font/tinymce.woff +0 -0
  351. package/js/rte/old/Rte/helpers.mjs +159 -0
  352. package/js/rte/old/Rte/htmlparser.mjs +178 -0
  353. package/js/rte/old/Rte/index.mjs +5 -0
  354. package/js/rte/old/Rte/main.css +189 -0
  355. package/js/rte/old/old.rte.js +132 -0
  356. package/js/rte/old/range-selection.old.js +394 -0
  357. package/js/rte/rte.js +7 -0
  358. package/js/rte/src/behavior.js +228 -0
  359. package/js/rte/src/events.js +73 -0
  360. package/js/rte/src/fixes.js +251 -0
  361. package/js/rte/src/range.js +472 -0
  362. package/js/rte/src/rte.js +72 -0
  363. package/js/rte/src/ui/items/ai.js +167 -0
  364. package/js/rte/src/ui/items/code.js +93 -0
  365. package/js/rte/src/ui/items/undo.js +183 -0
  366. package/js/rte/src/ui.items.js +571 -0
  367. package/js/rte/src/ui.js +269 -0
  368. package/js/rte/src/util/htmlparser.js +178 -0
  369. package/js/rte/src/util/indentHtml.js +48 -0
  370. package/js/rte/tests/ai.html +81 -0
  371. package/js/rte/tests/behavior.html +88 -0
  372. package/js/rte/tests/events.html +69 -0
  373. package/js/rte/tests/fixes.html +95 -0
  374. package/js/rte/tests/minimal.html +34 -0
  375. package/js/rte/tests/notes.md +6 -0
  376. package/js/rte/tests/range.html +167 -0
  377. package/js/rte/tests/selection-explorer.html +222 -0
  378. package/js/rte/tests/test.html +92 -0
  379. package/js/shortcut/README.md +33 -0
  380. package/js/shortcut/shortcut.js +89 -0
  381. package/js/shortcut/tests/minimal.html +23 -0
  382. package/js/shortcut/tests/test.html +68 -0
  383. package/package.json +12 -0
  384. package/u2/README.md +4 -0
  385. package/u2/auto.js +161 -0
  386. package/u2/auto.ui.js +85 -0
  387. package/u2/experiments/Waiter/test.html +132 -0
  388. package/u2/experiments/getElementByIdPromise/test.html +76 -0
  389. package/u2/experiments/patchInputValue.html +124 -0
  390. package/u2/experiments/radiobutton/test.html +75 -0
  391. package/u2/experiments/tests/test.html +223 -0
  392. package/u2/experiments/u1-responsive/responsive.js +62 -0
  393. package/u2/experiments/u1-responsive/test.html +65 -0
  394. package/u2/experiments/u2Element.js +139 -0
  395. package/u2/experiments/u2Element.test.html +47 -0
  396. package/u2/old-stuff/IterableWeakMap/mod.js +70 -0
  397. package/u2/old-stuff/css/onStyleSheet/mod.js +114 -0
  398. package/u2/old-stuff/css/onStyleSheet/monkeypatches.js +28 -0
  399. package/u2/old-stuff/css/onStyleSheet/test/include.css +19 -0
  400. package/u2/old-stuff/css/onStyleSheet/test/style-has-include.css +6 -0
  401. package/u2/old-stuff/css/onStyleSheet/test/style-no-include.css +3 -0
  402. package/u2/old-stuff/css/onStyleSheet/test/test.html +48 -0
  403. package/u2/old-stuff/css/parser/mod.js +182 -0
  404. package/u2/old-stuff/css/parser/parser_old/mod.js +128 -0
  405. package/u2/old-stuff/css/parser/parser_old/test.html +43 -0
  406. package/u2/old-stuff/css/parser/parser_old/util.js +22 -0
  407. package/u2/old-stuff/css/parser/style.html +52 -0
  408. package/u2/old-stuff/css/parser/test.html +38 -0
  409. package/u2/old-stuff/el/ai-texter/README.md +23 -0
  410. package/u2/old-stuff/el/ai-texter/ai-texter.css +12 -0
  411. package/u2/old-stuff/el/ai-texter/ai-texter.js +153 -0
  412. package/u2/old-stuff/el/ai-texter/tests/minimal.html +47 -0
  413. package/u2/old-stuff/el/ai-texter/tests/test.html +71 -0
  414. package/u2/old-stuff/init.js +38 -0
  415. package/u2/old-stuff/markHashLinks.js +51 -0
  416. package/u2/old-stuff/onElement/mod.js +73 -0
  417. package/u2/old-stuff/test-helpers/mod.js +36 -0
  418. package/u2/old-stuff/test-helpers/test.html +4 -0
  419. package/u2/old-stuff/tests/init.js.html +51 -0
  420. package/u2/old-stuff/viewport.js +64 -0
  421. package/u2/projects.json +468 -0
  422. package/u2/tests/boilerplate.html +46 -0
  423. package/u2/tests/kacheln.html +245 -0
  424. package/u2/tests/showcase.html +270 -0
  425. package/u2/tests/showcase2.html +157 -0
  426. package/u2/tests/test-init.js +35 -0
  427. package/u2/tests/test.html +355 -0
  428. package/u2/tools/baseElement.js +95 -0
  429. package/u2/tools/baseElement.test.html +119 -0
  430. package/u2/tools/ce-inspector.js +308 -0
  431. package/u2/tools/ce-inspector.test.html +66 -0
  432. package/u2/tools/ce-manfest-from-element.js +207 -0
  433. package/u2/tools/dev-iframe.js +213 -0
  434. package/u2/tools/dev-iframe.test.html +75 -0
  435. package/u2/tools/eventsExplorer.js +101 -0
  436. package/u2/tools/logo/u1.svg +9 -0
  437. package/u2/tools/logo/u1ui.svg +6 -0
  438. package/u2/tools/update.repos.json.js +234 -0
  439. package/u2/u2.js +14 -0
  440. package/u2/utils.js +59 -0
package/css/classless/tests/oklch.experiments.html ADDED
@@ -0,0 +1,280 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>TEST</title>
6
+ <meta name="viewport" content="width=device-width">
7
+ <!-- <script src="../../../u2/tests/test-init.js" type=module async></script> -->
8
+ <!--script src="./test.js" type=module></script-->
9
+
10
+ <script src="../../js/init.js" type=module crossorigin></script>
11
+ <link href="../../../css/base/full.css" crossorigin rel=stylesheet>
12
+
13
+ <link rel="stylesheet" href="../classless.css">
14
+ <link rel="stylesheet" href="../more.css">
15
+
16
+ <body>
17
+
18
+ <style>
19
+ html {
20
+ --ok-l: .8;
21
+ --ok-c: .3;
22
+ --ok-h: 120;
23
+
24
+ --color: oklch(var(--ok-l) var(--ok-c) var(--ok-h));
25
+ --color-light: color-mix(in srgb, var(--color), white 90%);
26
+ --color-dark: color-mix(in srgb, var(--color), black 40%);
27
+
28
+ /* named */
29
+ --color-bg: color-mix(in srgb, var(--color), white 99.5%);
30
+ --color-text: color-mix(in srgb, var(--color), black 90%);
31
+ --color-area: var(--color-light);
32
+ --color-line: var(--color-text);
33
+
34
+ --red: oklch(var(--ok-l) var(--ok-c) 20);
35
+ --orange: oklch(var(--ok-l) var(--ok-c) 80);
36
+ --yellow: oklch(var(--ok-l) var(--ok-c) 100);
37
+ --green: oklch(var(--ok-l) var(--ok-c) 120);
38
+ --cyan: oklch(var(--ok-l) var(--ok-c) 180);
39
+ --blue: oklch(var(--ok-l) var(--ok-c) 240);
40
+ --purple: oklch(var(--ok-l) var(--ok-c) 280);
41
+ --pink: oklch(var(--ok-l) var(--ok-c) 320);
42
+
43
+ --line-width: 1px;
44
+ }
45
+
46
+
47
+
48
+
49
+ </style>
50
+
51
+ <div class=container>
52
+
53
+ <section>
54
+ <div style="display:flex; gap:1rem">
55
+ <div style="width:100px; height:100px; background:var(--color)">--color</div>
56
+ <div style="width:100px; height:100px; background:var(--color-light)">--color-light</div>
57
+ <div style="width:100px; height:100px; background:var(--color-dark)">--color-dark</div>
58
+ <div style="width:100px; height:100px; background:var(--color-bg)">--color-bg</div>
59
+ <div style="width:100px; height:100px; background:var(--color-text)">--color-text</div>
60
+ <div style="width:100px; height:100px; background:var(--color-area)">--color-area</div>
61
+ <div style="width:100px; height:100px; background:var(--color-line)">--color-line</div>
62
+ </div>
63
+ <div style="display:flex; gap:1rem">
64
+ <div style="width:100px; height:100px; background:var(--red)">--red</div>
65
+ <div style="width:100px; height:100px; background:var(--orange)">--orange</div>
66
+ <div style="width:100px; height:100px; background:var(--yellow)">--yellow</div>
67
+ <div style="width:100px; height:100px; background:var(--green)">--green</div>
68
+ <div style="width:100px; height:100px; background:var(--cyan)">--cyan</div>
69
+ <div style="width:100px; height:100px; background:var(--blue)">--blue</div>
70
+ <div style="width:100px; height:100px; background:var(--purple)">--purple</div>
71
+ <div style="width:100px; height:100px; background:var(--pink)">--pink</div>
72
+
73
+ </div>
74
+ </section>
75
+
76
+
77
+
78
+ <section>
79
+ <h1>List Item</h1>
80
+ <ul>
81
+ <li>List item 1
82
+ <li>List item 2
83
+ <li>List item 3
84
+ <li>List item 4
85
+ </ul>
86
+ </section>
87
+
88
+ <section>
89
+ <h1>select arrow down</h1>
90
+ <table style="white-space:nowrap">
91
+ <tbody style="vertical-align:top">
92
+ <tr>
93
+ <td> Normal
94
+ <td> Size-Attribute <br><small> (not affected)</small>
95
+ <td> Multiple-Attribute <br><small> (not affected)</small>
96
+ <tr>
97
+ <td>
98
+ <select aria-label="test normal">
99
+ <option>Option 1
100
+ <option>Option 2
101
+ <option>Option 3
102
+ </select>
103
+ <td>
104
+ <select size=2 aria-label="test size 2">
105
+ <option>Option 1
106
+ <option>Option 2
107
+ <option>Option 3
108
+ </select>
109
+ <td>
110
+ <select multiple aria-label="test multiple">
111
+ <option>Option 1
112
+ <option>Option 2
113
+ <option>Option 3
114
+ </select>
115
+ </table>
116
+ </section>
117
+
118
+ <section>
119
+ <h1>radio / checkbox</h1>
120
+ <table style="white-space:nowrap; text-align:center">
121
+ <tr>
122
+ <td style="text-align:end">
123
+ <td> No checked
124
+ <td> Checked
125
+ <td> disabled
126
+ <td> checked disabled
127
+ <td> indeterminate <small>todo</small>
128
+ <tr>
129
+ <td style="text-align:end"> Checkbox
130
+ <td> <input type=checkbox>
131
+ <td> <input type=checkbox checked>
132
+ <td> <input type=checkbox disabled>
133
+ <td> <input type=checkbox checked disabled>
134
+ <td> <input type=checkbox id=indeterminate1>
135
+ <tr>
136
+ <td style="text-align:end"> Radio
137
+ <td> <input type=radio name=radio>
138
+ <td> <input type=radio name=radio checked>
139
+ <td> <input type=radio name=radiox disabled>
140
+ <td> <input type=radio name=radiox checked disabled>
141
+ <td> <input type=radio id=indeterminate2>
142
+ </table>
143
+ <script>
144
+ indeterminate1.indeterminate = true;
145
+ indeterminate2.indeterminate = true;
146
+ </script>
147
+ <br>
148
+ <label>
149
+ <input type=checkbox> Has a label, hover it will show an indicator
150
+ </label>
151
+ </section>
152
+
153
+
154
+ <section>
155
+ <h1>Color-Input</h1>
156
+ <label>
157
+ Select your color: <input type=color>
158
+ </label>
159
+
160
+ </section>
161
+
162
+ <section>
163
+ <h1>Range-Input</h1>
164
+ <label>
165
+ Range with label<br>
166
+ <input type=range>
167
+ </label>
168
+ </section>
169
+
170
+ <section>
171
+ <h1>Scrollbars</h1>
172
+ <div style="align-items:center; display:flex; flex-wrap:wrap; gap:1rem">
173
+ <div style="overflow:auto; width:200px; height:200px; display:inline-block;">
174
+ <div style="width:300px; height:300px; display:flex; place-items:center;">
175
+ Here a Div<br>
176
+ inside overflow:auto
177
+ </div>
178
+ </div>
179
+ <label>
180
+ <textarea style="width:200px">Here a textarea that has scrollbars. Here a textarea that has scrollbars. Here a textarea that has scrollbars. Here a textarea that has scrollbars.</textarea>
181
+ </label>
182
+ <label>
183
+ <select size=2>
184
+ <option>See
185
+ <option>Multiple
186
+ <option>Options
187
+ </select>
188
+ </label>
189
+ </div>
190
+ </section>
191
+
192
+
193
+ <section>
194
+ <h1>:autofill</h1>
195
+ <form>
196
+ <label>Text Input <input id=x type=text> </label><br>
197
+ <label>Password <input id=y type=password></label><br>
198
+ </form>
199
+ <form>
200
+ <label> Name: <input name=name> </label><br>
201
+ <label> Firstname: <input name=firstname> </label><br>
202
+ <label> Company: <input name=company> </label><br>
203
+ <label> E-Mail: <input type=email name=email> </label><br>
204
+ </form>
205
+ </section>
206
+
207
+ <section>
208
+ <h1>::selection</h1>
209
+ <h1 id=selectionTest>Some text</h1>
210
+ <script>
211
+ var r = new Range()
212
+ r.selectNodeContents(selectionTest);
213
+ getSelection().addRange(r);
214
+ </script>
215
+ </section>
216
+
217
+ <section>
218
+ <h1>input type=number</h1>
219
+ <label>
220
+ Demo:
221
+ <input type=number step=".5" min="-.5" max="4">
222
+ </label>
223
+ </section>
224
+
225
+
226
+ <section style="width:30rem">
227
+ <h1>details / summary</h1>
228
+
229
+ <details>
230
+ <summary>Security</summary>
231
+ <div>
232
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. Fuga perspiciatis quidem sunt animi. Veniam accusamus illum, iste, hic aperiam ratione nemo, doloremque aliquid ipsum magnam dolorum cumque ducimus! Nobis, officia.
233
+ </div>
234
+ </details>
235
+ <details>
236
+ <summary>Pricing</summary>
237
+ <div>
238
+ <ul>
239
+ <li>Cash on hand: $500.00</li>
240
+ <li>Current invoice: $75.30</li>
241
+ <li>Due date: 5/6/19</li>
242
+ </ul>
243
+ </div>
244
+ </details>
245
+ <details>
246
+ <summary>Nested</summary>
247
+
248
+ <details>
249
+ <summary>Sub-Detail 1</summary>
250
+ <p>
251
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. Fuga perspiciatis quidem sunt animi. Veniam accusamus illum, iste, hic aperiam ratione nemo, doloremque aliquid ipsum magnam dolorum cumque ducimus! Nobis, officia.
252
+ </p>
253
+ </details>
254
+ <details>
255
+ <summary>Sub-Detail 2</summary>
256
+ <p>
257
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. Fuga perspiciatis quidem sunt animi. Veniam accusamus illum, iste, hic aperiam ratione nemo, doloremque aliquid ipsum magnam dolorum cumque ducimus! Nobis, officia.
258
+ </p>
259
+ <p>
260
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. Fuga perspiciatis quidem sunt animi. Veniam accusamus illum, iste, hic aperiam ratione nemo, doloremque aliquid ipsum magnam dolorum cumque ducimus! Nobis, officia.
261
+ </p>
262
+ </details>
263
+
264
+ </details>
265
+
266
+ </section>
267
+ </div>
268
+
269
+ <div id=shadowed></div>
270
+ <script>
271
+
272
+ shadowDeepCss = function(shadow){
273
+ for (let ss of document.styleSheets) shadow.append(ss.ownerNode.cloneNode());
274
+ }
275
+
276
+ let shadow = shadowed.attachShadow({mode: 'open'});
277
+ shadowDeepCss(shadow);
278
+ shadow.innerHTML += '<br><br><hr><h1>Same inside shadow-dom (Experiment)</h1>'+document.body.innerHTML;
279
+
280
+ </script>
package/css/classless/tests/test.html ADDED
@@ -0,0 +1,106 @@
1
+ <!DOCTYPE html>
2
+ <html lang=en>
3
+ <head>
4
+ <meta charset=utf-8>
5
+ <meta name=viewport content="width=device-width">
6
+ <title>tests</title>
7
+ <script src=../../../u2/tests/test-init.js type=module></script>
8
+
9
+ <link rel=stylesheet href="../../../css/norm/norm.css">
10
+ <link rel=stylesheet href="../../../css/base/base.css">
11
+ <link rel=stylesheet href="../variables.css">
12
+ <link rel=stylesheet href="../classless.css">
13
+
14
+ <style>
15
+ body {
16
+ padding:2rem;
17
+ }
18
+ </style>
19
+
20
+
21
+ <body>
22
+
23
+ <section>
24
+ <h2>Global (html)</h2>
25
+ <ul>
26
+ <li>The color of native elements are in the theme-color
27
+ <li>background-color
28
+ <li>Text-color
29
+ </ul>
30
+
31
+ <label>
32
+ Checkbox
33
+ <input type=checkbox checked>
34
+ </label>
35
+
36
+ <label>
37
+ Range
38
+ <input type=range>
39
+ </label>
40
+
41
+
42
+ <h2>Links (a)</h2>
43
+ <a href="file://asfasf.asfasef.asfsef/asef.ch">Link color is the theme-color, also test hover and focus</a><br>
44
+ <a href="https://www.google.com/">Visited links</a>
45
+
46
+ <h2>Line (HR)</h2>
47
+
48
+ <hr>
49
+
50
+ <h2>Flow content</h2>
51
+ <p>Headings, Paragraphs, list.. have not margin-top if they are first and not margin-bottom if they are last</p>
52
+
53
+ <div style="border:1px solid">
54
+ <h1>This is a H1</h1>
55
+ <h6>This is a H6</h6>
56
+ </div>
57
+ <div style="border:1px solid">
58
+ <ul><li>This is a list</ul>
59
+ <p>This is a paragraph</p>
60
+ </div>
61
+
62
+ <h2>Tables</h2>
63
+ <ul>
64
+ <li>Stretched to available width
65
+ <!--li>Smaller font (.8rem)
66
+ <li>Rows have a border between -->
67
+ <li>cells have a padding of .5em
68
+ </ul>
69
+
70
+ <table>
71
+ <thead>
72
+ <tr>
73
+ <th>Header 1
74
+ <th>Header 2
75
+ <tbody>
76
+ <tr>
77
+ <td>Cell 1
78
+ <td>Cell 2
79
+ <tr>
80
+ <td>Cell 1
81
+ <td>Cell 2
82
+ <tr>
83
+ <td>Cell 1
84
+ <td>Cell 2
85
+
86
+ </table>
87
+
88
+ <h2>Focus</h2>
89
+
90
+ <ul>
91
+ <li>Every focued element has a outline, if focused by keyboard
92
+ <li>If the element is active, the outline gets bigger
93
+ </ul>
94
+
95
+ <label>
96
+ Test focus
97
+ <input>
98
+ </label>
99
+
100
+
101
+ <h2>Code</h2>
102
+ <p> to be continued..., generate this testpage from the css file?</p>
103
+ </section>
104
+
105
+
106
+ </html>
package/css/classless/tests/variables.html ADDED
@@ -0,0 +1,109 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width">
6
+ <script src="../../../u2/tests/test-init.js" type=module async></script>
7
+
8
+ <title>Level.css TEST</title>
9
+
10
+ <script src="./test.js" type=module async></script>
11
+
12
+ <link rel="stylesheet" href="../../../css/base/full.css">
13
+
14
+ <link rel="stylesheet" href="../variables.css">
15
+ <link rel="stylesheet" href="../classless.css">
16
+ <link rel="stylesheet" href="../more.css">
17
+
18
+ <style>
19
+ body {
20
+ padding:2rem;
21
+ xdisplay: grid;
22
+ xgap:1rem;
23
+ xgrid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
24
+ }
25
+ body > * {
26
+ padding:1rem;
27
+ xbackground:#eee;
28
+ xmin-height:300px;
29
+ }
30
+ .colors {
31
+ display:grid;
32
+ grid-template-columns:repeat(auto-fill, minmax(160px,1fr));
33
+ gap:1rem;
34
+ }
35
+ .colors > * {
36
+ height:120px;
37
+ display:flex;
38
+ align-items:center;
39
+ justify-content: center;
40
+ border-radius:1em;
41
+ }
42
+ </style>
43
+
44
+ </head>
45
+
46
+ <body>
47
+
48
+
49
+ <section>
50
+ <h2>Semantic-Colors</h2>
51
+ <div class=colors>
52
+ <div style="background:var(--color)">--color</div>
53
+ <div style="background:var(--color-dark); color:var(--color-bg)">--color-dark</div>
54
+ <div style="background:var(--color-light)">--color-light</div>
55
+ <div style="background:var(--color2)">--color2</div>
56
+ <div style="background:var(--color2-dark); color:var(--color-bg)">--color2-dark</div>
57
+ <div style="background:var(--color2-light)">--color2-light</div>
58
+ <div style="background:var(--color-text); color:var(--color-bg)">--color-text</div>
59
+ <div style="background:var(--color-bg);">--color-bg</div>
60
+ </div>
61
+ </section>
62
+
63
+ <!--section>
64
+ <h2>Named-Colors</h2>
65
+ <div class=colors>
66
+ <div style="background:var(--color-red);">--color-red</div>
67
+ <div style="background:var(--color-orange)">--color-orange</div>
68
+ <div style="background:var(--color-yellow)">--color-yellow</div>
69
+ <div style="background:var(--color-green)">--color-green</div>
70
+ <div style="background:var(--color-cyan)">--color-cyan</div>
71
+ <div style="background:var(--color-blue)">--color-blue</div>
72
+ <div style="background:var(--color-violet)">--color-violet</div>
73
+ <div style="background:var(--color-purple)">--color-purple</div>
74
+ <div style="background:var(--color-magenta)">--color-magenta</div>
75
+ </div>
76
+ </section-->
77
+
78
+
79
+ <section style="max-width:var(--width); margin:auto; border:var(--line-width) var(--color-line) solid; box-shadow:var(--shadow); --shadow-size:2rem; border-radius:var(--radius); color:var(--color-text); background-color:var(--color-bg)">
80
+
81
+ <h1>Demo</h1>
82
+
83
+ <style contenteditable>
84
+ html {
85
+ --hsl-h: 60;
86
+ --hsl-s: 50%;
87
+ --hsl-l: 50%;
88
+ --shadow-x:.1rem;
89
+ --shadow-y:.8rem;
90
+ --color-line: var(--color-dark);
91
+ --line-width: 2px;
92
+ }
93
+ </style>
94
+
95
+ <hr>
96
+
97
+ <ul>
98
+ <li>background-color:var(--color-bg)
99
+ <li>color:var(--color-text)
100
+ <li>max-width:var(--width)
101
+ <li>box-shadow:var(--shadow)
102
+ <li>border-radius:var(--radius)
103
+ </ul>
104
+
105
+ <p>Seamlessly underwhelm dynamic e-business without best-of-breed web-readiness. Synergistically iterate global technologies after client-based total linkage. Continually underwhelm resource sucking e-tailers for sticky web-readiness. Appropriately cultivate orthogonal niche markets with wireless process improvements. Intrinsicly transition multimedia based users vis-a-vis high-quality networks. Distinctively predominate interactive potentialities whereas leveraged interfaces. Enthusiastically.</p>
106
+ <div style="background-color:var(--color-area); height:200px; display:flex; place-items:center; justify-content: center;">
107
+ background-color:var(--color-area);
108
+ </div>
109
+ </section>
package/css/classless/variables.css ADDED
@@ -0,0 +1,99 @@
1
+ html {
2
+ --hsl-h: 188.9;
3
+ --hsl-s: 55.1%;
4
+ --hsl-l: 38.4%;
5
+
6
+ /* misc */
7
+ --width:42rem; /* rename? --main-width, --content-width */
8
+ --line-width: 1px;
9
+ /* --gap:1rem; deprecated? */
10
+ --radius: .3rem;
11
+
12
+ --shadow-x:0;
13
+ --shadow-y:.25rem;
14
+ --shadow-blur:.7rem;
15
+ --shadow: var(--shadow-x) var(--shadow-y) var(--shadow-blur) #0003;
16
+ color-scheme: light; /* todo: change when using light-dark */
17
+ }
18
+
19
+ /* all composite variables must be entered here, as they must be calculated for elements with [u2-skin]. */
20
+ html, [u2-skin], [u2-skin=light] {
21
+ --hs:var(--hsl-h), var(--hsl-s);
22
+ --hsl:var(--hs), var(--hsl-l);
23
+
24
+ --color: hsl(var(--hsl));
25
+ --color-light: hsl(var(--hs), calc(var(--hsl-l) + (100% - var(--hsl-l)) * .9 ) );
26
+ --color-dark: hsl(var(--hs), calc(var(--hsl-l) * .7 ) );
27
+
28
+ /* named */
29
+ --color-bg: hsl(var(--hs), 99.5%);
30
+ --color-text: hsl(var(--hs), calc(var(--hsl-l) * .4 ) );
31
+ --color-area: var(--color-light);
32
+ --color-line: var(--color-text);
33
+ }
34
+
35
+
36
+ [u2-skin=dark] {
37
+ --color-light: hsl(var(--hs), calc(var(--hsl-l) * .7 ) );
38
+ --color-dark: hsl(var(--hs), calc(var(--hsl-l) + (100% - var(--hsl-l)) * .9 ) );
39
+ --color-bg: hsl(var(--hs), calc(var(--hsl-l) * .4 ) );
40
+ --color-text: hsl(var(--hs), 99.5%);
41
+ }
42
+
43
+ /*
44
+ @media (prefers-color-scheme: dark) {
45
+ html {
46
+ --color-light: hsl(var(--hs), calc(var(--hsl-l) * .1 ) );
47
+ --color-dark: hsl(var(--hs), calc(var(--hsl-l) + (100% - var(--hsl-l)) * .7 ) );
48
+
49
+ --color-bg: hsl(var(--hs), calc(var(--hsl-l) * .4 ) );
50
+ --color-text: hsl(var(--hs), 99.5%);
51
+ }
52
+ }
53
+ */
54
+
55
+ /*
56
+
57
+ # Some ideas:
58
+
59
+ --gap\.5:calc(var(--gap)/2);
60
+ --gap2:calc(var(--gap)*2);
61
+
62
+ --gap-xs:.25rem;
63
+ --gap-s:.5rem;
64
+ --gap-m:2rem;
65
+
66
+ ## golden ratio?
67
+ --gap-xs: calc(var(--gap-s) / 1.618);
68
+ --gap-s: calc(var(--gap) / 1.618);
69
+ --gap-m: calc(var(--gap) * 1.618);
70
+ --gap-l: calc(var(--gap-m) * 1.618);
71
+ --gap-x: calc(var(--gap-l) * 1.618);
72
+
73
+ --color-red : hsl(0deg, var(--hsl-s), var(--hsl-l));
74
+ --color-orange : hsl(30deg, var(--hsl-s), var(--hsl-l));
75
+ --color-yellow : hsl(60deg, var(--hsl-s), var(--hsl-l));
76
+ --color-green : hsl(120deg, var(--hsl-s), var(--hsl-l));
77
+ --color-cyan : hsl(180deg, var(--hsl-s), var(--hsl-l));
78
+ --color-blue : hsl(240deg, var(--hsl-s), var(--hsl-l));
79
+ --color-violet : hsl(270deg, var(--hsl-s), var(--hsl-l));
80
+ --color-purple : hsl(285deg, var(--hsl-s), var(--hsl-l));
81
+ --color-magenta : hsl(300deg, var(--hsl-s), var(--hsl-l));
82
+
83
+ --color-gray: hsl(var(--hsl-h), 4%, 60%);
84
+ --color-gray-light: hsl(var(--hsl-h), 4%, 90%);
85
+ --color-gray-dark: hsl(var(--hsl-h), 4%, 40%);
86
+
87
+ from pico.css
88
+ --icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
89
+ --icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
90
+ --icon-chevron-button: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(255, 255, 255, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
91
+ --icon-chevron-button-inverse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(255, 255, 255, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
92
+ --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
93
+ --icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
94
+ --icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
95
+ --icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
96
+ --icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
97
+ --icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
98
+ --icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(56, 142, 60, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
99
+ */
package/css/norm/README.md ADDED
@@ -0,0 +1,37 @@
1
+ # norm.css
2
+ CSS normalization for crossbrowser compatibility
3
+
4
+ ## Features
5
+
6
+ - lightweight
7
+ - maintained & up to date
8
+ - ***No opinionated styles.*** (use https://github.com/u2ui/base.css for it).
9
+
10
+ ## Demos
11
+
12
+ [test.html](http://gcdn.li/u2ui/u2@main/css/norm/tests/test.html)
13
+
14
+ ## Resources / Alternatives
15
+
16
+ https://github.com/csstools/normalize.css/blob/main/normalize.css
17
+ https://github.com/jensimmons/cssremedy/tree/master/css
18
+ https://github.com/sindresorhus/modern-normalize/blob/main/modern-normalize.css
19
+ https://github.com/kripod/css-homogenizer/blob/main/reset.css
20
+ https://github.com/AustinGil/bedrocss/tree/master/src
21
+ https://github.com/krishdevdb/reseter.css/blob/master/css/reseter.css
22
+ https://github.com/andy-piccalilli/modern-css-reset/blob/master/src/reset.css
23
+ https://github.com/garrettw/vitals/blob/master/css/vitals.css
24
+ https://github.com/petertjmills/tailwind-preflight/blob/master/src/preflight.css (plus optionated)
25
+ https://github.com/h5bp/main.css/blob/main/src/_base.css (plus optionated)
26
+
27
+ ## User-agent stylesheets
28
+
29
+ Chrome: https://chromium.googlesource.com/chromium/blink/+/refs/heads/main/Source/core/css/html.css
30
+ Webkit: http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css
31
+ Firefox: https://searchfox.org/mozilla-central/source/layout/style/res/html.css
32
+
33
+ ## About
34
+
35
+ - MIT License, Copyright (c) 2022 <u2> (like all repositories in this organization) <br>
36
+ - Suggestions, ideas, finding bugs and making pull requests make us very happy. ♥
37
+
package/css/norm/beta.css ADDED
@@ -0,0 +1,40 @@
1
+ /* performance? ~7% faster? is it worth it?
2
+ svg:not(:root), input, textarea, select, symbol, image, marker, pattern, foreignObject {
3
+ overflow:clip;
4
+ }
5
+ */
6
+ /*
7
+ chrome uses "Consolas"
8
+ "Courier New" is available everywhere? https://www.granneman.com/webdev/coding/css/fonts-and-formatting/web-browser-font-defaults
9
+ Can not reproduce need of bug fix "monospace, monospace"
10
+ needed? font-size: 1em; /* Correct the odd `em` font sizing in all browsers.
11
+ */
12
+ pre, code, kbd, samp {
13
+ font-family: "Courier New", monospace;
14
+ }
15
+ :where([contenteditable]) {
16
+ text-wrap: stable; /* how exactly does it work? */
17
+ }
18
+
19
+ /*
20
+ if attr supported something like this
21
+
22
+ input:not([type=radio], [type=checkbox], [type=date], [type=color]...) {
23
+ width: calc(attr(size, 20) * .6em + 1em);
24
+ }
25
+ */
26
+
27
+ /*
28
+ chrome adds a border-radius, but if reseted, input styles are resetted to old school inputs *
29
+
30
+ input:not([type=radio], [type=checkbox]) {
31
+ border-radius:0;
32
+ border:1px solid #000;
33
+ }
34
+
35
+ i can not reproduce
36
+ :where(::-webkit-inner-spin-button, ::-webkit-outer-spin-button) {
37
+ height: auto; /* Correct the cursor style of increment and decrement buttons in Safari * /
38
+ }
39
+
40
+ */