ufkc7e3d
/
budibase
forked from tsai/budibase
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge pull request #584 from Budibase/removing-uikit-06 

Removing UI kit uk-input, uk-toggle, uk-spinner
master
Tori Sloan 6 years ago
committed by GitHub
parent
cfacb8fca0 229b05f47a
commit
b067eee80a
19 changed files with 57 additions and 138 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      packages/builder/package.json
  2. 15
      packages/builder/src/budibase.css
  3. 1
      packages/builder/src/components/common/ConfirmDialog.svelte
  4. 2
      packages/builder/src/components/common/ErrorsBox.svelte
  5. 59
      packages/builder/src/components/common/IconButton.svelte
  6. 4
      packages/builder/src/components/common/Spinner.svelte
  7. 80
      packages/builder/src/components/userInterface/ComponentDropdownMenu.svelte
  8. 1
      packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte
  9. 1
      packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte
  10. 1
      packages/builder/src/components/userInterface/EventsEditor/EventsEditor.svelte
  11. 1
      packages/builder/src/components/userInterface/EventsEditor/HandlerSelector.svelte
  12. 1
      packages/builder/src/components/userInterface/EventsEditor/StateBindingCascader.svelte
  13. 1
      packages/builder/src/components/userInterface/ScreenDropdownMenu.svelte
  14. 1
      packages/builder/src/components/userInterface/UserInterfaceRoot.svelte
  15. 1
      packages/builder/src/index.html
  16. 4
      packages/builder/src/pages/[application]/_reset.svelte
  17. 1
      packages/builder/src/pages/[application]/frontend/_layout.svelte
  18. 1
      packages/builder/src/pages/index.svelte
  19. 18
      packages/builder/yarn.lock

2
packages/builder/package.json
View File

