@pantheon-systems/pds-toolkit-react 2.0.0-alpha.3 → 2.0.0-alpha.30

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 (476) hide show
  1. package/README.md +3 -3
  2. package/dist/components/Avatar/Avatar.d.ts +6 -2
  3. package/dist/components/ComparisonList/ComparisonList.d.ts +10 -1
  4. package/dist/components/Dropdown/Dropdown.d.ts +140 -0
  5. package/dist/components/Dropdown/DropdownSelectedIcon.d.ts +7 -0
  6. package/dist/components/FileDiff/FileDiff.d.ts +2 -2
  7. package/dist/components/IdentityBlock/IdentityBlock.d.ts +37 -0
  8. package/dist/components/Popover/Popover.d.ts +5 -1
  9. package/dist/components/SiteDashboardHeading/SiteDashboardHeading.d.ts +1 -1
  10. package/dist/components/SiteFooter/SiteFooter.d.ts +38 -0
  11. package/dist/components/SortableList/SortableList.d.ts +8 -0
  12. package/dist/components/SortableList/SortableListHeader.d.ts +7 -0
  13. package/dist/components/SortableList/SortableRow.d.ts +16 -0
  14. package/dist/components/SortableList/sortable-utils.d.ts +19 -0
  15. package/dist/components/SortableList/types.d.ts +142 -0
  16. package/dist/components/SortableList/useSortableTree.d.ts +18 -0
  17. package/dist/components/{RefreshChecker/RefreshChecker.d.ts → StatusChecker/StatusChecker.d.ts} +5 -19
  18. package/dist/components/StatusIndicator/StatusIndicator.d.ts +2 -2
  19. package/dist/components/Table/Table.d.ts +141 -17
  20. package/dist/components/TableOfContents/TableOfContents.d.ts +1 -5
  21. package/dist/components/Tabs/Tabs.d.ts +6 -1
  22. package/dist/components/Tag/Tag.d.ts +13 -2
  23. package/dist/components/ThemeSwitcher/ThemeSwitcher.d.ts +14 -8
  24. package/dist/components/Tooltip/Tooltip.d.ts +7 -3
  25. package/dist/components/UtilityBar/UtilityBar.d.ts +27 -0
  26. package/dist/components/badges/Badge/Badge.d.ts +28 -0
  27. package/dist/components/buttons/CloseButton/CloseButton.d.ts +2 -2
  28. package/dist/components/buttons/IconButton/IconButton.d.ts +12 -0
  29. package/dist/components/buttons/MenuButton/MenuButton.d.ts +2 -7
  30. package/dist/components/cards/Card/Card.d.ts +1 -1
  31. package/dist/components/cards/NewSiteCard/NewSiteCard.d.ts +1 -1
  32. package/dist/components/cards/PricingCard/PricingCard.d.ts +6 -1
  33. package/dist/components/charts/BarChart/BarChart.d.ts +21 -0
  34. package/dist/components/charts/LineChart/LineChart.d.ts +22 -0
  35. package/dist/components/charts/shared/ChartAccessibleTable.d.ts +17 -0
  36. package/dist/components/charts/shared/ChartLegend.d.ts +25 -0
  37. package/dist/components/charts/shared/ChartSkeleton.d.ts +7 -0
  38. package/dist/components/charts/shared/chart-colors.d.ts +30 -0
  39. package/dist/components/charts/shared/chart-styles.d.ts +16 -0
  40. package/dist/components/charts/shared/formatters.d.ts +12 -0
  41. package/dist/components/charts/shared/types.d.ts +128 -0
  42. package/dist/components/empty-states/HorizontalEmptyState/HorizontalEmptyState.d.ts +1 -1
  43. package/dist/components/icons/Icon/Icon.d.ts +11 -731
  44. package/dist/components/icons/Icon/IconSearch.d.ts +1 -0
  45. package/dist/components/icons/Icon/custom-icons.d.ts +46 -0
  46. package/dist/components/icons/Icon/generated-icon-data.d.ts +1499 -0
  47. package/dist/components/icons/Icon/icon-registry.d.ts +34 -0
  48. package/dist/components/icons/PaymentIcon/PaymentIcon.d.ts +7 -3
  49. package/dist/components/icons/PlatformIcon/PlatformIcon.d.ts +6 -6
  50. package/dist/components/inputs/Checkbox/Checkbox.d.ts +3 -3
  51. package/dist/components/inputs/Combobox/Combobox.d.ts +17 -7
  52. package/dist/components/inputs/ComboboxMultiselect/ComboboxMultiselect.d.ts +33 -6
  53. package/dist/components/inputs/Datepicker/Datepicker.d.ts +16 -2
  54. package/dist/components/inputs/FileUpload/FileUpload.d.ts +6 -1
  55. package/dist/components/inputs/RadioGroup/RadioGroup.d.ts +1 -1
  56. package/dist/components/inputs/Select/Select.d.ts +11 -2
  57. package/dist/components/inputs/Select/select-sample-data.d.ts +1 -0
  58. package/dist/components/inputs/Switch/Switch.d.ts +1 -17
  59. package/dist/components/inputs/TagsInput/TagsInput.d.ts +105 -0
  60. package/dist/components/inputs/TextInput/TextInput.d.ts +5 -1
  61. package/dist/components/inputs/Textarea/Textarea.d.ts +5 -1
  62. package/dist/components/inputs/input-utilities.d.ts +5 -4
  63. package/dist/components/{CTALink → links/CTALink}/CTALink.d.ts +1 -1
  64. package/dist/components/{LinkNewWindow → links/LinkNewWindow}/LinkNewWindow.d.ts +1 -1
  65. package/dist/components/navigation/DropdownMenu/DropdownMenu.d.ts +1 -0
  66. package/dist/components/navigation/Navbar/Navbar.d.ts +1 -1
  67. package/dist/components/navigation/SideNavGlobal/SideNavGlobal.d.ts +5 -15
  68. package/dist/components/navigation/SideNavGlobal/SideNavGlobalItem.d.ts +5 -1
  69. package/dist/components/navigation/{NavMenu/NavMenu.d.ts → SiteMenu/SiteMenu.d.ts} +5 -8
  70. package/dist/components/navigation/SiteMenu/SiteMenuDropdown.d.ts +23 -0
  71. package/dist/components/navigation/TabMenu/TabMenu.d.ts +6 -1
  72. package/dist/components/navigation/UserMenu/UserMenu.d.ts +1 -5
  73. package/dist/components/navigation/WorkspaceSelector/WorkspaceSelector.d.ts +8 -12
  74. package/dist/components/notifications/Banner/Banner.d.ts +32 -12
  75. package/dist/components/notifications/NotificationsPopover/NotificationsPopover.d.ts +2 -7
  76. package/dist/components/notifications/SectionMessage/SectionMessage.d.ts +6 -2
  77. package/dist/components/notifications/Toaster/Toast.d.ts +13 -2
  78. package/dist/components/notifications/Toaster/Toaster.d.ts +16 -7
  79. package/dist/components/notifications/Toaster/useToast.d.ts +2 -0
  80. package/dist/components/overlays/Drawer/Drawer.d.ts +58 -0
  81. package/dist/components/overlays/FullScreenOverlay/FullScreenOverlay.d.ts +45 -0
  82. package/dist/components/{Modal → overlays/Modal}/Modal.d.ts +1 -1
  83. package/dist/components/{Pagination → pagination/Pagination}/Pagination.d.ts +7 -2
  84. package/dist/components/pagination/PaginationCompact/PaginationCompact.d.ts +49 -0
  85. package/dist/components/pagination/PaginationMini/PaginationMini.d.ts +55 -0
  86. package/dist/components/panels/ExpansionPanel/ExpansionPanel.d.ts +6 -3
  87. package/dist/components/panels/ExpansionPanelGroup/ExpansionPanelGroup.d.ts +1 -2
  88. package/dist/components/panels/Panel/Panel.d.ts +1 -18
  89. package/dist/components/panels/PanelList/PanelList.d.ts +1 -1
  90. package/dist/components/progress-indicators/ProgressBar/ProgressBar.d.ts +3 -4
  91. package/dist/components/progress-indicators/ProgressRing/ProgressRing.d.ts +2 -3
  92. package/dist/components/{FlowSteps/FlowSteps.d.ts → steppers/StepList/StepList.d.ts} +7 -7
  93. package/dist/css/component-css/pds-avatar.css +1 -1
  94. package/dist/css/component-css/pds-badge.css +1 -0
  95. package/dist/css/component-css/pds-banner.css +1 -1
  96. package/dist/css/component-css/pds-bar-chart.css +1 -0
  97. package/dist/css/component-css/pds-branch-diff.css +1 -1
  98. package/dist/css/component-css/pds-breadcrumb.css +1 -1
  99. package/dist/css/component-css/pds-button-link.css +1 -1
  100. package/dist/css/component-css/pds-button-nav.css +1 -1
  101. package/dist/css/component-css/pds-button.css +9 -3
  102. package/dist/css/component-css/pds-callout.css +1 -1
  103. package/dist/css/component-css/pds-card-select-group.css +1 -1
  104. package/dist/css/component-css/pds-card.css +1 -1
  105. package/dist/css/component-css/pds-chart-legend.css +1 -0
  106. package/dist/css/component-css/pds-chart-wrapper.css +1 -0
  107. package/dist/css/component-css/pds-checkbox.css +1 -1
  108. package/dist/css/component-css/pds-close-button.css +1 -1
  109. package/dist/css/component-css/pds-combobox-multiselect.css +4 -2
  110. package/dist/css/component-css/pds-combobox.css +1 -1
  111. package/dist/css/component-css/pds-compact-empty-state.css +1 -1
  112. package/dist/css/component-css/pds-comparison-list.css +1 -1
  113. package/dist/css/component-css/pds-cta-link.css +1 -1
  114. package/dist/css/component-css/pds-dashboard-search.css +1 -1
  115. package/dist/css/component-css/pds-datepicker.css +1 -1
  116. package/dist/css/component-css/pds-drawer.css +1 -0
  117. package/dist/css/component-css/pds-dropdown-menu.css +2 -2
  118. package/dist/css/component-css/pds-dropdown.css +2 -0
  119. package/dist/css/component-css/pds-empty-state-card.css +1 -1
  120. package/dist/css/component-css/pds-expansion-panel.css +1 -1
  121. package/dist/css/component-css/pds-file-diff.css +1 -1
  122. package/dist/css/component-css/pds-file-upload.css +2 -2
  123. package/dist/css/component-css/pds-full-screen-overlay.css +1 -0
  124. package/dist/css/component-css/pds-horizontal-empty-state.css +1 -1
  125. package/dist/css/component-css/pds-icon-button.css +4 -4
  126. package/dist/css/component-css/pds-icon-story-only.css +1 -1
  127. package/dist/css/component-css/pds-icon.css +1 -0
  128. package/dist/css/component-css/pds-identity-block.css +1 -0
  129. package/dist/css/component-css/pds-index.css +103 -57
  130. package/dist/css/component-css/pds-inline-message.css +1 -1
  131. package/dist/css/component-css/pds-input-group.css +1 -1
  132. package/dist/css/component-css/pds-input-utilities.css +1 -1
  133. package/dist/css/component-css/pds-line-chart.css +1 -0
  134. package/dist/css/component-css/pds-link-new-window.css +1 -1
  135. package/dist/css/component-css/pds-menu-button.css +4 -1
  136. package/dist/css/component-css/pds-modal.css +1 -1
  137. package/dist/css/component-css/pds-nav-menu.css +2 -2
  138. package/dist/css/component-css/pds-navbar.css +4 -1
  139. package/dist/css/component-css/pds-new-site-card.css +1 -1
  140. package/dist/css/component-css/pds-notification-hub-icon.css +1 -1
  141. package/dist/css/component-css/pds-notifications-popover.css +13 -1
  142. package/dist/css/component-css/pds-pagination-compact.css +1 -0
  143. package/dist/css/component-css/pds-pagination-mini.css +3 -0
  144. package/dist/css/component-css/pds-pagination.css +1 -1
  145. package/dist/css/component-css/pds-panel-list.css +1 -1
  146. package/dist/css/component-css/pds-panel.css +1 -1
  147. package/dist/css/component-css/pds-pantheon-logo.css +1 -1
  148. package/dist/css/component-css/pds-payment-card.css +1 -1
  149. package/dist/css/component-css/pds-payment-icon.css +1 -1
  150. package/dist/css/component-css/pds-platform-icon.css +1 -1
  151. package/dist/css/component-css/pds-popover.css +1 -1
  152. package/dist/css/component-css/pds-pricing-card.css +1 -1
  153. package/dist/css/component-css/pds-progress-bar.css +1 -1
  154. package/dist/css/component-css/pds-progress-ring.css +1 -1
  155. package/dist/css/component-css/pds-radio-group.css +1 -1
  156. package/dist/css/component-css/pds-section-message.css +1 -1
  157. package/dist/css/component-css/pds-segmented-button.css +1 -1
  158. package/dist/css/component-css/pds-select.css +1 -1
  159. package/dist/css/component-css/pds-side-nav-compact.css +1 -1
  160. package/dist/css/component-css/pds-side-nav-global.css +6 -4
  161. package/dist/css/component-css/pds-side-nav.css +1 -1
  162. package/dist/css/component-css/pds-site-card.css +1 -1
  163. package/dist/css/component-css/pds-site-footer.css +1 -1
  164. package/dist/css/component-css/pds-skiplink.css +1 -1
  165. package/dist/css/component-css/pds-sortable-list.css +8 -0
  166. package/dist/css/component-css/pds-spinner.css +1 -1
  167. package/dist/css/component-css/pds-sso-button.css +1 -1
  168. package/dist/css/component-css/pds-status-badge.css +1 -1
  169. package/dist/css/component-css/pds-status-checker.css +1 -0
  170. package/dist/css/component-css/pds-status-indicator.css +1 -1
  171. package/dist/css/component-css/pds-step-list.css +1 -0
  172. package/dist/css/component-css/pds-stepper.css +1 -1
  173. package/dist/css/component-css/pds-switch.css +4 -11
  174. package/dist/css/component-css/pds-tab-menu.css +2 -2
  175. package/dist/css/component-css/pds-table-of-contents.css +1 -1
  176. package/dist/css/component-css/pds-table.css +1 -1
  177. package/dist/css/component-css/pds-tabs.css +1 -1
  178. package/dist/css/component-css/pds-tag.css +1 -1
  179. package/dist/css/component-css/pds-tags-input.css +1 -0
  180. package/dist/css/component-css/pds-text-input.css +1 -1
  181. package/dist/css/component-css/pds-textarea.css +1 -1
  182. package/dist/css/component-css/pds-theme-switcher.css +1 -1
  183. package/dist/css/component-css/pds-toaster.css +1 -1
  184. package/dist/css/component-css/pds-tooltip.css +1 -1
  185. package/dist/css/component-css/pds-user-menu.css +29 -1
  186. package/dist/css/component-css/pds-utility-bar.css +1 -0
  187. package/dist/css/component-css/pds-utility-button.css +1 -1
  188. package/dist/css/component-css/pds-vertical-empty-state.css +1 -1
  189. package/dist/css/component-css/pds-vertical-stepper.css +1 -1
  190. package/dist/css/component-css/pds-workspace-selector.css +16 -1
  191. package/dist/css/design-tokens/fonts.css +1 -1
  192. package/dist/css/design-tokens/variables.dark.css +301 -96
  193. package/dist/css/design-tokens/variables.global.css +9 -12
  194. package/dist/css/design-tokens/variables.light.css +276 -93
  195. package/dist/css/design-tokens/variables.typography.css +9 -6
  196. package/dist/css/layout-css/pds-app-layout.css +3 -0
  197. package/dist/css/layout-css/pds-docs-layout.css +1 -0
  198. package/dist/css/layout-css/pds-index.css +3 -0
  199. package/dist/css/layout-css/pds-sidebar-layout.css +5 -0
  200. package/dist/css/layout-css/pds-stepper-layout.css +1 -0
  201. package/dist/css/layout-css/pds-three-item-layout.css +1 -0
  202. package/dist/css/layout-css/pds-two-item-layout.css +1 -0
  203. package/dist/css/pds-components.css +103 -57
  204. package/dist/css/pds-core.css +3 -2
  205. package/dist/css/pds-layouts.css +3 -9
  206. package/dist/index.css +1 -1
  207. package/dist/index.d.ts +91 -6
  208. package/dist/index.js +12277 -1964
  209. package/dist/index.js.map +1 -1
  210. package/dist/index.source.d.ts +31 -29
  211. package/dist/layouts/AppLayout/AppLayout.d.ts +47 -6
  212. package/dist/layouts/DocsLayout/DocsLayout.d.ts +9 -7
  213. package/dist/layouts/SidebarLayout/SidebarLayout.d.ts +12 -3
  214. package/dist/libs/components/NavAccordion/NavAccordion.d.ts +27 -0
  215. package/dist/libs/components/utils.d.ts +0 -1
  216. package/dist/libs/types/custom-types.d.ts +10 -2
  217. package/dist/libs/types/navigation-types.d.ts +9 -1
  218. package/dist/svg/angleDown.svg +3 -0
  219. package/dist/svg/angleLeft.svg +3 -0
  220. package/dist/svg/angleRight.svg +3 -0
  221. package/dist/svg/angleUp.svg +3 -0
  222. package/dist/svg/anglesLeft.svg +3 -0
  223. package/dist/svg/anglesRight.svg +3 -0
  224. package/dist/svg/arrowDownLeftAndArrowUpRightToCenter.svg +3 -0
  225. package/dist/svg/arrowDownToLine.svg +3 -0
  226. package/dist/svg/arrowLeft.svg +3 -0
  227. package/dist/svg/arrowRight.svg +3 -0
  228. package/dist/svg/arrowsRetweet.svg +3 -0
  229. package/dist/svg/arrowsUpDownLeftRight.svg +3 -0
  230. package/dist/svg/asterisk.svg +3 -0
  231. package/dist/svg/banBug.svg +3 -0
  232. package/dist/svg/bars.svg +3 -0
  233. package/dist/svg/barsFilter.svg +3 -0
  234. package/dist/svg/barsStaggered.svg +3 -0
  235. package/dist/svg/bell.svg +3 -0
  236. package/dist/svg/billboard.svg +3 -0
  237. package/dist/svg/bitbucket.svg +3 -0
  238. package/dist/svg/bluesky.svg +3 -0
  239. package/dist/svg/bolt.svg +3 -0
  240. package/dist/svg/boltPantheon.svg +3 -0
  241. package/dist/svg/boltSolid.svg +3 -0
  242. package/dist/svg/book.svg +3 -0
  243. package/dist/svg/books.svg +3 -0
  244. package/dist/svg/bracketRight.svg +3 -0
  245. package/dist/svg/bracketsSquare.svg +3 -0
  246. package/dist/svg/brainCircuit.svg +3 -0
  247. package/dist/svg/broomWide.svg +3 -0
  248. package/dist/svg/building.svg +3 -0
  249. package/dist/svg/buildings.svg +3 -0
  250. package/dist/svg/bullhorn.svg +3 -0
  251. package/dist/svg/calendarDays.svg +3 -0
  252. package/dist/svg/caretDown.svg +3 -0
  253. package/dist/svg/caretLeft.svg +3 -0
  254. package/dist/svg/caretRight.svg +3 -0
  255. package/dist/svg/caretUp.svg +3 -0
  256. package/dist/svg/ccAmex.svg +3 -0
  257. package/dist/svg/ccApplePay.svg +3 -0
  258. package/dist/svg/ccDiscover.svg +3 -0
  259. package/dist/svg/ccGeneric.svg +3 -0
  260. package/dist/svg/ccMC.svg +3 -0
  261. package/dist/svg/ccPaypal.svg +3 -0
  262. package/dist/svg/ccVisa.svg +3 -0
  263. package/dist/svg/chartLine.svg +3 -0
  264. package/dist/svg/chartNetwork.svg +3 -0
  265. package/dist/svg/chartSimple.svg +3 -0
  266. package/dist/svg/check.svg +3 -0
  267. package/dist/svg/circle.svg +3 -0
  268. package/dist/svg/circleCheck.svg +3 -0
  269. package/dist/svg/circleExclamation.svg +3 -0
  270. package/dist/svg/circleExclamationSolid.svg +3 -0
  271. package/dist/svg/circleInfo.svg +3 -0
  272. package/dist/svg/circleInfoSolid.svg +3 -0
  273. package/dist/svg/circleMinus.svg +3 -0
  274. package/dist/svg/circleNotch.svg +3 -0
  275. package/dist/svg/circlePlus.svg +3 -0
  276. package/dist/svg/circleQuestion.svg +3 -0
  277. package/dist/svg/circleQuestionSolid.svg +3 -0
  278. package/dist/svg/circleUser.svg +3 -0
  279. package/dist/svg/circleXmark.svg +3 -0
  280. package/dist/svg/cloud.svg +3 -0
  281. package/dist/svg/cloudArrowDown.svg +3 -0
  282. package/dist/svg/cloudArrowUp.svg +3 -0
  283. package/dist/svg/cloudPlus.svg +3 -0
  284. package/dist/svg/code.svg +3 -0
  285. package/dist/svg/codeBranch.svg +3 -0
  286. package/dist/svg/codeMerge.svg +3 -0
  287. package/dist/svg/command.svg +3 -0
  288. package/dist/svg/comment.svg +3 -0
  289. package/dist/svg/compress.svg +3 -0
  290. package/dist/svg/copy.svg +3 -0
  291. package/dist/svg/desktop.svg +3 -0
  292. package/dist/svg/diamondExclamation.svg +3 -0
  293. package/dist/svg/diamonds4.svg +3 -0
  294. package/dist/svg/discourse.svg +3 -0
  295. package/dist/svg/display.svg +3 -0
  296. package/dist/svg/dollarSign.svg +3 -0
  297. package/dist/svg/download.svg +3 -0
  298. package/dist/svg/drupal.svg +3 -0
  299. package/dist/svg/ellipsis.svg +3 -0
  300. package/dist/svg/ellipsisVertical.svg +3 -0
  301. package/dist/svg/emptySet.svg +3 -0
  302. package/dist/svg/envelope.svg +3 -0
  303. package/dist/svg/envelopeOpen.svg +3 -0
  304. package/dist/svg/exclamation.svg +3 -0
  305. package/dist/svg/expand.svg +3 -0
  306. package/dist/svg/expandFromCenter.svg +3 -0
  307. package/dist/svg/externalLink.svg +3 -0
  308. package/dist/svg/eye.svg +3 -0
  309. package/dist/svg/eyeSlash.svg +3 -0
  310. package/dist/svg/facebook.svg +3 -0
  311. package/dist/svg/file.svg +3 -0
  312. package/dist/svg/fileCSV.svg +3 -0
  313. package/dist/svg/fileCheck.svg +3 -0
  314. package/dist/svg/fileContract.svg +3 -0
  315. package/dist/svg/fileDiff.svg +3 -0
  316. package/dist/svg/fileExport.svg +3 -0
  317. package/dist/svg/fileImport.svg +3 -0
  318. package/dist/svg/fileLines.svg +3 -0
  319. package/dist/svg/filePDF.svg +3 -0
  320. package/dist/svg/fileZip.svg +3 -0
  321. package/dist/svg/folder.svg +3 -0
  322. package/dist/svg/folderTree.svg +3 -0
  323. package/dist/svg/gear.svg +3 -0
  324. package/dist/svg/gem.svg +3 -0
  325. package/dist/svg/github.svg +3 -0
  326. package/dist/svg/gitlab.svg +3 -0
  327. package/dist/svg/globe.svg +3 -0
  328. package/dist/svg/graduationCap.svg +3 -0
  329. package/dist/svg/grid.svg +3 -0
  330. package/dist/svg/gripDots.svg +3 -0
  331. package/dist/svg/gripDotsVertical.svg +3 -0
  332. package/dist/svg/heart.svg +3 -0
  333. package/dist/svg/heartSolid.svg +3 -0
  334. package/dist/svg/house.svg +3 -0
  335. package/dist/svg/idCard.svg +3 -0
  336. package/dist/svg/image.svg +3 -0
  337. package/dist/svg/inputText.svg +3 -0
  338. package/dist/svg/instagram.svg +3 -0
  339. package/dist/svg/keySkeleton.svg +3 -0
  340. package/dist/svg/landmark.svg +3 -0
  341. package/dist/svg/laptop.svg +3 -0
  342. package/dist/svg/laptopCode.svg +3 -0
  343. package/dist/svg/leaf.svg +3 -0
  344. package/dist/svg/lifeRing.svg +3 -0
  345. package/dist/svg/linkSimple.svg +3 -0
  346. package/dist/svg/linkSimpleSlash.svg +3 -0
  347. package/dist/svg/linkedin.svg +3 -0
  348. package/dist/svg/listCheck.svg +3 -0
  349. package/dist/svg/locationCrosshairs.svg +3 -0
  350. package/dist/svg/lock.svg +3 -0
  351. package/dist/svg/lockOpen.svg +3 -0
  352. package/dist/svg/magnifyingGlass.svg +3 -0
  353. package/dist/svg/medal.svg +3 -0
  354. package/dist/svg/memo.svg +3 -0
  355. package/dist/svg/messages.svg +3 -0
  356. package/dist/svg/minus.svg +3 -0
  357. package/dist/svg/moon.svg +3 -0
  358. package/dist/svg/nextJs.svg +3 -0
  359. package/dist/svg/paperPlane.svg +3 -0
  360. package/dist/svg/paperclip.svg +3 -0
  361. package/dist/svg/pause.svg +3 -0
  362. package/dist/svg/pen.svg +3 -0
  363. package/dist/svg/penField.svg +3 -0
  364. package/dist/svg/phone.svg +3 -0
  365. package/dist/svg/play.svg +3 -0
  366. package/dist/svg/plus.svg +3 -0
  367. package/dist/svg/question.svg +3 -0
  368. package/dist/svg/quotesLeft.svg +3 -0
  369. package/dist/svg/quotesRight.svg +3 -0
  370. package/dist/svg/rectangleList.svg +3 -0
  371. package/dist/svg/reply.svg +3 -0
  372. package/dist/svg/robot.svg +3 -0
  373. package/dist/svg/rocketLaunch.svg +3 -0
  374. package/dist/svg/rotate.svg +3 -0
  375. package/dist/svg/rotateClock.svg +3 -0
  376. package/dist/svg/rotateLeft.svg +3 -0
  377. package/dist/svg/rotateRight.svg +3 -0
  378. package/dist/svg/rss.svg +3 -0
  379. package/dist/svg/save.svg +3 -0
  380. package/dist/svg/server.svg +3 -0
  381. package/dist/svg/shareNodes.svg +3 -0
  382. package/dist/svg/shield.svg +3 -0
  383. package/dist/svg/shieldQuartered.svg +3 -0
  384. package/dist/svg/shovel.svg +3 -0
  385. package/dist/svg/sidebar.svg +3 -0
  386. package/dist/svg/siren.svg +3 -0
  387. package/dist/svg/sirenOn.svg +3 -0
  388. package/dist/svg/sitemap.svg +3 -0
  389. package/dist/svg/slack.svg +3 -0
  390. package/dist/svg/slashForward.svg +3 -0
  391. package/dist/svg/slidersSimple.svg +3 -0
  392. package/dist/svg/snowflake.svg +3 -0
  393. package/dist/svg/sparkles.svg +3 -0
  394. package/dist/svg/squareCheck.svg +3 -0
  395. package/dist/svg/squareCode.svg +3 -0
  396. package/dist/svg/squareMinus.svg +3 -0
  397. package/dist/svg/squarePen.svg +3 -0
  398. package/dist/svg/squareQuestion.svg +3 -0
  399. package/dist/svg/squareTerminal.svg +3 -0
  400. package/dist/svg/star.svg +3 -0
  401. package/dist/svg/starSolid.svg +3 -0
  402. package/dist/svg/sun.svg +3 -0
  403. package/dist/svg/sunBright.svg +3 -0
  404. package/dist/svg/table.svg +3 -0
  405. package/dist/svg/tableRows.svg +3 -0
  406. package/dist/svg/terminal.svg +3 -0
  407. package/dist/svg/text.svg +3 -0
  408. package/dist/svg/threads.svg +3 -0
  409. package/dist/svg/thumbsDown.svg +3 -0
  410. package/dist/svg/thumbsUp.svg +3 -0
  411. package/dist/svg/trash.svg +3 -0
  412. package/dist/svg/triangleExclamation.svg +3 -0
  413. package/dist/svg/twitter.svg +3 -0
  414. package/dist/svg/upload.svg +3 -0
  415. package/dist/svg/user.svg +3 -0
  416. package/dist/svg/userAstronaut.svg +3 -0
  417. package/dist/svg/userGear.svg +3 -0
  418. package/dist/svg/userPlus.svg +3 -0
  419. package/dist/svg/users.svg +3 -0
  420. package/dist/svg/video.svg +3 -0
  421. package/dist/svg/wavePulse.svg +3 -0
  422. package/dist/svg/windowRestore.svg +3 -0
  423. package/dist/svg/wordpress.svg +3 -0
  424. package/dist/svg/wreathLaurel.svg +3 -0
  425. package/dist/svg/wrench.svg +3 -0
  426. package/dist/svg/xTwitter.svg +3 -0
  427. package/dist/svg/xmark.svg +3 -0
  428. package/dist/svg/xmarkLarge.svg +3 -0
  429. package/dist/svg/youtube.svg +3 -0
  430. package/dist/{layouts → utilities}/FlexContainer/FlexContainer.d.ts +1 -1
  431. package/dist/utilities/GlobalWrapper/GlobalWrapper.d.ts +21 -0
  432. package/dist/utilities/hooks/useDropdown/index.d.ts +1 -0
  433. package/dist/utilities/hooks/useDropdown/useDropdown.d.ts +121 -0
  434. package/package.json +70 -44
  435. package/tailwind/README.md +220 -0
  436. package/tailwind/TESTING.md +457 -0
  437. package/tailwind/v3/preset.cjs +258 -0
  438. package/tailwind/v4/theme.css +230 -0
  439. package/dist/components/CTASlice/CTASlice.d.ts +0 -43
  440. package/dist/components/DashboardStat/DashboardStat.d.ts +0 -28
  441. package/dist/components/PullQuote/PullQuote.d.ts +0 -34
  442. package/dist/components/SocialLinks/SocialLinks.d.ts +0 -23
  443. package/dist/components/badges/IndicatorBadge/IndicatorBadge.d.ts +0 -27
  444. package/dist/components/footer/FooterHeading/FooterHeading.d.ts +0 -22
  445. package/dist/components/footer/FooterLinks/FooterLinks.d.ts +0 -26
  446. package/dist/components/footer/SiteFooter/SiteFooter.d.ts +0 -30
  447. package/dist/components/footer/SiteFooter/footer-content.d.ts +0 -1
  448. package/dist/components/navigation/DashboardNav/DashboardNav.d.ts +0 -35
  449. package/dist/components/navigation/DashboardNav/DashboardNavItem.d.ts +0 -24
  450. package/dist/components/navigation/NavMenu/NavMenuDropdown.d.ts +0 -24
  451. package/dist/components/tiles/AvatarTileList/AvatarTileList.d.ts +0 -28
  452. package/dist/components/tiles/Tile/Tile.d.ts +0 -42
  453. package/dist/components/tiles/TileGrid/TileGrid.d.ts +0 -29
  454. package/dist/css/component-css/pds-avatar-tile-list.css +0 -1
  455. package/dist/css/component-css/pds-cta-slice.css +0 -1
  456. package/dist/css/component-css/pds-dashboard-nav.css +0 -5
  457. package/dist/css/component-css/pds-dashboard-stat.css +0 -1
  458. package/dist/css/component-css/pds-flow-steps.css +0 -1
  459. package/dist/css/component-css/pds-footer-heading.css +0 -1
  460. package/dist/css/component-css/pds-footer-links.css +0 -1
  461. package/dist/css/component-css/pds-indicator-badge.css +0 -25
  462. package/dist/css/component-css/pds-pull-quote.css +0 -1
  463. package/dist/css/component-css/pds-refresh-checker.css +0 -1
  464. package/dist/css/component-css/pds-social-links.css +0 -1
  465. package/dist/css/component-css/pds-tile.css +0 -1
  466. package/dist/css/component-css/pds-tiles-common.css +0 -1
  467. package/dist/layouts/DashboardGlobal/DashboardGlobal.d.ts +0 -57
  468. package/dist/layouts/DashboardInner/DashboardInner.d.ts +0 -30
  469. package/dist/layouts/GlobalWrapper/GlobalWrapper.d.ts +0 -19
  470. package/dist/utilities/context-providers/ResponsiveContext/ResponsiveContext.d.ts +0 -6
  471. /package/dist/components/{Skiplink → links/Skiplink}/Skiplink.d.ts +0 -0
  472. /package/dist/components/{Picture → media/Picture}/Picture.d.ts +0 -0
  473. /package/dist/components/{VideoEmbed → media/VideoEmbed}/VideoEmbed.d.ts +0 -0
  474. /package/dist/components/{Pagination → pagination/Pagination}/usePagination.d.ts +0 -0
  475. /package/dist/components/{FlowSteps → steppers/StepList}/example-steps.d.ts +0 -0
  476. /package/dist/{layouts → utilities}/Container/Container.d.ts +0 -0
