@dhasdk/simple-ui 1.0.8 → 1.0.9

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 (227) hide show
  1. package/index.css +1 -0
  2. package/{src/index.ts → index.d.ts} +8 -15
  3. package/index.js +34 -0
  4. package/index.mjs +5473 -0
  5. package/lib/Accordion.d.ts +36 -0
  6. package/lib/AppointmentPicker.d.ts +21 -0
  7. package/lib/Badge.d.ts +11 -0
  8. package/lib/Breadcrumbs.d.ts +13 -0
  9. package/lib/Button.d.ts +15 -0
  10. package/lib/ButtonGroup.d.ts +8 -0
  11. package/lib/Card.d.ts +11 -0
  12. package/lib/CharacterCounter.d.ts +11 -0
  13. package/lib/CheckBox.d.ts +30 -0
  14. package/lib/DatePicker.d.ts +7 -0
  15. package/lib/Input.d.ts +16 -0
  16. package/lib/List.d.ts +22 -0
  17. package/lib/Modal.d.ts +18 -0
  18. package/lib/Pill.d.ts +13 -0
  19. package/lib/ProgressBar.d.ts +19 -0
  20. package/lib/RadioGroup.d.ts +16 -0
  21. package/lib/RadioIcon.d.ts +3 -0
  22. package/lib/Search.d.ts +26 -0
  23. package/lib/SearchContent.d.ts +6 -0
  24. package/lib/SectionHeader.d.ts +18 -0
  25. package/lib/Select.d.ts +19 -0
  26. package/lib/Shield.d.ts +12 -0
  27. package/lib/SideBarNav.d.ts +21 -0
  28. package/lib/Skeleton.d.ts +15 -0
  29. package/lib/SkipLink.d.ts +23 -0
  30. package/lib/Slider.d.ts +14 -0
  31. package/lib/Status.d.ts +10 -0
  32. package/lib/Tabs.d.ts +26 -0
  33. package/lib/Toggle.d.ts +11 -0
  34. package/lib/Tooltip.d.ts +14 -0
  35. package/package.json +1 -1
  36. package/.babelrc +0 -12
  37. package/.storybook/main.ts +0 -35
  38. package/.storybook/preview.ts +0 -4
  39. package/BAKpostcss.config.jsBAK +0 -15
  40. package/BAKtailwind.config.mjsBAK +0 -99
  41. package/coverage/storybook/coverage-storybook.json +0 -32411
  42. package/coverage/storybook/lcov-report/Accordion.tsx.html +0 -805
  43. package/coverage/storybook/lcov-report/Badge.tsx.html +0 -346
  44. package/coverage/storybook/lcov-report/Breadcrumbs.tsx.html +0 -742
  45. package/coverage/storybook/lcov-report/Button.tsx.html +0 -448
  46. package/coverage/storybook/lcov-report/ButtonGroup.tsx.html +0 -403
  47. package/coverage/storybook/lcov-report/Card.tsx.html +0 -292
  48. package/coverage/storybook/lcov-report/CharacterCounter.tsx.html +0 -253
  49. package/coverage/storybook/lcov-report/CheckBox.tsx.html +0 -1555
  50. package/coverage/storybook/lcov-report/DatePicker.tsx.html +0 -826
  51. package/coverage/storybook/lcov-report/Input.tsx.html +0 -1012
  52. package/coverage/storybook/lcov-report/List.tsx.html +0 -364
  53. package/coverage/storybook/lcov-report/Modal.tsx.html +0 -745
  54. package/coverage/storybook/lcov-report/Pill.tsx.html +0 -358
  55. package/coverage/storybook/lcov-report/Search.tsx.html +0 -997
  56. package/coverage/storybook/lcov-report/SearchContent.tsx.html +0 -235
  57. package/coverage/storybook/lcov-report/SectionHeader.tsx.html +0 -358
  58. package/coverage/storybook/lcov-report/Select.tsx.html +0 -1012
  59. package/coverage/storybook/lcov-report/Shield.tsx.html +0 -802
  60. package/coverage/storybook/lcov-report/SideBarNav.tsx.html +0 -490
  61. package/coverage/storybook/lcov-report/Skeleton.tsx.html +0 -394
  62. package/coverage/storybook/lcov-report/Slider.tsx.html +0 -385
  63. package/coverage/storybook/lcov-report/Status.tsx.html +0 -322
  64. package/coverage/storybook/lcov-report/Tabs.tsx.html +0 -610
  65. package/coverage/storybook/lcov-report/Toggle.tsx.html +0 -373
  66. package/coverage/storybook/lcov-report/Tooltip.tsx.html +0 -496
  67. package/coverage/storybook/lcov-report/base.css +0 -224
  68. package/coverage/storybook/lcov-report/block-navigation.js +0 -87
  69. package/coverage/storybook/lcov-report/favicon.png +0 -0
  70. package/coverage/storybook/lcov-report/index.html +0 -476
  71. package/coverage/storybook/lcov-report/prettify.css +0 -1
  72. package/coverage/storybook/lcov-report/prettify.js +0 -2
  73. package/coverage/storybook/lcov-report/sort-arrow-sprite.png +0 -0
  74. package/coverage/storybook/lcov-report/sorter.js +0 -196
  75. package/coverage/storybook/lcov.info +0 -2312
  76. package/dist/README.md +0 -1815
  77. package/eslint.config.mjs +0 -13
  78. package/project.json +0 -11
  79. package/src/assets/img/Frame.svg +0 -5
  80. package/src/assets/img/backArrowRight.svg +0 -10
  81. package/src/assets/img/bc-separator.png +0 -0
  82. package/src/assets/img/calendar.png +0 -0
  83. package/src/assets/img/calendar.svg +0 -4
  84. package/src/assets/img/check.svg +0 -5
  85. package/src/assets/img/check_box.svg +0 -10
  86. package/src/assets/img/check_box_empty.svg +0 -10
  87. package/src/assets/img/check_box_fill.svg +0 -10
  88. package/src/assets/img/check_box_fill_empty.svg +0 -10
  89. package/src/assets/img/chevron-down-white.svg +0 -2
  90. package/src/assets/img/chevron-down.svg +0 -2
  91. package/src/assets/img/chevron-left.svg +0 -1
  92. package/src/assets/img/chevron-right-light.svg +0 -4
  93. package/src/assets/img/chevron-right.svg +0 -3
  94. package/src/assets/img/chevron-up-white.svg +0 -1
  95. package/src/assets/img/chevron-up.svg +0 -1
  96. package/src/assets/img/clock.svg +0 -6
  97. package/src/assets/img/close.svg +0 -1
  98. package/src/assets/img/close2.svg +0 -6
  99. package/src/assets/img/closeModal.svg +0 -10
  100. package/src/assets/img/close_icon_dark.svg +0 -10
  101. package/src/assets/img/close_small.svg +0 -3
  102. package/src/assets/img/emergency_home.svg +0 -10
  103. package/src/assets/img/first-aid-kit.svg +0 -7
  104. package/src/assets/img/heartbeat.svg +0 -4
  105. package/src/assets/img/home-gray.svg +0 -3
  106. package/src/assets/img/home.svg +0 -3
  107. package/src/assets/img/hospital.jpg +0 -0
  108. package/src/assets/img/indeterminate_check_box.svg +0 -10
  109. package/src/assets/img/indeterminate_check_box_fill.svg +0 -10
  110. package/src/assets/img/info_24_ 1d4ed8.svg +0 -3
  111. package/src/assets/img/info_24_ 2c6441.svg +0 -3
  112. package/src/assets/img/marker_check_by_default.svg +0 -10
  113. package/src/assets/img/marker_check_by_default_fill.svg +0 -10
  114. package/src/assets/img/minus-accordion.svg +0 -5
  115. package/src/assets/img/minus.svg +0 -3
  116. package/src/assets/img/open.svg +0 -1
  117. package/src/assets/img/pill-white.svg +0 -7
  118. package/src/assets/img/pill.svg +0 -5
  119. package/src/assets/img/plus-accordion.svg +0 -5
  120. package/src/assets/img/plus.svg +0 -4
  121. package/src/assets/img/prescription.svg +0 -6
  122. package/src/assets/img/search.svg +0 -10
  123. package/src/assets/img/search_icon_light.svg +0 -10
  124. package/src/assets/img/separator.svg +0 -3
  125. package/src/assets/img/stethoscope-white.svg +0 -8
  126. package/src/assets/img/stethoscope.svg +0 -8
  127. package/src/assets/img/thumb_up.svg +0 -10
  128. package/src/assets/img/vector.svg +0 -3
  129. package/src/assets/img/warning-badge-disabled.svg +0 -11
  130. package/src/assets/img/warning-badge-green.svg +0 -11
  131. package/src/assets/img/warning-badge-red.svg +0 -11
  132. package/src/assets/img/warning-badge-yellow.svg +0 -11
  133. package/src/assets/img/warning.svg +0 -10
  134. package/src/global.d.ts +0 -13
  135. package/src/lib/Accordian--Accordian.stories.tsx +0 -312
  136. package/src/lib/Accordion.spec.tsx +0 -384
  137. package/src/lib/Accordion.tsx +0 -240
  138. package/src/lib/AppointmentPicker.spec.tsx +0 -138
  139. package/src/lib/AppointmentPicker.tsx +0 -97
  140. package/src/lib/Badge--Badge.stories.tsx +0 -60
  141. package/src/lib/Badge.spec.tsx +0 -70
  142. package/src/lib/Badge.tsx +0 -87
  143. package/src/lib/Breadcrumbs-Breadcrumbs.stories.tsx +0 -114
  144. package/src/lib/Breadcrumbs.spec.tsx +0 -218
  145. package/src/lib/Breadcrumbs.tsx +0 -219
  146. package/src/lib/Button--Button.stories.tsx +0 -220
  147. package/src/lib/Button.spec.tsx +0 -241
  148. package/src/lib/Button.tsx +0 -121
  149. package/src/lib/ButtonGroup--ButtonGroup.stories.tsx +0 -129
  150. package/src/lib/ButtonGroup.spec.tsx +0 -89
  151. package/src/lib/ButtonGroup.tsx +0 -107
  152. package/src/lib/Card--Card.stories.tsx +0 -113
  153. package/src/lib/Card.spec.tsx +0 -112
  154. package/src/lib/Card.tsx +0 -69
  155. package/src/lib/CharacterCounter--CharacterCounter.stories.tsx +0 -169
  156. package/src/lib/CharacterCounter.spec.tsx +0 -123
  157. package/src/lib/CharacterCounter.tsx +0 -56
  158. package/src/lib/CheckBox--CheckBox.stories.tsx +0 -107
  159. package/src/lib/CheckBox.spec.tsx +0 -412
  160. package/src/lib/CheckBox.tsx +0 -491
  161. package/src/lib/DatePicker--DatePicker.stories.tsx +0 -228
  162. package/src/lib/DatePicker.spec.tsx +0 -424
  163. package/src/lib/DatePicker.tsx +0 -247
  164. package/src/lib/Input--Input.stories.tsx +0 -449
  165. package/src/lib/Input.spec.tsx +0 -281
  166. package/src/lib/Input.tsx +0 -309
  167. package/src/lib/List--List.stories.tsx +0 -157
  168. package/src/lib/List.spec.tsx +0 -211
  169. package/src/lib/List.tsx +0 -93
  170. package/src/lib/Modal--Modal.stories.tsx +0 -454
  171. package/src/lib/Modal.spec.tsx +0 -202
  172. package/src/lib/Modal.tsx +0 -220
  173. package/src/lib/Pill--Pill.stories.tsx +0 -98
  174. package/src/lib/Pill.spec.tsx +0 -103
  175. package/src/lib/Pill.tsx +0 -91
  176. package/src/lib/ProgressBar.spec.tsx +0 -106
  177. package/src/lib/ProgressBar.tsx +0 -112
  178. package/src/lib/RadioGroup.spec.tsx +0 -84
  179. package/src/lib/RadioGroup.tsx +0 -74
  180. package/src/lib/RadioIcon.tsx +0 -13
  181. package/src/lib/Search--Search.stories.tsx +0 -67
  182. package/src/lib/Search.spec.tsx +0 -182
  183. package/src/lib/Search.tsx +0 -304
  184. package/src/lib/SearchContent.tsx +0 -51
  185. package/src/lib/SectionHeader--SectionHeader.stories.tsx +0 -98
  186. package/src/lib/SectionHeader.spec.tsx +0 -60
  187. package/src/lib/SectionHeader.tsx +0 -91
  188. package/src/lib/Select--Select.stories.tsx +0 -387
  189. package/src/lib/Select.spec.tsx +0 -493
  190. package/src/lib/Select.tsx +0 -311
  191. package/src/lib/Shield--Shield.stories.tsx +0 -196
  192. package/src/lib/Shield.spec.tsx +0 -275
  193. package/src/lib/Shield.tsx +0 -239
  194. package/src/lib/SideBarNav--SideBarNav.stories.tsx +0 -136
  195. package/src/lib/SideBarNav.spec.tsx +0 -178
  196. package/src/lib/SideBarNav.tsx +0 -135
  197. package/src/lib/Skeleton--Skeleton.stories.tsx +0 -77
  198. package/src/lib/Skeleton.module.css +0 -16
  199. package/src/lib/Skeleton.spec.tsx +0 -83
  200. package/src/lib/Skeleton.tsx +0 -103
  201. package/src/lib/SkipLink.spec.tsx +0 -76
  202. package/src/lib/SkipLink.tsx +0 -48
  203. package/src/lib/Slider--Slider.stories.tsx +0 -108
  204. package/src/lib/Slider.module.css +0 -109
  205. package/src/lib/Slider.spec.tsx +0 -67
  206. package/src/lib/Slider.tsx +0 -101
  207. package/src/lib/Status--Status.stories.tsx +0 -93
  208. package/src/lib/Status.spec.tsx +0 -118
  209. package/src/lib/Status.tsx +0 -79
  210. package/src/lib/Tabs--Tabs.stories.tsx +0 -294
  211. package/src/lib/Tabs.spec.tsx +0 -249
  212. package/src/lib/Tabs.tsx +0 -188
  213. package/src/lib/Tester.spec.tsx +0 -17
  214. package/src/lib/Toggle--Toggle.stories.tsx +0 -162
  215. package/src/lib/Toggle.spec.tsx +0 -122
  216. package/src/lib/Toggle.tsx +0 -96
  217. package/src/lib/Tooltip--Tooltip.stories.tsx +0 -315
  218. package/src/lib/Tooltip.spec.tsx +0 -307
  219. package/src/lib/Tooltip.tsx +0 -137
  220. package/src/lib/bak-simple-ui.stories.tsx-bak +0 -24
  221. package/src/styles.css +0 -190
  222. package/tsconfig.json +0 -25
  223. package/tsconfig.lib.json +0 -42
  224. package/tsconfig.spec.json +0 -29
  225. package/tsconfig.storybook.json +0 -36
  226. package/vite.config.mts +0 -87
  227. package/vitest.setup.ts +0 -12
