247 lines
6.8 KiB
Plaintext
247 lines
6.8 KiB
Plaintext
{
|
|
"custom": {},
|
|
"params": {
|
|
"color": "var(--callToAction)",
|
|
"index": "",
|
|
"label": "",
|
|
"mode": "custom",
|
|
"selected": false,
|
|
"source": ""
|
|
},
|
|
"propConfig": {
|
|
"params.color": {
|
|
"paramDirection": "input",
|
|
"persistent": true
|
|
},
|
|
"params.index": {
|
|
"paramDirection": "input",
|
|
"persistent": true
|
|
},
|
|
"params.label": {
|
|
"paramDirection": "input",
|
|
"persistent": true
|
|
},
|
|
"params.mode": {
|
|
"paramDirection": "input",
|
|
"persistent": true
|
|
},
|
|
"params.selected": {
|
|
"paramDirection": "input",
|
|
"persistent": true
|
|
},
|
|
"params.source": {
|
|
"paramDirection": "input",
|
|
"persistent": true
|
|
}
|
|
},
|
|
"props": {
|
|
"defaultSize": {
|
|
"height": 35,
|
|
"width": 249
|
|
}
|
|
},
|
|
"root": {
|
|
"children": [
|
|
{
|
|
"meta": {
|
|
"name": "Color"
|
|
},
|
|
"position": {
|
|
"basis": "4px",
|
|
"shrink": 0
|
|
},
|
|
"propConfig": {
|
|
"props.style.backgroundColor": {
|
|
"binding": {
|
|
"config": {
|
|
"expression": "{view.params.color}"
|
|
},
|
|
"type": "expr"
|
|
}
|
|
}
|
|
},
|
|
"props": {
|
|
"style": {
|
|
"borderBottomLeftRadius": "var(--borderRadius)",
|
|
"borderTopLeftRadius": "var(--borderRadius)"
|
|
}
|
|
},
|
|
"type": "ia.display.label"
|
|
},
|
|
{
|
|
"meta": {
|
|
"name": "Label"
|
|
},
|
|
"position": {
|
|
"shrink": 0
|
|
},
|
|
"propConfig": {
|
|
"position.display": {
|
|
"binding": {
|
|
"config": {
|
|
"expression": "{view.params.label} !\u003d \u0027\u0027"
|
|
},
|
|
"type": "expr"
|
|
}
|
|
},
|
|
"props.text": {
|
|
"binding": {
|
|
"config": {
|
|
"path": "view.params.label"
|
|
},
|
|
"type": "property"
|
|
}
|
|
}
|
|
},
|
|
"props": {
|
|
"style": {
|
|
"padding": "2px 0"
|
|
}
|
|
},
|
|
"type": "ia.display.label"
|
|
},
|
|
{
|
|
"events": {
|
|
"dom": {
|
|
"onBlur": {
|
|
"config": {
|
|
"script": "\tself.applyCustomFilter()\n\t"
|
|
},
|
|
"scope": "G",
|
|
"type": "script"
|
|
},
|
|
"onKeyPress": {
|
|
"config": {
|
|
"script": "\tif event.key \u003d\u003d \u0027Enter\u0027:\n\t\tself.applyCustomFilter()"
|
|
},
|
|
"scope": "G",
|
|
"type": "script"
|
|
}
|
|
}
|
|
},
|
|
"meta": {
|
|
"name": "TextField"
|
|
},
|
|
"propConfig": {
|
|
"position.basis": {
|
|
"binding": {
|
|
"config": {
|
|
"expression": "\u00270px\u0027"
|
|
},
|
|
"type": "expr"
|
|
}
|
|
},
|
|
"props.style.width": {
|
|
"binding": {
|
|
"config": {
|
|
"path": "this.position.basis"
|
|
},
|
|
"type": "property"
|
|
}
|
|
},
|
|
"props.text": {
|
|
"binding": {
|
|
"config": {
|
|
"path": "view.params.label"
|
|
},
|
|
"type": "property"
|
|
}
|
|
}
|
|
},
|
|
"props": {
|
|
"deferUpdates": false,
|
|
"rejectUpdatesWhileFocused": false,
|
|
"style": {
|
|
"background": "transparent",
|
|
"border": "none",
|
|
"fontSize": "inherit",
|
|
"outline": "none",
|
|
"padding": 0
|
|
}
|
|
},
|
|
"scripts": {
|
|
"customMethods": [
|
|
{
|
|
"name": "applyCustomFilter",
|
|
"params": [],
|
|
"script": "\tpayload \u003d {\n\t\u0027source\u0027: self.view.params.source, \n\t\u0027label\u0027: self.props.text,\n\t\u0027index\u0027: self.view.params.index\n\t}\n\tif payload[\u0027label\u0027] !\u003d \u0027\u0027:\n\t\tsystem.perspective.sendMessage(\u0027customFilter\u0027, payload\u003dpayload)\n\tself.refreshBinding(\u0027position.basis\u0027)"
|
|
}
|
|
],
|
|
"extensionFunctions": null,
|
|
"messageHandlers": []
|
|
},
|
|
"type": "ia.input.text-field"
|
|
},
|
|
{
|
|
"meta": {
|
|
"name": "Close"
|
|
},
|
|
"position": {
|
|
"basis": "18px",
|
|
"shrink": 0
|
|
},
|
|
"propConfig": {
|
|
"props.color": {
|
|
"binding": {
|
|
"config": {
|
|
"expression": "if({view.params.selected},\r\n\u0027color-mix(in srgb, var(--callToAction) 40%, var(--contextBackground) 60%)\u0027,\r\n\u0027color-mix(in srgb, var(--callToAction) 60%, var(--contextBackground) 40%)\u0027)"
|
|
},
|
|
"type": "expr"
|
|
}
|
|
},
|
|
"props.path": {
|
|
"binding": {
|
|
"config": {
|
|
"expression": "if({view.params.selected}, \r\n\u0027material/close\u0027,\r\nif({view.params.label}\u003d\u0027\u0027,\u0027material/search\u0027,\u0027material/add\u0027))"
|
|
},
|
|
"type": "expr"
|
|
}
|
|
}
|
|
},
|
|
"props": {
|
|
"style": {
|
|
"cursor": "pointer",
|
|
"marginRight": "5px",
|
|
"width": "24px"
|
|
}
|
|
},
|
|
"type": "ia.display.icon"
|
|
}
|
|
],
|
|
"events": {
|
|
"dom": {
|
|
"onClick": {
|
|
"config": {
|
|
"script": "\tpayload \u003d {\n\t\u0027source\u0027: self.view.params.source, \n\t\u0027label\u0027: self.view.params.label,\n\t\u0027index\u0027: self.view.params.index\n\t}\n\tsystem.perspective.print(payload)\n\tselected \u003d self.view.params.selected\n\tif payload[\u0027label\u0027] \u003d\u003d \u0027\u0027:\n\t\tself.getChild(\"TextField\").position.basis \u003d \u0027auto\u0027\n\t\tself.getChild(\"TextField\").focus()\n\telse:\n\t\tif selected:\n\t\t\tsystem.perspective.sendMessage(\u0027removeFilter\u0027, payload\u003dpayload)\n\t\telse:\n\t\t\tsystem.perspective.sendMessage(\u0027addFilter\u0027, payload\u003dpayload)"
|
|
},
|
|
"scope": "G",
|
|
"type": "script"
|
|
}
|
|
}
|
|
},
|
|
"meta": {
|
|
"name": "root"
|
|
},
|
|
"propConfig": {
|
|
"props.style.classes": {
|
|
"binding": {
|
|
"config": {
|
|
"expression": "if({view.params.selected},\r\n\u0027buttons/hover-effect-selected\u0027,\r\n\u0027buttons/hover-effect-unselected\u0027)"
|
|
},
|
|
"type": "expr"
|
|
}
|
|
}
|
|
},
|
|
"props": {
|
|
"style": {
|
|
"border": "1px solid var(--border)",
|
|
"borderRadius": "var(--borderRadius)",
|
|
"cursor": "pointer",
|
|
"fontSize": "0.8em",
|
|
"gap": "5px",
|
|
"overflow": "hidden"
|
|
}
|
|
},
|
|
"type": "ia.container.flex"
|
|
}
|
|
} |