@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/dist/pgToasts.js DELETED
@@ -1,136 +0,0 @@
1
- /*
2
- * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
3
- * This devtool is neither made for production nor for readable output files.
4
- * It uses "eval()" calls to create a separate source file in the browser devtools.
5
- * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
6
- * or disable the default devtool with "devtool: false".
7
- * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
8
- */
9
- /******/ (() => { // webpackBootstrap
10
- /******/ "use strict";
11
- /******/ var __webpack_modules__ = ({
12
-
13
- /***/ "./node_modules/@pictogrammers/element/dist/element.esm.js":
14
- /*!*****************************************************************!*\
15
- !*** ./node_modules/@pictogrammers/element/dist/element.esm.js ***!
16
- \*****************************************************************/
17
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
18
-
19
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Component\": () => (/* binding */ Component),\n/* harmony export */ \"Local\": () => (/* binding */ Local),\n/* harmony export */ \"Part\": () => (/* binding */ Part),\n/* harmony export */ \"Prop\": () => (/* binding */ Prop),\n/* harmony export */ \"TransmutePart\": () => (/* binding */ TransmutePart),\n/* harmony export */ \"getProps\": () => (/* binding */ getProps),\n/* harmony export */ \"node\": () => (/* binding */ node),\n/* harmony export */ \"selectComponent\": () => (/* binding */ selectComponent),\n/* harmony export */ \"selectPart\": () => (/* binding */ selectPart)\n/* harmony export */ });\nvar init = Symbol('init');\r\nvar template = Symbol('template');\r\nvar style = Symbol('style');\r\nvar parent = Symbol('parent');\r\nfunction extendTemplate(base, append) {\r\n if (append && append.match(/<parent\\/>/)) {\r\n return append.replace(/<parent\\/>/, base);\r\n }\r\n else {\r\n return \"\".concat(base).concat(append || '');\r\n }\r\n}\r\nfunction camelToDash(str) {\r\n return str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1-').toLowerCase();\r\n}\r\nfunction dashToCamel(str) {\r\n return str.replace(/-([a-z])/g, function (m) { return m[1].toUpperCase(); });\r\n}\r\nfunction Component(config) {\r\n if (config === void 0) { config = {}; }\r\n return function (cls) {\r\n if (cls.prototype[parent]) {\r\n cls.prototype[parent].push(cls.prototype);\r\n cls.prototype[style] = \"\".concat(cls.prototype[style]).concat(config.style);\r\n cls.prototype[template] = extendTemplate(cls.prototype[template], config.template || null);\r\n }\r\n else {\r\n cls.prototype[parent] = [cls.prototype];\r\n cls.prototype[style] = config.style || '';\r\n cls.prototype[template] = config.template || '';\r\n }\r\n if (!cls.symbols) {\r\n cls.symbols = {};\r\n }\r\n var connectedCallback = cls.prototype.connectedCallback || (function () { });\r\n var disconnectedCallback = cls.prototype.disconnectedCallback || (function () { });\r\n cls.prototype.connectedCallback = function () {\r\n var _this = this;\r\n if (!this[init] && !config.template) {\r\n if (config.useShadow === false) {\r\n // Base class with no template\r\n }\r\n else {\r\n this.attachShadow({ mode: 'open' });\r\n }\r\n }\r\n else if (!this[init] && config.template) {\r\n var $template = document.createElement('template');\r\n $template.innerHTML = \"\".concat(cls.prototype[template], \"<style>\").concat(cls.prototype[style], \"</style>\");\r\n var $node = document.importNode($template.content, true);\r\n if (config.useShadow === false) {\r\n this.appendChild($node);\r\n }\r\n else {\r\n this.attachShadow({ mode: 'open' }).appendChild($node);\r\n }\r\n }\r\n else if (this[init] && config.style) {\r\n /*if (this.shadowRoot) {\r\n const style = document.createElement('style');\r\n style.appendChild(document.createTextNode(config.style));\r\n this.appendChild(style);\r\n }*/\r\n // } else if (this[init] && config.template) {\r\n // This is allowed now via <parent/>\r\n // throw new Error('template from base class cannot be overriden. Fix: remove template from @Component');\r\n }\r\n else if (this[init] && !config.template) {\r\n throw new Error('You need to pass a template for an extended element.');\r\n }\r\n if (this.componentWillMount) {\r\n this.componentWillMount();\r\n }\r\n this[parent].map(function (p) {\r\n if (p.render) {\r\n p.render.call(_this, cls.observedAttributes\r\n ? cls.observedAttributes.reduce(function (a, c) {\r\n var n = dashToCamel(c);\r\n a[n] = true;\r\n return a;\r\n }, {})\r\n : {});\r\n }\r\n });\r\n this[init] = true;\r\n connectedCallback.call(this);\r\n if (this.componentDidMount) {\r\n this.componentDidMount();\r\n }\r\n };\r\n cls.prototype.disconnectedCallback = function () {\r\n if (this.componentWillUnmount) {\r\n this.componentWillUnmount();\r\n }\r\n disconnectedCallback.call(this);\r\n if (this.componentDidUnmount) {\r\n this.componentDidUnmount();\r\n }\r\n };\r\n cls.prototype.attributeChangedCallback = function (name, oldValue, newValue) {\r\n var normalizedName = dashToCamel(name);\r\n this[normalizedName] = newValue;\r\n };\r\n if (config.selector && !window.customElements.get(config.selector)) {\r\n window.customElements.define(config.selector, cls);\r\n }\r\n };\r\n}\r\nvar transmute = Symbol('transmute');\r\nfunction TransmutePart(part, selector) {\r\n return function (cls) {\r\n var _a;\r\n if (cls.prototype[transmute]) {\r\n cls.prototype[transmute][part] = selector;\r\n }\r\n else {\r\n cls.prototype[transmute] = (_a = {}, _a[part] = selector, _a);\r\n }\r\n };\r\n}\r\nfunction Prop() {\r\n return function (target, propertyKey, descriptor) {\r\n var constructor = target.constructor;\r\n if (!constructor.observedAttributes) {\r\n constructor.observedAttributes = [];\r\n }\r\n var observedAttributes = constructor.observedAttributes;\r\n if (!constructor.symbols) {\r\n constructor.symbols = {};\r\n }\r\n var symbols = constructor.symbols;\r\n var normalizedPropertyKey = camelToDash(propertyKey);\r\n constructor.observedAttributes = observedAttributes.concat([normalizedPropertyKey]);\r\n var symbol = Symbol(propertyKey);\r\n symbols[propertyKey] = symbol;\r\n Object.defineProperty(target, propertyKey, {\r\n get: function () {\r\n return this[symbol];\r\n },\r\n set: function (value) {\r\n var _this = this;\r\n this[symbol] = value;\r\n if (this[init]) {\r\n this[parent].map(function (p) {\r\n var _a;\r\n if (p.render) {\r\n p.render.call(_this, (_a = {}, _a[propertyKey] = true, _a));\r\n }\r\n });\r\n }\r\n }\r\n });\r\n };\r\n}\r\nfunction Part() {\r\n return function (target, propertyKey, descriptor) {\r\n Object.defineProperty(target, propertyKey, {\r\n get: function () {\r\n var _a;\r\n var key = propertyKey.replace(/^\\$/, '');\r\n return (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(\"[part~=\".concat(key, \"]\"));\r\n }\r\n });\r\n };\r\n}\r\nfunction Local(initialValue, key) {\r\n if (initialValue === void 0) { initialValue = null; }\r\n return function (target, propertyKey, descriptor) {\r\n var getKey = function (self) {\r\n return (key ? key : \"\".concat(self.constructor.name, \":\").concat(propertyKey));\r\n };\r\n Object.defineProperty(target, propertyKey, {\r\n get: function () {\r\n var k = getKey(this);\r\n return window.localStorage.getItem(k) || initialValue;\r\n },\r\n set: function (value) {\r\n var k = getKey(this);\r\n if (value === null) {\r\n window.localStorage.removeItem(k);\r\n }\r\n else {\r\n window.localStorage.setItem(k, value);\r\n }\r\n }\r\n });\r\n };\r\n}\r\nfunction node(template, init) {\r\n var $template = document.createElement('template');\r\n $template.innerHTML = template;\r\n var $node = document.importNode($template.content, true);\r\n for (var _i = 0, _a = Object.entries(init); _i < _a.length; _i++) {\r\n var _b = _a[_i], part = _b[0], attributes = _b[1];\r\n var $part = $node.querySelector(\"[part~=\\\"\".concat(part, \"\\\"]\"));\r\n if ($part) {\r\n for (var _c = 0, _d = Object.entries(attributes); _c < _d.length; _c++) {\r\n var _e = _d[_c], prop = _e[0], value = _e[1];\r\n if (value instanceof Function) {\r\n var val = value();\r\n if (val === null) {\r\n $part.removeAttribute(prop);\r\n }\r\n else {\r\n $part.setAttribute(prop, value());\r\n }\r\n }\r\n else {\r\n $part[prop] = value;\r\n }\r\n }\r\n }\r\n }\r\n return $node;\r\n}\r\n// JEST\r\nfunction selectComponent(tag) {\r\n return document.querySelector(tag);\r\n}\r\nfunction selectPart(component, name) {\r\n return component.shadowRoot.querySelector(\"[part=\".concat(name, \"]\"));\r\n}\r\nfunction getProps(tag) {\r\n var symbols = customElements.get(tag).symbols;\r\n return Object.keys(symbols);\r\n}\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./node_modules/@pictogrammers/element/dist/element.esm.js?");
20
-
21
- /***/ }),
22
-
23
- /***/ "./src/pg/toasts/toasts.css":
24
- /*!**********************************!*\
25
- !*** ./src/pg/toasts/toasts.css ***!
26
- \**********************************/
27
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
28
-
29
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (\"[part~=container] {\\r\\n display: inline-flex;\\r\\n flex-direction: column;\\r\\n align-items: flex-end;\\r\\n position: fixed;\\r\\n top: 1rem;\\r\\n right: 1rem;\\r\\n}\");\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/toasts/toasts.css?");
30
-
31
- /***/ }),
32
-
33
- /***/ "./src/pg/toasts/toasts.html":
34
- /*!***********************************!*\
35
- !*** ./src/pg/toasts/toasts.html ***!
36
- \***********************************/
37
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
38
-
39
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (\"<div part=\\\"container\\\"></div>\");\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/toasts/toasts.html?");
40
-
41
- /***/ }),
42
-
43
- /***/ "./src/pg/shared/toast.ts":
44
- /*!********************************!*\
45
- !*** ./src/pg/shared/toast.ts ***!
46
- \********************************/
47
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
48
-
49
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"addErrorToast\": () => (/* binding */ addErrorToast),\n/* harmony export */ \"addInfoToast\": () => (/* binding */ addInfoToast),\n/* harmony export */ \"addToast\": () => (/* binding */ addToast),\n/* harmony export */ \"addWarningToast\": () => (/* binding */ addWarningToast),\n/* harmony export */ \"observeToasts\": () => (/* binding */ observeToasts),\n/* harmony export */ \"removeToast\": () => (/* binding */ removeToast)\n/* harmony export */ });\n/* harmony import */ var _uuid__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./uuid */ \"./src/pg/shared/uuid.ts\");\n\r\nconst ADD = 'pgtoastadd';\r\nconst REMOVE = 'pgtoastremove';\r\nfunction observeToasts({ add, remove }) {\r\n document.body.addEventListener(ADD, (e) => {\r\n add(e.detail);\r\n });\r\n document.body.addEventListener(REMOVE, (e) => {\r\n remove(e.detail.key);\r\n });\r\n}\r\nfunction addToast(config) {\r\n config.key = config.key || (0,_uuid__WEBPACK_IMPORTED_MODULE_0__.uuid)();\r\n const event = new CustomEvent(ADD, {\r\n detail: config\r\n });\r\n document.body.dispatchEvent(event);\r\n setTimeout(() => {\r\n removeToast(config.key);\r\n }, config.seconds * 1000);\r\n return config.key;\r\n}\r\nfunction removeToast(key) {\r\n const event = new CustomEvent(REMOVE, {\r\n detail: { key }\r\n });\r\n document.body.dispatchEvent(event);\r\n}\r\nfunction addInfoToast(message, seconds = 3) {\r\n const type = 'info';\r\n return addToast({ type, message, seconds });\r\n}\r\nfunction addWarningToast(message, seconds = 3) {\r\n const type = 'warning';\r\n return addToast({ type, message, seconds });\r\n}\r\nfunction addErrorToast(message, seconds = 3) {\r\n const type = 'error';\r\n return addToast({ type, message, seconds });\r\n}\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/shared/toast.ts?");
50
-
51
- /***/ }),
52
-
53
- /***/ "./src/pg/shared/uuid.ts":
54
- /*!*******************************!*\
55
- !*** ./src/pg/shared/uuid.ts ***!
56
- \*******************************/
57
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
58
-
59
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"uuid\": () => (/* binding */ uuid)\n/* harmony export */ });\nfunction uuid() {\r\n return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {\r\n var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);\r\n return v.toString(16);\r\n });\r\n}\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/shared/uuid.ts?");
60
-
61
- /***/ }),
62
-
63
- /***/ "./src/pg/toasts/toasts.ts":
64
- /*!*********************************!*\
65
- !*** ./src/pg/toasts/toasts.ts ***!
66
- \*********************************/
67
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
68
-
69
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @pictogrammers/element */ \"./node_modules/@pictogrammers/element/dist/element.esm.js\");\n/* harmony import */ var _shared_toast__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../shared/toast */ \"./src/pg/shared/toast.ts\");\n/* harmony import */ var _toasts_html__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./toasts.html */ \"./src/pg/toasts/toasts.html\");\n/* harmony import */ var _toasts_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./toasts.css */ \"./src/pg/toasts/toasts.css\");\nvar __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n};\r\n\r\n\r\n\r\n\r\nlet PgToasts = class PgToasts extends HTMLElement {\r\n constructor() {\r\n super(...arguments);\r\n this.toasts = [];\r\n }\r\n connectedCallback() {\r\n (0,_shared_toast__WEBPACK_IMPORTED_MODULE_1__.observeToasts)({\r\n add: (toast) => {\r\n this.toasts.push(toast);\r\n this.render();\r\n },\r\n remove: (key) => {\r\n var _a;\r\n const index = this.toasts.findIndex(t => t.key === key);\r\n if (index !== -1) {\r\n var [toast] = this.toasts.splice(index, 1);\r\n (_a = this.$container.querySelector(`[key=\"${toast.key}\"]`)) === null || _a === void 0 ? void 0 : _a.remove();\r\n }\r\n }\r\n });\r\n }\r\n render() {\r\n this.toasts.forEach((toast) => {\r\n const existing = this.$container.querySelector(`[key=\"${toast.key}\"]`);\r\n if (existing) {\r\n existing.message = toast.message;\r\n existing.loading = toast.loading;\r\n existing.type = toast.type;\r\n }\r\n else {\r\n const ele = document.createElement('pg-toast');\r\n ele.setAttribute('key', toast.key);\r\n ele.message = toast.message;\r\n ele.loading = toast.loading;\r\n ele.type = toast.type;\r\n this.$container.appendChild(ele);\r\n }\r\n });\r\n }\r\n};\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Part)()\r\n], PgToasts.prototype, \"$container\", void 0);\r\nPgToasts = __decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Component)({\r\n selector: 'pg-toasts',\r\n style: _toasts_css__WEBPACK_IMPORTED_MODULE_3__[\"default\"],\r\n template: _toasts_html__WEBPACK_IMPORTED_MODULE_2__[\"default\"]\r\n })\r\n], PgToasts);\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PgToasts);\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/toasts/toasts.ts?");
70
-
71
- /***/ })
72
-
73
- /******/ });
74
- /************************************************************************/
75
- /******/ // The module cache
76
- /******/ var __webpack_module_cache__ = {};
77
- /******/
78
- /******/ // The require function
79
- /******/ function __webpack_require__(moduleId) {
80
- /******/ // Check if module is in cache
81
- /******/ var cachedModule = __webpack_module_cache__[moduleId];
82
- /******/ if (cachedModule !== undefined) {
83
- /******/ return cachedModule.exports;
84
- /******/ }
85
- /******/ // Create a new module (and put it into the cache)
86
- /******/ var module = __webpack_module_cache__[moduleId] = {
87
- /******/ // no module.id needed
88
- /******/ // no module.loaded needed
89
- /******/ exports: {}
90
- /******/ };
91
- /******/
92
- /******/ // Execute the module function
93
- /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
94
- /******/
95
- /******/ // Return the exports of the module
96
- /******/ return module.exports;
97
- /******/ }
98
- /******/
99
- /************************************************************************/
100
- /******/ /* webpack/runtime/define property getters */
101
- /******/ (() => {
102
- /******/ // define getter functions for harmony exports
103
- /******/ __webpack_require__.d = (exports, definition) => {
104
- /******/ for(var key in definition) {
105
- /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
106
- /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
107
- /******/ }
108
- /******/ }
109
- /******/ };
110
- /******/ })();
111
- /******/
112
- /******/ /* webpack/runtime/hasOwnProperty shorthand */
113
- /******/ (() => {
114
- /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
115
- /******/ })();
116
- /******/
117
- /******/ /* webpack/runtime/make namespace object */
118
- /******/ (() => {
119
- /******/ // define __esModule on exports
120
- /******/ __webpack_require__.r = (exports) => {
121
- /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
122
- /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
123
- /******/ }
124
- /******/ Object.defineProperty(exports, '__esModule', { value: true });
125
- /******/ };
126
- /******/ })();
127
- /******/
128
- /************************************************************************/
129
- /******/
130
- /******/ // startup
131
- /******/ // Load entry module and return exports
132
- /******/ // This entry module can't be inlined because the eval devtool is used.
133
- /******/ var __webpack_exports__ = __webpack_require__("./src/pg/toasts/toasts.ts");
134
- /******/
135
- /******/ })()
136
- ;
package/dist/pgTooltip.js DELETED
@@ -1,126 +0,0 @@
1
- /*
2
- * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
3
- * This devtool is neither made for production nor for readable output files.
4
- * It uses "eval()" calls to create a separate source file in the browser devtools.
5
- * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
6
- * or disable the default devtool with "devtool: false".
7
- * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
8
- */
9
- /******/ (() => { // webpackBootstrap
10
- /******/ "use strict";
11
- /******/ var __webpack_modules__ = ({
12
-
13
- /***/ "./node_modules/@pictogrammers/element/dist/element.esm.js":
14
- /*!*****************************************************************!*\
15
- !*** ./node_modules/@pictogrammers/element/dist/element.esm.js ***!
16
- \*****************************************************************/
17
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
18
-
19
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Component\": () => (/* binding */ Component),\n/* harmony export */ \"Local\": () => (/* binding */ Local),\n/* harmony export */ \"Part\": () => (/* binding */ Part),\n/* harmony export */ \"Prop\": () => (/* binding */ Prop),\n/* harmony export */ \"TransmutePart\": () => (/* binding */ TransmutePart),\n/* harmony export */ \"getProps\": () => (/* binding */ getProps),\n/* harmony export */ \"node\": () => (/* binding */ node),\n/* harmony export */ \"selectComponent\": () => (/* binding */ selectComponent),\n/* harmony export */ \"selectPart\": () => (/* binding */ selectPart)\n/* harmony export */ });\nvar init = Symbol('init');\r\nvar template = Symbol('template');\r\nvar style = Symbol('style');\r\nvar parent = Symbol('parent');\r\nfunction extendTemplate(base, append) {\r\n if (append && append.match(/<parent\\/>/)) {\r\n return append.replace(/<parent\\/>/, base);\r\n }\r\n else {\r\n return \"\".concat(base).concat(append || '');\r\n }\r\n}\r\nfunction camelToDash(str) {\r\n return str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1-').toLowerCase();\r\n}\r\nfunction dashToCamel(str) {\r\n return str.replace(/-([a-z])/g, function (m) { return m[1].toUpperCase(); });\r\n}\r\nfunction Component(config) {\r\n if (config === void 0) { config = {}; }\r\n return function (cls) {\r\n if (cls.prototype[parent]) {\r\n cls.prototype[parent].push(cls.prototype);\r\n cls.prototype[style] = \"\".concat(cls.prototype[style]).concat(config.style);\r\n cls.prototype[template] = extendTemplate(cls.prototype[template], config.template || null);\r\n }\r\n else {\r\n cls.prototype[parent] = [cls.prototype];\r\n cls.prototype[style] = config.style || '';\r\n cls.prototype[template] = config.template || '';\r\n }\r\n if (!cls.symbols) {\r\n cls.symbols = {};\r\n }\r\n var connectedCallback = cls.prototype.connectedCallback || (function () { });\r\n var disconnectedCallback = cls.prototype.disconnectedCallback || (function () { });\r\n cls.prototype.connectedCallback = function () {\r\n var _this = this;\r\n if (!this[init] && !config.template) {\r\n if (config.useShadow === false) {\r\n // Base class with no template\r\n }\r\n else {\r\n this.attachShadow({ mode: 'open' });\r\n }\r\n }\r\n else if (!this[init] && config.template) {\r\n var $template = document.createElement('template');\r\n $template.innerHTML = \"\".concat(cls.prototype[template], \"<style>\").concat(cls.prototype[style], \"</style>\");\r\n var $node = document.importNode($template.content, true);\r\n if (config.useShadow === false) {\r\n this.appendChild($node);\r\n }\r\n else {\r\n this.attachShadow({ mode: 'open' }).appendChild($node);\r\n }\r\n }\r\n else if (this[init] && config.style) {\r\n /*if (this.shadowRoot) {\r\n const style = document.createElement('style');\r\n style.appendChild(document.createTextNode(config.style));\r\n this.appendChild(style);\r\n }*/\r\n // } else if (this[init] && config.template) {\r\n // This is allowed now via <parent/>\r\n // throw new Error('template from base class cannot be overriden. Fix: remove template from @Component');\r\n }\r\n else if (this[init] && !config.template) {\r\n throw new Error('You need to pass a template for an extended element.');\r\n }\r\n if (this.componentWillMount) {\r\n this.componentWillMount();\r\n }\r\n this[parent].map(function (p) {\r\n if (p.render) {\r\n p.render.call(_this, cls.observedAttributes\r\n ? cls.observedAttributes.reduce(function (a, c) {\r\n var n = dashToCamel(c);\r\n a[n] = true;\r\n return a;\r\n }, {})\r\n : {});\r\n }\r\n });\r\n this[init] = true;\r\n connectedCallback.call(this);\r\n if (this.componentDidMount) {\r\n this.componentDidMount();\r\n }\r\n };\r\n cls.prototype.disconnectedCallback = function () {\r\n if (this.componentWillUnmount) {\r\n this.componentWillUnmount();\r\n }\r\n disconnectedCallback.call(this);\r\n if (this.componentDidUnmount) {\r\n this.componentDidUnmount();\r\n }\r\n };\r\n cls.prototype.attributeChangedCallback = function (name, oldValue, newValue) {\r\n var normalizedName = dashToCamel(name);\r\n this[normalizedName] = newValue;\r\n };\r\n if (config.selector && !window.customElements.get(config.selector)) {\r\n window.customElements.define(config.selector, cls);\r\n }\r\n };\r\n}\r\nvar transmute = Symbol('transmute');\r\nfunction TransmutePart(part, selector) {\r\n return function (cls) {\r\n var _a;\r\n if (cls.prototype[transmute]) {\r\n cls.prototype[transmute][part] = selector;\r\n }\r\n else {\r\n cls.prototype[transmute] = (_a = {}, _a[part] = selector, _a);\r\n }\r\n };\r\n}\r\nfunction Prop() {\r\n return function (target, propertyKey, descriptor) {\r\n var constructor = target.constructor;\r\n if (!constructor.observedAttributes) {\r\n constructor.observedAttributes = [];\r\n }\r\n var observedAttributes = constructor.observedAttributes;\r\n if (!constructor.symbols) {\r\n constructor.symbols = {};\r\n }\r\n var symbols = constructor.symbols;\r\n var normalizedPropertyKey = camelToDash(propertyKey);\r\n constructor.observedAttributes = observedAttributes.concat([normalizedPropertyKey]);\r\n var symbol = Symbol(propertyKey);\r\n symbols[propertyKey] = symbol;\r\n Object.defineProperty(target, propertyKey, {\r\n get: function () {\r\n return this[symbol];\r\n },\r\n set: function (value) {\r\n var _this = this;\r\n this[symbol] = value;\r\n if (this[init]) {\r\n this[parent].map(function (p) {\r\n var _a;\r\n if (p.render) {\r\n p.render.call(_this, (_a = {}, _a[propertyKey] = true, _a));\r\n }\r\n });\r\n }\r\n }\r\n });\r\n };\r\n}\r\nfunction Part() {\r\n return function (target, propertyKey, descriptor) {\r\n Object.defineProperty(target, propertyKey, {\r\n get: function () {\r\n var _a;\r\n var key = propertyKey.replace(/^\\$/, '');\r\n return (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(\"[part~=\".concat(key, \"]\"));\r\n }\r\n });\r\n };\r\n}\r\nfunction Local(initialValue, key) {\r\n if (initialValue === void 0) { initialValue = null; }\r\n return function (target, propertyKey, descriptor) {\r\n var getKey = function (self) {\r\n return (key ? key : \"\".concat(self.constructor.name, \":\").concat(propertyKey));\r\n };\r\n Object.defineProperty(target, propertyKey, {\r\n get: function () {\r\n var k = getKey(this);\r\n return window.localStorage.getItem(k) || initialValue;\r\n },\r\n set: function (value) {\r\n var k = getKey(this);\r\n if (value === null) {\r\n window.localStorage.removeItem(k);\r\n }\r\n else {\r\n window.localStorage.setItem(k, value);\r\n }\r\n }\r\n });\r\n };\r\n}\r\nfunction node(template, init) {\r\n var $template = document.createElement('template');\r\n $template.innerHTML = template;\r\n var $node = document.importNode($template.content, true);\r\n for (var _i = 0, _a = Object.entries(init); _i < _a.length; _i++) {\r\n var _b = _a[_i], part = _b[0], attributes = _b[1];\r\n var $part = $node.querySelector(\"[part~=\\\"\".concat(part, \"\\\"]\"));\r\n if ($part) {\r\n for (var _c = 0, _d = Object.entries(attributes); _c < _d.length; _c++) {\r\n var _e = _d[_c], prop = _e[0], value = _e[1];\r\n if (value instanceof Function) {\r\n var val = value();\r\n if (val === null) {\r\n $part.removeAttribute(prop);\r\n }\r\n else {\r\n $part.setAttribute(prop, value());\r\n }\r\n }\r\n else {\r\n $part[prop] = value;\r\n }\r\n }\r\n }\r\n }\r\n return $node;\r\n}\r\n// JEST\r\nfunction selectComponent(tag) {\r\n return document.querySelector(tag);\r\n}\r\nfunction selectPart(component, name) {\r\n return component.shadowRoot.querySelector(\"[part=\".concat(name, \"]\"));\r\n}\r\nfunction getProps(tag) {\r\n var symbols = customElements.get(tag).symbols;\r\n return Object.keys(symbols);\r\n}\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./node_modules/@pictogrammers/element/dist/element.esm.js?");
20
-
21
- /***/ }),
22
-
23
- /***/ "./src/pg/tooltip/tooltip.css":
24
- /*!************************************!*\
25
- !*** ./src/pg/tooltip/tooltip.css ***!
26
- \************************************/
27
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
28
-
29
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (\":host {\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n[part~=tooltip] {\\r\\n position: relative;\\r\\n}\\r\\n\\r\\n[part~=tooltipText] {\\r\\n position: absolute;\\r\\n background: #737E9E;\\r\\n border-radius: 0.25rem;\\r\\n color: #FFF;\\r\\n padding: 0.15rem 0.5rem 0.3rem 0.5rem;\\r\\n white-space: nowrap;\\r\\n left: 0;\\r\\n top: 0;\\r\\n}\\r\\n\\r\\n[part~=tooltipArrow] {\\r\\n left: 16px;\\r\\n top: -7px;\\r\\n}\\r\\n\\r\\n[part~=tooltipArrow],\\r\\n[part~=tooltipArrow]::before {\\r\\n position: absolute;\\r\\n width: 10px;\\r\\n height: 10px;\\r\\n}\\r\\n\\r\\n[part~=tooltipArrow]::before {\\r\\n content: '';\\r\\n transform: rotate(45deg);\\r\\n background: #737E9E;\\r\\n}\");\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/tooltip/tooltip.css?");
30
-
31
- /***/ }),
32
-
33
- /***/ "./src/pg/tooltip/tooltip.html":
34
- /*!*************************************!*\
35
- !*** ./src/pg/tooltip/tooltip.html ***!
36
- \*************************************/
37
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
38
-
39
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (\"<div part=\\\"tooltip\\\">\\r\\n <span part=\\\"tooltipText\\\"></span>\\r\\n <div part=\\\"tooltipArrow\\\"></div>\\r\\n</div>\");\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/tooltip/tooltip.html?");
40
-
41
- /***/ }),
42
-
43
- /***/ "./src/pg/tooltip/position.ts":
44
- /*!************************************!*\
45
- !*** ./src/pg/tooltip/position.ts ***!
46
- \************************************/
47
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
48
-
49
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"BOTTOM\": () => (/* binding */ BOTTOM),\n/* harmony export */ \"BOTTOM_END\": () => (/* binding */ BOTTOM_END),\n/* harmony export */ \"BOTTOM_START\": () => (/* binding */ BOTTOM_START),\n/* harmony export */ \"LEFT\": () => (/* binding */ LEFT),\n/* harmony export */ \"LEFT_END\": () => (/* binding */ LEFT_END),\n/* harmony export */ \"LEFT_START\": () => (/* binding */ LEFT_START),\n/* harmony export */ \"RIGHT\": () => (/* binding */ RIGHT),\n/* harmony export */ \"RIGHT_END\": () => (/* binding */ RIGHT_END),\n/* harmony export */ \"RIGHT_START\": () => (/* binding */ RIGHT_START),\n/* harmony export */ \"TOP\": () => (/* binding */ TOP),\n/* harmony export */ \"TOP_END\": () => (/* binding */ TOP_END),\n/* harmony export */ \"TOP_START\": () => (/* binding */ TOP_START)\n/* harmony export */ });\nconst TOP = 'top';\r\nconst TOP_START = 'top-start';\r\nconst TOP_END = 'top-end';\r\nconst RIGHT = 'right';\r\nconst RIGHT_START = 'right-start';\r\nconst RIGHT_END = 'right-end';\r\nconst BOTTOM = 'bottom';\r\nconst BOTTOM_START = 'bottom-start';\r\nconst BOTTOM_END = 'bottom-end';\r\nconst LEFT = 'left';\r\nconst LEFT_START = 'left-start';\r\nconst LEFT_END = 'left-end';\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/tooltip/position.ts?");
50
-
51
- /***/ }),
52
-
53
- /***/ "./src/pg/tooltip/tooltip.ts":
54
- /*!***********************************!*\
55
- !*** ./src/pg/tooltip/tooltip.ts ***!
56
- \***********************************/
57
- /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
58
-
59
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @pictogrammers/element */ \"./node_modules/@pictogrammers/element/dist/element.esm.js\");\n/* harmony import */ var _tooltip_html__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./tooltip.html */ \"./src/pg/tooltip/tooltip.html\");\n/* harmony import */ var _tooltip_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./tooltip.css */ \"./src/pg/tooltip/tooltip.css\");\n/* harmony import */ var _position__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./position */ \"./src/pg/tooltip/position.ts\");\nvar __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n};\r\n\r\n\r\n\r\n\r\nconst map = {\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.TOP_START]: (width, height, rect) => {\r\n return {\r\n arrowTop: height - 5,\r\n arrowLeft: rect.width > width\r\n ? Math.floor(width / 2) - 5\r\n : Math.floor(rect.width / 2) - 5,\r\n left: rect.left,\r\n top: rect.top - height - 10\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.TOP]: (width, height, rect) => {\r\n return {\r\n arrowTop: height - 5,\r\n arrowLeft: Math.floor(width / 2) - 5,\r\n left: rect.left - Math.floor((width - rect.width) / 2),\r\n top: rect.top - height - 10\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.TOP_END]: (width, height, rect) => {\r\n return {\r\n arrowTop: height - 5,\r\n arrowLeft: rect.width > width\r\n ? width - Math.floor(width / 2) - 5\r\n : width - Math.floor(rect.width / 2) - 5,\r\n left: rect.left - width + rect.width,\r\n top: rect.top - height - 10\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.RIGHT_START]: (width, height, rect) => {\r\n return {\r\n arrowTop: Math.floor(height / 2) - 5,\r\n arrowLeft: -5,\r\n left: rect.left + rect.width + 10,\r\n top: rect.top\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.RIGHT]: (width, height, rect) => {\r\n return {\r\n arrowTop: Math.floor(height / 2) - 5,\r\n arrowLeft: -5,\r\n left: rect.left + rect.width + 10,\r\n top: rect.top + Math.floor(rect.height / 2) - Math.floor(height / 2)\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.RIGHT_END]: (width, height, rect) => {\r\n return {\r\n arrowTop: Math.floor(height / 2) - 5,\r\n arrowLeft: -5,\r\n left: rect.left + rect.width + 10,\r\n top: rect.top + rect.height - height\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.BOTTOM_START]: (width, height, rect) => {\r\n return {\r\n arrowTop: -5,\r\n arrowLeft: rect.width > width\r\n ? Math.floor(width / 2) - 5\r\n : Math.floor(rect.width / 2) - 5,\r\n left: rect.left,\r\n top: rect.top + rect.height + height - 20\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.BOTTOM]: (width, height, rect) => {\r\n return {\r\n arrowTop: -5,\r\n arrowLeft: Math.floor(width / 2) - 5,\r\n left: rect.left - Math.floor((width - rect.width) / 2),\r\n top: rect.top + rect.height + height - 20\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.BOTTOM_END]: (width, height, rect) => {\r\n return {\r\n arrowTop: -5,\r\n arrowLeft: rect.width > width\r\n ? width - Math.floor(width / 2) - 5\r\n : width - Math.floor(rect.width / 2) - 5,\r\n left: rect.left - width + rect.width,\r\n top: rect.top + rect.height + height - 20\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.LEFT_START]: (width, height, rect) => {\r\n return {\r\n arrowTop: Math.floor(height / 2) - 5,\r\n arrowLeft: width - 5,\r\n left: rect.left - width - 10,\r\n top: rect.top\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.LEFT]: (width, height, rect) => {\r\n return {\r\n arrowTop: Math.floor(height / 2) - 5,\r\n arrowLeft: width - 5,\r\n left: rect.left - width - 10,\r\n top: rect.top + Math.floor(rect.height / 2) - Math.floor(height / 2)\r\n };\r\n },\r\n [_position__WEBPACK_IMPORTED_MODULE_3__.LEFT_END]: (width, height, rect) => {\r\n return {\r\n arrowTop: Math.floor(height / 2) - 5,\r\n arrowLeft: width - 5,\r\n left: rect.left - width - 10,\r\n top: rect.top + rect.height - height\r\n };\r\n }\r\n};\r\nlet PgTooltip = class PgTooltip extends HTMLElement {\r\n constructor() {\r\n super(...arguments);\r\n this.visible = false;\r\n this.rect = null;\r\n this.text = '';\r\n this.position = _position__WEBPACK_IMPORTED_MODULE_3__.BOTTOM;\r\n }\r\n render(changes) {\r\n this.$tooltipText.innerText = this.text;\r\n this.style.position = 'absolute';\r\n if (changes.visible) {\r\n this.style.display = this.visible ? 'block' : 'none';\r\n }\r\n const { width: tooltipWidth, height: tooltipHeight } = this.$tooltipText.getBoundingClientRect();\r\n let position = this.position;\r\n if (!(position in map)) {\r\n position = _position__WEBPACK_IMPORTED_MODULE_3__.BOTTOM;\r\n }\r\n if (this.rect) {\r\n const { arrowLeft, arrowTop, left, top } = map[position](tooltipWidth, tooltipHeight, this.rect);\r\n this.style.left = `${left + window.scrollX}px`;\r\n this.style.top = `${top + window.scrollY}px`;\r\n this.$tooltipArrow.style.left = `${arrowLeft}px`;\r\n this.$tooltipArrow.style.top = `${arrowTop}px`;\r\n }\r\n }\r\n};\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Prop)()\r\n], PgTooltip.prototype, \"visible\", void 0);\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Prop)()\r\n], PgTooltip.prototype, \"rect\", void 0);\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Prop)()\r\n], PgTooltip.prototype, \"text\", void 0);\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Prop)()\r\n], PgTooltip.prototype, \"position\", void 0);\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Part)()\r\n], PgTooltip.prototype, \"$tooltip\", void 0);\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Part)()\r\n], PgTooltip.prototype, \"$tooltipText\", void 0);\r\n__decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Part)()\r\n], PgTooltip.prototype, \"$tooltipArrow\", void 0);\r\nPgTooltip = __decorate([\r\n (0,_pictogrammers_element__WEBPACK_IMPORTED_MODULE_0__.Component)({\r\n selector: 'pg-tooltip',\r\n style: _tooltip_css__WEBPACK_IMPORTED_MODULE_2__[\"default\"],\r\n template: _tooltip_html__WEBPACK_IMPORTED_MODULE_1__[\"default\"]\r\n })\r\n], PgTooltip);\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PgTooltip);\r\n\n\n//# sourceURL=webpack://@pictogrammers/components/./src/pg/tooltip/tooltip.ts?");
60
-
61
- /***/ })
62
-
63
- /******/ });
64
- /************************************************************************/
65
- /******/ // The module cache
66
- /******/ var __webpack_module_cache__ = {};
67
- /******/
68
- /******/ // The require function
69
- /******/ function __webpack_require__(moduleId) {
70
- /******/ // Check if module is in cache
71
- /******/ var cachedModule = __webpack_module_cache__[moduleId];
72
- /******/ if (cachedModule !== undefined) {
73
- /******/ return cachedModule.exports;
74
- /******/ }
75
- /******/ // Create a new module (and put it into the cache)
76
- /******/ var module = __webpack_module_cache__[moduleId] = {
77
- /******/ // no module.id needed
78
- /******/ // no module.loaded needed
79
- /******/ exports: {}
80
- /******/ };
81
- /******/
82
- /******/ // Execute the module function
83
- /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
84
- /******/
85
- /******/ // Return the exports of the module
86
- /******/ return module.exports;
87
- /******/ }
88
- /******/
89
- /************************************************************************/
90
- /******/ /* webpack/runtime/define property getters */
91
- /******/ (() => {
92
- /******/ // define getter functions for harmony exports
93
- /******/ __webpack_require__.d = (exports, definition) => {
94
- /******/ for(var key in definition) {
95
- /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
96
- /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
97
- /******/ }
98
- /******/ }
99
- /******/ };
100
- /******/ })();
101
- /******/
102
- /******/ /* webpack/runtime/hasOwnProperty shorthand */
103
- /******/ (() => {
104
- /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
105
- /******/ })();
106
- /******/
107
- /******/ /* webpack/runtime/make namespace object */
108
- /******/ (() => {
109
- /******/ // define __esModule on exports
110
- /******/ __webpack_require__.r = (exports) => {
111
- /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
112
- /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
113
- /******/ }
114
- /******/ Object.defineProperty(exports, '__esModule', { value: true });
115
- /******/ };
116
- /******/ })();
117
- /******/
118
- /************************************************************************/
119
- /******/
120
- /******/ // startup
121
- /******/ // Load entry module and return exports
122
- /******/ // This entry module can't be inlined because the eval devtool is used.
123
- /******/ var __webpack_exports__ = __webpack_require__("./src/pg/tooltip/tooltip.ts");
124
- /******/
125
- /******/ })()
126
- ;