@aquera/nile-elements 0.1.29-beta-1.2 → 0.1.29

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 (233) hide show
  1. package/README.md +13 -0
  2. package/demo/filenames.txt +1 -1
  3. package/demo/index.html +97 -0
  4. package/dist/index.cjs.js +1 -1
  5. package/dist/index.esm.js +1 -1
  6. package/dist/nile-accordion/nile-accordion.cjs.js +1 -1
  7. package/dist/nile-accordion/nile-accordion.cjs.js.map +1 -1
  8. package/dist/nile-accordion/nile-accordion.esm.js +2 -2
  9. package/dist/nile-avatar/nile-avatar.test.cjs.js +1 -1
  10. package/dist/nile-avatar/nile-avatar.test.cjs.js.map +1 -1
  11. package/dist/nile-avatar/nile-avatar.test.esm.js +1 -1
  12. package/dist/nile-badge/index.cjs.js +1 -1
  13. package/dist/nile-badge/index.esm.js +1 -1
  14. package/dist/nile-badge/nile-badge.cjs.js +1 -1
  15. package/dist/nile-badge/nile-badge.cjs.js.map +1 -1
  16. package/dist/nile-badge/nile-badge.esm.js +1 -1
  17. package/dist/nile-badge/nile-badge.test.cjs.js +1 -1
  18. package/dist/nile-badge/nile-badge.test.cjs.js.map +1 -1
  19. package/dist/nile-badge/nile-badge.test.esm.js +1 -1
  20. package/dist/nile-button/index.cjs.js +1 -1
  21. package/dist/nile-button/index.esm.js +1 -1
  22. package/dist/nile-button/nile-button.cjs.js +1 -1
  23. package/dist/nile-button/nile-button.cjs.js.map +1 -1
  24. package/dist/nile-button/nile-button.esm.js +1 -1
  25. package/dist/nile-button/nile-button.test.cjs.js +1 -1
  26. package/dist/nile-button/nile-button.test.cjs.js.map +1 -1
  27. package/dist/nile-button/nile-button.test.esm.js +1 -1
  28. package/dist/nile-calendar/nile-calendar.test.cjs.js +1 -1
  29. package/dist/nile-calendar/nile-calendar.test.cjs.js.map +1 -1
  30. package/dist/nile-calendar/nile-calendar.test.esm.js +1 -1
  31. package/dist/nile-chip/nile-chip.test.cjs.js +1 -1
  32. package/dist/nile-chip/nile-chip.test.cjs.js.map +1 -1
  33. package/dist/nile-chip/nile-chip.test.esm.js +1 -1
  34. package/dist/nile-circular-progressbar/nile-circular-progressbar.cjs.js +1 -1
  35. package/dist/nile-circular-progressbar/nile-circular-progressbar.cjs.js.map +1 -1
  36. package/dist/nile-circular-progressbar/nile-circular-progressbar.css.cjs.js +1 -1
  37. package/dist/nile-circular-progressbar/nile-circular-progressbar.css.cjs.js.map +1 -1
  38. package/dist/nile-circular-progressbar/nile-circular-progressbar.css.esm.js +29 -47
  39. package/dist/nile-circular-progressbar/nile-circular-progressbar.esm.js +13 -16
  40. package/dist/nile-dialog/index.cjs.js +1 -1
  41. package/dist/nile-dialog/index.esm.js +1 -1
  42. package/dist/nile-dialog/nile-dialog.cjs.js +1 -1
  43. package/dist/nile-dialog/nile-dialog.cjs.js.map +1 -1
  44. package/dist/nile-dialog/nile-dialog.esm.js +1 -1
  45. package/dist/nile-dialog/nile-dialog.test.cjs.js +1 -1
  46. package/dist/nile-dialog/nile-dialog.test.cjs.js.map +1 -1
  47. package/dist/nile-dialog/nile-dialog.test.esm.js +1 -1
  48. package/dist/nile-drawer/index.cjs.js +1 -1
  49. package/dist/nile-drawer/index.esm.js +1 -1
  50. package/dist/nile-drawer/nile-drawer.cjs.js +1 -1
  51. package/dist/nile-drawer/nile-drawer.cjs.js.map +1 -1
  52. package/dist/nile-drawer/nile-drawer.esm.js +1 -1
  53. package/dist/nile-drawer/nile-drawer.test.cjs.js +1 -1
  54. package/dist/nile-drawer/nile-drawer.test.cjs.js.map +1 -1
  55. package/dist/nile-drawer/nile-drawer.test.esm.js +1 -1
  56. package/dist/nile-icon/icons/svg/index.cjs.js +1 -1
  57. package/dist/nile-icon/icons/svg/index.esm.js +1 -1
  58. package/dist/nile-icon/icons/svg/resource_analysis.cjs.js +2 -0
  59. package/dist/nile-icon/icons/svg/resource_analysis.cjs.js.map +1 -0
  60. package/dist/nile-icon/icons/svg/resource_analysis.esm.js +1 -0
  61. package/dist/nile-icon/icons/svg/resource_graph.cjs.js +2 -0
  62. package/dist/nile-icon/icons/svg/resource_graph.cjs.js.map +1 -0
  63. package/dist/nile-icon/icons/svg/resource_graph.esm.js +1 -0
  64. package/dist/nile-icon/icons/svg/sort_ascending.cjs.js +2 -0
  65. package/dist/nile-icon/icons/svg/sort_ascending.cjs.js.map +1 -0
  66. package/dist/nile-icon/icons/svg/sort_ascending.esm.js +1 -0
  67. package/dist/nile-icon/icons/svg/sort_descending.cjs.js +2 -0
  68. package/dist/nile-icon/icons/svg/sort_descending.cjs.js.map +1 -0
  69. package/dist/nile-icon/icons/svg/sort_descending.esm.js +1 -0
  70. package/dist/nile-icon/icons/svg/transaction_monitor.cjs.js +2 -0
  71. package/dist/nile-icon/icons/svg/transaction_monitor.cjs.js.map +1 -0
  72. package/dist/nile-icon/icons/svg/transaction_monitor.esm.js +1 -0
  73. package/dist/nile-icon/index.cjs.js +1 -1
  74. package/dist/nile-icon/index.cjs.js.map +1 -1
  75. package/dist/nile-icon/index.esm.js +1 -1
  76. package/dist/nile-icon/nile-icon.test.cjs.js +1 -1
  77. package/dist/nile-icon/nile-icon.test.cjs.js.map +1 -1
  78. package/dist/nile-icon/nile-icon.test.esm.js +1 -1
  79. package/dist/nile-icon-button/index.cjs.js +1 -1
  80. package/dist/nile-icon-button/index.esm.js +1 -1
  81. package/dist/nile-icon-button/nile-icon-button.cjs.js +1 -1
  82. package/dist/nile-icon-button/nile-icon-button.cjs.js.map +1 -1
  83. package/dist/nile-icon-button/nile-icon-button.esm.js +1 -1
  84. package/dist/nile-input/index.cjs.js +1 -1
  85. package/dist/nile-input/index.esm.js +1 -1
  86. package/dist/nile-input/nile-input.cjs.js +1 -1
  87. package/dist/nile-input/nile-input.cjs.js.map +1 -1
  88. package/dist/nile-input/nile-input.esm.js +1 -1
  89. package/dist/nile-input/nile-input.test.cjs.js +1 -1
  90. package/dist/nile-input/nile-input.test.cjs.js.map +1 -1
  91. package/dist/nile-input/nile-input.test.esm.js +1 -1
  92. package/dist/nile-menu-item/index.cjs.js +1 -1
  93. package/dist/nile-menu-item/index.esm.js +1 -1
  94. package/dist/nile-menu-item/nile-menu-item.cjs.js +1 -1
  95. package/dist/nile-menu-item/nile-menu-item.cjs.js.map +1 -1
  96. package/dist/nile-menu-item/nile-menu-item.esm.js +1 -1
  97. package/dist/nile-option/index.cjs.js +1 -1
  98. package/dist/nile-option/index.esm.js +1 -1
  99. package/dist/nile-option/nile-option.cjs.js +1 -1
  100. package/dist/nile-option/nile-option.cjs.js.map +1 -1
  101. package/dist/nile-option/nile-option.esm.js +1 -1
  102. package/dist/nile-progress-bar/nile-progress-bar.cjs.js +1 -1
  103. package/dist/nile-progress-bar/nile-progress-bar.cjs.js.map +1 -1
  104. package/dist/nile-progress-bar/nile-progress-bar.css.cjs.js +1 -1
  105. package/dist/nile-progress-bar/nile-progress-bar.css.cjs.js.map +1 -1
  106. package/dist/nile-progress-bar/nile-progress-bar.css.esm.js +3 -16
  107. package/dist/nile-progress-bar/nile-progress-bar.esm.js +3 -3
  108. package/dist/nile-select/index.cjs.js +1 -1
  109. package/dist/nile-select/index.esm.js +1 -1
  110. package/dist/nile-select/nile-select.cjs.js +1 -1
  111. package/dist/nile-select/nile-select.cjs.js.map +1 -1
  112. package/dist/nile-select/nile-select.esm.js +1 -1
  113. package/dist/nile-select/nile-select.test.cjs.js +1 -1
  114. package/dist/nile-select/nile-select.test.cjs.js.map +1 -1
  115. package/dist/nile-select/nile-select.test.esm.js +1 -1
  116. package/dist/nile-stepper/nile-stepper.cjs.js +1 -1
  117. package/dist/nile-stepper/nile-stepper.cjs.js.map +1 -1
  118. package/dist/nile-stepper/nile-stepper.css.cjs.js +1 -1
  119. package/dist/nile-stepper/nile-stepper.css.cjs.js.map +1 -1
  120. package/dist/nile-stepper/nile-stepper.css.esm.js +2 -8
  121. package/dist/nile-stepper/nile-stepper.esm.js +3 -3
  122. package/dist/nile-stepper-item/nile-stepper-item.cjs.js +1 -1
  123. package/dist/nile-stepper-item/nile-stepper-item.cjs.js.map +1 -1
  124. package/dist/nile-stepper-item/nile-stepper-item.css.cjs.js +1 -1
  125. package/dist/nile-stepper-item/nile-stepper-item.css.cjs.js.map +1 -1
  126. package/dist/nile-stepper-item/nile-stepper-item.css.esm.js +16 -37
  127. package/dist/nile-stepper-item/nile-stepper-item.esm.js +17 -20
  128. package/dist/nile-tab/index.cjs.js +1 -1
  129. package/dist/nile-tab/index.esm.js +1 -1
  130. package/dist/nile-tab/nile-tab.cjs.js +1 -1
  131. package/dist/nile-tab/nile-tab.cjs.js.map +1 -1
  132. package/dist/nile-tab/nile-tab.esm.js +1 -1
  133. package/dist/nile-tab-group/index.cjs.js +1 -1
  134. package/dist/nile-tab-group/index.esm.js +1 -1
  135. package/dist/nile-tab-group/nile-tab-group.cjs.js +1 -1
  136. package/dist/nile-tab-group/nile-tab-group.cjs.js.map +1 -1
  137. package/dist/nile-tab-group/nile-tab-group.esm.js +1 -1
  138. package/dist/nile-tab-group/nile-tab-group.test.cjs.js +1 -1
  139. package/dist/nile-tab-group/nile-tab-group.test.cjs.js.map +1 -1
  140. package/dist/nile-tab-group/nile-tab-group.test.esm.js +1 -1
  141. package/dist/nile-tag/index.cjs.js +1 -1
  142. package/dist/nile-tag/index.esm.js +1 -1
  143. package/dist/nile-tag/nile-tag.cjs.js +1 -1
  144. package/dist/nile-tag/nile-tag.cjs.js.map +1 -1
  145. package/dist/nile-tag/nile-tag.esm.js +1 -1
  146. package/dist/nile-toast/index.cjs.js +1 -1
  147. package/dist/nile-toast/index.esm.js +1 -1
  148. package/dist/nile-toast/nile-toast.cjs.js +1 -1
  149. package/dist/nile-toast/nile-toast.cjs.js.map +1 -1
  150. package/dist/nile-toast/nile-toast.esm.js +1 -1
  151. package/dist/nile-tree/index.cjs.js +1 -1
  152. package/dist/nile-tree/index.esm.js +1 -1
  153. package/dist/nile-tree/nile-tree.cjs.js +1 -1
  154. package/dist/nile-tree/nile-tree.cjs.js.map +1 -1
  155. package/dist/nile-tree/nile-tree.esm.js +1 -1
  156. package/dist/nile-tree-item/index.cjs.js +1 -1
  157. package/dist/nile-tree-item/index.esm.js +1 -1
  158. package/dist/nile-tree-item/nile-tree-item.cjs.js +1 -1
  159. package/dist/nile-tree-item/nile-tree-item.cjs.js.map +1 -1
  160. package/dist/nile-tree-item/nile-tree-item.esm.js +1 -1
  161. package/dist/nile-vertical-stepper-item/nile-vertical-stepper-item.cjs.js +1 -1
  162. package/dist/nile-vertical-stepper-item/nile-vertical-stepper-item.cjs.js.map +1 -1
  163. package/dist/nile-vertical-stepper-item/nile-vertical-stepper-item.css.cjs.js +1 -1
  164. package/dist/nile-vertical-stepper-item/nile-vertical-stepper-item.css.cjs.js.map +1 -1
  165. package/dist/nile-vertical-stepper-item/nile-vertical-stepper-item.css.esm.js +14 -28
  166. package/dist/nile-vertical-stepper-item/nile-vertical-stepper-item.esm.js +13 -11
  167. package/dist/src/nile-accordion/nile-accordion.d.ts +5 -6
  168. package/dist/src/nile-accordion/nile-accordion.js +6 -19
  169. package/dist/src/nile-accordion/nile-accordion.js.map +1 -1
  170. package/dist/src/nile-circular-progressbar/nile-circular-progressbar.css.d.ts +5 -5
  171. package/dist/src/nile-circular-progressbar/nile-circular-progressbar.css.js +34 -52
  172. package/dist/src/nile-circular-progressbar/nile-circular-progressbar.css.js.map +1 -1
  173. package/dist/src/nile-circular-progressbar/nile-circular-progressbar.d.ts +2 -6
  174. package/dist/src/nile-circular-progressbar/nile-circular-progressbar.js +32 -47
  175. package/dist/src/nile-circular-progressbar/nile-circular-progressbar.js.map +1 -1
  176. package/dist/src/nile-icon/icons/svg/index.d.ts +5 -0
  177. package/dist/src/nile-icon/icons/svg/index.js +5 -0
  178. package/dist/src/nile-icon/icons/svg/index.js.map +1 -1
  179. package/dist/src/nile-icon/icons/svg/resource_analysis.d.ts +5 -0
  180. package/dist/src/nile-icon/icons/svg/resource_analysis.js +5 -0
  181. package/dist/src/nile-icon/icons/svg/resource_analysis.js.map +1 -0
  182. package/dist/src/nile-icon/icons/svg/resource_graph.d.ts +5 -0
  183. package/dist/src/nile-icon/icons/svg/resource_graph.js +5 -0
  184. package/dist/src/nile-icon/icons/svg/resource_graph.js.map +1 -0
  185. package/dist/src/nile-icon/icons/svg/sort_ascending.d.ts +5 -0
  186. package/dist/src/nile-icon/icons/svg/sort_ascending.js +5 -0
  187. package/dist/src/nile-icon/icons/svg/sort_ascending.js.map +1 -0
  188. package/dist/src/nile-icon/icons/svg/sort_descending.d.ts +5 -0
  189. package/dist/src/nile-icon/icons/svg/sort_descending.js +5 -0
  190. package/dist/src/nile-icon/icons/svg/sort_descending.js.map +1 -0
  191. package/dist/src/nile-icon/icons/svg/transaction_monitor.d.ts +5 -0
  192. package/dist/src/nile-icon/icons/svg/transaction_monitor.js +5 -0
  193. package/dist/src/nile-icon/icons/svg/transaction_monitor.js.map +1 -0
  194. package/dist/src/nile-progress-bar/nile-progress-bar.css.js +1 -14
  195. package/dist/src/nile-progress-bar/nile-progress-bar.css.js.map +1 -1
  196. package/dist/src/nile-progress-bar/nile-progress-bar.d.ts +0 -1
  197. package/dist/src/nile-progress-bar/nile-progress-bar.js +1 -6
  198. package/dist/src/nile-progress-bar/nile-progress-bar.js.map +1 -1
  199. package/dist/src/nile-stepper/nile-stepper.css.js +0 -6
  200. package/dist/src/nile-stepper/nile-stepper.css.js.map +1 -1
  201. package/dist/src/nile-stepper/nile-stepper.d.ts +2 -2
  202. package/dist/src/nile-stepper/nile-stepper.js +8 -8
  203. package/dist/src/nile-stepper/nile-stepper.js.map +1 -1
  204. package/dist/src/nile-stepper-item/nile-stepper-item.css.js +16 -37
  205. package/dist/src/nile-stepper-item/nile-stepper-item.css.js.map +1 -1
  206. package/dist/src/nile-stepper-item/nile-stepper-item.d.ts +1 -5
  207. package/dist/src/nile-stepper-item/nile-stepper-item.js +14 -33
  208. package/dist/src/nile-stepper-item/nile-stepper-item.js.map +1 -1
  209. package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.js +14 -28
  210. package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.js.map +1 -1
  211. package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.d.ts +0 -1
  212. package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.js +8 -10
  213. package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.js.map +1 -1
  214. package/dist/tsconfig.tsbuildinfo +1 -1
  215. package/package.json +1 -1
  216. package/src/nile-accordion/nile-accordion.ts +2 -13
  217. package/src/nile-circular-progressbar/nile-circular-progressbar.css.ts +31 -48
  218. package/src/nile-circular-progressbar/nile-circular-progressbar.ts +26 -49
  219. package/src/nile-icon/icons/svg/index.ts +5 -0
  220. package/src/nile-icon/icons/svg/resource_analysis.ts +5 -0
  221. package/src/nile-icon/icons/svg/resource_graph.ts +5 -0
  222. package/src/nile-icon/icons/svg/sort_ascending.ts +5 -0
  223. package/src/nile-icon/icons/svg/sort_descending.ts +5 -0
  224. package/src/nile-icon/icons/svg/transaction_monitor.ts +5 -0
  225. package/src/nile-progress-bar/nile-progress-bar.css.ts +2 -15
  226. package/src/nile-progress-bar/nile-progress-bar.ts +1 -6
  227. package/src/nile-stepper/nile-stepper.css.ts +0 -6
  228. package/src/nile-stepper/nile-stepper.ts +11 -11
  229. package/src/nile-stepper-item/nile-stepper-item.css.ts +16 -37
  230. package/src/nile-stepper-item/nile-stepper-item.ts +17 -34
  231. package/src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.ts +14 -28
  232. package/src/nile-vertical-stepper-item/nile-vertical-stepper-item.ts +8 -12
  233. package/vscode-html-custom-data.json +9 -30
