@arbor-education/design-system.components 4.8.0 → 4.9.1

package/src/components/fileUpload/fileUpload.scss

@@ -3,6 +3,14 @@
   flex-direction: column;
   gap: var(--spacing-small);
 
+  &__error {
+    color: var(--form-field-text-error-color-error-text);
+
+    .ds-icon {
+      color: var(--form-field-text-error-color-error-icon);
+    }
+  }
+
   &__file {
     display: flex;
     flex-direction: row;

package/src/components/widget/Widget.stories.tsx

@@ -352,7 +352,7 @@ const FixedHeightOverflowTemplate = () => (
   <FixedHeightWidgetContainer>
     <Widget>
       <Widget.Header>Favourites</Widget.Header>
-      <Widget.Body>
+      <Widget.Body tabIndex={0} aria-label="Favourites">
         <ul style={{ margin: 0, padding: 0, listStyle: 'none' }}>
           {Array.from({ length: 20 }, (_, index) => (
             <li key={index} style={{ padding: 'var(--spacing-xsmall) 0' }}>

package/src/components/widget/WidgetBody.tsx

@@ -5,12 +5,13 @@ import { useWidgetContext } from './WidgetContext.js';
 export type WidgetBodyProps = {
   children?: React.ReactNode;
   className?: string;
-};
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export const WidgetBody = (props: WidgetBodyProps): React.JSX.Element => {
   const {
     children,
     className,
+    ...rest
   } = props;
 
   const {
@@ -49,6 +50,7 @@ export const WidgetBody = (props: WidgetBodyProps): React.JSX.Element => {
 
   return (
     <div
+      {...rest}
       id={bodyId}
       className={classNames(
         'ds-widget__body',