@ea-lab/reactive-json-docs 0.7.0 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -2
- package/public/rjbuild/docs/advanced-concepts/data-processors.md +2 -2
- package/public/rjbuild/docs/advanced-concepts/plugins/component-development-guide-llm.md +14 -14
- package/public/rjbuild/docs/core/action/HashChangeListener.md +1 -1
- package/public/rjbuild/docs/core/action/HashChangeListener.yaml +24 -6
- package/public/rjbuild/docs/core/action/Hide.md +2 -2
- package/public/rjbuild/docs/core/action/Hide.yaml +4 -3
- package/public/rjbuild/docs/core/action/MessageListener.md +4 -4
- package/public/rjbuild/docs/core/action/MessageListener.yaml +18 -6
- package/public/rjbuild/docs/core/action/Popover.md +5 -5
- package/public/rjbuild/docs/core/action/Popover.yaml +28 -5
- package/public/rjbuild/docs/core/action/ReactOnEvent.md +4 -4
- package/public/rjbuild/docs/core/action/ReactOnEvent.yaml +4 -4
- package/public/rjbuild/docs/core/action/Redirect.md +2 -2
- package/public/rjbuild/docs/core/action/Redirect.yaml +8 -2
- package/public/rjbuild/docs/core/action/Tooltip.md +3 -3
- package/public/rjbuild/docs/core/action/Tooltip.yaml +16 -3
- package/public/rjbuild/docs/core/action/VisuallyHide.md +2 -2
- package/public/rjbuild/docs/core/action/VisuallyHide.yaml +2 -2
- package/public/rjbuild/docs/core/dataMapping/simpleMapping.md +5 -5
- package/public/rjbuild/docs/core/dataMapping/simpleMapping.yaml +76 -56
- package/public/rjbuild/docs/core/element/debug/VariablesDebug.md +59 -0
- package/public/rjbuild/docs/core/element/debug/VariablesDebug.yaml +71 -0
- package/public/rjbuild/docs/core/element/form/CheckBoxField.md +8 -8
- package/public/rjbuild/docs/core/element/form/CheckBoxField.yaml +40 -8
- package/public/rjbuild/docs/core/element/form/DateField.md +5 -5
- package/public/rjbuild/docs/core/element/form/DateField.yaml +27 -5
- package/public/rjbuild/docs/core/element/form/NumberField.md +7 -7
- package/public/rjbuild/docs/core/element/form/NumberField.yaml +32 -7
- package/public/rjbuild/docs/core/element/form/SelectField.md +9 -9
- package/public/rjbuild/docs/core/element/form/SelectField.yaml +46 -9
- package/public/rjbuild/docs/core/element/form/TextAreaField.md +8 -8
- package/public/rjbuild/docs/core/element/form/TextAreaField.yaml +36 -8
- package/public/rjbuild/docs/core/element/form/TextField.md +8 -8
- package/public/rjbuild/docs/core/element/form/TextField.yaml +38 -8
- package/public/rjbuild/docs/core/element/form/formElementsCommon.md +2 -4
- package/public/rjbuild/docs/core/element/form/index.md +0 -2
- package/public/rjbuild/docs/core/element/html/AccordionItem.yaml +19 -7
- package/public/rjbuild/docs/core/element/html/FolderSortableTree.yaml +40 -12
- package/public/rjbuild/docs/core/element/html/FormatNumeral.yaml +21 -7
- package/public/rjbuild/docs/core/element/html/Html.yaml +26 -9
- package/public/rjbuild/docs/core/element/html/LabelFromValue.yaml +25 -8
- package/public/rjbuild/docs/core/element/html/Modal.yaml +35 -12
- package/public/rjbuild/docs/core/element/html/PreformattedMarkup.yaml +23 -7
- package/public/rjbuild/docs/core/element/html/SortableTreeItemCollapseButton.yaml +7 -6
- package/public/rjbuild/docs/core/element/html/SyntaxHighlighter.yaml +56 -20
- package/public/rjbuild/docs/core/element/html/Tabs.yaml +24 -15
- package/public/rjbuild/docs/core/element/special/BootstrapElement.md +4 -6
- package/public/rjbuild/docs/core/element/special/BootstrapElement.yaml +15 -4
- package/public/rjbuild/docs/core/element/special/Count.md +8 -10
- package/public/rjbuild/docs/core/element/special/Count.yaml +22 -9
- package/public/rjbuild/docs/core/element/special/DataFilter.md +40 -41
- package/public/rjbuild/docs/core/element/special/DataFilter.yaml +79 -43
- package/public/rjbuild/docs/core/element/special/DelayedActions.md +13 -15
- package/public/rjbuild/docs/core/element/special/DelayedActions.yaml +32 -13
- package/public/rjbuild/docs/core/element/special/PageControls.md +8 -10
- package/public/rjbuild/docs/core/element/special/PageControls.yaml +9 -8
- package/public/rjbuild/docs/core/element/special/Phantom.md +9 -11
- package/public/rjbuild/docs/core/element/special/Phantom.yaml +22 -9
- package/public/rjbuild/docs/core/element/special/ReactiveJsonSubroot.md +7 -9
- package/public/rjbuild/docs/core/element/special/ReactiveJsonSubroot.yaml +13 -15
- package/public/rjbuild/docs/core/element/special/Switch.md +31 -33
- package/public/rjbuild/docs/core/element/special/Switch.yaml +59 -22
- package/public/rjbuild/docs/core/reaction/addData.md +0 -2
- package/public/rjbuild/docs/core/reaction/addData.yaml +17 -2
- package/public/rjbuild/docs/core/reaction/fetchData.md +1 -2
- package/public/rjbuild/docs/core/reaction/fetchData.yaml +40 -11
- package/public/rjbuild/docs/core/reaction/moveData.md +0 -4
- package/public/rjbuild/docs/core/reaction/moveData.yaml +28 -6
- package/public/rjbuild/docs/core/reaction/postMessage.md +0 -4
- package/public/rjbuild/docs/core/reaction/postMessage.yaml +29 -6
- package/public/rjbuild/docs/core/reaction/redirectNow.md +0 -4
- package/public/rjbuild/docs/core/reaction/redirectNow.yaml +10 -3
- package/public/rjbuild/docs/core/reaction/removeData.md +2 -6
- package/public/rjbuild/docs/core/reaction/removeData.yaml +40 -2
- package/public/rjbuild/docs/core/reaction/setClipboardData.md +0 -4
- package/public/rjbuild/docs/core/reaction/setClipboardData.yaml +10 -3
- package/public/rjbuild/docs/core/reaction/setData.md +0 -4
- package/public/rjbuild/docs/core/reaction/setData.yaml +25 -7
- package/public/rjbuild/docs/core/reaction/submitData.md +2 -3
- package/public/rjbuild/docs/core/reaction/submitData.yaml +43 -7
- package/public/rjbuild/docs/core/reaction/triggerEvent.md +0 -4
- package/public/rjbuild/docs/core/reaction/triggerEvent.yaml +25 -11
- package/public/rjbuild/docs/install.md +24 -24
|
@@ -8,9 +8,21 @@ renderView:
|
|
|
8
8
|
**Important:** `AccordionItem` must be a direct child of `BsAccordion`.
|
|
9
9
|
|
|
10
10
|
## Properties
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
|
|
12
|
+
- type: DefinitionList
|
|
13
|
+
content:
|
|
14
|
+
- term:
|
|
15
|
+
code: header
|
|
16
|
+
after: "(object, optional)"
|
|
17
|
+
details: "Content for the accordion header."
|
|
18
|
+
- term:
|
|
19
|
+
code: body
|
|
20
|
+
after: "(object, optional)"
|
|
21
|
+
details: "Content for the accordion body."
|
|
22
|
+
- term:
|
|
23
|
+
code: attributes
|
|
24
|
+
after: "(object, optional)"
|
|
25
|
+
details: "Additional attributes for the Accordion.Item."
|
|
14
26
|
|
|
15
27
|
- type: RjBuildDescriber
|
|
16
28
|
title: "Interactive Example: Accordion with multiple sections"
|
|
@@ -41,7 +53,7 @@ renderView:
|
|
|
41
53
|
- type: Markdown
|
|
42
54
|
content: |
|
|
43
55
|
## Limitations
|
|
44
|
-
- Only works inside a parent BsAccordion component
|
|
45
|
-
- No built-in support for nested accordions
|
|
46
|
-
- The eventKey is set automatically; custom keys are not supported directly
|
|
47
|
-
- No animation customization beyond what react-bootstrap provides
|
|
56
|
+
- Only works inside a parent BsAccordion component.
|
|
57
|
+
- No built-in support for nested accordions.
|
|
58
|
+
- The eventKey is set automatically; custom keys are not supported directly.
|
|
59
|
+
- No animation customization beyond what react-bootstrap provides.
|
|
@@ -10,13 +10,41 @@ renderView:
|
|
|
10
10
|
**Note:** For each node, all properties to display in the template (like `name`, `age`, etc.) must be placed inside a `value` object. The itemTemplate only has access to the fields inside `value` for each node. Children are listed in the `children` array.
|
|
11
11
|
|
|
12
12
|
## Properties
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
13
|
+
|
|
14
|
+
- type: DefinitionList
|
|
15
|
+
content:
|
|
16
|
+
- term:
|
|
17
|
+
code: dataLocation
|
|
18
|
+
after: "(string, required)"
|
|
19
|
+
details: "Path to the tree data."
|
|
20
|
+
- term:
|
|
21
|
+
code: itemTemplate
|
|
22
|
+
after: "(object, required)"
|
|
23
|
+
details: "Template for each tree item."
|
|
24
|
+
- term:
|
|
25
|
+
code: maxDepth
|
|
26
|
+
after: "(number, optional)"
|
|
27
|
+
details: "Maximum allowed depth."
|
|
28
|
+
- term:
|
|
29
|
+
code: maxDepthIsAbsolute
|
|
30
|
+
after: "(boolean, optional)"
|
|
31
|
+
details:
|
|
32
|
+
type: Markdown
|
|
33
|
+
content: "If true, `maxDepth` is absolute from the root (default: true)."
|
|
34
|
+
- term:
|
|
35
|
+
code: treeRootPath
|
|
36
|
+
after: "(string, optional)"
|
|
37
|
+
details: "Path to a subtree to display as the root."
|
|
38
|
+
- term:
|
|
39
|
+
code: keepBaseItem
|
|
40
|
+
after: "(boolean, optional)"
|
|
41
|
+
details:
|
|
42
|
+
type: Markdown
|
|
43
|
+
content: "If true, keeps the base item when using `treeRootPath`."
|
|
44
|
+
- term:
|
|
45
|
+
code: sortableTreeOptions
|
|
46
|
+
after: "(object, optional)"
|
|
47
|
+
details: "Additional options for SortableTree."
|
|
20
48
|
|
|
21
49
|
- type: RjBuildDescriber
|
|
22
50
|
title: "Interactive Example: Editable family tree"
|
|
@@ -74,8 +102,8 @@ renderView:
|
|
|
74
102
|
- type: Markdown
|
|
75
103
|
content: |
|
|
76
104
|
## Limitations
|
|
77
|
-
- Tree data must be an array of objects with `id`, `children`, and `value` keys
|
|
78
|
-
- No built-in async loading of children
|
|
79
|
-
- No built-in search/filter UI
|
|
80
|
-
- Only one tree can be edited at a time per component instance
|
|
81
|
-
- No animation customization beyond what dnd-kit-sortable-tree provides
|
|
105
|
+
- Tree data must be an array of objects with `id`, `children`, and `value` keys.
|
|
106
|
+
- No built-in async loading of children.
|
|
107
|
+
- No built-in search/filter UI.
|
|
108
|
+
- Only one tree can be edited at a time per component instance.
|
|
109
|
+
- No animation customization beyond what dnd-kit-sortable-tree provides.
|
|
@@ -6,9 +6,23 @@ renderView:
|
|
|
6
6
|
The `FormatNumeral` component displays a number as a Roman numeral or Latin letter. Useful for sections, lists, or any context where a non-Arabic numeral is needed.
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
|
|
10
|
+
- type: DefinitionList
|
|
11
|
+
content:
|
|
12
|
+
- term:
|
|
13
|
+
code: content
|
|
14
|
+
after: "(number, required)"
|
|
15
|
+
details: "The number to format."
|
|
16
|
+
- term:
|
|
17
|
+
code: format
|
|
18
|
+
after: "(string, required)"
|
|
19
|
+
details:
|
|
20
|
+
type: Markdown
|
|
21
|
+
content: "One of: `roman-upper`, `roman-lower`, `latin-upper`, `latin-lower`."
|
|
22
|
+
- term:
|
|
23
|
+
code: attributes
|
|
24
|
+
after: "(object, optional)"
|
|
25
|
+
details: "Additional attributes for the root element."
|
|
12
26
|
|
|
13
27
|
- type: RjBuildDescriber
|
|
14
28
|
title: "Interactive Example: Format a number"
|
|
@@ -52,7 +66,7 @@ renderView:
|
|
|
52
66
|
- type: Markdown
|
|
53
67
|
content: |
|
|
54
68
|
## Limitations
|
|
55
|
-
- Only positive integers are supported (no zero, negative, or fractional numbers)
|
|
56
|
-
- No support for custom numeral systems
|
|
57
|
-
- No localization or language-specific formatting
|
|
58
|
-
- No error message for invalid input; nothing is rendered if the input is invalid
|
|
69
|
+
- Only positive integers are supported (no zero, negative, or fractional numbers).
|
|
70
|
+
- No support for custom numeral systems.
|
|
71
|
+
- No localization or language-specific formatting.
|
|
72
|
+
- No error message for invalid input; nothing is rendered if the input is invalid.
|
|
@@ -8,10 +8,27 @@ renderView:
|
|
|
8
8
|
**Note:** The `tag` property must be a static string. It cannot be set dynamically via template or data.
|
|
9
9
|
|
|
10
10
|
## Properties
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
-
|
|
11
|
+
|
|
12
|
+
- type: DefinitionList
|
|
13
|
+
content:
|
|
14
|
+
- term:
|
|
15
|
+
code: tag
|
|
16
|
+
after: "(string, required)"
|
|
17
|
+
details:
|
|
18
|
+
type: Markdown
|
|
19
|
+
content: "The HTML tag to render (e.g., div, span, section)."
|
|
20
|
+
- term:
|
|
21
|
+
code: attributes
|
|
22
|
+
after: "(object, optional)"
|
|
23
|
+
details: "Attributes for the tag (class, id, etc.)."
|
|
24
|
+
- term:
|
|
25
|
+
code: content
|
|
26
|
+
after: "(object|array, optional)"
|
|
27
|
+
details: "Content to render inside the tag (any Reactive-JSON view or array)."
|
|
28
|
+
- term:
|
|
29
|
+
code: extra
|
|
30
|
+
after: "(object, optional)"
|
|
31
|
+
details: "Additional content rendered after the main tag."
|
|
15
32
|
|
|
16
33
|
- type: BsAlert
|
|
17
34
|
attributes:
|
|
@@ -60,8 +77,8 @@ renderView:
|
|
|
60
77
|
- type: Markdown
|
|
61
78
|
content: |
|
|
62
79
|
## Limitations
|
|
63
|
-
- The `tag` property does not support template evaluation and must be a static string
|
|
64
|
-
- No validation of tag names; invalid tags may cause rendering errors
|
|
65
|
-
- No support for dangerouslySetInnerHTML (use PreformattedMarkup for raw HTML)
|
|
66
|
-
- No built-in support for event handlers (use actions system for interactivity)
|
|
67
|
-
- No automatic support for custom attributes beyond React's attribute normalization
|
|
80
|
+
- The `tag` property does not support template evaluation and must be a static string.
|
|
81
|
+
- No validation of tag names; invalid tags may cause rendering errors.
|
|
82
|
+
- No support for dangerouslySetInnerHTML (use PreformattedMarkup for raw HTML).
|
|
83
|
+
- No built-in support for event handlers (use actions system for interactivity).
|
|
84
|
+
- No automatic support for custom attributes beyond React's attribute normalization.
|
|
@@ -6,10 +6,27 @@ renderView:
|
|
|
6
6
|
The `LabelFromValue` component displays the label associated with a value, using an option-like structure. It is useful for showing the display label of a value selected in a SelectField or any value/label mapping.
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
-
|
|
9
|
+
|
|
10
|
+
- type: DefinitionList
|
|
11
|
+
content:
|
|
12
|
+
- term:
|
|
13
|
+
code: dataLocation
|
|
14
|
+
after: "(string, required)"
|
|
15
|
+
details: "Path to the value."
|
|
16
|
+
- term:
|
|
17
|
+
code: options
|
|
18
|
+
after: "(array, optional)"
|
|
19
|
+
details:
|
|
20
|
+
type: Markdown
|
|
21
|
+
content: "Array of `{label, value}` objects."
|
|
22
|
+
- term:
|
|
23
|
+
code: dynamicOptions
|
|
24
|
+
after: "(any, optional)"
|
|
25
|
+
details: "Template value for dynamic options."
|
|
26
|
+
- term:
|
|
27
|
+
code: defaultFieldValue
|
|
28
|
+
after: "(any, optional)"
|
|
29
|
+
details: "Default value if none is set."
|
|
13
30
|
|
|
14
31
|
- type: RjBuildDescriber
|
|
15
32
|
title: "Interactive Example: Display label from value"
|
|
@@ -48,7 +65,7 @@ renderView:
|
|
|
48
65
|
- type: Markdown
|
|
49
66
|
content: |
|
|
50
67
|
## Limitations
|
|
51
|
-
- Only the first matching label is displayed; duplicate values in options are not supported
|
|
52
|
-
- No support for grouped options or nested structures
|
|
53
|
-
- No built-in formatting for the label (use a wrapper if needed)
|
|
54
|
-
- If no options are provided, the raw value is shown
|
|
68
|
+
- Only the first matching label is displayed; duplicate values in options are not supported.
|
|
69
|
+
- No support for grouped options or nested structures.
|
|
70
|
+
- No built-in formatting for the label (use a wrapper if needed).
|
|
71
|
+
- If no options are provided, the raw value is shown.
|
|
@@ -7,12 +7,35 @@ renderView:
|
|
|
7
7
|
The `Modal` component displays a dialog that can be controlled by local state or by a boolean in the global data context. It is useful for confirmations, information, or any overlay content.
|
|
8
8
|
|
|
9
9
|
## Properties
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
-
|
|
14
|
-
|
|
15
|
-
|
|
10
|
+
|
|
11
|
+
- type: DefinitionList
|
|
12
|
+
content:
|
|
13
|
+
- term:
|
|
14
|
+
code: headerTitle
|
|
15
|
+
after: "(object, optional)"
|
|
16
|
+
details: "Content for the modal header (any Reactive-JSON view)."
|
|
17
|
+
- term:
|
|
18
|
+
code: body
|
|
19
|
+
after: "(object, optional)"
|
|
20
|
+
details: "Content for the modal body (any Reactive-JSON view)."
|
|
21
|
+
- term:
|
|
22
|
+
code: closeButton
|
|
23
|
+
after: "(boolean, optional)"
|
|
24
|
+
details: "Show a close button in the header (default: false)."
|
|
25
|
+
- term:
|
|
26
|
+
code: showBoolPath
|
|
27
|
+
after: "(string|boolean, optional)"
|
|
28
|
+
details:
|
|
29
|
+
type: Markdown
|
|
30
|
+
content: "If a string, path to a boolean in data controlling visibility; otherwise, local state is used."
|
|
31
|
+
- term:
|
|
32
|
+
code: attributes
|
|
33
|
+
after: "(object, optional)"
|
|
34
|
+
details: "Additional attributes for the modal (size, centered, etc.)."
|
|
35
|
+
- term:
|
|
36
|
+
code: className
|
|
37
|
+
after: "(string, optional)"
|
|
38
|
+
details: "Additional CSS classes (always includes `reactive-json`)."
|
|
16
39
|
|
|
17
40
|
- type: RjBuildDescriber
|
|
18
41
|
title: "Interactive Example: Modal controlled by data path"
|
|
@@ -83,11 +106,11 @@ renderView:
|
|
|
83
106
|
- type: Markdown
|
|
84
107
|
content: |
|
|
85
108
|
## Limitations
|
|
86
|
-
- No built-in async or loading state
|
|
87
|
-
- No advanced accessibility beyond react-bootstrap
|
|
88
|
-
- If `showBoolPath` is a data path, it must resolve to a boolean
|
|
89
|
-
- No animation customization beyond react-bootstrap
|
|
109
|
+
- No built-in async or loading state.
|
|
110
|
+
- No advanced accessibility beyond react-bootstrap.
|
|
111
|
+
- If `showBoolPath` is a data path, it must resolve to a boolean.
|
|
112
|
+
- No animation customization beyond react-bootstrap.
|
|
90
113
|
|
|
91
114
|
## Notes
|
|
92
|
-
- Multiple modals can be displayed simultaneously by using different `showBoolPath` values or state-controlled modals
|
|
93
|
-
- Each modal is independently controlled and managed
|
|
115
|
+
- Multiple modals can be displayed simultaneously by using different `showBoolPath` values or state-controlled modals.
|
|
116
|
+
- Each modal is independently controlled and managed.
|
|
@@ -6,10 +6,26 @@ renderView:
|
|
|
6
6
|
The `PreformattedMarkup` component renders HTML content with a strict allowlist of tags for safety. Use it to display rich text or HTML snippets, with filtering to prevent unwanted markup.
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
|
-
- `content` (string, required): The HTML string to render (can use template values)
|
|
10
|
-
- `htmlTagAllowList` (array, optional): List of allowed tags (overrides default)
|
|
11
|
-
- `additionalAllowedTags` (array, optional): Tags to add to the allowlist
|
|
12
9
|
|
|
10
|
+
- type: DefinitionList
|
|
11
|
+
content:
|
|
12
|
+
- term:
|
|
13
|
+
code: content
|
|
14
|
+
after: "(string, required)"
|
|
15
|
+
details:
|
|
16
|
+
type: Markdown
|
|
17
|
+
content: "The HTML string to render (can use template values)."
|
|
18
|
+
- term:
|
|
19
|
+
code: htmlTagAllowList
|
|
20
|
+
after: "(array, optional)"
|
|
21
|
+
details: List of allowed tags (overrides default).
|
|
22
|
+
- term:
|
|
23
|
+
code: additionalAllowedTags
|
|
24
|
+
after: "(array, optional)"
|
|
25
|
+
details: Tags to add to the allowlist.
|
|
26
|
+
|
|
27
|
+
- type: Markdown
|
|
28
|
+
content: |
|
|
13
29
|
**Default allowed tags:** abbr, acronym, b, blockquote, br, caption, code, div, em, h1-h6, i, li, ol, p, span, sup, strong, table, tbody, td, tfoot, th, thead, tr, ul
|
|
14
30
|
|
|
15
31
|
- type: RjBuildDescriber
|
|
@@ -31,7 +47,7 @@ renderView:
|
|
|
31
47
|
- type: Markdown
|
|
32
48
|
content: |
|
|
33
49
|
## Limitations
|
|
34
|
-
- Only allowed tags are rendered; all others are stripped
|
|
35
|
-
- No support for custom attributes or inline styles
|
|
36
|
-
- No script, style, or event attributes are executed
|
|
37
|
-
- Not suitable for rendering untrusted HTML with complex requirements
|
|
50
|
+
- Only allowed tags are rendered; all others are stripped.
|
|
51
|
+
- No support for custom attributes or inline styles.
|
|
52
|
+
- No script, style, or event attributes are executed.
|
|
53
|
+
- Not suitable for rendering untrusted HTML with complex requirements.
|
|
@@ -11,11 +11,12 @@ renderView:
|
|
|
11
11
|
disappearance of the default collapse button.
|
|
12
12
|
|
|
13
13
|
## Properties
|
|
14
|
-
|
|
14
|
+
|
|
15
|
+
None.
|
|
15
16
|
|
|
16
17
|
## Technical Details
|
|
17
|
-
- Renders a button with CSS classes for styling
|
|
18
|
-
- Only appears when the tree item has children and supports collapsing
|
|
18
|
+
- Renders a button with CSS classes for styling.
|
|
19
|
+
- Only appears when the tree item has children and supports collapsing.
|
|
19
20
|
|
|
20
21
|
- type: RjBuildDescriber
|
|
21
22
|
title: "Interactive Example: Tree with a right aligned collapse button"
|
|
@@ -85,8 +86,8 @@ renderView:
|
|
|
85
86
|
- type: Markdown
|
|
86
87
|
content: |
|
|
87
88
|
## Limitations
|
|
88
|
-
- Only works within the template context of a `FolderSortableTree` item
|
|
89
|
-
- The button only appears when the tree item has children (`childCount > 0`)
|
|
90
|
-
- No customization of the collapse/expand behavior beyond what the underlying SortableTree provides
|
|
89
|
+
- Only works within the template context of a `FolderSortableTree` item.
|
|
90
|
+
- The button only appears when the tree item has children (`childCount > 0`).
|
|
91
|
+
- No customization of the collapse/expand behavior beyond what the underlying SortableTree provides.
|
|
91
92
|
- The styling is controlled by the dnd-kit-sortable-tree CSS classes. You will need to provide CSS to override
|
|
92
93
|
the default styling.
|
|
@@ -6,16 +6,52 @@ renderView:
|
|
|
6
6
|
The `SyntaxHighlighter` component provides syntax highlighting for code snippets using the react-syntax-highlighter library. It supports multiple programming languages and themes, making it perfect for displaying formatted code in documentation or tutorials.
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
|
-
- `content` (string, required): The code content to highlight (supports template evaluation)
|
|
10
|
-
- `language` (string, optional): Programming language for syntax highlighting (default: "text")
|
|
11
|
-
- `style` (object, optional): Custom style theme for highlighting (overrides automatic dark mode detection)
|
|
12
|
-
- `lightStyle` (object, optional): Style theme for light mode (supports template evaluation)
|
|
13
|
-
- `darkStyle` (object, optional): Style theme for dark mode (supports template evaluation)
|
|
14
|
-
- `showLineNumbers` (boolean, optional): Whether to display line numbers (default: false)
|
|
15
|
-
- `wrapLines` (boolean, optional): Whether to wrap lines (default: false)
|
|
16
|
-
- `wrapLongLines` (boolean, optional): Whether to wrap long lines (default: false)
|
|
17
|
-
- `attributes` (object, optional): HTML attributes for the wrapper div
|
|
18
9
|
|
|
10
|
+
- type: DefinitionList
|
|
11
|
+
content:
|
|
12
|
+
- term:
|
|
13
|
+
code: content
|
|
14
|
+
after: "(string, required)"
|
|
15
|
+
details:
|
|
16
|
+
type: Markdown
|
|
17
|
+
content: "The code content to highlight (supports template evaluation)."
|
|
18
|
+
- term:
|
|
19
|
+
code: language
|
|
20
|
+
after: "(string, optional)"
|
|
21
|
+
details:
|
|
22
|
+
type: Markdown
|
|
23
|
+
content: "Programming language for syntax highlighting (default: `text`)."
|
|
24
|
+
- term:
|
|
25
|
+
code: style
|
|
26
|
+
after: "(object, optional)"
|
|
27
|
+
details: Custom style theme for highlighting (overrides automatic dark mode detection).
|
|
28
|
+
- term:
|
|
29
|
+
code: lightStyle
|
|
30
|
+
after: "(object, optional)"
|
|
31
|
+
details: Style theme for light mode (supports template evaluation).
|
|
32
|
+
- term:
|
|
33
|
+
code: darkStyle
|
|
34
|
+
after: "(object, optional)"
|
|
35
|
+
details: Style theme for dark mode (supports template evaluation).
|
|
36
|
+
- term:
|
|
37
|
+
code: showLineNumbers
|
|
38
|
+
after: "(boolean, optional)"
|
|
39
|
+
details: Whether to display line numbers (default: false).
|
|
40
|
+
- term:
|
|
41
|
+
code: wrapLines
|
|
42
|
+
after: "(boolean, optional)"
|
|
43
|
+
details: Whether to wrap lines (default: false).
|
|
44
|
+
- term:
|
|
45
|
+
code: wrapLongLines
|
|
46
|
+
after: "(boolean, optional)"
|
|
47
|
+
details: Whether to wrap long lines (default: false).
|
|
48
|
+
- term:
|
|
49
|
+
code: attributes
|
|
50
|
+
after: "(object, optional)"
|
|
51
|
+
details: HTML attributes for the wrapper div.
|
|
52
|
+
|
|
53
|
+
- type: Markdown
|
|
54
|
+
content: |
|
|
19
55
|
**Automatic Dark Mode**: The component automatically detects the user's color scheme preference and uses appropriate themes:
|
|
20
56
|
- Light mode: `docco` theme by default
|
|
21
57
|
- Dark mode: `atomOneDark` theme by default
|
|
@@ -230,9 +266,9 @@ renderView:
|
|
|
230
266
|
The component automatically adapts to the user's system color scheme preference:
|
|
231
267
|
|
|
232
268
|
### Automatic Theme Detection
|
|
233
|
-
- **Light mode**: Uses the `docco` theme by default (clean, minimal highlighting)
|
|
234
|
-
- **Dark mode**: Uses the `atomOneDark` theme by default (modern dark theme with good contrast)
|
|
235
|
-
- **Real-time switching**: Themes change instantly when the user switches their system preference
|
|
269
|
+
- **Light mode**: Uses the `docco` theme by default (clean, minimal highlighting).
|
|
270
|
+
- **Dark mode**: Uses the `atomOneDark` theme by default (modern dark theme with good contrast).
|
|
271
|
+
- **Real-time switching**: Themes change instantly when the user switches their system preference.
|
|
236
272
|
|
|
237
273
|
### Custom Theme Configuration
|
|
238
274
|
|
|
@@ -261,10 +297,10 @@ renderView:
|
|
|
261
297
|
## Styling and Themes
|
|
262
298
|
|
|
263
299
|
The component supports all react-syntax-highlighter themes. The style can be:
|
|
264
|
-
- A static style object imported from react-syntax-highlighter themes
|
|
265
|
-
- A template-evaluated value from your data context
|
|
266
|
-
- Any valid react-syntax-highlighter style configuration
|
|
267
|
-
- Different themes for light and dark modes using `lightStyle` and `darkStyle` properties
|
|
300
|
+
- A static style object imported from react-syntax-highlighter themes.
|
|
301
|
+
- A template-evaluated value from your data context.
|
|
302
|
+
- Any valid react-syntax-highlighter style configuration.
|
|
303
|
+
- Different themes for light and dark modes using `lightStyle` and `darkStyle` properties.
|
|
268
304
|
|
|
269
305
|
- type: Markdown
|
|
270
306
|
content: |
|
|
@@ -287,7 +323,7 @@ renderView:
|
|
|
287
323
|
- type: Markdown
|
|
288
324
|
content: |
|
|
289
325
|
## Limitations
|
|
290
|
-
- Style themes must be compatible with react-syntax-highlighter
|
|
291
|
-
- Large code blocks may impact performance
|
|
292
|
-
- Line numbers display depends on the chosen theme
|
|
293
|
-
- Custom syntax definitions are not supported through the template system
|
|
326
|
+
- Style themes must be compatible with react-syntax-highlighter.
|
|
327
|
+
- Large code blocks may impact performance.
|
|
328
|
+
- Line numbers display depends on the chosen theme.
|
|
329
|
+
- Custom syntax definitions are not supported through the template system.
|
|
@@ -6,13 +6,22 @@ renderView:
|
|
|
6
6
|
The `Tabs` component provides a tabbed interface using React-Bootstrap. Each tab must have a unique `eventKey` and a `title` in its attributes, and can contain any valid Reactive-JSON view content.
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
9
|
+
|
|
10
|
+
- type: DefinitionList
|
|
11
|
+
content:
|
|
12
|
+
- term:
|
|
13
|
+
code: tabs
|
|
14
|
+
after: "(array, required)"
|
|
15
|
+
details:
|
|
16
|
+
type: Markdown
|
|
17
|
+
content: |
|
|
18
|
+
Static array of tab objects. This array is not evaluated by the template system and must be defined statically in the schema.
|
|
19
|
+
Each tab object must have:
|
|
20
|
+
- `attributes` (object, required):
|
|
21
|
+
- `title` (string, required): The label of the tab.
|
|
22
|
+
- `eventKey` (string, required): A unique identifier for the tab.
|
|
23
|
+
- Other attributes are passed to the React-Bootstrap Tab component.
|
|
24
|
+
- `content` (array|object, required): The content to display in the tab. Can be any valid Reactive-JSON view (components, arrays, templates, etc.)
|
|
16
25
|
|
|
17
26
|
- type: RjBuildDescriber
|
|
18
27
|
title: "Interactive Example: Editable tabs"
|
|
@@ -47,11 +56,11 @@ renderView:
|
|
|
47
56
|
- type: Markdown
|
|
48
57
|
content: |
|
|
49
58
|
## Limitations
|
|
50
|
-
- The `tabs` array must be static in the schema (no dynamic generation or template evaluation)
|
|
51
|
-
- Each tab must have a unique `eventKey` in its attributes
|
|
52
|
-
- The `title` attribute is required for each tab
|
|
53
|
-
- No support for dynamic addition/removal of tabs at runtime
|
|
54
|
-
- No built-in support for icons in tab headers
|
|
55
|
-
- No animation customization beyond what react-bootstrap provides
|
|
56
|
-
- All tab content is rendered at once (not lazy-loaded)
|
|
57
|
-
- Tab selection state is not persisted between renders
|
|
59
|
+
- The `tabs` array must be static in the schema (no dynamic generation or template evaluation).
|
|
60
|
+
- Each tab must have a unique `eventKey` in its attributes.
|
|
61
|
+
- The `title` attribute is required for each tab.
|
|
62
|
+
- No support for dynamic addition/removal of tabs at runtime.
|
|
63
|
+
- No built-in support for icons in tab headers.
|
|
64
|
+
- No animation customization beyond what react-bootstrap provides.
|
|
65
|
+
- All tab content is rendered at once (not lazy-loaded).
|
|
66
|
+
- Tab selection state is not persisted between renders.
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
# BootstrapElement
|
|
2
2
|
|
|
3
|
-
## Introduction
|
|
4
|
-
|
|
5
3
|
The `BootstrapElement` component is an internal wrapper used by Reactive-JSON to integrate React-Bootstrap components into the template system.
|
|
6
4
|
|
|
7
5
|
**You should not use this component directly in your rjbuild.**
|
|
@@ -9,9 +7,9 @@ The `BootstrapElement` component is an internal wrapper used by Reactive-JSON to
|
|
|
9
7
|
It is automatically used by higher-level components (such as BsAccordion, BsAlert, etc.) to provide Bootstrap features in a declarative way.
|
|
10
8
|
|
|
11
9
|
## Properties
|
|
12
|
-
- `attributes` (object, optional): Attributes passed to the underlying Bootstrap component
|
|
13
|
-
- `content` (object/array, optional): Content to render inside the Bootstrap component
|
|
10
|
+
- `attributes` (object, optional): Attributes passed to the underlying Bootstrap component.
|
|
11
|
+
- `content` (object/array, optional): Content to render inside the Bootstrap component.
|
|
14
12
|
|
|
15
13
|
## Limitations
|
|
16
|
-
- Not intended for direct use in rjbuild templates
|
|
17
|
-
- Used internally by the system for Bootstrap integration
|
|
14
|
+
- Not intended for direct use in rjbuild templates.
|
|
15
|
+
- Used internally by the system for Bootstrap integration.
|
|
@@ -10,9 +10,20 @@ renderView:
|
|
|
10
10
|
It is automatically used by higher-level components (such as BsAccordion, BsAlert, etc.) to provide Bootstrap features in a declarative way.
|
|
11
11
|
|
|
12
12
|
## Properties
|
|
13
|
-
- `attributes` (object, optional): Attributes passed to the underlying Bootstrap component
|
|
14
|
-
- `content` (object/array, optional): Content to render inside the Bootstrap component
|
|
15
13
|
|
|
14
|
+
- type: DefinitionList
|
|
15
|
+
content:
|
|
16
|
+
- term:
|
|
17
|
+
code: attributes
|
|
18
|
+
after: "(object, optional)"
|
|
19
|
+
details: "Attributes passed to the underlying Bootstrap component."
|
|
20
|
+
- term:
|
|
21
|
+
code: content
|
|
22
|
+
after: "(object|array, optional)"
|
|
23
|
+
details: "Content to render inside the Bootstrap component."
|
|
24
|
+
|
|
25
|
+
- type: Markdown
|
|
26
|
+
content: |
|
|
16
27
|
## Limitations
|
|
17
|
-
- Not intended for direct use in rjbuild templates
|
|
18
|
-
- Used internally by the system for Bootstrap integration
|
|
28
|
+
- Not intended for direct use in rjbuild templates.
|
|
29
|
+
- Used internally by the system for Bootstrap integration.
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
# Count
|
|
2
2
|
|
|
3
|
-
## Introduction
|
|
4
|
-
|
|
5
3
|
The `Count` component returns the number of items matching a JSONPath pattern in the data context. It is useful for displaying counts of elements, such as the number of items in a list, matching a filter, or present in a subtree.
|
|
6
4
|
|
|
7
5
|
## Properties
|
|
8
|
-
- `jsonPathPattern` (string, required): The JSONPath pattern to evaluate for counting
|
|
6
|
+
- `jsonPathPattern` (string, required): The JSONPath pattern to evaluate for counting.
|
|
9
7
|
- `context` (string, optional): The context to use for evaluation (`global`, `template`, or `root`). Default is `global`.
|
|
10
8
|
|
|
11
9
|
## Behavior
|
|
12
|
-
- Evaluates the given JSONPath pattern on the selected data context
|
|
13
|
-
- Returns the number of matches found
|
|
14
|
-
- If `context` is `global`, uses the global data context; if `template`, uses the template context; if `root`, uses the root context
|
|
15
|
-
- If `jsonPathPattern` is not provided, renders nothing
|
|
10
|
+
- Evaluates the given JSONPath pattern on the selected data context.
|
|
11
|
+
- Returns the number of matches found.
|
|
12
|
+
- If `context` is `global`, uses the global data context; if `template`, uses the template context; if `root`, uses the root context.
|
|
13
|
+
- If `jsonPathPattern` is not provided, renders nothing.
|
|
16
14
|
|
|
17
15
|
## Example
|
|
18
16
|
```yaml
|
|
@@ -32,6 +30,6 @@ data:
|
|
|
32
30
|
```
|
|
33
31
|
|
|
34
32
|
## Limitations
|
|
35
|
-
- Only supports JSONPath patterns
|
|
36
|
-
- Returns 0 if no match or if the pattern is invalid
|
|
37
|
-
- Does not support advanced filtering or custom functions in JSONPath
|
|
33
|
+
- Only supports JSONPath patterns.
|
|
34
|
+
- Returns 0 if no match or if the pattern is invalid.
|
|
35
|
+
- Does not support advanced filtering or custom functions in JSONPath.
|
|
@@ -6,14 +6,27 @@ renderView:
|
|
|
6
6
|
The `Count` component returns the number of items matching a JSONPath pattern in the data context. It is useful for displaying counts of elements, such as the number of items in a list, matching a filter, or present in a subtree.
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
|
|
10
|
+
- type: DefinitionList
|
|
11
|
+
content:
|
|
12
|
+
- term:
|
|
13
|
+
code: jsonPathPattern
|
|
14
|
+
after: "(string, required)"
|
|
15
|
+
details:
|
|
16
|
+
type: Markdown
|
|
17
|
+
content: "The JSONPath pattern to evaluate for counting."
|
|
18
|
+
- term:
|
|
19
|
+
code: context
|
|
20
|
+
after: "(string, optional)"
|
|
21
|
+
details:
|
|
22
|
+
type: Markdown
|
|
23
|
+
content: "The context to use for evaluation (`global`, `template`, or `root`). Default is `global`."
|
|
11
24
|
|
|
12
25
|
## Behavior
|
|
13
|
-
- Evaluates the given JSONPath pattern on the selected data context
|
|
14
|
-
- Returns the number of matches found
|
|
15
|
-
- If `context` is `global`, uses the global data context; if `template`, uses the template context; if `root`, uses the root context
|
|
16
|
-
- If `jsonPathPattern` is not provided, renders nothing
|
|
26
|
+
- Evaluates the given JSONPath pattern on the selected data context.
|
|
27
|
+
- Returns the number of matches found.
|
|
28
|
+
- If `context` is `global`, uses the global data context; if `template`, uses the template context; if `root`, uses the root context.
|
|
29
|
+
- If `jsonPathPattern` is not provided, renders nothing.
|
|
17
30
|
|
|
18
31
|
- type: RjBuildDescriber
|
|
19
32
|
title: "Example"
|
|
@@ -320,6 +333,6 @@ renderView:
|
|
|
320
333
|
- `$..products` - Count all products at any level (recursive)
|
|
321
334
|
|
|
322
335
|
## Limitations
|
|
323
|
-
- Only supports JSONPath patterns
|
|
324
|
-
- Returns 0 if no match or if the pattern is invalid
|
|
325
|
-
- Does not support advanced filtering or custom functions in JSONPath
|
|
336
|
+
- Only supports JSONPath patterns.
|
|
337
|
+
- Returns 0 if no match or if the pattern is invalid.
|
|
338
|
+
- Does not support advanced filtering or custom functions in JSONPath.
|