@@ -0,0 +1,258 @@
1
+ /**
2
+ * PDS Tailwind v3 Preset
3
+ *
4
+ * Maps Pantheon Design System tokens to Tailwind CSS v3 utilities.
5
+ * Use as a preset in tailwind.config.js — replaces Tailwind's default
6
+ * color, spacing, and typography scales with PDS values.
7
+ *
8
+ * Requirements:
9
+ * - pds-core.css must be loaded globally (provides --pds-* CSS variables)
10
+ * - Tailwind v3.x
11
+ *
12
+ * Usage:
13
+ * // tailwind.config.js
14
+ * module.exports = {
15
+ * presets: [require('@pantheon-systems/pds-toolkit-react/tailwind/v3/preset')],
16
+ * content: ['./src/**\/*.{js,ts,jsx,tsx}'],
17
+ * };
18
+ */
19
+
20
+ const plugin = require('tailwindcss/plugin');
21
+
22
+ /** @type {import('tailwindcss').Config} */
23
+ module.exports = {
24
+ corePlugins: {
25
+ // Disable Tailwind's CSS reset — PDS provides its own base styles.
26
+ // Enabling preflight alongside PDS will cause style conflicts.
27
+ preflight: false,
28
+ },
29
+ plugins: [
30
+ // Reset border-style to none so borders are fully opt-in.
31
+ // Without this, any element that picks up a non-zero border-width
32
+ // (from PDS components, inheritance, or browser defaults) gets a
33
+ // visible border even without explicit border classes.
34
+ // Always include border-solid (or border-dashed, etc.) when adding borders.
35
+ plugin(function ({ addBase }) {
36
+ addBase({
37
+ '*, ::before, ::after': {
38
+ borderWidth: '0',
39
+ borderStyle: 'none',
40
+ borderColor: 'var(--pds-color-border-default)',
41
+ },
42
+ });
43
+ }),
44
+ ],
45
+ theme: {
46
+ // ─── Colors ──────────────────────────────────────────────────────────────
47
+ // All values reference PDS CSS custom properties so dark mode and token
48
+ // updates are reflected automatically. Requires pds-core.css to be loaded.
49
+ //
50
+ // Note: opacity modifiers (e.g. bg-bg-default/50) are not supported with
51
+ // CSS variable color references.
52
+ colors: {
53
+ // Backgrounds — use as bg-bg-default, bg-bg-secondary, bg-bg-reverse
54
+ bg: {
55
+ default: 'var(--pds-color-bg-default)',
56
+ secondary: 'var(--pds-color-bg-default-secondary)',
57
+ reverse: 'var(--pds-color-bg-reverse)',
58
+ },
59
+ // General foregrounds (icons, decorative elements)
60
+ fg: {
61
+ default: 'var(--pds-color-fg-default)',
62
+ secondary: 'var(--pds-color-fg-default-secondary)',
63
+ reverse: 'var(--pds-color-fg-reverse)',
64
+ },
65
+ // Borders — use as border-border-default, border-border-input, etc.
66
+ border: {
67
+ default: 'var(--pds-color-border-default)',
68
+ input: 'var(--pds-color-border-input)',
69
+ separator: 'var(--pds-color-border-separator)',
70
+ brand: 'var(--pds-color-border-brand)',
71
+ },
72
+ // Interactive elements (links, focus rings)
73
+ interactive: {
74
+ focus: 'var(--pds-color-interactive-focus)',
75
+ 'bg-hover': 'var(--pds-color-interactive-background-hover)',
76
+ 'bg-active': 'var(--pds-color-interactive-background-active)',
77
+ link: 'var(--pds-color-interactive-link-default)',
78
+ 'link-hover': 'var(--pds-color-interactive-link-hover)',
79
+ 'link-active': 'var(--pds-color-interactive-link-active)',
80
+ 'link-visited': 'var(--pds-color-interactive-link-visited)',
81
+ 'reverse-focus': 'var(--pds-color-interactive-reverse-focus)',
82
+ 'reverse-link': 'var(--pds-color-interactive-reverse-link-default)',
83
+ 'reverse-link-hover': 'var(--pds-color-interactive-reverse-link-hover)',
84
+ 'reverse-link-active':
85
+ 'var(--pds-color-interactive-reverse-link-active)',
86
+ 'reverse-link-visited':
87
+ 'var(--pds-color-interactive-reverse-link-visited)',
88
+ },
89
+ // Status colors — background/foreground/border/dot per status type
90
+ status: {
91
+ info: {
92
+ background: 'var(--pds-color-status-info-background)',
93
+ foreground: 'var(--pds-color-status-info-foreground)',
94
+ border: 'var(--pds-color-status-info-border)',
95
+ dot: 'var(--pds-color-status-info-dot)',
96
+ },
97
+ success: {
98
+ background: 'var(--pds-color-status-success-background)',
99
+ foreground: 'var(--pds-color-status-success-foreground)',
100
+ border: 'var(--pds-color-status-success-border)',
101
+ dot: 'var(--pds-color-status-success-dot)',
102
+ },
103
+ warning: {
104
+ background: 'var(--pds-color-status-warning-background)',
105
+ foreground: 'var(--pds-color-status-warning-foreground)',
106
+ border: 'var(--pds-color-status-warning-border)',
107
+ dot: 'var(--pds-color-status-warning-dot)',
108
+ },
109
+ critical: {
110
+ background: 'var(--pds-color-status-critical-background)',
111
+ foreground: 'var(--pds-color-status-critical-foreground)',
112
+ border: 'var(--pds-color-status-critical-border)',
113
+ dot: 'var(--pds-color-status-critical-dot)',
114
+ },
115
+ discovery: {
116
+ background: 'var(--pds-color-status-discovery-background)',
117
+ foreground: 'var(--pds-color-status-discovery-foreground)',
118
+ border: 'var(--pds-color-status-discovery-border)',
119
+ dot: 'var(--pds-color-status-discovery-dot)',
120
+ },
121
+ },
122
+ // Overlay (e.g. modal backdrops)
123
+ overlay: 'var(--pds-color-overlay)',
124
+ // Data visualization palette
125
+ datavis: {
126
+ 1: 'var(--pds-color-datavis-1)',
127
+ 2: 'var(--pds-color-datavis-2)',
128
+ 3: 'var(--pds-color-datavis-3)',
129
+ 4: 'var(--pds-color-datavis-4)',
130
+ 5: 'var(--pds-color-datavis-5)',
131
+ },
132
+ },
133
+
134
+ // ─── Spacing ─────────────────────────────────────────────────────────────
135
+ // Primary scale uses PDS named keys: p-xs, m-xl, gap-m, etc.
136
+ // Numeric aliases map common Tailwind values to the nearest PDS token so
137
+ // that p-4 / p-6 / etc. still work and stay in sync if tokens change.
138
+ spacing: {
139
+ 0: '0px',
140
+ // PDS named scale
141
+ '5xs': 'var(--pds-spacing-5xs)',
142
+ '4xs': 'var(--pds-spacing-4xs)',
143
+ '3xs': 'var(--pds-spacing-3xs)',
144
+ '2xs': 'var(--pds-spacing-2xs)',
145
+ xs: 'var(--pds-spacing-xs)',
146
+ s: 'var(--pds-spacing-s)',
147
+ m: 'var(--pds-spacing-m)',
148
+ l: 'var(--pds-spacing-l)',
149
+ xl: 'var(--pds-spacing-xl)',
150
+ '2xl': 'var(--pds-spacing-2xl)',
151
+ '3xl': 'var(--pds-spacing-3xl)',
152
+ '4xl': 'var(--pds-spacing-4xl)',
153
+ '5xl': 'var(--pds-spacing-5xl)',
154
+ '6xl': 'var(--pds-spacing-6xl)',
155
+ '7xl': 'var(--pds-spacing-7xl)',
156
+ '8xl': 'var(--pds-spacing-8xl)',
157
+ '9xl': 'var(--pds-spacing-9xl)',
158
+ // Numeric aliases → PDS tokens (p-4 = p-m, p-6 = p-xl, etc.)
159
+ // Values reference CSS variables so they stay in sync if tokens change.
160
+ 0.5: 'var(--pds-spacing-5xs)', // 0.125rem
161
+ 1: 'var(--pds-spacing-4xs)', // 0.25rem
162
+ 1.5: 'var(--pds-spacing-3xs)', // 0.375rem
163
+ 2: 'var(--pds-spacing-2xs)', // 0.5rem
164
+ 2.5: 'var(--pds-spacing-xs)', // 0.625rem
165
+ 3: 'var(--pds-spacing-s)', // 0.75rem
166
+ 4: 'var(--pds-spacing-m)', // 1rem
167
+ 5: 'var(--pds-spacing-l)', // 1.25rem
168
+ 6: 'var(--pds-spacing-xl)', // 1.5rem
169
+ 8: 'var(--pds-spacing-2xl)', // 2rem
170
+ 10: 'var(--pds-spacing-3xl)', // 2.5rem
171
+ 12: 'var(--pds-spacing-4xl)', // 3rem
172
+ 16: 'var(--pds-spacing-5xl)', // 4rem
173
+ 20: 'var(--pds-spacing-6xl)', // 5rem
174
+ 24: 'var(--pds-spacing-7xl)', // 6rem
175
+ 32: 'var(--pds-spacing-8xl)', // 8rem
176
+ 40: 'var(--pds-spacing-9xl)', // 10rem
177
+ },
178
+
179
+ // ─── Typography ──────────────────────────────────────────────────────────
180
+ // Font families are intentionally excluded. PDS applies font families
181
+ // automatically via pds-core.css (body, headings, code blocks, etc.).
182
+ // Teams should not override font families via Tailwind utilities.
183
+ fontSize: {
184
+ xs: 'var(--pds-typography-size-xs)',
185
+ s: 'var(--pds-typography-size-s)',
186
+ m: 'var(--pds-typography-size-m)',
187
+ l: 'var(--pds-typography-size-l)',
188
+ xl: 'var(--pds-typography-size-xl)',
189
+ '2xl': 'var(--pds-typography-size-2xl)',
190
+ '3xl': 'var(--pds-typography-size-3xl)',
191
+ '4xl': 'var(--pds-typography-size-4xl)',
192
+ '5xl': 'var(--pds-typography-size-5xl)',
193
+ '6xl': 'var(--pds-typography-size-6xl)',
194
+ '7xl': 'var(--pds-typography-size-7xl)',
195
+ '8xl': 'var(--pds-typography-size-8xl)',
196
+ '9xl': 'var(--pds-typography-size-9xl)',
197
+ },
198
+ fontWeight: {
199
+ light: 'var(--pds-typography-fw-light)',
200
+ normal: 'var(--pds-typography-fw-regular)',
201
+ medium: 'var(--pds-typography-fw-medium)',
202
+ semibold: 'var(--pds-typography-fw-semibold)',
203
+ bold: 'var(--pds-typography-fw-bold)',
204
+ },
205
+ lineHeight: {
206
+ s: 'var(--pds-typography-lh-s)',
207
+ m: 'var(--pds-typography-lh-m)',
208
+ l: 'var(--pds-typography-lh-l)',
209
+ xl: 'var(--pds-typography-lh-xl)',
210
+ },
211
+ letterSpacing: {
212
+ s: 'var(--pds-typography-ls-s)',
213
+ m: 'var(--pds-typography-ls-m)',
214
+ l: 'var(--pds-typography-ls-l)',
215
+ xl: 'var(--pds-typography-ls-xl)',
216
+ },
217
+
218
+ // ─── Border ──────────────────────────────────────────────────────────────
219
+ borderRadius: {
220
+ none: '0px',
221
+ DEFAULT: 'var(--pds-border-radius-default)',
222
+ button: 'var(--pds-border-radius-button)',
223
+ input: 'var(--pds-border-radius-input)',
224
+ container: 'var(--pds-border-radius-container)',
225
+ bar: 'var(--pds-border-radius-bar)',
226
+ full: '9999px',
227
+ },
228
+ borderWidth: {
229
+ 0: '0px',
230
+ DEFAULT: 'var(--pds-border-width-default)',
231
+ thicker: 'var(--pds-border-width-thicker)',
232
+ },
233
+
234
+ // ─── Z-index ─────────────────────────────────────────────────────────────
235
+ zIndex: {
236
+ 0: '0',
237
+ navigation: 'var(--pds-z-index-navigation)',
238
+ dropdown: 'var(--pds-z-index-dropdown)',
239
+ notifications: 'var(--pds-z-index-notifications)',
240
+ overlay: 'var(--pds-z-index-overlay)',
241
+ modal: 'var(--pds-z-index-modal)',
242
+ max: 'var(--pds-z-index-max)',
243
+ },
244
+
245
+ // ─── Max Width ───────────────────────────────────────────────────────────
246
+ // PDS standard container widths — use to match PDS layout components.
247
+ maxWidth: {
248
+ none: 'none',
249
+ full: '100%',
250
+ narrow: 'var(--pds-container-max-width-narrow)',
251
+ standard: 'var(--pds-container-max-width-standard)',
252
+ wide: 'var(--pds-container-max-width-wide)',
253
+ 'x-wide': 'var(--pds-container-max-width-x-wide)',
254
+ },
255
+
256
+ extend: {},
257
+ },
258
+ };
@@ -0,0 +1,230 @@
1
+ /**
2
+ * PDS Tailwind v4 Theme
3
+ *
4
+ * Maps Pantheon Design System tokens to Tailwind CSS v4 utilities via @theme.
5
+ * Replaces Tailwind's default color, spacing, and typography scales with PDS values.
6
+ *
7
+ * Requirements:
8
+ * - pds-core.css must be imported before this file (provides --pds-* CSS variables)
9
+ * - Tailwind v4.x
10
+ *
11
+ * Usage in your global CSS entry point:
12
+ *
13
+ * @import 'tailwindcss/theme' layer(theme);
14
+ * @import 'tailwindcss/utilities' layer(utilities);
15
+ * @import '@pantheon-systems/pds-toolkit-react/tailwind/v4/theme.css';
16
+ *
17
+ * And in your root layout (JS import, before globals.css):
18
+ * import '@pantheon-systems/pds-toolkit-react/css/pds-core.css';
19
+ */
20
+
21
+ /*
22
+ * Reset border-style to none so borders are fully opt-in.
23
+ * Without this, any element that picks up a non-zero border-width
24
+ * (from PDS components, inheritance, or browser defaults) gets a
25
+ * visible border even without explicit border classes.
26
+ * Always include border-solid (or border-dashed, etc.) when adding borders.
27
+ */
28
+ @layer base {
29
+ *,
30
+ ::before,
31
+ ::after {
32
+ border-color: var(--pds-color-border-default);
33
+ border-style: none;
34
+ border-width: 0;
35
+ }
36
+ }
37
+
38
+ @theme {
39
+ /* ── Reset Tailwind defaults we are replacing ──────────────────────────── */
40
+ --color-*: initial;
41
+ --spacing-*: initial;
42
+ --font-*: initial;
43
+ --text-*: initial;
44
+ --font-weight-*: initial;
45
+ --leading-*: initial;
46
+ --tracking-*: initial;
47
+ --radius-*: initial;
48
+ --border-*: initial;
49
+ --z-*: initial;
50
+ --max-w-*: initial;
51
+
52
+ /* ── Colors ────────────────────────────────────────────────────────────── */
53
+
54
+ /* Backgrounds — use as bg-bg-default, bg-bg-secondary, bg-bg-reverse */
55
+ --color-bg-default: var(--pds-color-bg-default);
56
+ --color-bg-secondary: var(--pds-color-bg-default-secondary);
57
+ --color-bg-reverse: var(--pds-color-bg-reverse);
58
+
59
+ /* Foregrounds */
60
+ --color-fg-default: var(--pds-color-fg-default);
61
+ --color-fg-secondary: var(--pds-color-fg-default-secondary);
62
+ --color-fg-reverse: var(--pds-color-fg-reverse);
63
+
64
+ /* Borders — use as border-border-default, border-border-input, etc. */
65
+ --color-border-default: var(--pds-color-border-default);
66
+ --color-border-input: var(--pds-color-border-input);
67
+ --color-border-separator: var(--pds-color-border-separator);
68
+ --color-border-brand: var(--pds-color-border-brand);
69
+
70
+ /* Interactive */
71
+ --color-interactive-focus: var(--pds-color-interactive-focus);
72
+ --color-interactive-bg-hover: var(--pds-color-interactive-background-hover);
73
+ --color-interactive-bg-active: var(--pds-color-interactive-background-active);
74
+ --color-interactive-link: var(--pds-color-interactive-link-default);
75
+ --color-interactive-link-hover: var(--pds-color-interactive-link-hover);
76
+ --color-interactive-link-active: var(--pds-color-interactive-link-active);
77
+ --color-interactive-link-visited: var(--pds-color-interactive-link-visited);
78
+ --color-interactive-reverse-focus: var(--pds-color-interactive-reverse-focus);
79
+ --color-interactive-reverse-link: var(
80
+ --pds-color-interactive-reverse-link-default
81
+ );
82
+ --color-interactive-reverse-link-hover: var(
83
+ --pds-color-interactive-reverse-link-hover
84
+ );
85
+ --color-interactive-reverse-link-active: var(
86
+ --pds-color-interactive-reverse-link-active
87
+ );
88
+ --color-interactive-reverse-link-visited: var(
89
+ --pds-color-interactive-reverse-link-visited
90
+ );
91
+
92
+ /* Status */
93
+ --color-status-info-background: var(--pds-color-status-info-background);
94
+ --color-status-info-foreground: var(--pds-color-status-info-foreground);
95
+ --color-status-info-border: var(--pds-color-status-info-border);
96
+ --color-status-info-dot: var(--pds-color-status-info-dot);
97
+ --color-status-success-background: var(--pds-color-status-success-background);
98
+ --color-status-success-foreground: var(--pds-color-status-success-foreground);
99
+ --color-status-success-border: var(--pds-color-status-success-border);
100
+ --color-status-success-dot: var(--pds-color-status-success-dot);
101
+ --color-status-warning-background: var(--pds-color-status-warning-background);
102
+ --color-status-warning-foreground: var(--pds-color-status-warning-foreground);
103
+ --color-status-warning-border: var(--pds-color-status-warning-border);
104
+ --color-status-warning-dot: var(--pds-color-status-warning-dot);
105
+ --color-status-critical-background: var(
106
+ --pds-color-status-critical-background
107
+ );
108
+ --color-status-critical-foreground: var(
109
+ --pds-color-status-critical-foreground
110
+ );
111
+ --color-status-critical-border: var(--pds-color-status-critical-border);
112
+ --color-status-critical-dot: var(--pds-color-status-critical-dot);
113
+ --color-status-discovery-background: var(
114
+ --pds-color-status-discovery-background
115
+ );
116
+ --color-status-discovery-foreground: var(
117
+ --pds-color-status-discovery-foreground
118
+ );
119
+ --color-status-discovery-border: var(--pds-color-status-discovery-border);
120
+ --color-status-discovery-dot: var(--pds-color-status-discovery-dot);
121
+
122
+ /* Overlay */
123
+ --color-overlay: var(--pds-color-overlay);
124
+
125
+ /* Data visualization */
126
+ --color-datavis-1: var(--pds-color-datavis-1);
127
+ --color-datavis-2: var(--pds-color-datavis-2);
128
+ --color-datavis-3: var(--pds-color-datavis-3);
129
+ --color-datavis-4: var(--pds-color-datavis-4);
130
+ --color-datavis-5: var(--pds-color-datavis-5);
131
+
132
+ /* ── Spacing ───────────────────────────────────────────────────────────── */
133
+ /* PDS named scale */
134
+ --spacing-5xs: var(--pds-spacing-5xs);
135
+ --spacing-4xs: var(--pds-spacing-4xs);
136
+ --spacing-3xs: var(--pds-spacing-3xs);
137
+ --spacing-2xs: var(--pds-spacing-2xs);
138
+ --spacing-xs: var(--pds-spacing-xs);
139
+ --spacing-s: var(--pds-spacing-s);
140
+ --spacing-m: var(--pds-spacing-m);
141
+ --spacing-l: var(--pds-spacing-l);
142
+ --spacing-xl: var(--pds-spacing-xl);
143
+ --spacing-2xl: var(--pds-spacing-2xl);
144
+ --spacing-3xl: var(--pds-spacing-3xl);
145
+ --spacing-4xl: var(--pds-spacing-4xl);
146
+ --spacing-5xl: var(--pds-spacing-5xl);
147
+ --spacing-6xl: var(--pds-spacing-6xl);
148
+ --spacing-7xl: var(--pds-spacing-7xl);
149
+ --spacing-8xl: var(--pds-spacing-8xl);
150
+ --spacing-9xl: var(--pds-spacing-9xl);
151
+ /* Numeric aliases → PDS tokens (p-4 = p-m, p-6 = p-xl, etc.) */
152
+ --spacing-0\.5: var(--pds-spacing-5xs);
153
+ --spacing-1: var(--pds-spacing-4xs);
154
+ --spacing-1\.5: var(--pds-spacing-3xs);
155
+ --spacing-2: var(--pds-spacing-2xs);
156
+ --spacing-2\.5: var(--pds-spacing-xs);
157
+ --spacing-3: var(--pds-spacing-s);
158
+ --spacing-4: var(--pds-spacing-m);
159
+ --spacing-5: var(--pds-spacing-l);
160
+ --spacing-6: var(--pds-spacing-xl);
161
+ --spacing-8: var(--pds-spacing-2xl);
162
+ --spacing-10: var(--pds-spacing-3xl);
163
+ --spacing-12: var(--pds-spacing-4xl);
164
+ --spacing-16: var(--pds-spacing-5xl);
165
+ --spacing-20: var(--pds-spacing-6xl);
166
+ --spacing-24: var(--pds-spacing-7xl);
167
+ --spacing-32: var(--pds-spacing-8xl);
168
+ --spacing-40: var(--pds-spacing-9xl);
169
+
170
+ /* ── Typography ────────────────────────────────────────────────────────── */
171
+ /* Font families are intentionally excluded. PDS applies font families
172
+ automatically via pds-core.css (body, headings, code blocks, etc.).
173
+ Teams should not override font families via Tailwind utilities. */
174
+
175
+ --text-xs: var(--pds-typography-size-xs);
176
+ --text-s: var(--pds-typography-size-s);
177
+ --text-m: var(--pds-typography-size-m);
178
+ --text-l: var(--pds-typography-size-l);
179
+ --text-xl: var(--pds-typography-size-xl);
180
+ --text-2xl: var(--pds-typography-size-2xl);
181
+ --text-3xl: var(--pds-typography-size-3xl);
182
+ --text-4xl: var(--pds-typography-size-4xl);
183
+ --text-5xl: var(--pds-typography-size-5xl);
184
+ --text-6xl: var(--pds-typography-size-6xl);
185
+ --text-7xl: var(--pds-typography-size-7xl);
186
+ --text-8xl: var(--pds-typography-size-8xl);
187
+ --text-9xl: var(--pds-typography-size-9xl);
188
+
189
+ --font-weight-light: var(--pds-typography-fw-light);
190
+ --font-weight-normal: var(--pds-typography-fw-regular);
191
+ --font-weight-medium: var(--pds-typography-fw-medium);
192
+ --font-weight-semibold: var(--pds-typography-fw-semibold);
193
+ --font-weight-bold: var(--pds-typography-fw-bold);
194
+
195
+ --leading-s: var(--pds-typography-lh-s);
196
+ --leading-m: var(--pds-typography-lh-m);
197
+ --leading-l: var(--pds-typography-lh-l);
198
+ --leading-xl: var(--pds-typography-lh-xl);
199
+
200
+ --tracking-s: var(--pds-typography-ls-s);
201
+ --tracking-m: var(--pds-typography-ls-m);
202
+ --tracking-l: var(--pds-typography-ls-l);
203
+ --tracking-xl: var(--pds-typography-ls-xl);
204
+
205
+ /* ── Border ────────────────────────────────────────────────────────────── */
206
+ --radius-none: 0px;
207
+ --radius-DEFAULT: var(--pds-border-radius-default);
208
+ --radius-button: var(--pds-border-radius-button);
209
+ --radius-input: var(--pds-border-radius-input);
210
+ --radius-container: var(--pds-border-radius-container);
211
+ --radius-bar: var(--pds-border-radius-bar);
212
+ --radius-full: 9999px;
213
+
214
+ --border-DEFAULT: var(--pds-border-width-default);
215
+ --border-thicker: var(--pds-border-width-thicker);
216
+
217
+ /* ── Z-index ───────────────────────────────────────────────────────────── */
218
+ --z-navigation: var(--pds-z-index-navigation);
219
+ --z-dropdown: var(--pds-z-index-dropdown);
220
+ --z-notifications: var(--pds-z-index-notifications);
221
+ --z-overlay: var(--pds-z-index-overlay);
222
+ --z-modal: var(--pds-z-index-modal);
223
+ --z-max: var(--pds-z-index-max);
224
+
225
+ /* ── Max Width ─────────────────────────────────────────────────────────── */
226
+ --max-w-narrow: var(--pds-container-max-width-narrow);
227
+ --max-w-standard: var(--pds-container-max-width-standard);
228
+ --max-w-wide: var(--pds-container-max-width-wide);
229
+ --max-w-x-wide: var(--pds-container-max-width-x-wide);
230
+ }
@@ -1,43 +0,0 @@
1
- import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ContainerWidth, HeadingLevel } from '../../libs/types/custom-types';
3
- import './../buttons/Button/button.css';
4
- import './cta-slice.css';
5
- interface CTASliceProps extends ComponentPropsWithoutRef<'div'> {
6
- /**
7
- * Background color of slice
8
- */
9
- backgroundColor?: 'default' | 'secondary';
10
- /**
11
- * Additional class names
12
- */
13
- className?: string;
14
- /**
15
- * PDS container width.
16
- */
17
- containerWidth?: ContainerWidth;
18
- /**
19
- * Heading level
20
- */
21
- headingLevel?: HeadingLevel;
22
- /**
23
- * Heading text
24
- */
25
- headingText: string;
26
- /**
27
- * Further explain block
28
- */
29
- leadText?: string;
30
- /**
31
- * Primary link content
32
- */
33
- primaryLinkContent: ReactNode;
34
- /**
35
- * Optional secondary link content
36
- */
37
- secondaryLinkContent?: ReactNode;
38
- }
39
- /**
40
- * CTA Slice UI component
41
- */
42
- export declare const CTASlice: ({ backgroundColor, className, containerWidth, headingLevel, headingText, leadText, primaryLinkContent, secondaryLinkContent, ...props }: CTASliceProps) => import("react/jsx-runtime").JSX.Element;
43
- export {};
@@ -1,28 +0,0 @@
1
- import { ComponentPropsWithoutRef } from 'react';
2
- import './dashboard-stat.css';
3
- export type DashboardStatStatus = 'success' | 'warning' | 'launch' | 'error' | 'ready' | 'notReady';
4
- /**
5
- * Prop types for DashboardStat
6
- */
7
- export interface DashboardStatProps extends ComponentPropsWithoutRef<'div'> {
8
- /**
9
- * Additional class names.
10
- */
11
- className?: string;
12
- /**
13
- * Value of the stat, displayed next to the status icon.
14
- */
15
- stat?: string | number;
16
- /**
17
- * Status of the stat, which determines the icon and icon color.
18
- */
19
- status?: DashboardStatStatus;
20
- /**
21
- * Title of the stat, displayed as the main heading of the component.
22
- */
23
- title?: string;
24
- }
25
- /**
26
- * DashboardStat UI component
27
- */
28
- export declare const DashboardStat: ({ className, stat, status, title, ...props }: DashboardStatProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,34 +0,0 @@
1
- import { ComponentPropsWithoutRef } from 'react';
2
- import './pull-quote.css';
3
- interface Attribution {
4
- name: string;
5
- org: string;
6
- title: string;
7
- }
8
- interface PullQuoteProps extends ComponentPropsWithoutRef<'div'> {
9
- /**
10
- * Attribution for the quote
11
- */
12
- attribution?: Attribution;
13
- /**
14
- * Additional class names
15
- */
16
- className?: string;
17
- /**
18
- * Image src. For stand-alone layout only, will not render for inline layout.
19
- */
20
- image?: string;
21
- /**
22
- * The layout type for the pull quote
23
- */
24
- layoutType?: 'stand-alone' | 'inline';
25
- /**
26
- * The quote text
27
- */
28
- quote: string;
29
- }
30
- /**
31
- * PullQuote UI component
32
- */
33
- export declare const PullQuote: ({ attribution, className, image, layoutType, quote, ...props }: PullQuoteProps) => import("react/jsx-runtime").JSX.Element;
34
- export {};
@@ -1,23 +0,0 @@
1
- import { ComponentPropsWithoutRef } from 'react';
2
- import { PDSIcon } from '../icons/Icon/Icon';
3
- import './social-links.css';
4
- interface SocialLinksProps extends ComponentPropsWithoutRef<'ul'> {
5
- /**
6
- * Additional class names
7
- */
8
- className?: string;
9
- /**
10
- * Array of social media links
11
- */
12
- linkItems?: (keyof typeof socialData)[];
13
- }
14
- declare const socialData: Record<string, {
15
- icon: PDSIcon;
16
- label: string;
17
- url: string;
18
- }>;
19
- /**
20
- * SocialLinks UI component
21
- */
22
- export declare const SocialLinks: ({ className, linkItems, ...props }: SocialLinksProps) => import("react/jsx-runtime").JSX.Element;
23
- export {};
@@ -1,27 +0,0 @@
1
- import { ComponentPropsWithoutRef } from 'react';
2
- import './indicator-badge.css';
3
- /**
4
- * IndicatorBadge component props
5
- */
6
- export interface IndicatorBadgeProps extends ComponentPropsWithoutRef<'span'> {
7
- /**
8
- * Additional class names
9
- */
10
- className?: string;
11
- /**
12
- * Badge color
13
- */
14
- color: 'critical' | 'info' | 'success' | 'warning' | 'neutral' | 'brand' | 'silver' | 'gold' | 'platinum' | 'diamond' | 'default';
15
- /**
16
- * Badge text.
17
- */
18
- label: string;
19
- /**
20
- * Badge size
21
- */
22
- size?: 'sm' | 'md';
23
- }
24
- /**
25
- * IndicatorBadge UI component
26
- */
27
- export declare const IndicatorBadge: ({ className, color, label, size, ...props }: IndicatorBadgeProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,22 +0,0 @@
1
- import { ComponentPropsWithoutRef } from 'react';
2
- import type { HeadingLevelCommon } from '../../../libs/types/custom-types';
3
- import './footer-heading.css';
4
- interface FooterHeadingProps {
5
- /**
6
- * Additional class names
7
- */
8
- className?: string;
9
- /**
10
- * Heading level
11
- */
12
- headingLevel?: HeadingLevelCommon;
13
- /**
14
- * Heading text
15
- */
16
- headingText: string;
17
- }
18
- /**
19
- * Footer Heading UI component
20
- */
21
- export declare const FooterHeading: ({ className, headingLevel, headingText, ...props }: FooterHeadingProps & ComponentPropsWithoutRef<HeadingLevelCommon>) => import("react/jsx-runtime").JSX.Element;
22
- export {};