@lowdefy/docs-content 0.0.0-experimental-20260928120643 → 6.1.0

package/content/display-blocks/paragraph.md

@@ -75,8 +75,6 @@ Deleted (strikethrough) text indicating removed content.
 
 Marked (highlighted) text to call out key information.
 
-Ctrl + K
-
 ```yaml
 - id: deco_strong
   type: Paragraph
@@ -103,11 +101,6 @@ Ctrl + K
   properties:
     content: Marked (highlighted) text to call out key information.
     mark: true
-- id: deco_keyboard
-  type: Paragraph
-  properties:
-    content: Ctrl + K
-    keyboard: true
 ```
 
 Bold and italic text for maximum emphasis.
@@ -206,8 +199,6 @@ Two-state copy icons that change after clicking
 
 npm install lowdefy
 
-The copy button sits before this text.
-
 ```yaml
 - id: copyable_simple
   type: Paragraph
@@ -235,21 +226,14 @@ The copy button sits before this text.
     content: Two-state copy icons that change after clicking
     copyable:
       icon:
-        - copy
-        - check
+        - AiOutlineCopy
+        - AiOutlineCheck
 - id: copyable_code
   type: Paragraph
   properties:
     content: npm install lowdefy
     code: true
     copyable: true
-- id: copyable_actions_start
-  type: Paragraph
-  properties:
-    content: The copy button sits before this text.
-    copyable: true
-    actions:
-      placement: start
 ```
 
 Copy this text and a message will appear.
@@ -340,33 +324,6 @@ Three-line ellipsis with a custom suffix. Lowdefy makes it easy to build interna
       suffix: " /Read More"
 ```
 
-Collapsible ellipsis lets readers expand the full text and fold it back. Lowdefy apps are defined in YAML with blocks, operators, actions and connections, and the framework handles rendering, state and server-side logic.
-
-Hover over this single line to read the full text in a tooltip. The rest of the sentence is cut off with an ellipsis when it does not fit.
-
-```yaml
-- id: ellipsis_collapsible
-  type: Paragraph
-  properties:
-    content: Collapsible ellipsis lets readers expand the full text and fold it
-      back. Lowdefy apps are defined in YAML with blocks, operators, actions and
-      connections, and the framework handles rendering, state and server-side
-      logic.
-    ellipsis:
-      rows: 2
-      expandable: collapsible
-      symbol:
-        - Read more
-        - Show less
-- id: ellipsis_tooltip
-  type: Paragraph
-  properties:
-    content: Hover over this single line to read the full text in a tooltip. The
-      rest of the sentence is cut off with an ellipsis when it does not fit.
-    ellipsis:
-      tooltip: true
-```
-
 Click expand to trigger an event. Lowdefy makes it easy to build internal tools, client portals, and web applications using YAML or JSON configuration files. No need to learn complex frontend frameworks, manage build tooling, or write boilerplate code.
 
 Expanding this paragraph will update state. This is useful for tracking which sections the user has read or interacted with. You can use the ellipsis state to drive conditional logic elsewhere in the app.
@@ -481,7 +438,7 @@ A blockquote-style paragraph using inline styles with a left border and padding.
     italic: true
   style:
     .element:
-      borderLeft: "3px solid #1677ff"
+      borderLeft: 3px solid
       paddingLeft: 12px
 ```
 
@@ -532,7 +489,7 @@ Install the CLI to get started.
 
 npx lowdefy@latest dev
 