@@ -1 +1 @@
1
- {"version":3,"file":"nile-accordion.js","sourceRoot":"","sources":["../../../src/nile-accordion/nile-accordion.ts"],"names":[],"mappings":"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","sourcesContent":[" /**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {LitElement, html, CSSResultArray, TemplateResult} from 'lit';\nimport {styles} from './nile-accordion.css';\nimport NileElement from '../internal/nile-element';\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../internal/animate';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { getAnimation, setDefaultAnimation } from '../utilities/animation-registry';\nimport { waitForEvent } from '../internal/event';\nimport { watch } from '../internal/watch';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * Nile detail component.\n *\n * @tag nile-accordion\n *\n */\n@customElement('nile-accordion')\nexport class NileAccordion extends NileElement {\n\n/**\n * @summary Accordian show a brief summary and expand to show additional content.\n *\n * @dependency nile-icon\n *\n * @slot - The accordian' main content.\n * @slot summary - The accordian' summary. Alternatively, you can use the `summary` attribute.\n * @slot expand-icon - Optional expand icon to use instead of the default. Works best with `<nile-icon>`.\n * @slot collapse-icon - Optional collapse icon to use instead of the default. Works best with `<nile-icon>`.\n *\n * @event nile-show - Emitted when the accordian opens.\n * @event nile-after-show - Emitted after the accordian opens and all animations are complete.\n * @event nile-hide - Emitted when the accordian closes.\n * @event nile-after-hide - Emitted after the accordian closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper.\n * @csspart header - The header that wraps both the summary and the expand/collapse icon.\n * @csspart summary - The container that wraps the summary.\n * @csspart summary-icon - The container that wraps the expand/collapse icons.\n * @csspart content - The accordian content.\n *\n * @animation accordian.show - The animation to use when showing accordian. You can use `height: auto` with this animation.\n * @animation accordian.hide - The animation to use when hiding accordian. You can use `height: auto` with this animation.\n */\n\nstatic styles: CSSResultGroup = styles;\n\n\n@query('.accordian') accordian: HTMLElement;\n@query('.accordian__header') header: HTMLElement;\n@query('.accordian__body') body: HTMLElement;\n@query('.accordian__expand-icon-slot') expandIconSlot: HTMLSlotElement;\n@query('slot[name=\"summary\"]') summarySlot: HTMLSlotElement; \n\n/**\n * Indicates whether or not the accordian is open. You can toggle this attribute to show and hide the accordian, or you\n * can use the `show()` and `hide()` methods and this attribute will reflect the accordian' open state.\n */\n@property({ type: Boolean, reflect: true }) open = false;\n\n/**\n * Indicates the visual style of the accordian component. Accepted values are `'dark'` or `'light'`.\n * Defaults to `'light'`.\n */\n@property({ reflect: true }) variant: 'dark' | 'light' = 'light';\n\n/**\n * Specifies the direction of the arrow indicator. Accepted values are `'left'` or `'right'`.\n * Defaults to `'right'`.\n */\n@property({ reflect: true }) expandIconPlacement: 'left' | 'right' = 'right';\n\n/**\n * Specifies the size of the accordian component. Accepted values are `'sm'`, `'md'`, or `'lg'`.\n * Defaults to `'md'`.\n */\n@property({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\n\n/** The summary to show in the header. If you need to display HTML, use the `summary` slot instead. */\n@property() summary: string;\n\n/** Disables the accordian so it can't be toggled. */\n@property({ type: Boolean, reflect: true }) disabled = false;\n\nfirstUpdated() {\n this.body.hidden = !this.open;\n this.body.style.height = this.open ? 'auto' : '0';\n}\n\n private handleSummaryClick(event: MouseEvent) {\n const path = event.composedPath();\n const slotIndex = path.indexOf(this.summarySlot);\n if (slotIndex !== -1) {\n for (let i = 0; i < slotIndex; i++) {\n const el = path[i];\n if (el instanceof Element && el.matches('input, button, select, textarea, a, label')) {\n return; \n }\n }\n }\n if (!this.disabled) {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n\n this.header.focus();\n }\n}\n\nprivate handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n event.preventDefault();\n this.show();\n }\n}\n\n@watch('open', { waitUntilFirstUpdate: true })\nasync handleOpenChange() {\n if (this.open) {\n // Show\n const nileShow = this.emit('nile-show', { cancelable: true });\n if (nileShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n await stopAnimations(this.body);\n this.body.hidden = false;\n\n const { keyframes, options } = getAnimation(this, 'accordian.show', { dir: 'ltr' });\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = 'auto';\n\n this.emit('nile-after-show');\n } else {\n // Hide\n const nileHide = this.emit('nile-hide', { cancelable: true });\n if (nileHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, 'accordian.hide', { dir: 'ltr' });\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.hidden = true;\n this.body.style.height = 'auto';\n\n this.emit('nile-after-hide');\n }\n}\n\n/** Shows the accordian. */\nasync show() {\n if (this.open || this.disabled) {\n return undefined;\n }\n\n this.open = true;\n return waitForEvent(this, 'nile-after-show');\n}\n\n/** Hides the accordian */\nasync hide() {\n if (!this.open || this.disabled) {\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'nile-after-hide');\n}\n\nrender() {\n const isRtl = true;\n\n return html`\n <div\n part=\"base\"\n class=${classMap({\n accordian: true,\n 'accordian--open': this.open,\n 'accordian--disabled': this.disabled,\n 'accordian--sm':this.size=='sm',\n 'accordian--md':this.size=='md',\n 'accordian--lg':this.size=='lg',\n })}\n >\n <div\n part=\"header\"\n id=\"header\"\n class=\"${classMap({\n 'accordian__header':true,\n 'accordian__header--dark':this.variant=='dark',\n 'accordian__header--arrow-left':'left'==this.expandIconPlacement\n })}\"\n role=\"button\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-controls=\"content\"\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @click=${this.handleSummaryClick}\n @keydown=${this.handleSummaryKeyDown}\n >\n <slot name=\"summary\" part=\"summary\" class=\"accordian__summary\">${this.summary}</slot>\n\n <span part=\"summary-icon\" class=\"accordian__summary-icon\">\n <slot name=\"expand-icon\">\n <nile-icon name=\"arrowright\"></nile-icon>\n </slot>\n <slot name=\"collapse-icon\">\n <nile-icon name=\"arrowright\"></nile-icon>\n </slot>\n </span>\n </div>\n\n <div class=\"accordian__body\" role=\"region\" aria-labelledby=\"header\">\n <slot part=\"content\" id=\"content\" \n class=\"${classMap({\n 'accordian__content':true,\n 'accordian__content--arrow-left':this.expandIconPlacement=='left'\n })}\"></slot>\n </div>\n </div>\n `;\n}\n}\n\nsetDefaultAnimation('accordian.show', {\nkeyframes: [\n { height: '0', opacity: '0' },\n { height: 'auto', opacity: '1' }\n],\noptions: { duration: 250, easing: 'linear' }\n});\n\nsetDefaultAnimation('accordian.hide', {\nkeyframes: [\n { height: 'auto', opacity: '1' },\n { height: '0', opacity: '0' }\n],\noptions: { duration: 250, easing: 'linear' }\n});\n\nexport default NileAccordion;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-accordion': NileAccordion;\n }\n}\n"]}
1
+ {"version":3,"file":"nile-accordion.js","sourceRoot":"","sources":["../../../src/nile-accordion/nile-accordion.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {LitElement, html, CSSResultArray, TemplateResult} from 'lit';\nimport {styles} from './nile-accordion.css';\nimport NileElement from '../internal/nile-element';\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../internal/animate';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { getAnimation, setDefaultAnimation } from '../utilities/animation-registry';\nimport { waitForEvent } from '../internal/event';\nimport { watch } from '../internal/watch';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * Nile detail component.\n *\n * @tag nile-accordion\n *\n */\n@customElement('nile-accordion')\nexport class NileAccordion extends NileElement {\n\n/**\n * @summary Accordian show a brief summary and expand to show additional content.\n *\n * @dependency nile-icon\n *\n * @slot - The accordian' main content.\n * @slot summary - The accordian' summary. Alternatively, you can use the `summary` attribute.\n * @slot expand-icon - Optional expand icon to use instead of the default. Works best with `<nile-icon>`.\n * @slot collapse-icon - Optional collapse icon to use instead of the default. Works best with `<nile-icon>`.\n *\n * @event nile-show - Emitted when the accordian opens.\n * @event nile-after-show - Emitted after the accordian opens and all animations are complete.\n * @event nile-hide - Emitted when the accordian closes.\n * @event nile-after-hide - Emitted after the accordian closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper.\n * @csspart header - The header that wraps both the summary and the expand/collapse icon.\n * @csspart summary - The container that wraps the summary.\n * @csspart summary-icon - The container that wraps the expand/collapse icons.\n * @csspart content - The accordian content.\n *\n * @animation accordian.show - The animation to use when showing accordian. You can use `height: auto` with this animation.\n * @animation accordian.hide - The animation to use when hiding accordian. You can use `height: auto` with this animation.\n */\n\nstatic styles: CSSResultGroup = styles;\n\n\n@query('.accordian') accordian: HTMLElement;\n@query('.accordian__header') header: HTMLElement;\n@query('.accordian__body') body: HTMLElement;\n@query('.accordian__expand-icon-slot') expandIconSlot: HTMLSlotElement;\n\n/**\n * Indicates whether or not the accordian is open. You can toggle this attribute to show and hide the accordian, or you\n * can use the `show()` and `hide()` methods and this attribute will reflect the accordian' open state.\n */\n@property({ type: Boolean, reflect: true }) open = false;\n\n/**\n * Indicates the visual style of the accordian component. Accepted values are `'dark'` or `'light'`.\n * Defaults to `'light'`.\n */\n@property({ reflect: true }) variant: 'dark' | 'light' = 'light';\n\n/**\n * Specifies the direction of the arrow indicator. Accepted values are `'left'` or `'right'`.\n * Defaults to `'right'`.\n */\n@property({ reflect: true }) expandIconPlacement: 'left' | 'right' = 'right';\n\n/**\n * Specifies the size of the accordian component. Accepted values are `'sm'`, `'md'`, or `'lg'`.\n * Defaults to `'md'`.\n */\n@property({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\n\n/** The summary to show in the header. If you need to display HTML, use the `summary` slot instead. */\n@property() summary: string;\n\n/** Disables the accordian so it can't be toggled. */\n@property({ type: Boolean, reflect: true }) disabled = false;\n\nfirstUpdated() {\n this.body.hidden = !this.open;\n this.body.style.height = this.open ? 'auto' : '0';\n}\n\nprivate handleSummaryClick() {\n if (!this.disabled) {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n\n this.header.focus();\n }\n}\n\nprivate handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n event.preventDefault();\n this.show();\n }\n}\n\n@watch('open', { waitUntilFirstUpdate: true })\nasync handleOpenChange() {\n if (this.open) {\n // Show\n const nileShow = this.emit('nile-show', { cancelable: true });\n if (nileShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n await stopAnimations(this.body);\n this.body.hidden = false;\n\n const { keyframes, options } = getAnimation(this, 'accordian.show', { dir: 'ltr' });\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = 'auto';\n\n this.emit('nile-after-show');\n } else {\n // Hide\n const nileHide = this.emit('nile-hide', { cancelable: true });\n if (nileHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, 'accordian.hide', { dir: 'ltr' });\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.hidden = true;\n this.body.style.height = 'auto';\n\n this.emit('nile-after-hide');\n }\n}\n\n/** Shows the accordian. */\nasync show() {\n if (this.open || this.disabled) {\n return undefined;\n }\n\n this.open = true;\n return waitForEvent(this, 'nile-after-show');\n}\n\n/** Hides the accordian */\nasync hide() {\n if (!this.open || this.disabled) {\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'nile-after-hide');\n}\n\nrender() {\n const isRtl = true;\n\n return html`\n <div\n part=\"base\"\n class=${classMap({\n accordian: true,\n 'accordian--open': this.open,\n 'accordian--disabled': this.disabled,\n 'accordian--sm':this.size=='sm',\n 'accordian--md':this.size=='md',\n 'accordian--lg':this.size=='lg',\n })}\n >\n <div\n part=\"header\"\n id=\"header\"\n class=\"${classMap({\n 'accordian__header':true,\n 'accordian__header--dark':this.variant=='dark',\n 'accordian__header--arrow-left':'left'==this.expandIconPlacement\n })}\"\n role=\"button\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-controls=\"content\"\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @click=${this.handleSummaryClick}\n @keydown=${this.handleSummaryKeyDown}\n >\n <slot name=\"summary\" part=\"summary\" class=\"accordian__summary\">${this.summary}</slot>\n\n <span part=\"summary-icon\" class=\"accordian__summary-icon\">\n <slot name=\"expand-icon\">\n <nile-icon name=\"arrowright\"></nile-icon>\n </slot>\n <slot name=\"collapse-icon\">\n <nile-icon name=\"arrowright\"></nile-icon>\n </slot>\n </span>\n </div>\n\n <div class=\"accordian__body\" role=\"region\" aria-labelledby=\"header\">\n <slot part=\"content\" id=\"content\" \n class=\"${classMap({\n 'accordian__content':true,\n 'accordian__content--arrow-left':this.expandIconPlacement=='left'\n })}\"></slot>\n </div>\n </div>\n `;\n}\n}\n\nsetDefaultAnimation('accordian.show', {\nkeyframes: [\n { height: '0', opacity: '0' },\n { height: 'auto', opacity: '1' }\n],\noptions: { duration: 250, easing: 'linear' }\n});\n\nsetDefaultAnimation('accordian.hide', {\nkeyframes: [\n { height: 'auto', opacity: '1' },\n { height: '0', opacity: '0' }\n],\noptions: { duration: 250, easing: 'linear' }\n});\n\nexport default NileAccordion;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-accordion': NileAccordion;\n }\n}\n"]}
@@ -1,9 +1,9 @@
1
1
  /**
2
- * Copyright Aquera Inc 2023
3
- *
4
- * This source code is licensed under the BSD-3-Clause license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
2
+ * Copyright Aquera Inc 2023
3
+ *
4
+ * This source code is licensed under the BSD-3-Clause license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
7
  /**
8
8
  * Progressbar CSS
9
9
  */