package/coverage/storybook/lcov-report/Card.tsx.html DELETED
@@ -1,292 +0,0 @@
1
-
2
- <!doctype html>
3
- <html lang="en">
4
-
5
- <head>
6
- <title>Code coverage report for Card.tsx</title>
7
- <meta charset="utf-8" />
8
- <link rel="stylesheet" href="prettify.css" />
9
- <link rel="stylesheet" href="base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />
11
- <meta name="viewport" content="width=device-width, initial-scale=1" />
12
- <style type='text/css'>
13
- .coverage-summary .sorter {
14
- background-image: url(sort-arrow-sprite.png);
15
- }
16
- </style>
17
- </head>
18
-
19
- <body>
20
- <div class='wrapper'>
21
- <div class='pad1'>
22
- <h1><a href="index.html">All files</a> Card.tsx</h1>
23
- <div class='clearfix'>
24
-
25
- <div class='fl pad1y space-right2'>
26
- <span class="strong">100% </span>
27
- <span class="quiet">Statements</span>
28
- <span class='fraction'>8/8</span>
29
- </div>
30
-
31
-
32
- <div class='fl pad1y space-right2'>
33
- <span class="strong">100% </span>
34
- <span class="quiet">Branches</span>
35
- <span class='fraction'>13/13</span>
36
- </div>
37
-
38
-
39
- <div class='fl pad1y space-right2'>
40
- <span class="strong">100% </span>
41
- <span class="quiet">Functions</span>
42
- <span class='fraction'>1/1</span>
43
- </div>
44
-
45
-
46
- <div class='fl pad1y space-right2'>
47
- <span class="strong">100% </span>
48
- <span class="quiet">Lines</span>
49
- <span class='fraction'>8/8</span>
50
- </div>
51
-
52
-
53
- </div>
54
- <p class="quiet">
55
- Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
- </p>
57
- <template id="filterTemplate">
58
- <div class="quiet">
59
- Filter:
60
- <input type="search" id="fileSearch">
61
- </div>
62
- </template>
63
- </div>
64
- <div class='status-line high'></div>
65
- <pre><table class="coverage">
66
- <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
- <a name='L2'></a><a href='#L2'>2</a>
68
- <a name='L3'></a><a href='#L3'>3</a>
69
- <a name='L4'></a><a href='#L4'>4</a>
70
- <a name='L5'></a><a href='#L5'>5</a>
71
- <a name='L6'></a><a href='#L6'>6</a>
72
- <a name='L7'></a><a href='#L7'>7</a>
73
- <a name='L8'></a><a href='#L8'>8</a>
74
- <a name='L9'></a><a href='#L9'>9</a>
75
- <a name='L10'></a><a href='#L10'>10</a>
76
- <a name='L11'></a><a href='#L11'>11</a>
77
- <a name='L12'></a><a href='#L12'>12</a>
78
- <a name='L13'></a><a href='#L13'>13</a>
79
- <a name='L14'></a><a href='#L14'>14</a>
80
- <a name='L15'></a><a href='#L15'>15</a>
81
- <a name='L16'></a><a href='#L16'>16</a>
82
- <a name='L17'></a><a href='#L17'>17</a>
83
- <a name='L18'></a><a href='#L18'>18</a>
84
- <a name='L19'></a><a href='#L19'>19</a>
85
- <a name='L20'></a><a href='#L20'>20</a>
86
- <a name='L21'></a><a href='#L21'>21</a>
87
- <a name='L22'></a><a href='#L22'>22</a>
88
- <a name='L23'></a><a href='#L23'>23</a>
89
- <a name='L24'></a><a href='#L24'>24</a>
90
- <a name='L25'></a><a href='#L25'>25</a>
91
- <a name='L26'></a><a href='#L26'>26</a>
92
- <a name='L27'></a><a href='#L27'>27</a>
93
- <a name='L28'></a><a href='#L28'>28</a>
94
- <a name='L29'></a><a href='#L29'>29</a>
95
- <a name='L30'></a><a href='#L30'>30</a>
96
- <a name='L31'></a><a href='#L31'>31</a>
97
- <a name='L32'></a><a href='#L32'>32</a>
98
- <a name='L33'></a><a href='#L33'>33</a>
99
- <a name='L34'></a><a href='#L34'>34</a>
100
- <a name='L35'></a><a href='#L35'>35</a>
101
- <a name='L36'></a><a href='#L36'>36</a>
102
- <a name='L37'></a><a href='#L37'>37</a>
103
- <a name='L38'></a><a href='#L38'>38</a>
104
- <a name='L39'></a><a href='#L39'>39</a>
105
- <a name='L40'></a><a href='#L40'>40</a>
106
- <a name='L41'></a><a href='#L41'>41</a>
107
- <a name='L42'></a><a href='#L42'>42</a>
108
- <a name='L43'></a><a href='#L43'>43</a>
109
- <a name='L44'></a><a href='#L44'>44</a>
110
- <a name='L45'></a><a href='#L45'>45</a>
111
- <a name='L46'></a><a href='#L46'>46</a>
112
- <a name='L47'></a><a href='#L47'>47</a>
113
- <a name='L48'></a><a href='#L48'>48</a>
114
- <a name='L49'></a><a href='#L49'>49</a>
115
- <a name='L50'></a><a href='#L50'>50</a>
116
- <a name='L51'></a><a href='#L51'>51</a>
117
- <a name='L52'></a><a href='#L52'>52</a>
118
- <a name='L53'></a><a href='#L53'>53</a>
119
- <a name='L54'></a><a href='#L54'>54</a>
120
- <a name='L55'></a><a href='#L55'>55</a>
121
- <a name='L56'></a><a href='#L56'>56</a>
122
- <a name='L57'></a><a href='#L57'>57</a>
123
- <a name='L58'></a><a href='#L58'>58</a>
124
- <a name='L59'></a><a href='#L59'>59</a>
125
- <a name='L60'></a><a href='#L60'>60</a>
126
- <a name='L61'></a><a href='#L61'>61</a>
127
- <a name='L62'></a><a href='#L62'>62</a>
128
- <a name='L63'></a><a href='#L63'>63</a>
129
- <a name='L64'></a><a href='#L64'>64</a>
130
- <a name='L65'></a><a href='#L65'>65</a>
131
- <a name='L66'></a><a href='#L66'>66</a>
132
- <a name='L67'></a><a href='#L67'>67</a>
133
- <a name='L68'></a><a href='#L68'>68</a>
134
- <a name='L69'></a><a href='#L69'>69</a>
135
- <a name='L70'></a><a href='#L70'>70</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
136
- <span class="cline-any cline-neutral">&nbsp;</span>
137
- <span class="cline-any cline-neutral">&nbsp;</span>
138
- <span class="cline-any cline-neutral">&nbsp;</span>
139
- <span class="cline-any cline-neutral">&nbsp;</span>
140
- <span class="cline-any cline-neutral">&nbsp;</span>
141
- <span class="cline-any cline-neutral">&nbsp;</span>
142
- <span class="cline-any cline-neutral">&nbsp;</span>
143
- <span class="cline-any cline-yes">10x</span>
144
- <span class="cline-any cline-neutral">&nbsp;</span>
145
- <span class="cline-any cline-neutral">&nbsp;</span>
146
- <span class="cline-any cline-neutral">&nbsp;</span>
147
- <span class="cline-any cline-neutral">&nbsp;</span>
148
- <span class="cline-any cline-neutral">&nbsp;</span>
149
- <span class="cline-any cline-neutral">&nbsp;</span>
150
- <span class="cline-any cline-neutral">&nbsp;</span>
151
- <span class="cline-any cline-yes">10x</span>
152
- <span class="cline-any cline-neutral">&nbsp;</span>
153
- <span class="cline-any cline-neutral">&nbsp;</span>
154
- <span class="cline-any cline-neutral">&nbsp;</span>
155
- <span class="cline-any cline-neutral">&nbsp;</span>
156
- <span class="cline-any cline-yes">10x</span>
157
- <span class="cline-any cline-yes">10x</span>
158
- <span class="cline-any cline-neutral">&nbsp;</span>
159
- <span class="cline-any cline-neutral">&nbsp;</span>
160
- <span class="cline-any cline-neutral">&nbsp;</span>
161
- <span class="cline-any cline-neutral">&nbsp;</span>
162
- <span class="cline-any cline-neutral">&nbsp;</span>
163
- <span class="cline-any cline-neutral">&nbsp;</span>
164
- <span class="cline-any cline-neutral">&nbsp;</span>
165
- <span class="cline-any cline-neutral">&nbsp;</span>
166
- <span class="cline-any cline-neutral">&nbsp;</span>
167
- <span class="cline-any cline-neutral">&nbsp;</span>
168
- <span class="cline-any cline-neutral">&nbsp;</span>
169
- <span class="cline-any cline-yes">10x</span>
170
- <span class="cline-any cline-neutral">&nbsp;</span>
171
- <span class="cline-any cline-neutral">&nbsp;</span>
172
- <span class="cline-any cline-neutral">&nbsp;</span>
173
- <span class="cline-any cline-neutral">&nbsp;</span>
174
- <span class="cline-any cline-yes">54x</span>
175
- <span class="cline-any cline-neutral">&nbsp;</span>
176
- <span class="cline-any cline-neutral">&nbsp;</span>
177
- <span class="cline-any cline-neutral">&nbsp;</span>
178
- <span class="cline-any cline-neutral">&nbsp;</span>
179
- <span class="cline-any cline-neutral">&nbsp;</span>
180
- <span class="cline-any cline-neutral">&nbsp;</span>
181
- <span class="cline-any cline-neutral">&nbsp;</span>
182
- <span class="cline-any cline-neutral">&nbsp;</span>
183
- <span class="cline-any cline-neutral">&nbsp;</span>
184
- <span class="cline-any cline-neutral">&nbsp;</span>
185
- <span class="cline-any cline-neutral">&nbsp;</span>
186
- <span class="cline-any cline-neutral">&nbsp;</span>
187
- <span class="cline-any cline-neutral">&nbsp;</span>
188
- <span class="cline-any cline-neutral">&nbsp;</span>
189
- <span class="cline-any cline-neutral">&nbsp;</span>
190
- <span class="cline-any cline-neutral">&nbsp;</span>
191
- <span class="cline-any cline-neutral">&nbsp;</span>
192
- <span class="cline-any cline-neutral">&nbsp;</span>
193
- <span class="cline-any cline-neutral">&nbsp;</span>
194
- <span class="cline-any cline-neutral">&nbsp;</span>
195
- <span class="cline-any cline-neutral">&nbsp;</span>
196
- <span class="cline-any cline-neutral">&nbsp;</span>
197
- <span class="cline-any cline-neutral">&nbsp;</span>
198
- <span class="cline-any cline-neutral">&nbsp;</span>
199
- <span class="cline-any cline-neutral">&nbsp;</span>
200
- <span class="cline-any cline-neutral">&nbsp;</span>
201
- <span class="cline-any cline-neutral">&nbsp;</span>
202
- <span class="cline-any cline-yes">10x</span>
203
- <span class="cline-any cline-yes">10x</span>
204
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import * as React from 'react';
205
- import { twMerge } from 'tailwind-merge';
206
- &nbsp;
207
- interface VariantType {
208
- [key: string]: string;
209
- }
210
- &nbsp;
211
- // variant styling definition, both size and layout (portrait vs landscape)
212
- const variants: VariantType = {
213
- default: 'flex flex-col w-64 max-w-64', // image top
214
- imageBottom: 'flex flex-col-reverse w-64 mx-w-64',
215
- imageLeft: 'flex flex-row h-auto max-w-lg min-w-96',
216
- imageRight: 'flex flex-row-reverse h-auto max-w-lg min-w-96',
217
- }
218
- &nbsp;
219
- // default styles, i.e. outline, etc.
220
- const variantStyles: VariantType = {
221
- default: 'bg-white overflow-hidden rounded-lg',
222
- outline: 'bg-white overflow-hidden rounded-lg shadow-md border border-slate-300',
223
- }
224
- &nbsp;
225
- const imageDivInsetStyleDefault = 'px-4 my-2';
226
- const imageDivInsetStyleFlag = 'px-2 my-2';
227
- &nbsp;
228
- export interface CardProps extends React.HTMLAttributes&lt;HTMLDivElement&gt; {
229
- variant?: string;
230
- variantStyle?: string;
231
- imagePath?: string;
232
- classNameImage?: string;
233
- imageInset?: boolean;
234
- alt: string;
235
- ariaLabel?: string;
236
- }
237
- &nbsp;
238
- export const Card = React.forwardRef&lt;HTMLDivElement, CardProps&gt;(
239
- ({ className, variant = 'default', variantStyle = 'default',
240
- imagePath, classNameImage = 'w-full h-full', imageInset = false, alt,
241
- ariaLabel='card component', children, ...props }, ref) =&gt; {
242
- &nbsp;
243
- return (
244
- &lt;div className={
245
- twMerge(
246
- 'flex ',
247
- variantStyles[variantStyle],
248
- variants[variant],
249
- className
250
- )}
251
- aria-label={ariaLabel}
252
- ref={ref}
253
- {...props}
254
- &gt;
255
- &nbsp;
256
- {/* Image */}
257
- &lt;div
258
- className={twMerge('flex-initial items-center justify-center w-full', imageInset &amp;&amp;
259
- (variant === 'default' || variant === 'imageBottom' ? imageDivInsetStyleDefault : imageDivInsetStyleFlag ))}
260
- &gt;
261
- {imagePath &amp;&amp; &lt;img src={imagePath} alt={alt} className={classNameImage} /&gt;}
262
- &lt;/div&gt;
263
- &nbsp;
264
- {/* children / content */}
265
- &lt;div className="flex-auto px-2 py-3"&gt;
266
- {children}
267
- &lt;/div&gt;
268
- &lt;/div&gt;
269
- );
270
- }
271
- );
272
- Card.displayName = 'Card';
273
- &nbsp;</pre></td></tr></table></pre>
274
-
275
- <div class='push'></div><!-- for sticky footer -->
276
- </div><!-- /wrapper -->
277
- <div class='footer quiet pad2 space-top1 center small'>
278
- Code coverage generated by
279
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
280
- at 2025-05-29T21:55:20.662Z
281
- </div>
282
- <script src="prettify.js"></script>
283
- <script>
284
- window.onload = function () {
285
- prettyPrint();
286
- };
287
- </script>
288
- <script src="sorter.js"></script>
289
- <script src="block-navigation.js"></script>
290
- </body>
291
- </html>
292
-
package/coverage/storybook/lcov-report/CharacterCounter.tsx.html DELETED
@@ -1,253 +0,0 @@
1
-
2
- <!doctype html>
3
- <html lang="en">
4
-
5
- <head>
6
- <title>Code coverage report for CharacterCounter.tsx</title>
7
- <meta charset="utf-8" />
8
- <link rel="stylesheet" href="prettify.css" />
9
- <link rel="stylesheet" href="base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />
11
- <meta name="viewport" content="width=device-width, initial-scale=1" />
12
- <style type='text/css'>
13
- .coverage-summary .sorter {
14
- background-image: url(sort-arrow-sprite.png);
15
- }
16
- </style>
17
- </head>
18
-
19
- <body>
20
- <div class='wrapper'>
21
- <div class='pad1'>
22
- <h1><a href="index.html">All files</a> CharacterCounter.tsx</h1>
23
- <div class='clearfix'>
24
-
25
- <div class='fl pad1y space-right2'>
26
- <span class="strong">100% </span>
27
- <span class="quiet">Statements</span>
28
- <span class='fraction'>18/18</span>
29
- </div>
30
-
31
-
32
- <div class='fl pad1y space-right2'>
33
- <span class="strong">100% </span>
34
- <span class="quiet">Branches</span>
35
- <span class='fraction'>15/15</span>
36
- </div>
37
-
38
-
39
- <div class='fl pad1y space-right2'>
40
- <span class="strong">100% </span>
41
- <span class="quiet">Functions</span>
42
- <span class='fraction'>2/2</span>
43
- </div>
44
-
45
-
46
- <div class='fl pad1y space-right2'>
47
- <span class="strong">100% </span>
48
- <span class="quiet">Lines</span>
49
- <span class='fraction'>17/17</span>
50
- </div>
51
-
52
-
53
- </div>
54
- <p class="quiet">
55
- Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
- </p>
57
- <template id="filterTemplate">
58
- <div class="quiet">
59
- Filter:
60
- <input type="search" id="fileSearch">
61
- </div>
62
- </template>
63
- </div>
64
- <div class='status-line high'></div>
65
- <pre><table class="coverage">
66
- <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
- <a name='L2'></a><a href='#L2'>2</a>
68
- <a name='L3'></a><a href='#L3'>3</a>
69
- <a name='L4'></a><a href='#L4'>4</a>
70
- <a name='L5'></a><a href='#L5'>5</a>
71
- <a name='L6'></a><a href='#L6'>6</a>
72
- <a name='L7'></a><a href='#L7'>7</a>
73
- <a name='L8'></a><a href='#L8'>8</a>
74
- <a name='L9'></a><a href='#L9'>9</a>
75
- <a name='L10'></a><a href='#L10'>10</a>
76
- <a name='L11'></a><a href='#L11'>11</a>
77
- <a name='L12'></a><a href='#L12'>12</a>
78
- <a name='L13'></a><a href='#L13'>13</a>
79
- <a name='L14'></a><a href='#L14'>14</a>
80
- <a name='L15'></a><a href='#L15'>15</a>
81
- <a name='L16'></a><a href='#L16'>16</a>
82
- <a name='L17'></a><a href='#L17'>17</a>
83
- <a name='L18'></a><a href='#L18'>18</a>
84
- <a name='L19'></a><a href='#L19'>19</a>
85
- <a name='L20'></a><a href='#L20'>20</a>
86
- <a name='L21'></a><a href='#L21'>21</a>
87
- <a name='L22'></a><a href='#L22'>22</a>
88
- <a name='L23'></a><a href='#L23'>23</a>
89
- <a name='L24'></a><a href='#L24'>24</a>
90
- <a name='L25'></a><a href='#L25'>25</a>
91
- <a name='L26'></a><a href='#L26'>26</a>
92
- <a name='L27'></a><a href='#L27'>27</a>
93
- <a name='L28'></a><a href='#L28'>28</a>
94
- <a name='L29'></a><a href='#L29'>29</a>
95
- <a name='L30'></a><a href='#L30'>30</a>
96
- <a name='L31'></a><a href='#L31'>31</a>
97
- <a name='L32'></a><a href='#L32'>32</a>
98
- <a name='L33'></a><a href='#L33'>33</a>
99
- <a name='L34'></a><a href='#L34'>34</a>
100
- <a name='L35'></a><a href='#L35'>35</a>
101
- <a name='L36'></a><a href='#L36'>36</a>
102
- <a name='L37'></a><a href='#L37'>37</a>
103
- <a name='L38'></a><a href='#L38'>38</a>
104
- <a name='L39'></a><a href='#L39'>39</a>
105
- <a name='L40'></a><a href='#L40'>40</a>
106
- <a name='L41'></a><a href='#L41'>41</a>
107
- <a name='L42'></a><a href='#L42'>42</a>
108
- <a name='L43'></a><a href='#L43'>43</a>
109
- <a name='L44'></a><a href='#L44'>44</a>
110
- <a name='L45'></a><a href='#L45'>45</a>
111
- <a name='L46'></a><a href='#L46'>46</a>
112
- <a name='L47'></a><a href='#L47'>47</a>
113
- <a name='L48'></a><a href='#L48'>48</a>
114
- <a name='L49'></a><a href='#L49'>49</a>
115
- <a name='L50'></a><a href='#L50'>50</a>
116
- <a name='L51'></a><a href='#L51'>51</a>
117
- <a name='L52'></a><a href='#L52'>52</a>
118
- <a name='L53'></a><a href='#L53'>53</a>
119
- <a name='L54'></a><a href='#L54'>54</a>
120
- <a name='L55'></a><a href='#L55'>55</a>
121
- <a name='L56'></a><a href='#L56'>56</a>
122
- <a name='L57'></a><a href='#L57'>57</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
123
- <span class="cline-any cline-neutral">&nbsp;</span>
124
- <span class="cline-any cline-neutral">&nbsp;</span>
125
- <span class="cline-any cline-neutral">&nbsp;</span>
126
- <span class="cline-any cline-neutral">&nbsp;</span>
127
- <span class="cline-any cline-neutral">&nbsp;</span>
128
- <span class="cline-any cline-neutral">&nbsp;</span>
129
- <span class="cline-any cline-neutral">&nbsp;</span>
130
- <span class="cline-any cline-neutral">&nbsp;</span>
131
- <span class="cline-any cline-neutral">&nbsp;</span>
132
- <span class="cline-any cline-neutral">&nbsp;</span>
133
- <span class="cline-any cline-neutral">&nbsp;</span>
134
- <span class="cline-any cline-neutral">&nbsp;</span>
135
- <span class="cline-any cline-yes">5x</span>
136
- <span class="cline-any cline-neutral">&nbsp;</span>
137
- <span class="cline-any cline-neutral">&nbsp;</span>
138
- <span class="cline-any cline-neutral">&nbsp;</span>
139
- <span class="cline-any cline-neutral">&nbsp;</span>
140
- <span class="cline-any cline-neutral">&nbsp;</span>
141
- <span class="cline-any cline-neutral">&nbsp;</span>
142
- <span class="cline-any cline-neutral">&nbsp;</span>
143
- <span class="cline-any cline-yes">125x</span>
144
- <span class="cline-any cline-yes">125x</span>
145
- <span class="cline-any cline-yes">125x</span>
146
- <span class="cline-any cline-neutral">&nbsp;</span>
147
- <span class="cline-any cline-neutral">&nbsp;</span>
148
- <span class="cline-any cline-yes">125x</span>
149
- <span class="cline-any cline-yes">110x</span>
150
- <span class="cline-any cline-yes">110x</span>
151
- <span class="cline-any cline-neutral">&nbsp;</span>
152
- <span class="cline-any cline-yes">110x</span>
153
- <span class="cline-any cline-neutral">&nbsp;</span>
154
- <span class="cline-any cline-yes">110x</span>
155
- <span class="cline-any cline-yes">6x</span>
156
- <span class="cline-any cline-yes">104x</span>
157
- <span class="cline-any cline-yes">88x</span>
158
- <span class="cline-any cline-yes">88x</span>
159
- <span class="cline-any cline-neutral">&nbsp;</span>
160
- <span class="cline-any cline-yes">16x</span>
161
- <span class="cline-any cline-yes">16x</span>
162
- <span class="cline-any cline-neutral">&nbsp;</span>
163
- <span class="cline-any cline-neutral">&nbsp;</span>
164
- <span class="cline-any cline-neutral">&nbsp;</span>
165
- <span class="cline-any cline-yes">125x</span>
166
- <span class="cline-any cline-neutral">&nbsp;</span>
167
- <span class="cline-any cline-neutral">&nbsp;</span>
168
- <span class="cline-any cline-neutral">&nbsp;</span>
169
- <span class="cline-any cline-neutral">&nbsp;</span>
170
- <span class="cline-any cline-neutral">&nbsp;</span>
171
- <span class="cline-any cline-neutral">&nbsp;</span>
172
- <span class="cline-any cline-neutral">&nbsp;</span>
173
- <span class="cline-any cline-neutral">&nbsp;</span>
174
- <span class="cline-any cline-neutral">&nbsp;</span>
175
- <span class="cline-any cline-neutral">&nbsp;</span>
176
- <span class="cline-any cline-neutral">&nbsp;</span>
177
- <span class="cline-any cline-yes">5x</span>
178
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React, { useState } from 'react';
179
- import { twMerge } from 'tailwind-merge';
180
- &nbsp;
181
- export interface CharacterCounterProps {
182
- maxCharacters: number; // required prop
183
- children: React.ReactNode; // required prop
184
- className?: string; // optional class for parent container div
185
- classNameMessage?: string; // optional class for message text (div)
186
- classNameOverLimitMessage?: string; // optional class applied when over limit
187
- altRemainingMessageText?: string;
188
- altOverageMessageText?: string;
189
- }
190
- &nbsp;
191
- export const CharacterCounter = ({
192
- className = '',
193
- classNameMessage = '',
194
- classNameOverLimitMessage = '',
195
- maxCharacters,
196
- children,
197
- altRemainingMessageText,
198
- altOverageMessageText,
199
- }: CharacterCounterProps) =&gt; {
200
- const [counterMessage, setCounterMessage] = useState&lt;string&gt;(`${maxCharacters} characters allowed`);
201
- const [overLimit, setOverLimit] = useState&lt;boolean&gt;(false);
202
- &nbsp;
203
- // is this valid w/ just an HTMLInputElement interface?
204
- const handleInput = (event: React.ChangeEvent&lt;HTMLInputElement&gt;) =&gt; {
205
- const editableText = event.target.value;
206
- const numCharacters = editableText.length;
207
- &nbsp;
208
- setOverLimit(numCharacters &gt; maxCharacters);
209
- &nbsp;
210
- if (numCharacters === 0) {
211
- setCounterMessage(`${maxCharacters} characters allowed`);
212
- } else if (numCharacters &lt;= maxCharacters) {
213
- const msgText = ' ' + (altRemainingMessageText ?? "remaining");
214
- setCounterMessage(`${maxCharacters - numCharacters}${msgText}`);
215
- } else {
216
- const msgText = ' ' + (altOverageMessageText ?? "characters too many");
217
- setCounterMessage(`${numCharacters - maxCharacters}${msgText}`);
218
- }
219
- };
220
- &nbsp;
221
- return (
222
- &lt;div className={className}&gt;
223
- &lt;div
224
- onInput={handleInput}
225
- className="mb-2"
226
- &gt;
227
- {children}
228
- &lt;/div&gt;
229
- &lt;div className={twMerge('ml-2', classNameMessage, overLimit &amp;&amp; 'text-red-500', overLimit &amp;&amp; classNameOverLimitMessage)}
230
- &gt;{counterMessage}&lt;/div&gt; {/* separate from the editable area */}
231
- &lt;/div&gt;
232
- );
233
- };
234
- &nbsp;</pre></td></tr></table></pre>
235
-
236
- <div class='push'></div><!-- for sticky footer -->
237
- </div><!-- /wrapper -->
238
- <div class='footer quiet pad2 space-top1 center small'>
239
- Code coverage generated by
240
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
241
- at 2025-05-29T21:55:20.662Z
242
- </div>
243
- <script src="prettify.js"></script>
244
- <script>
245
- window.onload = function () {
246
- prettyPrint();
247
- };
248
- </script>
249
- <script src="sorter.js"></script>
250
- <script src="block-navigation.js"></script>
251
- </body>
252
- </html>
253
-