Widget Code Structure

widgets are implemented as anonymous classes that extend the htmlelement class the preferred approach is to extend swimlaneelement, which itself extends litelement and provides additional functionality for building rich, interactive record and report widgets in turbine default widget example here is an example of the default widget with annotation added properties swimlaneelement defines the following properties this record – available to record widgets an object containing key value pairs for each field on the record this report – available to report widgets an object with data parsed result rows rawdata unprocessed backend response query the report query this contextdata – available to all widgets contains contextual information application currentuser origin token documentation on how litelement handles properties and attributes can be found here https //lit element polymer project org/guide/properties lifecycle in addition to standard htmlelement and litelement lifecycle methods, swimlaneelement includes resizedcallback() – called when the widget is resized by default, it calls requestupdate() to trigger re rendering documentation of litelement lifecycle methods and properties can be found here https //lit element polymer project org/guide/lifecycle events swimlane widgets can emit platform events using the following methods this updaterecordvalue(key, value) updates a specific record field by key this addcomment(comment) adds a comment to the record this method returns a promise, allowing follow up actions to be chained this triggerbutton(); }) catch(error => { console error("failed to add comment ", error); }); this triggerbutton(buttonid) triggers a playbook button by its id this triggersave() saves the current record this method also returns a promise, enabling safe sequencing of actions this triggersave() then(() => { this triggerbutton(); }) catch(error => { console error("save failed ", error); }); avoid using settimeout() to delay follow up actions use promises to ensure actions happen after the save or comment completes successfully you can also perform multiple asynchronous actions in parallel using promise all() documentation on how to handle events in litelement can be found here https //lit element polymer project org/guide/events value emission patterns for single value fields (text/numeric/date fields, etc ) or single select field types, simply emit the new value for text and numeric list field types, emit an array of new values if duplicate values exist, their ids get reused for multi select field types (selects, radio buttons, checkboxes), emit an array of new values every element in the value must exist in the contextdata to add a comment, emit the new comment as a string