@@ -1,61 +1,43 @@
1
1
  /**
2
- * Copyright Aquera Inc 2023
3
- *
4
- * This source code is licensed under the BSD-3-Clause license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
2
+ * Copyright Aquera Inc 2023
3
+ *
4
+ * This source code is licensed under the BSD-3-Clause license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
7
  import { css } from 'lit';
8
8
  /**
9
9
  * Progressbar CSS
10
10
  */
11
11
  export const styles = css `
12
-
13
- :host {
14
- display: inline-block;
15
- }
16
-
17
- .track {
18
- stroke-width: 4px;
19
- stroke: var(--nile-colors-neutral-400);
20
- opacity: 0.5;
21
- fill: none;
22
- }
23
-
24
- .progress {
25
- stroke-width: 4px;
26
- stroke: var(--nile-colors-primary-600);
27
- stroke-linecap: round;
28
- fill: none;
29
- transform: rotate(270deg);
30
- transform-origin: center;
31
- transition: stroke-dashoffset 0.8s ease-in-out;
32
- }
33
-
34
- .circle__text {
35
- fill: var(--nile-colors-dark-900);
36
- text-align: center;
37
- font-size: var(--nile-type-scale-1);
38
- font-style: normal;
39
- font-weight: var(--nile-font-weight-regular);
40
- line-height: var(--nile-type-scale-1);
41
- letter-spacing: 0.2px;
42
- }
43
-
44
- .nile-progress-bar__status {
45
- display: flex;
46
- justify-content: space-between;
47
- align-items: center;
48
- margin-bottom: 4px;
49
- }
50
-
51
- .nile-progress-bar__message {
52
- flex-grow: 1;
53
- }
54
-
55
- .nile-progress-bar__percentage {
56
- white-space: nowrap;
57
- }
58
-
12
+ :host{
13
+
14
+ }
15
+ .track {
16
+ stroke-width: 2px;
17
+ stroke: var(--nile-colors-yellow-400);
18
+ opacity: 0.5;
19
+ fill: none;
20
+ }
21
+
22
+ .progress {
23
+ stroke-width: 2px;
24
+ stroke: var(--nile-colors-yellow-500);
25
+ stroke-linecap: round;
26
+ fill: none;
27
+ transform: rotate(270deg);
28
+ transform-origin: center;
29
+ }
30
+
31
+ .circle__text {
32
+ color: var(--nile-colors-dark-900);
33
+ text-align: center;
34
+ font-size: var(--nile-type-scale-1);
35
+ font-style: normal;
36
+ font-weight: var(--nile-font-weight-regular);
37
+ line-height: var(--nile-type-scale-1);
38
+ letter-spacing: 0.2px;
39
+ text-transform: uppercase;
40
+ }
59
41
  `;
