@performant-software/semantic-components 1.0.10-beta.1 → 1.0.10-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@performant-software/semantic-components",
-  "version": "1.0.10-beta.1",
+  "version": "1.0.10-beta.2",
   "description": "A package of shared components based on the Semantic UI Framework.",
   "license": "MIT",
   "main": "./build/index.js",
@@ -12,7 +12,7 @@
     "build": "webpack --mode production && flow-copy-source -v src types"
   },
   "dependencies": {
-    "@performant-software/shared-components": "^1.0.10-beta.1",
+    "@performant-software/shared-components": "^1.0.10-beta.2",
     "@react-google-maps/api": "^2.8.1",
     "axios": "^0.26.1",
     "i18next": "^19.4.4",

package/src/components/FileUploadModal.js

@@ -28,6 +28,11 @@ type Props = {
    */
   closeOnComplete?: boolean,
 
+  /**
+   * Component to render at top of modal.
+   */
+  headerComponent?: ComponentType<any>,
+
   /**
    * Component to render within the modal.
    */
@@ -343,6 +348,13 @@ const FileUploadModal: ComponentType<any> = (props: Props) => {
     );
   }, [statuses, props.strategy]);
 
+  /**
+   * Memoization and case correction for the <code>headerComponent</code> prop.
+   *
+   * @type {React$AbstractComponent<*, *>}
+   */
+  const HeaderComponent = useMemo(() => props.headerComponent, [props.headerComponent]);
+
   /**
    * Memoization and case correction for the <code>itemComponent</code> prop.
    *
@@ -404,6 +416,13 @@ const FileUploadModal: ComponentType<any> = (props: Props) => {
             <FileUpload
               onFilesAdded={onAddFiles}
             />
+            { HeaderComponent && (
+              <HeaderComponent
+                items={items}
+                onSetItems={setItems}
+                uploading={uploading}
+              />
+            )}
             <Item.Group
               as={Form}
               divided

package/types/components/FileUploadModal.js.flow

@@ -28,6 +28,11 @@ type Props = {
    */
   closeOnComplete?: boolean,
 
+  /**
+   * Component to render at top of modal.
+   */
+  headerComponent?: ComponentType<any>,
+
   /**
    * Component to render within the modal.
    */
@@ -343,6 +348,13 @@ const FileUploadModal: ComponentType<any> = (props: Props) => {
     );
   }, [statuses, props.strategy]);
 
+  /**
+   * Memoization and case correction for the <code>headerComponent</code> prop.
+   *
+   * @type {React$AbstractComponent<*, *>}
+   */
+  const HeaderComponent = useMemo(() => props.headerComponent, [props.headerComponent]);
+
   /**
    * Memoization and case correction for the <code>itemComponent</code> prop.
    *
@@ -404,6 +416,13 @@ const FileUploadModal: ComponentType<any> = (props: Props) => {
             <FileUpload
               onFilesAdded={onAddFiles}
             />
+            { HeaderComponent && (
+              <HeaderComponent
+                items={items}
+                onSetItems={setItems}
+                uploading={uploading}
+              />
+            )}
             <Item.Group
               as={Form}
               divided