@pantheon-systems/pds-toolkit-react 2.0.0-alpha.7 → 2.0.0-alpha.71

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 (403) hide show
  1. package/bin/pds-codemod.cjs +58 -0
  2. package/codemods/v1-to-v2/css-token-renames.js +186 -0
  3. package/codemods/v1-to-v2/mappings.json +1787 -0
  4. package/codemods/v1-to-v2/transforms/__testfixtures__/component-renames/basic.input.tsx +33 -0
  5. package/codemods/v1-to-v2/transforms/__testfixtures__/component-renames/basic.output.tsx +33 -0
  6. package/codemods/v1-to-v2/transforms/__testfixtures__/component-renames/only.input.tsx +8 -0
  7. package/codemods/v1-to-v2/transforms/__testfixtures__/component-renames/only.output.tsx +8 -0
  8. package/codemods/v1-to-v2/transforms/__testfixtures__/css-class-removals/basic.input.tsx +55 -0
  9. package/codemods/v1-to-v2/transforms/__testfixtures__/css-class-removals/basic.output.tsx +55 -0
  10. package/codemods/v1-to-v2/transforms/__testfixtures__/css-class-renames/basic.input.tsx +60 -0
  11. package/codemods/v1-to-v2/transforms/__testfixtures__/css-class-renames/basic.output.tsx +60 -0
  12. package/codemods/v1-to-v2/transforms/__testfixtures__/icon-name-updates/basic.input.tsx +35 -0
  13. package/codemods/v1-to-v2/transforms/__testfixtures__/icon-name-updates/basic.output.tsx +35 -0
  14. package/codemods/v1-to-v2/transforms/__testfixtures__/icon-name-updates/only.input.tsx +8 -0
  15. package/codemods/v1-to-v2/transforms/__testfixtures__/icon-name-updates/only.output.tsx +8 -0
  16. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-renames/basic.input.tsx +28 -0
  17. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-renames/basic.output.tsx +28 -0
  18. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-renames/only.input.tsx +8 -0
  19. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-renames/only.output.tsx +8 -0
  20. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-value-standardization/basic.input.tsx +37 -0
  21. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-value-standardization/basic.output.tsx +37 -0
  22. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-value-standardization/only.input.tsx +21 -0
  23. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-value-standardization/only.output.tsx +21 -0
  24. package/codemods/v1-to-v2/transforms/__testfixtures__/removed-prop-values/basic.input.tsx +60 -0
  25. package/codemods/v1-to-v2/transforms/__testfixtures__/removed-prop-values/basic.output.tsx +51 -0
  26. package/codemods/v1-to-v2/transforms/__testfixtures__/removed-prop-values/only.input.tsx +8 -0
  27. package/codemods/v1-to-v2/transforms/__testfixtures__/removed-prop-values/only.output.tsx +8 -0
  28. package/codemods/v1-to-v2/transforms/__tests__/component-renames.test.js +15 -0
  29. package/codemods/v1-to-v2/transforms/__tests__/css-class-removals.test.js +6 -0
  30. package/codemods/v1-to-v2/transforms/__tests__/css-class-renames.test.js +6 -0
  31. package/codemods/v1-to-v2/transforms/__tests__/icon-name-updates.test.js +15 -0
  32. package/codemods/v1-to-v2/transforms/__tests__/prop-renames.test.js +15 -0
  33. package/codemods/v1-to-v2/transforms/__tests__/prop-value-standardization.test.js +16 -0
  34. package/codemods/v1-to-v2/transforms/__tests__/removed-prop-values.test.js +15 -0
  35. package/codemods/v1-to-v2/transforms/component-renames.js +166 -0
  36. package/codemods/v1-to-v2/transforms/css-class-removals.js +262 -0
  37. package/codemods/v1-to-v2/transforms/css-class-renames.js +178 -0
  38. package/codemods/v1-to-v2/transforms/icon-name-updates.js +124 -0
  39. package/codemods/v1-to-v2/transforms/prop-renames.js +109 -0
  40. package/codemods/v1-to-v2/transforms/prop-value-standardization.js +143 -0
  41. package/codemods/v1-to-v2/transforms/removed-prop-values.js +206 -0
  42. package/dist/components/Avatar/Avatar.d.ts +5 -1
  43. package/dist/components/Callout/Callout.d.ts +6 -2
  44. package/dist/components/CodeBlock/CodeBlock.d.ts +10 -5
  45. package/dist/components/CodeBlock/code-examples.d.ts +2 -1
  46. package/dist/components/CodeBlock/prism-setup.d.ts +2 -0
  47. package/dist/components/CodeBlock/themes/index.d.ts +1 -2
  48. package/dist/components/CodeBlock/themes/{pdsDark.d.ts → pds.d.ts} +1 -1
  49. package/dist/components/ComparisonList/ComparisonList.d.ts +6 -1
  50. package/dist/components/Dropdown/Dropdown.d.ts +192 -0
  51. package/dist/components/Dropdown/DropdownSelectedIcon.d.ts +7 -0
  52. package/dist/components/FileDiff/FileDiff.d.ts +2 -2
  53. package/dist/components/IdentityBlock/IdentityBlock.d.ts +37 -0
  54. package/dist/components/PantheonLogo/PantheonLogo.d.ts +5 -4
  55. package/dist/components/Popover/Popover.d.ts +5 -1
  56. package/dist/components/ResultCount/ResultCount.d.ts +53 -0
  57. package/dist/components/SiteFooter/SiteFooter.d.ts +45 -0
  58. package/dist/components/{navigation/DashboardSearch/DashboardSearch.d.ts → SiteSearch/SiteSearch.d.ts} +6 -11
  59. package/dist/components/SortableList/SortableList.d.ts +8 -0
  60. package/dist/components/SortableList/SortableListHeader.d.ts +7 -0
  61. package/dist/components/SortableList/SortableRow.d.ts +16 -0
  62. package/dist/components/SortableList/sortable-utils.d.ts +19 -0
  63. package/dist/components/SortableList/types.d.ts +142 -0
  64. package/dist/components/SortableList/useSortableTree.d.ts +18 -0
  65. package/dist/components/{RefreshChecker/RefreshChecker.d.ts → StatusChecker/StatusChecker.d.ts} +6 -19
  66. package/dist/components/StatusIndicator/StatusIndicator.d.ts +7 -4
  67. package/dist/components/Table/Table.d.ts +290 -17
  68. package/dist/components/TableOfContents/TableOfContents.d.ts +1 -5
  69. package/dist/components/Tag/Tag.d.ts +21 -3
  70. package/dist/components/ThemeSwitcher/ThemeSwitcher.d.ts +29 -8
  71. package/dist/components/Tooltip/Tooltip.d.ts +6 -2
  72. package/dist/components/UtilityBar/UtilityBar.d.ts +26 -0
  73. package/dist/components/badges/Badge/Badge.d.ts +1 -1
  74. package/dist/components/badges/StatusBadge/StatusBadge.d.ts +2 -1
  75. package/dist/components/buttons/Button/Button.d.ts +15 -0
  76. package/dist/components/buttons/ButtonLink/ButtonLink.d.ts +1 -3
  77. package/dist/components/buttons/ClipboardButton/ClipboardButton.d.ts +5 -1
  78. package/dist/components/buttons/CloseButton/CloseButton.d.ts +4 -4
  79. package/dist/components/buttons/FilterButton/FilterButton.d.ts +92 -0
  80. package/dist/components/buttons/IconButton/IconButton.d.ts +12 -0
  81. package/dist/components/buttons/MenuButton/MenuButton.d.ts +24 -17
  82. package/dist/components/buttons/SSOButton/SSOButton.d.ts +9 -1
  83. package/dist/components/buttons/SegmentedButton/SegmentedButton.d.ts +44 -8
  84. package/dist/components/cards/ActionCard/ActionCard.d.ts +64 -0
  85. package/dist/components/cards/Card/Card.d.ts +10 -4
  86. package/dist/components/cards/CardSelect/CardSelect.d.ts +100 -0
  87. package/dist/components/charts/BarChart/BarChart.d.ts +21 -0
  88. package/dist/components/charts/LineChart/LineChart.d.ts +22 -0
  89. package/dist/components/charts/PieChart/PieChart.d.ts +59 -0
  90. package/dist/components/charts/ProportionBar/ProportionBar.d.ts +57 -0
  91. package/dist/components/charts/shared/ChartAccessibleTable.d.ts +17 -0
  92. package/dist/components/charts/shared/ChartLegend.d.ts +31 -0
  93. package/dist/components/charts/shared/ChartSkeleton.d.ts +11 -0
  94. package/dist/components/charts/shared/chart-colors.d.ts +30 -0
  95. package/dist/components/charts/shared/chart-styles.d.ts +24 -0
  96. package/dist/components/charts/shared/formatters.d.ts +12 -0
  97. package/dist/components/charts/shared/types.d.ts +128 -0
  98. package/dist/components/empty-states/HorizontalEmptyState/HorizontalEmptyState.d.ts +13 -8
  99. package/dist/components/icons/Icon/Icon.d.ts +2 -2
  100. package/dist/components/icons/Icon/custom-icons.d.ts +1 -1
  101. package/dist/components/icons/Icon/generated-icon-data.d.ts +212 -16
  102. package/dist/components/icons/PaymentIcon/PaymentIcon.d.ts +7 -3
  103. package/dist/components/icons/PlatformIcon/PlatformIcon.d.ts +6 -6
  104. package/dist/components/inputs/Checkbox/Checkbox.d.ts +3 -3
  105. package/dist/components/inputs/CheckboxFieldset/CheckboxFieldset.d.ts +9 -1
  106. package/dist/components/inputs/CheckboxGroup/CheckboxGroup.d.ts +9 -1
  107. package/dist/components/inputs/Combobox/Combobox.d.ts +17 -7
  108. package/dist/components/inputs/ComboboxMultiselect/ComboboxMultiselect.d.ts +10 -5
  109. package/dist/components/inputs/Datepicker/Datepicker.d.ts +217 -14
  110. package/dist/components/inputs/FileUpload/FileUpload.d.ts +6 -1
  111. package/dist/components/inputs/RadioGroup/RadioGroup.d.ts +10 -2
  112. package/dist/components/inputs/Select/Select.d.ts +11 -2
  113. package/dist/components/inputs/Switch/Switch.d.ts +5 -5
  114. package/dist/components/inputs/TagsInput/TagsInput.d.ts +6 -1
  115. package/dist/components/inputs/TextInput/TextInput.d.ts +4 -4
  116. package/dist/components/inputs/Textarea/Textarea.d.ts +2 -2
  117. package/dist/components/inputs/Timepicker/Timepicker.d.ts +94 -0
  118. package/dist/components/inputs/input-utilities.d.ts +12 -2
  119. package/dist/components/{CTALink → links/CTALink}/CTALink.d.ts +1 -1
  120. package/dist/components/{LinkNewWindow → links/LinkNewWindow}/LinkNewWindow.d.ts +1 -1
  121. package/dist/components/loading-indicators/Spinner/Spinner.d.ts +5 -4
  122. package/dist/components/navigation/ButtonNav/ButtonNav.d.ts +11 -5
  123. package/dist/components/navigation/DropdownMenu/DropdownMenu.d.ts +1 -0
  124. package/dist/components/navigation/Navbar/Navbar.d.ts +9 -21
  125. package/dist/components/navigation/SideNav/SideNav.d.ts +7 -1
  126. package/dist/components/navigation/SideNavGlobal/SideNavGlobal.d.ts +5 -15
  127. package/dist/components/navigation/SideNavGlobal/SideNavGlobalItem.d.ts +15 -1
  128. package/dist/components/navigation/SiteMenu/SiteMenu.d.ts +26 -0
  129. package/dist/components/navigation/SiteMenu/SiteMenuDropdown.d.ts +23 -0
  130. package/dist/components/navigation/TreeNav/TreeNav.d.ts +48 -0
  131. package/dist/components/navigation/UserMenu/UserMenu.d.ts +20 -5
  132. package/dist/components/navigation/WorkspaceSelector/WorkspaceSelector.d.ts +2 -16
  133. package/dist/components/navigation/navigation-utilities.d.ts +12 -0
  134. package/dist/components/notifications/Toaster/Toast.d.ts +12 -1
  135. package/dist/components/notifications/Toaster/Toaster.d.ts +16 -7
  136. package/dist/components/notifications/Toaster/useToast.d.ts +2 -0
  137. package/dist/components/overlays/Drawer/Drawer.d.ts +58 -0
  138. package/dist/components/overlays/FullScreenOverlay/FullScreenOverlay.d.ts +45 -0
  139. package/dist/components/{Modal → overlays/Modal}/Modal.d.ts +2 -2
  140. package/dist/components/{Pagination → pagination/Pagination}/Pagination.d.ts +7 -2
  141. package/dist/components/pagination/PaginationChapter/PaginationChapter.d.ts +55 -0
  142. package/dist/components/pagination/PaginationCompact/PaginationCompact.d.ts +62 -0
  143. package/dist/components/panels/ExpansionPanel/ExpansionPanel.d.ts +1 -2
  144. package/dist/components/panels/ExpansionPanelGroup/ExpansionPanelGroup.d.ts +1 -2
  145. package/dist/components/panels/Panel/Panel.d.ts +4 -21
  146. package/dist/components/panels/PanelList/PanelList.d.ts +1 -1
  147. package/dist/components/panels/PanelStack/PanelStack.d.ts +19 -0
  148. package/dist/components/progress-indicators/ProgressBar/ProgressBar.d.ts +4 -5
  149. package/dist/components/progress-indicators/ProgressRing/ProgressRing.d.ts +12 -4
  150. package/dist/components/{FlowSteps/FlowSteps.d.ts → steppers/StepList/StepList.d.ts} +7 -7
  151. package/dist/css/component-css/pds-action-card.css +1 -0
  152. package/dist/css/component-css/pds-avatar.css +1 -1
  153. package/dist/css/component-css/pds-badge.css +1 -1
  154. package/dist/css/component-css/pds-banner.css +1 -1
  155. package/dist/css/component-css/pds-bar-chart.css +1 -0
  156. package/dist/css/component-css/pds-branch-diff.css +1 -1
  157. package/dist/css/component-css/pds-breadcrumb.css +1 -1
  158. package/dist/css/component-css/pds-button-link.css +1 -1
  159. package/dist/css/component-css/pds-button-nav.css +1 -1
  160. package/dist/css/component-css/pds-button.css +45 -13
  161. package/dist/css/component-css/pds-callout.css +1 -1
  162. package/dist/css/component-css/pds-card-select.css +2 -0
  163. package/dist/css/component-css/pds-card.css +1 -1
  164. package/dist/css/component-css/pds-chart-legend.css +1 -0
  165. package/dist/css/component-css/pds-chart-wrapper.css +1 -0
  166. package/dist/css/component-css/pds-checkbox-group.css +1 -1
  167. package/dist/css/component-css/pds-checkbox.css +1 -1
  168. package/dist/css/component-css/pds-close-button.css +1 -1
  169. package/dist/css/component-css/pds-code-block-legacy.css +1 -1
  170. package/dist/css/component-css/pds-code-block.css +1 -1
  171. package/dist/css/component-css/pds-combobox-multiselect.css +3 -2
  172. package/dist/css/component-css/pds-combobox.css +1 -1
  173. package/dist/css/component-css/pds-compact-empty-state.css +1 -1
  174. package/dist/css/component-css/pds-comparison-list.css +1 -1
  175. package/dist/css/component-css/pds-cta-link.css +1 -1
  176. package/dist/css/component-css/pds-datepicker.css +1 -3
  177. package/dist/css/component-css/pds-drawer.css +1 -0
  178. package/dist/css/component-css/pds-dropdown-menu.css +2 -2
  179. package/dist/css/component-css/pds-dropdown.css +2 -0
  180. package/dist/css/component-css/pds-expansion-panel-group.css +1 -1
  181. package/dist/css/component-css/pds-expansion-panel.css +2 -1
  182. package/dist/css/component-css/pds-file-diff.css +1 -1
  183. package/dist/css/component-css/pds-file-upload.css +3 -3
  184. package/dist/css/component-css/pds-filter-button.css +1 -0
  185. package/dist/css/component-css/pds-full-screen-overlay.css +1 -0
  186. package/dist/css/component-css/pds-horizontal-empty-state.css +1 -1
  187. package/dist/css/component-css/pds-icon-button.css +5 -3
  188. package/dist/css/component-css/pds-icon-story-only.css +1 -1
  189. package/dist/css/component-css/pds-icon.css +1 -1
  190. package/dist/css/component-css/pds-identity-block.css +1 -0
  191. package/dist/css/component-css/pds-index.css +152 -45
  192. package/dist/css/component-css/pds-inline-message.css +1 -1
  193. package/dist/css/component-css/pds-input-group.css +1 -1
  194. package/dist/css/component-css/pds-input-utilities.css +1 -1
  195. package/dist/css/component-css/pds-line-chart.css +1 -0
  196. package/dist/css/component-css/pds-link-new-window.css +1 -1
  197. package/dist/css/component-css/pds-menu-button.css +7 -1
  198. package/dist/css/component-css/pds-modal.css +1 -1
  199. package/dist/css/component-css/pds-nav-menu.css +1 -5
  200. package/dist/css/component-css/pds-navbar.css +4 -1
  201. package/dist/css/component-css/pds-pagination-chapter.css +3 -0
  202. package/dist/css/component-css/pds-pagination-compact.css +1 -0
  203. package/dist/css/component-css/pds-pagination.css +1 -1
  204. package/dist/css/component-css/pds-panel-list.css +1 -1
  205. package/dist/css/component-css/pds-panel-stack.css +1 -0
  206. package/dist/css/component-css/pds-panel.css +2 -1
  207. package/dist/css/component-css/pds-pantheon-logo.css +1 -1
  208. package/dist/css/component-css/pds-payment-icon.css +1 -1
  209. package/dist/css/component-css/pds-picture.css +1 -1
  210. package/dist/css/component-css/pds-pie-chart.css +1 -0
  211. package/dist/css/component-css/pds-platform-icon.css +1 -1
  212. package/dist/css/component-css/pds-popover.css +1 -1
  213. package/dist/css/component-css/pds-progress-bar.css +1 -1
  214. package/dist/css/component-css/pds-progress-ring.css +1 -1
  215. package/dist/css/component-css/pds-proportion-bar.css +1 -0
  216. package/dist/css/component-css/pds-radio-group.css +1 -1
  217. package/dist/css/component-css/pds-result-count.css +1 -0
  218. package/dist/css/component-css/pds-section-message.css +1 -1
  219. package/dist/css/component-css/pds-segmented-button.css +2 -1
  220. package/dist/css/component-css/pds-select.css +1 -1
  221. package/dist/css/component-css/pds-side-nav-global.css +3 -5
  222. package/dist/css/component-css/pds-side-nav.css +3 -1
  223. package/dist/css/component-css/pds-site-footer.css +1 -1
  224. package/dist/css/component-css/pds-site-search.css +1 -0
  225. package/dist/css/component-css/pds-skeleton.css +1 -1
  226. package/dist/css/component-css/pds-skiplink.css +1 -1
  227. package/dist/css/component-css/pds-sortable-list.css +8 -0
  228. package/dist/css/component-css/pds-spinner.css +1 -1
  229. package/dist/css/component-css/pds-split-button.css +1 -1
  230. package/dist/css/component-css/pds-sso-button.css +2 -2
  231. package/dist/css/component-css/pds-status-badge.css +1 -1
  232. package/dist/css/component-css/pds-status-checker.css +1 -0
  233. package/dist/css/component-css/pds-status-indicator.css +1 -1
  234. package/dist/css/component-css/pds-step-list.css +1 -0
  235. package/dist/css/component-css/pds-stepper.css +3 -1
  236. package/dist/css/component-css/pds-switch.css +6 -11
  237. package/dist/css/component-css/pds-tab-menu.css +2 -2
  238. package/dist/css/component-css/pds-table-of-contents.css +1 -1
  239. package/dist/css/component-css/pds-table.css +5 -1
  240. package/dist/css/component-css/pds-tabs.css +1 -1
  241. package/dist/css/component-css/pds-tag.css +1 -1
  242. package/dist/css/component-css/pds-tags-input.css +1 -1
  243. package/dist/css/component-css/pds-tally.css +1 -1
  244. package/dist/css/component-css/pds-text-input.css +1 -1
  245. package/dist/css/component-css/pds-textarea.css +1 -1
  246. package/dist/css/component-css/pds-theme-switcher.css +1 -1
  247. package/dist/css/component-css/pds-timepicker.css +1 -0
  248. package/dist/css/component-css/pds-toaster.css +1 -1
  249. package/dist/css/component-css/pds-tooltip.css +1 -1
  250. package/dist/css/component-css/pds-tree-nav.css +1 -0
  251. package/dist/css/component-css/pds-user-menu-story-only.css +1 -1
  252. package/dist/css/component-css/pds-user-menu.css +32 -1
  253. package/dist/css/component-css/pds-utility-bar.css +1 -0
  254. package/dist/css/component-css/pds-utility-button.css +3 -1
  255. package/dist/css/component-css/pds-vertical-empty-state.css +1 -1
  256. package/dist/css/component-css/pds-vertical-stepper.css +1 -1
  257. package/dist/css/component-css/pds-video-embed.css +1 -1
  258. package/dist/css/component-css/pds-workspace-selector.css +26 -1
  259. package/dist/css/design-tokens/variables.dark.css +385 -338
  260. package/dist/css/design-tokens/variables.global.css +10 -18
  261. package/dist/css/design-tokens/variables.light.css +376 -309
  262. package/dist/css/design-tokens/variables.typography.css +1 -2
  263. package/dist/css/layout-css/pds-app-layout.css +3 -2
  264. package/dist/css/layout-css/pds-docs-layout.css +1 -1
  265. package/dist/css/layout-css/pds-index.css +3 -9
  266. package/dist/css/layout-css/pds-sidebar-layout.css +5 -0
  267. package/dist/css/layout-css/pds-stepper-layout.css +1 -1
  268. package/dist/css/layout-css/pds-three-item-layout.css +1 -1
  269. package/dist/css/layout-css/pds-two-item-layout.css +1 -1
  270. package/dist/css/pds-components.css +152 -45
  271. package/dist/css/pds-core.css +3 -2
  272. package/dist/css/pds-layouts.css +3 -9
  273. package/dist/index.css +5 -1
  274. package/dist/index.d.ts +95 -7
  275. package/dist/index.js +12738 -4787
  276. package/dist/index.js.map +1 -1
  277. package/dist/index.source.d.ts +44 -41
  278. package/dist/layouts/AppLayout/AppLayout.d.ts +85 -10
  279. package/dist/layouts/DocsLayout/DocsLayout.d.ts +9 -7
  280. package/dist/layouts/SidebarLayout/SidebarLayout.d.ts +16 -6
  281. package/dist/layouts/StepperLayout/StepperLayout.d.ts +13 -1
  282. package/dist/layouts/ThreeItemLayout/ThreeItemLayout.d.ts +3 -3
  283. package/dist/layouts/TwoItemLayout/TwoItemLayout.d.ts +3 -3
  284. package/dist/libs/components/NavAccordion/NavAccordion.d.ts +27 -0
  285. package/dist/libs/components/StatusDot/StatusDot.d.ts +15 -0
  286. package/dist/libs/components/utils.d.ts +1 -1
  287. package/dist/libs/types/custom-types.d.ts +11 -5
  288. package/dist/libs/types/layout-types.d.ts +4 -1
  289. package/dist/libs/types/navigation-types.d.ts +17 -1
  290. package/dist/svg/anglesDown.svg +3 -0
  291. package/dist/svg/anglesUp.svg +3 -0
  292. package/dist/svg/barsStaggered.svg +3 -0
  293. package/dist/svg/bookmark.svg +3 -0
  294. package/dist/svg/bookmarkSolid.svg +3 -0
  295. package/dist/svg/box.svg +3 -0
  296. package/dist/svg/circleExclamationSolid.svg +3 -0
  297. package/dist/svg/circleHalfStroke.svg +3 -0
  298. package/dist/svg/circleInfoSolid.svg +3 -0
  299. package/dist/svg/circleQuestionSolid.svg +3 -0
  300. package/dist/svg/claude.svg +3 -0
  301. package/dist/svg/clock.svg +3 -0
  302. package/dist/svg/collapseToCenter.svg +3 -0
  303. package/dist/svg/compress.svg +3 -0
  304. package/dist/svg/diagramVenn.svg +3 -0
  305. package/dist/svg/floppyDisk.svg +3 -0
  306. package/dist/svg/grid.svg +2 -2
  307. package/dist/svg/grid2.svg +3 -0
  308. package/dist/svg/landmark.svg +3 -0
  309. package/dist/svg/move.svg +3 -0
  310. package/dist/svg/octagonExclamation.svg +3 -0
  311. package/dist/svg/openai.svg +3 -0
  312. package/dist/svg/pause.svg +3 -0
  313. package/dist/svg/penPaintbrush.svg +3 -0
  314. package/dist/svg/sidebar.svg +3 -0
  315. package/dist/svg/slider.svg +3 -0
  316. package/dist/svg/squareDashed.svg +3 -0
  317. package/dist/svg/tableColumns.svg +3 -0
  318. package/dist/svg/userSolid.svg +3 -0
  319. package/dist/{layouts → utilities}/FlexContainer/FlexContainer.d.ts +6 -6
  320. package/dist/utilities/GlobalWrapper/GlobalWrapper.d.ts +35 -0
  321. package/dist/utilities/context-providers/ThemeContext/ThemeContext.d.ts +113 -0
  322. package/dist/utilities/grid/Grid.d.ts +58 -0
  323. package/dist/utilities/grid/GridItem.d.ts +57 -0
  324. package/dist/utilities/hooks/useDropdown/index.d.ts +1 -0
  325. package/dist/utilities/hooks/useDropdown/useDropdown.d.ts +138 -0
  326. package/dist/utilities/hooks/useIsMobile/useIsMobile.d.ts +16 -0
  327. package/dist/utilities/hooks/useKeyPress/useKeyPress.d.ts +6 -0
  328. package/dist/utilities/hooks/useKeyboardShortcut/useKeyboardShortcut.d.ts +29 -0
  329. package/package.json +83 -47
  330. package/tailwind/README.md +220 -0
  331. package/tailwind/TESTING.md +457 -0
  332. package/tailwind/v3/preset.cjs +258 -0
  333. package/tailwind/v4/theme.css +230 -0
  334. package/dist/components/CTASlice/CTASlice.d.ts +0 -43
  335. package/dist/components/CodeBlock/themes/pdsLight.d.ts +0 -2
  336. package/dist/components/DashboardStat/DashboardStat.d.ts +0 -28
  337. package/dist/components/PullQuote/PullQuote.d.ts +0 -34
  338. package/dist/components/SiteDashboardHeading/SiteDashboardHeading.d.ts +0 -62
  339. package/dist/components/SocialLinks/SocialLinks.d.ts +0 -23
  340. package/dist/components/cards/CardHeading/CardHeading.d.ts +0 -31
  341. package/dist/components/cards/CardSelectGroup/CardSelectGroup.d.ts +0 -60
  342. package/dist/components/cards/EmptyStateCard/EmptyStateCard.d.ts +0 -36
  343. package/dist/components/cards/LinksCard/LinksCard.d.ts +0 -29
  344. package/dist/components/cards/LinksCard/links-card-sample-data.d.ts +0 -2
  345. package/dist/components/cards/NewSiteCard/NewSiteCard.d.ts +0 -61
  346. package/dist/components/cards/PaymentCard/PaymentCard.d.ts +0 -47
  347. package/dist/components/cards/PricingCard/PricingCard.d.ts +0 -95
  348. package/dist/components/cards/SiteCard/SiteCard.d.ts +0 -50
  349. package/dist/components/footer/FooterHeading/FooterHeading.d.ts +0 -22
  350. package/dist/components/footer/FooterLinks/FooterLinks.d.ts +0 -26
  351. package/dist/components/footer/SiteFooter/SiteFooter.d.ts +0 -34
  352. package/dist/components/footer/SiteFooter/footer-content.d.ts +0 -1
  353. package/dist/components/navigation/DashboardNav/DashboardNav.d.ts +0 -35
  354. package/dist/components/navigation/DashboardNav/DashboardNavItem.d.ts +0 -24
  355. package/dist/components/navigation/NavMenu/NavMenu.d.ts +0 -33
  356. package/dist/components/navigation/NavMenu/NavMenuDropdown.d.ts +0 -24
  357. package/dist/components/navigation/SideNavCompact/SideNavCompact.d.ts +0 -53
  358. package/dist/components/notifications/NotificationHubIcon/NotificationHubIcon.d.ts +0 -38
  359. package/dist/components/notifications/NotificationsPopover/NotificationsPopover.d.ts +0 -118
  360. package/dist/components/tiles/AvatarTileList/AvatarTileList.d.ts +0 -28
  361. package/dist/components/tiles/Tile/Tile.d.ts +0 -42
  362. package/dist/components/tiles/TileGrid/TileGrid.d.ts +0 -29
  363. package/dist/css/component-css/pds-avatar-tile-list.css +0 -1
  364. package/dist/css/component-css/pds-card-heading.css +0 -1
  365. package/dist/css/component-css/pds-card-select-group.css +0 -1
  366. package/dist/css/component-css/pds-cta-slice.css +0 -1
  367. package/dist/css/component-css/pds-dashboard-nav.css +0 -5
  368. package/dist/css/component-css/pds-dashboard-search.css +0 -1
  369. package/dist/css/component-css/pds-dashboard-stat.css +0 -1
  370. package/dist/css/component-css/pds-empty-state-card.css +0 -1
  371. package/dist/css/component-css/pds-flow-steps.css +0 -1
  372. package/dist/css/component-css/pds-footer-heading.css +0 -1
  373. package/dist/css/component-css/pds-footer-links.css +0 -1
  374. package/dist/css/component-css/pds-links-card.css +0 -1
  375. package/dist/css/component-css/pds-new-site-card.css +0 -1
  376. package/dist/css/component-css/pds-notification-hub-icon.css +0 -1
  377. package/dist/css/component-css/pds-notifications-popover.css +0 -1
  378. package/dist/css/component-css/pds-payment-card.css +0 -1
  379. package/dist/css/component-css/pds-pricing-card-local.css +0 -1
  380. package/dist/css/component-css/pds-pricing-card.css +0 -1
  381. package/dist/css/component-css/pds-pull-quote.css +0 -1
  382. package/dist/css/component-css/pds-refresh-checker.css +0 -1
  383. package/dist/css/component-css/pds-side-nav-compact.css +0 -1
  384. package/dist/css/component-css/pds-site-card.css +0 -1
  385. package/dist/css/component-css/pds-site-dashboard-heading.css +0 -1
  386. package/dist/css/component-css/pds-social-links.css +0 -1
  387. package/dist/css/component-css/pds-tile.css +0 -1
  388. package/dist/css/component-css/pds-tiles-common.css +0 -1
  389. package/dist/css/layout-css/pds-dashboard-global.css +0 -8
  390. package/dist/css/layout-css/pds-dashboard-inner.css +0 -1
  391. package/dist/css/layout-css/pds-flex-container.css +0 -1
  392. package/dist/layouts/DashboardGlobal/DashboardGlobal.d.ts +0 -57
  393. package/dist/layouts/DashboardInner/DashboardInner.d.ts +0 -30
  394. package/dist/layouts/GlobalWrapper/GlobalWrapper.d.ts +0 -19
  395. package/dist/utilities/context-providers/ResponsiveContext/ResponsiveContext.d.ts +0 -6
  396. /package/dist/components/{Skiplink → links/Skiplink}/Skiplink.d.ts +0 -0
  397. /package/dist/components/{Picture → media/Picture}/Picture.d.ts +0 -0
  398. /package/dist/components/{VideoEmbed → media/VideoEmbed}/VideoEmbed.d.ts +0 -0
  399. /package/dist/components/{Pagination → pagination/Pagination}/usePagination.d.ts +0 -0
  400. /package/dist/components/{FlowSteps → steppers/StepList}/example-steps.d.ts +0 -0
  401. /package/dist/svg/{linkSimple.svg → link.svg} +0 -0
  402. /package/dist/svg/{linkSimpleSlash.svg → unlink.svg} +0 -0
  403. /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,2 +0,0 @@