60
42
  export default [styles];
61
43
  //# sourceMappingURL=nile-circular-progressbar.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"nile-circular-progressbar.css.js","sourceRoot":"","sources":["../../../src/nile-circular-progressbar/nile-circular-progressbar.css.ts"],"names":[],"mappings":"AAAC;;;;;EAKE;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgDxB,CAAA;AACD,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":[" /**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * Progressbar CSS\n */\nexport const styles = css`\n\n :host {\n display: inline-block;\n}\n\n.track {\n stroke-width: 4px;\n stroke: var(--nile-colors-neutral-400);\n opacity: 0.5;\n fill: none;\n}\n\n.progress {\n stroke-width: 4px;\n stroke: var(--nile-colors-primary-600);\n stroke-linecap: round;\n fill: none;\n transform: rotate(270deg);\n transform-origin: center;\n transition: stroke-dashoffset 0.8s ease-in-out; \n}\n\n.circle__text {\n fill: var(--nile-colors-dark-900);\n text-align: center;\n font-size: var(--nile-type-scale-1);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular);\n line-height: var(--nile-type-scale-1);\n letter-spacing: 0.2px;\n}\n\n.nile-progress-bar__status {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 4px;\n}\n\n.nile-progress-bar__message {\n flex-grow: 1;\n}\n\n.nile-progress-bar__percentage {\n white-space: nowrap;\n}\n\n`\nexport default [styles];\n"]}
