tsai
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 3
Code Issues Projects Releases Wiki Activity
Browse Source

Merge branch 'simplified-component-panel' into simplified-component-panel-tabs

pull/4023/head
kevmodrome 7 years ago
parent
c2db1b4d11 7c6f34e07b
commit
00d8139746
8 changed files with 7941 additions and 63 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7563
      package-lock.json
  2. 3
      package.json
  3. 17
      packages/builder/rollup.config.js
  4. 70
      packages/builder/src/components/userInterface/ComponentTab/Item.svelte
  5. 7
      packages/builder/src/components/userInterface/ComponentTab/Tab.svelte
  6. 204
      packages/builder/src/components/userInterface/temporaryPanelStructure.js
  7. 75
      packages/builder/src/components/userInterface/temporaryPanelStructure.json
  8. 65
      yarn.lock

7563
package-lock.json
View File

File diff suppressed because it is too large

3
package.json
View File

@ -2,6 +2,7 @@
"name": "root",
"private": true,
"devDependencies": {
"@rollup/plugin-json": "^4.0.2",
"babel-eslint": "^10.0.3",
"eslint": "^6.8.0",
"eslint-plugin-prettier": "^3.1.2",
@ -17,7 +18,7 @@
"build": "lerna run build",
"initialise": "lerna run initialise",
"publishdev": "lerna run publishdev",
"publishnpm":"yarn build && lerna publish",
"publishnpm": "yarn build && lerna publish",
"clean": "lerna clean",
"dev": "lerna run --parallel --stream dev:builder",
"test": "lerna run test",

17
packages/builder/rollup.config.js
View File

@ -9,6 +9,8 @@ import builtins from "rollup-plugin-node-builtins"
import nodeglobals from "rollup-plugin-node-globals"
import copy from "rollup-plugin-copy"
import replace from "rollup-plugin-replace"
import json from '@rollup/plugin-json';
import path from "path"
@ -133,10 +135,16 @@ export default {
plugins: [
alias({
entries: [
{ find: "components", replacement: path.resolve(projectRootDir, 'src/components') },
{ find: "builderStore", replacement: path.resolve(projectRootDir, 'src/builderStore') }
{
find: "components",
replacement: path.resolve(projectRootDir, "src/components"),
},
{
find: "builderStore",
replacement: path.resolve(projectRootDir, "src/builderStore"),
},
],
customResolver
customResolver,
}),
copy({
targets: [
@ -206,5 +214,6 @@ export default {
// If we're building for production (npm run build
// instead of npm run dev), minify
production && terser(),
json(),
],
}
}

70
packages/builder/src/components/userInterface/ComponentTab/Item.svelte
View File

@ -0,0 +1,70 @@
<script>
export let icon = ""
export let name = ""
export let description = ""
</script>
<div class="component-item">
<div class="component-icon">
<i class={icon} />
</div>
<div class="component-text">
<div class="component-name">{name}</div>
<div class="component-description">
<p>{description}</p>
</div>
</div>
</div>
<style>
.component-item {
display: flex;
flex-direction: row;
padding: 10px 0px 8px 10px;
align-items: center;
cursor: pointer;
}
.component-item:hover {
background: #f5f5f5;
/* background: #fbfbfb; */
border-radius: 5px;
}
.component-icon {
flex: 0 0 40px;
/* background: #efe9e9; */
background: #f1f4fc;
height: 40px;
border-radius: 5px;
display: flex;
justify-content: center;
align-items: center;
}
.component-text {
display: flex;
padding-left: 16px;
padding-top: 8px;
flex-direction: column;
}
.component-name {
font-size: 14px;
font-weight: 500;
}
.component-description {
font-size: 12px;
color: #808192;
}
p {
line-height: 15px;
}
i {
font-size: 28px;
/* color: #808192; */
}
</style>

7
packages/builder/src/components/userInterface/ComponentTab/Tab.svelte
View File

@ -1,5 +1,10 @@
<script>
import Item from "./Item.svelte"
export let components
console.log("Components: ", components)
</script>
{#each components as component}{component.component}{/each}
{#each components as { icon, name, description }}
<Item {icon} {name} {description} />
{/each}

204
packages/builder/src/components/userInterface/temporaryPanelStructure.js
View File

@ -4,34 +4,17 @@ export default {
name: 'Basic',
components: [
{
component: 'Text',
icon: 'Text',
type: [
{
_component: '@budibase/standard-components/header',
name: 'Headline',
icon: 'headline',
props: {
type: {
type: 'options',
options: [
'h1',
'h2'
],
'default': 'h1'
}
}
},
{
_component: '@budibase/standard-components/text',
name: 'Paragraph',
icon: 'paragraph'
}
]
name: 'Container',
description: 'This component contains things within itself',
icon: 'ri-layout-row-fill',
commonProps: {},
type: []
},
{
component: 'Button',
icon: 'Text',
name: 'Text',
description: 'This is a simple text component',
icon: 'ri-t-box-fill',
commonProps: {},
type: [
{
_component: '@budibase/standard-components/header',
@ -51,40 +34,71 @@ export default {
{
_component: '@budibase/standard-components/text',
name: 'Paragraph',
icon: 'paragraph'
icon: 'paragraph',
props: {}
}
]
},
{
name: 'Button',
description: 'A basic html button that is ready for styling',
icon: 'ri-radio-button-fill',
commonProps: {},
type: []
},
{
name: 'Icon',
description: 'A basic component for displaying icons',
icon: 'ri-sun-fill',
commonProps: {},
type: []
},
{
name: 'Avatar',
description: 'A basic component for rendering an avatar',
icon: 'ri-user-smile-fill',
commonProps: {},
type: []
},
{
name: 'Link',
description: 'A basic link component for internal and external links',
icon: 'ri-link',
commonProps: {},
type: []
}
]
},
{
name: 'Form',
components: [
{
component: 'Text',
icon: 'Text',
type: [
{
_component: '@budibase/standard-components/header',
name: 'Headline',
icon: 'headline',
props: {
type: {
type: 'options',
options: [
'h1',
'h2'
],
'default': 'h1'
}
}
},
{
_component: '@budibase/standard-components/text',
name: 'Paragraph',
icon: 'paragraph'
}
]
name: 'Button',
description: 'A basic html button that is ready for styling',
icon: 'ri-radio-button-fill',
commonProps: {},
type: []
},
{
name: 'Icon',
description: 'A basic component for displaying icons',
icon: 'ri-sun-fill',
commonProps: {},
type: []
},
{
name: 'Avatar',
description: 'A basic component for rendering an avatar',
icon: 'ri-user-smile-fill',
commonProps: {},
type: []
},
{
name: 'Link',
description: 'A basic link component for internal and external links',
icon: 'ri-link',
commonProps: {},
type: []
}
]
},
@ -92,8 +106,17 @@ export default {
name: 'Blocks',
components: [
{
component: 'Text',
icon: 'Text',
name: 'Container',
description: 'This component contains things within itself',
icon: 'ri-layout-row-fill',
commonProps: {},
type: []
},
{
name: 'Text',
description: 'This is a simple text component',
icon: 'ri-t-box-fill',
commonProps: {},
type: [
{
_component: '@budibase/standard-components/header',
@ -113,9 +136,38 @@ export default {
{
_component: '@budibase/standard-components/text',
name: 'Paragraph',
icon: 'paragraph'
icon: 'paragraph',
props: {}
}
]
},
{
name: 'Button',
description: 'A basic html button that is ready for styling',
icon: 'ri-radio-button-fill',
commonProps: {},
type: []
},
{
name: 'Icon',
description: 'A basic component for displaying icons',
icon: 'ri-sun-fill',
commonProps: {},
type: []
},
{
name: 'Avatar',
description: 'A basic component for rendering an avatar',
icon: 'ri-user-smile-fill',
commonProps: {},
type: []
},
{
name: 'Link',
description: 'A basic link component for internal and external links',
icon: 'ri-link',
commonProps: {},
type: []
}
]
},
@ -123,8 +175,17 @@ export default {
name: 'Data',
components: [
{
component: 'Text',
icon: 'Text',
name: 'Container',
description: 'This component contains things within itself',
icon: 'ri-layout-row-fill',
commonProps: {},
type: []
},
{
name: 'Text',
description: 'This is a simple text component',
icon: 'ri-t-box-fill',
commonProps: {},
type: [
{
_component: '@budibase/standard-components/header',
@ -144,9 +205,38 @@ export default {
{
_component: '@budibase/standard-components/text',
name: 'Paragraph',
icon: 'paragraph'
icon: 'paragraph',
props: {}
}
]
},
{
name: 'Button',
description: 'A basic html button that is ready for styling',
icon: 'ri-radio-button-fill',
commonProps: {},
type: []
},
{
name: 'Icon',
description: 'A basic component for displaying icons',
icon: 'ri-sun-fill',
commonProps: {},
type: []
},
{
name: 'Avatar',
description: 'A basic component for rendering an avatar',
icon: 'ri-user-smile-fill',
commonProps: {},
type: []
},
{
name: 'Link',
description: 'A basic link component for internal and external links',
icon: 'ri-link',
commonProps: {},
type: []
}
]
},

75
packages/builder/src/components/userInterface/temporaryPanelStructure.json
View File

@ -0,0 +1,75 @@
{
"categories": [
{
"name": "Basic",
"components": [
{
"component": "Container",
"description": "This component contains things within itself",
"icon": "ri-layout-row-fill",
"commonProps": {},
"type": []
},
{
"component": "Text",
"description": "This is a simple text component",
"icon": "ri-t-box-fill",
"commonProps": {
},
"type": [
{
"_component": "@budibase/standard-components/header",
"name": "Headline",
"icon": "headline",
"props": {
"type": {
"type": "options",
"options": [
"h1",
"h2"
],
"default": "h1"
}
}
},
{
"_component": "@budibase/standard-components/text",
"name": "Paragraph",
"icon": "paragraph",
"props": {
}
}
]
},
{
"component": "Button",
"description": "A basic html button that is ready for styling",
"icon": "ri-radio-button-fill",
"commonProps": {},
"type": []
},
{
"component": "Icon",
"description": "A basic component for displaying icons",
"icon": "ri-sun-fill",
"commonProps": {},
"type": []
},
{
"component": "Avatar",
"description": "A basic component for rendering an avatar",
"icon": "ri-user-smile-fill",
"commonProps": {},
"type": []
},
{
"component": "Link",
"description": "A basic link component for internal and external links",
"icon": "ri-link",
"commonProps": {},
"type": []
}
]
}
]
}

65
yarn.lock
View File

@ -918,6 +918,27 @@
dependencies:
"@types/node" ">= 8"
"@rollup/plugin-json@^4.0.2":
version "4.0.2"
resolved "https://registry.yarnpkg.com/@rollup/plugin-json/-/plugin-json-4.0.2.tgz#482185ee36ac7dd21c346e2dbcc22ffed0c6f2d6"
integrity sha512-t4zJMc98BdH42mBuzjhQA7dKh0t4vMJlUka6Fz0c+iO5IVnWaEMiYBy1uBj9ruHZzXBW23IPDGL9oCzBkQ9Udg==
dependencies:
"@rollup/pluginutils" "^3.0.4"
"@rollup/pluginutils@^3.0.4":
version "3.0.9"
resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-3.0.9.tgz#aa6adca2c45e5a1b950103a999e3cddfe49fd775"
integrity sha512-TLZavlfPAZYI7v33wQh4mTP6zojne14yok3DNSLcjoG/Hirxfkonn6icP5rrNWRn8nZsirJBFFpijVOJzkUHDg==
dependencies:
"@types/estree" "0.0.39"
estree-walker "^1.0.1"
micromatch "^4.0.2"
"@types/estree@0.0.39":
version "0.0.39"
resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.39.tgz#e177e699ee1b8c22d23174caaa7422644389509f"
integrity sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==
"@types/node@>= 8":
version "13.5.3"
resolved "https://registry.yarnpkg.com/@types/node/-/node-13.5.3.tgz#37f1f539b7535b9fb4ef77d59db1847a837b7f17"
@ -1216,6 +1237,13 @@ braces@^2.3.1:
split-string "^3.0.2"
to-regex "^3.0.1"
braces@^3.0.1:
version "3.0.2"
resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==
dependencies:
fill-range "^7.0.1"
btoa-lite@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/btoa-lite/-/btoa-lite-1.0.0.tgz#337766da15801210fdd956c22e9c6891ab9d0337"
@ -2065,6 +2093,11 @@ estree-walker@^0.6.1:
resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-0.6.1.tgz#53049143f40c6eb918b23671d1fe3219f3a1b362"
integrity sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w==
estree-walker@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-1.0.1.tgz#31bc5d612c96b704106b477e6dd5d8aa138cb700"
integrity sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==
esutils@^2.0.2:
version "2.0.3"
resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
@ -2222,6 +2255,13 @@ fill-range@^4.0.0:
repeat-string "^1.6.1"
to-regex-range "^2.1.0"
fill-range@^7.0.1:
version "7.0.1"
resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
integrity sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==
dependencies:
to-regex-range "^5.0.1"
find-up@^1.0.0:
version "1.1.2"
resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f"
@ -2930,6 +2970,11 @@ is-number@^3.0.0:
dependencies:
kind-of "^3.0.2"
is-number@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==
is-obj@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-1.0.1.tgz#3e4729ac1f5fde025cd7d83a896dab9f4f67db0f"
@ -3464,6 +3509,14 @@ micromatch@^3.1.10:
snapdragon "^0.8.1"
to-regex "^3.0.2"
micromatch@^4.0.2:
version "4.0.2"
resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.2.tgz#4fcb0999bf9fbc2fcbdd212f6d629b9a56c39259"
integrity sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==
dependencies:
braces "^3.0.1"
picomatch "^2.0.5"
mime-db@1.43.0:
version "1.43.0"
resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.43.0.tgz#0a12e0502650e473d735535050e7c8f4eb4fae58"
@ -4174,6 +4227,11 @@ performance-now@^2.1.0:
resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=
picomatch@^2.0.5:
version "2.2.2"
resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
integrity sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==
pify@^2.0.0, pify@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
@ -5141,6 +5199,13 @@ to-regex-range@^2.1.0:
is-number "^3.0.0"
repeat-string "^1.6.1"
to-regex-range@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4"
integrity sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==
dependencies:
is-number "^7.0.0"
to-regex@^3.0.1, to-regex@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/to-regex/-/to-regex-3.0.2.tgz#13cfdd9b336552f30b51f33a8ae1b42a7a7599ce"

Write Preview
Loading…
Cancel
Save