NC-5129, NC-5130: Documentation update for Turnstile (flex-width, siz…

…e, feedback toggle) (#16108) * client side updates * changelog
cloudflare · Aug 14, 2024 · ed19531 · ed19531
1 parent b310099
commit ed19531
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/content/changelogs/turnstile.yaml b/src/content/changelogs/turnstile.yaml
@@ -5,6 +5,11 @@ productLink: "/turnstile/"
 productArea: Application security
 productAreaLink: /fundamentals/reference/changelog/security/
 entries:
+- publish_date: '2024-08-12'
+  description: |-
+    - Added [`[flexible]`](/turnstile/get-started/client-side-rendering/#widget-size) width widget size.
+    - Added new dimensions for Turnstile's compact size.
+    - Added a Feedback Report toggle on the widget's configuration.
 - publish_date: '2024-04-10'
   description: |-
     - Added [`[refresh-timeout]`](/turnstile/get-started/client-side-rendering/#refresh-a-timed-out-widget) and document new automatic interactive timeout-refresh.

diff --git a/src/content/docs/turnstile/get-started/client-side-rendering.mdx b/src/content/docs/turnstile/get-started/client-side-rendering.mdx
@@ -212,11 +212,12 @@ By default, `appearance` is set to `always` for visible widget types. However, i
 
 ## Widget size
 
-The Turnstile widget can have two different sizes when using the Managed or Non-interactive modes:
+The Turnstile widget can have two different fixed sizes or a flexible width size when using the Managed or Non-interactive modes:
 
 | Size    | Width | Height |
 | ------- | ----- | ------ |
 | Normal  | 300px | 65px   |
+| Flexible | 100% (min: 300px) | 120px |
 | Compact | 130px | 120px  |
 
 ## Configurations
@@ -239,9 +240,10 @@ The Turnstile widget can have two different sizes when using the Managed or Non-
 | `timeout-callback`            | `data-timeout-callback`            | A JavaScript callback invoked when the challenge presents an interactive challenge but was not solved within a given time. A callback will reset the widget to allow a visitor to solve the challenge again.                                                                                                                                                    |
 | `response-field`              | `data-response-field`              | A boolean that controls if an input element with the response token is created, defaults to `true`.                                                                                                                                                                                                                                                             |
 | `response-field-name`         | `data-response-field-name`         | Name of the input element, defaults to `cf-turnstile-response`.                                                                                                                                                                                                                                                                                                 |
-| `size`                        |  `data-size`                       | The widget size. Can take the following values: `normal`, `compact`.                                                                                                                                                                                                                                                                                            |
+| `size`                        | `data-size`                        | The widget size. Can take the following values: `normal`, `flexible`, `compact`. |
 | `retry`                       |  `data-retry`                      | Controls whether the widget should automatically retry to obtain a token if it did not succeed. The default is `auto`, which will retry automatically. This can be set to `never` to disable retry on failure.                                                                                                                                                  |
 | `retry-interval`              |  `data-retry-interval`             | When `retry` is set to `auto`, `retry-interval` controls the time between retry attempts in milliseconds. Value must be a positive integer less than `900000`, defaults to `8000`.                                                                                                                                                                              |
 | `refresh-expired`             |  `data-refresh-expired`            | Automatically refreshes the token when it expires. Can take `auto`, `manual`, or `never`, defaults to `auto`.                                                                                                                                                                                                                                                   |
 | `refresh-timeout`             | `data-refresh-timeout`             | Controls whether the widget should automatically refresh upon entering an interactive challenge and observing a timeout. Can take `auto` (automatically refreshes upon encountering an interactive timeout), `manual` (prompts the visitor to manually refresh) or `never` (will show a timeout), defaults to `auto`.  Only applies to widgets of mode managed. |
 | `appearance`                  | `data-appearance`                  | Appearance controls when the widget is visible. It can be `always` (default), `execute`, or `interaction-only`. Refer to [Appearance modes](/turnstile/get-started/client-side-rendering/#appearance-modes) for more information.                                                                                                                               |
+| `feedback-enabled`            | `data-feedback-enabled`            | Allows Cloudflare to gather visitor feedback upon widget failure. It can be `true` (default) or `false`. |