1
+ {"version":3,"file":"nile-circular-progressbar.css.js","sourceRoot":"","sources":["../../../src/nile-circular-progressbar/nile-circular-progressbar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * Progressbar CSS\n */\nexport const styles = css`\n :host{\n \n }\n .track {\n stroke-width: 2px;\n stroke: var(--nile-colors-yellow-400);\n opacity: 0.5;\n fill: none;\n }\n\n .progress {\n stroke-width: 2px;\n stroke: var(--nile-colors-yellow-500);\n stroke-linecap: round;\n fill: none;\n transform: rotate(270deg);\n transform-origin: center;\n }\n\n .circle__text {\n color: var(--nile-colors-dark-900);\n text-align: center;\n font-size: var(--nile-type-scale-1);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular);\n line-height: var(--nile-type-scale-1);\n letter-spacing: 0.2px;\n text-transform: uppercase;\n }\n`;\n\nexport default [styles];\n"]}
@@ -18,18 +18,14 @@ export declare class NileCircularProgressbar extends NileElement {
18
18
  * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
19
19
  */
20
20
  static get styles(): CSSResultArray;
21
- progressCircle: SVGCircleElement;
22
- value: number;
21
+ progressCircle: any;
22
+ progress: number;
23
23
  /**
24
24
  * Render method
25
25
  * @slot This is a slot test
26
26
  */
27
- content?: string;
28
- size: number;
29
- private get circleSize();
30
27
  connectedCallback(): void;
31
28
  private setProgress;
32
- updated(changedProperties: Map<string, any>): void;
33
29
  render(): TemplateResult;
34
30
  }
