Merge branch 'spectrum-bbui' into spectrum/kevs-bits-and-bobs-the-sequel
This commit is contained in:
commit
e63e2b369a
|
@ -41,14 +41,12 @@
|
|||
class="spectrum-ActionButton spectrum-ActionButton--size{size}"
|
||||
{disabled}
|
||||
on:longPress
|
||||
on:click|preventDefault
|
||||
>
|
||||
on:click|preventDefault>
|
||||
{#if longPressable}
|
||||
<svg
|
||||
class="spectrum-Icon spectrum-UIIcon-CornerTriangle100 spectrum-ActionButton-hold"
|
||||
focusable="false"
|
||||
aria-hidden="true"
|
||||
>
|
||||
aria-hidden="true">
|
||||
<use xlink:href="#spectrum-css-icon-CornerTriangle100" />
|
||||
</svg>
|
||||
{/if}
|
||||
|
@ -57,8 +55,7 @@
|
|||
class="spectrum-Icon spectrum-Icon--size{size}"
|
||||
focusable="false"
|
||||
aria-hidden="true"
|
||||
aria-label={icon}
|
||||
>
|
||||
aria-label={icon}>
|
||||
<use xlink:href="#spectrum-icon-18-{icon}" />
|
||||
</svg>
|
||||
{/if}
|
||||
|
@ -66,9 +63,3 @@
|
|||
<span class="spectrum-ActionButton-label"><slot /></span>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<style>
|
||||
span {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
setContext("actionMenu", { show, hide })
|
||||
</script>
|
||||
|
||||
<div class="contents" use:getAnchor on:click={openMenu}>
|
||||
<div use:getAnchor on:click={openMenu}>
|
||||
<slot name="control" />
|
||||
</div>
|
||||
<Popover bind:this={dropdown} {anchor} align="left">
|
||||
|
@ -36,9 +36,3 @@
|
|||
<slot />
|
||||
</Menu>
|
||||
</Popover>
|
||||
|
||||
<style>
|
||||
div {
|
||||
display: contents;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -3,14 +3,25 @@ import { localStorageStore } from "./localStorage"
|
|||
export const getThemeStore = () => {
|
||||
const themeElement = document.documentElement
|
||||
const initialValue = {
|
||||
darkMode: true,
|
||||
theme: "darkest",
|
||||
options: ["lightest", "light", "dark", "darkest"],
|
||||
}
|
||||
const store = localStorageStore("bb-theme", initialValue)
|
||||
|
||||
// Update theme when store changes
|
||||
store.subscribe(theme => {
|
||||
themeElement.classList.toggle("spectrum--darkest", theme.darkMode)
|
||||
themeElement.classList.toggle("spectrum--lightest", !theme.darkMode)
|
||||
// Update theme class when store changes
|
||||
store.subscribe(state => {
|
||||
// Handle any old local storage values - this can be removed after the update
|
||||
if (state.darkMode !== undefined) {
|
||||
store.set(initialValue)
|
||||
return
|
||||
}
|
||||
|
||||
state.options.forEach(option => {
|
||||
themeElement.classList.toggle(
|
||||
`spectrum--${option}`,
|
||||
option === state.theme
|
||||
)
|
||||
})
|
||||
})
|
||||
|
||||
return store
|
||||
|
|
|
@ -57,7 +57,7 @@
|
|||
<CreateColumnButton />
|
||||
{#if schema && Object.keys(schema).length > 0}
|
||||
<CreateRowButton
|
||||
title={isUsersTable ? 'Create New User' : 'Create New Row'}
|
||||
title={isUsersTable ? 'Create user' : 'Create row'}
|
||||
modalContentComponent={isUsersTable ? CreateEditUser : CreateEditRow} />
|
||||
<CreateViewButton />
|
||||
<ManageAccessButton resourceId={$tables.selected?._id} />
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import { Modal, Button } from "@budibase/bbui"
|
||||
import { Modal, ActionButton } from "@budibase/bbui"
|
||||
import CalculateModal from "../modals/CalculateModal.svelte"
|
||||
|
||||
export let view = {}
|
||||
|
@ -7,15 +7,14 @@
|
|||
let modal
|
||||
</script>
|
||||
|
||||
<Button
|
||||
<ActionButton
|
||||
icon="Calculator"
|
||||
primary
|
||||
size="S"
|
||||
quiet
|
||||
on:click={modal.show}
|
||||
active={view.field && view.calculation}>
|
||||
Calculate
|
||||
</Button>
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<CalculateModal {view} />
|
||||
</Modal>
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
<script>
|
||||
import { Button, Icon, Modal, ModalContent } from "@budibase/bbui"
|
||||
import { ActionButton, Modal } from "@budibase/bbui"
|
||||
import CreateEditColumn from "../modals/CreateEditColumn.svelte"
|
||||
|
||||
let modal
|
||||
</script>
|
||||
|
||||
<Button icon="AddCircle" primary size="S" quiet on:click={modal.show}>
|
||||
Create New Column
|
||||
</Button>
|
||||
<ActionButton icon="TableColumnAddRight" quiet size="S" on:click={modal.show}>
|
||||
Create column
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<CreateEditColumn />
|
||||
</Modal>
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
<script>
|
||||
import { Button, Icon, Modal } from "@budibase/bbui"
|
||||
import { ActionButton, Modal } from "@budibase/bbui"
|
||||
import CreateEditRow from "../modals/CreateEditRow.svelte"
|
||||
|
||||
export let modalContentComponent = CreateEditRow
|
||||
export let title = "Create New Row"
|
||||
export let title = "Create row"
|
||||
|
||||
let modal
|
||||
</script>
|
||||
|
||||
<Button icon="Add" primary size="S" quiet on:click={modal.show}>
|
||||
<ActionButton icon="TableRowAddBottom" size="S" quiet on:click={modal.show}>
|
||||
{title}
|
||||
</Button>
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<svelte:component this={modalContentComponent} />
|
||||
</Modal>
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
<script>
|
||||
import { Modal, Button } from "@budibase/bbui"
|
||||
import { Modal, ActionButton } from "@budibase/bbui"
|
||||
import CreateViewModal from "../modals/CreateViewModal.svelte"
|
||||
|
||||
let modal
|
||||
</script>
|
||||
|
||||
<Button icon="CollectionAdd" primary size="S" quiet on:click={modal.show}>
|
||||
Create New View
|
||||
</Button>
|
||||
<ActionButton icon="CollectionAdd" size="S" quiet on:click={modal.show}>
|
||||
Create view
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<CreateViewModal />
|
||||
</Modal>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import { Button, Modal } from "@budibase/bbui"
|
||||
import { ActionButton, Modal } from "@budibase/bbui"
|
||||
import ExportModal from "../modals/ExportModal.svelte"
|
||||
|
||||
export let view
|
||||
|
@ -7,9 +7,9 @@
|
|||
let modal
|
||||
</script>
|
||||
|
||||
<Button icon="Download" primary size="S" quiet on:click={modal.show}>
|
||||
<ActionButton icon="Download" size="S" quiet on:click={modal.show}>
|
||||
Export
|
||||
</Button>
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<ExportModal {view} />
|
||||
</Modal>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import { Button, Modal } from "@budibase/bbui"
|
||||
import { ActionButton, Modal } from "@budibase/bbui"
|
||||
import FilterModal from "../modals/FilterModal.svelte"
|
||||
|
||||
export let view = {}
|
||||
|
@ -7,15 +7,14 @@
|
|||
let modal
|
||||
</script>
|
||||
|
||||
<Button
|
||||
<ActionButton
|
||||
icon="Filter"
|
||||
primary
|
||||
size="S"
|
||||
quiet
|
||||
on:click={modal.show}
|
||||
active={view.filters?.length}>
|
||||
Filter
|
||||
</Button>
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<FilterModal {view} />
|
||||
</Modal>
|
||||
|
|
|
@ -1,28 +1,13 @@
|
|||
<script>
|
||||
import { Button } from "@budibase/bbui"
|
||||
import { ActionButton } from "@budibase/bbui"
|
||||
|
||||
export let hideAutocolumns
|
||||
|
||||
let anchor
|
||||
let dropdown
|
||||
|
||||
function hideOrUnhide() {
|
||||
hideAutocolumns = !hideAutocolumns
|
||||
}
|
||||
</script>
|
||||
|
||||
<div bind:this={anchor}>
|
||||
<Button icon="MagicWand" primary size="S" quiet on:click={hideOrUnhide}>
|
||||
{#if hideAutocolumns}
|
||||
Show Auto Columns
|
||||
{:else}
|
||||
Hide Auto Columns
|
||||
{/if}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
</style>
|
||||
<ActionButton icon="MagicWand" primary size="S" quiet on:click={hideOrUnhide}>
|
||||
{#if hideAutocolumns}Show auto columns{:else}Hide auto columns{/if}
|
||||
</ActionButton>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import { Button, Modal } from "@budibase/bbui"
|
||||
import { ActionButton, Modal } from "@budibase/bbui"
|
||||
import { permissions } from "stores/backend"
|
||||
import ManageAccessModal from "../modals/ManageAccessModal.svelte"
|
||||
|
||||
|
@ -14,9 +14,9 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<Button icon="LockClosed" primary size="S" quiet on:click={openDropdown}>
|
||||
Manage Access
|
||||
</Button>
|
||||
<ActionButton icon="LockClosed" size="S" quiet on:click={openDropdown}>
|
||||
Manage access
|
||||
</ActionButton>
|
||||
<Modal bind:this={modal}>
|
||||
<ManageAccessModal
|
||||
{resourceId}
|
||||
|
|
|
@ -34,11 +34,10 @@
|
|||
{#each $tables.list as table, idx}
|
||||
<NavItem
|
||||
border={idx > 0}
|
||||
icon={table._id === TableNames.USERS ? "UserGroup" : "Table"}
|
||||
icon={table._id === TableNames.USERS ? 'UserGroup' : 'Table'}
|
||||
text={table.name}
|
||||
selected={selectedView === `all_${table._id}`}
|
||||
on:click={() => selectTable(table)}
|
||||
>
|
||||
on:click={() => selectTable(table)}>
|
||||
{#if table._id !== TableNames.USERS}
|
||||
<EditTablePopover {table} />
|
||||
{/if}
|
||||
|
@ -46,14 +45,12 @@
|
|||
{#each Object.keys(table.views || {}) as viewName, idx (idx)}
|
||||
<NavItem
|
||||
indentLevel={1}
|
||||
icon="ri-eye-line"
|
||||
icon="Remove"
|
||||
text={viewName}
|
||||
selected={selectedView === viewName}
|
||||
on:click={() => onClickView(table, viewName)}
|
||||
>
|
||||
on:click={() => onClickView(table, viewName)}>
|
||||
<EditViewPopover
|
||||
view={{ name: viewName, ...table.views[viewName] }}
|
||||
/>
|
||||
view={{ name: viewName, ...table.views[viewName] }} />
|
||||
</NavItem>
|
||||
{/each}
|
||||
{/each}
|
||||
|
|
|
@ -1,40 +1,30 @@
|
|||
<script>
|
||||
import { goto } from "@roxi/routify"
|
||||
import { views } from "stores/backend"
|
||||
import { notifications } from "@budibase/bbui"
|
||||
import { Icon, Popover, Button, Input } from "@budibase/bbui"
|
||||
import ConfirmDialog from "components/common/ConfirmDialog.svelte"
|
||||
import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"
|
||||
import {
|
||||
notifications,
|
||||
Icon,
|
||||
Input,
|
||||
ActionMenu,
|
||||
MenuItem,
|
||||
Modal,
|
||||
ModalContent,
|
||||
} from "@budibase/bbui"
|
||||
|
||||
export let view
|
||||
|
||||
let anchor
|
||||
let dropdown
|
||||
let editing
|
||||
let editorModal
|
||||
let confirmDeleteDialogue
|
||||
let originalName = view.name
|
||||
let confirmDeleteDialog
|
||||
|
||||
function showEditor() {
|
||||
editing = true
|
||||
}
|
||||
|
||||
function hideEditor() {
|
||||
dropdown.hide()
|
||||
editing = false
|
||||
}
|
||||
|
||||
function showDelete() {
|
||||
dropdown.hide()
|
||||
confirmDeleteDialog.show()
|
||||
}
|
||||
|
||||
async function save() {
|
||||
await views.save({
|
||||
originalName,
|
||||
...view,
|
||||
})
|
||||
notifications.success("View renamed successfully")
|
||||
hideEditor()
|
||||
}
|
||||
|
||||
async function deleteView() {
|
||||
|
@ -46,69 +36,21 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<div on:click|stopPropagation>
|
||||
<div bind:this={anchor} class="icon" on:click={dropdown.show}>
|
||||
<ActionMenu>
|
||||
<div slot="control" class="icon">
|
||||
<Icon s hoverable name="MoreSmallList" />
|
||||
</div>
|
||||
<Popover align="left" {anchor} bind:this={dropdown}>
|
||||
{#if editing}
|
||||
<div class="actions">
|
||||
<h5>Edit View</h5>
|
||||
<MenuItem icon="Edit" on:click={editorModal.show}>Edit</MenuItem>
|
||||
<MenuItem icon="Delete" on:click={confirmDeleteDialog.show}>Delete</MenuItem>
|
||||
</ActionMenu>
|
||||
<Modal bind:this={editorModal}>
|
||||
<ModalContent title="Edit View" onConfirm={save} confirmText="Save">
|
||||
<Input label="View Name" thin bind:value={view.name} />
|
||||
<footer>
|
||||
<Button secondary on:click={hideEditor}>Cancel</Button>
|
||||
<Button primary on:click={save}>Save</Button>
|
||||
</footer>
|
||||
</div>
|
||||
{:else}
|
||||
<DropdownContainer>
|
||||
<DropdownItem
|
||||
icon="ri-edit-line"
|
||||
data-cy="edit-view"
|
||||
title="Edit"
|
||||
on:click={showEditor}
|
||||
/>
|
||||
<DropdownItem
|
||||
icon="ri-delete-bin-line"
|
||||
title="Delete"
|
||||
data-cy="delete-view"
|
||||
on:click={showDelete}
|
||||
/>
|
||||
</DropdownContainer>
|
||||
{/if}
|
||||
</Popover>
|
||||
</div>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
<ConfirmDialog
|
||||
bind:this={confirmDeleteDialog}
|
||||
body={`Are you sure you wish to delete the view '${view.name}'? Your data will be deleted and this action cannot be undone.`}
|
||||
okText="Delete View"
|
||||
onOk={deleteView}
|
||||
title="Confirm Deletion"
|
||||
/>
|
||||
|
||||
<style>
|
||||
div.icon {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.actions {
|
||||
padding: var(--spacing-xl);
|
||||
display: grid;
|
||||
grid-gap: var(--spacing-xl);
|
||||
min-width: 400px;
|
||||
}
|
||||
|
||||
h5 {
|
||||
margin: 0;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: var(--spacing-m);
|
||||
}
|
||||
</style>
|
||||
title="Confirm Deletion" />
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import { Modal, ModalContent } from "@budibase/bbui"
|
||||
import { Modal, ModalContent, Body } from "@budibase/bbui"
|
||||
|
||||
export let title = ""
|
||||
export let body = ""
|
||||
|
@ -20,15 +20,9 @@
|
|||
|
||||
<Modal bind:this={modal} on:hide={onCancel}>
|
||||
<ModalContent onConfirm={onOk} {title} confirmText={okText} {cancelText} red>
|
||||
<div class="body">
|
||||
<Body s>
|
||||
{body}
|
||||
<slot />
|
||||
</div>
|
||||
</Body>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
|
||||
<style>
|
||||
.body {
|
||||
font-size: var(--font-size-s);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
ActionGroup,
|
||||
ActionButton,
|
||||
MenuItem,
|
||||
Icon,
|
||||
} from "@budibase/bbui"
|
||||
import { store, currentAssetName } from "builderStore"
|
||||
import structure from "./componentStructure.json"
|
||||
|
@ -12,7 +13,7 @@
|
|||
|
||||
const enrichStructure = (structure, definitions) => {
|
||||
let enrichedStructure = []
|
||||
structure.forEach((item) => {
|
||||
structure.forEach(item => {
|
||||
if (typeof item === "string") {
|
||||
const def = definitions[`@budibase/standard-components/${item}`]
|
||||
if (def) {
|
||||
|
@ -32,37 +33,65 @@
|
|||
return enrichedStructure
|
||||
}
|
||||
|
||||
const onItemChosen = async (item) => {
|
||||
const onItemChosen = async item => {
|
||||
if (!item.isCategory) {
|
||||
// Add this component
|
||||
await store.actions.components.create(item.component)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<ActionGroup>
|
||||
<div class="components">
|
||||
{#each enrichedStructure as item}
|
||||
<ActionMenu disabled={!item.isCategory}>
|
||||
<ActionButton
|
||||
icon={item.icon}
|
||||
primary
|
||||
quiet
|
||||
size="S"
|
||||
slot="control"
|
||||
on:click={() => onItemChosen(item)}
|
||||
>
|
||||
on:click={() => onItemChosen(item)}>
|
||||
<div class="buttonContent">
|
||||
{item.name}
|
||||
{#if item.isCategory}
|
||||
<Icon size="S" name="ChevronDown" />
|
||||
{/if}
|
||||
</div>
|
||||
</ActionButton>
|
||||
{#each item.children || [] as item}
|
||||
{#if !item.showOnAsset || item.showOnAsset.includes($currentAssetName)}
|
||||
<MenuItem
|
||||
dataCy={`component-${item.name}`}
|
||||
icon={item.icon}
|
||||
on:click={() => onItemChosen(item)}
|
||||
>
|
||||
on:click={() => onItemChosen(item)}>
|
||||
{item.name}
|
||||
</MenuItem>
|
||||
{/if}
|
||||
{/each}
|
||||
</ActionMenu>
|
||||
{/each}
|
||||
</ActionGroup>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.components {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin-top: -10px;
|
||||
}
|
||||
.components :global(> *) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.buttonContent {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.buttonContent :global(svg) {
|
||||
margin-left: 2px !important;
|
||||
margin-right: 0 !important;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
"search",
|
||||
{
|
||||
"name": "Form",
|
||||
"icon": "ri-file-edit-line",
|
||||
"icon": "Form",
|
||||
"children": [
|
||||
"form",
|
||||
"fieldgroup",
|
||||
|
@ -24,7 +24,7 @@
|
|||
},
|
||||
{
|
||||
"name": "Card",
|
||||
"icon": "ri-archive-drawer-line",
|
||||
"icon": "Card",
|
||||
"children": [
|
||||
"stackedlist",
|
||||
"card",
|
||||
|
@ -34,7 +34,7 @@
|
|||
},
|
||||
{
|
||||
"name": "Chart",
|
||||
"icon": "ri-bar-chart-2-line",
|
||||
"icon": "GraphBarVertical",
|
||||
"children": [
|
||||
"bar",
|
||||
"line",
|
||||
|
@ -46,7 +46,7 @@
|
|||
},
|
||||
{
|
||||
"name": "Elements",
|
||||
"icon": "ri-paragraph",
|
||||
"icon": "TextParagraph",
|
||||
"children": [
|
||||
"heading",
|
||||
"text",
|
||||
|
@ -59,7 +59,7 @@
|
|||
},
|
||||
{
|
||||
"name": "Other",
|
||||
"icon": "ri-more-2-line",
|
||||
"icon": "More",
|
||||
"children": [
|
||||
"screenslot",
|
||||
"navigation",
|
||||
|
|
|
@ -1,8 +1,11 @@
|
|||
<script>
|
||||
import { themeStore } from "builderStore"
|
||||
import { Toggle } from "@budibase/bbui"
|
||||
|
||||
let showAdvanced = false
|
||||
import { Select } from "@budibase/bbui"
|
||||
import { capitalise } from "../../helpers"
|
||||
</script>
|
||||
|
||||
<Toggle text="Dark theme" bind:value={$themeStore.darkMode} />
|
||||
<Select
|
||||
options={$themeStore.options}
|
||||
bind:value={$themeStore.theme}
|
||||
placeholder={null}
|
||||
getOptionLabel={capitalise} />
|
||||
|
|
|
@ -44,7 +44,7 @@
|
|||
|
||||
<style>
|
||||
.apps-card {
|
||||
background-color: var(--background-alt);
|
||||
background-color: var(--background);
|
||||
padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl)
|
||||
var(--spacing-xl);
|
||||
max-width: 300px;
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
"container": {
|
||||
"name": "Container",
|
||||
"description": "This component contains things within itself",
|
||||
"icon": "ri-layout-column-line",
|
||||
"icon": "Sandbox",
|
||||
"hasChildren": true,
|
||||
"styleable": true,
|
||||
"transitionable": true,
|
||||
|
@ -10,14 +10,14 @@
|
|||
},
|
||||
"screenslot": {
|
||||
"name": "Screenslot",
|
||||
"icon": "ri-artboard-2-line",
|
||||
"icon": "WebPage",
|
||||
"description": "Contains your app screens",
|
||||
"styleable": true
|
||||
},
|
||||
"button": {
|
||||
"name": "Button",
|
||||
"description": "A basic html button that is ready for styling",
|
||||
"icon": "ri-share-box-line",
|
||||
"icon": "Button",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -40,7 +40,7 @@
|
|||
"repeater": {
|
||||
"name": "Repeater",
|
||||
"description": "A configurable data list that attaches to your backend tables.",
|
||||
"icon": "ri-list-check-2",
|
||||
"icon": "ViewList",
|
||||
"styleable": true,
|
||||
"hasChildren": true,
|
||||
"settings": [
|
||||
|
@ -68,7 +68,7 @@
|
|||
"search": {
|
||||
"name": "Search",
|
||||
"description": "A searchable list of items.",
|
||||
"icon": "ri-search-line",
|
||||
"icon": "Search",
|
||||
"styleable": true,
|
||||
"hasChildren": true,
|
||||
"settings": [
|
||||
|
@ -101,7 +101,7 @@
|
|||
}
|
||||
},
|
||||
"stackedlist": {
|
||||
"name": "Stacked List",
|
||||
"name": "TaskList",
|
||||
"icon": "ri-archive-drawer-line",
|
||||
"description": "A basic card component that can contain content and actions.",
|
||||
"styleable": true,
|
||||
|
@ -132,7 +132,7 @@
|
|||
"card": {
|
||||
"name": "Vertical Card",
|
||||
"description": "A basic card component that can contain content and actions.",
|
||||
"icon": "ri-layout-column-line",
|
||||
"icon": "ViewColumn",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -192,7 +192,7 @@
|
|||
"text": {
|
||||
"name": "Paragraph",
|
||||
"description": "A component for displaying paragraph text.",
|
||||
"icon": "ri-paragraph",
|
||||
"icon": "TextParagraph",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -204,7 +204,7 @@
|
|||
},
|
||||
"heading": {
|
||||
"name": "Headline",
|
||||
"icon": "ri-heading",
|
||||
"icon": "TextBold",
|
||||
"description": "A component for displaying heading text",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
|
@ -225,7 +225,7 @@
|
|||
"image": {
|
||||
"name": "Image",
|
||||
"description": "A basic component for displaying images",
|
||||
"icon": "ri-image-line",
|
||||
"icon": "Image",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -238,7 +238,7 @@
|
|||
"backgroundimage": {
|
||||
"name": "Background Image",
|
||||
"description": "A background image",
|
||||
"icon": "ri-image-line",
|
||||
"icon": "Images",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -295,7 +295,7 @@
|
|||
"icon": {
|
||||
"name": "Icon",
|
||||
"description": "A basic component for displaying icons",
|
||||
"icon": "ri-sun-fill",
|
||||
"icon": "Bell",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -342,7 +342,7 @@
|
|||
"login": {
|
||||
"name": "Login Form",
|
||||
"description": "A component that automatically generates a login screen for your app.",
|
||||
"icon": "ri-login-box-line",
|
||||
"icon": "Login",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -365,7 +365,7 @@
|
|||
"navigation": {
|
||||
"name": "Nav Bar",
|
||||
"description": "A component for handling the navigation within your app.",
|
||||
"icon": "ri-navigation-line",
|
||||
"icon": "BreadcrumbNavigation",
|
||||
"styleable": true,
|
||||
"hasChildren": true,
|
||||
"settings": [
|
||||
|
@ -379,7 +379,7 @@
|
|||
"link": {
|
||||
"name": "Link",
|
||||
"description": "A basic link component for internal and external links",
|
||||
"icon": "ri-link",
|
||||
"icon": "Link",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -408,7 +408,7 @@
|
|||
"cardhorizontal": {
|
||||
"name": "Horizontal Card",
|
||||
"description": "A basic card component that can contain content and actions.",
|
||||
"icon": "ri-layout-row-line",
|
||||
"icon": "ViewRow",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -480,7 +480,7 @@
|
|||
"cardstat": {
|
||||
"name": "Stat Card",
|
||||
"description": "A card component for displaying numbers.",
|
||||
"icon": "ri-dual-sim-2-line",
|
||||
"icon": "Card",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -505,7 +505,7 @@
|
|||
},
|
||||
"embed": {
|
||||
"name": "Embed",
|
||||
"icon": "ri-code-line",
|
||||
"icon": "Code",
|
||||
"description": "Embed content from 3rd party sources",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
|
@ -519,7 +519,7 @@
|
|||
"bar": {
|
||||
"name": "Bar Chart",
|
||||
"description": "Bar chart",
|
||||
"icon": "ri-bar-chart-line",
|
||||
"icon": "GraphBarVertical",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -619,7 +619,7 @@
|
|||
"line": {
|
||||
"name": "Line Chart",
|
||||
"description": "Line chart",
|
||||
"icon": "ri-line-chart-line",
|
||||
"icon": "GraphTrend",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -720,7 +720,7 @@
|
|||
"area": {
|
||||
"name": "Area Chart",
|
||||
"description": "Line chart",
|
||||
"icon": "ri-line-chart-fill",
|
||||
"icon": "GraphAreaStacked",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -833,7 +833,7 @@
|
|||
"pie": {
|
||||
"name": "Pie Chart",
|
||||
"description": "Pie chart",
|
||||
"icon": "ri-pie-chart-line",
|
||||
"icon": "GraphPie",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -910,7 +910,7 @@
|
|||
"donut": {
|
||||
"name": "Donut Chart",
|
||||
"description": "Donut chart",
|
||||
"icon": "ri-donut-chart-line",
|
||||
"icon": "GraphDonut",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -987,7 +987,7 @@
|
|||
"candlestick": {
|
||||
"name": "Candlestick Chart",
|
||||
"description": "Candlestick chart",
|
||||
"icon": "ri-stock-line",
|
||||
"icon": "GraphBarVerticalStacked",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1068,7 +1068,7 @@
|
|||
},
|
||||
"form": {
|
||||
"name": "Form",
|
||||
"icon": "ri-file-text-line",
|
||||
"icon": "Form",
|
||||
"styleable": true,
|
||||
"hasChildren": true,
|
||||
"actions": [
|
||||
|
@ -1133,7 +1133,7 @@
|
|||
},
|
||||
"fieldgroup": {
|
||||
"name": "Field Group",
|
||||
"icon": "ri-layout-row-line",
|
||||
"icon": "Group",
|
||||
"styleable": true,
|
||||
"hasChildren": true,
|
||||
"settings": [
|
||||
|
@ -1161,7 +1161,7 @@
|
|||
},
|
||||
"stringfield": {
|
||||
"name": "Text Field",
|
||||
"icon": "ri-t-box-line",
|
||||
"icon": "Text",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1189,7 +1189,7 @@
|
|||
},
|
||||
"numberfield": {
|
||||
"name": "Number Field",
|
||||
"icon": "ri-edit-box-line",
|
||||
"icon": "123",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1217,7 +1217,7 @@
|
|||
},
|
||||
"passwordfield": {
|
||||
"name": "Password Field",
|
||||
"icon": "ri-lock-password-line",
|
||||
"icon": "LockClosed",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1245,7 +1245,7 @@
|
|||
},
|
||||
"optionsfield": {
|
||||
"name": "Options Picker",
|
||||
"icon": "ri-file-list-line",
|
||||
"icon": "ViewList",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1274,7 +1274,7 @@
|
|||
},
|
||||
"booleanfield": {
|
||||
"name": "Checkbox",
|
||||
"icon": "ri-checkbox-line",
|
||||
"icon": "Checkmark",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1302,7 +1302,7 @@
|
|||
},
|
||||
"longformfield": {
|
||||
"name": "Rich Text",
|
||||
"icon": "ri-file-edit-line",
|
||||
"icon": "TextParagraph",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1331,7 +1331,7 @@
|
|||
},
|
||||
"datetimefield": {
|
||||
"name": "Date Picker",
|
||||
"icon": "ri-calendar-line",
|
||||
"icon": "DateInput",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1365,7 +1365,7 @@
|
|||
},
|
||||
"attachmentfield": {
|
||||
"name": "Attachment",
|
||||
"icon": "ri-image-edit-line",
|
||||
"icon": "Attach",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1388,7 +1388,7 @@
|
|||
},
|
||||
"relationshipfield": {
|
||||
"name": "Relationship Picker",
|
||||
"icon": "ri-links-line",
|
||||
"icon": "TaskList",
|
||||
"styleable": true,
|
||||
"settings": [
|
||||
{
|
||||
|
@ -1416,7 +1416,7 @@
|
|||
},
|
||||
"dataprovider": {
|
||||
"name": "Data Provider",
|
||||
"icon": "ri-database-2-line",
|
||||
"icon": "Data",
|
||||
"styleable": false,
|
||||
"hasChildren": true,
|
||||
"settings": [
|
||||
|
@ -1476,7 +1476,7 @@
|
|||
},
|
||||
"table": {
|
||||
"name": "Table",
|
||||
"icon": "ri-table-line",
|
||||
"icon": "Table",
|
||||
"styleable": true,
|
||||
"hasChildren": true,
|
||||
"settings": [
|
||||
|
|
Loading…
Reference in New Issue