PowerCAT Code Components v1.0.2

PowerCAT Code Components

These code components are part of Creator-Kit. Refer the link below to know more on how to use each of these components.

https://docs.microsoft.com/en-us/power-platform/guidance/creator-kit/overview

Code component changes in v1.0.2

FluentDetailsList

The following changes are made to the FluentDetailsList code-component:

New features

1. Large dataset paging property
   Turning this on allows using LoadNextPage beyond the canvas app limit of 500 records. The total number of records cannot be determined and so the TotalRecords property will return -1. When the Large dataset paging toggle is on, the total records/total page count should be hidden.
2. Selection preserved
   Previously, when filtering/refreshing items, the selected items would be reset. Provided a unique RecordKey alias is set for the records dataset, the selected items will be preserved where possible.

Breaking Changes

1. ColMultiValueDelimiter spelling has been corrected

ContextMenu

The following changes are made to the ContextMenu code component:

New features

1. New style properties for context menu button to be consistent with other components.

   1. Icon color (Optional) - color of the icon on the context menu button.
   2. Hover icon color (Optional) - color of the icon when hovered over the context menu button.
   3. Icon size (px) (Optional) - the size of the icon on the context menu button.
   4. Font size (px) (Optional) - the size of the text on the context menu button.
   5. Font color (Optional) - the color of the text of the context menu button.
   6. Hover font color (Optional) - the color of the text when hovered over the context menu button.
   7. Fill color (Optional) - the background color of the context menu button.
   8. Hover fill color (Optional) is the background color when hovering over the context menu button.

2. Dividers
   Dividers can be added by providing an item that has the ItemDivider set to true:

   {ItemDivider:true}

   

3. Toggled checked items
   An item can now be toggled without the flyout menu being hidden. A variable can be used to define if the item is checked, and then the OnSelect event is used to toggle it:
   E.g. if the item is defined as :

   {ItemKey:"print-autosize",ItemDisplayName:"Auto Size",ItemIconName:"MusicInCollectionFill",ItemParentKey:"print",ItemChecked:!!varAutoPlayChecked}
   

   The OnSelect event would then be:

   If(Self.Selected.ItemKey="print-autosize",Set(varAutoPlayChecked,!varAutoPlayChecked))
   

   

Breaking changes:

1. The BackgroundColor property has been renamed FillColor to be consistent with the other components.

CommandBar

The command bar code component is updated with the same options added to the context menu for dividers & toggle checked items.

Updates to reference app:

The following changes have been made to the reference app.

DetailsListBasic component

Fixed Selection Mode label (and resize to accommodate the longer width):

lblAlignDetailsListBasic.Text ="Selection:"

DetailsListPaging component

Conditionally show record count if not -1:

lblRecordCount.Text: = 
If(FluentDetailsListAccounts.TotalRecords>-1, FluentDetailsListAccounts.TotalRecords & " record(s)  ") & Text(CountRows(FluentDetailsListAccounts.SelectedItems)+0) & " selected" 

ContextMenuSimple component

Updated styles:

ContextMenuStyled.FontColor = ddFillColor.Selected.TextColor
ContextMenuStyled.FillColor = ddFillColor.Selected.BackgroundColor
ContextMenuStyled.BorderColor = "transparent"
ContextMenuStyled.HoverBorderColor = ddFillColor.Selected.HoverBorderColor

Updated items to add a div separator and checkbox:

Table(
    {ItemKey:"root",ItemDisplayName:"Click for ContextualMenu"},
    {ItemKey:"newItem",ItemDisplayName:"New",ItemIconName:"Add"},
    {ItemKey:"upload",ItemDisplayName:"Upload",ItemIconName:"Add",ItemIconColor:"salmon"},
    {ItemKey:"share",ItemDisplayName:"Share",ItemIconName:"Share"},
    {ItemDivider:true},
    {ItemKey:"print",ItemDisplayName:"Print",ItemIconName:"Print"},
    {ItemKey:"printall",ItemDisplayName:"Print all",ItemIconName:"Print",ItemParentKey:"print"},
    {ItemKey:"printpages",ItemDisplayName:"Print specific pages",ItemIconName:"Page",ItemParentKey:"print"},
    {ItemKey:"print-autosize",ItemDisplayName:"Auto Size",ItemIconName:"MusicInCollectionFill",ItemParentKey:"print",ItemChecked:!!varAutoPlayChecked},
    {ItemKey:"music",ItemDisplayName:"Music",ItemIconName:"MusicInCollectionFill",ItemEnabled:false}
)

Updated OnSelect event to check item:

If(Self.Selected.ItemKey="print-autosize",Set(varAutoPlayChecked,!varAutoPlayChecked))

Updated code tab to match the above.

PowerCAT Code Components v1.0.1

PowerCAT Code Components

These code components are part of Creator-Kit. Refer the link below to know more on how to use each of these components.

https://docs.microsoft.com/en-us/power-platform/guidance/creator-kit/overview