Allow FilePicker button to be hidden

Author: joelfmrodrigues

docs/documentation/docs/controls/FilePicker.md

@@ -62,11 +62,13 @@ The FilePicker component can be configured with the following properties:
   buttonIconProps | IIconProps | no | In case it is provided the file picker will be rendered as an Icon the and all can define Properties for Icon  |
 | onSave | (filePickerResult: IFilePickerResult) => void | yes | Handler when the file has been selected and picker has been closed. |
 | onChange | (filePickerResult: IFilePickerResult) => void | no | Handler when the file selection has been changed. |
+| onCancel | () => void | no | Handler when file picker has been cancelled. |
 | context | BaseComponentContext | yes | Current context. |
 | accepts | string[] | no | Array of strings containing allowed files extensions. E.g. [".gif", ".jpg", ".jpeg", ".bmp", ".dib", ".tif", ".tiff", ".ico", ".png", ".jxr", ".svg"] |
 | required | boolean | no | Sets the label to inform that the value is required. |
 | bingAPIKey | string | no | Used to execute WebSearch. If not provided SearchTab will not be available. |
 | disabled | boolean | no | Specifies if the picker button is disabled |
+| hidden | boolean | no | Specifies if the picker button is hidden (if hidden, panel visibility can still be controlled with isPanelOpen) |
 | itemsCountQueryLimit | number | no | Number of items to obtain when executing REST queries. Default 100. |
 | hideRecentTab | boolean | no | Specifies if RecentTab should be hidden. |
 | hideWebSearchTab | boolean | no | Specifies if WebSearchTab should be hidden. |
@@ -77,6 +79,7 @@ The FilePicker component can be configured with the following properties:
 | hideLocalUploadTab | boolean | no | Specifies if LocalUploadTab should be hidden. |
 | hideLinkUploadTab | boolean | no | Specifies if LinkUploadTab should be hidden. |
 | storeLastActiveTab | boolean | no | Specifies if last active tab will be stored after the Upload panel has been closed. Note: the value of selected tab is stored in the queryString hash. Default `true` |
+| isPanelOpen | boolean | no | Specifies if the file picker panel is open by default or not |
 | renderCustomUploadTabContent | (filePickerResult: IFilePickerResult) => JSX.Element \| null | no | Optional renderer to add custom user-defined fields to "Upload" tab |
 | renderCustomLinkTabContent | (filePickerResult: IFilePickerResult) => JSX.Element \| null | no | Optional renderer to add custom user-defined fields to "Link" tab |
 | includePageLibraries | boolean | no | Specifies if Site Pages library to be visible on Sites tab |

src/controls/filePicker/FilePicker.tsx

@@ -169,12 +169,13 @@ export class FilePicker extends React.Component<
 
     return (
       <div className={`pnp__file-picker`}>
-        {this.props.label && (
+        {!this.props.hidden && this.props.label && (
           <Label required={this.props.required}>{this.props.label}</Label>
         )}
-        {this.props.buttonIcon || this.props.buttonIconProps ? (
+        {!this.props.hidden && (this.props.buttonIcon || this.props.buttonIconProps) ? (
           <ActionButton iconProps={buttonIconProps} {...buttonProps} />
         ) : (
+          !this.props.hidden &&
           <PrimaryButton {...buttonProps} />
         )}
 

src/controls/filePicker/IFilePickerProps.ts

@@ -18,16 +18,16 @@ export interface IFilePickerProps {
    * Specifies the icon to be used to display Icon Button.
    */
   buttonIcon?: string;
- /**
-   * Specifies props for icon to be used to display Icon Button.
-   */
+  /**
+    * Specifies props for icon to be used to display Icon Button.
+    */
   buttonIconProps?: IIconProps;
 
 
   /**
    * Handler when the file has been selected
    */
-  onSave:(filePickerResult: IFilePickerResult)=>void;
+  onSave: (filePickerResult: IFilePickerResult) => void;
 
   /**
    * Handler when file has been changed.
@@ -69,6 +69,11 @@ export interface IFilePickerProps {
    */
   disabled?: boolean;
 
+  /**
+   * Specifies if the picker button is hidden (if hidden, panel visibility can still be controlled with isPanelOpen)
+   */
+  hidden?: boolean;
+
   /**
    * Number of itmes to obtain when executing REST queries. Default 100.
    */