Technical Preview Widgets
Instance Conf. List tsm-entity-instance-configuration-list-widget
List of instance configurations in a tabular view with filtering and editing options.
Widget Or Layout: unknown
Value:
{
"title": "Instance Configuration List",
"widget": {
"type": "tsm-entity-instance-configuration-list-widget"
},
"type": "layout",
"config": {
"pageSize": "20"
}
}
Inputs
Page Size
Key: pageSize
Name: Page Size
Description: Number of rows displayed on one page.
Table Height
Key: scrollHeight
Name: Table Height
Description: The custom height is applied only when the Table / TreeTable is in scrollable mode, contains more than 6 records, and the total height of all rows on the page exceeds the custom height value.
If the custom height is larger than the total height of the rows on the page, the Table / TreeTable automatically reduces its height to avoid empty space.
In Full Screen mode, the custom height setting is ignored. The Table / TreeTable uses a flex configuration which automatically manages the final height.
The height can be specified in these units: px, em, rem, vh.
Sample: 500px
Table Data View Mode
Key: dataViewMode
Name: Table Data View Mode
Description: "Table with scroll" keeps original column widths and a horizontal scrollbar. "FullScreen table" adjusts column widths to the window size.
Additional Context Data
Key: externalData
Name: Additional Context Data
Description: Specifies additional contextual data in the form of a JSON object for creating a new record in this listing, which is passed to the form context.
Listing Type
Key: listingType
Name: Listing Type
Description: Specifies which listing type is used for display.
Listing Profile
Key: profileId
Name: Listing Profile
Description: Specifies the listing profile, which defines columns, order, and other display settings.
Listing Profile Category
Key: profileCategory
Name: Listing Profile Category
Description: Name of the category from which profiles can be selected.
Output Context Key
Key: outputContextKey
Name: Output Context Key
Description: Key under which this table's selection is exposed in the form context as $outputContext.<key> (e.g. ticket, order, task). Contains selectedEntity (the selected row) and selectedIds (IDs across all pages). Empty = legacy behavior (the selected row is written directly to $outputContext).
Expose selected entities (selectedEntities)
Key: exposeSelectedEntities
Name: Expose selected entities (selectedEntities)
Description: In addition to selectedIds, also expose selectedEntities — the full rows, but for the CURRENT page only. Off by default: heavier payload than an array of IDs. Use selectedIds to work with the cross-page selection.
Hide Export Button
Key: showExport
Name: Hide Export Button
Description: Hides the export button.
Hide Filter
Key: showFilters
Name: Hide Filter
Description: Hides the listing filters.
Hide Refresh Button
Key: showRefresh
Name: Hide Refresh Button
Description: Hides the refresh button.
Hide Paginator
Key: showPaginator
Name: Hide Paginator
Description: Hides the listing pagination.
Hide Columns Manager
Key: showManagerColumns
Name: Hide Columns Manager
Description: Hides the columns manager.
Hide Profiles
Key: showProfiles
Name: Hide Profiles
Description: Hides the listing profiles.
Hide Sort Manager
Key: showManagerSort
Name: Hide Sort Manager
Description: Hides the sort manager.
Hide Color Manager
Key: showManagerColor
Name: Hide Color Manager
Description: Hides the color manager.
Hide Listing Config
Key: showListingConfig
Name: Hide Listing Config
Description: Hides the listing configuration.
Hide Data View Mode
Key: hiddenDataViewMode
Name: Hide Data View Mode
Description: Hides the option to switch between table and kanban view.
Hide Button Section
Key: hideButtonGroup
Name: Hide Button Section
Description: Hides the button section.
Disable Sticky Header
Key: scrollable
Name: Disable Sticky Header
Description: Disables the fixed table header while scrolling.
TQL WHERE Extension
Key: extendTqlWhere
Name: TQL WHERE Extension
Description: Adds a WHERE condition in TQL. Format: COLUMN_NAME OPERATOR VALUE.
TQL Sorting
Key: externalTqlSort
Name: TQL Sorting
Description: Modifies the default sorting in TQL. Format: COLUMN_NAME ASC/DESC.
TQL Sorting for Nested Tables
Key: externalTqlSortForNested
Name: TQL Sorting for Nested Tables
Description: Modifies the default sorting for nested tables in TQL. Format: COLUMN_NAME ASC/DESC.
TQL Query Params
Key: tqlQueryParams
Name: TQL Query Params
Description: Adds query parameters to the TQL request.
Filters
Key: filters
Name: Filters
Description: Allows defining filters for the data displayed in the list.
Instance Conf. Bookmark tsm-entity-instance-configuration-list-panel
Simple list of instance configurations in a tabular view.
Widget Or Layout: unknown
Value:
{
"type": "layout",
"title": "Instance Configuration Bookmark",
"widget": {
"type": "tsm-entity-instance-configuration-list-panel"
}
}
Inputs
Entity instance ID
Key: entityInstanceId
Name: Entity instance ID
Default: null
Output Context Key
Key: outputContextKey
Name: Output Context Key
Description: Key under which this table's selection is exposed in the form context as $outputContext.<key>.
Default: null
Expose selected entities (selectedEntities)
Key: exposeSelectedEntities
Name: Expose selected entities (selectedEntities)
Description: Also expose selectedEntities (current page only) in addition to selectedIds.
Default: false
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-entity-instance-configuration-list-panel/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen entity instance id — gen-entity-instance-id.json
Demonstrates widget.entityInstanceId = "exampleValue" on tsm-entity-instance-configuration-list-panel.
{
"type": "object",
"title": "Instance Conf. Bookmark — Entity instance ID",
"description": "Demonstrates widget.entityInstanceId = \"exampleValue\" on tsm-entity-instance-configuration-list-panel.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-configuration-list-panel",
"entityInstanceId": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen expose selected entities — gen-expose-selected-entities.json
Expose selected entities (selectedEntities): Also expose selectedEntities (current page only) in addition to selectedIds.
{
"type": "object",
"title": "Instance Conf. Bookmark — Expose selected entities (selectedEntities)",
"description": "Expose selected entities (selectedEntities): Also expose selectedEntities (current page only) in addition to selectedIds.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-configuration-list-panel",
"exposeSelectedEntities": true
}
}
},
"layout": [
"field"
]
}
Gen output context key — gen-output-context-key.json
Output Context Key: Key under which this table's selection is exposed in the form context as $outputContext.<key>.
{
"type": "object",
"title": "Instance Conf. Bookmark — Output Context Key",
"description": "Output Context Key: Key under which this table's selection is exposed in the form context as $outputContext.<key>.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-configuration-list-panel",
"outputContextKey": "exampleValue"
}
}
},
"layout": [
"field"
]
}
New Dependent Instance Button tsm-entity-instance-create-dependent
Button to create a dependent instance.
Widget Or Layout: unknown
Value:
{
"type": "layout",
"title": "New Dependent Entity Instance Button",
"widget": {
"type": "tsm-entity-instance-create-dependent"
}
}
Inputs
Inventory
Key: entityInstanceConfiguration
Name: Inventory
Default: null
Default type
Key: defaultType
Name: Default type
Default: null
Icon
Key: icon
Name: Icon
Default: null
Redirect to detail
Key: redirectToDetail
Name: Redirect to detail
Default: true
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-entity-instance-create-dependent/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen default type — gen-default-type.json
Demonstrates widget.defaultType = "exampleValue" on tsm-entity-instance-create-dependent.
{
"type": "object",
"title": "New Dependent Instance Button — Default type",
"description": "Demonstrates widget.defaultType = \"exampleValue\" on tsm-entity-instance-create-dependent.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-create-dependent",
"defaultType": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen entity instance configuration — gen-entity-instance-configuration.json
Demonstrates widget.entityInstanceConfiguration = "exampleValue" on tsm-entity-instance-create-dependent.
{
"type": "object",
"title": "New Dependent Instance Button — Inventory",
"description": "Demonstrates widget.entityInstanceConfiguration = \"exampleValue\" on tsm-entity-instance-create-dependent.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-create-dependent",
"entityInstanceConfiguration": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen icon — gen-icon.json
Demonstrates widget.icon = "p-icon-search" on tsm-entity-instance-create-dependent.
{
"type": "object",
"title": "New Dependent Instance Button — Icon",
"description": "Demonstrates widget.icon = \"p-icon-search\" on tsm-entity-instance-create-dependent.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-create-dependent",
"icon": "p-icon-search"
}
}
},
"layout": [
"field"
]
}
Gen redirect to detail — gen-redirect-to-detail.json
Demonstrates widget.redirectToDetail = false on tsm-entity-instance-create-dependent.
{
"type": "object",
"title": "New Dependent Instance Button — Redirect to detail",
"description": "Demonstrates widget.redirectToDetail = false on tsm-entity-instance-create-dependent.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-entity-instance-create-dependent",
"redirectToDetail": false
}
}
},
"layout": [
"field"
]
}
Ticket Category Registry Select tsm-ticket-category-registry-lov
Selection of a ticket category registry from a dropdown list.
Widget Or Layout: unknown
Value:
{
"title": "Select a Ticket Category Registry",
"widget": {
"type": "tsm-ticket-category-registry-lov"
},
"type": "string",
"config": {
"module": "ChangeManagement",
"selectProperty": "id"
}
}
Inputs
Disable link
Key: disableLink
Name: Disable link
Default: false
Allowed values
Key: allowedValues
Name: Allowed values
Default: null
Default value
Key: default
Name: Default value
Default: ""
Filters
Key: defaultFilters
Name: Filters
Default: null
Keyboard on mobile
Key: keyboardOnMobile
Name: Keyboard on mobile
Description: When enabled, a system keyboard is shown on mobile devices to filter the list during selection.
Default: true
Show clear
Key: showClear
Name: Show clear
Description: When enabled, a clear icon is shown next to the selector so the user can clear the selected value.
Default: true
Show none text
Key: showNoneText
Name: Show none text
Description: When enabled, a "No value" item appears in the dropdown and can be selected to clear the field.
Default: true
Select first value
Key: selectFirstValue
Name: Select first value
Description: When only one record is available, it will be auto-selected. When multiple records exist, nothing happens.
Default: false
Selection using a listing (one or more values)
Key: multiselect
Name: Selection using a listing (one or more values)
Default: false
Value
Key: selectProperty
Name: Value
Default: "all"
Display
Key: displayField
Name: Display
Description: It is possible to add multiple values using autocomplete or with source code ["key", "name"]
Default: "name"
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-ticket-category-registry-lov/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen allowed values — gen-allowed-values.json
Demonstrates widget.allowedValues = "exampleValue" on tsm-ticket-category-registry-lov.
{
"type": "object",
"title": "Ticket Category Registry Select — Allowed values",
"description": "Demonstrates widget.allowedValues = \"exampleValue\" on tsm-ticket-category-registry-lov.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-category-registry-lov",
"allowedValues": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen default filters — gen-default-filters.json
Demonstrates widget.defaultFilters = "exampleValue" on tsm-ticket-category-registry-lov.
{
"type": "object",
"title": "Ticket Category Registry Select — Filters",
"description": "Demonstrates widget.defaultFilters = \"exampleValue\" on tsm-ticket-category-registry-lov.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-category-registry-lov",
"defaultFilters": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen disable link — gen-disable-link.json
Demonstrates widget.disableLink = true on tsm-ticket-category-registry-lov.
{
"type": "object",
"title": "Ticket Category Registry Select — Disable link",
"description": "Demonstrates widget.disableLink = true on tsm-ticket-category-registry-lov.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-category-registry-lov",
"disableLink": true
}
}
},
"layout": [
"field"
]
}
Gen keyboard on mobile — gen-keyboard-on-mobile.json
Keyboard on mobile: When enabled, a system keyboard is shown on mobile devices to filter the list during selection.
{
"type": "object",
"title": "Ticket Category Registry Select — Keyboard on mobile",
"description": "Keyboard on mobile: When enabled, a system keyboard is shown on mobile devices to filter the list during selection.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-category-registry-lov",
"keyboardOnMobile": false
}
}
},
"layout": [
"field"
]
}
Gen show clear — gen-show-clear.json
Show clear: When enabled, a clear icon is shown next to the selector so the user can clear the selected value.
{
"type": "object",
"title": "Ticket Category Registry Select — Show clear",
"description": "Show clear: When enabled, a clear icon is shown next to the selector so the user can clear the selected value.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-category-registry-lov",
"showClear": false
}
}
},
"layout": [
"field"
]
}
Gen show none text — gen-show-none-text.json
Show none text: When enabled, a "No value" item appears in the dropdown and can be selected to clear the field.
{
"type": "object",
"title": "Ticket Category Registry Select — Show none text",
"description": "Show none text: When enabled, a \"No value\" item appears in the dropdown and can be selected to clear the field.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-category-registry-lov",
"showNoneText": false
}
}
},
"layout": [
"field"
]
}
Release Button tsm-ticket-release-button
Ticketing - Ticket Release Button
Widget Or Layout: unknown
Value:
{
"title": "Ticketing - Ticket Release Button",
"widget": {
"type": "tsm-ticket-release-button"
},
"type": "string",
"config": {
"module": "ChangeManagement",
"selectProperty": "id"
}
}
Inputs
Title
Key: label
Name: Title
Default: ""
Target
Key: target
Name: Target
Default: ""
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-ticket-release-button/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen label — gen-label.json
Demonstrates widget.label = "top" on tsm-ticket-release-button.
{
"type": "object",
"title": "Release Button — Title",
"description": "Demonstrates widget.label = \"top\" on tsm-ticket-release-button.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-release-button",
"label": "top"
}
}
},
"layout": [
"field"
]
}
Gen target — gen-target.json
Demonstrates widget.target = "exampleValue" on tsm-ticket-release-button.
{
"type": "object",
"title": "Release Button — Target",
"description": "Demonstrates widget.target = \"exampleValue\" on tsm-ticket-release-button.",
"properties": {
"field": {
"type": "string",
"title": "Field",
"widget": {
"type": "tsm-ticket-release-button",
"target": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Calendar event list tsm-calendar-event
Calendar event list
Widget Or Layout: unknown
Value:
{
"title": "Calendar event list",
"widget": {
"type": "tsm-calendar-event"
},
"type": "layout",
"config": {
"pageSize": 10
}
}
Inputs
Show selected
Key: showSelected
Name: Show selected
Default: null
User
Key: userId
Name: User
Default: null
Parent privilege
Key: parentPriv
Name: Parent privilege
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-calendar-event/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen parent priv — gen-parent-priv.json
Demonstrates widget.parentPriv = "exampleValue" on tsm-calendar-event.
{
"type": "object",
"title": "Calendar event list — Parent privilege",
"description": "Demonstrates widget.parentPriv = \"exampleValue\" on tsm-calendar-event.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-calendar-event",
"parentPriv": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen show selected — gen-show-selected.json
Demonstrates widget.showSelected = "exampleValue" on tsm-calendar-event.
{
"type": "object",
"title": "Calendar event list — Show selected",
"description": "Demonstrates widget.showSelected = \"exampleValue\" on tsm-calendar-event.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-calendar-event",
"showSelected": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen user id — gen-user-id.json
Demonstrates widget.userId = "exampleValue" on tsm-calendar-event.
{
"type": "object",
"title": "Calendar event list — User",
"description": "Demonstrates widget.userId = \"exampleValue\" on tsm-calendar-event.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-calendar-event",
"userId": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Customer - report tsm-customer-report-form
Customer - report
Widget Or Layout: unknown
Value:
{
"type": "object",
"title": "Customer - report",
"widget": {
"type": "tsm-customer-report-form"
}
}
Inputs
Customer
Key: customerId
Name: Customer
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-customer-report-form/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen customer id — gen-customer-id.json
Demonstrates widget.customerId = "exampleValue" on tsm-customer-report-form.
{
"type": "object",
"title": "Customer - report — Customer",
"description": "Demonstrates widget.customerId = \"exampleValue\" on tsm-customer-report-form.",
"properties": {
"field": {
"type": "object",
"title": "Field",
"widget": {
"type": "tsm-customer-report-form",
"customerId": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Dms - Participant (sharing-ref) tsm-sharing-ref-lov
Dms - Participant (sharing-ref)
Widget Or Layout: unknown
Value:
{
"type": "object",
"title": "Dms - Participant (sharing-ref)",
"widget": {
"type": "tsm-sharing-ref-lov"
},
"config": {
"validatorRequired": true
}
}
Inputs
Filters
Key: refTypeFilter
Name: Filters
Default: null
Value
Key: selectProperty
Name: Value
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-sharing-ref-lov/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen ref type filter — gen-ref-type-filter.json
Demonstrates widget.refTypeFilter = "exampleValue" on tsm-sharing-ref-lov.
{
"type": "object",
"title": "Dms - Participant (sharing-ref) — Filters",
"description": "Demonstrates widget.refTypeFilter = \"exampleValue\" on tsm-sharing-ref-lov.",
"properties": {
"field": {
"type": "object",
"title": "Field",
"widget": {
"type": "tsm-sharing-ref-lov",
"refTypeFilter": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen select property — gen-select-property.json
Demonstrates widget.selectProperty = "exampleValue" on tsm-sharing-ref-lov.
{
"type": "object",
"title": "Dms - Participant (sharing-ref) — Value",
"description": "Demonstrates widget.selectProperty = \"exampleValue\" on tsm-sharing-ref-lov.",
"properties": {
"field": {
"type": "object",
"title": "Field",
"widget": {
"type": "tsm-sharing-ref-lov",
"selectProperty": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Layout - Chart dtl-fluent-chart
The Charts component provides a set of customizable charting options that can be used to display data in a visually appealing way. It supports a variety of chart types, such as line, bar, pie, doughnut, radar, polar area, and scatter charts.
Widget Or Layout: unknown
Value:
{
"type": "layout",
"widget": {
"type": "dtl-fluent-chart"
},
"items": []
}
Inputs
Listing type
Key: listingTypeCode
Name: Listing type
Default: null
Chart type
Key: chartType
Name: Chart type
Default: null
Aggregations
Key: aggs
Name: Aggregations
Default: null
Datasets
Key: datasets
Name: Datasets
Default: null
Options
Key: options
Name: Options
Default: null
Label column
Key: labelColumn
Name: Label column
Default: null
Label converter
Key: labelConverter
Name: Label converter
Default: null
Label converter params
Key: labelConverterParams
Name: Label converter params
Default: null
Filters
Key: filters
Name: Filters
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/dtl-fluent-chart/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen aggs — gen-aggs.json
Demonstrates widget.aggs = "exampleValue" on dtl-fluent-chart.
{
"type": "object",
"title": "Layout - Chart — Aggregations",
"description": "Demonstrates widget.aggs = \"exampleValue\" on dtl-fluent-chart.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "dtl-fluent-chart",
"aggs": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen chart type — gen-chart-type.json
Demonstrates widget.chartType = "exampleValue" on dtl-fluent-chart.
{
"type": "object",
"title": "Layout - Chart — Chart type",
"description": "Demonstrates widget.chartType = \"exampleValue\" on dtl-fluent-chart.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "dtl-fluent-chart",
"chartType": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen datasets — gen-datasets.json
Demonstrates widget.datasets = "exampleValue" on dtl-fluent-chart.
{
"type": "object",
"title": "Layout - Chart — Datasets",
"description": "Demonstrates widget.datasets = \"exampleValue\" on dtl-fluent-chart.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "dtl-fluent-chart",
"datasets": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen label column — gen-label-column.json
Demonstrates widget.labelColumn = "top" on dtl-fluent-chart.
{
"type": "object",
"title": "Layout - Chart — Label column",
"description": "Demonstrates widget.labelColumn = \"top\" on dtl-fluent-chart.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "dtl-fluent-chart",
"labelColumn": "top"
}
}
},
"layout": [
"field"
]
}
Gen listing type code — gen-listing-type-code.json
Demonstrates widget.listingTypeCode = "exampleValue" on dtl-fluent-chart.
{
"type": "object",
"title": "Layout - Chart — Listing type",
"description": "Demonstrates widget.listingTypeCode = \"exampleValue\" on dtl-fluent-chart.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "dtl-fluent-chart",
"listingTypeCode": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen options — gen-options.json
Demonstrates widget.options = "exampleValue" on dtl-fluent-chart.
{
"type": "object",
"title": "Layout - Chart — Options",
"description": "Demonstrates widget.options = \"exampleValue\" on dtl-fluent-chart.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "dtl-fluent-chart",
"options": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Ordering - Order line hardware tsm-order-line-hardware
Ordering - Order line hardware
Widget Or Layout: unknown
Value:
{
"type": "layout",
"widget": {
"type": "tsm-order-line-hardware"
}
}
Inputs
Order
Key: orderId
Name: Order
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-order-line-hardware/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen order id — gen-order-id.json
Demonstrates widget.orderId = "exampleValue" on tsm-order-line-hardware.
{
"type": "object",
"title": "Ordering - Order line hardware — Order",
"description": "Demonstrates widget.orderId = \"exampleValue\" on tsm-order-line-hardware.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-order-line-hardware",
"orderId": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Phone dtl-form-input-phone
Phone
Widget Or Layout: unknown
Value:
{
"type": "string",
"title": "Phone",
"widget": {
"type": "phone"
}
}
Inputs
Default value
Key: default
Name: Default value
Default: ""
Scripting - Open detail type tsm-open-console-button
Scripting - Open detail type
Widget Or Layout: unknown
Value:
{
"type": "layout",
"widget": {
"type": "tsm-open-console-button"
}
}
Inputs
Context
Key: context
Name: Context
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-open-console-button/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen context — gen-context.json
Demonstrates widget.context = "exampleValue" on tsm-open-console-button.
{
"type": "object",
"title": "Scripting - Open detail type — Context",
"description": "Demonstrates widget.context = \"exampleValue\" on tsm-open-console-button.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-open-console-button",
"context": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Slacard tsm-sla-card
Slacard
Widget Or Layout: unknown
Value:
{
"type": "layout",
"title": "Slacard",
"widget": {
"type": "tsm-sla-card"
}
}
Inputs
Ticket
Key: ticket
Name: Ticket
Default: ""
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-sla-card/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen ticket — gen-ticket.json
Demonstrates widget.ticket = "exampleValue" on tsm-sla-card.
{
"type": "object",
"title": "Slacard — Ticket",
"description": "Demonstrates widget.ticket = \"exampleValue\" on tsm-sla-card.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-sla-card",
"ticket": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Spreadsheet tsm-sheet-widget
The Spreadsheet component provides a clean, table-based workflow for data: inline cell editing, validation, sorting, and bulk updates for fast data entry.
Widget Or Layout: unknown
Value:
{
"type": "layout",
"widget": {
"type": "tsm-sheet-widget"
}
}
Inputs
Default value
Key: default
Name: Default value
Default: {}
Data
Key: data
Name: Data
Description: This value replaces the initial/default data and represents the current state of the component.
Default: {}
Enable import in "readonly mode"
Key: enableImportOnReadonly
Name: Enable import in "readonly mode"
Default: false
Default rows count
Key: rows
Name: Default rows count
Default: 30
Default cols count
Key: cols
Name: Default cols count
Default: 30
Max height
Key: maxHeight
Name: Max height
Default: null
Výchozí název prvního sheetu
Key: defaultFirstSheetName
Name: Výchozí název prvního sheetu
Default: ""
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-sheet-widget/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen cols — gen-cols.json
Demonstrates widget.cols = 60 on tsm-sheet-widget.
{
"type": "object",
"title": "Spreadsheet — Default cols count",
"description": "Demonstrates widget.cols = 60 on tsm-sheet-widget.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-sheet-widget",
"cols": 60
}
}
},
"layout": [
"field"
]
}
Gen default first sheet name — gen-default-first-sheet-name.json
Demonstrates widget.defaultFirstSheetName = "exampleValue" on tsm-sheet-widget.
{
"type": "object",
"title": "Spreadsheet — Výchozí název prvního sheetu",
"description": "Demonstrates widget.defaultFirstSheetName = \"exampleValue\" on tsm-sheet-widget.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-sheet-widget",
"defaultFirstSheetName": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen enable import on readonly — gen-enable-import-on-readonly.json
Demonstrates widget.enableImportOnReadonly = true on tsm-sheet-widget.
{
"type": "object",
"title": "Spreadsheet — Enable import in \"readonly mode\"",
"description": "Demonstrates widget.enableImportOnReadonly = true on tsm-sheet-widget.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-sheet-widget",
"enableImportOnReadonly": true
}
}
},
"layout": [
"field"
]
}
Gen max height — gen-max-height.json
Demonstrates widget.maxHeight = "exampleValue" on tsm-sheet-widget.
{
"type": "object",
"title": "Spreadsheet — Max height",
"description": "Demonstrates widget.maxHeight = \"exampleValue\" on tsm-sheet-widget.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-sheet-widget",
"maxHeight": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen rows — gen-rows.json
Demonstrates widget.rows = 60 on tsm-sheet-widget.
{
"type": "object",
"title": "Spreadsheet — Default rows count",
"description": "Demonstrates widget.rows = 60 on tsm-sheet-widget.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-sheet-widget",
"rows": 60
}
}
},
"layout": [
"field"
]
}
Tasks tsm-process-instance-diagrams
Tasks
Widget Or Layout: unknown
Value:
{
"type": "string",
"title": "Tasks",
"widget": {
"type": "tsm-process-instance-diagrams"
}
}
tSM Characteristic tsm-characteristic
tSM Characteristic - used to insert a characteristic.
Widget Or Layout: unknown
Value:
{
"type": "layout",
"widget": {
"type": "tsm-characteristic"
},
"config": {
"context": "${$context}"
}
}
Inputs
Code
Key: code
Name: Code
Default: null
Show title
Key: enableLabel
Name: Show title
Default: false
Disable count is single child
Key: disableCountIsSingleChild
Name: Disable count is single child
Default: false
Disable show errors in characteristic
Key: characteristicShowDisableErrors
Name: Disable show errors in characteristic
Default: false
Context
Key: context
Name: Context
Description: Enter a value that will be dynamically inserted as context. Use the $value placeholder, which will automatically be replaced with the current value during runtime. This enables flexible data transfer between components or modules.
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-characteristic/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen characteristic show disable errors — gen-characteristic-show-disable-errors.json
Demonstrates widget.characteristicShowDisableErrors = true on tsm-characteristic.
{
"type": "object",
"title": "tSM Characteristic — Disable show errors in characteristic",
"description": "Demonstrates widget.characteristicShowDisableErrors = true on tsm-characteristic.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-characteristic",
"characteristicShowDisableErrors": true
}
}
},
"layout": [
"field"
]
}
Gen code — gen-code.json
Demonstrates widget.code = "exampleValue" on tsm-characteristic.
{
"type": "object",
"title": "tSM Characteristic — Code",
"description": "Demonstrates widget.code = \"exampleValue\" on tsm-characteristic.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-characteristic",
"code": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen context — gen-context.json
_Context: Enter a value that will be dynamically inserted as context. Use the $value placeholder, which will automatically be replaced with the current value during runtime. This enables flexible data transfer _
{
"type": "object",
"title": "tSM Characteristic — Context",
"description": "Context: Enter a value that will be dynamically inserted as context. Use the $value placeholder, which will automatically be replaced with the current value during runtime. This enables flexible data transfer ",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-characteristic",
"context": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen disable count is single child — gen-disable-count-is-single-child.json
Demonstrates widget.disableCountIsSingleChild = true on tsm-characteristic.
{
"type": "object",
"title": "tSM Characteristic — Disable count is single child",
"description": "Demonstrates widget.disableCountIsSingleChild = true on tsm-characteristic.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-characteristic",
"disableCountIsSingleChild": true
}
}
},
"layout": [
"field"
]
}
Gen enable label — gen-enable-label.json
Demonstrates widget.enableLabel = true on tsm-characteristic.
{
"type": "object",
"title": "tSM Characteristic — Show title",
"description": "Demonstrates widget.enableLabel = true on tsm-characteristic.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-characteristic",
"enableLabel": true
}
}
},
"layout": [
"field"
]
}
User management - User Group Selection tsm-user-group-list-widget
User management - User Group Selection
Widget Or Layout: unknown
Value:
{
"title": "User management - User Group Selection",
"widget": {
"type": "tsm-user-group-list-widget"
},
"type": "layout",
"config": {
"pageSize": 10
}
}
Inputs
Title
Key: title
Name: Title
Default: null
Page Size
Key: pageSize
Name: Page Size
Description: Number of rows displayed on one page.
Table Height
Key: scrollHeight
Name: Table Height
Description: The custom height is applied only when the Table / TreeTable is in scrollable mode, contains more than 6 records, and the total height of all rows on the page exceeds the custom height value.
If the custom height is larger than the total height of the rows on the page, the Table / TreeTable automatically reduces its height to avoid empty space.
In Full Screen mode, the custom height setting is ignored. The Table / TreeTable uses a flex configuration which automatically manages the final height.
The height can be specified in these units: px, em, rem, vh.
Sample: 500px
Table Data View Mode
Key: dataViewMode
Name: Table Data View Mode
Description: "Table with scroll" keeps original column widths and a horizontal scrollbar. "FullScreen table" adjusts column widths to the window size.
Additional Context Data
Key: externalData
Name: Additional Context Data
Description: Specifies additional contextual data in the form of a JSON object for creating a new record in this listing, which is passed to the form context.
Listing Type
Key: listingType
Name: Listing Type
Description: Specifies which listing type is used for display.
Listing Profile
Key: profileId
Name: Listing Profile
Description: Specifies the listing profile, which defines columns, order, and other display settings.
Listing Profile Category
Key: profileCategory
Name: Listing Profile Category
Description: Name of the category from which profiles can be selected.
Output Context Key
Key: outputContextKey
Name: Output Context Key
Description: Key under which this table's selection is exposed in the form context as $outputContext.<key> (e.g. ticket, order, task). Contains selectedEntity (the selected row) and selectedIds (IDs across all pages). Empty = legacy behavior (the selected row is written directly to $outputContext).
Expose selected entities (selectedEntities)
Key: exposeSelectedEntities
Name: Expose selected entities (selectedEntities)
Description: In addition to selectedIds, also expose selectedEntities — the full rows, but for the CURRENT page only. Off by default: heavier payload than an array of IDs. Use selectedIds to work with the cross-page selection.
Hide Export Button
Key: showExport
Name: Hide Export Button
Description: Hides the export button.
Hide Filter
Key: showFilters
Name: Hide Filter
Description: Hides the listing filters.
Hide Refresh Button
Key: showRefresh
Name: Hide Refresh Button
Description: Hides the refresh button.
Hide Paginator
Key: showPaginator
Name: Hide Paginator
Description: Hides the listing pagination.
Hide Columns Manager
Key: showManagerColumns
Name: Hide Columns Manager
Description: Hides the columns manager.
Hide Profiles
Key: showProfiles
Name: Hide Profiles
Description: Hides the listing profiles.
Hide Sort Manager
Key: showManagerSort
Name: Hide Sort Manager
Description: Hides the sort manager.
Hide Color Manager
Key: showManagerColor
Name: Hide Color Manager
Description: Hides the color manager.
Hide Listing Config
Key: showListingConfig
Name: Hide Listing Config
Description: Hides the listing configuration.
Hide Data View Mode
Key: hiddenDataViewMode
Name: Hide Data View Mode
Description: Hides the option to switch between table and kanban view.
Hide Button Section
Key: hideButtonGroup
Name: Hide Button Section
Description: Hides the button section.
Disable Sticky Header
Key: scrollable
Name: Disable Sticky Header
Description: Disables the fixed table header while scrolling.
TQL WHERE Extension
Key: extendTqlWhere
Name: TQL WHERE Extension
Description: Adds a WHERE condition in TQL. Format: COLUMN_NAME OPERATOR VALUE.
TQL Sorting
Key: externalTqlSort
Name: TQL Sorting
Description: Modifies the default sorting in TQL. Format: COLUMN_NAME ASC/DESC.
TQL Sorting for Nested Tables
Key: externalTqlSortForNested
Name: TQL Sorting for Nested Tables
Description: Modifies the default sorting for nested tables in TQL. Format: COLUMN_NAME ASC/DESC.
TQL Query Params
Key: tqlQueryParams
Name: TQL Query Params
Description: Adds query parameters to the TQL request.
Filters
Key: filters
Name: Filters
Description: Allows defining filters for the data displayed in the list.
Work estimate tsm-worklog-estimate
Work estimate
Widget Or Layout: unknown
Value:
{
"type": "layout",
"title": "Worklog",
"widget": {
"type": "tsm-worklog-estimate"
},
"config": {
"showIncludeSubtasks": false,
"linkType": "null",
"showAddButton": false
}
}
Inputs
Owner type
Key: ownerType
Name: Owner type
Default: null
Owner Id
Key: ownerId
Name: Owner Id
Default: null
Create privilege
Key: addPrivilege
Name: Create privilege
Default: null
Show "Include subtasks" checkbox
Key: showIncludeSubtasks
Name: Show "Include subtasks" checkbox
Default: true
Show add button
Key: showAddButton
Name: Show add button
Default: true
Link type
Key: linkTypes
Name: Link type
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-worklog-estimate/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen add privilege — gen-add-privilege.json
Demonstrates widget.addPrivilege = "exampleValue" on tsm-worklog-estimate.
{
"type": "object",
"title": "Work estimate — Create privilege",
"description": "Demonstrates widget.addPrivilege = \"exampleValue\" on tsm-worklog-estimate.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-estimate",
"addPrivilege": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen link types — gen-link-types.json
Demonstrates widget.linkTypes = "exampleValue" on tsm-worklog-estimate.
{
"type": "object",
"title": "Work estimate — Link type",
"description": "Demonstrates widget.linkTypes = \"exampleValue\" on tsm-worklog-estimate.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-estimate",
"linkTypes": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen owner id — gen-owner-id.json
Demonstrates widget.ownerId = "exampleValue" on tsm-worklog-estimate.
{
"type": "object",
"title": "Work estimate — Owner Id",
"description": "Demonstrates widget.ownerId = \"exampleValue\" on tsm-worklog-estimate.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-estimate",
"ownerId": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen owner type — gen-owner-type.json
Demonstrates widget.ownerType = "exampleValue" on tsm-worklog-estimate.
{
"type": "object",
"title": "Work estimate — Owner type",
"description": "Demonstrates widget.ownerType = \"exampleValue\" on tsm-worklog-estimate.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-estimate",
"ownerType": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen show add button — gen-show-add-button.json
Demonstrates widget.showAddButton = false on tsm-worklog-estimate.
{
"type": "object",
"title": "Work estimate — Show add button",
"description": "Demonstrates widget.showAddButton = false on tsm-worklog-estimate.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-estimate",
"showAddButton": false
}
}
},
"layout": [
"field"
]
}
Gen show include subtasks — gen-show-include-subtasks.json
Demonstrates widget.showIncludeSubtasks = false on tsm-worklog-estimate.
{
"type": "object",
"title": "Work estimate — Show \"Include subtasks\" checkbox",
"description": "Demonstrates widget.showIncludeSubtasks = false on tsm-worklog-estimate.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-estimate",
"showIncludeSubtasks": false
}
}
},
"layout": [
"field"
]
}
Worklog duration input tsm-worklog-duration
Widget Or Layout: unknown
Value:
{
"type": "layout",
"title": "Worklog duration",
"widget": {
"type": "tsm-worklog-duration"
}
}
Worklog stopwatch start button tsm-worklog-stopwatch-start-button
Worklog stopwatch start button
Widget Or Layout: unknown
Value:
{
"title": "Worklog stopwatch start button",
"widget": {
"type": "tsm-worklog-stopwatch-start-button"
},
"type": "layout",
"config": {
"ownerId": "",
"ownerType": ""
}
}
Inputs
Owner type
Key: ownerType
Name: Owner type
Default: null
Owner Id
Key: ownerId
Name: Owner Id
Default: null
Examples
Curated configurations from libs/framework/fluent-forms/__fixtures__/widgets/tsm-worklog-stopwatch-start-button/.
Each is a complete validated FluentSchema — copy & adapt for your form.
Gen owner id — gen-owner-id.json
Demonstrates widget.ownerId = "exampleValue" on tsm-worklog-stopwatch-start-button.
{
"type": "object",
"title": "Worklog stopwatch start button — Owner Id",
"description": "Demonstrates widget.ownerId = \"exampleValue\" on tsm-worklog-stopwatch-start-button.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-stopwatch-start-button",
"ownerId": "exampleValue"
}
}
},
"layout": [
"field"
]
}
Gen owner type — gen-owner-type.json
Demonstrates widget.ownerType = "exampleValue" on tsm-worklog-stopwatch-start-button.
{
"type": "object",
"title": "Worklog stopwatch start button — Owner type",
"description": "Demonstrates widget.ownerType = \"exampleValue\" on tsm-worklog-stopwatch-start-button.",
"properties": {
"field": {
"type": "layout",
"title": "Field",
"widget": {
"type": "tsm-worklog-stopwatch-start-button",
"ownerType": "exampleValue"
}
}
},
"layout": [
"field"
]
}