MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Background image component can have children (#9981)

This commit is contained in:
melohagan 2023-03-13 11:44:15 +00:00 committed by GitHub
parent ca33fe7439
commit 956d8f1ae3
2 changed files with 73 additions and 265 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

334
packages/client/manifest.json
View File

@ -17,10 +17,7 @@
"description": "This component is specific only to layouts",
"icon": "Sandbox",
"hasChildren": true,
"styles": [
"padding",
"background"
],
"styles": ["padding", "background"],
"settings": [
{
"type": "text",
@ -36,23 +33,14 @@
"type": "select",
"label": "Navigation",
"key": "navigation",
"options": [
"Top",
"Left",
"None"
],
"options": ["Top", "Left", "None"],
"defaultValue": "Top"
},
{
"type": "select",
"label": "Width",
"key": "width",
"options": [
"Small",
"Medium",
"Large",
"Max"
],
"options": ["Small", "Medium", "Large", "Max"],
"defaultValue": "Large"
},
{
@ -89,13 +77,7 @@
"width": 400,
"height": 200
},
"styles": [
"padding",
"size",
"background",
"border",
"shadow"
],
"styles": ["padding", "size", "background", "border", "shadow"],
"settings": [
{
"type": "select",
@ -255,9 +237,7 @@
"description": "Add a section to your application",
"icon": "ColumnTwoB",
"hasChildren": true,
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"showEmptyState": false,
"size": {
"width": 400,
@ -376,9 +356,7 @@
"name": "Divider",
"description": "A basic divider",
"icon": "Separator",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"size": {
"width": 400,
"height": 10
@ -415,9 +393,7 @@
"name": "Repeater",
"description": "A configurable data list that attaches to your backend tables.",
"icon": "JourneyData",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"hasChildren": true,
"size": {
"width": 400,
@ -574,9 +550,7 @@
"name": "Stacked List",
"icon": "TaskList",
"description": "A basic card component that can contain content and actions.",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"settings": [
{
"type": "text",
@ -606,9 +580,7 @@
"name": "Vertical Card",
"description": "A basic card component that can contain content and actions.",
"icon": "ViewColumn",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"settings": [
{
"type": "text",
@ -652,24 +624,14 @@
"type": "select",
"label": "Image Height",
"key": "imageHeight",
"options": [
"auto",
"12rem",
"16rem",
"20rem",
"24rem"
],
"options": ["auto", "12rem", "16rem", "20rem", "24rem"],
"defaultValue": "auto"
},
{
"type": "select",
"label": "Card Width",
"key": "cardWidth",
"options": [
"16rem",
"20rem",
"24rem"
],
"options": ["16rem", "20rem", "24rem"],
"defaultValue": "20rem"
}
]
@ -678,9 +640,7 @@
"name": "Paragraph",
"description": "A component for displaying paragraph text.",
"icon": "TextParagraph",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"editable": true,
"size": {
"width": 400,
@ -803,9 +763,7 @@
"name": "Headline",
"icon": "TextBold",
"description": "A component for displaying heading text",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"editable": true,
"size": {
"width": 400,
@ -982,9 +940,7 @@
"name": "Image",
"description": "A basic component for displaying images",
"icon": "Image",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 400,
"height": 300
@ -1002,9 +958,8 @@
"name": "Background Image",
"description": "A background image",
"icon": "Images",
"styles": [
"size"
],
"hasChildren": true,
"styles": ["size"],
"size": {
"width": 400,
"height": 300
@ -1162,9 +1117,7 @@
"name": "Nav Bar",
"description": "A component for handling the navigation within your app.",
"icon": "BreadcrumbNavigation",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"hasChildren": true,
"settings": [
{
@ -1365,25 +1318,14 @@
"type": "select",
"label": "Image Width",
"key": "imageWidth",
"options": [
"auto",
"8rem",
"12rem",
"16rem"
],
"options": ["auto", "8rem", "12rem", "16rem"],
"defaultValue": "8rem"
},
{
"type": "select",
"label": "Image Height",
"key": "imageHeight",
"options": [
"auto",
"8rem",
"12rem",
"16rem",
"auto"
],
"options": ["auto", "8rem", "12rem", "16rem", "auto"],
"defaultValue": "auto"
}
]
@ -1424,9 +1366,7 @@
"name": "Embed",
"icon": "Code",
"description": "Embed content from 3rd party sources",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 400,
"height": 100
@ -1478,11 +1418,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -1640,11 +1576,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -1736,11 +1668,7 @@
"type": "select",
"label": "Curve",
"key": "curve",
"options": [
"Smooth",
"Straight",
"Stepline"
],
"options": ["Smooth", "Straight", "Stepline"],
"defaultValue": "Smooth"
},
{
@ -1801,11 +1729,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -1897,11 +1821,7 @@
"type": "select",
"label": "Curve",
"key": "curve",
"options": [
"Smooth",
"Straight",
"Stepline"
],
"options": ["Smooth", "Straight", "Stepline"],
"defaultValue": "Smooth"
},
{
@ -2253,11 +2173,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -2293,19 +2209,14 @@
"name": "Form",
"icon": "Form",
"hasChildren": true,
"illegalChildren": [
"section",
"form"
],
"illegalChildren": ["section", "form"],
"actions": [
"ValidateForm",
"ClearForm",
"ChangeFormStep",
"UpdateFieldValue"
],
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 400,
"height": 400
@ -2315,10 +2226,7 @@
"type": "select",
"label": "Type",
"key": "actionType",
"options": [
"Create",
"Update"
],
"options": ["Create", "Update"],
"defaultValue": "Create"
},
{
@ -2388,14 +2296,8 @@
"name": "Form Step",
"icon": "AssetsAdded",
"hasChildren": true,
"illegalChildren": [
"section",
"form",
"form step"
],
"styles": [
"size"
],
"illegalChildren": ["section", "form", "form step"],
"styles": ["size"],
"size": {
"width": 400,
"height": 400
@ -2413,12 +2315,8 @@
"fieldgroup": {
"name": "Field Group",
"icon": "Group",
"illegalChildren": [
"section"
],
"styles": [
"size"
],
"illegalChildren": ["section"],
"styles": ["size"],
"hasChildren": true,
"size": {
"width": 400,
@ -2451,9 +2349,7 @@
"skeleton": false,
"name": "Text Field",
"icon": "Text",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -2543,9 +2439,7 @@
"skeleton": false,
"name": "Number Field",
"icon": "123",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -2601,9 +2495,7 @@
"skeleton": false,
"name": "Password Field",
"icon": "LockClosed",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -2659,9 +2551,7 @@
"skeleton": false,
"name": "Options Picker",
"icon": "Menu",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -2828,9 +2718,7 @@
"skeleton": false,
"name": "Multi-select Picker",
"icon": "ViewList",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3070,9 +2958,7 @@
"skeleton": false,
"name": "Long Form Field",
"icon": "TextAlignLeft",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3150,9 +3036,7 @@
"skeleton": false,
"name": "Date Picker",
"icon": "Date",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3232,9 +3116,7 @@
"skeleton": false,
"name": "Barcode/QR Scanner",
"icon": "Camera",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 400,
"height": 50
@ -3283,9 +3165,7 @@
"embeddedmap": {
"name": "Embedded Map",
"icon": "Location",
"styles": [
"size"
],
"styles": ["size"],
"draggable": false,
"size": {
"width": 400,
@ -3398,9 +3278,7 @@
"skeleton": false,
"name": "Attachment",
"icon": "Attach",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3463,9 +3341,7 @@
"skeleton": false,
"name": "Relationship Picker",
"icon": "TaskList",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3527,9 +3403,7 @@
"skeleton": false,
"name": "JSON Field",
"icon": "Brackets",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3579,9 +3453,7 @@
"s3upload": {
"name": "S3 File Upload",
"icon": "UploadToCloud",
"styles": [
"size"
],
"styles": ["size"],
"editable": true,
"size": {
"width": 400,
@ -3642,13 +3514,9 @@
"dataprovider": {
"name": "Data Provider",
"icon": "Data",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"hasChildren": true,
"actions": [
"RefreshDatasource"
],
"actions": ["RefreshDatasource"],
"size": {
"width": 400,
"height": 100
@ -3674,10 +3542,7 @@
"type": "select",
"label": "Sort Order",
"key": "sortOrder",
"options": [
"Ascending",
"Descending"
],
"options": ["Ascending", "Descending"],
"defaultValue": "Ascending"
},
{
@ -3729,9 +3594,7 @@
"skeleton": false,
"name": "Table",
"icon": "Table",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"hasChildren": true,
"showEmptyState": false,
"size": {
@ -3815,9 +3678,7 @@
"daterangepicker": {
"name": "Date Range",
"icon": "Calendar",
"styles": [
"size"
],
"styles": ["size"],
"hasChildren": false,
"size": {
"width": 200,
@ -3856,9 +3717,7 @@
"spectrumcard": {
"name": "Card",
"icon": "PersonalizationField",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 300,
"height": 120
@ -4031,10 +3890,7 @@
"type": "select",
"label": "Sort Order",
"key": "sortOrder",
"options": [
"Ascending",
"Descending"
],
"options": ["Ascending", "Descending"],
"defaultValue": "Ascending"
},
{
@ -4213,11 +4069,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -4271,11 +4123,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -4292,11 +4140,7 @@
"type": "select",
"label": "Curve",
"key": "curve",
"options": [
"Smooth",
"Straight",
"Stepline"
],
"options": ["Smooth", "Straight", "Stepline"],
"defaultValue": "Smooth"
}
]
@ -4328,11 +4172,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -4349,11 +4189,7 @@
"type": "select",
"label": "Curve",
"key": "curve",
"options": [
"Smooth",
"Straight",
"Stepline"
],
"options": ["Smooth", "Straight", "Stepline"],
"defaultValue": "Smooth"
},
{
@ -4418,11 +4254,7 @@
"type": "select",
"label": "Format",
"key": "yAxisUnits",
"options": [
"Default",
"Thousands",
"Millions"
],
"options": ["Default", "Thousands", "Millions"],
"defaultValue": "Default"
},
{
@ -4443,9 +4275,7 @@
"block": true,
"name": "Table block",
"icon": "Table",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 600,
"height": 400
@ -4483,10 +4313,7 @@
"type": "select",
"label": "Sort Order",
"key": "sortOrder",
"options": [
"Ascending",
"Descending"
],
"options": ["Ascending", "Descending"],
"defaultValue": "Ascending"
},
{
@ -4638,9 +4465,7 @@
"block": true,
"name": "Cards block",
"icon": "PersonalizationField",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 600,
"height": 400
@ -4679,10 +4504,7 @@
"type": "select",
"label": "Sort Order",
"key": "sortOrder",
"options": [
"Ascending",
"Descending"
],
"options": ["Ascending", "Descending"],
"defaultValue": "Descending"
},
{
@ -4816,9 +4638,7 @@
"block": true,
"name": "Repeater block",
"icon": "ViewList",
"illegalChildren": [
"section"
],
"illegalChildren": ["section"],
"hasChildren": true,
"size": {
"width": 400,
@ -4846,10 +4666,7 @@
"type": "select",
"label": "Sort Order",
"key": "sortOrder",
"options": [
"Ascending",
"Descending"
],
"options": ["Ascending", "Descending"],
"defaultValue": "Descending"
},
{
@ -5044,9 +4861,7 @@
"markdownviewer": {
"name": "Markdown Viewer",
"icon": "Preview",
"styles": [
"size"
],
"styles": ["size"],
"size": {
"width": 400,
"height": 100
@ -5063,9 +4878,7 @@
"formblock": {
"name": "Form Block",
"icon": "Form",
"styles": [
"size"
],
"styles": ["size"],
"block": true,
"info": "Form blocks are only compatible with internal or SQL tables",
"size": {
@ -5077,11 +4890,7 @@
"type": "select",
"label": "Type",
"key": "actionType",
"options": [
"Create",
"Update",
"View"
],
"options": ["Create", "Update", "View"],
"defaultValue": "Create"
},
{
@ -5215,10 +5024,7 @@
"name": "Side Panel",
"icon": "RailRight",
"hasChildren": true,
"illegalChildren": [
"section",
"sidepanel"
],
"illegalChildren": ["section", "sidepanel"],
"showEmptyState": false,
"draggable": false,
"info": "Side panels are hidden by default. They will only be revealed when triggered by the 'Open Side Panel' action."
@ -5307,4 +5113,4 @@
"suffix": "repeater"
}
}
}
}

4
packages/client/src/components/app/BackgroundImage.svelte
View File

@ -21,7 +21,9 @@
{#if url}
<div class="outer" use:styleable={$component.styles}>
<div class="inner" {style} />
<div class="inner" {style}>
<slot />
</div>
</div>
{:else if $builderStore.inBuilder}
<div