blixify-ui-web-mcp 0.1.66 → 0.1.68

package/lib/components/data/dataTemplate/README.md

@@ -478,7 +478,9 @@ A calendar tab has no view settings panel (it has no columns, sort or pages). Ro
 
 Under `bareNewDTW` the grid hides `Grid`'s own page buttons and renders the same `NewPagination` footer as the table and list views.
 
-Set `organise.viewId="grid"` (or add an `extendedTabs` entry with `viewType="grid"`) to render records as image cards. Use `bareSettings.bareListGridComponent` to fully customise each card, or use the built-in grid with `viewImage` pointing to an image column.
+Set `organise.viewId="grid"` (or add an `extendedTabs` entry with `viewType="grid"`) to render records as cards. Use `bareSettings.bareListGridComponent` to fully customise each card, or use the built-in grid. `viewImage` is optional: point it at an image or multipleImage column to show a picture on each card, or leave it empty for cards with only the title and fields. The Add Tab modal offers **Grid** on every space, and shows the Preview Image picker only when the space has an image column.
+
+The list, kanban and grid items show the view's visible columns in column order, with the table's cell renderers. The title column is the item's title, the grid's image column is its picture, and a column with nothing stored is left out. A button, timer or rating is always shown. Each item carries the edit pencil (only for users who can update) and the comment bubble (when `edit.activityLog` is on) beside its title.
 
 ```tsx
 <DataTemplate

package/lib/components/display/newGrid/newGrid.stories.tsx

@@ -242,6 +242,31 @@ export const NewGrid = () => {
         </div>
       </StorySection>
 
+      <StorySection
+        title="NewGrid — Grouped sections"
+        description="groups splits the cards into collapsible sections, in the order given, each headed by its title, colour and record count."
+      >
+        <NewGridImpl
+          data={data.slice(0, 6)}
+          hidePagination
+          groups={[
+            {
+              id: "Promotions",
+              title: "Promotions",
+              colour: "orange",
+              rowIds: ["2", "3", "4"],
+            },
+            {
+              id: "Regular",
+              title: "Regular",
+              colour: "blue",
+              rowIds: ["1", "5"],
+            },
+            { id: "__empty", title: "No Value", rowIds: ["6"] },
+          ]}
+        />
+      </StorySection>
+
       <StorySection
         title="Comparing with the legacy Grid"
         description="Open Display/Grid in another tab — same sample data renders. NewGridItem is exactly GridClass — drop-in data swap."

package/lib/components/display/newKanban/README.md

@@ -17,6 +17,10 @@ Sectioned card board. Desktop: horizontal columns. Mobile: tab switcher between
 
 `mobileView` swaps the column row for a tab rail with one column visible. The first column is selected as soon as columns exist (data usually arrives after the first render). `className` styles the desktop column row only — the stacked phone layout ignores it, so a `flex` / `inline-flex` passed for the desktop row cannot turn the phone view into a row. Rail, count badges, hint text and the default card follow `darkMode`.
 
+## Edit pencil and comment bubble
+
+`onCardEdit(id)` and `onCardActivity(id)` add an edit pencil and a comment bubble to the default card's header. Neither opens the card or starts a drag. Under `bareNewDTW`, DataTemplate passes the pencil only to users who can update records.
+
 ## Lane colours
 
 Each lane carries an accent colour: a coloured top border and a matching dot beside its title (and on its tab in the phone view). Colours come from a fixed palette in lane order. `Unassigned` is always grey and is left out of the order, so switching `nullColumn` on does not change any other lane's colour. When `columns` is passed, a column's own `color` (any CSS colour) is used as it is.

package/lib/components/display/newList/README.md

@@ -66,6 +66,10 @@ The legacy `List` renders **every** extra key on an item. `NewList` renders only
 
 ChatDashboard's conversation list uses all four.
 
+## Edit pencil and comment bubble
+
+`onRowEdit(id)` and `onRowActivity(id)` add an edit pencil and a comment bubble beside each item's title. Neither opens the row or follows its link, and neither makes the row taller. Under `bareNewDTW`, DataTemplate passes the pencil only to users who can update records.
+
 ## Status
 
 🚧 **Scaffold only.** Implementation lands in follow-up commits per #1714.

package/lib/components/display/newList/newList.stories.tsx

@@ -259,6 +259,34 @@ export const NewList = () => (
       />
     </StorySection>
 
+    <StorySection
+      title="NewList — Grouped sections"
+      description="groups splits the rows into collapsible sections, in the order given, each headed by its title, colour and record count."
+    >
+      <NewListImpl
+        list={baseLists}
+        hidePagination
+        groups={[
+          {
+            id: "Active",
+            title: "Active",
+            colour: "green",
+            rowIds: baseLists
+              .filter((_, index) => index % 2 === 0)
+              .map((each) => each.id),
+          },
+          {
+            id: "Archived",
+            title: "Archived",
+            colour: "dark",
+            rowIds: baseLists
+              .filter((_, index) => index % 2 === 1)
+              .map((each) => each.id),
+          },
+        ]}
+      />
+    </StorySection>
+
     <StorySection
       title="Comparing with the legacy List"
       description="Open Display/List in another tab — same sample data renders. NewListItem is exactly ListClass — drop-in data swap. NewListImpl renders the same shape with modernised card styling, optional sticky section headers, and sticky search slot."

package/lib/components/display/newTable/README.md

@@ -6,6 +6,8 @@ Tabular display with a List-shaped mobile breakpoint. The architectural key: **`
 
 Pass `onRowActivity={(id) => ...}` to show a keyboard-accessible chat button at the right of the first visible cell (beside the title on mobile cards). It stops row navigation and does not enter inline editing. When no left pins are configured, the first ungrouped column is pinned automatically; existing pin configurations are preserved. DTW wires this callback automatically when `edit.activityLog` is enabled with `bareNewDTW`.
 
+Pass `onRowEdit={(id) => ...}` as well to put an edit pencil before the chat button, at the same size and colour. Both sit over the cell's right padding, so the row does not grow. DTW passes it only when the user can update records (`edit.allEditable`) and opens the record's edit form with `handleNavigate("update", id, "general")`.
+
 ## Adding a row
 
 With `addable.active`, a `+` row at the bottom starts a new record where the click lands. While it is filled in, ✓ and ✕ sit in the Actions column and **Save** and **Cancel** are repeated under the row, held at the left edge as the table scrolls sideways. Enter saves and opens the next row, Escape cancels, and clicking another row saves it.

package/lib/components/input/datePicker/README.md

@@ -70,6 +70,7 @@ const ref = useRef(null);
 | `minDate`        | `Date`                                                          | —               | Earliest selectable date                                                                                                                       |
 | `maxDate`        | `Date`                                                          | —               | Latest selectable date                                                                                                                         |
 | `range`          | `boolean`                                                       | `false`         | Renders two pickers for a start/end date range                                                                                                 |
+| `freeRangeEnds`  | `boolean`                                                       | `false`         | Range mode: neither end's calendar is limited by the other end; the owner keeps them in order                                                  |
 | `showTime`       | `boolean`                                                       | `false`         | Adds a time selector alongside the calendar                                                                                                    |
 | `hideDate`       | `boolean`                                                       | `false`         | Shows only the time picker (hides the calendar)                                                                                                |
 | `timeInterval`   | `number`                                                        | `5`             | Minute step for the time picker                                                                                                                |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "blixify-ui-web-mcp",
-  "version": "0.1.66",
+  "version": "0.1.68",
   "license": "MIT",
   "main": "lib/mcp/server.js",
   "bin": {