@goflowstate/widget-sdk 0.3.1 → 0.3.4

package/README.md

@@ -160,8 +160,9 @@ before the first state arrives.
 
 A flow that calls `CanvasWidget.initSession()` carries the feedback icon with no code of its own.
 While the ring has feedback switched on, the session state says so and the SDK puts a round
-button in the corner of the page. A tap takes a screenshot of the page, then opens a sheet with
-one field. The note is sent through the flow's session to `POST /api/w/:slug/feedback`.
+button in the corner of the page. A tap opens a sheet with one field at once and takes a
+screenshot of the page behind it; the sheet shows "Taking a screenshot" until the picture is
+attached, and neither the icon nor the sheet is in it. The note is sent through the flow's session to `POST /api/w/:slug/feedback`.
 
 The icon and the sheet take the look of the page they sit on: its fonts, ground, ink, the fill
 and shape of its main button, and its corner radius. To pin a role, set a custom property on
@@ -174,6 +175,27 @@ and shape of its main button, and its corner radius. To pin a role, set a custom
 }
 ```
 
+The sheet's type comes from the words the flow is drawing, not from `<body>`: the title takes
+the face, weight and letter spacing of the flow's largest heading, the note and the field take
+the face most of the flow's smaller text is set in, and the send button takes the face, weight,
+letter spacing and case of the flow's main button. Pin `--fs-feedback-font` or
+`--fs-feedback-font-display` when the reading is off.
+
+The button floats over the flow and belongs to the person using it. They can drag it anywhere,
+and it settles on the nearer side. A flick at an edge, or a drag into one, docks it there as a
+slim tab with the bug still showing; a tap on the tab opens the sheet, and pulling the tab
+inward floats it again. The sheet also has a "Tuck the button to the side" link. Where a person
+leaves the button is remembered.
+
+Until a person moves it, the button keeps clear of the page's own controls. It starts in the bottom corner and, whenever
+the page changes, resizes or stops scrolling, looks up the right edge for the lowest spot that is empty. It sits over a line of text only
+when empty space is far above it, and on a control only when the whole edge is controls. Pinning
+`--fs-feedback-bottom` turns that off and holds the icon where the flow puts it.
+
+To take the icon off one screen of a flow (a film, a full-screen picture), set
+`--fs-feedback-display: none` from the flow's stylesheet while that screen is up, for example
+`:root:has(.film) { --fs-feedback-display: none; }`.
+
 Name each screen so a report says where it came from: `document.body.dataset.pageKey = 'question-2'`.
 A page that must not show the icon (a projected wall) sets `<html data-fs-feedback="off">`.