few bug fixes

This commit is contained in:
Michael Shanks 2019-10-10 10:41:31 +01:00
parent 0e9a885aa1
commit 2cfded5d01
14 changed files with 1205 additions and 1394 deletions

View File

@ -4,7 +4,7 @@ import {
import {
filter, cloneDeep, sortBy,
map, last, keys, concat,
find, isEmpty, reduce
find, isEmpty, reduce, values
} from "lodash/fp";
import {
pipe, getNode, validate,
@ -120,7 +120,7 @@ const initialise = (store, initial) => async () => {
initial.hasAppPackage = true;
initial.hierarchy = pkg.appDefinition.hierarchy;
initial.accessLevels = pkg.accessLevels;
initial.derivedComponents = pkg.derivedComponents;
initial.derivedComponents = values(pkg.derivedComponents);
initial.generators = generatorsArray(pkg.rootComponents.generators);
initial.allComponents = combineComponents(
pkg.derivedComponents, pkg.rootComponents.components);
@ -453,7 +453,7 @@ const saveDerivedComponent = store => (derivedComponent) => {
s.allComponents = components;
s.derivedComponents = derivedComponents;
s.currentFrontEndItem = derivedComponent;
s.currentComponentInfo = getNewComponentInfo(
s.currentComponentInfo = getComponentInfo(
s.allComponents, derivedComponent.name);
s.currentComponentIsNew = false;
@ -480,6 +480,7 @@ const createDerivedComponent = store => componentName => {
const createGeneratedComponents = store => components => {
store.update(s => {
s.allComponents = [...s.allComponents, ...components];
s.derivedComponents = [...s.derivedComponents, ...components];
const doCreate = async () => {
for(let c of components) {

View File

@ -3,7 +3,7 @@ import {
last
} from "lodash/fp";
import IconButton from "../common/IconButton.svelte";
import ComponentSearch from "./ComponentSearch.svelte";
import ComponentSelector from "./ComponentSelector.svelte";
import Button from "../common/Button.svelte";
import ButtonGroup from "../common/ButtonGroup.svelte";
import UIkit from "uikit";
@ -89,11 +89,12 @@ const confirmClearComponent = () => {
</div>
<div bind:this={modalElement} uk-modal>
<div class="uk-modal-dialog">
<div class="uk-modal-dialog" uk-overflow-auto>
{#if modalAction === CHOOSE_COMPONENT}
<div class="uk-modal-body">
<ComponentSearch onComponentChosen={componentChosen} />
<ComponentSelector onComponentChosen={componentChosen}
allowGenerators={false} />
</div>
{:else if modalAction === CLEAR_COMPONENT}
<div class="uk-modal-body">

View File

@ -11,6 +11,7 @@ import { pipe } from "../common/core";
export let onComponentChosen;
export let onGeneratorChosen;
export let allowGenerators;
let derivedComponents=[];
let componentLibraries=[];
@ -77,6 +78,7 @@ store.subscribe(s => {
<div class="library-container">
{#if allowGenerators}
<div class="inner-header">
Generators
</div>
@ -94,6 +96,7 @@ store.subscribe(s => {
</div>
{/each}
{/if}
<div class="inner-header">
Components

View File

@ -58,6 +58,7 @@ const onGeneratorChosen = (g) => {
const onConfirmGenerate = (components) => {
store.createGeneratedComponents(components);
UIkit.modal(generatorOptionsModal).hide();
generator = null;
}
@ -72,7 +73,8 @@ const onConfirmGenerate = (components) => {
<div class="uk-modal-body">
<ComponentSelector onComponentChosen={onComponentChosen}
onGeneratorChosen={onGeneratorChosen} />
onGeneratorChosen={onGeneratorChosen}
allowGenerators={true} />
</div>
</div>
</div>

View File

@ -0,0 +1,16 @@
{
"name": "Yeo button",
"description": "aye so it it",
"inherits": "@budibase/standard-components/button",
"props": {
"background": "red",
"hoverBackground": "blue",
"color": "white",
"border": "solid 5px green",
"hoverBorder": "solid 10px yellow",
"hoverColor": "purple"
},
"tags": [
"button"
]
}

View File

@ -3,9 +3,6 @@
"description": "Header 1",
"inherits": "@budibase/standard-components/text",
"props": {
"font": "29pt"
},
"tags": [
""
]
"font": "20pt"
}
}

View File

@ -1,13 +0,0 @@
{
"name": "common/Prim Button",
"description": "a styled button",
"inherits": "@budibase/standard-components/button",
"props": {
"padding": "5px 7px",
"border": "1px solid #EEE",
"color": "#5F6368",
"background": "##f2f2f2",
"hoverColor": "black",
"hoverBackground": "#cccccc"
}
}

View File

@ -1,13 +0,0 @@
{
"name": "common/Primary Button",
"description": "a styled button",
"inherits": "@budibase/standard-components/button",
"props": {
"padding": "5px 7px",
"border": "1px solid #EEE",
"color": "#5F6368",
"background": "##f2f2f2",
"hoverColor": "black",
"hoverBackground": "#cccccc"
}
}

View File

@ -1,13 +0,0 @@
{
"name": "common/Secondary Button",
"description": "a styled button",
"inherits": "@budibase/standard-components/button",
"props": {
"padding": "5px 7px",
"border": "1px solid #EEE",
"color": "#5F6368",
"background": "##f2f2f2",
"hoverColor": "black",
"hoverBackground": "#cccccc"
}
}

View File

@ -21,11 +21,8 @@
"_component": "@budibase/standard-components/textbox",
"value": {
"##bbstate": "currentcustomer.name",
"##bbstatefallback": "mike",
"##bbsource": "store"
},
"hideValue": false,
"className": "default"
}
}
}
]
@ -76,8 +73,5 @@
}
}
]
},
"tags": [
""
]
}
}

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -23,22 +23,38 @@ let customHoverColorClass;
let customHoverBorderClass;
let customHoverBackClass;
let customClasses = "";
const createClasses = (classes) => {
let all = "";
for(let cls in classes) {
if(classes[cls]) {
all = all + " " + cls;
}
}
return all;
}
$:{
if(_bb && contentComponentContainer && contentComponent._component)
_bb.initialiseComponent(contentComponent, contentComponentContainer);
cssVariables = {
hoverColor, hoverBorder,
hoverBackground
hoverBackground,
background, color, border,
};
buttonStyles = buildStyle({
background, color, border, padding
})
padding
});
customClasses = createClasses({
hoverColor, hoverBorder, hoverBackground,
background, border, color
});
customHoverColorClass = hoverColor ? "customHoverColor" : "";
customHoverBorderClass = hoverBorder ? "customHoverBorder" : "";
customHoverBackClass = hoverBackground ? "customHoverBack" : "";
}
@ -52,7 +68,7 @@ const clickHandler = () => {
<button use:cssVars={cssVariables}
class="{className} {customHoverColorClass} {customHoverBorderClass} {customHoverBackClass}"
class="{className} {customClasses}"
disabled={disabled || false}
on:click={clickHandler}
style={buttonStyles}>
@ -90,15 +106,29 @@ const clickHandler = () => {
border-color: #666;
}
.customHoverBorder:hover {
.border {
border: var(--border);
}
.color {
color: var(--color);
}
.background {
background: var(--background);
}
.hoverBorder:hover {
border: var(--hoverBorder);
}
.customHoverColor:hover {
.hoverColor:hover {
color: var(--hoverColor);
}
.customHoverBack:hover {
.hoverBack:hover {
background: var(--hoverBackground);
}
</style>