Merge pull request #7414 from Budibase/feature/binding-ux-update
Feature/binding ux update
This commit is contained in:
commit
1403c66021
|
@ -1,4 +1,4 @@
|
|||
export default function positionDropdown(element, { anchor, align }) {
|
||||
export default function positionDropdown(element, { anchor, align, maxWidth }) {
|
||||
let positionSide = "top"
|
||||
let maxHeight = 0
|
||||
let dimensions = getDimensions(anchor)
|
||||
|
@ -34,13 +34,24 @@ export default function positionDropdown(element, { anchor, align }) {
|
|||
}
|
||||
|
||||
function calcLeftPosition() {
|
||||
return align === "right"
|
||||
? dimensions.left + dimensions.width - dimensions.containerWidth
|
||||
: dimensions.left
|
||||
let left
|
||||
|
||||
if (align == "right") {
|
||||
left = dimensions.left + dimensions.width - dimensions.containerWidth
|
||||
} else if (align == "right-side") {
|
||||
left = dimensions.left + dimensions.width
|
||||
} else {
|
||||
left = dimensions.left
|
||||
}
|
||||
|
||||
return left
|
||||
}
|
||||
|
||||
element.style.position = "absolute"
|
||||
element.style.zIndex = "9999"
|
||||
if (maxWidth) {
|
||||
element.style.maxWidth = `${maxWidth}px`
|
||||
}
|
||||
element.style.minWidth = `${dimensions.width}px`
|
||||
element.style.maxHeight = `${maxHeight.toFixed(0)}px`
|
||||
element.style.transformOrigin = `center ${positionSide}`
|
||||
|
@ -54,10 +65,8 @@ export default function positionDropdown(element, { anchor, align }) {
|
|||
element.style.left = `${calcLeftPosition(dimensions).toFixed(0)}px`
|
||||
})
|
||||
})
|
||||
|
||||
resizeObserver.observe(anchor)
|
||||
resizeObserver.observe(element)
|
||||
|
||||
return {
|
||||
destroy() {
|
||||
resizeObserver.disconnect()
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
export let align = "right"
|
||||
export let portalTarget
|
||||
export let dataCy
|
||||
export let maxWidth
|
||||
|
||||
export let direction = "bottom"
|
||||
export let showTip = false
|
||||
|
@ -45,7 +46,7 @@
|
|||
<Portal target={portalTarget}>
|
||||
<div
|
||||
tabindex="0"
|
||||
use:positionDropdown={{ anchor, align }}
|
||||
use:positionDropdown={{ anchor, align, maxWidth }}
|
||||
use:clickOutside={hide}
|
||||
on:keydown={handleEscape}
|
||||
class={"spectrum-Popover is-open " + (tooltipClasses || "")}
|
||||
|
|
|
@ -10,7 +10,7 @@ filterTests(['smoke', 'all'], () => {
|
|||
|
||||
it("should add a current user binding", () => {
|
||||
cy.searchAndAddComponent("Paragraph").then(() => {
|
||||
addSettingBinding("text", "Current User._id")
|
||||
addSettingBinding("text", ["Current User", "_id"], "Current User._id")
|
||||
})
|
||||
})
|
||||
|
||||
|
@ -28,7 +28,7 @@ filterTests(['smoke', 'all'], () => {
|
|||
const paramName = "foo"
|
||||
cy.createScreen(`/test/:${paramName}`)
|
||||
cy.searchAndAddComponent("Paragraph").then(componentId => {
|
||||
addSettingBinding("text", `URL.${paramName}`)
|
||||
addSettingBinding("text", ["URL", paramName], `URL.${paramName}`)
|
||||
// The builder preview pages don't have a real URL, so all we can do
|
||||
// is check that we were able to bind to the property, and that the
|
||||
// component exists on the page
|
||||
|
@ -47,11 +47,13 @@ filterTests(['smoke', 'all'], () => {
|
|||
})
|
||||
})
|
||||
|
||||
const addSettingBinding = (setting, bindingText, clickOption = true) => {
|
||||
const addSettingBinding = (setting, bindingCategories, bindingText, clickOption = true) => {
|
||||
cy.get(`[data-cy="setting-${setting}"] [data-cy=text-binding-button]`).click()
|
||||
cy.get(".category-list li").contains(bindingCategories[0])
|
||||
cy.get(".drawer").within(() => {
|
||||
if (clickOption) {
|
||||
cy.contains(bindingText).click()
|
||||
cy.get(".category-list li").contains(bindingCategories[0]).click()
|
||||
cy.get("li.binding").contains(bindingCategories[1]).click()
|
||||
cy.get("textarea").should("have.value", `{{ ${bindingText} }}`)
|
||||
} else {
|
||||
cy.get("textarea").type(bindingText)
|
||||
|
|
|
@ -299,7 +299,10 @@ const getProviderContextBindings = (asset, dataProviders) => {
|
|||
schema = {}
|
||||
const values = context.values || []
|
||||
values.forEach(value => {
|
||||
schema[value.key] = { name: value.label, type: "string" }
|
||||
schema[value.key] = {
|
||||
name: value.label,
|
||||
type: value.type || "string",
|
||||
}
|
||||
})
|
||||
} else if (context.type === "schema") {
|
||||
// Schema contexts are generated dynamically depending on their data
|
||||
|
@ -359,6 +362,12 @@ const getProviderContextBindings = (asset, dataProviders) => {
|
|||
providerId,
|
||||
// Table ID is used by JSON fields to know what table the field is in
|
||||
tableId: table?._id,
|
||||
category: component._instanceName,
|
||||
icon: def.icon,
|
||||
display: {
|
||||
name: fieldSchema.name || key,
|
||||
type: fieldSchema.type,
|
||||
},
|
||||
})
|
||||
})
|
||||
})
|
||||
|
@ -385,6 +394,9 @@ const getUserBindings = () => {
|
|||
// datasource options, based on bindable properties
|
||||
fieldSchema,
|
||||
providerId: "user",
|
||||
category: "Current User",
|
||||
icon: "User",
|
||||
display: fieldSchema,
|
||||
})
|
||||
})
|
||||
return bindings
|
||||
|
@ -401,11 +413,17 @@ const getDeviceBindings = () => {
|
|||
type: "context",
|
||||
runtimeBinding: `${safeDevice}.${makePropSafe("mobile")}`,
|
||||
readableBinding: `Device.Mobile`,
|
||||
category: "Device",
|
||||
icon: "DevicePhone",
|
||||
display: { type: "boolean", name: "mobile" },
|
||||
})
|
||||
bindings.push({
|
||||
type: "context",
|
||||
runtimeBinding: `${safeDevice}.${makePropSafe("tablet")}`,
|
||||
readableBinding: `Device.Tablet`,
|
||||
category: "Device",
|
||||
icon: "DevicePhone",
|
||||
display: { type: "boolean", name: "tablet" },
|
||||
})
|
||||
}
|
||||
return bindings
|
||||
|
@ -429,6 +447,8 @@ const getSelectedRowsBindings = asset => {
|
|||
"selectedRows"
|
||||
)}`,
|
||||
readableBinding: `${table._instanceName}.Selected rows`,
|
||||
category: "Selected rows",
|
||||
icon: "ViewRow",
|
||||
}))
|
||||
)
|
||||
|
||||
|
@ -460,6 +480,9 @@ const getStateBindings = () => {
|
|||
type: "context",
|
||||
runtimeBinding: `${safeState}.${makePropSafe(key)}`,
|
||||
readableBinding: `State.${key}`,
|
||||
category: "State",
|
||||
icon: "AutomatedSegment",
|
||||
display: { name: key },
|
||||
}))
|
||||
}
|
||||
return bindings
|
||||
|
@ -482,11 +505,17 @@ const getUrlBindings = asset => {
|
|||
type: "context",
|
||||
runtimeBinding: `${safeURL}.${makePropSafe(param)}`,
|
||||
readableBinding: `URL.${param}`,
|
||||
category: "URL",
|
||||
icon: "RailTop",
|
||||
display: { type: "string" },
|
||||
}))
|
||||
const queryParamsBinding = {
|
||||
type: "context",
|
||||
runtimeBinding: makePropSafe("query"),
|
||||
readableBinding: "Query params",
|
||||
category: "URL",
|
||||
icon: "RailTop",
|
||||
display: { type: "object" },
|
||||
}
|
||||
return urlParamBindings.concat([queryParamsBinding])
|
||||
}
|
||||
|
@ -497,6 +526,9 @@ const getRoleBindings = () => {
|
|||
type: "context",
|
||||
runtimeBinding: `trim "${role._id}"`,
|
||||
readableBinding: `Role.${role.name}`,
|
||||
category: "Role",
|
||||
icon: "UserGroup",
|
||||
display: { type: "string", name: role.name },
|
||||
}
|
||||
})
|
||||
}
|
||||
|
@ -518,6 +550,7 @@ export const getEventContextBindings = (
|
|||
// Check if any context bindings are provided by the component for this
|
||||
// setting
|
||||
const component = findComponent(asset.props, componentId)
|
||||
const def = store.actions.components.getDefinition(component?._component)
|
||||
const settings = getComponentSettings(component?._component)
|
||||
const eventSetting = settings.find(setting => setting.key === settingKey)
|
||||
if (eventSetting?.context?.length) {
|
||||
|
@ -527,6 +560,8 @@ export const getEventContextBindings = (
|
|||
runtimeBinding: `${makePropSafe("eventContext")}.${makePropSafe(
|
||||
contextEntry.key
|
||||
)}`,
|
||||
category: component._instanceName,
|
||||
icon: def.icon,
|
||||
})
|
||||
})
|
||||
}
|
||||
|
@ -548,6 +583,8 @@ export const getEventContextBindings = (
|
|||
bindings.push({
|
||||
readableBinding: `Action ${idx + 1}.${contextValue.label}`,
|
||||
runtimeBinding: `actions.${idx}.${contextValue.value}`,
|
||||
category: "Actions",
|
||||
icon: "JourneyAction",
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
|
@ -9,6 +9,9 @@
|
|||
Body,
|
||||
Layout,
|
||||
Button,
|
||||
ActionButton,
|
||||
Icon,
|
||||
Popover,
|
||||
} from "@budibase/bbui"
|
||||
import { createEventDispatcher, onMount } from "svelte"
|
||||
import {
|
||||
|
@ -45,9 +48,25 @@
|
|||
let jsValue = initialValueJS ? value : null
|
||||
let hbsValue = initialValueJS ? null : value
|
||||
|
||||
let selectedCategory = null
|
||||
|
||||
let popover
|
||||
let popoverAnchor
|
||||
let hoverTarget
|
||||
|
||||
$: usingJS = mode === "JavaScript"
|
||||
$: searchRgx = new RegExp(search, "ig")
|
||||
$: categories = Object.entries(groupBy("category", bindings))
|
||||
|
||||
$: bindingIcons = bindings?.reduce((acc, ele) => {
|
||||
if (ele.icon) {
|
||||
acc[ele.category] = acc[ele.category] || ele.icon
|
||||
}
|
||||
return acc
|
||||
}, {})
|
||||
|
||||
$: categoryIcons = { ...bindingIcons, Helpers: "MagicWand" }
|
||||
|
||||
$: filteredCategories = categories
|
||||
.map(([name, categoryBindings]) => ({
|
||||
name,
|
||||
|
@ -55,10 +74,19 @@
|
|||
return binding.readableBinding.match(searchRgx)
|
||||
}),
|
||||
}))
|
||||
.filter(category => category.bindings?.length > 0)
|
||||
.filter(category => {
|
||||
return (
|
||||
category.bindings?.length > 0 &&
|
||||
(!selectedCategory ? true : selectedCategory === category.name)
|
||||
)
|
||||
})
|
||||
|
||||
$: filteredHelpers = helpers?.filter(helper => {
|
||||
return helper.label.match(searchRgx) || helper.description.match(searchRgx)
|
||||
})
|
||||
|
||||
$: categoryNames = [...categories.map(cat => cat[0]), "Helpers"]
|
||||
|
||||
$: codeMirrorHints = bindings?.map(x => `$("${x.readableBinding}")`)
|
||||
|
||||
const updateValue = val => {
|
||||
|
@ -140,58 +168,163 @@
|
|||
})
|
||||
</script>
|
||||
|
||||
<span class="detailPopover">
|
||||
<Popover
|
||||
align="right-side"
|
||||
bind:this={popover}
|
||||
anchor={popoverAnchor}
|
||||
maxWidth={300}
|
||||
>
|
||||
<Layout gap="S">
|
||||
<div class="helper">
|
||||
{#if hoverTarget.title}
|
||||
<div class="helper__name">{hoverTarget.title}</div>
|
||||
{/if}
|
||||
{#if hoverTarget.description}
|
||||
<div class="helper__description">
|
||||
{@html hoverTarget.description}
|
||||
</div>
|
||||
{/if}
|
||||
{#if hoverTarget.example}
|
||||
<pre class="helper__example">{hoverTarget.example}</pre>
|
||||
{/if}
|
||||
</div>
|
||||
</Layout>
|
||||
</Popover>
|
||||
</span>
|
||||
|
||||
<DrawerContent>
|
||||
<svelte:fragment slot="sidebar">
|
||||
<div class="container">
|
||||
<section>
|
||||
<Layout noPadding gap="S">
|
||||
{#if selectedCategory}
|
||||
<div>
|
||||
<ActionButton
|
||||
secondary
|
||||
icon={"ArrowLeft"}
|
||||
on:click={() => {
|
||||
selectedCategory = null
|
||||
}}
|
||||
>
|
||||
Back
|
||||
</ActionButton>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if !selectedCategory}
|
||||
<div class="heading">Search</div>
|
||||
<Search placeholder="Search" bind:value={search} />
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
{#if !selectedCategory && !search}
|
||||
<ul class="category-list">
|
||||
{#each categoryNames as categoryName}
|
||||
<li
|
||||
on:click={() => {
|
||||
selectedCategory = categoryName
|
||||
}}
|
||||
>
|
||||
<Icon name={categoryIcons[categoryName]} />
|
||||
<span class="category-name">{categoryName} </span>
|
||||
<span class="category-chevron"><Icon name="ChevronRight" /></span>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
{/if}
|
||||
|
||||
{#if selectedCategory || search}
|
||||
{#each filteredCategories as category}
|
||||
{#if category.bindings?.length}
|
||||
<section>
|
||||
<div class="heading">{category.name}</div>
|
||||
<div class="cat-heading">
|
||||
<Icon name={categoryIcons[category.name]} />{category.name}
|
||||
</div>
|
||||
<ul>
|
||||
{#each category.bindings as binding}
|
||||
<li on:click={() => addBinding(binding)}>
|
||||
<span class="binding__label">{binding.readableBinding}</span>
|
||||
{#if binding.type}
|
||||
<span class="binding__type">{binding.type}</span>
|
||||
<li
|
||||
class="binding"
|
||||
on:mouseenter={e => {
|
||||
popoverAnchor = e.target
|
||||
if (!binding.description) {
|
||||
return
|
||||
}
|
||||
hoverTarget = {
|
||||
title: binding.display.name || binding.fieldSchema.name,
|
||||
description: binding.description,
|
||||
}
|
||||
popover.show()
|
||||
e.stopPropagation()
|
||||
}}
|
||||
on:mouseleave={() => {
|
||||
popover.hide()
|
||||
popoverAnchor = null
|
||||
hoverTarget = null
|
||||
}}
|
||||
on:focus={() => {}}
|
||||
on:blur={() => {}}
|
||||
on:click={() => addBinding(binding)}
|
||||
>
|
||||
<span class="binding__label">
|
||||
{#if binding.display?.name}
|
||||
{binding.display.name}
|
||||
{:else if binding.fieldSchema?.name}
|
||||
{binding.fieldSchema?.name}
|
||||
{:else}
|
||||
{binding.readableBinding}
|
||||
{/if}
|
||||
{#if binding.description}
|
||||
<br />
|
||||
<div class="binding__description">
|
||||
{binding.description || ""}
|
||||
</div>
|
||||
</span>
|
||||
|
||||
{#if binding.display?.type || binding.fieldSchema?.type}
|
||||
<span class="binding__typeWrap">
|
||||
<span class="binding__type">
|
||||
{binding.display?.type || binding.fieldSchema?.type}
|
||||
</span>
|
||||
</span>
|
||||
{/if}
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</section>
|
||||
{/if}
|
||||
{/each}
|
||||
|
||||
{#if selectedCategory === "Helpers" || search}
|
||||
{#if filteredHelpers?.length}
|
||||
<section>
|
||||
<div class="heading">Helpers</div>
|
||||
<ul>
|
||||
<ul class="helpers">
|
||||
{#each filteredHelpers as helper}
|
||||
<li on:click={() => addHelper(helper, usingJS)}>
|
||||
<div class="helper">
|
||||
<div class="helper__name">{helper.displayText}</div>
|
||||
<div class="helper__description">
|
||||
{@html helper.description}
|
||||
</div>
|
||||
<pre class="helper__example">{getHelperExample(
|
||||
helper,
|
||||
usingJS
|
||||
)}</pre>
|
||||
</div>
|
||||
<li
|
||||
class="binding"
|
||||
on:click={() => addHelper(helper, usingJS)}
|
||||
on:mouseenter={e => {
|
||||
popoverAnchor = e.target
|
||||
if (!helper.displayText && helper.description) {
|
||||
return
|
||||
}
|
||||
hoverTarget = {
|
||||
title: helper.displayText,
|
||||
description: helper.description,
|
||||
example: getHelperExample(helper, usingJS),
|
||||
}
|
||||
popover.show()
|
||||
e.stopPropagation()
|
||||
}}
|
||||
on:mouseleave={() => {
|
||||
popover.hide()
|
||||
popoverAnchor = null
|
||||
hoverTarget = null
|
||||
}}
|
||||
on:focus={() => {}}
|
||||
on:blur={() => {}}
|
||||
>
|
||||
<span class="binding__label">{helper.displayText}</span>
|
||||
<span class="binding__typeWrap">
|
||||
<span class="binding__type">function</span>
|
||||
</span>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</section>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
{/if}
|
||||
</Layout>
|
||||
</svelte:fragment>
|
||||
<div class="main">
|
||||
<Tabs selected={mode} on:select={onChangeMode}>
|
||||
|
@ -241,6 +374,35 @@
|
|||
</DrawerContent>
|
||||
|
||||
<style>
|
||||
ul.helpers li * {
|
||||
pointer-events: none;
|
||||
}
|
||||
ul.category-list li {
|
||||
display: flex;
|
||||
gap: var(--spacing-m);
|
||||
align-items: center;
|
||||
}
|
||||
ul.category-list .category-name {
|
||||
font-weight: 600;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
ul.category-list .category-chevron {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
}
|
||||
ul.category-list .category-chevron :global(div.icon),
|
||||
.cat-heading :global(div.icon) {
|
||||
display: inline-block;
|
||||
}
|
||||
li.binding {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
li.binding .binding__typeWrap {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.main :global(textarea) {
|
||||
min-height: 202px !important;
|
||||
}
|
||||
|
@ -251,23 +413,20 @@
|
|||
padding: var(--spacing-s) var(--spacing-xl);
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: calc(-1 * var(--spacing-xl));
|
||||
}
|
||||
.heading {
|
||||
.heading,
|
||||
.cat-heading {
|
||||
font-size: var(--font-size-s);
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
color: var(--spectrum-global-color-gray-600);
|
||||
padding: var(--spacing-xl) 0 var(--spacing-m) 0;
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 0 var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);
|
||||
}
|
||||
section:not(:first-child) {
|
||||
border-top: var(--border-light);
|
||||
.cat-heading {
|
||||
display: flex;
|
||||
gap: var(--spacing-m);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
|
@ -278,7 +437,7 @@
|
|||
font-size: var(--font-size-s);
|
||||
padding: var(--spacing-m);
|
||||
border-radius: 4px;
|
||||
border: var(--border-light);
|
||||
background-color: var(--spectrum-global-color-gray-200);
|
||||
transition: background-color 130ms ease-in-out, color 130ms ease-in-out,
|
||||
border-color 130ms ease-in-out;
|
||||
word-wrap: break-word;
|
||||
|
@ -292,22 +451,14 @@
|
|||
li:hover {
|
||||
color: var(--spectrum-global-color-gray-900);
|
||||
background-color: var(--spectrum-global-color-gray-50);
|
||||
border-color: var(--spectrum-global-color-gray-500);
|
||||
cursor: pointer;
|
||||
}
|
||||
li:hover :global(*) {
|
||||
color: var(--spectrum-global-color-gray-900) !important;
|
||||
}
|
||||
|
||||
.binding__label {
|
||||
font-weight: 600;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.binding__description {
|
||||
color: var(--spectrum-global-color-gray-700);
|
||||
margin: 0.5rem 0 0 0;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.binding__type {
|
||||
font-family: monospace;
|
||||
background-color: var(--spectrum-global-color-gray-200);
|
||||
|
|
|
@ -15,7 +15,6 @@
|
|||
}
|
||||
return bindings?.map(binding => ({
|
||||
...binding,
|
||||
category: "Bindable Values",
|
||||
type: null,
|
||||
}))
|
||||
}
|
||||
|
|
|
@ -544,7 +544,8 @@
|
|||
"values": [
|
||||
{
|
||||
"label": "Row Index",
|
||||
"key": "index"
|
||||
"key": "index",
|
||||
"type": "number"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
@ -2314,19 +2315,23 @@
|
|||
"values": [
|
||||
{
|
||||
"label": "Value",
|
||||
"key": "__value"
|
||||
"key": "__value",
|
||||
"type": "object"
|
||||
},
|
||||
{
|
||||
"label": "Valid",
|
||||
"key": "__valid"
|
||||
"key": "__valid",
|
||||
"type": "boolean"
|
||||
},
|
||||
{
|
||||
"label": "Current Step",
|
||||
"key": "__currentStep"
|
||||
"key": "__currentStep",
|
||||
"type": "number"
|
||||
},
|
||||
{
|
||||
"label": "Current Step Valid",
|
||||
"key": "__currentStepValid"
|
||||
"key": "__currentStepValid",
|
||||
"type": "boolean"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
@ -3550,23 +3555,28 @@
|
|||
"values": [
|
||||
{
|
||||
"label": "Rows",
|
||||
"key": "rows"
|
||||
"key": "rows",
|
||||
"type": "array"
|
||||
},
|
||||
{
|
||||
"label": "Extra Info",
|
||||
"key": "info"
|
||||
"key": "info",
|
||||
"type": "string"
|
||||
},
|
||||
{
|
||||
"label": "Rows Length",
|
||||
"key": "rowsLength"
|
||||
"key": "rowsLength",
|
||||
"type": "number"
|
||||
},
|
||||
{
|
||||
"label": "Schema",
|
||||
"key": "schema"
|
||||
"key": "schema",
|
||||
"type": "object"
|
||||
},
|
||||
{
|
||||
"label": "Page Number",
|
||||
"key": "pageNumber"
|
||||
"key": "pageNumber",
|
||||
"type": "number"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
@ -4328,23 +4338,28 @@
|
|||
"values": [
|
||||
{
|
||||
"label": "Rows",
|
||||
"key": "rows"
|
||||
"key": "rows",
|
||||
"type": "array"
|
||||
},
|
||||
{
|
||||
"label": "Extra Info",
|
||||
"key": "info"
|
||||
"key": "info",
|
||||
"type": "string"
|
||||
},
|
||||
{
|
||||
"label": "Rows Length",
|
||||
"key": "rowsLength"
|
||||
"key": "rowsLength",
|
||||
"type": "number"
|
||||
},
|
||||
{
|
||||
"label": "Schema",
|
||||
"key": "schema"
|
||||
"key": "schema",
|
||||
"type": "object"
|
||||
},
|
||||
{
|
||||
"label": "Page Number",
|
||||
"key": "pageNumber"
|
||||
"key": "pageNumber",
|
||||
"type": "number"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
@ -4354,7 +4369,8 @@
|
|||
"values": [
|
||||
{
|
||||
"label": "Row Index",
|
||||
"key": "index"
|
||||
"key": "index",
|
||||
"type": "number"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue