Minor refactoring and icon updates
This commit is contained in:
parent
216c860291
commit
02c89bcdb1
|
@ -359,7 +359,8 @@ const getProviderContextBindings = (asset, dataProviders) => {
|
|||
providerId,
|
||||
// Table ID is used by JSON fields to know what table the field is in
|
||||
tableId: table?._id,
|
||||
category: "Data",
|
||||
category: "Dataprovider",
|
||||
display: { name: readableBinding, type: fieldSchema.type },
|
||||
})
|
||||
})
|
||||
})
|
||||
|
@ -387,6 +388,7 @@ const getUserBindings = () => {
|
|||
fieldSchema,
|
||||
providerId: "user",
|
||||
category: "Current User",
|
||||
display: fieldSchema,
|
||||
})
|
||||
})
|
||||
return bindings
|
||||
|
@ -404,12 +406,14 @@ const getDeviceBindings = () => {
|
|||
runtimeBinding: `${safeDevice}.${makePropSafe("mobile")}`,
|
||||
readableBinding: `Device.Mobile`,
|
||||
category: "Device",
|
||||
display: { type: "string", name: "mobile" },
|
||||
})
|
||||
bindings.push({
|
||||
type: "context",
|
||||
runtimeBinding: `${safeDevice}.${makePropSafe("tablet")}`,
|
||||
readableBinding: `Device.Tablet`,
|
||||
category: "Device",
|
||||
display: { type: "string", name: "tablet" },
|
||||
})
|
||||
}
|
||||
return bindings
|
||||
|
@ -433,6 +437,7 @@ const getSelectedRowsBindings = asset => {
|
|||
"selectedRows"
|
||||
)}`,
|
||||
readableBinding: `${table._instanceName}.Selected rows`,
|
||||
category: "Dataprovider",
|
||||
}))
|
||||
)
|
||||
|
||||
|
@ -465,6 +470,7 @@ const getStateBindings = () => {
|
|||
runtimeBinding: `${safeState}.${makePropSafe(key)}`,
|
||||
readableBinding: `State.${key}`,
|
||||
category: "State",
|
||||
display: { name: key },
|
||||
}))
|
||||
}
|
||||
return bindings
|
||||
|
@ -505,6 +511,7 @@ const getRoleBindings = () => {
|
|||
runtimeBinding: `trim "${role._id}"`,
|
||||
readableBinding: `Role.${role.name}`,
|
||||
category: "Role",
|
||||
display: { name: role.name },
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
@ -53,15 +53,15 @@
|
|||
Device: "DevicePhone",
|
||||
"Current User": "User",
|
||||
Helpers: "MagicWand",
|
||||
Data: "Data",
|
||||
Dataprovider: "Data",
|
||||
State: "AutomatedSegment",
|
||||
URL: "RailTop",
|
||||
Role: "UsersLock",
|
||||
Role: "UserGroup",
|
||||
}
|
||||
|
||||
let popover
|
||||
let popoverAnchor
|
||||
let hoverHelper
|
||||
let hoverTarget
|
||||
|
||||
$: usingJS = mode === "JavaScript"
|
||||
$: searchRgx = new RegExp(search, "ig")
|
||||
|
@ -179,21 +179,15 @@
|
|||
bind:this={popover}
|
||||
anchor={popoverAnchor}
|
||||
maxWidth={300}
|
||||
observe={false}
|
||||
>
|
||||
<Layout gap="S">
|
||||
{#if selectedCategory === "Helpers" || search}
|
||||
<div class="helper">
|
||||
<div class="helper__name">{hoverHelper.displayText}</div>
|
||||
<div class="helper__name">{hoverTarget.title}</div>
|
||||
<div class="helper__description">
|
||||
{@html hoverHelper.description}
|
||||
{@html hoverTarget.description}
|
||||
</div>
|
||||
<pre class="helper__example">{getHelperExample(
|
||||
hoverHelper,
|
||||
usingJS
|
||||
)}</pre>
|
||||
<pre class="helper__example">{hoverTarget.example}</pre>
|
||||
</div>
|
||||
{/if}
|
||||
</Layout>
|
||||
</Popover>
|
||||
</span>
|
||||
|
@ -244,21 +238,53 @@
|
|||
</div>
|
||||
<ul>
|
||||
{#each category.bindings as binding}
|
||||
<!-- {JSON.stringify(binding)} -->
|
||||
<li class="binding" on:click={() => addBinding(binding)}>
|
||||
<span class="binding__label">{binding.readableBinding}</span>
|
||||
<!-- {#if binding.type}
|
||||
<span class="binding__typeWrap">
|
||||
<span class="binding__type">{binding.type}</span>
|
||||
<li
|
||||
class="binding"
|
||||
on:mouseenter={e => {
|
||||
popoverAnchor = e.target
|
||||
if (!binding.name && !binding.description) {
|
||||
return
|
||||
}
|
||||
hoverTarget = {
|
||||
title: binding.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}
|
||||
</span>
|
||||
{/if} -->
|
||||
{#if binding.fieldSchema?.type}
|
||||
|
||||
{#if binding.display?.type}
|
||||
<span class="binding__typeWrap">
|
||||
<span class="binding__type">
|
||||
{binding.fieldSchema.type}
|
||||
{binding.display.type}
|
||||
</span>
|
||||
</span>
|
||||
{:else if binding.fieldSchema?.type}
|
||||
<span class="binding__typeWrap">
|
||||
<span class="binding__type">
|
||||
{binding.fieldSchema?.type}
|
||||
</span>
|
||||
</span>
|
||||
{/if}
|
||||
|
||||
{#if binding.description}
|
||||
<br />
|
||||
<div class="binding__description">
|
||||
|
@ -277,28 +303,33 @@
|
|||
<ul class="helpers">
|
||||
{#each filteredHelpers as helper}
|
||||
<li
|
||||
class="binding"
|
||||
on:click={() => addHelper(helper, usingJS)}
|
||||
on:mouseenter={e => {
|
||||
// if (e.target !== this) return
|
||||
popoverAnchor = e.target
|
||||
hoverHelper = helper
|
||||
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
|
||||
hoverHelper = null
|
||||
hoverTarget = null
|
||||
}}
|
||||
on:focus={() => {}}
|
||||
on:blur={() => {}}
|
||||
>
|
||||
<span class="binding__label">{helper.displayText}</span>
|
||||
{#if helper.type}
|
||||
<span class="binding__typeWrap">
|
||||
<span class="binding__type">{helper.type}</span>
|
||||
<span class="binding__type">function</span>
|
||||
</span>
|
||||
{/if}
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
|
|
Loading…
Reference in New Issue