-Note: Lowdefy requires Node.js 24 or later. Check your version with node /version.
+Note: Lowdefy requires Node.js 18 or later. Check your version with node /version.
 
 ```yaml
 - id: article_card
@@ -575,7 +532,7 @@ Note: Lowdefy requires Node.js 24 or later. Check your version with node /versio
     - id: article_note
       type: Paragraph
       properties:
-        content: "Note: Lowdefy requires Node.js 24 or later. Check your version with
+        content: "Note: Lowdefy requires Node.js 18 or later. Check your version with
           node /version."
         type: warning
         italic: true
@@ -641,8 +598,6 @@ Maintenance window scheduled for Sunday 02:00-04:00 UTC.
 
 | Property | Type | Default | Description |
 | --- | --- | --- | --- |
-| `actions` | object | - | Configure the bar of action buttons, such as copy and expand. |
-| `actions.placement` | string | `"end"` | Place the action buttons before or after the text. Enum: `start`, `end`. |
 | `code` | boolean | `false` | Apply code style. |
 | `content` | string | - | Paragraph text content - supports html. |
 | `copyable` | boolean \| object | `false` | Provide copy text button. |
@@ -653,20 +608,16 @@ Maintenance window scheduled for Sunday 02:00-04:00 UTC.
 | `disabled` | boolean | `false` | Apply disabled style. |
 | `ellipsis` | boolean \| object | `false` | Display ellipsis when text overflows a single line. |
 | `ellipsis.rows` | number | - | Max rows of content. |
-| `ellipsis.expandable` | boolean \| string | - | Show a button that expands the hidden content. Set to 'collapsible' to also allow collapsing it again. Enum: `true`, `false`, `collapsible`. |
-| `ellipsis.defaultExpanded` | boolean | `false` | Start with the content expanded. |
+| `ellipsis.expandable` | boolean | - | Expand hidden content when clicked. |
 | `ellipsis.suffix` | string | - | Suffix of ellipses content. |
-| `ellipsis.symbol` | string \| array | - | Text of the expand button, or an array of two strings for the expand and collapse buttons. |
-| `ellipsis.tooltip` | boolean \| string | - | Show a tooltip when the text is truncated. true shows the full text, a string shows that text. |
 | `italic` | boolean | `false` | Apply italic style. |
-| `keyboard` | boolean | `false` | Apply keyboard key style. |
 | `mark` | boolean | `false` | Apply marked (highlighted) style. |
 | `strong` | boolean | `false` | Apply strong (bold) style. |
 | `type` | string | `"default"` | Additional types. Don't specify for default. Enum: `success`, `default`, `secondary`, `warning`, `danger`. |
 | `underline` | boolean | `false` | Apply underline style. |
 | `theme` | object | - | Antd design token overrides for this block. See [antd design tokens](https://ant.design/components/overview#design-token). See [Ant Design typography tokens](https://ant.design/components/typography#design-token). |
-| `theme.titleMarginBottom` | string \| number | `"0.5em"` | Margin bottom of title, as a CSS length or a number of pixels. |
-| `theme.titleMarginTop` | string \| number | `"1.2em"` | Margin top of title, as a CSS length or a number of pixels. |
+| `theme.titleMarginBottom` | string | `"0.5em"` | Margin bottom of title. |
+| `theme.titleMarginTop` | string | `"1.2em"` | Margin top of title. |
 | `theme.fontWeightStrong` | number | `600` | Font weight for strong text. |
 | `theme.fontFamilyCode` | string | - | Font family for code style text. |
 | `theme.colorText` | string | - | Default text color. |
@@ -679,7 +630,7 @@ Maintenance window scheduled for Sunday 02:00-04:00 UTC.
 
 | Event | Event Data | Description |
 | --- | --- | --- |
-| `onExpand` | `{ expanded }` | Trigger action when the ellipsis expand or collapse button is clicked. |
+| `onExpand` | \- | Trigger action when ellipse expand is clicked. |
 | `onCopy` | \- | Trigger action when copy text is clicked. |
 | `onTextSelection` | \- | Trigger action when text is selected and pass selected text to the event object. |
 
@@ -688,6 +639,5 @@ Maintenance window scheduled for Sunday 02:00-04:00 UTC.
 | `/block` | Outer block wrapper (always available). |
 | `/element` | The Paragraph element. |
 | `/copyableIcon` | The copyable icon in the Paragraph. |
-| `/actions` | The bar of action buttons, such as copy and expand, next to the text. |
 
 No slots defined.

package/content/display-blocks/progress.md

@@ -253,76 +253,6 @@ Progress indicator in line, circle, and dashboard styles.
     strokeColor: "#52c41a"
 ```
 
