Skip to content

Commit

Permalink
New Control PropertyFieldButton (#613)
Browse files Browse the repository at this point in the history
* commit changes new control  PropertyFieldButton

* new Control Button

* commit changes new control  PropertyFieldButton
  • Loading branch information
joaojmendes committed Apr 18, 2024
1 parent 95b2f16 commit 8899932
Show file tree
Hide file tree
Showing 11 changed files with 1,748 additions and 1,277 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
51 changes: 51 additions & 0 deletions docs/documentation/docs/controls/PropertyFieldButton.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
# PropertyFieldButton control

This control generates a Button Control .

**PropertyFieldButton example usage**

![PropertyFieldButton example](../assets/propertyFieldButton.gif)

## How to use this control in your solutions

- Check that you installed the `@pnp/spfx-property-controls` dependency. Check out The [getting started](../../#getting-started) page for more information about installing the dependency.
- Import the following modules to your component:

```TypeScript
import { PropertyFieldButton} from '@pnp/spfx-property-controls/lib/PropertyFieldButton';
```

- Add the custom property control to the `groupFields` of the web part property pane configuration:

```TypeScript
PropertyFieldButton("", {
text={"Button"}
key={"buttonID"}
disabled={false}
className={className}
styles={styles}
onClick={()=>{alert("Button Clicked")}}
iconProps={iconProps}
isPrimary={true}
isVIsible={true}

})
```

## Implementation

The `PropertyFieldButton` control can be configured with the following properties:

| Property | Type | Required | Description |
| --------- | -------------- | -------- | ---------------------------------------------------------- |
| key | string | yes | An unique key that indicates the identity of this control. |
| styles | IButtonStyles | no | styles object |
| classname | string | no | css ClassName |
| isVisible | boolean | yes | Indicate if button is visible |
| text | string | no | text of button |
| isPrimary | boolean | yes | indicate Button is a primary button |
| iconProps | IIconProps | no | text of button |
| disable | boolean | no | Disable control |
| onClick | (e:any) =>void | yes | Onclick function |

![](https://telemetry.sharepointpnp.com/sp-dev-fx-property-controls/wiki/PropertyFieldButton)
Loading

0 comments on commit 8899932

Please sign in to comment.