@ -78,9 +78,9 @@
"mustache": "^4.0.1", "mustache": "^4.0.1",
"posthog-js": "1.3.1", "posthog-js": "1.3.1",
"shortid": "^2.2.15", "shortid": "^2.2.15",
"svelte-loading-spinners": "^0.1.1",
"svelte-portal": "^0.1.0", "svelte-portal": "^0.1.0",
"svelte-simple-modal": "^0.4.2", "svelte-simple-modal": "^0.4.2",
"uikit": "^3.1.7",
"yup": "^0.29.2" "yup": "^0.29.2"
}, },
"devDependencies": { "devDependencies": {

15
packages/builder/src/budibase.css
View File

@ -85,11 +85,6 @@
box-sizing: border-box; box-sizing: border-box;
} }
.uk-text-right {
display: flex;
justify-content: flex-start;
}
.preview-pane { .preview-pane {
grid-column: 2; grid-column: 2;
margin: 80px 60px; margin: 80px 60px;
@ -154,3 +149,13 @@
.bb-table td > :last-child { margin-bottom: 0; } .bb-table td > :last-child { margin-bottom: 0; }
.bb__alert {
position: relative;
margin-bottom: var(--spacing-m);
padding: var(--spacing-l);
}
.bb__alert--danger {
background: #fef4f6;
color: #f0506e;
}

1
packages/builder/src/components/common/ConfirmDialog.svelte
View File

@ -1,5 +1,4 @@
<script> <script>
import UIkit from "uikit"
import { Modal, Button, Heading, Spacer } from "@budibase/bbui" import { Modal, Button, Heading, Spacer } from "@budibase/bbui"
export let title = "" export let title = ""

2
packages/builder/src/components/common/ErrorsBox.svelte
View File

@ -5,7 +5,7 @@
</script> </script>
{#if hasErrors} {#if hasErrors}
<div uk-alert class="uk-alert-danger"> <div class="bb__alert bb__alert--danger">
{#each errors as error} {#each errors as error}
<div>{error.dataPath} {error.message}</div> <div>{error.dataPath} {error.message}</div>
{/each} {/each}

59
packages/builder/src/components/common/IconButton.svelte
View File

@ -1,59 +0,0 @@
<script>
import getIcon from "./icon"
export let size = 18
export let icon = ""
export let style = ""
export let color = "var(--ink)"
export let hoverColor = "var(--secondary75)"
export let attributes = {}
let currentAttributes = []
const addAttributes = (node, attributes) => {
const add = _attributes => {
const attrs = []
for (let attr in _attributes) {
node.setAttribute(attr, _attributes[attr])
attrs.push("uk-toggle")
}
currentAttributes = attrs
}
add(attributes)
return {
// should implement update method
update(attributes) {
for (let attr of currentAttributes) {
node.removeAttribute(attr)
}
add(attributes)
},
destroy() {},
}
}
</script>
<button
style="{style}{style ? ';' : ''} color:{color}; --hovercolor:{hoverColor}"
on:click
use:addAttributes={attributes}>
{@html getIcon(icon, size)}
</button>
<style>
button {
border-style: none;
background-color: rgba(0, 0, 0, 0);
cursor: pointer;
outline: none;
}
button:hover {
color: var(--hovercolor);
}
button:active {
outline: none;
}
</style>

4
packages/builder/src/components/common/Spinner.svelte
View File

@ -1,5 +1,5 @@
<script> <script>
export let ratio = "4.5" import { Circle } from "svelte-loading-spinners"
</script> </script>
<span uk-spinner={`ratio: ${ratio}`} /> <Circle size="60" color="#000000" unit="px" />

80
packages/builder/src/components/userInterface/ComponentDropdownMenu.svelte
View File

@ -4,7 +4,6 @@
import { getComponentDefinition } from "builderStore/storeUtils" import { getComponentDefinition } from "builderStore/storeUtils"
import ConfirmDialog from "components/common/ConfirmDialog.svelte" import ConfirmDialog from "components/common/ConfirmDialog.svelte"
import { last, cloneDeep } from "lodash/fp" import { last, cloneDeep } from "lodash/fp"
import UIkit from "uikit"
import { import {
selectComponent, selectComponent,
getParent, getParent,
@ -13,20 +12,14 @@
regenerateCssForCurrentScreen, regenerateCssForCurrentScreen,
} from "builderStore/storeUtils" } from "builderStore/storeUtils"
import { uuid } from "builderStore/uuid" import { uuid } from "builderStore/uuid"
import { DropdownMenu } from "@budibase/bbui"
export let component export let component
let confirmDeleteDialog let confirmDeleteDialog
let dropdownEl let dropdown
let anchor
$: dropdown = UIkit.dropdown(dropdownEl, {
mode: "click",
offset: 0,
pos: "bottom-right",
"delay-hide": 0,
animation: false,
})
$: dropdown && UIkit.util.on(dropdown, "shown", () => (hidden = false))
$: noChildrenAllowed = $: noChildrenAllowed =
!component || !getComponentDefinition($store, component._component).children !component || !getComponentDefinition($store, component._component).children
$: noPaste = !$store.componentToPaste $: noPaste = !$store.componentToPaste
@ -115,11 +108,19 @@
} }
</script> </script>
<div class="root boundary" on:click|stopPropagation={() => {}}> <div bind:this={anchor} on:click|stopPropagation={() => {}}>
<button> <button on:click={dropdown.show}>
<MoreIcon /> <MoreIcon />
</button> </button>
<ul class="menu" bind:this={dropdownEl} on:click={hideDropdown}> </div>
<DropdownMenu
class="menu"
bind:this={dropdown}
on:click={hideDropdown}
width="170px"
{anchor}
align="left">
<ul>
<li class="item" on:click={() => confirmDeleteDialog.show()}> <li class="item" on:click={() => confirmDeleteDialog.show()}>
<i class="icon ri-delete-bin-2-line" /> <i class="icon ri-delete-bin-2-line" />
Delete Delete
@ -167,7 +168,7 @@
Paste inside Paste inside
</li> </li>
</ul> </ul>
</div> </DropdownMenu>
<ConfirmDialog <ConfirmDialog
bind:this={confirmDeleteDialog} bind:this={confirmDeleteDialog}
@ -177,36 +178,29 @@
onOk={deleteComponent} /> onOk={deleteComponent} />
<style> <style>
.root { ul {
overflow: hidden; list-style: none;
z-index: 9; padding: 0;
margin: 0;
} }
.root button { li {
border-style: none; display: flex;
border-radius: 2px; font-family: var(--font-sans);
padding: 5px; font-size: var(--font-size-xs);
background: transparent;
cursor: pointer;
color: var(--ink); color: var(--ink);
outline: none; padding: var(--spacing-s) var(--spacing-m);
margin: auto 0px;
align-items: center;
cursor: pointer;
} }
.menu { li:hover {
z-index: 100000; background-color: var(--grey-2);
overflow: visible;
padding: 12px 0px;
border-radius: 5px;
} }
.menu li { li:active {
border-style: none; color: var(--blue);
background-color: transparent;
list-style-type: none;
padding: 4px 16px;
margin: 0;
width: 100%;
box-sizing: border-box;
} }
.item { .item {
@ -219,16 +213,6 @@
margin-right: 8px; margin-right: 8px;
} }
.menu li:not(.disabled) {
cursor: pointer;
color: var(--grey-7);
}
.menu li:not(.disabled):hover {
color: var(--ink);
background-color: var(--grey-1);
}
.disabled { .disabled {
color: var(--grey-4); color: var(--grey-4);
cursor: default; cursor: default;

1
packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte
View File

@ -2,7 +2,6 @@
import { setContext, onMount } from "svelte" import { setContext, onMount } from "svelte"
import { store } from "builderStore" import { store } from "builderStore"
import IconButton from "components/common/IconButton.svelte"
import { import {
LayoutIcon, LayoutIcon,
PaintIcon, PaintIcon,

1
packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte
View File

@ -2,7 +2,6 @@
import { store } from "builderStore" import { store } from "builderStore"
import { Button, Select } from "@budibase/bbui" import { Button, Select } from "@budibase/bbui"
import HandlerSelector from "./HandlerSelector.svelte" import HandlerSelector from "./HandlerSelector.svelte"
import IconButton from "../../common/IconButton.svelte"
import ActionButton from "../../common/ActionButton.svelte" import ActionButton from "../../common/ActionButton.svelte"
import getIcon from "../../common/icon" import getIcon from "../../common/icon"
import { CloseIcon } from "components/common/Icons/" import { CloseIcon } from "components/common/Icons/"

1
packages/builder/src/components/userInterface/EventsEditor/EventsEditor.svelte
View File

@ -13,7 +13,6 @@
} from "lodash/fp" } from "lodash/fp"
import { pipe } from "components/common/core" import { pipe } from "components/common/core"
import Checkbox from "components/common/Checkbox.svelte" import Checkbox from "components/common/Checkbox.svelte"
import IconButton from "components/common/IconButton.svelte"
import EventEditorModal from "./EventEditorModal.svelte" import EventEditorModal from "./EventEditorModal.svelte"
import { PencilIcon } from "components/common/Icons" import { PencilIcon } from "components/common/Icons"

1
packages/builder/src/components/userInterface/EventsEditor/HandlerSelector.svelte
View File

@ -1,6 +1,5 @@
<script> <script>
import { Button, Select } from "@budibase/bbui" import { Button, Select } from "@budibase/bbui"
import IconButton from "components/common/IconButton.svelte"
import StateBindingCascader from "./StateBindingCascader.svelte" import StateBindingCascader from "./StateBindingCascader.svelte"
import { find, map, keys, reduce, keyBy } from "lodash/fp" import { find, map, keys, reduce, keyBy } from "lodash/fp"
import { pipe } from "components/common/core" import { pipe } from "components/common/core"

1
packages/builder/src/components/userInterface/EventsEditor/StateBindingCascader.svelte
View File

@ -1,6 +1,5 @@
<script> <script>
import { Input, Select } from "@budibase/bbui" import { Input, Select } from "@budibase/bbui"
import IconButton from "components/common/IconButton.svelte"
import { find, map, keys, reduce, keyBy } from "lodash/fp" import { find, map, keys, reduce, keyBy } from "lodash/fp"
import { pipe } from "components/common/core" import { pipe } from "components/common/core"
import { EVENT_TYPE_MEMBER_NAME } from "components/common/eventHandlers" import { EVENT_TYPE_MEMBER_NAME } from "components/common/eventHandlers"

1
packages/builder/src/components/userInterface/ScreenDropdownMenu.svelte
View File

@ -2,7 +2,6 @@
import { MoreIcon } from "components/common/Icons" import { MoreIcon } from "components/common/Icons"
import { store } from "builderStore" import { store } from "builderStore"
import ConfirmDialog from "components/common/ConfirmDialog.svelte" import ConfirmDialog from "components/common/ConfirmDialog.svelte"
import UIkit from "uikit"
import api from "builderStore/api" import api from "builderStore/api"
import Portal from "svelte-portal" import Portal from "svelte-portal"
import { DropdownMenu } from "@budibase/bbui" import { DropdownMenu } from "@budibase/bbui"

1
packages/builder/src/components/userInterface/UserInterfaceRoot.svelte
View File

@ -4,7 +4,6 @@
import PageLayout from "./PageLayout.svelte" import PageLayout from "./PageLayout.svelte"
import PagesList from "./PagesList.svelte" import PagesList from "./PagesList.svelte"
import { store } from "builderStore" import { store } from "builderStore"
import IconButton from "components/common/IconButton.svelte"
import NewScreen from "./NewScreen.svelte" import NewScreen from "./NewScreen.svelte"
import CurrentItemPreview from "./CurrentItemPreview.svelte" import CurrentItemPreview from "./CurrentItemPreview.svelte"
import SettingsView from "./SettingsView.svelte" import SettingsView from "./SettingsView.svelte"

1
packages/builder/src/index.html
View File

@ -15,7 +15,6 @@
<link rel='stylesheet' href='/_builder/bundle.css'> <link rel='stylesheet' href='/_builder/bundle.css'>
<link rel='stylesheet' href='/_builder/bbui.css'> <link rel='stylesheet' href='/_builder/bbui.css'>
<link rel='stylesheet' href='/_builder/fonts.css'> <link rel='stylesheet' href='/_builder/fonts.css'>
<link rel='stylesheet' href="/_builder/uikit.min.css">
</head> </head>

4
packages/builder/src/pages/[application]/_reset.svelte
View File

@ -8,7 +8,6 @@
import { isActive, goto, layout, url } from "@sveltech/routify" import { isActive, goto, layout, url } from "@sveltech/routify"
import { SettingsIcon, PreviewIcon } from "components/common/Icons/" import { SettingsIcon, PreviewIcon } from "components/common/Icons/"
import IconButton from "components/common/IconButton.svelte"
// Get Package and set store // Get Package and set store
export let application export let application
@ -69,9 +68,6 @@
{title} {title}
</span> </span>
{/each} {/each}
<!-- <IconButton icon="home"
color="var(--grey-2)"
hoverColor="var(--secondary75)"/> -->
</div> </div>
<div class="toprightnav"> <div class="toprightnav">
<SettingsLink /> <SettingsLink />

1
packages/builder/src/pages/[application]/frontend/_layout.svelte
View File

@ -3,7 +3,6 @@
import { goto } from "@sveltech/routify" import { goto } from "@sveltech/routify"
import { onMount } from "svelte" import { onMount } from "svelte"
import ComponentsHierarchyChildren from "components/userInterface/ComponentsHierarchyChildren.svelte" import ComponentsHierarchyChildren from "components/userInterface/ComponentsHierarchyChildren.svelte"
import IconButton from "components/common/IconButton.svelte"
import CurrentItemPreview from "components/userInterface/AppPreview" import CurrentItemPreview from "components/userInterface/AppPreview"
import ComponentPropertiesPanel from "components/userInterface/ComponentPropertiesPanel.svelte" import ComponentPropertiesPanel from "components/userInterface/ComponentPropertiesPanel.svelte"
import ComponentSelectionList from "components/userInterface/ComponentSelectionList.svelte" import ComponentSelectionList from "components/userInterface/ComponentSelectionList.svelte"

1
packages/builder/src/pages/index.svelte
View File

@ -5,7 +5,6 @@
import AppList from "components/start/AppList.svelte" import AppList from "components/start/AppList.svelte"
import { onMount } from "svelte" import { onMount } from "svelte"
import ActionButton from "components/common/ActionButton.svelte" import ActionButton from "components/common/ActionButton.svelte"
import IconButton from "components/common/IconButton.svelte"
import { get } from "builderStore/api" import { get } from "builderStore/api"
import Spinner from "components/common/Spinner.svelte" import Spinner from "components/common/Spinner.svelte"
import CreateAppModal from "components/start/CreateAppModal.svelte" import CreateAppModal from "components/start/CreateAppModal.svelte"

18
packages/builder/yarn.lock
View File

@ -688,9 +688,10 @@
lodash "^4.17.13" lodash "^4.17.13"
to-fast-properties "^2.0.0" to-fast-properties "^2.0.0"
"@budibase/bbui@^1.29.1": "@budibase/bbui@^1.29.3":
version "1.29.1" version "1.29.3"
resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.29.1.tgz#edaa6c7ce43a71d94460f7a3669ade1d4523333e" resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.29.3.tgz#02d84d5e0f9ca936d62b1e0e9bc943711d124f7a"
integrity sha512-X5QBZX2CNccRiW6fbj6/fnUYhlilc6I6ae0QT8oIuv9DozDnUUbdd6j4RMxW1DQBZuvWH54OGq4nwkq9f37hKg==
dependencies: dependencies:
sirv-cli "^0.4.6" sirv-cli "^0.4.6"
@ -2857,6 +2858,7 @@ for-in@^1.0.2:
foreach@~2.0.1: foreach@~2.0.1:
version "2.0.5" version "2.0.5"
resolved "https://registry.yarnpkg.com/foreach/-/foreach-2.0.5.tgz#0bee005018aeb260d0a3af3ae658dd0136ec1b99" resolved "https://registry.yarnpkg.com/foreach/-/foreach-2.0.5.tgz#0bee005018aeb260d0a3af3ae658dd0136ec1b99"
integrity sha1-C+4AUBiusmDQo6865ljdATbsG5k=
forever-agent@~0.6.1: forever-agent@~0.6.1:
version "0.6.1" version "0.6.1"
@ -5439,6 +5441,7 @@ shellwords@^0.1.1:
shortid@^2.2.15: shortid@^2.2.15:
version "2.2.15" version "2.2.15"
resolved "https://registry.yarnpkg.com/shortid/-/shortid-2.2.15.tgz#2b902eaa93a69b11120373cd42a1f1fe4437c122" resolved "https://registry.yarnpkg.com/shortid/-/shortid-2.2.15.tgz#2b902eaa93a69b11120373cd42a1f1fe4437c122"
integrity sha512-5EaCy2mx2Jgc/Fdn9uuDuNIIfWBpzY4XIlhoqtXF6qsf+/+SGZ+FxDdX/ZsMZiWupIWNqAEmiNY4RC+LSmCeOw==
dependencies: dependencies:
nanoid "^2.1.0" nanoid "^2.1.0"
@ -5784,6 +5787,11 @@ svelte-jester@^1.0.6:
dependencies: dependencies:
cosmiconfig "^6.0.0" cosmiconfig "^6.0.0"
svelte-loading-spinners@^0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/svelte-loading-spinners/-/svelte-loading-spinners-0.1.1.tgz#a35a811b7db0389ec2a5de6904c718c58c36e1f9"
integrity sha512-or4zs10VOdczOJo3u25IINXQOkZbLNAxMrXK0PRbzVoJtPQq/QZPNxI32383bpe+soYcEKmESbmW+JlW3MbUKQ==
svelte-portal@^0.1.0: svelte-portal@^0.1.0:
version "0.1.0" version "0.1.0"
resolved "https://registry.yarnpkg.com/svelte-portal/-/svelte-portal-0.1.0.tgz#cc2821cc84b05ed5814e0218dcdfcbebc53c1742" resolved "https://registry.yarnpkg.com/svelte-portal/-/svelte-portal-0.1.0.tgz#cc2821cc84b05ed5814e0218dcdfcbebc53c1742"
@ -5942,10 +5950,6 @@ typedarray@^0.0.6:
version "0.0.6" version "0.0.6"
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
uikit@^3.1.7:
version "3.4.6"
resolved "https://registry.yarnpkg.com/uikit/-/uikit-3.4.6.tgz#39d59620aeb42d53ba905a67e99e2015d4aaaf9c"
unicode-canonical-property-names-ecmascript@^1.0.4: unicode-canonical-property-names-ecmascript@^1.0.4:
version "1.0.4" version "1.0.4"
resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818" resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818"

Write Preview
Loading…
Cancel
Save