@arbor-education/design-system.components 0.25.8 → 1.0.0
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/CODEOWNERS +1 -0
- package/.snyk +3 -0
- package/CHANGELOG.md +20 -0
- package/CODEOWNERS +2 -1
- package/CONTRIBUTING.md +7 -5
- package/component-library.md +97 -3
- package/dist/components/datePicker/DatePicker.d.ts.map +1 -1
- package/dist/components/datePicker/DatePicker.js +8 -6
- package/dist/components/datePicker/DatePicker.js.map +1 -1
- package/dist/components/datePicker/DatePickerCalendar.d.ts +10 -0
- package/dist/components/datePicker/DatePickerCalendar.d.ts.map +1 -0
- package/dist/components/datePicker/DatePickerCalendar.js +9 -0
- package/dist/components/datePicker/DatePickerCalendar.js.map +1 -0
- package/dist/components/dateTimePicker/DateTimePicker.d.ts.map +1 -1
- package/dist/components/dateTimePicker/DateTimePicker.js +11 -8
- package/dist/components/dateTimePicker/DateTimePicker.js.map +1 -1
- 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/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/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 +850 -205
- 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 +1 -1
- package/src/components/datePicker/DatePicker.tsx +30 -35
- package/src/components/datePicker/DatePickerCalendar.tsx +46 -0
- package/src/components/dateTimePicker/DateTimePicker.tsx +66 -38
- package/src/components/dateTimePicker/dateTimePicker.scss +0 -2
- 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/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/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
|
|
package/.github/CODEOWNERS
CHANGED
package/.snyk
ADDED
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 1.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#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
|
|
8
|
+
|
|
9
|
+
### Minor Changes
|
|
10
|
+
|
|
11
|
+
- [#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
|
|
12
|
+
|
|
13
|
+
- [#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.
|
|
14
|
+
|
|
15
|
+
- [#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
|
|
16
|
+
|
|
17
|
+
## 0.25.9
|
|
18
|
+
|
|
19
|
+
### Patch Changes
|
|
20
|
+
|
|
21
|
+
- [#229](https://github.com/arbor-education/design-system.components/pull/229) [`7a32632`](https://github.com/arbor-education/design-system.components/commit/7a3263280ffa9be97fce06a1f19e3de1efe0a52e) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-71974 fix DatePicker dropdown shift when navigating through months, abstract calendar out for neatness
|
|
22
|
+
|
|
3
23
|
## 0.25.8
|
|
4
24
|
|
|
5
25
|
### Patch Changes
|
package/CODEOWNERS
CHANGED
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
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/datePicker/DatePicker.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/datePicker/DatePicker.tsx"],"names":[],"mappings":"AAaA,OAAO,EAML,KAAK,iBAAiB,EACvB,MAAM,qBAAqB,CAAC;AAM7B,MAAM,MAAM,eAAe,GAAG;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,iBAAiB,CAAC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,4CAmMhD,CAAC;AAEF,yBAAiB,UAAU,CAAC;IAC1B,KAAY,KAAK,GAAG,eAAe,CAAC;CACrC"}
|
|
@@ -3,11 +3,11 @@ import classNames from 'classnames';
|
|
|
3
3
|
import { Button } from '../button/Button.js';
|
|
4
4
|
import { TextInput } from '../formField/inputs/text/TextInput.js';
|
|
5
5
|
import { Popover } from 'radix-ui';
|
|
6
|
-
import { useContext, useEffect, useRef, useState } from 'react';
|
|
7
|
-
import { DayPicker } from 'react-day-picker';
|
|
6
|
+
import { useContext, useEffect, useRef, useState, } from 'react';
|
|
8
7
|
import { PopupParentContext } from '../../utils/popupParent/PopupParentContext.js';
|
|
9
8
|
import { formatNativeDateInputValue, formatTimeInputValue, getDatePlaceholder, mergeDateAndTime, parseNativeDateInputValue, } from './dateInputUtils.js';
|
|
10
9
|
import { DatePickerCalendarHeader } from './DatePickerCalendarHeader.js';
|
|
10
|
+
import { DatePickerCalendar } from './DatePickerCalendar.js';
|
|
11
11
|
const TIME_PRESERVATION_GRANULARITY = 'minute';
|
|
12
12
|
export const DatePicker = (props) => {
|
|
13
13
|
const { className, displayFormat = 'default', onChange, id, hasError, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, value, defaultValue, placeholder, autoFocus, } = props;
|
|
@@ -36,9 +36,9 @@ export const DatePicker = (props) => {
|
|
|
36
36
|
setInputValue(value ? formatNativeDateInputValue(value) : '');
|
|
37
37
|
}
|
|
38
38
|
}, [value, isControlled]);
|
|
39
|
-
const mergeParsedDateWithExistingTime = (parsedDay) =>
|
|
39
|
+
const mergeParsedDateWithExistingTime = (parsedDay) => selectedDate
|
|
40
40
|
? mergeDateAndTime(parsedDay, formatTimeInputValue(selectedDate, TIME_PRESERVATION_GRANULARITY), TIME_PRESERVATION_GRANULARITY)
|
|
41
|
-
: parsedDay
|
|
41
|
+
: parsedDay;
|
|
42
42
|
const onInputChange = (e) => {
|
|
43
43
|
const nextInputValue = e.target.value;
|
|
44
44
|
setInputValue(nextInputValue);
|
|
@@ -90,11 +90,13 @@ export const DatePicker = (props) => {
|
|
|
90
90
|
}
|
|
91
91
|
};
|
|
92
92
|
const popupParentRef = useContext(PopupParentContext);
|
|
93
|
-
return (_jsxs("div", { className: classNames('ds-date-picker', className), children: [_jsxs("div", { className: classNames('ds-date-picker__field', {
|
|
93
|
+
return (_jsxs("div", { className: classNames('ds-date-picker', className), children: [_jsxs("div", { className: classNames('ds-date-picker__field', {
|
|
94
|
+
'ds-date-picker__field--show-hint': showFieldHint,
|
|
95
|
+
}), children: [_jsx(TextInput, { ref: inputRef, type: "date", value: inputValue, onChange: onInputChange, onPointerDown: onFieldHintInputPointerDown, readOnly: hasCustomEmptyHint, id: id, placeholder: showFieldHint ? '' : resolvedPlaceholder, hasError: hasError, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, className: "ds-date-picker__input", autoFocus: autoFocus }), showFieldHint
|
|
94
96
|
? (_jsx("span", { className: "ds-date-picker__field-hint", "aria-hidden": "true", children: overlayHint }))
|
|
95
97
|
: null] }), _jsxs(Popover.Root, { open: isPickerOpen, onOpenChange: open => setIsPickerOpen(open), children: [_jsx(Popover.Trigger, { asChild: true, children: _jsx(Button, { className: "ds-date-picker__button", variant: "text-link", iconLeftName: "date", iconLeftScreenReaderText: "Open date picker" }) }), _jsx(Popover.Portal, { container: popupParentRef.current, children: _jsx(Popover.Content, { align: "end", sideOffset: 5, onOpenAutoFocus: e => e.preventDefault(), onCloseAutoFocus: (e) => {
|
|
96
98
|
e.preventDefault();
|
|
97
99
|
inputRef.current?.focus();
|
|
98
|
-
}, children: _jsxs("div", { className: "ds-date-picker__popup", children: [_jsx(DatePickerCalendarHeader, { month: month, onMonthChange: setMonth }), _jsx(
|
|
100
|
+
}, children: _jsxs("div", { className: "ds-date-picker__popup", children: [_jsx(DatePickerCalendarHeader, { month: month, onMonthChange: setMonth }), _jsx(DatePickerCalendar, { month: month, setMonth: setMonth, selectedDate: selectedDate, onDayPickerSelect: onDayPickerSelect, handleTodayClick: handleTodayClick })] }) }) })] })] }));
|
|
99
101
|
};
|
|
100
102
|
//# sourceMappingURL=DatePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/components/datePicker/DatePicker.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,4CAA4C,CAAC;AACvE,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/components/datePicker/DatePicker.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export type DatePickerCalendarProps = {
|
|
2
|
+
month: Date;
|
|
3
|
+
setMonth: (month: Date) => void;
|
|
4
|
+
selectedDate: Date | undefined;
|
|
5
|
+
onDayPickerSelect: (date?: Date) => void;
|
|
6
|
+
handleTodayClick: () => void;
|
|
7
|
+
className?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare const DatePickerCalendar: (props: DatePickerCalendarProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
//# sourceMappingURL=DatePickerCalendar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatePickerCalendar.d.ts","sourceRoot":"","sources":["../../../src/components/datePicker/DatePickerCalendar.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,EAAE,IAAI,CAAC;IACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,YAAY,EAAE,IAAI,GAAG,SAAS,CAAC;IAC/B,iBAAiB,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACzC,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,OAAO,uBAAuB,4CAgChE,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import classNames from 'classnames';
|
|
3
|
+
import { Button } from '../button/Button.js';
|
|
4
|
+
import { DayPicker } from 'react-day-picker';
|
|
5
|
+
export const DatePickerCalendar = (props) => {
|
|
6
|
+
const { month, setMonth, selectedDate, onDayPickerSelect, handleTodayClick, className, } = props;
|
|
7
|
+
return (_jsx(DayPicker, { fixedWeeks: true, className: classNames('ds-date-picker__calendar', className), month: month, onMonthChange: setMonth, autoFocus: true, role: "application", mode: "single", selected: selectedDate, onSelect: onDayPickerSelect, hideNavigation: true, footer: (_jsx(Button, { variant: "text-link", onClick: handleTodayClick, className: "ds-date-picker__today-button", children: "Today" })) }));
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=DatePickerCalendar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatePickerCalendar.js","sourceRoot":"","sources":["../../../src/components/datePicker/DatePickerCalendar.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAW7C,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAE,EAAE;IACnE,MAAM,EACJ,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,SAAS,GACV,GAAG,KAAK,CAAC;IACV,OAAO,CACL,KAAC,SAAS,IACR,UAAU,QACV,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE,SAAS,CAAC,EAC5D,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,QAAQ,EACvB,SAAS,QACT,IAAI,EAAC,aAAa,EAClB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,iBAAiB,EAC3B,cAAc,QACd,MAAM,EAAE,CACN,KAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,OAAO,EAAE,gBAAgB,EACzB,SAAS,EAAC,8BAA8B,sBAGjC,CACV,GACD,CACH,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/dateTimePicker/DateTimePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAUL,KAAK,2BAA2B,EACjC,MAAM,sCAAsC,CAAC;
|
|
1
|
+
{"version":3,"file":"DateTimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/dateTimePicker/DateTimePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAUL,KAAK,2BAA2B,EACjC,MAAM,sCAAsC,CAAC;AAI9C,OAAO,EAEL,KAAK,eAAe,EACpB,KAAK,SAAS,EACf,MAAM,4CAA4C,CAAC;AAapD,MAAM,MAAM,mBAAmB,GAAG;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,aAAa,CAAC,EAAE,eAAe,CAAC;IAChC,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAC9C,aAAa,CAAC,EAAE,SAAS,EAAE,CAAC;IAC5B,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,mBAAmB,4CA4QxD,CAAC;AAEF,yBAAiB,cAAc,CAAC;IAC9B,KAAY,KAAK,GAAG,mBAAmB,CAAC;IACxC,KAAY,aAAa,GAAG,2BAA2B,CAAC;CACzD"}
|
|
@@ -2,12 +2,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import { Button } from '../button/Button.js';
|
|
4
4
|
import { formatDateTimeInputValue, formatNativeDateTimeInputValue, formatTimeInputValue, getDateTimePlaceholder, getNativeDateTimePlaceholder, mergeDateAndTime, parseDateTimeInputValue, parseNativeDateTimeInputValue, } from '../datePicker/dateInputUtils.js';
|
|
5
|
+
import { DatePickerCalendar } from '../datePicker/DatePickerCalendar.js';
|
|
5
6
|
import { DatePickerCalendarHeader } from '../datePicker/DatePickerCalendarHeader.js';
|
|
6
7
|
import { TextInput } from '../formField/inputs/text/TextInput.js';
|
|
7
|
-
import { TimeInput } from '../formField/inputs/time/TimeInput.js';
|
|
8
|
+
import { TimeInput, } from '../formField/inputs/time/TimeInput.js';
|
|
8
9
|
import { Popover } from 'radix-ui';
|
|
9
|
-
import { useCallback, useContext, useEffect, useRef, useState } from 'react';
|
|
10
|
-
import { DayPicker } from 'react-day-picker';
|
|
10
|
+
import { useCallback, useContext, useEffect, useRef, useState, } from 'react';
|
|
11
11
|
import { PopupParentContext } from '../../utils/popupParent/PopupParentContext.js';
|
|
12
12
|
export const DateTimePicker = (props) => {
|
|
13
13
|
const { className, onChange, id, hasError, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, value, defaultValue, displayFormat = 'native', granularity = 'minute', timeOptions, searchType = 'prefix', highlightStringMatches = false, placeholder, } = props;
|
|
@@ -18,9 +18,10 @@ export const DateTimePicker = (props) => {
|
|
|
18
18
|
const parseInputValue = useCallback((raw) => displayFormat === 'native'
|
|
19
19
|
? parseNativeDateTimeInputValue(raw, granularity)
|
|
20
20
|
: parseDateTimeInputValue(raw, displayFormat, granularity), [displayFormat, granularity]);
|
|
21
|
-
const resolvedPlaceholder = placeholder
|
|
22
|
-
|
|
23
|
-
|
|
21
|
+
const resolvedPlaceholder = placeholder
|
|
22
|
+
?? (isNative
|
|
23
|
+
? getNativeDateTimePlaceholder(granularity)
|
|
24
|
+
: getDateTimePlaceholder(displayFormat, granularity));
|
|
24
25
|
const initialValue = value ?? defaultValue;
|
|
25
26
|
const isControlled = value !== undefined;
|
|
26
27
|
const [month, setMonth] = useState(initialValue ?? new Date());
|
|
@@ -123,11 +124,13 @@ export const DateTimePicker = (props) => {
|
|
|
123
124
|
};
|
|
124
125
|
const popupParentRef = useContext(PopupParentContext);
|
|
125
126
|
const nativeStep = granularity === 'second' ? 1 : 60;
|
|
126
|
-
return (_jsxs("div", { className: classNames('ds-date-time-picker', className), children: [_jsxs("div", { className: classNames('ds-date-time-picker__field', {
|
|
127
|
+
return (_jsxs("div", { className: classNames('ds-date-time-picker', className), children: [_jsxs("div", { className: classNames('ds-date-time-picker__field', {
|
|
128
|
+
'ds-date-time-picker__field--show-hint': showFieldHint,
|
|
129
|
+
}), children: [_jsx(TextInput, { ref: inputRef, type: isNative ? 'datetime-local' : 'text', value: inputValue, onChange: onInputChange, onPointerDown: onNativeFieldHintPointerDown, readOnly: hasCustomEmptyHint, id: id, step: isNative ? nativeStep : undefined, placeholder: showFieldHint ? '' : resolvedPlaceholder, hasError: hasError, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, className: "ds-date-time-picker__input" }), showFieldHint
|
|
127
130
|
? (_jsx("span", { className: "ds-date-time-picker__field-hint", "aria-hidden": "true", children: resolvedPlaceholder }))
|
|
128
131
|
: null] }), _jsxs(Popover.Root, { open: isPickerOpen, onOpenChange: open => setIsPickerOpen(open), children: [_jsx(Popover.Trigger, { asChild: true, children: _jsx(Button, { className: "ds-date-time-picker__button", variant: "text-link", iconLeftName: "date", iconLeftScreenReaderText: "Open date and time picker" }) }), _jsx(Popover.Portal, { container: popupParentRef.current, children: _jsx(Popover.Content, { align: "end", sideOffset: 5, onOpenAutoFocus: e => e.preventDefault(), onCloseAutoFocus: (e) => {
|
|
129
132
|
e.preventDefault();
|
|
130
133
|
inputRef.current?.focus();
|
|
131
|
-
}, children: _jsxs("div", { className: "ds-date-time-picker__popup", children: [_jsx(TimeInput, { className: "ds-date-time-picker__time", "aria-label": "Select time", value: timeInputValue, onValueChange: handleTimeChange, granularity: granularity, options: timeOptions, searchType: searchType, highlightStringMatches: highlightStringMatches, hasError: hasError }), _jsx(DatePickerCalendarHeader, { month: month, onMonthChange: setMonth }), _jsx(
|
|
134
|
+
}, children: _jsxs("div", { className: "ds-date-time-picker__popup", children: [_jsx(TimeInput, { className: "ds-date-time-picker__time", "aria-label": "Select time", value: timeInputValue, onValueChange: handleTimeChange, granularity: granularity, options: timeOptions, searchType: searchType, highlightStringMatches: highlightStringMatches, hasError: hasError }), _jsx(DatePickerCalendarHeader, { month: month, onMonthChange: setMonth }), _jsx(DatePickerCalendar, { month: month, setMonth: setMonth, selectedDate: selectedDateTime, onDayPickerSelect: handleDayPickerSelect, handleTodayClick: handleTodayClick })] }) }) })] })] }));
|
|
132
135
|
};
|
|
133
136
|
//# sourceMappingURL=DateTimePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimePicker.js","sourceRoot":"","sources":["../../../src/components/dateTimePicker/DateTimePicker.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EACL,wBAAwB,EACxB,8BAA8B,EAC9B,oBAAoB,EACpB,sBAAsB,EACtB,4BAA4B,EAC5B,gBAAgB,EAChB,uBAAuB,EACvB,6BAA6B,GAG9B,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,wBAAwB,EAAE,MAAM,gDAAgD,CAAC;AAC1F,OAAO,EAAE,SAAS,EAAE,MAAM,4CAA4C,CAAC;AACvE,OAAO,
|
|
1
|
+
{"version":3,"file":"DateTimePicker.js","sourceRoot":"","sources":["../../../src/components/dateTimePicker/DateTimePicker.tsx"],"names":[],"mappings":"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"}
|
|
@@ -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"}
|