@arbor-education/design-system.components 0.25.9 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.gather/instructions/project-overview.md +1 -1
- package/.github/workflows/release.yml +3 -1
- package/.storybook/main.ts +12 -6
- package/CHANGELOG.md +20 -0
- package/CONTRIBUTING.md +7 -5
- package/component-library.md +97 -3
- package/dist/components/emptyState/EmptyState.d.ts +22 -0
- package/dist/components/emptyState/EmptyState.d.ts.map +1 -0
- package/dist/components/emptyState/EmptyState.js +11 -0
- package/dist/components/emptyState/EmptyState.js.map +1 -0
- package/dist/components/emptyState/EmptyState.stories.d.ts +117 -0
- package/dist/components/emptyState/EmptyState.stories.d.ts.map +1 -0
- package/dist/components/emptyState/EmptyState.stories.js +332 -0
- package/dist/components/emptyState/EmptyState.stories.js.map +1 -0
- package/dist/components/emptyState/EmptyState.test.d.ts +2 -0
- package/dist/components/emptyState/EmptyState.test.d.ts.map +1 -0
- package/dist/components/emptyState/EmptyState.test.js +80 -0
- package/dist/components/emptyState/EmptyState.test.js.map +1 -0
- package/dist/components/favourite/FavouriteButton.d.ts +18 -0
- package/dist/components/favourite/FavouriteButton.d.ts.map +1 -0
- package/dist/components/favourite/FavouriteButton.js +16 -0
- package/dist/components/favourite/FavouriteButton.js.map +1 -0
- package/dist/components/favourite/FavouriteButton.test.d.ts +2 -0
- package/dist/components/favourite/FavouriteButton.test.d.ts.map +1 -0
- package/dist/components/favourite/FavouriteButton.test.js +37 -0
- package/dist/components/favourite/FavouriteButton.test.js.map +1 -0
- package/dist/components/filterBar/FilterBar.d.ts +1 -1
- package/dist/components/filterBar/FilterBar.stories.d.ts +1 -1
- package/dist/components/icon/Icon.d.ts +1 -1
- package/dist/components/icon/Icon.d.ts.map +1 -1
- package/dist/components/icon/Icon.js +1 -1
- package/dist/components/icon/Icon.js.map +1 -1
- package/dist/components/pill/Pill.d.ts +3 -2
- package/dist/components/pill/Pill.d.ts.map +1 -1
- package/dist/components/pill/Pill.js +15 -9
- package/dist/components/pill/Pill.js.map +1 -1
- package/dist/components/pill/Pill.stories.d.ts +21 -3
- package/dist/components/pill/Pill.stories.d.ts.map +1 -1
- package/dist/components/pill/Pill.stories.js +275 -40
- package/dist/components/pill/Pill.stories.js.map +1 -1
- package/dist/components/pill/Pill.test.js +64 -3
- package/dist/components/pill/Pill.test.js.map +1 -1
- package/dist/components/sideNavigation/SideNavigation.d.ts +34 -0
- package/dist/components/sideNavigation/SideNavigation.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigation.js +30 -0
- package/dist/components/sideNavigation/SideNavigation.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigation.stories.d.ts +72 -0
- package/dist/components/sideNavigation/SideNavigation.stories.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigation.stories.js +298 -0
- package/dist/components/sideNavigation/SideNavigation.stories.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigation.test.d.ts +2 -0
- package/dist/components/sideNavigation/SideNavigation.test.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigation.test.js +74 -0
- package/dist/components/sideNavigation/SideNavigation.test.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationContext.d.ts +10 -0
- package/dist/components/sideNavigation/SideNavigationContext.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationContext.js +15 -0
- package/dist/components/sideNavigation/SideNavigationContext.js.map +1 -0
- package/dist/components/{sidebarNav/SidebarNavGroup.d.ts → sideNavigation/SideNavigationGroup.d.ts} +3 -3
- package/dist/components/sideNavigation/SideNavigationGroup.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationGroup.js +16 -0
- package/dist/components/sideNavigation/SideNavigationGroup.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationGroup.test.d.ts +2 -0
- package/dist/components/sideNavigation/SideNavigationGroup.test.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationGroup.test.js +58 -0
- package/dist/components/sideNavigation/SideNavigationGroup.test.js.map +1 -0
- package/dist/components/{sidebarNav/SidebarNavItem.d.ts → sideNavigation/SideNavigationItem.d.ts} +11 -12
- package/dist/components/sideNavigation/SideNavigationItem.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationItem.js +28 -0
- package/dist/components/sideNavigation/SideNavigationItem.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationItem.test.d.ts +2 -0
- package/dist/components/sideNavigation/SideNavigationItem.test.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationItem.test.js +65 -0
- package/dist/components/sideNavigation/SideNavigationItem.test.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationItemFavourite.d.ts +8 -0
- package/dist/components/sideNavigation/SideNavigationItemFavourite.d.ts.map +1 -0
- package/dist/components/{sidebarNav/SidebarNavItemFavourite.js → sideNavigation/SideNavigationItemFavourite.js} +5 -5
- package/dist/components/sideNavigation/SideNavigationItemFavourite.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationItemFavourite.test.d.ts +2 -0
- package/dist/components/sideNavigation/SideNavigationItemFavourite.test.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationItemFavourite.test.js +31 -0
- package/dist/components/sideNavigation/SideNavigationItemFavourite.test.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTitle.d.ts +4 -0
- package/dist/components/sideNavigation/SideNavigationTitle.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTitle.js +7 -0
- package/dist/components/sideNavigation/SideNavigationTitle.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTitle.test.d.ts +2 -0
- package/dist/components/sideNavigation/SideNavigationTitle.test.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTitle.test.js +22 -0
- package/dist/components/sideNavigation/SideNavigationTitle.test.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTooltip.d.ts +7 -0
- package/dist/components/sideNavigation/SideNavigationTooltip.d.ts.map +1 -0
- package/dist/components/{sidebarNav/SidebarNavTooltip.js → sideNavigation/SideNavigationTooltip.js} +2 -2
- package/dist/components/sideNavigation/SideNavigationTooltip.js.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTooltip.test.d.ts +2 -0
- package/dist/components/sideNavigation/SideNavigationTooltip.test.d.ts.map +1 -0
- package/dist/components/sideNavigation/SideNavigationTooltip.test.js +26 -0
- package/dist/components/sideNavigation/SideNavigationTooltip.test.js.map +1 -0
- package/dist/components/sideNavigation/resolvePanelItemProps.d.ts +4 -0
- package/dist/components/sideNavigation/resolvePanelItemProps.d.ts.map +1 -0
- package/dist/components/{sidebarNav → sideNavigation}/resolvePanelItemProps.js +5 -4
- package/dist/components/sideNavigation/resolvePanelItemProps.js.map +1 -0
- package/dist/components/sideNavigation/resolvePanelItemProps.test.d.ts.map +1 -0
- package/dist/components/{sidebarNav → sideNavigation}/resolvePanelItemProps.test.js +18 -4
- package/dist/components/sideNavigation/resolvePanelItemProps.test.js.map +1 -0
- package/dist/components/sideNavigation/types.d.ts +47 -0
- package/dist/components/sideNavigation/types.d.ts.map +1 -0
- package/dist/components/sideNavigation/types.js +2 -0
- package/dist/components/sideNavigation/types.js.map +1 -0
- package/dist/components/sidebar/Sidebar.d.ts +13 -0
- package/dist/components/sidebar/Sidebar.d.ts.map +1 -0
- package/dist/components/sidebar/Sidebar.js +9 -0
- package/dist/components/sidebar/Sidebar.js.map +1 -0
- package/dist/components/sidebar/Sidebar.stories.d.ts +48 -0
- package/dist/components/sidebar/Sidebar.stories.d.ts.map +1 -0
- package/dist/components/sidebar/Sidebar.stories.js +444 -0
- package/dist/components/sidebar/Sidebar.stories.js.map +1 -0
- package/dist/components/sidebar/Sidebar.test.d.ts +2 -0
- package/dist/components/sidebar/Sidebar.test.d.ts.map +1 -0
- package/dist/components/sidebar/Sidebar.test.js +81 -0
- package/dist/components/sidebar/Sidebar.test.js.map +1 -0
- package/dist/components/sidebar/SidebarItem.d.ts +7 -0
- package/dist/components/sidebar/SidebarItem.d.ts.map +1 -0
- package/dist/components/sidebar/SidebarItem.js +11 -0
- package/dist/components/sidebar/SidebarItem.js.map +1 -0
- package/dist/components/singleUser/SingleUser.d.ts +1 -1
- package/dist/components/table/Table.d.ts.map +1 -1
- package/dist/components/table/Table.js +2 -1
- package/dist/components/table/Table.js.map +1 -1
- package/dist/components/table/Table.stories.d.ts.map +1 -1
- package/dist/components/table/Table.stories.js +24 -70
- package/dist/components/table/Table.stories.js.map +1 -1
- package/dist/components/table/cellEditors/DateCellEditor.stories.d.ts.map +1 -1
- package/dist/components/table/cellEditors/DateCellEditor.stories.js +16 -13
- package/dist/components/table/cellEditors/DateCellEditor.stories.js.map +1 -1
- package/dist/components/table/cellRenderers/BooleanCellRenderer.stories.d.ts.map +1 -1
- package/dist/components/table/cellRenderers/BooleanCellRenderer.stories.js +6 -7
- package/dist/components/table/cellRenderers/BooleanCellRenderer.stories.js.map +1 -1
- package/dist/components/table/cellRenderers/ButtonCellRenderer.stories.d.ts.map +1 -1
- package/dist/components/table/cellRenderers/ButtonCellRenderer.stories.js +7 -8
- package/dist/components/table/cellRenderers/ButtonCellRenderer.stories.js.map +1 -1
- package/dist/components/table/cellRenderers/CheckboxCellRenderer.stories.d.ts.map +1 -1
- package/dist/components/table/cellRenderers/CheckboxCellRenderer.stories.js +7 -8
- package/dist/components/table/cellRenderers/CheckboxCellRenderer.stories.js.map +1 -1
- package/dist/components/table/cellRenderers/InlineTextCellRenderer.stories.d.ts.map +1 -1
- package/dist/components/table/cellRenderers/InlineTextCellRenderer.stories.js +7 -8
- package/dist/components/table/cellRenderers/InlineTextCellRenderer.stories.js.map +1 -1
- package/dist/components/table/cellRenderers/NumberInputCellRenderer.stories.d.ts.map +1 -1
- package/dist/components/table/cellRenderers/NumberInputCellRenderer.stories.js +12 -15
- package/dist/components/table/cellRenderers/NumberInputCellRenderer.stories.js.map +1 -1
- package/dist/components/table/cellRenderers/SelectDropdownCellRenderer.stories.d.ts.map +1 -1
- package/dist/components/table/cellRenderers/SelectDropdownCellRenderer.stories.js +19 -29
- package/dist/components/table/cellRenderers/SelectDropdownCellRenderer.stories.js.map +1 -1
- package/dist/components/table/columnTypes.d.ts +3 -0
- package/dist/components/table/columnTypes.d.ts.map +1 -0
- package/dist/components/table/columnTypes.js +55 -0
- package/dist/components/table/columnTypes.js.map +1 -0
- package/dist/components/tabs/TabsItem.stories.d.ts +2 -2
- package/dist/components/toast/Toast.d.ts +11 -2
- package/dist/components/toast/Toast.d.ts.map +1 -1
- package/dist/components/toast/Toast.js +5 -3
- package/dist/components/toast/Toast.js.map +1 -1
- package/dist/components/toast/Toast.stories.d.ts +15 -3
- package/dist/components/toast/Toast.stories.d.ts.map +1 -1
- package/dist/components/toast/Toast.stories.js +43 -41
- package/dist/components/toast/Toast.stories.js.map +1 -1
- package/dist/components/toast/Toast.test.js +19 -4
- package/dist/components/toast/Toast.test.js.map +1 -1
- package/dist/components/toast/ToastAction.d.ts +7 -0
- package/dist/components/toast/ToastAction.d.ts.map +1 -0
- package/dist/components/toast/ToastAction.js +9 -0
- package/dist/components/toast/ToastAction.js.map +1 -0
- package/dist/components/toggleGroup/ToggleGroup.stories.js +1 -1
- package/dist/components/toggleGroup/ToggleGroup.stories.js.map +1 -1
- package/dist/components/tooltip/TooltipWrapper.d.ts +1 -0
- package/dist/components/tooltip/TooltipWrapper.d.ts.map +1 -1
- package/dist/components/tooltip/TooltipWrapper.js +2 -2
- package/dist/components/tooltip/TooltipWrapper.js.map +1 -1
- package/dist/components/widget/Widget.d.ts +18 -0
- package/dist/components/widget/Widget.d.ts.map +1 -0
- package/dist/components/widget/Widget.js +51 -0
- package/dist/components/widget/Widget.js.map +1 -0
- package/dist/components/widget/Widget.stories.d.ts +128 -0
- package/dist/components/widget/Widget.stories.d.ts.map +1 -0
- package/dist/components/widget/Widget.stories.js +417 -0
- package/dist/components/widget/Widget.stories.js.map +1 -0
- package/dist/components/widget/Widget.test.d.ts +2 -0
- package/dist/components/widget/Widget.test.d.ts.map +1 -0
- package/dist/components/widget/Widget.test.js +110 -0
- package/dist/components/widget/Widget.test.js.map +1 -0
- package/dist/components/widget/WidgetBody.d.ts +6 -0
- package/dist/components/widget/WidgetBody.d.ts.map +1 -0
- package/dist/components/widget/WidgetBody.js +20 -0
- package/dist/components/widget/WidgetBody.js.map +1 -0
- package/dist/components/widget/WidgetContext.d.ts +20 -0
- package/dist/components/widget/WidgetContext.d.ts.map +1 -0
- package/dist/components/widget/WidgetContext.js +10 -0
- package/dist/components/widget/WidgetContext.js.map +1 -0
- package/dist/components/widget/WidgetHeader.d.ts +8 -0
- package/dist/components/widget/WidgetHeader.d.ts.map +1 -0
- package/dist/components/widget/WidgetHeader.js +56 -0
- package/dist/components/widget/WidgetHeader.js.map +1 -0
- package/dist/components/widget/types.d.ts +43 -0
- package/dist/components/widget/types.d.ts.map +1 -0
- package/dist/components/widget/types.js +2 -0
- package/dist/components/widget/types.js.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendar.d.ts +35 -0
- package/dist/components/widgetCalendar/WidgetCalendar.d.ts.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendar.js +22 -0
- package/dist/components/widgetCalendar/WidgetCalendar.js.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendar.stories.d.ts +60 -0
- package/dist/components/widgetCalendar/WidgetCalendar.stories.d.ts.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendar.stories.js +140 -0
- package/dist/components/widgetCalendar/WidgetCalendar.stories.js.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendar.test.d.ts +2 -0
- package/dist/components/widgetCalendar/WidgetCalendar.test.d.ts.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendar.test.js +88 -0
- package/dist/components/widgetCalendar/WidgetCalendar.test.js.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendarItem.d.ts +17 -0
- package/dist/components/widgetCalendar/WidgetCalendarItem.d.ts.map +1 -0
- package/dist/components/widgetCalendar/WidgetCalendarItem.js +25 -0
- package/dist/components/widgetCalendar/WidgetCalendarItem.js.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavourites.d.ts +12 -0
- package/dist/components/widgetFavourites/WidgetFavourites.d.ts.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavourites.js +23 -0
- package/dist/components/widgetFavourites/WidgetFavourites.js.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavourites.stories.d.ts +84 -0
- package/dist/components/widgetFavourites/WidgetFavourites.stories.d.ts.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavourites.stories.js +210 -0
- package/dist/components/widgetFavourites/WidgetFavourites.stories.js.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavourites.test.d.ts +2 -0
- package/dist/components/widgetFavourites/WidgetFavourites.test.d.ts.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavourites.test.js +67 -0
- package/dist/components/widgetFavourites/WidgetFavourites.test.js.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavouritesItem.d.ts +3 -0
- package/dist/components/widgetFavourites/WidgetFavouritesItem.d.ts.map +1 -0
- package/dist/components/widgetFavourites/WidgetFavouritesItem.js +10 -0
- package/dist/components/widgetFavourites/WidgetFavouritesItem.js.map +1 -0
- package/dist/components/widgetFavourites/types.d.ts +25 -0
- package/dist/components/widgetFavourites/types.d.ts.map +1 -0
- package/dist/components/widgetFavourites/types.js +2 -0
- package/dist/components/widgetFavourites/types.js.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotifications.d.ts +33 -0
- package/dist/components/widgetNotifications/WidgetNotifications.d.ts.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotifications.js +18 -0
- package/dist/components/widgetNotifications/WidgetNotifications.js.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotifications.stories.d.ts +60 -0
- package/dist/components/widgetNotifications/WidgetNotifications.stories.d.ts.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotifications.stories.js +269 -0
- package/dist/components/widgetNotifications/WidgetNotifications.stories.js.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotifications.test.d.ts +2 -0
- package/dist/components/widgetNotifications/WidgetNotifications.test.d.ts.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotifications.test.js +79 -0
- package/dist/components/widgetNotifications/WidgetNotifications.test.js.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotificationsItem.d.ts +14 -0
- package/dist/components/widgetNotifications/WidgetNotificationsItem.d.ts.map +1 -0
- package/dist/components/widgetNotifications/WidgetNotificationsItem.js +14 -0
- package/dist/components/widgetNotifications/WidgetNotificationsItem.js.map +1 -0
- package/dist/index.css +756 -78
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +15 -9
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +15 -8
- package/dist/index.js.map +1 -1
- package/dist/utils/favourites/favouriteConstants.d.ts +12 -0
- package/dist/utils/favourites/favouriteConstants.d.ts.map +1 -0
- package/dist/utils/favourites/favouriteConstants.js +16 -0
- package/dist/utils/favourites/favouriteConstants.js.map +1 -0
- package/dist/utils/favourites/favouriteConstants.test.d.ts +2 -0
- package/dist/utils/favourites/favouriteConstants.test.d.ts.map +1 -0
- package/dist/utils/favourites/favouriteConstants.test.js +12 -0
- package/dist/utils/favourites/favouriteConstants.test.js.map +1 -0
- package/dist/utils/hooks/useControllableBoolean.d.ts.map +1 -0
- package/dist/utils/hooks/useControllableBoolean.js.map +1 -0
- package/dist/utils/hooks/useControllableBoolean.test.d.ts +2 -0
- package/dist/utils/hooks/useControllableBoolean.test.d.ts.map +1 -0
- package/dist/utils/hooks/useControllableBoolean.test.js +34 -0
- package/dist/utils/hooks/useControllableBoolean.test.js.map +1 -0
- package/package.json +10 -11
- package/src/components/emptyState/EmptyState.stories.tsx +487 -0
- package/src/components/emptyState/EmptyState.test.tsx +140 -0
- package/src/components/emptyState/EmptyState.tsx +84 -0
- package/src/components/emptyState/emptyState.scss +63 -0
- package/src/components/favourite/FavouriteButton.test.tsx +83 -0
- package/src/components/favourite/FavouriteButton.tsx +70 -0
- package/src/components/favourite/favouriteButton.scss +37 -0
- package/src/components/icon/Icon.tsx +2 -2
- package/src/components/link/link.scss +26 -0
- package/src/components/pill/Pill.stories.tsx +432 -41
- package/src/components/pill/Pill.test.tsx +74 -3
- package/src/components/pill/Pill.tsx +26 -11
- package/src/components/sideNavigation/SideNavigation.stories.tsx +578 -0
- package/src/components/sideNavigation/SideNavigation.test.tsx +109 -0
- package/src/components/sideNavigation/SideNavigation.tsx +98 -0
- package/src/components/sideNavigation/SideNavigationContext.tsx +25 -0
- package/src/components/sideNavigation/SideNavigationGroup.test.tsx +103 -0
- package/src/components/{sidebarNav/SidebarNavGroup.tsx → sideNavigation/SideNavigationGroup.tsx} +8 -8
- package/src/components/sideNavigation/SideNavigationItem.test.tsx +137 -0
- package/src/components/sideNavigation/SideNavigationItem.tsx +125 -0
- package/src/components/sideNavigation/SideNavigationItemFavourite.test.tsx +54 -0
- package/src/components/{sidebarNav/SidebarNavItemFavourite.tsx → sideNavigation/SideNavigationItemFavourite.tsx} +7 -7
- package/src/components/sideNavigation/SideNavigationTitle.test.tsx +23 -0
- package/src/components/sideNavigation/SideNavigationTitle.tsx +13 -0
- package/src/components/sideNavigation/SideNavigationTooltip.test.tsx +44 -0
- package/src/components/{sidebarNav/SidebarNavTooltip.tsx → sideNavigation/SideNavigationTooltip.tsx} +2 -2
- package/src/components/{sidebarNav → sideNavigation}/resolvePanelItemProps.test.ts +20 -4
- package/src/components/{sidebarNav → sideNavigation}/resolvePanelItemProps.ts +8 -7
- package/src/components/{sidebarNav/sidebarNav.scss → sideNavigation/sideNavigation.scss} +37 -136
- package/src/components/sideNavigation/types.ts +56 -0
- package/src/components/sidebar/Sidebar.stories.tsx +670 -0
- package/src/components/sidebar/Sidebar.test.tsx +155 -0
- package/src/components/sidebar/Sidebar.tsx +27 -0
- package/src/components/sidebar/SidebarItem.tsx +64 -0
- package/src/components/sidebar/sidebar.scss +65 -0
- package/src/components/table/Table.stories.tsx +24 -73
- package/src/components/table/Table.tsx +2 -0
- package/src/components/table/cellEditors/DateCellEditor.stories.tsx +16 -14
- package/src/components/table/cellRenderers/BooleanCellRenderer.stories.tsx +6 -7
- package/src/components/table/cellRenderers/ButtonCellRenderer.stories.tsx +7 -8
- package/src/components/table/cellRenderers/CheckboxCellRenderer.stories.tsx +7 -8
- package/src/components/table/cellRenderers/InlineTextCellRenderer.stories.tsx +7 -8
- package/src/components/table/cellRenderers/NumberInputCellRenderer.stories.tsx +12 -15
- package/src/components/table/cellRenderers/SelectDropdownCellRenderer.stories.tsx +19 -29
- package/src/components/table/columnTypes.ts +56 -0
- package/src/components/toast/Toast.stories.tsx +75 -67
- package/src/components/toast/Toast.test.tsx +40 -10
- package/src/components/toast/Toast.tsx +19 -5
- package/src/components/toast/ToastAction.tsx +17 -0
- package/src/components/toast/toast.scss +37 -0
- package/src/components/toggleGroup/ToggleGroup.stories.tsx +1 -1
- package/src/components/tooltip/TooltipWrapper.tsx +3 -1
- package/src/components/widget/Widget.stories.tsx +600 -0
- package/src/components/widget/Widget.test.tsx +263 -0
- package/src/components/widget/Widget.tsx +102 -0
- package/src/components/widget/WidgetBody.tsx +66 -0
- package/src/components/widget/WidgetContext.tsx +31 -0
- package/src/components/widget/WidgetHeader.tsx +155 -0
- package/src/components/widget/types.ts +47 -0
- package/src/components/widget/widget.scss +218 -0
- package/src/components/widgetCalendar/WidgetCalendar.stories.tsx +241 -0
- package/src/components/widgetCalendar/WidgetCalendar.test.tsx +137 -0
- package/src/components/widgetCalendar/WidgetCalendar.tsx +105 -0
- package/src/components/widgetCalendar/WidgetCalendarItem.tsx +105 -0
- package/src/components/widgetCalendar/widgetCalendar.scss +124 -0
- package/src/components/widgetFavourites/WidgetFavourites.stories.tsx +341 -0
- package/src/components/widgetFavourites/WidgetFavourites.test.tsx +127 -0
- package/src/components/widgetFavourites/WidgetFavourites.tsx +83 -0
- package/src/components/widgetFavourites/WidgetFavouritesItem.tsx +37 -0
- package/src/components/widgetFavourites/types.ts +26 -0
- package/src/components/widgetFavourites/widgetFavourites.scss +84 -0
- package/src/components/widgetNotifications/WidgetNotifications.stories.tsx +417 -0
- package/src/components/widgetNotifications/WidgetNotifications.test.tsx +152 -0
- package/src/components/widgetNotifications/WidgetNotifications.tsx +112 -0
- package/src/components/widgetNotifications/WidgetNotificationsItem.tsx +88 -0
- package/src/components/widgetNotifications/widgetNotifications.scss +186 -0
- package/src/docs/Contributing.mdx +1 -1
- package/src/index.scss +9 -1
- package/src/index.ts +22 -18
- package/src/tokens.scss +12 -2
- package/src/utils/favourites/favouriteConstants.test.ts +19 -0
- package/src/utils/favourites/favouriteConstants.ts +21 -0
- package/src/utils/hooks/useControllableBoolean.test.ts +48 -0
- package/dist/components/sidebarNav/SidebarNav.d.ts +0 -46
- package/dist/components/sidebarNav/SidebarNav.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNav.js +0 -102
- package/dist/components/sidebarNav/SidebarNav.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNav.stories.d.ts +0 -61
- package/dist/components/sidebarNav/SidebarNav.stories.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNav.stories.js +0 -253
- package/dist/components/sidebarNav/SidebarNav.stories.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNav.test.d.ts +0 -2
- package/dist/components/sidebarNav/SidebarNav.test.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNav.test.js +0 -240
- package/dist/components/sidebarNav/SidebarNav.test.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavContext.d.ts +0 -13
- package/dist/components/sidebarNav/SidebarNavContext.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavContext.js +0 -15
- package/dist/components/sidebarNav/SidebarNavContext.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavGroup.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavGroup.js +0 -16
- package/dist/components/sidebarNav/SidebarNavGroup.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavItem.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavItem.js +0 -44
- package/dist/components/sidebarNav/SidebarNavItem.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavItemFavourite.d.ts +0 -8
- package/dist/components/sidebarNav/SidebarNavItemFavourite.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavItemFavourite.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavPanel.d.ts +0 -4
- package/dist/components/sidebarNav/SidebarNavPanel.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavPanel.js +0 -9
- package/dist/components/sidebarNav/SidebarNavPanel.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavPanelNav.d.ts +0 -10
- package/dist/components/sidebarNav/SidebarNavPanelNav.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavPanelNav.js +0 -21
- package/dist/components/sidebarNav/SidebarNavPanelNav.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRail.d.ts +0 -6
- package/dist/components/sidebarNav/SidebarNavRail.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRail.js +0 -7
- package/dist/components/sidebarNav/SidebarNavRail.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRailItem.d.ts +0 -10
- package/dist/components/sidebarNav/SidebarNavRailItem.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRailItem.js +0 -25
- package/dist/components/sidebarNav/SidebarNavRailItem.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRailList.d.ts +0 -4
- package/dist/components/sidebarNav/SidebarNavRailList.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRailList.js +0 -7
- package/dist/components/sidebarNav/SidebarNavRailList.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRailSlot.d.ts +0 -6
- package/dist/components/sidebarNav/SidebarNavRailSlot.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavRailSlot.js +0 -7
- package/dist/components/sidebarNav/SidebarNavRailSlot.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavSeparator.d.ts +0 -6
- package/dist/components/sidebarNav/SidebarNavSeparator.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavSeparator.js +0 -8
- package/dist/components/sidebarNav/SidebarNavSeparator.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavTitle.d.ts +0 -4
- package/dist/components/sidebarNav/SidebarNavTitle.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavTitle.js +0 -7
- package/dist/components/sidebarNav/SidebarNavTitle.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavTooltip.d.ts +0 -7
- package/dist/components/sidebarNav/SidebarNavTooltip.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavTooltip.js.map +0 -1
- package/dist/components/sidebarNav/SidebarNavTrigger.d.ts +0 -8
- package/dist/components/sidebarNav/SidebarNavTrigger.d.ts.map +0 -1
- package/dist/components/sidebarNav/SidebarNavTrigger.js +0 -15
- package/dist/components/sidebarNav/SidebarNavTrigger.js.map +0 -1
- package/dist/components/sidebarNav/index.d.ts +0 -4
- package/dist/components/sidebarNav/index.d.ts.map +0 -1
- package/dist/components/sidebarNav/index.js +0 -3
- package/dist/components/sidebarNav/index.js.map +0 -1
- package/dist/components/sidebarNav/resolvePanelItemProps.d.ts +0 -4
- package/dist/components/sidebarNav/resolvePanelItemProps.d.ts.map +0 -1
- package/dist/components/sidebarNav/resolvePanelItemProps.js.map +0 -1
- package/dist/components/sidebarNav/resolvePanelItemProps.test.d.ts.map +0 -1
- package/dist/components/sidebarNav/resolvePanelItemProps.test.js.map +0 -1
- package/dist/components/sidebarNav/types.d.ts +0 -100
- package/dist/components/sidebarNav/types.d.ts.map +0 -1
- package/dist/components/sidebarNav/types.js +0 -4
- package/dist/components/sidebarNav/types.js.map +0 -1
- package/dist/components/sidebarNav/useControllableBoolean.d.ts.map +0 -1
- package/dist/components/sidebarNav/useControllableBoolean.js.map +0 -1
- package/src/components/sidebarNav/SidebarNav.stories.tsx +0 -484
- package/src/components/sidebarNav/SidebarNav.test.tsx +0 -611
- package/src/components/sidebarNav/SidebarNav.tsx +0 -230
- package/src/components/sidebarNav/SidebarNavContext.tsx +0 -28
- package/src/components/sidebarNav/SidebarNavItem.tsx +0 -162
- package/src/components/sidebarNav/SidebarNavPanel.tsx +0 -20
- package/src/components/sidebarNav/SidebarNavPanelNav.tsx +0 -55
- package/src/components/sidebarNav/SidebarNavRail.tsx +0 -20
- package/src/components/sidebarNav/SidebarNavRailItem.tsx +0 -83
- package/src/components/sidebarNav/SidebarNavRailList.tsx +0 -11
- package/src/components/sidebarNav/SidebarNavRailSlot.tsx +0 -15
- package/src/components/sidebarNav/SidebarNavSeparator.tsx +0 -19
- package/src/components/sidebarNav/SidebarNavTitle.tsx +0 -13
- package/src/components/sidebarNav/SidebarNavTrigger.tsx +0 -52
- package/src/components/sidebarNav/index.ts +0 -6
- package/src/components/sidebarNav/types.ts +0 -126
- /package/dist/components/{sidebarNav → sideNavigation}/resolvePanelItemProps.test.d.ts +0 -0
- /package/dist/{components/sidebarNav → utils/hooks}/useControllableBoolean.d.ts +0 -0
- /package/dist/{components/sidebarNav → utils/hooks}/useControllableBoolean.js +0 -0
- /package/src/{components/sidebarNav → utils/hooks}/useControllableBoolean.ts +0 -0
|
@@ -186,7 +186,7 @@ These rules are non-negotiable. Read CONTRIBUTING.md for the full rationale.
|
|
|
186
186
|
| 400–800 | STOP — write a justification in the PR description, confirm with human |
|
|
187
187
|
| > 800 | STOP — split the PR before continuing |
|
|
188
188
|
|
|
189
|
-
Generated files, `yarn.lock`,
|
|
189
|
+
Generated files, `yarn.lock`, auto-generated types, test files, Storybook stories, and SVGs do NOT count toward these limits. The limit is meant to flag changes that need careful behavioural review — focus it on user-facing or behaviour-altering code.
|
|
190
190
|
|
|
191
191
|
### Quality gates — all must pass before opening a PR
|
|
192
192
|
|
|
@@ -37,7 +37,9 @@ jobs:
|
|
|
37
37
|
run: yarn install --prefer-offline --frozen-lockfile
|
|
38
38
|
|
|
39
39
|
- name: Upgrade npm for Trusted Publishing (OIDC)
|
|
40
|
-
|
|
40
|
+
# Pinned to 11.18.0 - npm@12 dropped Node 20 support (requires node >=22.22.2),
|
|
41
|
+
# which breaks this job since .nvmrc pins Node 20. 11.18.0 supports Node 20 and OIDC publishing.
|
|
42
|
+
run: npm install -g npm@11.18.0
|
|
41
43
|
|
|
42
44
|
- name: Setup automation Git user
|
|
43
45
|
run: |
|
package/.storybook/main.ts
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
// This file has been automatically migrated to valid ESM format by Storybook.
|
|
2
|
+
import { fileURLToPath } from 'node:url';
|
|
1
3
|
import type { StorybookConfig } from '@storybook/react-vite';
|
|
2
|
-
import path from 'path';
|
|
4
|
+
import path, { dirname } from 'path';
|
|
5
|
+
|
|
6
|
+
const __filename = fileURLToPath(import.meta.url);
|
|
7
|
+
const __dirname = dirname(__filename);
|
|
3
8
|
|
|
4
9
|
const config: StorybookConfig = {
|
|
5
10
|
stories: [
|
|
@@ -20,13 +25,14 @@ const config: StorybookConfig = {
|
|
|
20
25
|
options: {},
|
|
21
26
|
},
|
|
22
27
|
viteFinal: async (config) => {
|
|
23
|
-
|
|
24
|
-
config.resolve
|
|
25
|
-
|
|
28
|
+
config.resolve = {
|
|
29
|
+
...config.resolve,
|
|
30
|
+
alias: {
|
|
31
|
+
...config.resolve?.alias,
|
|
26
32
|
Components: path.resolve(__dirname, '../src/components'),
|
|
27
33
|
Utils: path.resolve(__dirname, '../src/utils'),
|
|
28
|
-
}
|
|
29
|
-
}
|
|
34
|
+
},
|
|
35
|
+
};
|
|
30
36
|
return config;
|
|
31
37
|
},
|
|
32
38
|
};
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 1.0.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#230](https://github.com/arbor-education/design-system.components/pull/230) [`57003d3`](https://github.com/arbor-education/design-system.components/commit/57003d3f677485e227f03922e5e551bdce72068f) Thanks [@Alex-DN-SP](https://github.com/Alex-DN-SP)! - MIS-71661 Custom column types
|
|
8
|
+
|
|
9
|
+
## 1.0.0
|
|
10
|
+
|
|
11
|
+
### Major Changes
|
|
12
|
+
|
|
13
|
+
- [#232](https://github.com/arbor-education/design-system.components/pull/232) [`a87b25b`](https://github.com/arbor-education/design-system.components/commit/a87b25bb585eb168f0ec8f6b7fa2b0ca4e79027a) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-72902 version 1.0.0! docs change around how we're using proper SemVer now
|
|
14
|
+
|
|
15
|
+
### Minor Changes
|
|
16
|
+
|
|
17
|
+
- [#215](https://github.com/arbor-education/design-system.components/pull/215) [`c0f59ca`](https://github.com/arbor-education/design-system.components/commit/c0f59ca99b1ce24e2ad96541fdaf0c9479e9ddd6) Thanks [@angusmglfraser](https://github.com/angusmglfraser)! - MIS-70550 ✨ make pill component controllable
|
|
18
|
+
|
|
19
|
+
- [#206](https://github.com/arbor-education/design-system.components/pull/206) [`605f38f`](https://github.com/arbor-education/design-system.components/commit/605f38f40a041a76074937a89ae504f0d1dffe7e) Thanks [@danielpeplow](https://github.com/danielpeplow)! - MIS-71695 — Arrival of several 'Widgets' including a compound `Widget` used as the base for other Widgets. Also a reusable `EmptyState` component. Other Widgets include `WidgetFavourites`, `WidgetNotifications`, and `WidgetCalendar`. Created a reusable FavouriteButton that is now shared between Sidebar Nav and the Favourites Widget items.
|
|
20
|
+
|
|
21
|
+
- [#228](https://github.com/arbor-education/design-system.components/pull/228) [`7d55ecd`](https://github.com/arbor-education/design-system.components/commit/7d55ecdc0410825e2c05f6b9bc0597fd9c4fb188) Thanks [@Alex-DN-SP](https://github.com/Alex-DN-SP)! - MIS-71902 Split Sidebar from side navigation and refactored
|
|
22
|
+
|
|
3
23
|
## 0.25.9
|
|
4
24
|
|
|
5
25
|
### Patch Changes
|
package/CONTRIBUTING.md
CHANGED
|
@@ -37,7 +37,7 @@ Small PRs get reviewed faster, get merged sooner, and carry far lower bug risk.
|
|
|
37
37
|
|
|
38
38
|
### What counts as "lines changed"?
|
|
39
39
|
|
|
40
|
-
Generated files, lockfiles (`yarn.lock`),
|
|
40
|
+
Generated files, lockfiles (`yarn.lock`), auto-generated type definitions, test files, Storybook stories, and SVGs do not count. The limit exists to flag changes that need careful behavioural review, so focus it on user-facing or behaviour-altering code — not the tests, stories, and icon markup that surround it.
|
|
41
41
|
|
|
42
42
|
### How to split a large PR
|
|
43
43
|
|
|
@@ -197,11 +197,13 @@ See [CLAUDE.md](./CLAUDE.md) for the definitive reference. In summary:
|
|
|
197
197
|
|
|
198
198
|
## A Note on Versioning
|
|
199
199
|
|
|
200
|
-
|
|
200
|
+
This project follows semantic versioning (https://semver.org/). Given a version number `MAJOR.MINOR.PATCH`, change levels are determined as follows:
|
|
201
201
|
|
|
202
|
-
- Major version bumps are
|
|
203
|
-
- Minor version bumps are for
|
|
204
|
-
- Patch version bumps are for
|
|
202
|
+
- **Major** version bumps are for breaking changes — anything that requires consumers to change their code (e.g. removing or renaming a prop, changing a component's default behaviour, dropping support for a peer dependency version)
|
|
203
|
+
- **Minor** version bumps are for new, backwards-compatible functionality (e.g. a new component, a new optional prop, a new variant)
|
|
204
|
+
- **Patch** version bumps are for backwards-compatible bug fixes and other non-breaking changes that don't add functionality (e.g. style fixes, accessibility fixes, dependency updates)
|
|
205
|
+
|
|
206
|
+
When creating a changeset (`yarn changeset`), select the change level that matches the impact on consumers, not the size of the code change.
|
|
205
207
|
|
|
206
208
|
---
|
|
207
209
|
|
package/component-library.md
CHANGED
|
@@ -23,7 +23,8 @@ File: `src/tokens.scss` — Auto-generated CSS custom properties on `:root`.
|
|
|
23
23
|
| **Chart colors** | red, blue, teal, green, orange, purple, yellow (1–4 variants each) |
|
|
24
24
|
| **Extended colors** | blue, teal, green, orange, purple, salmon, yellow (050/100/500/800) |
|
|
25
25
|
| **Gradient ramps** | diverging and sequential ramps (050–900) |
|
|
26
|
-
| **Shadow** | `--shadow-small` |
|
|
26
|
+
| **Shadow** | `--shadow-small`, `--shadow-medium` |
|
|
27
|
+
| **Layers** | `--z-index-popup` (1), `--z-index-toast` (10) |
|
|
27
28
|
| **Icon sizes** | `--icon-size-xsmall` (12px), `--icon-size-small` (16px), `--icon-size-medium` (24px) |
|
|
28
29
|
| **Focus** | `--focus-color-focus: var(--color-brand-500)`, `--focus-border: 3px` |
|
|
29
30
|
| **Avatar sizes** | `--avatar-small-size` (1.25rem), `--avatar-medium-size` (2rem), `--avatar-large-size` (3rem), `--avatar-extra-large-size` (6rem) |
|
|
@@ -875,6 +876,98 @@ Component-scoped tokens follow: `--{component}-{state}-{property}` (e.g. `--butt
|
|
|
875
876
|
|
|
876
877
|
---
|
|
877
878
|
|
|
879
|
+
### 26a. EmptyState
|
|
880
|
+
|
|
881
|
+
**File:** `src/components/emptyState/EmptyState.tsx` · **Public export:** Yes
|
|
882
|
+
|
|
883
|
+
**Use case:** Centered empty-state layout for zero-data views. Supports optional illustration, heading, subheading, and a consumer-composed `actions` slot.
|
|
884
|
+
|
|
885
|
+
| Prop | Type | Required | Default | Description |
|
|
886
|
+
|---|---|---|---|---|
|
|
887
|
+
| `heading` | `ReactNode` | Yes | — | Primary heading text |
|
|
888
|
+
| `subHeading` | `ReactNode` | No | — | Supporting description |
|
|
889
|
+
| `illustration` | `ReactNode` | No | — | Decorative icon or image |
|
|
890
|
+
| `orientation` | `'horizontal' \| 'vertical'` | No | `'horizontal'` | Action layout |
|
|
891
|
+
| `actions` | `ReactNode` | No | — | Action buttons |
|
|
892
|
+
| `live` | `boolean` | No | `false` | Sets `aria-live="polite"` when content updates dynamically |
|
|
893
|
+
| `headingLevel` | `1 \| 2 \| 3 \| 4` | No | `4` | HTML heading level (default suits nested use inside `Widget`) |
|
|
894
|
+
| `padding` | `'none' \| 'xs' \| 'sm' \| 'md' \| 'lg'` | No | `'md'` | Container padding |
|
|
895
|
+
|
|
896
|
+
**Key features:**
|
|
897
|
+
- Renders as `<section role="region">` with `aria-labelledby` pointing at the heading
|
|
898
|
+
- Default `headingLevel` is `4` so nested use inside `Widget` (`h3` header) preserves document outline order
|
|
899
|
+
|
|
900
|
+
---
|
|
901
|
+
|
|
902
|
+
### 26b. Widget
|
|
903
|
+
|
|
904
|
+
**File:** `src/components/widget/Widget.tsx` · **Public export:** Yes
|
|
905
|
+
**Public types:** `Widget.Props`, `Widget.HeaderProps`, `Widget.BodyProps`, `Widget.RenderLinkArgs`, `Widget.LinkedProps`, `Widget.CollapsibleProps`, `Widget.StaticProps`
|
|
906
|
+
|
|
907
|
+
**Use case:** Compound dashboard widget wrapping `Card` with header/body composition, optional link navigation, collapsible body, tooltip, and built-in loading/empty/busy body states.
|
|
908
|
+
|
|
909
|
+
**Compound components:**
|
|
910
|
+
|
|
911
|
+
| Sub-component | Description |
|
|
912
|
+
|---|---|
|
|
913
|
+
| `Widget` (root) | Card shell + context provider for state and header modes |
|
|
914
|
+
| `Widget.Header` | Title row (`Heading` level `3`) with `slotStart`, `slotEnd`, heading, optional tooltip icon, and end chevron when linked |
|
|
915
|
+
| `Widget.Body` | Main content; respects root loading/empty/busy flags |
|
|
916
|
+
|
|
917
|
+
**Root props (common):**
|
|
918
|
+
|
|
919
|
+
| Prop | Type | Required | Default | Description |
|
|
920
|
+
|---|---|---|---|---|
|
|
921
|
+
| `tooltip` | `string` | No | — | Renders info icon + `TooltipWrapper` beside heading |
|
|
922
|
+
| `isLoading` | `boolean` | No | `false` | Replaces body with loading indicator |
|
|
923
|
+
| `isEmpty` | `boolean` | No | `false` | Renders `emptyState` instead of body children |
|
|
924
|
+
| `emptyState` | `ReactNode` | No | — | Content when `isEmpty` (typically `<EmptyState />`) |
|
|
925
|
+
| `isFloating` | `boolean` | No | `false` | Applies permanent `--shadow-medium` elevation |
|
|
926
|
+
| `collapsible` | `boolean` | No | `false` | Makes header a collapse toggle (**mutually exclusive with `href`**) |
|
|
927
|
+
|
|
928
|
+
**Linked variant:** `href` (required) + optional `renderLink` + `linkProps`. Auto-injects `chevron-right` at header end alongside optional `slotEnd`.
|
|
929
|
+
|
|
930
|
+
**Invalid combination:** `href` + `collapsible: true` — TypeScript error plus dev runtime throw.
|
|
931
|
+
|
|
932
|
+
---
|
|
933
|
+
|
|
934
|
+
### 26c. WidgetFavourites
|
|
935
|
+
|
|
936
|
+
**File:** `src/components/widgetFavourites/WidgetFavourites.tsx` · **Public export:** Yes
|
|
937
|
+
**Also exports:** `WidgetFavourites.Item` compound component; types via `WidgetFavourites.Props`, `WidgetFavourites.ItemData`
|
|
938
|
+
|
|
939
|
+
**Use case:** Pre-composed favourites dashboard widget — wraps `Widget` with a linked-item list where each row navigates via `href` and exposes a remove button when `onRemoveItem` is provided.
|
|
940
|
+
|
|
941
|
+
**Props:**
|
|
942
|
+
|
|
943
|
+
| Prop | Type | Required | Default | Description |
|
|
944
|
+
|---|---|---|---|---|
|
|
945
|
+
| `heading` | `ReactNode` | Yes | — | Widget header title |
|
|
946
|
+
| `items` | `WidgetFavouritesItemData[]` | Yes | — | Favourite rows (`id`, `label`, `href`, optional `removeLabel`) |
|
|
947
|
+
| `onRemoveItem` | `(id: string) => void` | No | — | Shows remove button; parent handles confirm/undo |
|
|
948
|
+
| `emptyState` | `ReactNode` | No | built-in `EmptyState` | Shown when `items` is empty |
|
|
949
|
+
|
|
950
|
+
**Item fields:** `id`, `label`, `href`, optional `removeLabel` (defaults to `FAVOURITE_TOOLTIP.remove`).
|
|
951
|
+
|
|
952
|
+
**Shared utilities:** `FAVOURITE_*`, `getFavouriteTooltip`, `getFavouriteRemovedToastMessage`.
|
|
953
|
+
|
|
954
|
+
**Key features:**
|
|
955
|
+
- Remove button uses shared internal `FavouriteButton` with tooltip and `aria-label`
|
|
956
|
+
- Override per-row tooltip via `items[].removeLabel`
|
|
957
|
+
- Row link and remove button are siblings — remove does not nest inside the link
|
|
958
|
+
|
|
959
|
+
### 26d. WidgetNotifications
|
|
960
|
+
|
|
961
|
+
**File:** `src/components/widgetNotifications/WidgetNotifications.tsx` · **Public export:** Yes
|
|
962
|
+
|
|
963
|
+
**Use case:** Pre-composed notifications dashboard widget with mark-all-as-read header action, read/unread row styling, clear buttons, and `<time>` timestamps.
|
|
964
|
+
|
|
965
|
+
**Props:** `heading`, `items`, optional `onItemClick`, `onClearItem`, `onMarkAllAsRead`, `markAllAsReadLabel`, `emptyState`, `isFloating`, `tooltip`.
|
|
966
|
+
|
|
967
|
+
**Item fields:** `id`, `title`, `description`, `dateTime` (ISO), `timeLabel`, `isRead`, `clearLabel`.
|
|
968
|
+
|
|
969
|
+
---
|
|
970
|
+
|
|
878
971
|
### 27. Separator
|
|
879
972
|
|
|
880
973
|
**File:** `src/components/separator/Separator.tsx` · **Public export:** Yes
|
|
@@ -1053,10 +1146,11 @@ Component-scoped tokens follow: `--{component}-{state}-{property}` (e.g. `--butt
|
|
|
1053
1146
|
| Prop | Type | Required | Default | Description |
|
|
1054
1147
|
|---|---|---|---|---|
|
|
1055
1148
|
| `variant` | `'information' \| 'danger' \| 'success' \| 'warning'` | No | `'information'` | Semantic variant |
|
|
1056
|
-
| `
|
|
1149
|
+
| `toastContent` | `ReactNode` | Yes | — | Toast message content (rendered as `Toast.Title`) |
|
|
1150
|
+
| `toastActions` | `ReactNode` | No | — | Optional action controls (typically `Toast.Action`) |
|
|
1057
1151
|
| `...rest` | `RadixToast.ToastProps` | No | — | Radix props (e.g. `open`, `onOpenChange`, `duration`) |
|
|
1058
1152
|
|
|
1059
|
-
**Static members:** `Toast.Provider`, `Toast.Viewport`
|
|
1153
|
+
**Static members:** `Toast.Provider`, `Toast.Viewport`, `Toast.Action`
|
|
1060
1154
|
|
|
1061
1155
|
**Variant icon map:** `information` → `info`, `danger` → `circle-alert`, `success` → `circle-check`, `warning` → `triangle-alert`
|
|
1062
1156
|
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Heading } from '../heading/Heading.js';
|
|
2
|
+
import { type HTMLAttributes } from 'react';
|
|
3
|
+
export type EmptyStatePadding = 'none' | 'xs' | 'sm' | 'md' | 'lg';
|
|
4
|
+
export type EmptyStateHeadingLevel = Heading.Level;
|
|
5
|
+
export type EmptyStateProps = {
|
|
6
|
+
heading: React.ReactNode;
|
|
7
|
+
subHeading?: React.ReactNode;
|
|
8
|
+
illustration?: React.ReactNode;
|
|
9
|
+
orientation?: 'horizontal' | 'vertical';
|
|
10
|
+
actions?: React.ReactNode;
|
|
11
|
+
live?: boolean;
|
|
12
|
+
headingLevel?: EmptyStateHeadingLevel;
|
|
13
|
+
padding?: EmptyStatePadding;
|
|
14
|
+
className?: string;
|
|
15
|
+
} & Omit<HTMLAttributes<HTMLElement>, 'children'>;
|
|
16
|
+
export declare const EmptyState: (props: EmptyStateProps) => React.JSX.Element;
|
|
17
|
+
export declare namespace EmptyState {
|
|
18
|
+
type Props = EmptyStateProps;
|
|
19
|
+
type Padding = EmptyStatePadding;
|
|
20
|
+
type HeadingLevel = EmptyStateHeadingLevel;
|
|
21
|
+
}
|
|
22
|
+
//# sourceMappingURL=EmptyState.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/emptyState/EmptyState.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAS,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACnE,MAAM,MAAM,sBAAsB,GAAG,OAAO,CAAC,KAAK,CAAC;AAEnD,MAAM,MAAM,eAAe,GAAG;IAC5B,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC,CAAC;AAElD,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,KAAG,KAAK,CAAC,GAAG,CAAC,OA0D7D,CAAC;AAEF,yBAAiB,UAAU,CAAC;IAC1B,KAAY,KAAK,GAAG,eAAe,CAAC;IACpC,KAAY,OAAO,GAAG,iBAAiB,CAAC;IACxC,KAAY,YAAY,GAAG,sBAAsB,CAAC;CACnD"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import classNames from 'classnames';
|
|
3
|
+
import { Heading } from '../heading/Heading.js';
|
|
4
|
+
import { useId } from 'react';
|
|
5
|
+
export const EmptyState = (props) => {
|
|
6
|
+
const { heading, subHeading, illustration, orientation = 'horizontal', actions, live = false, headingLevel = 4, padding = 'md', className, ...rest } = props;
|
|
7
|
+
const headingId = useId();
|
|
8
|
+
const hasActions = Boolean(actions);
|
|
9
|
+
return (_jsxs("section", { role: "region", "aria-live": live ? 'polite' : undefined, "aria-labelledby": headingId, className: classNames('ds-empty-state', padding !== 'none' && `ds-empty-state--padding-${padding}`, className), ...rest, children: [illustration && (_jsx("div", { className: "ds-empty-state__illustration", "aria-hidden": "true", children: illustration })), _jsx(Heading, { id: headingId, level: headingLevel, className: "ds-empty-state__heading", children: heading }), subHeading && (_jsx("p", { className: "ds-empty-state__sub-heading", children: subHeading })), hasActions && (_jsx("div", { className: classNames('ds-empty-state__actions', `ds-empty-state__actions--${orientation}`), children: actions }))] }));
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=EmptyState.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../../src/components/emptyState/EmptyState.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,KAAK,EAAuB,MAAM,OAAO,CAAC;AAiBnD,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAAsB,EAAqB,EAAE;IACtE,MAAM,EACJ,OAAO,EACP,UAAU,EACV,YAAY,EACZ,WAAW,GAAG,YAAY,EAC1B,OAAO,EACP,IAAI,GAAG,KAAK,EACZ,YAAY,GAAG,CAAC,EAChB,OAAO,GAAG,IAAI,EACd,SAAS,EACT,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,MAAM,SAAS,GAAG,KAAK,EAAE,CAAC;IAC1B,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAEpC,OAAO,CACL,mBACE,IAAI,EAAC,QAAQ,eACF,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,qBACrB,SAAS,EAC1B,SAAS,EAAE,UAAU,CACnB,gBAAgB,EAChB,OAAO,KAAK,MAAM,IAAI,2BAA2B,OAAO,EAAE,EAC1D,SAAS,CACV,KACG,IAAI,aAEP,YAAY,IAAI,CACf,cAAK,SAAS,EAAC,8BAA8B,iBAAa,MAAM,YAC7D,YAAY,GACT,CACP,EACD,KAAC,OAAO,IACN,EAAE,EAAE,SAAS,EACb,KAAK,EAAE,YAAY,EACnB,SAAS,EAAC,yBAAyB,YAElC,OAAO,GACA,EACT,UAAU,IAAI,CACb,YAAG,SAAS,EAAC,6BAA6B,YACvC,UAAU,GACT,CACL,EACA,UAAU,IAAI,CACb,cACE,SAAS,EAAE,UAAU,CACnB,yBAAyB,EACzB,4BAA4B,WAAW,EAAE,CAC1C,YAEA,OAAO,GACJ,CACP,IACO,CACX,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { EmptyState } from './EmptyState.js';
|
|
3
|
+
import type { ComponentProps } from 'react';
|
|
4
|
+
declare function EmptyStateDocsPage(): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
declare const meta: {
|
|
6
|
+
title: string;
|
|
7
|
+
component: (props: import("./EmptyState.js").EmptyStateProps) => React.JSX.Element;
|
|
8
|
+
parameters: {
|
|
9
|
+
layout: string;
|
|
10
|
+
docs: {
|
|
11
|
+
page: typeof EmptyStateDocsPage;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
tags: string[];
|
|
15
|
+
argTypes: {
|
|
16
|
+
heading: {
|
|
17
|
+
control: "text";
|
|
18
|
+
description: string;
|
|
19
|
+
table: {
|
|
20
|
+
type: {
|
|
21
|
+
summary: string;
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
subHeading: {
|
|
26
|
+
control: "text";
|
|
27
|
+
description: string;
|
|
28
|
+
table: {
|
|
29
|
+
type: {
|
|
30
|
+
summary: string;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
padding: {
|
|
35
|
+
control: "select";
|
|
36
|
+
options: string[];
|
|
37
|
+
description: string;
|
|
38
|
+
table: {
|
|
39
|
+
type: {
|
|
40
|
+
summary: string;
|
|
41
|
+
};
|
|
42
|
+
defaultValue: {
|
|
43
|
+
summary: string;
|
|
44
|
+
};
|
|
45
|
+
};
|
|
46
|
+
};
|
|
47
|
+
orientation: {
|
|
48
|
+
control: "radio";
|
|
49
|
+
options: string[];
|
|
50
|
+
description: string;
|
|
51
|
+
table: {
|
|
52
|
+
type: {
|
|
53
|
+
summary: string;
|
|
54
|
+
};
|
|
55
|
+
defaultValue: {
|
|
56
|
+
summary: string;
|
|
57
|
+
};
|
|
58
|
+
};
|
|
59
|
+
};
|
|
60
|
+
live: {
|
|
61
|
+
control: "boolean";
|
|
62
|
+
description: string;
|
|
63
|
+
table: {
|
|
64
|
+
type: {
|
|
65
|
+
summary: string;
|
|
66
|
+
};
|
|
67
|
+
defaultValue: {
|
|
68
|
+
summary: string;
|
|
69
|
+
};
|
|
70
|
+
};
|
|
71
|
+
};
|
|
72
|
+
headingLevel: {
|
|
73
|
+
control: {
|
|
74
|
+
type: "select";
|
|
75
|
+
};
|
|
76
|
+
options: number[];
|
|
77
|
+
description: string;
|
|
78
|
+
table: {
|
|
79
|
+
type: {
|
|
80
|
+
summary: string;
|
|
81
|
+
};
|
|
82
|
+
defaultValue: {
|
|
83
|
+
summary: string;
|
|
84
|
+
};
|
|
85
|
+
};
|
|
86
|
+
};
|
|
87
|
+
illustration: {
|
|
88
|
+
control: false;
|
|
89
|
+
};
|
|
90
|
+
actions: {
|
|
91
|
+
control: false;
|
|
92
|
+
};
|
|
93
|
+
className: {
|
|
94
|
+
control: false;
|
|
95
|
+
};
|
|
96
|
+
};
|
|
97
|
+
};
|
|
98
|
+
export default meta;
|
|
99
|
+
type Story = StoryObj<typeof EmptyState>;
|
|
100
|
+
export declare const Default: {
|
|
101
|
+
args: {
|
|
102
|
+
heading: string;
|
|
103
|
+
subHeading: string;
|
|
104
|
+
orientation: string;
|
|
105
|
+
live: boolean;
|
|
106
|
+
headingLevel: number;
|
|
107
|
+
padding: string;
|
|
108
|
+
};
|
|
109
|
+
render: (args: ComponentProps<typeof EmptyState>) => import("react/jsx-runtime").JSX.Element;
|
|
110
|
+
};
|
|
111
|
+
export declare const WithoutIllustrationTwoActions: Story;
|
|
112
|
+
export declare const WithoutIllustrationTertiaryAction: Story;
|
|
113
|
+
export declare const WithIllustrationNoActions: Story;
|
|
114
|
+
export declare const WithInlineLinkInSubHeading: Story;
|
|
115
|
+
export declare const PaddingVariants: Story;
|
|
116
|
+
export declare const InsideWidget: Story;
|
|
117
|
+
//# sourceMappingURL=EmptyState.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmptyState.stories.d.ts","sourceRoot":"","sources":["../../../src/components/emptyState/EmptyState.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAa5D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AA8E5C,iBAAS,kBAAkB,4CAmB1B;AAED,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DyB,CAAC;AAEpC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAwGzC,eAAO,MAAM,OAAO;;;;;;;;;mBASH,cAAc,CAAC,OAAO,UAAU,CAAC;CAUjD,CAAC;AAEF,eAAO,MAAM,6BAA6B,EAAE,KAiC3C,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,KAgC/C,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAiCvC,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KAgCxC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAoC1B,CAAC"}
|