[CmdPal] Introduce Small, Medium, and Large sizing options for Details (#43956)

<!-- Enter a brief description/summary of your PR here. What does it
fix/what does it change/how was it tested (even manually, if necessary)?
-->
## Summary of the Pull Request
This PR introduces 3 new sizing options to the Details Panel in the
Extensions API.
- `Small` (Default)
- `Medium`
- `Large`
<!-- Please review the items on the PR checklist before submitting-->
## PR Checklist

- [x] Closes: #43251
<!-- - [ ] Closes: #yyy (add separate lines for additional resolved
issues) -->
- [ ] **Communication:** I've discussed this with core contributors
already. If the work hasn't been agreed, this work might be rejected
- [ ] **Tests:** Added/updated and all pass
- [ ] **Localization:** All end-user-facing strings can be localized
- [ ] **Dev docs:** Added/updated
- [ ] **New binaries:** Added on the required places
- [ ] [JSON for
signing](https://github.com/microsoft/PowerToys/blob/main/.pipelines/ESRPSigning_core.json)
for new binaries
- [ ] [WXS for
installer](https://github.com/microsoft/PowerToys/blob/main/installer/PowerToysSetup/Product.wxs)
for new binaries and localization folder
- [ ] [YML for CI
pipeline](https://github.com/microsoft/PowerToys/blob/main/.pipelines/ci/templates/build-powertoys-steps.yml)
for new test projects
- [ ] [YML for signed
pipeline](https://github.com/microsoft/PowerToys/blob/main/.pipelines/release.yml)
- [ ] **Documentation updated:** If checked, please file a pull request
on [our docs
repo](https://github.com/MicrosoftDocs/windows-uwp/tree/docs/hub/powertoys)
and link it here: #xxx

<!-- Provide a more detailed description of the PR, other things fixed,
or any additional comments/features here -->
## Detailed Description of the Pull Request / Additional comments

Here's how it looks like:
```csharp
new ListItem(new NoOpCommand())
{
    Title = "Details on ListItems (Medium)",
    Details = new Details()
    {
        Title = "This item has medium details size",
        Body = "Each of these items can have a `Body` formatted with **Markdown**",
        Size = ContentSize.Medium,
    },
},
```

### Moving Pictures


![DetailsSize](https://github.com/user-attachments/assets/ae11b767-ecba-4b39-bd81-3e77eec93ed0)


<!-- Describe how you validated the behavior. Add automated tests
wherever possible, but list manual validation steps taken as well -->
## Validation Steps Performed
This commit is contained in:
Guilherme
2025-12-10 22:25:45 -03:00
committed by GitHub
parent 995bbdc62d
commit a08fc0921f
6 changed files with 110 additions and 5 deletions

View File

@@ -5,7 +5,6 @@
using System;
using Microsoft.CommandPalette.Extensions;
using Microsoft.CommandPalette.Extensions.Toolkit;
using Microsoft.UI.Xaml;
namespace SamplePagesExtension;
@@ -23,14 +22,34 @@ internal sealed partial class SampleListPageWithDetails : ListPage
return [
new ListItem(new NoOpCommand())
{
Title = "This page demonstrates Details on ListItems",
Title = "Details on ListItems (Small)",
Details = new Details()
{
Title = "List Item 1",
Title = "This item has default details size",
Body = "Each of these items can have a `Body` formatted with **Markdown**",
},
},
new ListItem(new NoOpCommand())
{
Title = "Details on ListItems (Medium)",
Details = new Details()
{
Title = "This item has medium details size",
Body = "Each of these items can have a `Body` formatted with **Markdown**",
Size = ContentSize.Medium,
},
},
new ListItem(new NoOpCommand())
{
Title = "Details on ListItems (Large)",
Details = new Details()
{
Title = "This item has large details size",
Body = "Each of these items can have a `Body` formatted with **Markdown**",
Size = ContentSize.Large,
},
},
new ListItem(new NoOpCommand())
{
Title = "This one has a subtitle too",
Subtitle = "Example Subtitle",
@@ -70,11 +89,13 @@ internal sealed partial class SampleListPageWithDetails : ListPage
new ListItem(new NoOpCommand())
{
Title = "This one has metadata",
Subtitle = "And Large Details panel",
Tags = [],
Details = new Details()
{
Title = "Metadata Example",
Body = "Each of the sections below is some sample metadata",
Size = ContentSize.Large,
Metadata = [
new DetailsElement()
{