35
31
  export default NileCircularProgressbar;
@@ -18,8 +18,7 @@ import NileElement from '../internal/nile-element';
18
18
  let NileCircularProgressbar = class NileCircularProgressbar extends NileElement {
19
19
  constructor() {
20
20
  super(...arguments);
21
- this.value = 0;
22
- this.size = 40;
21
+ this.progress = 50;
23
22
  /* #endregion */
24
23
  }
25
24
  /**
@@ -29,53 +28,45 @@ let NileCircularProgressbar = class NileCircularProgressbar extends NileElement
29
28
  static get styles() {
30
29
  return [styles];
31
30
  }
32
- get circleSize() {
33
- const radius = this.size / 2 - 4;
34
- return {
35
- radius,
36
- viewBox: this.size,
37
- fontSize: `${this.size * 0.25}px`,
38
- };
39
- }
31
+ /* #endregion */
32
+ /* #region Methods */
33
+ /**
34
+ * Render method
35
+ * @slot This is a slot test
36
+ */
37
+ // make reactive to pass through
40
38
  connectedCallback() {
41
39
  super.connectedCallback();
42
40
  this.updateComplete.then(() => {
43
- this.value = Math.max(0, Math.min(100, this.value));
44
- this.setProgress(this.value);
41
+ if (this.progress < 0) {
42
+ this.progress = 0;
43
+ }
44
+ if (this.progress > 100) {
45
+ this.progress = 100;
46
+ }
47
+ this.setProgress(this.progress);
45
48
  });
46
49
  }
47
50
  setProgress(percent) {
48
- if (this.progressCircle) {
49
- const circleRadius = this.progressCircle.r.baseVal.value;
50
- const circumference = circleRadius * 2 * Math.PI;
51
- this.progressCircle.style.transition = 'stroke-dashoffset 0.8s ease-in-out';
52
- this.progressCircle.style.strokeDasharray = `${circumference}`;
53
- this.progressCircle.style.strokeDashoffset = `${circumference - (percent / 100) * circumference}`;
54
- }
55
- }
56
- updated(changedProperties) {
57
- if (changedProperties.has('value')) {
58
- this.setProgress(this.value);
59
- }
51
+ const circleRadius = this.progressCircle.r.baseVal.value;
52
+ let circumference = circleRadius * 2 * Math.PI;
53
+ this.progressCircle.style.strokeDasharray = circumference;
54
+ this.progressCircle.style.strokeDashoffset =
55
+ circumference - (percent / 100) * circumference;
60
56
  }
61
57
  render() {
62
- const { radius, viewBox, fontSize } = this.circleSize;
63
- const innerText = this.content ?? `${Math.round(this.value)}%`;
64
58
  return html `
65
- <svg width="${viewBox}" height="${viewBox}" viewBox="0 0 ${viewBox} ${viewBox}">
66
- <circle r="${radius}" cx="${viewBox / 2}" cy="${viewBox / 2}" class="track"></circle>
67
- <circle r="${radius}" cx="${viewBox / 2}" cy="${viewBox / 2}" class="progress"></circle>
68
-
69
-
70
- <text
71
- x="50%"
72
- y="53%"
73
- text-anchor="middle"
74
- alignment-baseline="middle"
75
- class="circle__text"
76
- style="font-size: ${fontSize};"
77
- >
78
- ${innerText}
59
+ <svg width="40" height="40">
60
+ <circle r="19" cx="20" cy="20" class="track"></circle>
61
+ <circle r="19" cx="20" cy="20" class="progress"></circle>
62
+ <text
63
+ x="50%"
64
+ y="50%"
65
+ text-anchor="middle"
66
+ alignment-baseline="middle"
67
+ class="circle__text"
68
+ >
69
+ ${this.progress} %
79
70
  </text>
80
71
  </svg>
81
72
  `;
@@ -86,13 +77,7 @@ __decorate([
86
77
  ], NileCircularProgressbar.prototype, "progressCircle", void 0);
87
78
  __decorate([
88
79
  property({ type: Number, reflect: true })
89
- ], NileCircularProgressbar.prototype, "value", void 0);
90
- __decorate([
91
- property({ type: String, reflect: true })
92
- ], NileCircularProgressbar.prototype, "content", void 0);
93
- __decorate([
94
- property({ type: Number, reflect: true })
95
- ], NileCircularProgressbar.prototype, "size", void 0);
80
+ ], NileCircularProgressbar.prototype, "progress", void 0);
96
81
  NileCircularProgressbar = __decorate([
97
82
  customElement('nile-circular-progressbar')
98
83
  ], NileCircularProgressbar);
