@pictogrammers/components 0.3.2 → 0.4.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 (294) hide show
  1. package/README.md +11 -12
  2. package/favicon.svg +20 -0
  3. package/index.html +67 -49
  4. package/main.js +2 -0
  5. package/main.js.LICENSE.txt +10 -0
  6. package/package.json +6 -6
  7. package/pg/annoy/README.md +0 -5
  8. package/pg/annoy/__examples__/basic/basic.css +3 -0
  9. package/pg/annoy/__examples__/basic/basic.html +4 -7
  10. package/pg/annoy/__examples__/basic/basic.ts +3 -1
  11. package/pg/annoy/annoy.css +29 -198
  12. package/pg/annoy/annoy.html +5 -56
  13. package/pg/annoy/annoy.ts +4 -25
  14. package/pg/app/README.md +11 -0
  15. package/pg/app/__examples__/basic/basic.css +8 -0
  16. package/pg/app/__examples__/basic/basic.html +15 -0
  17. package/pg/app/__examples__/basic/basic.ts +13 -0
  18. package/pg/app/app.css +108 -0
  19. package/pg/app/app.html +16 -0
  20. package/pg/app/app.ts +45 -0
  21. package/pg/app/index.ts +3 -0
  22. package/pg/avatar/__examples__/basic/basic.ts +5 -3
  23. package/pg/button/README.md +3 -0
  24. package/pg/button/button.css +13 -12
  25. package/pg/button/button.spec.ts +35 -0
  26. package/pg/button/button.ts +17 -12
  27. package/pg/buttonLink/buttonLink.css +3 -2
  28. package/pg/buttonMenu/README.md +54 -0
  29. package/pg/buttonMenu/__examples__/basic/basic.html +6 -0
  30. package/pg/buttonMenu/__examples__/basic/basic.ts +43 -0
  31. package/pg/buttonMenu/buttonMenu.css +12 -0
  32. package/pg/buttonMenu/buttonMenu.html +4 -0
  33. package/pg/buttonMenu/buttonMenu.ts +63 -0
  34. package/pg/buttonMenu/index.ts +3 -0
  35. package/pg/buttonToggle/__examples__/basic/basic.ts +2 -2
  36. package/pg/buttonToggle/__examples__/persist/persist.html +10 -0
  37. package/pg/buttonToggle/__examples__/persist/persist.ts +35 -0
  38. package/pg/cardUser/__examples__/basic/basic.ts +0 -1
  39. package/pg/cardUser/cardUser.css +2 -10
  40. package/pg/cardUser/cardUser.html +0 -5
  41. package/pg/cardUser/cardUser.ts +0 -6
  42. package/pg/database/README.md +1 -1
  43. package/pg/database/__examples__/basic/basic.html +2 -1
  44. package/pg/database/__examples__/basic/basic.ts +3 -3
  45. package/pg/dropdown/dropdown.ts +0 -19
  46. package/pg/grid/__examples__/basic/basic.html +2 -2
  47. package/pg/grid/__examples__/basic/basic.ts +3 -2
  48. package/pg/grid/grid.ts +0 -1
  49. package/pg/icon/README.md +6 -5
  50. package/pg/icon/__examples__/basic/basic.html +2 -2
  51. package/pg/icon/__examples__/basic/basic.ts +1 -1
  52. package/pg/icon/icon.ts +6 -0
  53. package/pg/inputCheckList/__examples__/basic/basic.ts +5 -5
  54. package/pg/inputCheckList/inputCheckList.ts +2 -0
  55. package/pg/inputFileLocal/inputFileLocal.css +3 -2
  56. package/pg/inputPixelEditor/README.md +132 -0
  57. package/pg/inputPixelEditor/__examples__/basic/basic.css +29 -0
  58. package/pg/inputPixelEditor/__examples__/basic/basic.html +63 -0
  59. package/pg/inputPixelEditor/__examples__/basic/basic.ts +200 -0
  60. package/pg/inputPixelEditor/__examples__/basic/openUtils.ts +41 -0
  61. package/pg/inputPixelEditor/__examples__/basic/saveUtil.ts +35 -0
  62. package/pg/inputPixelEditor/index.ts +3 -0
  63. package/pg/inputPixelEditor/inputPixelEditor.css +27 -0
  64. package/pg/inputPixelEditor/inputPixelEditor.html +3 -0
  65. package/pg/inputPixelEditor/inputPixelEditor.ts +839 -0
  66. package/pg/inputPixelEditor/utils/bitmapToMask.ts +202 -0
  67. package/pg/inputPixelEditor/utils/cloneGrid.ts +17 -0
  68. package/pg/inputPixelEditor/utils/constants.ts +1 -0
  69. package/pg/inputPixelEditor/utils/createLayer.ts +8 -0
  70. package/pg/inputPixelEditor/utils/debounce.ts +5 -0
  71. package/pg/inputPixelEditor/utils/diffGrid.ts +26 -0
  72. package/pg/inputPixelEditor/utils/fillGrid.ts +11 -0
  73. package/pg/inputPixelEditor/utils/getEllipseOutlinePixels.ts +105 -0
  74. package/pg/inputPixelEditor/utils/getEllipsePixels.ts +28 -0
  75. package/pg/inputPixelEditor/utils/getGuides.ts +232 -0
  76. package/pg/inputPixelEditor/utils/getLinePixels.ts +18 -0
  77. package/pg/inputPixelEditor/utils/getRectangleOutlinePixels.ts +20 -0
  78. package/pg/inputPixelEditor/utils/getRectanglePixels.ts +15 -0
  79. package/pg/inputPixelEditor/utils/inputMode.ts +8 -0
  80. package/pg/inputPixelEditor/utils/interateGrid.ts +7 -0
  81. package/pg/inputPixelEditor/utils/isEmptyGrid.ts +3 -0
  82. package/pg/inputPixelEditor/utils/maskToBitmap.ts +66 -0
  83. package/pg/inputRange/__examples__/basic/basic.ts +4 -4
  84. package/pg/inputRange/inputRange.ts +6 -4
  85. package/pg/inputSelect/README.md +1 -1
  86. package/pg/inputSelect/__examples__/basic/basic.ts +7 -5
  87. package/pg/inputSelect/inputSelect.css +15 -12
  88. package/pg/inputSelect/inputSelect.html +3 -3
  89. package/pg/inputSelect/inputSelect.ts +33 -30
  90. package/pg/inputText/__examples__/basic/basic.ts +6 -6
  91. package/pg/inputText/inputText.css +1 -0
  92. package/pg/inputUserSelect/README.md +1 -1
  93. package/pg/inputUserSelect/inputUserSelect.ts +1 -1
  94. package/pg/listTag/__examples__/basic/basic.ts +4 -5
  95. package/pg/markdown/README.md +17 -3
  96. package/pg/markdown/__examples__/basic/basic.ts +2 -2
  97. package/pg/markdown/__examples__/basic/constants.ts +1 -1
  98. package/pg/markdown/markdown.css +11 -0
  99. package/pg/menu/README.md +46 -0
  100. package/pg/menu/__examples__/basic/basic.html +6 -0
  101. package/pg/menu/__examples__/basic/basic.ts +46 -0
  102. package/pg/menu/index.ts +3 -0
  103. package/pg/menu/menu.css +19 -0
  104. package/pg/menu/menu.html +1 -0
  105. package/pg/menu/menu.ts +119 -0
  106. package/pg/menuDivider/README.md +7 -0
  107. package/pg/menuDivider/__examples__/basic/basic.html +3 -0
  108. package/pg/menuDivider/__examples__/basic/basic.ts +28 -0
  109. package/pg/menuDivider/index.ts +3 -0
  110. package/pg/menuDivider/menuDivider.css +9 -0
  111. package/pg/menuDivider/menuDivider.html +1 -0
  112. package/pg/menuDivider/menuDivider.ts +22 -0
  113. package/pg/menuIcon/menuIcon.ts +43 -36
  114. package/pg/menuItem/README.md +32 -0
  115. package/pg/menuItem/__examples__/basic/basic.html +26 -0
  116. package/pg/menuItem/__examples__/basic/basic.ts +41 -0
  117. package/pg/menuItem/index.ts +3 -0
  118. package/pg/menuItem/menuItem.css +97 -0
  119. package/pg/menuItem/menuItem.html +1 -0
  120. package/pg/menuItem/menuItem.ts +77 -0
  121. package/pg/menuItemIcon/README.md +32 -0
  122. package/pg/menuItemIcon/__examples__/basic/basic.html +34 -0
  123. package/pg/menuItemIcon/__examples__/basic/basic.ts +55 -0
  124. package/pg/menuItemIcon/index.ts +3 -0
  125. package/pg/menuItemIcon/menuItemIcon.css +106 -0
  126. package/pg/menuItemIcon/menuItemIcon.html +4 -0
  127. package/pg/menuItemIcon/menuItemIcon.ts +156 -0
  128. package/pg/modalAlert/__examples__/basic/basic.ts +1 -1
  129. package/pg/modalAlert/modalAlert.css +1 -4
  130. package/pg/modalAlert/modalAlert.ts +18 -4
  131. package/pg/modification/__examples__/basic/basic.ts +1 -2
  132. package/pg/modification/__examples__/basic/constants.ts +25 -50
  133. package/pg/modification/modification.ts +1 -1
  134. package/pg/overlay/overlay.ts +13 -12
  135. package/pg/overlayContextMenu/README.md +35 -0
  136. package/pg/overlayContextMenu/__examples__/basic/basic.css +23 -0
  137. package/pg/overlayContextMenu/__examples__/basic/basic.html +7 -0
  138. package/pg/overlayContextMenu/__examples__/basic/basic.ts +87 -0
  139. package/pg/overlayContextMenu/index.ts +3 -0
  140. package/pg/overlayContextMenu/overlayContextMenu.css +16 -0
  141. package/pg/overlayContextMenu/overlayContextMenu.html +3 -0
  142. package/pg/overlayContextMenu/overlayContextMenu.ts +98 -0
  143. package/pg/overlayMenu/README.md +33 -0
  144. package/pg/overlayMenu/__examples__/basic/basic.css +3 -0
  145. package/pg/overlayMenu/__examples__/basic/basic.html +5 -0
  146. package/pg/overlayMenu/__examples__/basic/basic.ts +62 -0
  147. package/pg/overlayMenu/index.ts +3 -0
  148. package/pg/overlayMenu/overlayMenu.css +16 -0
  149. package/pg/overlayMenu/overlayMenu.html +3 -0
  150. package/pg/overlayMenu/overlayMenu.ts +67 -0
  151. package/pg/overlaySelectMenu/README.md +33 -0
  152. package/pg/overlaySelectMenu/__examples__/basic/basic.css +3 -0
  153. package/pg/overlaySelectMenu/__examples__/basic/basic.html +5 -0
  154. package/pg/overlaySelectMenu/__examples__/basic/basic.ts +62 -0
  155. package/pg/overlaySelectMenu/index.ts +3 -0
  156. package/pg/overlaySelectMenu/overlaySelectMenu.css +17 -0
  157. package/pg/overlaySelectMenu/overlaySelectMenu.html +3 -0
  158. package/pg/overlaySelectMenu/overlaySelectMenu.ts +96 -0
  159. package/pg/overlaySubMenu/README.md +35 -0
  160. package/pg/overlaySubMenu/index.ts +3 -0
  161. package/pg/overlaySubMenu/overlaySubMenu.css +27 -0
  162. package/pg/overlaySubMenu/overlaySubMenu.html +3 -0
  163. package/pg/overlaySubMenu/overlaySubMenu.ts +103 -0
  164. package/pg/picker/picker.ts +1 -19
  165. package/pg/scroll/__examples__/basic/basic.ts +1 -1
  166. package/pg/search/__examples__/basic/basic.ts +10 -7
  167. package/pg/search/search.css +2 -2
  168. package/pg/shared/models/user.ts +0 -2
  169. package/pg/tab/tab.ts +0 -10
  170. package/pg/tabs/partials/tab.css +42 -0
  171. package/pg/tabs/partials/tab.ts +70 -0
  172. package/pg/tabs/tabs.css +0 -53
  173. package/pg/tabs/tabs.ts +54 -70
  174. package/pg/toast/README.md +35 -6
  175. package/pg/toast/__examples__/basic/basic.html +7 -0
  176. package/pg/toast/__examples__/basic/basic.ts +76 -0
  177. package/pg/toast/toast.css +3 -0
  178. package/pg/toast/toast.ts +20 -4
  179. package/pg/tooltip/addTooltip.ts +3 -1
  180. package/pg/tooltip/tooltip.ts +1 -1
  181. package/pg/tree/README.md +67 -0
  182. package/pg/tree/__examples__/basic/basic.html +10 -0
  183. package/pg/tree/__examples__/basic/basic.ts +162 -0
  184. package/pg/tree/index.ts +3 -0
  185. package/pg/tree/tree.css +28 -0
  186. package/pg/tree/tree.html +1 -0
  187. package/pg/tree/tree.ts +217 -0
  188. package/pg/treeButtonIcon/README.md +39 -0
  189. package/pg/treeButtonIcon/index.ts +3 -0
  190. package/pg/treeButtonIcon/treeButtonIcon.css +18 -0
  191. package/pg/treeButtonIcon/treeButtonIcon.html +3 -0
  192. package/pg/treeButtonIcon/treeButtonIcon.ts +42 -0
  193. package/pg/treeItem/README.md +3 -0
  194. package/pg/treeItem/index.ts +3 -0
  195. package/pg/treeItem/treeItem.css +263 -0
  196. package/pg/treeItem/treeItem.html +16 -0
  197. package/pg/treeItem/treeItem.ts +558 -0
  198. package/pgAnnoy.js +1 -0
  199. package/pgApp.js +1 -0
  200. package/pgAvatar.js +1 -0
  201. package/pgButton.js +1 -0
  202. package/pgButtonGroup.js +1 -0
  203. package/pgButtonLink.js +1 -0
  204. package/pgButtonMenu.js +1 -0
  205. package/pgButtonToggle.js +1 -0
  206. package/pgCard.js +1 -0
  207. package/pgCardUser.js +1 -0
  208. package/pgColor.js +1 -0
  209. package/pgDatabase.js +1 -0
  210. package/pgDropdown.js +1 -0
  211. package/pgGrid.js +1 -0
  212. package/pgHeader.js +1 -0
  213. package/pgIcon.js +1 -0
  214. package/pgInputCheck.js +1 -0
  215. package/pgInputCheckList.js +1 -0
  216. package/pgInputFileLocal.js +1 -0
  217. package/pgInputHexRgb.js +1 -0
  218. package/pgInputPixelEditor.js +1 -0
  219. package/pgInputRange.js +1 -0
  220. package/pgInputSelect.js +1 -0
  221. package/pgInputText.js +1 -0
  222. package/pgInputTextIcon.js +1 -0
  223. package/pgInputUserSelect.js +1 -0
  224. package/pgListTag.js +1 -0
  225. package/pgMarkdown.js +2 -0
  226. package/pgMarkdown.js.LICENSE.txt +10 -0
  227. package/pgMenu.js +1 -0
  228. package/pgMenuDivider.js +1 -0
  229. package/pgMenuIcon.js +1 -0
  230. package/pgMenuItem.js +1 -0
  231. package/pgMenuItemIcon.js +1 -0
  232. package/pgModalAlert.js +1 -0
  233. package/pgModification.js +1 -0
  234. package/pgNav.js +1 -0
  235. package/pgOverlay.js +1 -0
  236. package/pgOverlayContextMenu.js +1 -0
  237. package/pgOverlayMenu.js +1 -0
  238. package/pgOverlaySelectMenu.js +1 -0
  239. package/pgOverlaySubMenu.js +1 -0
  240. package/pgPicker.js +1 -0
  241. package/pgPreview.js +1 -0
  242. package/pgScroll.js +1 -0
  243. package/pgSearch.js +1 -0
  244. package/pgTab.js +1 -0
  245. package/pgTabs.js +1 -0
  246. package/pgToast.js +1 -0
  247. package/pgToasts.js +1 -0
  248. package/pgTooltip.js +1 -0
  249. package/pgTree.js +1 -0
  250. package/pgTreeButtonIcon.js +1 -0
  251. package/pgTreeItem.js +1 -0
  252. package/theme-ui3.css +31 -0
  253. package/@types/css.d.ts +0 -4
  254. package/@types/html.d.ts +0 -4
  255. package/dist/main.js +0 -3819
  256. package/dist/pgAnnoy.js +0 -116
  257. package/dist/pgAvatar.js +0 -136
  258. package/dist/pgButton.js +0 -116
  259. package/dist/pgButtonGroup.js +0 -116
  260. package/dist/pgButtonLink.js +0 -116
  261. package/dist/pgButtonToggle.js +0 -146
  262. package/dist/pgCard.js +0 -116
  263. package/dist/pgCardUser.js +0 -196
  264. package/dist/pgColor.js +0 -136
  265. package/dist/pgDatabase.js +0 -236
  266. package/dist/pgDropdown.js +0 -686
  267. package/dist/pgGrid.js +0 -126
  268. package/dist/pgHeader.js +0 -116
  269. package/dist/pgIcon.js +0 -116
  270. package/dist/pgInputCheck.js +0 -116
  271. package/dist/pgInputCheckList.js +0 -126
  272. package/dist/pgInputFileLocal.js +0 -116
  273. package/dist/pgInputHexRgb.js +0 -126
  274. package/dist/pgInputRange.js +0 -116
  275. package/dist/pgInputSelect.js +0 -116
  276. package/dist/pgInputText.js +0 -116
  277. package/dist/pgInputTextIcon.js +0 -176
  278. package/dist/pgInputUserSelect.js +0 -116
  279. package/dist/pgListTag.js +0 -136
  280. package/dist/pgMarkdown.js +0 -346
  281. package/dist/pgMenuIcon.js +0 -206
  282. package/dist/pgModalAlert.js +0 -126
  283. package/dist/pgModification.js +0 -396
  284. package/dist/pgNav.js +0 -116
  285. package/dist/pgOverlay.js +0 -96
  286. package/dist/pgPicker.js +0 -116
  287. package/dist/pgPreview.js +0 -116
  288. package/dist/pgScroll.js +0 -266
  289. package/dist/pgSearch.js +0 -146
  290. package/dist/pgTab.js +0 -116
  291. package/dist/pgTabs.js +0 -136
  292. package/dist/pgToast.js +0 -136
  293. package/dist/pgToasts.js +0 -136
  294. package/dist/pgTooltip.js +0 -126