1
- import type { PrismTheme } from 'prism-react-renderer';
2
- export declare const pdsLight: PrismTheme;
@@ -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,62 +0,0 @@
1
- import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { SitePlanLevel, SiteType } from '../../libs/types/custom-types';
3
- import './site-dashboard-heading.css';
4
- /**
5
- * Prop types for SiteDashboardHeading
6
- */
7
- export interface SiteDashboardHeadingProps extends ComponentPropsWithoutRef<'div'> {
8
- /**
9
- * Additional class names
10
- */
11
- className?: string;
12
- /**
13
- * Function to handle upgrade click.
14
- */
15
- handleUpgradeClick?: () => void;
16
- /**
17
- * Function to handle popover content.
18
- */
19
- popoverContent?: ReactNode;
20
- /**
21
- * Function to handle popover open state.
22
- */
23
- popoverIsOpen?: boolean;
24
- /**
25
- * Title for the popover.
26
- */
27
- popoverTitle?: string;
28
- /**
29
- * Function to set popover open state.
30
- */
31
- setPopoverIsOpen?: (isOpen: boolean) => void;
32
- /**
33
- * Name of the site.
34
- */
35
- siteName: string;
36
- /**
37
- * Site plan level.
38
- */
39
- sitePlanLevel?: SitePlanLevel | (string & {});
40
- /**
41
- * Site type.
42
- */
43
- siteType?: SiteType;
44
- /**
45
- * Additional props to pass to the trigger component. Accepts any HTML div attributes.
46
- */
47
- triggerProps?: ComponentPropsWithoutRef<'div'> & {
48
- [key: `data-${string}`]: string | undefined;
49
- };
50
- /**
51
- * Label for the upgrade button.
52
- */
53
- upgradeLabel: string;
54
- /**
55
- * Name of the workspace.
56
- */
57
- workspaceName?: string;
58
- }
59
- /**
60
- * SiteDashboardHeading UI component
61
- */
62
- export declare const SiteDashboardHeading: ({ className, handleUpgradeClick, popoverContent, popoverIsOpen, popoverTitle, setPopoverIsOpen, siteName, sitePlanLevel, siteType, triggerProps, upgradeLabel, workspaceName, ...props }: SiteDashboardHeadingProps) => import("react/jsx-runtime").JSX.Element;
@@ -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 {};