sdaia-ui 1.0.1

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 (880) hide show
  1. package/README.md +89 -0
  2. package/dist/PlayVideoIcon-BM-4pwUd.d.cts +7 -0
  3. package/dist/PlayVideoIcon-BM-4pwUd.d.ts +7 -0
  4. package/dist/dga-icons.cjs +14 -0
  5. package/dist/dga-icons.cjs.map +1 -0
  6. package/dist/dga-icons.d.cts +1 -0
  7. package/dist/dga-icons.d.ts +1 -0
  8. package/dist/dga-icons.js +3 -0
  9. package/dist/dga-icons.js.map +1 -0
  10. package/dist/icons.cjs +4014 -0
  11. package/dist/icons.cjs.map +1 -0
  12. package/dist/icons.d.cts +756 -0
  13. package/dist/icons.d.ts +756 -0
  14. package/dist/icons.js +3871 -0
  15. package/dist/icons.js.map +1 -0
  16. package/dist/index.cjs +43620 -0
  17. package/dist/index.cjs.map +1 -0
  18. package/dist/index.d.cts +9407 -0
  19. package/dist/index.d.ts +9407 -0
  20. package/dist/index.js +43411 -0
  21. package/dist/index.js.map +1 -0
  22. package/dist/styles.css +242 -0
  23. package/package.json +65 -0
  24. package/src/components/Accordion/Accordion.tsx +207 -0
  25. package/src/components/Accordion/Accordion.types.ts +36 -0
  26. package/src/components/Accordion/Accordion.variants.ts +283 -0
  27. package/src/components/Accordion/index.ts +9 -0
  28. package/src/components/ActionBar/ActionBar.tsx +192 -0
  29. package/src/components/ActionBar/ActionBar.types.ts +67 -0
  30. package/src/components/ActionBar/ActionBar.variants.ts +95 -0
  31. package/src/components/ActionBar/index.ts +8 -0
  32. package/src/components/Activity/Activity.tsx +52 -0
  33. package/src/components/Activity/Activity.types.ts +19 -0
  34. package/src/components/Activity/Activity.variants.ts +15 -0
  35. package/src/components/Activity/index.ts +2 -0
  36. package/src/components/ActivityItem/ActivityItem.tsx +298 -0
  37. package/src/components/ActivityItem/ActivityItem.types.ts +76 -0
  38. package/src/components/ActivityItem/ActivityItem.variants.ts +117 -0
  39. package/src/components/ActivityItem/index.ts +8 -0
  40. package/src/components/Alert/Alert.tsx +183 -0
  41. package/src/components/Alert/Alert.types.ts +34 -0
  42. package/src/components/Alert/Alert.variants.ts +168 -0
  43. package/src/components/Alert/index.ts +2 -0
  44. package/src/components/AreaChart/AreaChart.tsx +454 -0
  45. package/src/components/AreaChart/AreaChart.types.ts +117 -0
  46. package/src/components/AreaChart/AreaChart.variants.ts +202 -0
  47. package/src/components/AreaChart/index.ts +2 -0
  48. package/src/components/AspectRatio/AspectRatio.tsx +36 -0
  49. package/src/components/AspectRatio/AspectRatio.types.ts +33 -0
  50. package/src/components/AspectRatio/AspectRatio.variants.ts +42 -0
  51. package/src/components/AspectRatio/index.ts +2 -0
  52. package/src/components/AudioPlayer/AudioPlayer.tsx +294 -0
  53. package/src/components/AudioPlayer/AudioPlayer.types.ts +64 -0
  54. package/src/components/AudioPlayer/AudioPlayer.variants.ts +225 -0
  55. package/src/components/AudioPlayer/index.ts +2 -0
  56. package/src/components/Autocomplete/Autocomplete.tsx +353 -0
  57. package/src/components/Autocomplete/Autocomplete.types.ts +93 -0
  58. package/src/components/Autocomplete/Autocomplete.variants.ts +149 -0
  59. package/src/components/Autocomplete/index.ts +6 -0
  60. package/src/components/Avatar/Avatar.tsx +168 -0
  61. package/src/components/Avatar/Avatar.types.ts +36 -0
  62. package/src/components/Avatar/Avatar.variants.ts +102 -0
  63. package/src/components/Avatar/index.ts +7 -0
  64. package/src/components/AvatarGroup/AvatarGroup.tsx +87 -0
  65. package/src/components/AvatarGroup/AvatarGroup.types.ts +44 -0
  66. package/src/components/AvatarGroup/AvatarGroup.variants.ts +17 -0
  67. package/src/components/AvatarGroup/index.ts +6 -0
  68. package/src/components/Badge/Badge.tsx +74 -0
  69. package/src/components/Badge/Badge.types.ts +31 -0
  70. package/src/components/Badge/Badge.variants.ts +83 -0
  71. package/src/components/Badge/index.ts +2 -0
  72. package/src/components/Bar/Bar.tsx +57 -0
  73. package/src/components/Bar/Bar.types.ts +18 -0
  74. package/src/components/Bar/Bar.variants.ts +20 -0
  75. package/src/components/Bar/index.ts +2 -0
  76. package/src/components/BarChart/BarChart.tsx +179 -0
  77. package/src/components/BarChart/BarChart.types.ts +72 -0
  78. package/src/components/BarChart/BarChart.variants.ts +134 -0
  79. package/src/components/BarChart/index.ts +2 -0
  80. package/src/components/BarGroup/BarGroup.tsx +119 -0
  81. package/src/components/BarGroup/BarGroup.types.ts +50 -0
  82. package/src/components/BarGroup/BarGroup.variants.ts +76 -0
  83. package/src/components/BarGroup/index.ts +2 -0
  84. package/src/components/Breadcrumb/Breadcrumb.tsx +137 -0
  85. package/src/components/Breadcrumb/Breadcrumb.types.ts +21 -0
  86. package/src/components/Breadcrumb/BreadcrumbItem.tsx +267 -0
  87. package/src/components/Breadcrumb/BreadcrumbItem.types.ts +66 -0
  88. package/src/components/Breadcrumb/BreadcrumbItem.variants.ts +102 -0
  89. package/src/components/Breadcrumb/index.ts +12 -0
  90. package/src/components/Button/Button.tsx +100 -0
  91. package/src/components/Button/Button.types.ts +44 -0
  92. package/src/components/Button/Button.variants.ts +183 -0
  93. package/src/components/Button/index.ts +2 -0
  94. package/src/components/ButtonClose/ButtonClose.tsx +57 -0
  95. package/src/components/ButtonClose/ButtonClose.types.ts +18 -0
  96. package/src/components/ButtonClose/ButtonClose.variants.ts +72 -0
  97. package/src/components/ButtonClose/index.ts +2 -0
  98. package/src/components/ButtonGroup/ButtonGroup.tsx +127 -0
  99. package/src/components/ButtonGroup/ButtonGroup.types.ts +51 -0
  100. package/src/components/ButtonGroup/ButtonGroup.variants.ts +65 -0
  101. package/src/components/ButtonGroup/index.ts +2 -0
  102. package/src/components/ButtonMenu/ButtonMenu.tsx +73 -0
  103. package/src/components/ButtonMenu/ButtonMenu.types.ts +43 -0
  104. package/src/components/ButtonMenu/ButtonMenu.variants.ts +18 -0
  105. package/src/components/ButtonMenu/index.ts +2 -0
  106. package/src/components/ButtonSplit/ButtonSplit.tsx +344 -0
  107. package/src/components/ButtonSplit/ButtonSplit.types.ts +95 -0
  108. package/src/components/ButtonSplit/ButtonSplit.variants.ts +165 -0
  109. package/src/components/ButtonSplit/index.ts +7 -0
  110. package/src/components/ButtonsWithSdaiaTouch/ButtonHoverPattern.tsx +69 -0
  111. package/src/components/ButtonsWithSdaiaTouch/ButtonsWithSdaiaTouch.tsx +130 -0
  112. package/src/components/ButtonsWithSdaiaTouch/ButtonsWithSdaiaTouch.types.ts +4 -0
  113. package/src/components/ButtonsWithSdaiaTouch/ButtonsWithSdaiaTouch.variants.ts +19 -0
  114. package/src/components/ButtonsWithSdaiaTouch/index.ts +6 -0
  115. package/src/components/CLAUDE.md +212 -0
  116. package/src/components/CalendarHeader/CalendarHeader.tsx +224 -0
  117. package/src/components/CalendarHeader/CalendarHeader.types.ts +51 -0
  118. package/src/components/CalendarHeader/CalendarHeader.variants.ts +65 -0
  119. package/src/components/CalendarHeader/index.ts +2 -0
  120. package/src/components/Card/Card.tsx +76 -0
  121. package/src/components/Card/Card.types.ts +11 -0
  122. package/src/components/Card/Card.variants.ts +30 -0
  123. package/src/components/Card/index.ts +2 -0
  124. package/src/components/CardContent/CardContent.tsx +178 -0
  125. package/src/components/CardContent/CardContent.types.ts +70 -0
  126. package/src/components/CardContent/CardContent.variants.ts +90 -0
  127. package/src/components/CardContent/index.ts +6 -0
  128. package/src/components/CardFooter/CardFooter.tsx +196 -0
  129. package/src/components/CardFooter/CardFooter.types.ts +59 -0
  130. package/src/components/CardFooter/CardFooter.variants.ts +127 -0
  131. package/src/components/CardFooter/index.ts +8 -0
  132. package/src/components/CardHeader/CardHeader.tsx +150 -0
  133. package/src/components/CardHeader/CardHeader.types.ts +42 -0
  134. package/src/components/CardHeader/CardHeader.variants.ts +72 -0
  135. package/src/components/CardHeader/index.ts +5 -0
  136. package/src/components/CardLeadingItem/CardLeadingItem.tsx +166 -0
  137. package/src/components/CardLeadingItem/CardLeadingItem.types.ts +75 -0
  138. package/src/components/CardLeadingItem/CardLeadingItem.variants.ts +66 -0
  139. package/src/components/CardLeadingItem/index.ts +6 -0
  140. package/src/components/CardMedia/CardMedia.tsx +324 -0
  141. package/src/components/CardMedia/CardMedia.types.ts +114 -0
  142. package/src/components/CardMedia/CardMedia.variants.ts +139 -0
  143. package/src/components/CardMedia/index.ts +2 -0
  144. package/src/components/Carousel/Carousel.tsx +182 -0
  145. package/src/components/Carousel/Carousel.types.ts +38 -0
  146. package/src/components/Carousel/Carousel.variants.ts +17 -0
  147. package/src/components/Carousel/index.ts +2 -0
  148. package/src/components/CarouselArrow/CarouselArrow.tsx +66 -0
  149. package/src/components/CarouselArrow/CarouselArrow.types.ts +26 -0
  150. package/src/components/CarouselArrow/CarouselArrow.variants.ts +83 -0
  151. package/src/components/CarouselArrow/index.ts +7 -0
  152. package/src/components/CarouselControlsGroup/CarouselControlsGroup.tsx +81 -0
  153. package/src/components/CarouselControlsGroup/CarouselControlsGroup.types.ts +24 -0
  154. package/src/components/CarouselControlsGroup/CarouselControlsGroup.variants.ts +60 -0
  155. package/src/components/CarouselControlsGroup/index.ts +6 -0
  156. package/src/components/CarouselImage/CarouselImage.tsx +253 -0
  157. package/src/components/CarouselImage/CarouselImage.types.ts +72 -0
  158. package/src/components/CarouselImage/CarouselImage.variants.ts +43 -0
  159. package/src/components/CarouselImage/index.ts +6 -0
  160. package/src/components/Chart/Chart.tsx +3 -0
  161. package/src/components/Chart/Chart.types.ts +2 -0
  162. package/src/components/Chart/Chart.variants.ts +2 -0
  163. package/src/components/Chart/index.ts +2 -0
  164. package/src/components/ChartBadge/ChartBadge.tsx +62 -0
  165. package/src/components/ChartBadge/ChartBadge.types.ts +27 -0
  166. package/src/components/ChartBadge/ChartBadge.variants.ts +62 -0
  167. package/src/components/ChartBadge/index.ts +2 -0
  168. package/src/components/Checkbox/Checkbox.tsx +243 -0
  169. package/src/components/Checkbox/Checkbox.types.ts +20 -0
  170. package/src/components/Checkbox/index.ts +2 -0
  171. package/src/components/CheckboxLabel/CheckboxLabel.tsx +148 -0
  172. package/src/components/CheckboxLabel/CheckboxLabel.types.ts +55 -0
  173. package/src/components/CheckboxLabel/CheckboxLabel.variants.ts +35 -0
  174. package/src/components/CheckboxLabel/index.ts +2 -0
  175. package/src/components/Chip/Chip.tsx +245 -0
  176. package/src/components/Chip/Chip.types.ts +83 -0
  177. package/src/components/Chip/Chip.variants.ts +143 -0
  178. package/src/components/Chip/index.ts +2 -0
  179. package/src/components/CircularItem/CircularItem.tsx +133 -0
  180. package/src/components/CircularItem/CircularItem.types.ts +45 -0
  181. package/src/components/CircularItem/CircularItem.variants.ts +128 -0
  182. package/src/components/CircularItem/index.ts +7 -0
  183. package/src/components/CodeSnippet/CodeSnippet.tsx +421 -0
  184. package/src/components/CodeSnippet/CodeSnippet.types.ts +99 -0
  185. package/src/components/CodeSnippet/CodeSnippet.variants.ts +76 -0
  186. package/src/components/CodeSnippet/index.ts +9 -0
  187. package/src/components/ColumnChart/ColumnChart.tsx +943 -0
  188. package/src/components/ColumnChart/ColumnChart.types.ts +98 -0
  189. package/src/components/ColumnChart/ColumnChart.variants.ts +117 -0
  190. package/src/components/ColumnChart/index.ts +9 -0
  191. package/src/components/ComplexComposition/ComplexComposition.tsx +82 -0
  192. package/src/components/ComplexComposition/ComplexComposition.types.ts +3 -0
  193. package/src/components/ComplexComposition/ComplexComposition.variants.ts +14 -0
  194. package/src/components/ComplexComposition/index.ts +2 -0
  195. package/src/components/ContentSwitcher/ContentSwitcher.tsx +104 -0
  196. package/src/components/ContentSwitcher/ContentSwitcher.types.ts +28 -0
  197. package/src/components/ContentSwitcher/ContentSwitcher.variants.ts +70 -0
  198. package/src/components/ContentSwitcher/index.ts +6 -0
  199. package/src/components/ContentSwitcherItem/ContentSwitcherItem.tsx +56 -0
  200. package/src/components/ContentSwitcherItem/ContentSwitcherItem.types.ts +14 -0
  201. package/src/components/ContentSwitcherItem/ContentSwitcherItem.variants.ts +65 -0
  202. package/src/components/ContentSwitcherItem/index.ts +6 -0
  203. package/src/components/ContextMenu/ContextMenu.tsx +101 -0
  204. package/src/components/ContextMenu/ContextMenu.types.ts +64 -0
  205. package/src/components/ContextMenu/ContextMenu.variants.ts +36 -0
  206. package/src/components/ContextMenu/index.ts +7 -0
  207. package/src/components/ContextMenuDropdown/ContextMenuDropdown.tsx +370 -0
  208. package/src/components/ContextMenuDropdown/ContextMenuDropdown.types.ts +89 -0
  209. package/src/components/ContextMenuDropdown/ContextMenuDropdown.variants.ts +88 -0
  210. package/src/components/ContextMenuDropdown/index.ts +5 -0
  211. package/src/components/DateCell/DateCell.tsx +181 -0
  212. package/src/components/DateCell/DateCell.types.ts +53 -0
  213. package/src/components/DateCell/DateCell.variants.ts +217 -0
  214. package/src/components/DateCell/index.ts +2 -0
  215. package/src/components/DatePicker/DatePicker.tsx +923 -0
  216. package/src/components/DatePicker/DatePicker.types.ts +102 -0
  217. package/src/components/DatePicker/DatePicker.variants.ts +274 -0
  218. package/src/components/DatePicker/index.ts +9 -0
  219. package/src/components/DateTab/DateTab.tsx +91 -0
  220. package/src/components/DateTab/DateTab.types.ts +9 -0
  221. package/src/components/DateTab/DateTab.variants.ts +98 -0
  222. package/src/components/DateTab/index.ts +2 -0
  223. package/src/components/DgaIcon/DgaIcon.tsx +68 -0
  224. package/src/components/DgaIcon/DgaIcon.types.ts +57 -0
  225. package/src/components/DgaIcon/DgaIcon.variants.ts +41 -0
  226. package/src/components/DgaIcon/DgaIconByName.tsx +76 -0
  227. package/src/components/DgaIcon/generated/icon-names.ts +4388 -0
  228. package/src/components/DgaIcon/index.ts +12 -0
  229. package/src/components/DgaIcon/lib/decodeDataUrl.ts +46 -0
  230. package/src/components/DigitalStamp/DigitalStamp.tsx +236 -0
  231. package/src/components/DigitalStamp/DigitalStamp.types.ts +38 -0
  232. package/src/components/DigitalStamp/DigitalStamp.variants.ts +185 -0
  233. package/src/components/DigitalStamp/index.ts +2 -0
  234. package/src/components/Divider/Divider.tsx +83 -0
  235. package/src/components/Divider/Divider.types.ts +49 -0
  236. package/src/components/Divider/Divider.variants.ts +55 -0
  237. package/src/components/Divider/index.ts +8 -0
  238. package/src/components/DonutChart/DonutChart.tsx +251 -0
  239. package/src/components/DonutChart/DonutChart.types.ts +97 -0
  240. package/src/components/DonutChart/DonutChart.variants.ts +203 -0
  241. package/src/components/DonutChart/index.ts +7 -0
  242. package/src/components/DonutChartPanel/DonutChartPanel.tsx +778 -0
  243. package/src/components/DonutChartPanel/DonutChartPanel.types.ts +143 -0
  244. package/src/components/DonutChartPanel/DonutChartPanel.variants.ts +154 -0
  245. package/src/components/DonutChartPanel/index.ts +9 -0
  246. package/src/components/DraggableItem/DraggableItem.tsx +228 -0
  247. package/src/components/DraggableItem/DraggableItem.types.ts +72 -0
  248. package/src/components/DraggableItem/DraggableItem.variants.ts +149 -0
  249. package/src/components/DraggableItem/index.ts +3 -0
  250. package/src/components/DraggableList/DraggableList.tsx +20 -0
  251. package/src/components/DraggableList/DraggableList.types.ts +16 -0
  252. package/src/components/DraggableList/DraggableList.variants.ts +13 -0
  253. package/src/components/DraggableList/index.ts +3 -0
  254. package/src/components/Dropdown/Dropdown.tsx +331 -0
  255. package/src/components/Dropdown/Dropdown.types.ts +108 -0
  256. package/src/components/Dropdown/Dropdown.variants.ts +73 -0
  257. package/src/components/Dropdown/index.ts +9 -0
  258. package/src/components/DropdownListHeader/DropdownListHeader.tsx +79 -0
  259. package/src/components/DropdownListHeader/DropdownListHeader.types.ts +24 -0
  260. package/src/components/DropdownListHeader/DropdownListHeader.variants.ts +65 -0
  261. package/src/components/DropdownListHeader/index.ts +2 -0
  262. package/src/components/EmptyState/EmptyState.tsx +221 -0
  263. package/src/components/EmptyState/EmptyState.types.ts +48 -0
  264. package/src/components/EmptyState/EmptyState.variants.ts +122 -0
  265. package/src/components/EmptyState/index.ts +3 -0
  266. package/src/components/Extension/Extension.tsx +240 -0
  267. package/src/components/Extension/Extension.types.ts +40 -0
  268. package/src/components/Extension/Extension.variants.ts +27 -0
  269. package/src/components/Extension/index.ts +6 -0
  270. package/src/components/Feedback/Feedback.tsx +55 -0
  271. package/src/components/Feedback/Feedback.types.ts +15 -0
  272. package/src/components/Feedback/Feedback.variants.ts +9 -0
  273. package/src/components/Feedback/index.ts +2 -0
  274. package/src/components/FeedbackOverview/FeedbackOverview.tsx +70 -0
  275. package/src/components/FeedbackOverview/FeedbackOverview.types.ts +11 -0
  276. package/src/components/FeedbackOverview/FeedbackOverview.variants.ts +17 -0
  277. package/src/components/FeedbackOverview/index.ts +2 -0
  278. package/src/components/FeedbackReaction/FeedbackReaction.tsx +81 -0
  279. package/src/components/FeedbackReaction/FeedbackReaction.types.ts +14 -0
  280. package/src/components/FeedbackReaction/FeedbackReaction.variants.ts +39 -0
  281. package/src/components/FeedbackReaction/index.ts +2 -0
  282. package/src/components/FileUploadBase/FileUploadBase.tsx +104 -0
  283. package/src/components/FileUploadBase/FileUploadBase.types.ts +48 -0
  284. package/src/components/FileUploadBase/FileUploadBase.variants.ts +51 -0
  285. package/src/components/FileUploadBase/index.ts +2 -0
  286. package/src/components/FileUploadItemBase/FileUploadItemBase.tsx +197 -0
  287. package/src/components/FileUploadItemBase/FileUploadItemBase.types.ts +58 -0
  288. package/src/components/FileUploadItemBase/FileUploadItemBase.variants.ts +67 -0
  289. package/src/components/FileUploadItemBase/index.ts +6 -0
  290. package/src/components/FileUploader/FileUploader.tsx +164 -0
  291. package/src/components/FileUploader/FileUploader.types.ts +46 -0
  292. package/src/components/FileUploader/FileUploader.variants.ts +9 -0
  293. package/src/components/FileUploader/index.ts +2 -0
  294. package/src/components/Filtration/Filtration.tsx +260 -0
  295. package/src/components/Filtration/Filtration.types.ts +95 -0
  296. package/src/components/Filtration/Filtration.variants.ts +70 -0
  297. package/src/components/Filtration/index.ts +6 -0
  298. package/src/components/FiltrationItem/FiltrationItem.tsx +200 -0
  299. package/src/components/FiltrationItem/FiltrationItem.types.ts +57 -0
  300. package/src/components/FiltrationItem/FiltrationItem.variants.ts +81 -0
  301. package/src/components/FiltrationItem/index.ts +2 -0
  302. package/src/components/FiltrationList/FiltrationList.tsx +611 -0
  303. package/src/components/FiltrationList/FiltrationList.types.ts +191 -0
  304. package/src/components/FiltrationList/FiltrationList.variants.ts +283 -0
  305. package/src/components/FiltrationList/index.ts +16 -0
  306. package/src/components/FloatingButton/FloatingButton.tsx +89 -0
  307. package/src/components/FloatingButton/FloatingButton.types.ts +29 -0
  308. package/src/components/FloatingButton/FloatingButton.variants.ts +79 -0
  309. package/src/components/FloatingButton/index.ts +6 -0
  310. package/src/components/Footer/Footer.tsx +353 -0
  311. package/src/components/Footer/Footer.types.ts +142 -0
  312. package/src/components/Footer/Footer.variants.ts +137 -0
  313. package/src/components/Footer/index.ts +11 -0
  314. package/src/components/FooterItem/FooterItem.tsx +211 -0
  315. package/src/components/FooterItem/FooterItem.types.ts +45 -0
  316. package/src/components/FooterItem/FooterItem.variants.ts +139 -0
  317. package/src/components/FooterItem/index.ts +2 -0
  318. package/src/components/FooterLinkList/FooterLinkList.tsx +140 -0
  319. package/src/components/FooterLinkList/FooterLinkList.types.ts +46 -0
  320. package/src/components/FooterLinkList/FooterLinkList.variants.ts +64 -0
  321. package/src/components/FooterLinkList/index.ts +2 -0
  322. package/src/components/GraphBase/GraphBase.tsx +598 -0
  323. package/src/components/GraphBase/GraphBase.types.ts +101 -0
  324. package/src/components/GraphBase/GraphBase.variants.ts +126 -0
  325. package/src/components/GraphBase/index.ts +7 -0
  326. package/src/components/HeaderItem/HeaderItem.tsx +206 -0
  327. package/src/components/HeaderItem/HeaderItem.types.ts +73 -0
  328. package/src/components/HeaderItem/HeaderItem.variants.ts +139 -0
  329. package/src/components/HeaderItem/index.ts +2 -0
  330. package/src/components/HelpIcon/HelpIcon.tsx +173 -0
  331. package/src/components/HelpIcon/HelpIcon.types.ts +54 -0
  332. package/src/components/HelpIcon/HelpIcon.variants.ts +79 -0
  333. package/src/components/HelpIcon/index.ts +2 -0
  334. package/src/components/HorizontalTabs/HorizontalTabs.tsx +87 -0
  335. package/src/components/HorizontalTabs/HorizontalTabs.types.ts +41 -0
  336. package/src/components/HorizontalTabs/HorizontalTabs.variants.ts +54 -0
  337. package/src/components/HorizontalTabs/index.ts +6 -0
  338. package/src/components/IllustrationInstance/IllustrationInstance.tsx +46 -0
  339. package/src/components/IllustrationInstance/IllustrationInstance.types.ts +25 -0
  340. package/src/components/IllustrationInstance/IllustrationInstance.variants.ts +19 -0
  341. package/src/components/IllustrationInstance/index.ts +3 -0
  342. package/src/components/ImagePreview/ImagePreview.tsx +170 -0
  343. package/src/components/ImagePreview/ImagePreview.types.ts +54 -0
  344. package/src/components/ImagePreview/ImagePreview.variants.ts +39 -0
  345. package/src/components/ImagePreview/index.ts +2 -0
  346. package/src/components/Input/Input.tsx +113 -0
  347. package/src/components/Input/Input.types.ts +22 -0
  348. package/src/components/Input/index.ts +2 -0
  349. package/src/components/InputPrefixSuffix/InputPrefixSuffix.tsx +91 -0
  350. package/src/components/InputPrefixSuffix/InputPrefixSuffix.types.ts +81 -0
  351. package/src/components/InputPrefixSuffix/InputPrefixSuffix.variants.ts +128 -0
  352. package/src/components/InputPrefixSuffix/index.ts +8 -0
  353. package/src/components/InputsActions/InputsActions.tsx +53 -0
  354. package/src/components/InputsActions/InputsActions.types.ts +13 -0
  355. package/src/components/InputsActions/InputsActions.variants.ts +18 -0
  356. package/src/components/InputsActions/index.ts +2 -0
  357. package/src/components/InstanceColumn/InstanceColumn.tsx +43 -0
  358. package/src/components/InstanceColumn/InstanceColumn.types.ts +18 -0
  359. package/src/components/InstanceColumn/InstanceColumn.variants.ts +11 -0
  360. package/src/components/InstanceColumn/index.ts +2 -0
  361. package/src/components/InstanceItem/InstanceItem.tsx +33 -0
  362. package/src/components/InstanceItem/InstanceItem.types.ts +11 -0
  363. package/src/components/InstanceItem/InstanceItem.variants.ts +31 -0
  364. package/src/components/InstanceItem/index.ts +2 -0
  365. package/src/components/InstanceRows/InstanceRows.tsx +41 -0
  366. package/src/components/InstanceRows/InstanceRows.types.ts +17 -0
  367. package/src/components/InstanceRows/InstanceRows.variants.ts +10 -0
  368. package/src/components/InstanceRows/index.ts +2 -0
  369. package/src/components/InstanceSlot/InstanceSlot.tsx +25 -0
  370. package/src/components/InstanceSlot/InstanceSlot.types.ts +10 -0
  371. package/src/components/InstanceSlot/InstanceSlot.variants.ts +2 -0
  372. package/src/components/InstanceSlot/index.ts +2 -0
  373. package/src/components/LineChart/LineChart.tsx +592 -0
  374. package/src/components/LineChart/LineChart.types.ts +78 -0
  375. package/src/components/LineChart/LineChart.variants.ts +324 -0
  376. package/src/components/LineChart/index.ts +7 -0
  377. package/src/components/Link/Link.tsx +81 -0
  378. package/src/components/Link/Link.types.ts +23 -0
  379. package/src/components/Link/Link.variants.ts +69 -0
  380. package/src/components/Link/index.ts +2 -0
  381. package/src/components/List/List.tsx +260 -0
  382. package/src/components/List/List.types.ts +70 -0
  383. package/src/components/List/List.variants.ts +94 -0
  384. package/src/components/List/index.ts +5 -0
  385. package/src/components/ListGroup/ListGroup.tsx +37 -0
  386. package/src/components/ListGroup/ListGroup.types.ts +14 -0
  387. package/src/components/ListGroup/ListGroup.variants.ts +17 -0
  388. package/src/components/ListGroup/index.ts +3 -0
  389. package/src/components/LoadingIndicator/LoadingIndicator.tsx +208 -0
  390. package/src/components/LoadingIndicator/LoadingIndicator.types.ts +51 -0
  391. package/src/components/LoadingIndicator/LoadingIndicator.variants.ts +108 -0
  392. package/src/components/LoadingIndicator/index.ts +7 -0
  393. package/src/components/MediaGallery/MediaGallery.tsx +600 -0
  394. package/src/components/MediaGallery/MediaGallery.types.ts +124 -0
  395. package/src/components/MediaGallery/MediaGallery.variants.ts +116 -0
  396. package/src/components/MediaGallery/index.ts +2 -0
  397. package/src/components/MediaGrids/MediaGrids.tsx +48 -0
  398. package/src/components/MediaGrids/MediaGrids.types.ts +14 -0
  399. package/src/components/MediaGrids/MediaGrids.variants.ts +16 -0
  400. package/src/components/MediaGrids/index.ts +2 -0
  401. package/src/components/MediaViewer/MediaViewer.tsx +345 -0
  402. package/src/components/MediaViewer/MediaViewer.types.ts +59 -0
  403. package/src/components/MediaViewer/MediaViewer.variants.ts +168 -0
  404. package/src/components/MediaViewer/index.ts +2 -0
  405. package/src/components/Menu/Menu.tsx +109 -0
  406. package/src/components/Menu/Menu.types.ts +37 -0
  407. package/src/components/Menu/Menu.variants.ts +29 -0
  408. package/src/components/Menu/index.ts +2 -0
  409. package/src/components/MenuButtonItem/MenuButtonItem.tsx +280 -0
  410. package/src/components/MenuButtonItem/MenuButtonItem.types.ts +91 -0
  411. package/src/components/MenuButtonItem/MenuButtonItem.variants.ts +223 -0
  412. package/src/components/MenuButtonItem/index.ts +8 -0
  413. package/src/components/MenuItem/MenuItem.tsx +211 -0
  414. package/src/components/MenuItem/MenuItem.types.ts +40 -0
  415. package/src/components/MenuItem/MenuItem.variants.ts +48 -0
  416. package/src/components/MenuItem/index.ts +2 -0
  417. package/src/components/MenuItemGroup/MenuItemGroup.tsx +91 -0
  418. package/src/components/MenuItemGroup/MenuItemGroup.types.ts +82 -0
  419. package/src/components/MenuItemGroup/MenuItemGroup.variants.ts +33 -0
  420. package/src/components/MenuItemGroup/index.ts +2 -0
  421. package/src/components/MenuList/MenuList.tsx +44 -0
  422. package/src/components/MenuList/MenuList.types.ts +28 -0
  423. package/src/components/MenuList/MenuList.variants.ts +2 -0
  424. package/src/components/MenuList/index.ts +2 -0
  425. package/src/components/Metric/Metric.tsx +584 -0
  426. package/src/components/Metric/Metric.types.ts +77 -0
  427. package/src/components/Metric/Metric.variants.ts +175 -0
  428. package/src/components/Metric/index.ts +8 -0
  429. package/src/components/Modal/Modal.tsx +139 -0
  430. package/src/components/Modal/Modal.types.ts +55 -0
  431. package/src/components/Modal/index.ts +2 -0
  432. package/src/components/ModalActions/ModalActions.tsx +176 -0
  433. package/src/components/ModalActions/ModalActions.types.ts +31 -0
  434. package/src/components/ModalActions/index.ts +2 -0
  435. package/src/components/ModalHeader/ModalHeader.tsx +207 -0
  436. package/src/components/ModalHeader/ModalHeader.types.ts +24 -0
  437. package/src/components/ModalHeader/index.ts +2 -0
  438. package/src/components/NavBar/NavBar.tsx +326 -0
  439. package/src/components/NavBar/NavBar.types.ts +78 -0
  440. package/src/components/NavBar/NavBar.variants.ts +139 -0
  441. package/src/components/NavBar/index.ts +2 -0
  442. package/src/components/NavHeader/NavHeader.tsx +292 -0
  443. package/src/components/NavHeader/NavHeader.types.ts +145 -0
  444. package/src/components/NavHeader/NavHeader.variants.ts +178 -0
  445. package/src/components/NavHeader/index.ts +2 -0
  446. package/src/components/NavHeaderActions/NavHeaderActions.tsx +161 -0
  447. package/src/components/NavHeaderActions/NavHeaderActions.types.ts +61 -0
  448. package/src/components/NavHeaderActions/NavHeaderActions.variants.ts +58 -0
  449. package/src/components/NavHeaderActions/index.ts +2 -0
  450. package/src/components/NavHeaderDropdownItem/NavHeaderDropdownItem.tsx +243 -0
  451. package/src/components/NavHeaderDropdownItem/NavHeaderDropdownItem.types.ts +76 -0
  452. package/src/components/NavHeaderDropdownItem/NavHeaderDropdownItem.variants.ts +133 -0
  453. package/src/components/NavHeaderDropdownItem/index.ts +5 -0
  454. package/src/components/NavHeaderDropdownItemList/NavHeaderDropdownItemList.tsx +64 -0
  455. package/src/components/NavHeaderDropdownItemList/NavHeaderDropdownItemList.types.ts +55 -0
  456. package/src/components/NavHeaderDropdownItemList/NavHeaderDropdownItemList.variants.ts +47 -0
  457. package/src/components/NavHeaderDropdownItemList/index.ts +5 -0
  458. package/src/components/NavHeaderMenuButton/NavHeaderMenuButton.tsx +52 -0
  459. package/src/components/NavHeaderMenuButton/NavHeaderMenuButton.types.ts +17 -0
  460. package/src/components/NavHeaderMenuButton/NavHeaderMenuButton.variants.ts +73 -0
  461. package/src/components/NavHeaderMenuButton/index.ts +2 -0
  462. package/src/components/NavHeaderMenuCard/NavHeaderMenuCard.tsx +126 -0
  463. package/src/components/NavHeaderMenuCard/NavHeaderMenuCard.types.ts +74 -0
  464. package/src/components/NavHeaderMenuCard/NavHeaderMenuCard.variants.ts +169 -0
  465. package/src/components/NavHeaderMenuCard/index.ts +6 -0
  466. package/src/components/NavHeaderMenuItem/NavHeaderMenuItem.tsx +164 -0
  467. package/src/components/NavHeaderMenuItem/NavHeaderMenuItem.types.ts +64 -0
  468. package/src/components/NavHeaderMenuItem/NavHeaderMenuItem.variants.ts +175 -0
  469. package/src/components/NavHeaderMenuItem/index.ts +2 -0
  470. package/src/components/NavItem/NavItem.tsx +210 -0
  471. package/src/components/NavItem/NavItem.types.ts +71 -0
  472. package/src/components/NavItem/NavItem.variants.ts +61 -0
  473. package/src/components/NavItem/index.ts +2 -0
  474. package/src/components/NavLabel/NavLabel.tsx +84 -0
  475. package/src/components/NavLabel/NavLabel.types.ts +55 -0
  476. package/src/components/NavLabel/NavLabel.variants.ts +68 -0
  477. package/src/components/NavLabel/index.ts +2 -0
  478. package/src/components/NavLogoPlaceholder/NavLogoPlaceholder.tsx +101 -0
  479. package/src/components/NavLogoPlaceholder/NavLogoPlaceholder.types.ts +27 -0
  480. package/src/components/NavLogoPlaceholder/NavLogoPlaceholder.variants.ts +42 -0
  481. package/src/components/NavLogoPlaceholder/index.ts +6 -0
  482. package/src/components/NotificationBanner/NotificationBanner.tsx +256 -0
  483. package/src/components/NotificationBanner/NotificationBanner.types.ts +77 -0
  484. package/src/components/NotificationBanner/NotificationBanner.variants.ts +109 -0
  485. package/src/components/NotificationBanner/index.ts +7 -0
  486. package/src/components/NotificationPopup/NotificationPopup.tsx +147 -0
  487. package/src/components/NotificationPopup/NotificationPopup.types.ts +51 -0
  488. package/src/components/NotificationPopup/NotificationPopup.variants.ts +145 -0
  489. package/src/components/NotificationPopup/index.ts +5 -0
  490. package/src/components/Notifications/Notifications.tsx +209 -0
  491. package/src/components/Notifications/Notifications.types.ts +68 -0
  492. package/src/components/Notifications/Notifications.variants.ts +89 -0
  493. package/src/components/Notifications/index.ts +2 -0
  494. package/src/components/Number/Number.tsx +497 -0
  495. package/src/components/Number/Number.types.ts +58 -0
  496. package/src/components/Number/Number.variants.ts +94 -0
  497. package/src/components/Number/index.ts +2 -0
  498. package/src/components/NumberInput/NumberInput.tsx +265 -0
  499. package/src/components/NumberInput/NumberInput.types.ts +110 -0
  500. package/src/components/NumberInput/NumberInput.variants.ts +205 -0
  501. package/src/components/NumberInput/index.ts +6 -0
  502. package/src/components/Pagination/Pagination.tsx +393 -0
  503. package/src/components/Pagination/Pagination.types.ts +26 -0
  504. package/src/components/Pagination/Pagination.variants.ts +88 -0
  505. package/src/components/Pagination/index.ts +3 -0
  506. package/src/components/PaginationButtonGroup/PaginationButtonGroup.tsx +132 -0
  507. package/src/components/PaginationButtonGroup/PaginationButtonGroup.types.ts +20 -0
  508. package/src/components/PaginationButtonGroup/PaginationButtonGroup.variants.ts +45 -0
  509. package/src/components/PaginationButtonGroup/index.ts +8 -0
  510. package/src/components/PaginationCells/PaginationCells.tsx +105 -0
  511. package/src/components/PaginationCells/PaginationCells.types.ts +31 -0
  512. package/src/components/PaginationCells/PaginationCells.variants.ts +96 -0
  513. package/src/components/PaginationCells/index.ts +9 -0
  514. package/src/components/PdfViewer/PdfViewer.tsx +265 -0
  515. package/src/components/PdfViewer/PdfViewer.types.ts +79 -0
  516. package/src/components/PdfViewer/PdfViewer.variants.ts +105 -0
  517. package/src/components/PdfViewer/index.ts +3 -0
  518. package/src/components/PieChartPanel/PieChartPanel.tsx +889 -0
  519. package/src/components/PieChartPanel/PieChartPanel.types.ts +130 -0
  520. package/src/components/PieChartPanel/PieChartPanel.variants.ts +156 -0
  521. package/src/components/PieChartPanel/index.ts +8 -0
  522. package/src/components/Popover/Popover.tsx +398 -0
  523. package/src/components/Popover/Popover.types.ts +155 -0
  524. package/src/components/Popover/Popover.variants.ts +147 -0
  525. package/src/components/Popover/index.ts +7 -0
  526. package/src/components/ProgressBar/ProgressBar.tsx +241 -0
  527. package/src/components/ProgressBar/ProgressBar.types.ts +22 -0
  528. package/src/components/ProgressBar/ProgressBar.variants.ts +54 -0
  529. package/src/components/ProgressBar/index.ts +2 -0
  530. package/src/components/ProgressCircle/ProgressCircle.tsx +369 -0
  531. package/src/components/ProgressCircle/ProgressCircle.types.ts +26 -0
  532. package/src/components/ProgressCircle/ProgressCircle.variants.ts +88 -0
  533. package/src/components/ProgressCircle/index.ts +7 -0
  534. package/src/components/Quote/Quote.tsx +210 -0
  535. package/src/components/Quote/Quote.types.ts +73 -0
  536. package/src/components/Quote/Quote.variants.ts +106 -0
  537. package/src/components/Quote/index.ts +2 -0
  538. package/src/components/RadialStepper/RadialStepper.tsx +166 -0
  539. package/src/components/RadialStepper/RadialStepper.types.ts +77 -0
  540. package/src/components/RadialStepper/RadialStepper.variants.ts +122 -0
  541. package/src/components/RadialStepper/index.ts +7 -0
  542. package/src/components/RadioButton/RadioButton.tsx +237 -0
  543. package/src/components/RadioButton/RadioButton.types.ts +18 -0
  544. package/src/components/RadioButton/index.ts +2 -0
  545. package/src/components/RadioLabel/RadioLabel.tsx +157 -0
  546. package/src/components/RadioLabel/RadioLabel.types.ts +53 -0
  547. package/src/components/RadioLabel/RadioLabel.variants.ts +36 -0
  548. package/src/components/RadioLabel/index.ts +2 -0
  549. package/src/components/RangeSlider/RangeSlider.tsx +389 -0
  550. package/src/components/RangeSlider/RangeSlider.types.ts +38 -0
  551. package/src/components/RangeSlider/RangeSlider.variants.ts +27 -0
  552. package/src/components/RangeSlider/index.ts +2 -0
  553. package/src/components/Rating/Rating.tsx +246 -0
  554. package/src/components/Rating/Rating.types.ts +37 -0
  555. package/src/components/Rating/Rating.variants.ts +52 -0
  556. package/src/components/Rating/index.ts +8 -0
  557. package/src/components/RatingOverview/RatingOverview.tsx +170 -0
  558. package/src/components/RatingOverview/RatingOverview.types.ts +37 -0
  559. package/src/components/RatingOverview/RatingOverview.variants.ts +50 -0
  560. package/src/components/RatingOverview/index.ts +2 -0
  561. package/src/components/RatingStar/RatingStar.tsx +76 -0
  562. package/src/components/RatingStar/RatingStar.types.ts +18 -0
  563. package/src/components/RatingStar/RatingStar.variants.ts +34 -0
  564. package/src/components/RatingStar/index.ts +7 -0
  565. package/src/components/RichTextEditor/RichTextEditor.tsx +1341 -0
  566. package/src/components/RichTextEditor/RichTextEditor.types.ts +127 -0
  567. package/src/components/RichTextEditor/RichTextEditor.variants.ts +231 -0
  568. package/src/components/RichTextEditor/index.ts +6 -0
  569. package/src/components/ScatterChart/ScatterChart.tsx +164 -0
  570. package/src/components/ScatterChart/ScatterChart.types.ts +42 -0
  571. package/src/components/ScatterChart/ScatterChart.variants.ts +162 -0
  572. package/src/components/ScatterChart/index.ts +2 -0
  573. package/src/components/SdaiaLogoAnimation/BGSVG.tsx +216 -0
  574. package/src/components/SdaiaLogoAnimation/SdaiaLogoAnimation.tsx +120 -0
  575. package/src/components/SdaiaLogoAnimation/SdaiaLogoAnimation.types.ts +13 -0
  576. package/src/components/SdaiaLogoAnimation/SdaiaLogoAnimation.variants.ts +22 -0
  577. package/src/components/SdaiaLogoAnimation/index.ts +2 -0
  578. package/src/components/SdaiaTouch2dAnimation/SdaiaTouch2dAnimation.tsx +55 -0
  579. package/src/components/SdaiaTouch2dAnimation/SdaiaTouch2dAnimation.types.ts +12 -0
  580. package/src/components/SdaiaTouch2dAnimation/SdaiaTouch2dAnimation.variants.ts +28 -0
  581. package/src/components/SdaiaTouch2dAnimation/Star.tsx +82 -0
  582. package/src/components/SdaiaTouch2dAnimation/StarShape.tsx +78 -0
  583. package/src/components/SdaiaTouch2dAnimation/index.ts +6 -0
  584. package/src/components/SecondNavHeader/SecondNavHeader.tsx +80 -0
  585. package/src/components/SecondNavHeader/SecondNavHeader.types.ts +41 -0
  586. package/src/components/SecondNavHeader/SecondNavHeader.variants.ts +42 -0
  587. package/src/components/SecondNavHeader/index.ts +2 -0
  588. package/src/components/Select/Select.tsx +351 -0
  589. package/src/components/Select/Select.types.ts +102 -0
  590. package/src/components/Select/Select.variants.ts +111 -0
  591. package/src/components/Select/index.ts +2 -0
  592. package/src/components/SelectMenuItem/SelectMenuItem.tsx +132 -0
  593. package/src/components/SelectMenuItem/SelectMenuItem.types.ts +47 -0
  594. package/src/components/SelectMenuItem/SelectMenuItem.variants.ts +56 -0
  595. package/src/components/SelectMenuItem/index.ts +2 -0
  596. package/src/components/SeriesLabel/SeriesLabel.tsx +76 -0
  597. package/src/components/SeriesLabel/SeriesLabel.types.ts +27 -0
  598. package/src/components/SeriesLabel/SeriesLabel.variants.ts +84 -0
  599. package/src/components/SeriesLabel/index.ts +2 -0
  600. package/src/components/Signature/Signature.tsx +905 -0
  601. package/src/components/Signature/Signature.types.ts +68 -0
  602. package/src/components/Signature/Signature.variants.ts +115 -0
  603. package/src/components/Signature/index.ts +2 -0
  604. package/src/components/Skeleton/Skeleton.tsx +21 -0
  605. package/src/components/Skeleton/Skeleton.types.ts +15 -0
  606. package/src/components/Skeleton/Skeleton.variants.ts +14 -0
  607. package/src/components/Skeleton/index.ts +2 -0
  608. package/src/components/SkeletonAvatar/SkeletonAvatar.tsx +21 -0
  609. package/src/components/SkeletonAvatar/SkeletonAvatar.types.ts +15 -0
  610. package/src/components/SkeletonAvatar/SkeletonAvatar.variants.ts +14 -0
  611. package/src/components/SkeletonAvatar/index.ts +2 -0
  612. package/src/components/SlideoutMenu/SlideoutMenu.tsx +225 -0
  613. package/src/components/SlideoutMenu/SlideoutMenu.types.ts +39 -0
  614. package/src/components/SlideoutMenu/SlideoutMenuDivider.tsx +10 -0
  615. package/src/components/SlideoutMenu/SlideoutMenuSection.tsx +39 -0
  616. package/src/components/SlideoutMenu/index.ts +5 -0
  617. package/src/components/SlideoutMenuFooter/SlideoutMenuFooter.tsx +96 -0
  618. package/src/components/SlideoutMenuFooter/SlideoutMenuFooter.types.ts +28 -0
  619. package/src/components/SlideoutMenuFooter/SlideoutMenuFooter.variants.ts +49 -0
  620. package/src/components/SlideoutMenuFooter/index.ts +6 -0
  621. package/src/components/SlideoutMenuHeader/SlideoutMenuHeader.tsx +83 -0
  622. package/src/components/SlideoutMenuHeader/SlideoutMenuHeader.types.ts +19 -0
  623. package/src/components/SlideoutMenuHeader/SlideoutMenuHeader.variants.ts +78 -0
  624. package/src/components/SlideoutMenuHeader/index.ts +2 -0
  625. package/src/components/Slider/Slider.tsx +259 -0
  626. package/src/components/Slider/Slider.types.ts +22 -0
  627. package/src/components/Slider/Slider.variants.ts +23 -0
  628. package/src/components/Slider/index.ts +2 -0
  629. package/src/components/Sparkline/Sparkline.tsx +130 -0
  630. package/src/components/Sparkline/Sparkline.types.ts +36 -0
  631. package/src/components/Sparkline/Sparkline.variants.ts +118 -0
  632. package/src/components/Sparkline/index.ts +2 -0
  633. package/src/components/StatusDot/StatusDot.tsx +82 -0
  634. package/src/components/StatusDot/StatusDot.types.ts +35 -0
  635. package/src/components/StatusDot/StatusDot.variants.ts +66 -0
  636. package/src/components/StatusDot/index.ts +8 -0
  637. package/src/components/StructuredList/StructuredList.tsx +79 -0
  638. package/src/components/StructuredList/StructuredList.types.ts +27 -0
  639. package/src/components/StructuredList/index.ts +2 -0
  640. package/src/components/StructuredListGroup/StructuredListGroup.tsx +76 -0
  641. package/src/components/StructuredListGroup/StructuredListGroup.types.ts +27 -0
  642. package/src/components/StructuredListGroup/StructuredListGroup.variants.ts +14 -0
  643. package/src/components/StructuredListGroup/index.ts +5 -0
  644. package/src/components/StructuredListHeader/StructuredListHeader.tsx +98 -0
  645. package/src/components/StructuredListHeader/StructuredListHeader.types.ts +26 -0
  646. package/src/components/StructuredListHeader/StructuredListHeader.variants.ts +24 -0
  647. package/src/components/StructuredListHeader/index.ts +5 -0
  648. package/src/components/StructuredListRow/StructuredListRow.tsx +144 -0
  649. package/src/components/StructuredListRow/StructuredListRow.types.ts +37 -0
  650. package/src/components/StructuredListRow/StructuredListRow.variants.ts +53 -0
  651. package/src/components/StructuredListRow/index.ts +6 -0
  652. package/src/components/SubHeaderItem/SubHeaderItem.tsx +37 -0
  653. package/src/components/SubHeaderItem/SubHeaderItem.types.ts +20 -0
  654. package/src/components/SubHeaderItem/SubHeaderItem.variants.ts +23 -0
  655. package/src/components/SubHeaderItem/index.ts +2 -0
  656. package/src/components/Switch/Switch.tsx +138 -0
  657. package/src/components/Switch/Switch.types.ts +18 -0
  658. package/src/components/Switch/Switch.variants.ts +49 -0
  659. package/src/components/Switch/index.ts +2 -0
  660. package/src/components/SwitchLabel/SwitchLabel.tsx +114 -0
  661. package/src/components/SwitchLabel/SwitchLabel.types.ts +27 -0
  662. package/src/components/SwitchLabel/SwitchLabel.variants.ts +28 -0
  663. package/src/components/SwitchLabel/index.ts +2 -0
  664. package/src/components/Tab/Tab.tsx +92 -0
  665. package/src/components/Tab/Tab.types.ts +34 -0
  666. package/src/components/Tab/Tab.variants.ts +79 -0
  667. package/src/components/Tab/index.ts +2 -0
  668. package/src/components/Table/Table.tsx +353 -0
  669. package/src/components/Table/Table.types.ts +80 -0
  670. package/src/components/Table/Table.variants.ts +110 -0
  671. package/src/components/Table/index.ts +10 -0
  672. package/src/components/TableOfContent/TableOfContent.tsx +33 -0
  673. package/src/components/TableOfContent/TableOfContent.types.ts +15 -0
  674. package/src/components/TableOfContent/TableOfContent.variants.ts +27 -0
  675. package/src/components/TableOfContent/index.ts +2 -0
  676. package/src/components/TableOfContentItem/TableOfContentItem.tsx +85 -0
  677. package/src/components/TableOfContentItem/TableOfContentItem.types.ts +23 -0
  678. package/src/components/TableOfContentItem/TableOfContentItem.variants.ts +109 -0
  679. package/src/components/TableOfContentItem/index.ts +2 -0
  680. package/src/components/TableOfContentList/TableOfContentList.tsx +60 -0
  681. package/src/components/TableOfContentList/TableOfContentList.types.ts +39 -0
  682. package/src/components/TableOfContentList/TableOfContentList.variants.ts +6 -0
  683. package/src/components/TableOfContentList/index.ts +2 -0
  684. package/src/components/Tabs/Tabs.tsx +80 -0
  685. package/src/components/Tabs/Tabs.types.ts +36 -0
  686. package/src/components/Tabs/Tabs.variants.ts +23 -0
  687. package/src/components/Tabs/index.ts +2 -0
  688. package/src/components/Tag/Tag.tsx +114 -0
  689. package/src/components/Tag/Tag.types.ts +32 -0
  690. package/src/components/Tag/Tag.variants.ts +57 -0
  691. package/src/components/Tag/index.ts +2 -0
  692. package/src/components/TagCount/TagCount.tsx +45 -0
  693. package/src/components/TagCount/TagCount.types.ts +21 -0
  694. package/src/components/TagCount/TagCount.variants.ts +26 -0
  695. package/src/components/TagCount/index.ts +7 -0
  696. package/src/components/TextArea/TextArea.tsx +130 -0
  697. package/src/components/TextArea/TextArea.types.ts +20 -0
  698. package/src/components/TextArea/index.ts +2 -0
  699. package/src/components/TextInput/TextInput.tsx +568 -0
  700. package/src/components/TextInput/TextInput.types.ts +87 -0
  701. package/src/components/TextInput/TextInput.variants.ts +89 -0
  702. package/src/components/TextInput/TextInputTag.tsx +43 -0
  703. package/src/components/TextInput/TextInputTag.types.ts +14 -0
  704. package/src/components/TextInput/index.ts +4 -0
  705. package/src/components/Tooltip/Tooltip.tsx +229 -0
  706. package/src/components/Tooltip/Tooltip.types.ts +48 -0
  707. package/src/components/Tooltip/Tooltip.variants.ts +141 -0
  708. package/src/components/Tooltip/index.ts +10 -0
  709. package/src/components/TreeView/TreeView.tsx +130 -0
  710. package/src/components/TreeView/TreeView.types.ts +42 -0
  711. package/src/components/TreeView/TreeView.variants.ts +6 -0
  712. package/src/components/TreeView/index.ts +3 -0
  713. package/src/components/TreeViewItem/TreeViewItem.tsx +108 -0
  714. package/src/components/TreeViewItem/TreeViewItem.types.ts +34 -0
  715. package/src/components/TreeViewItem/TreeViewItem.variants.ts +40 -0
  716. package/src/components/TreeViewItem/index.ts +3 -0
  717. package/src/components/VerticalTabs/VerticalTabs.tsx +84 -0
  718. package/src/components/VerticalTabs/VerticalTabs.types.ts +37 -0
  719. package/src/components/VerticalTabs/VerticalTabs.variants.ts +43 -0
  720. package/src/components/VerticalTabs/index.ts +6 -0
  721. package/src/components/VideoPlayer/VideoPlayer.tsx +470 -0
  722. package/src/components/VideoPlayer/VideoPlayer.types.ts +59 -0
  723. package/src/components/VideoPlayer/VideoPlayer.variants.ts +134 -0
  724. package/src/components/VideoPlayer/index.ts +2 -0
  725. package/src/components/XAxis/XAxis.tsx +67 -0
  726. package/src/components/XAxis/XAxis.types.ts +30 -0
  727. package/src/components/XAxis/XAxis.variants.ts +77 -0
  728. package/src/components/XAxis/index.ts +2 -0
  729. package/src/components/YAxis/YAxis.tsx +78 -0
  730. package/src/components/YAxis/YAxis.types.ts +41 -0
  731. package/src/components/YAxis/YAxis.variants.ts +94 -0
  732. package/src/components/YAxis/index.ts +2 -0
  733. package/src/dga-icons.ts +18 -0
  734. package/src/hooks/usePresence.ts +73 -0
  735. package/src/icons/AIIcon.tsx +34 -0
  736. package/src/icons/AaIcon.tsx +34 -0
  737. package/src/icons/AlertCircle02Icon.tsx +28 -0
  738. package/src/icons/AlertCircleIcon.tsx +29 -0
  739. package/src/icons/AlertCircleSVG.tsx +19 -0
  740. package/src/icons/AlertCircleWarningIcon.tsx +37 -0
  741. package/src/icons/AlertTriangleIcon.tsx +27 -0
  742. package/src/icons/AlignCenterIcon.tsx +31 -0
  743. package/src/icons/AlignLeftIcon.tsx +31 -0
  744. package/src/icons/AlignRightIcon.tsx +31 -0
  745. package/src/icons/ArrowDownIcon.tsx +27 -0
  746. package/src/icons/ArrowDownLeft01Icon.tsx +32 -0
  747. package/src/icons/ArrowDownSVG.tsx +16 -0
  748. package/src/icons/ArrowIcon.tsx +38 -0
  749. package/src/icons/ArrowLeft01Icon.tsx +23 -0
  750. package/src/icons/ArrowLeft02SVG.tsx +19 -0
  751. package/src/icons/ArrowLeftIcon.tsx +28 -0
  752. package/src/icons/ArrowRight01Icon.tsx +23 -0
  753. package/src/icons/ArrowRight01SVG.tsx +16 -0
  754. package/src/icons/ArrowRightIcon.tsx +28 -0
  755. package/src/icons/ArrowUpIcon.tsx +27 -0
  756. package/src/icons/ArrowUpRight01Icon.tsx +31 -0
  757. package/src/icons/ArrowUpSVG.tsx +16 -0
  758. package/src/icons/AtIcon.tsx +33 -0
  759. package/src/icons/BeakBottom.tsx +13 -0
  760. package/src/icons/BeakDown.tsx +29 -0
  761. package/src/icons/BeakLeft.tsx +13 -0
  762. package/src/icons/BeakRight.tsx +11 -0
  763. package/src/icons/BeakTop.tsx +13 -0
  764. package/src/icons/BeakUp.tsx +23 -0
  765. package/src/icons/BellCircleIcon.tsx +33 -0
  766. package/src/icons/BellIcon.tsx +27 -0
  767. package/src/icons/BoldIcon.tsx +33 -0
  768. package/src/icons/CalendarIcon.tsx +35 -0
  769. package/src/icons/ChartsIcon.tsx +25 -0
  770. package/src/icons/CheckCircleIcon.tsx +29 -0
  771. package/src/icons/ChevronDownIcon.tsx +30 -0
  772. package/src/icons/ChevronDownSmIcon.tsx +34 -0
  773. package/src/icons/ChevronLeftIcon.tsx +20 -0
  774. package/src/icons/ChevronRightIcon.tsx +36 -0
  775. package/src/icons/ClearIcon.tsx +34 -0
  776. package/src/icons/ClockIcon.tsx +34 -0
  777. package/src/icons/CloseIcon.tsx +29 -0
  778. package/src/icons/CloudUploadIcon.tsx +21 -0
  779. package/src/icons/CodeSnippetChevronDownIcon.tsx +25 -0
  780. package/src/icons/CodeSnippetCopyIcon.tsx +24 -0
  781. package/src/icons/CodeSnippetStarIcon.tsx +25 -0
  782. package/src/icons/ColorSquareIcon.tsx +42 -0
  783. package/src/icons/ComponentsIcon.tsx +25 -0
  784. package/src/icons/DGALogoSVG.tsx +133 -0
  785. package/src/icons/DeleteIcon.tsx +24 -0
  786. package/src/icons/DownloadIcon.tsx +29 -0
  787. package/src/icons/DragHandleVerticalIcon.tsx +23 -0
  788. package/src/icons/FeedbackEmojiDislikeIcon.tsx +20 -0
  789. package/src/icons/FeedbackEmojiLikeIcon.tsx +20 -0
  790. package/src/icons/FeedbackEmojiNeutralIcon.tsx +20 -0
  791. package/src/icons/FeedbackThumbDislikeFilledIcon.tsx +26 -0
  792. package/src/icons/FeedbackThumbDislikeIcon.tsx +20 -0
  793. package/src/icons/FeedbackThumbLikeFilledIcon.tsx +20 -0
  794. package/src/icons/FeedbackThumbLikeIcon.tsx +20 -0
  795. package/src/icons/FileUploadItemCloseIcon.tsx +30 -0
  796. package/src/icons/FileUploadItemEmptyFileIcon.tsx +27 -0
  797. package/src/icons/FileUploadItemPdfIcon.tsx +52 -0
  798. package/src/icons/FilterFunnelIcon.tsx +34 -0
  799. package/src/icons/FilterIcon.tsx +31 -0
  800. package/src/icons/FitIcon.tsx +22 -0
  801. package/src/icons/FolderFilledIcon.tsx +25 -0
  802. package/src/icons/FolderIcon.tsx +28 -0
  803. package/src/icons/FoundationsIcon.tsx +25 -0
  804. package/src/icons/FullscreenExitIcon.tsx +71 -0
  805. package/src/icons/FullscreenIcon.tsx +70 -0
  806. package/src/icons/GoBackward10Icon.tsx +27 -0
  807. package/src/icons/GoForward10Icon.tsx +27 -0
  808. package/src/icons/GridSquaresIcon.tsx +40 -0
  809. package/src/icons/HamburgerIcon.tsx +28 -0
  810. package/src/icons/HelpCircleIcon.tsx +28 -0
  811. package/src/icons/HomeIcon.tsx +22 -0
  812. package/src/icons/HomeSVG.tsx +32 -0
  813. package/src/icons/IconFactory.ts +157 -0
  814. package/src/icons/Image01SVG.tsx +18 -0
  815. package/src/icons/ImageIcon.tsx +31 -0
  816. package/src/icons/InfoCircleIcon.tsx +31 -0
  817. package/src/icons/InfoCircleSVG.tsx +20 -0
  818. package/src/icons/InfoIcon.tsx +27 -0
  819. package/src/icons/ItalicIcon.tsx +31 -0
  820. package/src/icons/LearnMoreArrowIcon.tsx +22 -0
  821. package/src/icons/LinkCircleSVG.tsx +58 -0
  822. package/src/icons/LinkIcon.tsx +33 -0
  823. package/src/icons/ListLinesIcon.tsx +40 -0
  824. package/src/icons/LockCircleSVG.tsx +60 -0
  825. package/src/icons/LockIcon.tsx +36 -0
  826. package/src/icons/Logout02Icon.tsx +19 -0
  827. package/src/icons/MicrophoneIcon.tsx +20 -0
  828. package/src/icons/MinusIcon.tsx +40 -0
  829. package/src/icons/MoreHorizontalIcon.tsx +24 -0
  830. package/src/icons/MoreVerticalIcon.tsx +40 -0
  831. package/src/icons/NextIcon.tsx +44 -0
  832. package/src/icons/PDFSvg.tsx +39 -0
  833. package/src/icons/PatternsIcon.tsx +21 -0
  834. package/src/icons/PauseIcon.tsx +30 -0
  835. package/src/icons/PencilIcon.tsx +36 -0
  836. package/src/icons/PlayButtonCardIcon.tsx +41 -0
  837. package/src/icons/PlayCenterIcon.tsx +45 -0
  838. package/src/icons/PlayIcon.tsx +27 -0
  839. package/src/icons/PlayIconSolid.tsx +33 -0
  840. package/src/icons/PlayIconStroke.tsx +22 -0
  841. package/src/icons/PlayIconTwotone.tsx +36 -0
  842. package/src/icons/PlayVideoIcon.tsx +31 -0
  843. package/src/icons/PlusCircleIcon.tsx +41 -0
  844. package/src/icons/PlusIcon.tsx +43 -0
  845. package/src/icons/PreviousIcon.tsx +44 -0
  846. package/src/icons/PrintIcon.tsx +25 -0
  847. package/src/icons/QuestionMarkGrayBgIcon.tsx +52 -0
  848. package/src/icons/QuestionMarkIcon.tsx +47 -0
  849. package/src/icons/RedoIcon.tsx +41 -0
  850. package/src/icons/SaudiFlagSVG.tsx +31 -0
  851. package/src/icons/SdaiaNavLogo.tsx +345 -0
  852. package/src/icons/SearchIcon.tsx +34 -0
  853. package/src/icons/SettingsIcon.tsx +25 -0
  854. package/src/icons/ShareIcon.tsx +26 -0
  855. package/src/icons/SidebarCollapseIcon.tsx +25 -0
  856. package/src/icons/SmileIcon.tsx +34 -0
  857. package/src/icons/SortIcon.tsx +20 -0
  858. package/src/icons/StarIcon.tsx +38 -0
  859. package/src/icons/StatusBadgeIcon.tsx +19 -0
  860. package/src/icons/TextTIcon.tsx +33 -0
  861. package/src/icons/Tick02Icon.tsx +32 -0
  862. package/src/icons/TickIcon.tsx +33 -0
  863. package/src/icons/TrashIcon.tsx +44 -0
  864. package/src/icons/UnderlineIcon.tsx +31 -0
  865. package/src/icons/UndoIcon.tsx +31 -0
  866. package/src/icons/UploadArrowIcon.tsx +40 -0
  867. package/src/icons/UserIcon.tsx +21 -0
  868. package/src/icons/VolumeHighIcon.tsx +27 -0
  869. package/src/icons/VolumeMuteIcon.tsx +53 -0
  870. package/src/icons/XCircleIcon.tsx +32 -0
  871. package/src/icons/XIcon.tsx +27 -0
  872. package/src/icons/XIconSVG.tsx +16 -0
  873. package/src/icons/XSmallIcon.tsx +29 -0
  874. package/src/icons/XSvg.tsx +18 -0
  875. package/src/icons/ZoomInIcon.tsx +25 -0
  876. package/src/icons/index.ts +5 -0
  877. package/src/index.ts +699 -0
  878. package/src/lib/cn.ts +42 -0
  879. package/src/styles/motion.css +120 -0
  880. package/src/styles.css +242 -0