package/theme-ui3.css ADDED
@@ -0,0 +1,31 @@
1
+ :root {
2
+ /* Focus */
3
+ --pg-focus-color: rgb(79, 143, 249, 0.6);
4
+ /* Button */
5
+ --pg-button-font-size: 1rem;
6
+ --pg-button-line-height: 1.5rem;
7
+ --pg-button-border-color: #453C4F;
8
+ --pg-button-background-color: #FFFFFF;
9
+ --pg-button-color: #453C4F;
10
+ --pg-button-padding: 0.25rem 0.5rem;
11
+ --pg-button-border-radius: 0.25rem;
12
+ /* Button :hover */
13
+ --pg-button-hover-border-color: #453C4F;
14
+ --pg-button-hover-background-color: #453C4F;
15
+ --pg-button-hover-color: #FFFFFF;
16
+ --pg-button-hover-color: #FFFFFF;
17
+ /* Menu */
18
+ --pg-menu-background-color: #1E1E1E;
19
+ --pg-menu-padding: 0.25rem;
20
+ --pg-menu-border-width: 0;
21
+ --pg-menu-border-color: transparent;
22
+ /* Menu Item */
23
+ --pg-menu-item-color: #FFFFFF;
24
+ --pg-menu-item-background: transparent;
25
+ --pg-menu-item-selected-background: #248BE5;
26
+ --pg-menu-item-disabled-color: #BBBBBB;
27
+ --pg-menu-item-check: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M 17.4999,10.2501L 10.5,17.25L 6.49999,13.25L 7.9142,11.8358L 10.5,14.4216L 16.0857,8.83584L 17.4999,10.2501 Z' fill='white' /></svg>");
28
+ --pg-menu-item-hover-check: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M 17.4999,10.2501L 10.5,17.25L 6.49999,13.25L 7.9142,11.8358L 10.5,14.4216L 16.0857,8.83584L 17.4999,10.2501 Z' fill='white' /></svg>");
29
+ --pg-menu-item-disabled-check: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M 17.4999,10.2501L 10.5,17.25L 6.49999,13.25L 7.9142,11.8358L 10.5,14.4216L 16.0857,8.83584L 17.4999,10.2501 Z' fill='rgb(187, 187, 187)' /></svg>");
30
+ --pg-menu-item-active-background: #2B9CFF;
31
+ }
package/@types/css.d.ts DELETED
@@ -1,4 +0,0 @@
1
- declare module '*.css' {
2
- const value: string;
3
- export default value
4
- }
package/@types/html.d.ts DELETED
@@ -1,4 +0,0 @@
1
- declare module '*.html' {
2
- const value: string;
3
- export default value
4
- }