@@ -1 +1 @@
1
- {"version":3,"file":"nile-circular-progressbar.js","sourceRoot":"","sources":["../../../src/nile-circular-progressbar/nile-circular-progressbar.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n LitElement,\n html,\n CSSResultArray,\n TemplateResult,\n} from 'lit';\nimport { customElement, query, property } from 'lit/decorators.js';\nimport { styles } from './nile-circular-progressbar.css';\nimport NileElement from '../internal/nile-element';\nimport logInfo from '../nile-icon/icons/svg/log-info';\n\n/**\n * Nile icon component.\n *\n * @tag nile-progressbar\n *\n */\n@customElement('nile-circular-progressbar')\nexport class NileCircularProgressbar extends NileElement {\n /**\n * The styles for Progressbar\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n */\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @query('.progress') progressCircle!: SVGCircleElement;\n \n @property({ type: Number, reflect: true }) value = 0;\n/* #endregion */\n\n /* #region Methods */\n\n /**\n * Render method\n * @slot This is a slot test\n */\n // make reactive to pass through\n @property({ type: String, reflect: true }) content?: string;\n @property({ type: Number, reflect: true }) size = 40; \n\n private get circleSize() {\n const radius = this.size / 2 - 4; \n return {\n radius,\n viewBox: this.size,\n fontSize: `${this.size * 0.25}px`, \n };\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.updateComplete.then(() => {\n this.value = Math.max(0, Math.min(100, this.value));\n this.setProgress(this.value);\n });\n }\n\n private setProgress(percent: number) {\n if (this.progressCircle) {\n const circleRadius = this.progressCircle.r.baseVal.value;\n const circumference = circleRadius * 2 * Math.PI;\n\n this.progressCircle.style.transition = 'stroke-dashoffset 0.8s ease-in-out'; \n this.progressCircle.style.strokeDasharray = `${circumference}`;\n this.progressCircle.style.strokeDashoffset = `${circumference - (percent / 100) * circumference}`;\n }\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('value')) {\n this.setProgress(this.value);\n }\n }\n\n public render(): TemplateResult {\n const { radius, viewBox, fontSize } = this.circleSize;\n const innerText = this.content ?? `${Math.round(this.value)}%`;\n\n return html`\n <svg width=\"${viewBox}\" height=\"${viewBox}\" viewBox=\"0 0 ${viewBox} ${viewBox}\">\n <circle r=\"${radius}\" cx=\"${viewBox / 2}\" cy=\"${viewBox / 2}\" class=\"track\"></circle>\n <circle r=\"${radius}\" cx=\"${viewBox / 2}\" cy=\"${viewBox / 2}\" class=\"progress\"></circle>\n \n \n <text\n x=\"50%\"\n y=\"53%\"\n text-anchor=\"middle\"\n alignment-baseline=\"middle\"\n class=\"circle__text\"\n style=\"font-size: ${fontSize};\"\n >\n ${innerText}\n </text>\n </svg>\n `;\n }\n\n /* #endregion */\n}\n\nexport default NileCircularProgressbar;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-circular-progressbar': NileCircularProgressbar;\n }\n}\n"]}
1
+ {"version":3,"file":"nile-circular-progressbar.js","sourceRoot":"","sources":["../../../src/nile-circular-progressbar/nile-circular-progressbar.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAGL,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AACzD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAGnD;;;;;GAKG;AAEI,IAAM,uBAAuB,GAA7B,MAAM,uBAAwB,SAAQ,WAAW;IAAjD;;QASsC,aAAQ,GAAG,EAAE,CAAC;QAkDzD,gBAAgB;IAClB,CAAC;IA3DC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAID,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACH,gCAAgC;IAEhC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE;YAC5B,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE,CAAC;gBACtB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;YACpB,CAAC;YACD,IAAI,IAAI,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC;gBACxB,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;YACtB,CAAC;YACD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAClC,CAAC,CAAC,CAAC;IACL,CAAC;IACO,WAAW,CAAC,OAAe;QACjC,MAAM,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC;QACzD,IAAI,aAAa,GAAG,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC;QAC/C,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,eAAe,GAAG,aAAa,CAAC;QAC1D,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,gBAAgB;YACxC,aAAa,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,GAAG,aAAa,CAAC;IACpD,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;;;YAWH,IAAI,CAAC,QAAQ;;;KAGpB,CAAC;IACJ,CAAC;CAGF,CAAA;AApDqB;IAAnB,KAAK,CAAC,WAAW,CAAC;+DAAqB;AACG;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yDAAe;AAT9C,uBAAuB;IADnC,aAAa,CAAC,2BAA2B,CAAC;GAC9B,uBAAuB,CA4DnC;;AAED,eAAe,uBAAuB,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n LitElement,\n html,\n CSSResultArray,\n TemplateResult,\n} from 'lit';\nimport { customElement, query, property } from 'lit/decorators.js';\nimport { styles } from './nile-circular-progressbar.css';\nimport NileElement from '../internal/nile-element';\nimport logInfo from '../nile-icon/icons/svg/log-info';\n\n/**\n * Nile icon component.\n *\n * @tag nile-progressbar\n *\n */\n@customElement('nile-circular-progressbar')\nexport class NileCircularProgressbar extends NileElement {\n /**\n * The styles for Progressbar\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n */\n public static get styles(): CSSResultArray {\n return [styles];\n }\n @query('.progress') progressCircle: any;\n @property({ type: Number, reflect: true }) progress = 50;\n\n /* #endregion */\n\n /* #region Methods */\n\n /**\n * Render method\n * @slot This is a slot test\n */\n // make reactive to pass through\n\n connectedCallback() {\n super.connectedCallback();\n this.updateComplete.then(() => {\n if (this.progress < 0) {\n this.progress = 0;\n }\n if (this.progress > 100) {\n this.progress = 100;\n }\n this.setProgress(this.progress);\n });\n }\n private setProgress(percent: number) {\n const circleRadius = this.progressCircle.r.baseVal.value;\n let circumference = circleRadius * 2 * Math.PI;\n this.progressCircle.style.strokeDasharray = circumference;\n this.progressCircle.style.strokeDashoffset =\n circumference - (percent / 100) * circumference;\n }\n\n public render(): TemplateResult {\n return html`\n <svg width=\"40\" height=\"40\">\n <circle r=\"19\" cx=\"20\" cy=\"20\" class=\"track\"></circle>\n <circle r=\"19\" cx=\"20\" cy=\"20\" class=\"progress\"></circle>\n <text\n x=\"50%\"\n y=\"50%\"\n text-anchor=\"middle\"\n alignment-baseline=\"middle\"\n class=\"circle__text\"\n >\n ${this.progress} %\n </text>\n </svg>\n `;\n }\n\n /* #endregion */\n}\n\nexport default NileCircularProgressbar;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-circular-progressbar': NileCircularProgressbar;\n }\n}\n"]}
@@ -414,6 +414,8 @@ export { default as refresh } from './refresh';
414
414
  export { default as reminder } from './reminder';
