From 7fb597e2eefc3b5c7db4ffa63d196cb3927555c6 Mon Sep 17 00:00:00 2001
From: Jeff Verkoeyen <jverkoey@gmail.com>
Date: Mon, 5 Aug 2024 15:10:28 -0400
Subject: [PATCH] Add float modifier.

Part of https://github.com/jverkoey/slipstream/issues/51.
---
 .../{Views => }/Fundamentals/Fundamentals.md  |  0
 .../{Views => }/Fundamentals/View.md          |  0
 .../{Views => }/Fundamentals/ViewBuilder.md   |  0
 .../Backgrounds-BackgroundImage.md            |  0
 .../TailwindCSS/Borders/Borders-Border.md     |  0
 .../FlexboxAndGrid-AlignItems.md              |  0
 .../FlexboxAndGrid-FlexDirection.md           |  0
 .../FlexboxAndGrid/FlexboxAndGrid-FlexGap.md  |  0
 .../FlexboxAndGrid-JustifyContent.md          |  0
 .../TailwindCSS/Layout/Layout-Display.md      |  0
 .../TailwindCSS/Layout/Layout-Float.md        | 13 ++++++++++++
 .../TailwindCSS/Spacing/Spacing-Margin.md     |  0
 .../TailwindCSS/Spacing/Spacing-Padding.md    |  0
 .../TailwindCSS/TailwindCSS-Classes.md        |  1 +
 .../TailwindCSS/TailwindCSS-Conditions.md     |  0
 .../TransitionsAndAnimations-Animation.md     |  0
 .../Typography/Typography-FontDesign.md       |  0
 .../Typography/Typography-FontSize.md         |  0
 .../Typography/Typography-FontSmoothing.md    |  0
 .../Typography/Typography-FontWeight.md       |  0
 .../Typography/Typography-LineHeight.md       |  0
 .../Typography/Typography-TextAlignment.md    |  0
 .../Typography/Typography-TextColor.md        |  0
 .../W3C/DocumentMetadata/Preload.md           |  0
 .../{Views => }/W3C/EmbeddedContent/Image.md  |  0
 .../{Views => }/W3C/Scripting/Script.md       |  0
 .../W3C/Sections/Sections-Heading.md          |  0
 .../{Views => }/W3C/W3CAttributes.md          |  0
 .../{Views => }/W3C/W3CViews.md               |  0
 .../TailwindCSS/Layout/View+float.swift       | 21 +++++++++++++++++++
 .../Sites/CatalogSiteTests.swift              |  3 ++-
 .../TailwindCSS/Layout/FloatTests.swift       | 12 +++++++++++
 32 files changed, 49 insertions(+), 1 deletion(-)
 rename Sources/Slipstream/Documentation.docc/{Views => }/Fundamentals/Fundamentals.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/Fundamentals/View.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/Fundamentals/ViewBuilder.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Backgrounds/Backgrounds-BackgroundImage.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Borders/Borders-Border.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-AlignItems.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexDirection.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexGap.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-JustifyContent.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Layout/Layout-Display.md (100%)
 create mode 100644 Sources/Slipstream/Documentation.docc/TailwindCSS/Layout/Layout-Float.md
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Spacing/Spacing-Margin.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Spacing/Spacing-Padding.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/TailwindCSS-Classes.md (97%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/TailwindCSS-Conditions.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/TransitionsAndAnimations/TransitionsAndAnimations-Animation.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-FontDesign.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-FontSize.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-FontSmoothing.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-FontWeight.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-LineHeight.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-TextAlignment.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/TailwindCSS/Typography/Typography-TextColor.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/W3C/DocumentMetadata/Preload.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/W3C/EmbeddedContent/Image.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/W3C/Scripting/Script.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/W3C/Sections/Sections-Heading.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/W3C/W3CAttributes.md (100%)
 rename Sources/Slipstream/Documentation.docc/{Views => }/W3C/W3CViews.md (100%)
 create mode 100644 Sources/Slipstream/TailwindCSS/Layout/View+float.swift
 create mode 100644 Tests/SlipstreamTests/TailwindCSS/Layout/FloatTests.swift

diff --git a/Sources/Slipstream/Documentation.docc/Views/Fundamentals/Fundamentals.md b/Sources/Slipstream/Documentation.docc/Fundamentals/Fundamentals.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/Fundamentals/Fundamentals.md
rename to Sources/Slipstream/Documentation.docc/Fundamentals/Fundamentals.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/Fundamentals/View.md b/Sources/Slipstream/Documentation.docc/Fundamentals/View.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/Fundamentals/View.md
rename to Sources/Slipstream/Documentation.docc/Fundamentals/View.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/Fundamentals/ViewBuilder.md b/Sources/Slipstream/Documentation.docc/Fundamentals/ViewBuilder.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/Fundamentals/ViewBuilder.md
rename to Sources/Slipstream/Documentation.docc/Fundamentals/ViewBuilder.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Backgrounds/Backgrounds-BackgroundImage.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Backgrounds/Backgrounds-BackgroundImage.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Backgrounds/Backgrounds-BackgroundImage.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Backgrounds/Backgrounds-BackgroundImage.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Borders/Borders-Border.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Borders/Borders-Border.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Borders/Borders-Border.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Borders/Borders-Border.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-AlignItems.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-AlignItems.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-AlignItems.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-AlignItems.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexDirection.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexDirection.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexDirection.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexDirection.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexGap.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexGap.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexGap.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-FlexGap.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-JustifyContent.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-JustifyContent.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-JustifyContent.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/FlexboxAndGrid/FlexboxAndGrid-JustifyContent.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Layout/Layout-Display.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Layout/Layout-Display.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Layout/Layout-Display.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Layout/Layout-Display.md
diff --git a/Sources/Slipstream/Documentation.docc/TailwindCSS/Layout/Layout-Float.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Layout/Layout-Float.md
new file mode 100644
index 0000000..946f9f6
--- /dev/null
+++ b/Sources/Slipstream/Documentation.docc/TailwindCSS/Layout/Layout-Float.md
@@ -0,0 +1,13 @@
+# Floats
+
+Utilities for controlling the wrapping of content around a view.
+
+## Topics
+
+### Modifiers
+
+- ``View/float(_:condition:)``
+
+### Supporting types
+
+- ``FloatMode``
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Spacing/Spacing-Margin.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Spacing/Spacing-Margin.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Spacing/Spacing-Margin.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Spacing/Spacing-Margin.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Spacing/Spacing-Padding.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Spacing/Spacing-Padding.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Spacing/Spacing-Padding.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Spacing/Spacing-Padding.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TailwindCSS-Classes.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/TailwindCSS-Classes.md
similarity index 97%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TailwindCSS-Classes.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/TailwindCSS-Classes.md
index 107271a..6a431cd 100644
--- a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TailwindCSS-Classes.md
+++ b/Sources/Slipstream/Documentation.docc/TailwindCSS/TailwindCSS-Classes.md
@@ -10,6 +10,7 @@ Slipstream implementations of Tailwind CSS's classes.
 - ``HStack``
 - ``VStack``
 - <doc:Layout-Display>
+- <doc:Layout-Float>
 
 ### Flexbox & Grid
 
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TailwindCSS-Conditions.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/TailwindCSS-Conditions.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TailwindCSS-Conditions.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/TailwindCSS-Conditions.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TransitionsAndAnimations/TransitionsAndAnimations-Animation.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/TransitionsAndAnimations/TransitionsAndAnimations-Animation.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/TransitionsAndAnimations/TransitionsAndAnimations-Animation.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/TransitionsAndAnimations/TransitionsAndAnimations-Animation.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontDesign.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontDesign.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontDesign.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontDesign.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontSize.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontSize.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontSize.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontSize.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontSmoothing.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontSmoothing.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontSmoothing.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontSmoothing.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontWeight.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontWeight.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-FontWeight.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-FontWeight.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-LineHeight.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-LineHeight.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-LineHeight.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-LineHeight.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-TextAlignment.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-TextAlignment.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-TextAlignment.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-TextAlignment.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-TextColor.md b/Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-TextColor.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/TailwindCSS/Typography/Typography-TextColor.md
rename to Sources/Slipstream/Documentation.docc/TailwindCSS/Typography/Typography-TextColor.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/W3C/DocumentMetadata/Preload.md b/Sources/Slipstream/Documentation.docc/W3C/DocumentMetadata/Preload.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/W3C/DocumentMetadata/Preload.md
rename to Sources/Slipstream/Documentation.docc/W3C/DocumentMetadata/Preload.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/W3C/EmbeddedContent/Image.md b/Sources/Slipstream/Documentation.docc/W3C/EmbeddedContent/Image.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/W3C/EmbeddedContent/Image.md
rename to Sources/Slipstream/Documentation.docc/W3C/EmbeddedContent/Image.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/W3C/Scripting/Script.md b/Sources/Slipstream/Documentation.docc/W3C/Scripting/Script.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/W3C/Scripting/Script.md
rename to Sources/Slipstream/Documentation.docc/W3C/Scripting/Script.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/W3C/Sections/Sections-Heading.md b/Sources/Slipstream/Documentation.docc/W3C/Sections/Sections-Heading.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/W3C/Sections/Sections-Heading.md
rename to Sources/Slipstream/Documentation.docc/W3C/Sections/Sections-Heading.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/W3C/W3CAttributes.md b/Sources/Slipstream/Documentation.docc/W3C/W3CAttributes.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/W3C/W3CAttributes.md
rename to Sources/Slipstream/Documentation.docc/W3C/W3CAttributes.md
diff --git a/Sources/Slipstream/Documentation.docc/Views/W3C/W3CViews.md b/Sources/Slipstream/Documentation.docc/W3C/W3CViews.md
similarity index 100%
rename from Sources/Slipstream/Documentation.docc/Views/W3C/W3CViews.md
rename to Sources/Slipstream/Documentation.docc/W3C/W3CViews.md
diff --git a/Sources/Slipstream/TailwindCSS/Layout/View+float.swift b/Sources/Slipstream/TailwindCSS/Layout/View+float.swift
new file mode 100644
index 0000000..601d9ea
--- /dev/null
+++ b/Sources/Slipstream/TailwindCSS/Layout/View+float.swift
@@ -0,0 +1,21 @@
+/// Constants that control the wrapping of content around a view.
+///
+/// - SeeAlso: Tailwind CSS' [floats](https://tailwindcss.com/docs/float) documentation.
+@available(iOS 17.0, macOS 14.0, *)
+public enum FloatMode: String {
+  case start
+  case end
+  case right
+  case left
+  case none
+}
+
+extension View {
+  /// Change how content wraps around the modified view.
+  ///
+  /// - SeeAlso: Tailwind CSS' [floats](https://tailwindcss.com/docs/float) documentation.
+  @available(iOS 17.0, macOS 14.0, *)
+  public func float(_ floatMode: FloatMode, condition: Condition? = nil) -> some View {
+    return modifier(TailwindClassModifier(add: "float-" + floatMode.rawValue, condition: condition))
+  }
+}
diff --git a/Tests/SlipstreamTests/Sites/CatalogSiteTests.swift b/Tests/SlipstreamTests/Sites/CatalogSiteTests.swift
index 32923f5..b4e8ff8 100644
--- a/Tests/SlipstreamTests/Sites/CatalogSiteTests.swift
+++ b/Tests/SlipstreamTests/Sites/CatalogSiteTests.swift
@@ -54,6 +54,7 @@ private struct CatalogSite: View {
 
             Heading(level: 2, "Generic heading 2")
           }
+          .float(.right)
           .flexGap(.x, width: 2)
           .alignItems(.baseline)
           .justifyContent(.center)
@@ -95,7 +96,7 @@ struct CatalogSiteTests {
    <br />world!
    <a href="/about">About</a>
    <a href="/home">Home</a>
-   <div class="flex flex-col gap-x-0.5 items-baseline justify-center">
+   <div class="flex flex-col float-right gap-x-0.5 items-baseline justify-center">
     <div class="flex flex-row gap-x-2.5">
      <h1 class="text-xl font-mono font-bold text-start">Heading 1</h1>
      <h2 class="text-3xl text-center leading-snug">Heading 2</h2>
diff --git a/Tests/SlipstreamTests/TailwindCSS/Layout/FloatTests.swift b/Tests/SlipstreamTests/TailwindCSS/Layout/FloatTests.swift
new file mode 100644
index 0000000..8f82e7c
--- /dev/null
+++ b/Tests/SlipstreamTests/TailwindCSS/Layout/FloatTests.swift
@@ -0,0 +1,12 @@
+import Testing
+import Slipstream
+
+struct FloatTests {
+  @Test func enumeration() throws {
+    try #expect(renderHTML(Div {}.float(.start)) == #"<div class="float-start"></div>"#)
+    try #expect(renderHTML(Div {}.float(.end)) == #"<div class="float-end"></div>"#)
+    try #expect(renderHTML(Div {}.float(.left)) == #"<div class="float-left"></div>"#)
+    try #expect(renderHTML(Div {}.float(.right)) == #"<div class="float-right"></div>"#)
+    try #expect(renderHTML(Div {}.float(.none)) == #"<div class="float-none"></div>"#)
+  }
+}