-```yaml
-- id: gradient_line
-  type: Progress
-  properties:
-    percent: 80
-    strokeColor:
-      from: "#108ee9"
-      to: "#87d068"
-- id: gradient_circle
-  type: Progress
-  properties:
-    type: circle
-    percent: 90
-    strokeColor:
-      0%: "#108ee9"
-      100%: "#87d068"
-```
-
-```yaml
-- id: percent_inner_start
-  type: Progress
-  properties:
-    percent: 45
-    size:
-      - -1
-      - 20
-    percentPosition:
-      align: start
-      type: inner
-- id: percent_inner_center
-  type: Progress
-  properties:
-    percent: 65
-    size:
-      - -1
-      - 20
-    percentPosition:
-      align: center
-      type: inner
-- id: percent_outer_center
-  type: Progress
-  properties:
-    percent: 30
-    percentPosition:
-      align: center
-      type: outer
-```
-
-```yaml
-- id: size_small_line
-  type: Progress
-  properties:
-    percent: 50
-    size: small
-- id: size_circle_small
-  type: Progress
-  properties:
-    type: circle
-    percent: 50
-    size: small
-- id: circle_steps
-  type: Progress
-  properties:
-    type: dashboard
-    percent: 60
-    steps:
-      count: 8
-      gap: 4
-```
-
 ```yaml
 - id: width_small
   type: Progress
@@ -505,7 +435,7 @@ Progress indicator in line, circle, and dashboard styles.
           layout:
             flex: 0 0 auto
           properties:
-            name: file
+            name: AiOutlineFile
             size: 20
             color: "#1677ff"
         - id: upload_file_1_info
@@ -534,7 +464,7 @@ Progress indicator in line, circle, and dashboard styles.
           layout:
             flex: 0 0 auto
           properties:
-            name: file
+            name: AiOutlineFile
             size: 20
             color: "#1677ff"
         - id: upload_file_2_info
@@ -565,7 +495,7 @@ Progress indicator in line, circle, and dashboard styles.
           layout:
             flex: 0 0 auto
           properties:
-            name: file
+            name: AiOutlineFile
             size: 20
             color: "#ff4d4f"
         - id: upload_file_3_info
@@ -596,7 +526,7 @@ Progress indicator in line, circle, and dashboard styles.
             title: Retry Failed
             color: danger
             variant: outlined
-            icon: refresh
+            icon: AiOutlineReload
             size: small
           events:
             onClick:
@@ -613,7 +543,7 @@ Progress indicator in line, circle, and dashboard styles.
             title: Upload More
             color: primary
             variant: solid
-            icon: upload
+            icon: AiOutlineUpload
             size: small
           events:
             onClick:
@@ -683,7 +613,7 @@ Invite team members
           layout:
             flex: 0 0 auto
           properties:
-            name: check-circle
+            name: AiOutlineCheckCircle
             size: 18
             color: "#52c41a"
         - id: onboarding_step_1_label
@@ -711,7 +641,7 @@ Invite team members
           layout:
             flex: 0 0 auto
           properties:
-            name: check-circle
+            name: AiOutlineCheckCircle
             size: 18
             color: "#52c41a"
         - id: onboarding_step_2_label
@@ -739,7 +669,7 @@ Invite team members
           layout:
             flex: 0 0 auto
           properties:
-            name: check-circle
+            name: AiOutlineCheckCircle
             size: 18
             color: "#52c41a"
         - id: onboarding_step_3_label
@@ -767,7 +697,7 @@ Invite team members
           layout:
             flex: 0 0 auto
           properties:
-            name: clock
+            name: AiOutlineClockCircle
             size: 18
             color: "#1677ff"
         - id: onboarding_step_4_label
@@ -795,7 +725,7 @@ Invite team members
           layout:
             flex: 0 0 auto
           properties:
-            name: clock
+            name: AiOutlineClockCircle
             size: 18
             color: "#d9d9d9"
         - id: onboarding_step_5_label
@@ -841,7 +771,7 @@ Invite team members
             title: Continue Setup
             color: primary
             variant: solid
-            icon: arrow-right
+            icon: AiOutlineArrowRight
           events:
             onClick:
               - id: continue_msg
@@ -857,23 +787,17 @@ Invite team members
 | `showInfo` | boolean | `true` | Whether to display the progress value and the status icon. |
 | `percent` | number | `0` | Set the completion percentage. |
 | `status` | string | `"normal"` | Set the status of the Progress. Enum: `success`, `exception`, `normal`, `active`. |
-| `strokeLinecap` | string | `"round"` | Set the style of the progress linecap. Enum: `round`, `butt`, `square`. |
-| `strokeColor` | string \| array \| object | - | Color of progress bar. An object like `{ from: "#108ee9", to: "#87d068" }` or `{ "0%": "#108ee9", "100%": "#87d068" }` renders a gradient, and an array colors each step when steps is set. |
+| `strokeLinecap` | string | `"round"` | Set the style of the progress linecap. Enum: `round`, `square`. |
+| `strokeColor` | string \| object | - | Color of progress bar. |
 | `success` | object | - | Segmented success percent configuration. |
 | `success.percent` | number | `0` | Segmented success percent. |
 | `success.strokeColor` | string | - | Color of the success segment. |
 | `trailColor` | string | - | Color of unfilled part. |
-| `strokeWidth` | number | - | Thickness of the progress bar. In pixels for line progress, and as a percentage of the canvas width for circle and dashboard progress. |
-| `width` | number | `120` | Set the canvas width of the circular progress. Same as a number size. |
-| `size` | number \| string \| array \| object | - | Size of the progress. 'small' or 'medium', a number (the circle diameter, or both the width and the height of a line or of each step), or `[width, height]` or `{ width, height }` for line progress. |
-| `percentPosition` | object | - | Position of the progress value on line progress. |
-| `percentPosition.align` | string | `"end"` | Horizontal position of the value. Enum: `start`, `center`, `end`. |
-| `percentPosition.type` | string | `"outer"` | Show the value inside or outside the bar. Enum: `inner`, `outer`. |
+| `strokeWidth` | number | - | Set the width of the progress bar. |
+| `width` | number | `132` | Set the canvas width of the circular progress. |
 | `gapDegree` | number | `75` | The gap degree of half circle. |
-| `gapPosition` | string | `"bottom"` | The gap position of circle and dashboard progress. Enum: `top`, `bottom`, `left`, `right`. |
-| `steps` | number \| object | - | Number of steps for a segmented progress bar. For circle and dashboard progress, an object `{ count, gap }` also sets the gap between steps. |
-| `steps.count` | number | - | Number of steps. |
-| `steps.gap` | number | `2` | Gap between steps of circle and dashboard progress. |
+| `gapPosition` | string | `"top"` | The gap position. Enum: `top`, `bottom`, `left`, `right`. |
+| `steps` | number | - | Number of steps for a segmented progress bar (line type only). |
 | `theme` | object | - | Antd design token overrides for this block. See [antd design tokens](https://ant.design/components/overview#design-token). See [Ant Design progress tokens](https://ant.design/components/progress#design-token). |
 | `theme.defaultColor` | string | `"#1677ff"` | Default color of the progress bar. |
 | `theme.remainingColor` | string | `"rgba(0,0,0,0.06)"` | Color of the unfilled portion of the progress bar. |
@@ -890,8 +814,5 @@ No events defined.
 | --- | --- |
 | `/block` | Outer block wrapper (always available). |
 | `/element` | The Progress element. |
-| `/rail` | The unfilled part of the progress bar. |
-| `/track` | The filled part of the progress bar. |
-| `/indicator` | The progress value text or status icon. |
 
 No slots defined.

package/content/display-blocks/qrcode.md

@@ -173,18 +173,6 @@ QR code generator with customizable size, color, and error level.
     errorLevel: H
     icon: https://lowdefy.com/favicon-32x32.png
     iconSize: 48
-- id: qr_icon_wide
-  type: QRCode
-  layout:
-    flex: 0 0 auto
-  properties:
-    value: https://lowdefy.com
-    size: 200
-    errorLevel: H
-    icon: https://lowdefy.com/favicon-32x32.png
-    iconSize:
-      width: 48
-      height: 32
 ```
 
 ```yaml
@@ -416,7 +404,7 @@ Present this QR code at the entrance for check-in.
     - id: ticket_qr_row
       type: Box
       layout:
-        align: center
+        contentAlign: center
         gap: 8
       blocks:
         - id: ticket_qr
@@ -447,7 +435,7 @@ Present this QR code at the entrance for check-in.
     - id: wifi_qr_row
       type: Box
       layout:
-        align: center
+        contentAlign: center
         gap: 8
       blocks:
         - id: wifi_qr
@@ -485,7 +473,7 @@ Present this QR code at the entrance for check-in.
             title: Generate New Password
             color: primary
             variant: outlined
-            icon: refresh
+            icon: AiOutlineReload
           events:
             onClick:
               - id: wifi_refresh_msg
@@ -503,9 +491,7 @@ Present this QR code at the entrance for check-in.
 | `bgColor` | string | `"transparent"` | QRCode background color. |
 | `errorLevel` | string | `"M"` | Error correction level. Enum: `L`, `M`, `Q`, `H`. |
 | `icon` | string | - | Icon URL in the center of the QR code. |
-| `iconSize` | integer \| object | `40` | Icon size in pixels, or `{ width, height }` for an icon that is not square. |
-| `iconSize.width` | integer | - | Icon width in pixels. |
-| `iconSize.height` | integer | - | Icon height in pixels. |
+| `iconSize` | integer | `40` | Icon size in pixels. |
 | `marginSize` | number | `0` | Margin size of the QR code in modules. |
 | `minVersion` | integer | `1` | Minimum QR code version (1-40). Higher versions support more data. |
 | `type` | string | `"canvas"` | Render type. Enum: `canvas`, `svg`. |
@@ -529,6 +515,5 @@ Present this QR code at the entrance for check-in.
 | --- | --- |
 | `/block` | Outer block wrapper (always available). |
 | `/element` | The QRCode element. |
-| `/cover` | The overlay shown over the QR code when status is expired, loading or scanned. |
 
 No slots defined.

package/content/display-blocks/s3download.md

@@ -1,6 +1,6 @@
 # S3Download
 
-__Deprecated__ — use the provider-neutral <a href="/Download">Download</a> block with `downloadPolicyRequestId` instead. S3Download remains as an alias so existing apps keep working. Download files from AWS S3. Requires an AwsS3Bucket connection and an AwsS3PresignedGetObject request. The s3GetPolicyRequestId property must reference the request id. If files were uploaded with S3Upload, its fileList value can be mapped directly to this block.
+__Deprecated__ — use the provider-neutral &lt;a href=&quot;/Download&quot;&gt;Download&lt;/a&gt; block with `downloadPolicyRequestId` instead. S3Download remains as an alias so existing apps keep working. Download files from AWS S3. Requires an AwsS3Bucket connection and an AwsS3PresignedGetObject request. The s3GetPolicyRequestId property must reference the request id. If files were uploaded with S3Upload, its fileList value can be mapped directly to this block.
 
 > The S3Download block requires an AwsS3Bucket connection and an AwsS3PresignedGetObject request. The examples below show configuration structure but will not download files without a configured connection.
 

package/content/display-blocks/search.md

@@ -163,11 +163,11 @@ See the [MiniSearch API docs](https://lucaong.github.io/minisearch/classes/MiniS
       - label: Concepts
         match:
           section: Concepts
-        icon: Lightbulb
+        icon: AiOutlineBulb
       - label: Blocks
         match:
           section: Blocks
-        icon: PanelsTopLeft
+        icon: AiOutlineLayout
   events:
     onSelect:
       - id: navigate
@@ -221,15 +221,15 @@ See the [MiniSearch API docs](https://lucaong.github.io/minisearch/classes/MiniS
       - label: Admin
         match:
           category: Admin
-        icon: settings
+        icon: AiOutlineSetting
       - label: Finance
         match:
           category: Finance
-        icon: DollarSign
+        icon: AiOutlineDollar
       - label: Analytics
         match:
           category: Analytics
-        icon: chart
+        icon: AiOutlineBarChart
     placeholder: Search features...
     label: Find
     shortcut: mod+k
@@ -308,16 +308,7 @@ See the [MiniSearch API docs](https://lucaong.github.io/minisearch/classes/MiniS
 | `searchOptions.prefix` | boolean | `true` | Enable prefix matching. |
 | `searchOptions.combineWith` | string | `"OR"` | How to combine search terms. Enum: `OR`, `AND`. |
 | `label` | string | `"Search"` | Trigger button text. |
-| `icon` | string \| object | `"search"` | Trigger button icon: a semantic name like `search`, a Lucide icon name like `Search`, or a set-qualified name like `tabler:Search`, or properties of an Icon block. |
-| `icon.name` | string | - | Icon name: a semantic name like `edit`, a Lucide icon name like `Pencil`, or a set-qualified name like `tabler:Pencil`. |
-| `icon.color` | string | - | Icon color. |
-| `icon.size` | string \| number | - | Size of the icon. Defaults to `theme.icons.size`. |
-| `icon.rotate` | number | - | Number of degrees to rotate the icon. |
-| `icon.spin` | boolean | - | Continuously spin the icon with animation. |
-| `icon.strokeWidth` | number | - | Stroke width of the icon lines, in pixels of the 24px icon grid. Defaults to `theme.icons.strokeWidth` (2). |
-| `icon.nonScalingStroke` | boolean | - | Keep the stroke width constant at any icon size. Defaults to `theme.icons.nonScalingStroke`. |
-| `icon.title` | string | - | Icon hover title for accessibility. An empty string marks the icon as decorative. |
-| `icon.disableLoadingIcon` | boolean | - | While loading after the icon has been clicked, don't render the loading icon. |
+| `icon` | string \| object | - | Trigger button icon name or Icon block properties. |
 | `showShortcut` | boolean | `true` | Show keyboard shortcut badge on the trigger button. |
 | `placeholder` | string | `"Search..."` | Search input placeholder text. |
 | `shortcut` | string | `"mod+k"` | Keyboard shortcut to open the modal. Renders a shortcut badge on the trigger button (see showShortcut). Use "mod" for Cmd on Mac, Ctrl elsewhere. |
@@ -339,7 +330,7 @@ See the [MiniSearch API docs](https://lucaong.github.io/minisearch/classes/MiniS
 | `recentSearches` | boolean | `true` | Show recent searches when input is empty. |
 | `recentSearchesKey` | string | `"search"` | localStorage key prefix for recent searches. |
 | `recentSearchesCount` | number | `5` | Maximum number of recent searches stored. |
-| `theme` | object | - | Antd design token overrides for the trigger Button, the search Modal and its Input, e.g. `borderRadius`, `colorPrimary`, `colorBgElevated` or `fontSize`. See [antd design tokens](https://ant.design/components/overview#design-token). |
+| `theme` | object | - | Antd design token overrides for this block. See [antd design tokens](https://ant.design/components/overview#design-token). |
 
 | Event | Event Data | Description |
 | --- | --- | --- |
@@ -365,6 +356,5 @@ See the [MiniSearch API docs](https://lucaong.github.io/minisearch/classes/MiniS
 | `/itemDescription` | The description/snippet in a result item. |
 | `/highlight` | Highlighted match text (<mark> elements). |
 | `/empty` | The empty state message. |
-| `/loading` | The loading spinner container. |
 
 No slots defined.

package/content/display-blocks/skeletonbutton.md

@@ -232,7 +232,6 @@ Button-shaped skeleton loading placeholder.
 
 | Property | Type | Default | Description |
 | --- | --- | --- | --- |
-| `shape` | string | `"default"` | Shape of the skeleton; round gives fully rounded ends. Enum: `default`, `round`. |
 | `size` | string | `"medium"` | Size of the skeleton. Enum: `small`, `medium`, `large`. |
 | `width` | number \| string | - | Width of the skeleton. |
 

package/content/display-blocks/skeletoninput.md

@@ -206,7 +206,6 @@ Input-shaped skeleton loading placeholder.
 
 | Property | Type | Default | Description |
 | --- | --- | --- | --- |
-| `label` | boolean | `true` | Render the label skeleton. Set to false for an input without a label. |
 | `size` | string | `"medium"` | Size of the skeleton. Enum: `small`, `medium`, `large`. |
 | `width` | number \| string | - | Width of the skeleton. |
 | `labelHeight` | number \| string | - | Height of the skeleton. |