415
415
  export { default as resize } from './resize';
416
416
  export { default as resource } from './resource';
417
+ export { default as resource_analysis } from './resource_analysis';
418
+ export { default as resource_graph } from './resource_graph';
417
419
  export { default as restart_alt } from './restart_alt';
418
420
  export { default as revocationcycle } from './revocationcycle';
419
421
  export { default as revokationcycle } from './revokation-cycle';
@@ -457,6 +459,8 @@ export { default as shield01 } from './shield-01';
457
459
  export { default as smalltick } from './smalltick';
458
460
  export { default as smartcode } from './smartcode';
459
461
  export { default as sort } from './sort';
462
+ export { default as sort_ascending } from './sort_ascending';
463
+ export { default as sort_descending } from './sort_descending';
460
464
  export { default as sortascending } from './sortascending';
461
465
  export { default as sortdescending } from './sortdescending';
462
466
  export { default as sortdown } from './sortdown';
@@ -489,6 +493,7 @@ export { default as thumsup } from './thumsup';
489
493
  export { default as tick } from './tick';
490
494
  export { default as timeupdate } from './timeupdate';
491
495
  export { default as timezone } from './timezone';
496
+ export { default as transaction_monitor } from './transaction_monitor';
492
497
  export { default as trash01 } from './trash-01';
493
498
  export { default as trash03 } from './trash-03';
494
499
  export { default as trashnofill } from './trash-no-fill';
@@ -414,6 +414,8 @@ export { default as refresh } from './refresh';
414
414
  export { default as reminder } from './reminder';
415
415
  export { default as resize } from './resize';
416
416
  export { default as resource } from './resource';
417
+ export { default as resource_analysis } from './resource_analysis';
418
+ export { default as resource_graph } from './resource_graph';
417
419
  export { default as restart_alt } from './restart_alt';
418
420
  export { default as revocationcycle } from './revocationcycle';
419
421
  export { default as revokationcycle } from './revokation-cycle';
@@ -457,6 +459,8 @@ export { default as shield01 } from './shield-01';
457
459
  export { default as smalltick } from './smalltick';
458
460
  export { default as smartcode } from './smartcode';
459
461
  export { default as sort } from './sort';
462
+ export { default as sort_ascending } from './sort_ascending';
463
+ export { default as sort_descending } from './sort_descending';
460
464
  export { default as sortascending } from './sortascending';
461
465
  export { default as sortdescending } from './sortdescending';
462
466
  export { default as sortdown } from './sortdown';
@@ -489,6 +493,7 @@ export { default as thumsup } from './thumsup';
489
493
  export { default as tick } from './tick';
490
494
  export { default as timeupdate } from './timeupdate';
491
495
  export { default as timezone } from './timezone';
496
+ export { default as transaction_monitor } from './transaction_monitor';
492
497
  export { default as trash01 } from './trash-01';
493
498
  export { default as trash03 } from './trash-03';
494
499
  export { default as trashnofill } from './trash-no-fill';