Skip to content

Commit

Permalink
Update documentation
Browse files Browse the repository at this point in the history
  • Loading branch information
jordanbaird committed Dec 16, 2023
1 parent 9ec0345 commit 68f1b27
Show file tree
Hide file tree
Showing 6 changed files with 42 additions and 6 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

## Topics

### Types of styles
### Color well style types

- ``DefaultColorWellStyle``
- ``MinimalColorWellStyle``
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@

- ``ColorWellStyle/default``

### Creating a default color well style
### Creating the style

- ``init()``
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@

- ``ColorWellStyle/expanded``

### Creating an expanded color well style
### Creating the style

- ``init()``
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@

- ``ColorWellStyle/minimal``

### Creating a minimal color well style
### Creating the style

- ``init()``
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,32 @@ If you apply the style to a container view, as in the example above, all the col

![Two color wells, both displayed in the expanded style](expanded-style)

### Modifying the color selection popover

When you use the ``ColorWellStyle/expanded`` or ``ColorWellStyle/minimal`` color well styles, the color well displays a popover with a grid of selectable color swatches. You can customize the colors that are displayed using the ``colorWellSwatchColors(_:)`` modifier:

```swift
ColorWellView(selection: $color)
.colorWellSwatchColors([
.red, .orange, .yellow, .green, .blue, .indigo,
.purple, .brown, .gray, .black, .white,
])
.colorWellStyle(.expanded)
```

### Providing a custom secondary action

As a control, the main action of a color well is always a color selection. By default, a color well's secondary action displays a popover with a grid of selectable color swatches, as described above. You can replace this behavior using the ``colorWellSecondaryAction(_:)`` modifier:

```swift
ColorWellView(selection: $color)
.colorWellSecondaryAction {
print("color well was pressed")
}
```

The example above will print the text "color well was pressed" to the console instead of showing the popover.

## Topics

### Creating a color well
Expand Down
14 changes: 12 additions & 2 deletions Sources/ColorWellKit/Views/SwiftUI/ViewModifiers.swift
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,10 @@ extension View {
/// Sets the colors of the swatches in color selection popovers
/// displayed by color wells in this view.
///
/// - Note: If the ``colorWellSecondaryAction(_:)`` modifier is
/// also applied, the color wells in this view perform the provided
/// action instead, and this modifier has no effect.
///
/// - Parameter colors: The colors to use to create the swatches.
@available(macOS 11.0, *)
public func colorWellSwatchColors(_ colors: [Color]) -> some View {
Expand All @@ -29,8 +33,14 @@ extension View {
/// Sets an action to perform when the color areas of color wells
/// in this view are pressed.
///
/// - Parameter action: An action to perform when the color area
/// of the color well is pressed.
/// - Note: If this modifier is applied, the color wells in this
/// view perform the provided action instead of displaying the
/// default color selection popover. As such, modifiers that alter
/// the default popover (such as ``colorWellSwatchColors(_:)``)
/// do not take effect if this modifier is also applied.
///
/// - Parameter action: An action to perform when the color areas
/// of color wells in this view are pressed.
public func colorWellSecondaryAction(_ action: @escaping () -> Void) -> some View {
transformEnvironment(\.colorWellSecondaryActionDelegate) { delegate in
delegate = ColorWellSecondaryActionDelegate(action: action)
Expand Down

0 comments on commit 68f1b27

Please sign in to comment.