package/src/components/ContentSwitcherItem/ContentSwitcherItem.variants.ts ADDED
@@ -0,0 +1,65 @@
1
+ import type { ContentSwitcherItemSize, ContentSwitcherItemPlacement } from './ContentSwitcherItem.types';
2
+
3
+ export interface SizeConfig {
4
+ text: string;
5
+ padding: string;
6
+ }
7
+
8
+ export const SIZE_MAP: Record<ContentSwitcherItemSize, SizeConfig> = {
9
+ sm: {
10
+ text: 'text-text-sm',
11
+ padding: 'px-spacing-xl py-spacing-sm',
12
+ },
13
+ md: {
14
+ text: 'text-text-md',
15
+ padding: 'px-spacing-2xl py-spacing-sm',
16
+ },
17
+ lg: {
18
+ text: 'text-text-lg',
19
+ padding: 'px-spacing-3xl py-spacing-md',
20
+ },
21
+ };
22
+
23
+ // When no explicit `placement` is given, first and last children in the group
24
+ // automatically receive 8px radius on their outer edge. Middle items stay flat.
25
+ export const STANDALONE_CLASSES = 'rounded-none first:rounded-s-[8px] last:rounded-e-[8px]';
26
+
27
+ export const PLACEMENT_MAP: Record<ContentSwitcherItemPlacement, string> = {
28
+ start: 'rounded-s-[8px] rounded-e-none border-e border-e-[rgba(210,214,219,1)] dark:border-e-[rgba(255,255,255,0.1)]',
29
+ center: 'rounded-none border-s border-s-[rgba(210,214,219,1)] border-e border-e-[rgba(210,214,219,1)] dark:border-s-[rgba(255,255,255,0.1)] dark:border-e-[rgba(255,255,255,0.1)]',
30
+ end: 'rounded-e-[8px] rounded-s-none',
31
+ };
32
+
33
+ /* ── State colors ──────────────────────────────────────────────── */
34
+
35
+ // Default — token: button/button-background-neutral-default
36
+ export const DEFAULT_COLORS =
37
+ 'bg-[#f3f4f6] text-[#161616] dark:bg-[rgba(255,255,255,0.1)] dark:text-white';
38
+
39
+ // Hovered — token: button/button-background-neutral-hovered
40
+ // Figma fallback resolves to the same #f3f4f6 as default in light mode;
41
+ // dark mode gets a slightly more opaque surface for affordance.
42
+ export const HOVER_COLORS =
43
+ 'hover:bg-[#f3f4f6] dark:hover:bg-[rgba(255,255,255,0.18)]';
44
+
45
+ // Selected — token: button/button-background-black-default
46
+ export const SELECTED_COLORS =
47
+ 'bg-[#0d121c] text-white dark:bg-[rgba(27,131,84,1)] dark:text-white';
48
+
49
+ /** Press/active scale for tactile feedback */
50
+ export const ACTIVE_SCALE = 'active:scale-[0.97]';
51
+
52
+ // Focused (Figma spec): dark background + 1px outer border #161616 +
53
+ // inset 2px white ring (replicated via box-shadow inset).
54
+ // Dark mode: green background + inset white ring.
55
+ export const FOCUS_RING = [
56
+ 'focus-visible:outline-none',
57
+ 'focus-visible:bg-[#0d121c]',
58
+ 'focus-visible:text-white',
59
+ 'focus-visible:border',
60
+ 'focus-visible:border-[#161616]',
61
+ 'focus-visible:shadow-[inset_0_0_0_2px_white]',
62
+ 'dark:focus-visible:bg-[rgba(27,131,84,1)]',
63
+ 'dark:focus-visible:border-[rgba(27,131,84,1)]',
64
+ 'dark:focus-visible:shadow-[inset_0_0_0_2px_rgba(255,255,255,0.9)]',
65
+ ].join(' ');
package/src/components/ContentSwitcherItem/index.ts ADDED
@@ -0,0 +1,6 @@
1
+ export { ContentSwitcherItem } from './ContentSwitcherItem';
2
+ export type {
3
+ ContentSwitcherItemProps,
4
+ ContentSwitcherItemSize,
5
+ ContentSwitcherItemPlacement,
6
+ } from './ContentSwitcherItem.types';
package/src/components/ContextMenu/ContextMenu.tsx ADDED
@@ -0,0 +1,101 @@
1
+ 'use client';
2
+
3
+ import { forwardRef } from 'react';
4
+ import { cn } from '../../lib/cn';
5
+ import type { ContextMenuProps } from './ContextMenu.types';
6
+ import { PANEL_BG, PANEL_SHADOW, PANEL_RADIUS } from './ContextMenu.variants';
7
+ import { ContextMenuDropdown } from '../ContextMenuDropdown';
8
+ import { NavItem } from '../NavItem';
9
+
10
+ /*
11
+ * ContextMenu — a floating panel of ContextMenuDropdown rows and dividers.
12
+ *
13
+ * Figma: "Context Menu" — node 6070:93109
14
+ *
15
+ * ## Structure
16
+ * White (dark: dark-surface) card, rounded-[8px], shadow-xl, py-spacing-xs.
17
+ * Each entry is either:
18
+ * - A `ContextMenuDropdown` trigger row (opens a submenu panel on click)
19
+ * - A 1px horizontal divider line via `NavItem divider`
20
+ *
21
+ * ## Figma default composition (both LTR & RTL)
22
+ * 3 ContextMenuDropdown rows
23
+ * ── divider ──
24
+ * 4 ContextMenuDropdown rows
25
+ * ── divider ──
26
+ * 1 ContextMenuDropdown row
27
+ *
28
+ * ## RTL
29
+ * Set dir="rtl" on a parent or <html>. ContextMenuDropdown and NavItem
30
+ * handle all directional mirroring internally (chevron flip, panel position).
31
+ *
32
+ * ## Dark mode
33
+ * Toggle html.dark — all dark: classes are in the variants file.
34
+ *
35
+ * ## Usage
36
+ * <ContextMenu
37
+ * items={[
38
+ * { label: 'Profile', items: profileSubItems },
39
+ * { label: 'Settings' },
40
+ * { type: 'divider' },
41
+ * { label: 'Sign out' },
42
+ * ]}
43
+ * />
44
+ */
45
+ export const ContextMenu = forwardRef<HTMLDivElement, ContextMenuProps>(
46
+ function ContextMenu({ items = [], className, ...rest }, ref) {
47
+ return (
48
+ <div
49
+ ref={ref}
50
+ data-slot="context-menu"
51
+ role="menu"
52
+ className={cn(
53
+ /* Panel base */
54
+ 'flex flex-col w-[250px] py-spacing-xs',
55
+ PANEL_RADIUS,
56
+ PANEL_BG,
57
+ PANEL_SHADOW,
58
+ className,
59
+ )}
60
+ {...rest}
61
+ >
62
+ {items.map((item, index) => {
63
+ /* ── Divider ───────────────────────────────────────────── */
64
+ if (item.type === 'divider') {
65
+ return (
66
+ <NavItem
67
+ key={index}
68
+ divider
69
+ /*
70
+ * NavItem divider renders a full-width 1px line using
71
+ * DIVIDER_LINE = Border/border-neutral-secondary = rgba(229,231,235,1).
72
+ * This matches the Figma divider exactly.
73
+ */
74
+ />
75
+ );
76
+ }
77
+
78
+ /* ── ContextMenuDropdown row ───────────────────────────── */
79
+ return (
80
+ <ContextMenuDropdown
81
+ key={index}
82
+ label={item.label}
83
+ items={item.items ?? []}
84
+ disabled={item.disabled}
85
+ destructive={item.destructive}
86
+ leadingIcon={item.leadingIcon}
87
+ tag={item.tag}
88
+ onSelect={item.onSelect}
89
+ /*
90
+ * Each row fills the panel width. ContextMenuDropdown already
91
+ * uses w-[250px] as default; here we set w-full so it stretches
92
+ * inside the panel regardless of the panel's own width.
93
+ */
94
+ className="w-full"
95
+ />
96
+ );
97
+ })}
98
+ </div>
99
+ );
100
+ },
101
+ );
package/src/components/ContextMenu/ContextMenu.types.ts ADDED
@@ -0,0 +1,64 @@
1
+ import type { HTMLAttributes, ReactNode } from 'react';
2
+ import type { ContextMenuDropdownItem } from '../ContextMenuDropdown';
3
+
4
+ /**
5
+ * A regular menu entry rendered as a `ContextMenuDropdown` trigger row.
6
+ * If `items` is provided the row opens a submenu panel on click.
7
+ */
8
+ export interface ContextMenuNavEntry {
9
+ type?: 'item';
10
+ /** Label displayed in the trigger row */
11
+ label: string;
12
+ /**
13
+ * Submenu items shown in the dropdown panel when this row is clicked.
14
+ * Omit or pass an empty array for a leaf row (no submenu).
15
+ */
16
+ items?: ContextMenuDropdownItem[];
17
+ /** Whether this row is disabled */
18
+ disabled?: boolean;
19
+ /**
20
+ * When true, renders the row in the destructive/error color (red).
21
+ * Use for irreversible actions such as Delete or Remove.
22
+ */
23
+ destructive?: boolean;
24
+ /**
25
+ * Optional leading icon rendered at the start of the row.
26
+ * Should be a 20×20 ReactNode (e.g. an SVG icon from IconFactory).
27
+ */
28
+ leadingIcon?: ReactNode;
29
+ /**
30
+ * Optional tag displayed at the trailing end of the row — used for
31
+ * keyboard shortcut hints (e.g. "⌘X", "⌘C").
32
+ * Rendered as a styled bordered badge.
33
+ */
34
+ tag?: string;
35
+ /**
36
+ * Called when a leaf row (no items) is clicked.
37
+ * For rows with sub-items, use the sub-item's own `onClick` instead.
38
+ */
39
+ onSelect?: () => void;
40
+ }
41
+
42
+ /** A 1px horizontal separator between groups of entries */
43
+ export interface ContextMenuDivider {
44
+ type: 'divider';
45
+ }
46
+
47
+ /**
48
+ * Union of all possible entries inside a ContextMenu.
49
+ * Figma: node 6070:93109 "Context Menu"
50
+ */
51
+ export type ContextMenuItem = ContextMenuNavEntry | ContextMenuDivider;
52
+
53
+ export interface ContextMenuProps
54
+ extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
55
+ /**
56
+ * Ordered list of items and dividers to display in the panel.
57
+ *
58
+ * Figma default: 8 `ContextMenuDropdown` rows with 2 dividers interspersed.
59
+ */
60
+ items?: ContextMenuItem[];
61
+
62
+ /** Additional class names on the root panel wrapper */
63
+ className?: string;
64
+ }
package/src/components/ContextMenu/ContextMenu.variants.ts ADDED
@@ -0,0 +1,36 @@
1
+ /*
2
+ * ContextMenu variant maps
3
+ *
4
+ * Figma source: node 6070:93109 "Context Menu"
5
+ * Variables traced to get_variable_defs output dated 2026-04-14.
6
+ *
7
+ * Panel layout tokens:
8
+ * py-spacing-xs (4px) vertical padding
9
+ * w-[250px] fixed width
10
+ * rounded-[8px]
11
+ *
12
+ * Child items are rendered by ContextMenuDropdown (trigger rows) and
13
+ * NavItem (dividers) — their own variants handle row-level styles.
14
+ */
15
+
16
+ /* ── Panel background ────────────────────────────────────────────
17
+ * Figma: Background/background-white = #ffffff
18
+ * Dark mode inverse: rgba(17,25,39,1) — consistent with other floating panels.
19
+ * ──────────────────────────────────────────────────────────────── */
20
+ export const PANEL_BG =
21
+ 'bg-white dark:bg-[rgba(17,25,39,1)]';
22
+
23
+ /* ── Panel shadow ────────────────────────────────────────────────
24
+ * Figma: Shadows/shadow-xl
25
+ * Layer 1: DROP_SHADOW color #10182808 offset (0,8) radius 8 spread -4
26
+ * → 0px 8px 8px -4px rgba(16,24,40,0.03)
27
+ * Layer 2: DROP_SHADOW color #10182814 offset (0,20) radius 24 spread -4
28
+ * → 0px 20px 24px -4px rgba(16,24,40,0.08)
29
+ * ──────────────────────────────────────────────────────────────── */
30
+ export const PANEL_SHADOW =
31
+ 'shadow-[0px_8px_8px_-4px_rgba(16,24,40,0.03),0px_20px_24px_-4px_rgba(16,24,40,0.08)]';
32
+
33
+ /* ── Panel border radius ─────────────────────────────────────────
34
+ * Figma: Radius/radius-8 = 8px
35
+ * ──────────────────────────────────────────────────────────────── */
36
+ export const PANEL_RADIUS = 'rounded-[8px]';
package/src/components/ContextMenu/index.ts ADDED
@@ -0,0 +1,7 @@
1
+ export { ContextMenu } from './ContextMenu';
2
+ export type {
3
+ ContextMenuProps,
4
+ ContextMenuItem,
5
+ ContextMenuNavEntry,
6
+ ContextMenuDivider,
7
+ } from './ContextMenu.types';
package/src/components/ContextMenuDropdown/ContextMenuDropdown.tsx ADDED
@@ -0,0 +1,370 @@
1
+ 'use client';
2
+
3
+ import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
4
+ import { cn } from '../../lib/cn';
5
+ import type { ContextMenuDropdownProps } from './ContextMenuDropdown.types';
6
+ import {
7
+ TRIGGER_HOVER_BG,
8
+ TRIGGER_FOCUS_RING,
9
+ TRIGGER_OPEN_BG,
10
+ DEFAULT_TEXT,
11
+ DISABLED_TEXT,
12
+ DESTRUCTIVE_TEXT,
13
+ DEFAULT_ICON_COLOR,
14
+ DISABLED_ICON_COLOR,
15
+ DESTRUCTIVE_ICON_COLOR,
16
+ DISABLED_CONTAINER,
17
+ TAG_BADGE,
18
+ PANEL_BG,
19
+ PANEL_SHADOW,
20
+ } from './ContextMenuDropdown.variants';
21
+ import { ChevronRightIcon } from '../../icons/IconFactory';
22
+ import { NavItem } from '../NavItem';
23
+
24
+ /*
25
+ * ContextMenuDropdown — a trigger row that opens a floating list of NavItem rows.
26
+ *
27
+ * Figma: "Context Menu Dropdown" — node 6058:82574
28
+ *
29
+ * ## Layout
30
+ * Trigger: two-level (outer px-spacing-sm py-spacing-xxs + inner p-spacing-md rounded-[8px])
31
+ * Panel: absolute, start-full top-[-4px], py-spacing-xs, rounded-[8px], shadow-xl
32
+ *
33
+ * ## Trigger states
34
+ * closed → interactive hover/active via CSS
35
+ * open → inner div locked to TRIGGER_OPEN_BG (Background/background-neutral-100)
36
+ * disabled → DISABLED_CONTAINER + muted text/icon, no interaction
37
+ * destructive → error/red text + icon color (for actions like Delete)
38
+ *
39
+ * ## Leading slot
40
+ * When `leadingIcon` is provided the icon is rendered at 20×20 in icon-color.
41
+ * Otherwise the 20×20 invisible spacer keeps label alignment consistent.
42
+ *
43
+ * ## Trailing slot
44
+ * `tag` → styled bordered badge (Figma Tag node 6091:84663); replaces chevron on leaf rows
45
+ * chevron → direction-aware ChevronRightIcon when items.length > 0 or tag is absent
46
+ *
47
+ * ## Panel positioning
48
+ * LTR: panel appears to the RIGHT of the trigger (start-full = left: 100%)
49
+ * RTL: panel appears to the LEFT of the trigger (start-full = right: 100%)
50
+ * A slight top offset of -4px aligns the panel top with the trigger row top.
51
+ *
52
+ * ## RTL
53
+ * Set dir="rtl" on a parent or <html>. CSS logical properties (start-full) handle
54
+ * positioning. The trigger chevron flips via rtl:-scale-x-100 on its wrapper.
55
+ *
56
+ * ## Dark mode
57
+ * Toggle html.dark — all dark: classes are defined in the variants file.
58
+ *
59
+ * ## Controlled / Uncontrolled
60
+ * Uncontrolled: use defaultOpen (default false). Click trigger to toggle.
61
+ * Controlled: supply open + onOpenChange. Component defers to these values.
62
+ *
63
+ * ## Leaf rows
64
+ * When `items` is empty and no submenu is needed, pass `onSelect` to be notified
65
+ * when the row is clicked/activated. The trigger will not toggle an open state.
66
+ */
67
+ export const ContextMenuDropdown = forwardRef<HTMLDivElement, ContextMenuDropdownProps>(
68
+ function ContextMenuDropdown(
69
+ {
70
+ label = 'Placeholder',
71
+ items = [],
72
+ disabled = false,
73
+ destructive = false,
74
+ leadingIcon,
75
+ onSelect,
76
+ open: controlledOpen,
77
+ defaultOpen = false,
78
+ onOpenChange,
79
+ tag,
80
+ className,
81
+ ...rest
82
+ },
83
+ ref,
84
+ ) {
85
+ /* ── Open state (controlled / uncontrolled) ──────────────────── */
86
+ const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
87
+ const isControlled = controlledOpen !== undefined;
88
+ const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
89
+
90
+ const setOpen = useCallback(
91
+ (next: boolean) => {
92
+ if (!isControlled) setUncontrolledOpen(next);
93
+ onOpenChange?.(next);
94
+ },
95
+ [isControlled, onOpenChange],
96
+ );
97
+
98
+ /* ── Viewport-aware flip state ───────────────────────────────── */
99
+ const [flipX, setFlipX] = useState(false);
100
+ const [flipY, setFlipY] = useState(false);
101
+ const [openBelow, setOpenBelow] = useState(false);
102
+ const [panelReady, setPanelReady] = useState(false);
103
+ const panelRef = useRef<HTMLDivElement>(null);
104
+
105
+ useEffect(() => {
106
+ if (!isOpen) {
107
+ setFlipX(false);
108
+ setFlipY(false);
109
+ setOpenBelow(false);
110
+ setPanelReady(false);
111
+ return;
112
+ }
113
+ /* Measure after paint so the panel has real dimensions */
114
+ const raf = requestAnimationFrame(() => {
115
+ if (!panelRef.current || !rootRef.current) return;
116
+ const panelRect = panelRef.current.getBoundingClientRect();
117
+ const triggerRect = rootRef.current.getBoundingClientRect();
118
+ const vw = window.innerWidth;
119
+ const vh = window.innerHeight;
120
+
121
+ const overflowsRight = panelRect.right > vw;
122
+ /* If flipped left, panel would go from (trigger.left - panelWidth) to trigger.left */
123
+ const wouldOverflowLeft = triggerRect.left - panelRect.width < 0;
124
+
125
+ /* No room on either side → stack below the trigger row */
126
+ const below = overflowsRight && wouldOverflowLeft;
127
+ setOpenBelow(below);
128
+ setFlipX(overflowsRight && !wouldOverflowLeft);
129
+ setFlipY(!below && panelRect.bottom > vh);
130
+ setPanelReady(true);
131
+ });
132
+ return () => cancelAnimationFrame(raf);
133
+ }, [isOpen]);
134
+
135
+ /* ── Click-outside closes the panel ─────────────────────────── */
136
+ const rootRef = useRef<HTMLDivElement>(null);
137
+
138
+ useEffect(() => {
139
+ if (!isOpen) return;
140
+
141
+ const handleOutside = (e: MouseEvent) => {
142
+ if (rootRef.current && !rootRef.current.contains(e.target as Node)) {
143
+ setOpen(false);
144
+ }
145
+ };
146
+
147
+ document.addEventListener('mousedown', handleOutside);
148
+ return () => document.removeEventListener('mousedown', handleOutside);
149
+ }, [isOpen, setOpen]);
150
+
151
+ /* Merge forwarded ref with internal rootRef */
152
+ const setRefs = useCallback(
153
+ (node: HTMLDivElement | null) => {
154
+ (rootRef as React.MutableRefObject<HTMLDivElement | null>).current = node;
155
+ if (typeof ref === 'function') ref(node);
156
+ else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;
157
+ },
158
+ [ref],
159
+ );
160
+
161
+ /* Leaf row: has no sub-items */
162
+ const isLeaf = items.length === 0;
163
+
164
+ /* ── Trigger interaction ─────────────────────────────────────── */
165
+ const handleTriggerClick = useCallback(() => {
166
+ if (disabled) return;
167
+ if (isLeaf) {
168
+ /* Leaf row — fire onSelect and do not toggle any panel */
169
+ onSelect?.();
170
+ } else {
171
+ setOpen(!isOpen);
172
+ }
173
+ }, [disabled, isLeaf, isOpen, setOpen, onSelect]);
174
+
175
+ const handleKeyDown = useCallback(
176
+ (e: React.KeyboardEvent) => {
177
+ if (disabled) return;
178
+ if (e.key === 'Enter' || e.key === ' ') {
179
+ e.preventDefault();
180
+ if (isLeaf) {
181
+ onSelect?.();
182
+ } else {
183
+ setOpen(!isOpen);
184
+ }
185
+ }
186
+ if (e.key === 'Escape' && isOpen) {
187
+ e.preventDefault();
188
+ setOpen(false);
189
+ }
190
+ },
191
+ [disabled, isLeaf, isOpen, setOpen, onSelect],
192
+ );
193
+
194
+ /* ── Resolved colours ────────────────────────────────────────── */
195
+ const textColor = disabled
196
+ ? DISABLED_TEXT
197
+ : destructive
198
+ ? DESTRUCTIVE_TEXT
199
+ : DEFAULT_TEXT;
200
+ const iconColor = disabled
201
+ ? DISABLED_ICON_COLOR
202
+ : destructive
203
+ ? DESTRUCTIVE_ICON_COLOR
204
+ : DEFAULT_ICON_COLOR;
205
+
206
+ return (
207
+ /*
208
+ * Root wrapper — `relative` so the absolute panel is anchored here.
209
+ * Width matches the Figma trigger (250px) but can be overridden via className.
210
+ */
211
+ <div
212
+ ref={setRefs}
213
+ data-slot="context-menu-dropdown"
214
+ className={cn('relative w-[250px]', className)}
215
+ {...rest}
216
+ >
217
+ {/* ── Trigger row ────────────────────────────────────────── */}
218
+ {/*
219
+ * Replicates NavItem's two-level structure so we can force the
220
+ * active background (TRIGGER_OPEN_BG) on the inner div when open —
221
+ * something not achievable by passing className to NavItem directly.
222
+ *
223
+ * Outer div: gutter padding only, stays transparent.
224
+ * Inner div: receives hover/active/open background, has rounded corners.
225
+ */}
226
+ <div
227
+ data-slot="trigger"
228
+ role="button"
229
+ aria-haspopup="menu"
230
+ aria-expanded={isOpen}
231
+ aria-disabled={disabled || undefined}
232
+ tabIndex={disabled ? -1 : 0}
233
+ onClick={handleTriggerClick}
234
+ onKeyDown={handleKeyDown}
235
+ className={cn(
236
+ 'flex flex-col w-full px-spacing-sm py-spacing-xxs',
237
+ disabled ? DISABLED_CONTAINER : 'cursor-pointer',
238
+ )}
239
+ >
240
+ <div
241
+ className={cn(
242
+ 'flex items-center gap-spacing-md p-spacing-md rounded-[8px] w-full motion-feedback',
243
+ /* When open: lock to active bg */
244
+ isOpen && !disabled && TRIGGER_OPEN_BG,
245
+ /* When closed + not disabled: allow hover/active/focus CSS */
246
+ !isOpen && !disabled && TRIGGER_HOVER_BG,
247
+ !isOpen && !disabled && TRIGGER_FOCUS_RING,
248
+ )}
249
+ >
250
+ {/* Leading: icon when provided, otherwise 20×20 spacer */}
251
+ {leadingIcon ? (
252
+ <span
253
+ data-slot="leading-icon"
254
+ aria-hidden="true"
255
+ className={cn(
256
+ 'shrink-0 size-icon-md inline-flex items-center justify-center',
257
+ iconColor,
258
+ )}
259
+ >
260
+ {leadingIcon}
261
+ </span>
262
+ ) : (
263
+ /* 20×20 invisible spacer — matches NavItem leadingItem="default" */
264
+ <span data-slot="leading-spacer" aria-hidden="true" className="shrink-0 size-icon-md" />
265
+ )}
266
+
267
+ {/* Label */}
268
+ <span
269
+ data-slot="label"
270
+ className={cn(
271
+ 'flex-1 text-text-sm font-[400] leading-[20px] truncate min-w-0',
272
+ textColor,
273
+ )}
274
+ >
275
+ {label}
276
+ </span>
277
+
278
+ {/* Trailing: keyboard shortcut tag badge OR direction-aware chevron */}
279
+ {tag ? (
280
+ /*
281
+ * Figma "Tag" node 6091:84663:
282
+ * bg white, border border-background-neutral (#d2d6db), radius-6,
283
+ * px-spacing-sm(6px) py-spacing-xs(4px), text-2xs(10px)/14px
284
+ */
285
+ <span
286
+ data-slot="trailing-tag"
287
+ className={cn(TAG_BADGE, textColor)}
288
+ >
289
+ {tag}
290
+ </span>
291
+ ) : !isLeaf ? (
292
+ /* Chevron only shown when row has sub-items */
293
+ <span
294
+ data-slot="trailing-icon"
295
+ className={cn(
296
+ 'shrink-0 size-icon-md inline-flex items-center justify-center',
297
+ 'rtl:-scale-x-100',
298
+ iconColor,
299
+ )}
300
+ >
301
+ <ChevronRightIcon />
302
+ </span>
303
+ ) : null}
304
+ </div>
305
+ </div>
306
+
307
+ {/* ── Dropdown panel ─────────────────────────────────────── */}
308
+ {/*
309
+ * Absolutely positioned to the inline-end (logical-start of the next column).
310
+ *
311
+ * `start-full` = inset-inline-start: 100%
312
+ * LTR → left: 100% (panel appears to the RIGHT of trigger)
313
+ * RTL → right: 100% (panel appears to the LEFT of trigger)
314
+ *
315
+ * `top-[-4px]` matches the Figma's top-[-4px] offset so the panel top
316
+ * slightly overlaps the trigger's top gutter.
317
+ *
318
+ * `z-50` ensures it floats above surrounding content.
319
+ */}
320
+ {isOpen && (
321
+ <div
322
+ ref={panelRef}
323
+ data-slot="panel"
324
+ data-motion="scale-in"
325
+ role="menu"
326
+ aria-label={label}
327
+ className={cn(
328
+ 'absolute z-50',
329
+ openBelow
330
+ ? 'top-full start-0 mt-1'
331
+ : cn(
332
+ flipY ? 'bottom-[-4px]' : 'top-[-4px]',
333
+ flipX ? 'end-full' : 'start-full',
334
+ ),
335
+ 'py-spacing-xs w-[250px]',
336
+ 'rounded-[8px]',
337
+ PANEL_BG,
338
+ PANEL_SHADOW,
339
+ /* Hide until position is resolved to avoid a visible jump */
340
+ !panelReady && 'opacity-0 pointer-events-none',
341
+ )}
342
+ >
343
+ {items.map((item, index) => (
344
+ <NavItem
345
+ key={index}
346
+ role="menuitem"
347
+ label={item.label}
348
+ disabled={item.disabled}
349
+ onClick={item.onClick}
350
+ leadingItem={item.leadingIcon ? 'icon' : 'default'}
351
+ leadingIcon={item.leadingIcon}
352
+ trailingIcon={false}
353
+ /*
354
+ * Destructive sub-items use error text/icon color.
355
+ * NavItem doesn't have a destructive prop, so we apply
356
+ * the color via className override.
357
+ */
358
+ className={
359
+ item.destructive && !item.disabled
360
+ ? '[&_[data-slot=label]]:text-[rgba(220,38,38,1)] dark:[&_[data-slot=label]]:text-[rgba(248,113,113,1)] [&_[data-slot=leading-icon]]:text-[rgba(220,38,38,1)] dark:[&_[data-slot=leading-icon]]:text-[rgba(248,113,113,1)]'
361
+ : undefined
362
+ }
363
+ />
364
+ ))}
365
+ </div>
366
+ )}
367
+ </div>
368
+ );
369
+ },
370
+ );