Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@budibase/bootstrap-components
Advanced tools
@budibase/bootstrap-components - npm Package Compare versions
Comparing version 0.0.16 to 0.0.17
| { | ||
| "_lib": "./dist/index.js", | ||
| "_generators": { | ||
| "_lib": "./dist/generators.js", | ||
| "app": { | ||
| "name": "App", | ||
| "description": "Generate app based on your backend" | ||
| }, | ||
| "forms": { | ||
| "name": "Forms", | ||
| "description": "Generate forms, based on your records" | ||
| }, | ||
| "indexTables": { | ||
| "name": "Index Tables", | ||
| "description": "Generate a table based on an index" | ||
| }, | ||
| "recordHomepages": { | ||
| "name": "Record Homepage", | ||
| "description": "Generates a 'homepage' based on your record types, including a create/edit form. Selecting a nav item will display a root content" | ||
| } | ||
| }, | ||
| "form" : { | ||
@@ -23,0 +4,0 @@ "importPath": "Form", |
@@ -7,3 +7,3 @@ { | ||
| "scripts": { | ||
| "build": "rollup -c && rollup -c rollup.generatorsconfig.js", | ||
| "build": "rollup -c", | ||
| "prepublishOnly": "npm run build", | ||
@@ -16,3 +16,3 @@ "testbuild": "rollup -w -c rollup.testconfig.js", | ||
| "devDependencies": { | ||
| "@budibase/client": "^0.0.16", | ||
| "@budibase/client": "^0.0.17", | ||
| "fs-extra": "^8.1.0", | ||
@@ -35,5 +35,5 @@ "lodash": "^4.17.15", | ||
| ], | ||
| "version": "0.0.16", | ||
| "version": "0.0.17", | ||
| "license": "MIT", | ||
| "gitHead": "115189f72a850bfb52b65ec61d932531bf327072" | ||
| "gitHead": "f3dd412e7488b5e15a7e2a9112300ad09fd973fb" | ||
| } |
@@ -1,1 +0,103 @@ | ||
| window['##BUDIBASE_APPDEFINITION##'] = {"hierarchy":{"name":"root","type":"root","children":[{"name":"customer","type":"record","fields":[{"name":"name","type":"string","typeOptions":{"maxLength":1000,"values":null,"allowDeclaredValuesOnly":false},"label":"name","getInitialValue":"default","getUndefinedValue":"default"}],"children":[{"name":"invoiceyooo","type":"record","fields":[{"name":"amount","type":"number","typeOptions":{"minValue":99999999999,"maxValue":99999999999,"decimalPlaces":2},"label":"amount","getInitialValue":"default","getUndefinedValue":"default"}],"children":[],"validationRules":[],"nodeId":2,"indexes":[],"allidsShardFactor":1,"collectionName":"invoices","isSingle":false}],"validationRules":[],"nodeId":1,"indexes":[{"name":"customer_invoices","type":"index","map":"return {...record};","filter":"","indexType":"ancestor","getShardName":"","getSortKey":"record.id","aggregateGroups":[],"allowedRecordNodeIds":[2],"nodeId":5}],"allidsShardFactor":64,"collectionName":"customers","isSingle":false}],"pathMaps":[],"indexes":[{"name":"Yeo index","type":"index","map":"return {...record};","filter":"","indexType":"ancestor","getShardName":"","getSortKey":"record.id","aggregateGroups":[],"allowedRecordNodeIds":[1],"nodeId":4},{"name":"everyones_invoices","type":"index","map":"return {...record};","filter":"","indexType":"ancestor","getShardName":"","getSortKey":"record.id","aggregateGroups":[],"allowedRecordNodeIds":[2],"nodeId":6}],"nodeId":0},"componentLibraries":["budibase-standard-components"],"appRootPath":"/testApp2","props":{}} | ||
| window["##BUDIBASE_APPDEFINITION##"] = { | ||
| hierarchy: { | ||
| name: "root", | ||
| type: "root", | ||
| children: [ | ||
| { | ||
| name: "customer", | ||
| type: "record", | ||
| fields: [ | ||
| { | ||
| name: "name", | ||
| type: "string", | ||
| typeOptions: { | ||
| maxLength: 1000, | ||
| values: null, | ||
| allowDeclaredValuesOnly: false, | ||
| }, | ||
| label: "name", | ||
| getInitialValue: "default", | ||
| getUndefinedValue: "default", | ||
| }, | ||
| ], | ||
| children: [ | ||
| { | ||
| name: "invoiceyooo", | ||
| type: "record", | ||
| fields: [ | ||
| { | ||
| name: "amount", | ||
| type: "number", | ||
| typeOptions: { | ||
| minValue: 99999999999, | ||
| maxValue: 99999999999, | ||
| decimalPlaces: 2, | ||
| }, | ||
| label: "amount", | ||
| getInitialValue: "default", | ||
| getUndefinedValue: "default", | ||
| }, | ||
| ], | ||
| children: [], | ||
| validationRules: [], | ||
| nodeId: 2, | ||
| indexes: [], | ||
| allidsShardFactor: 1, | ||
| collectionName: "invoices", | ||
| isSingle: false, | ||
| }, | ||
| ], | ||
| validationRules: [], | ||
| nodeId: 1, | ||
| indexes: [ | ||
| { | ||
| name: "customer_invoices", | ||
| type: "index", | ||
| map: "return {...record};", | ||
| filter: "", | ||
| indexType: "ancestor", | ||
| getShardName: "", | ||
| getSortKey: "record.id", | ||
| aggregateGroups: [], | ||
| allowedRecordNodeIds: [2], | ||
| nodeId: 5, | ||
| }, | ||
| ], | ||
| allidsShardFactor: 64, | ||
| collectionName: "customers", | ||
| isSingle: false, | ||
| }, | ||
| ], | ||
| pathMaps: [], | ||
| indexes: [ | ||
| { | ||
| name: "Yeo index", | ||
| type: "index", | ||
| map: "return {...record};", | ||
| filter: "", | ||
| indexType: "ancestor", | ||
| getShardName: "", | ||
| getSortKey: "record.id", | ||
| aggregateGroups: [], | ||
| allowedRecordNodeIds: [1], | ||
| nodeId: 4, | ||
| }, | ||
| { | ||
| name: "everyones_invoices", | ||
| type: "index", | ||
| map: "return {...record};", | ||
| filter: "", | ||
| indexType: "ancestor", | ||
| getShardName: "", | ||
| getSortKey: "record.id", | ||
| aggregateGroups: [], | ||
| allowedRecordNodeIds: [2], | ||
| nodeId: 6, | ||
| }, | ||
| ], | ||
| nodeId: 0, | ||
| }, | ||
| componentLibraries: ["budibase-standard-components"], | ||
| appRootPath: "/testApp2", | ||
| props: {}, | ||
| } |
@@ -1,20 +0,20 @@ | ||
| import svelte from 'rollup-plugin-svelte'; | ||
| import resolve from 'rollup-plugin-node-resolve'; | ||
| import svelte from "rollup-plugin-svelte" | ||
| import resolve from "rollup-plugin-node-resolve" | ||
| export default { | ||
| input: 'src/index.js', | ||
| output: [ | ||
| { | ||
| file: "dist/index.js", | ||
| format: 'esm', | ||
| name:"budibaseStandardComponents", | ||
| sourcemap: "inline" | ||
| } | ||
| ], | ||
| plugins: [ | ||
| svelte({ | ||
| hydratable:true | ||
| }), | ||
| resolve() | ||
| ] | ||
| }; | ||
| input: "src/index.js", | ||
| output: [ | ||
| { | ||
| file: "dist/index.js", | ||
| format: "esm", | ||
| name: "budibaseStandardComponents", | ||
| sourcemap: "inline", | ||
| }, | ||
| ], | ||
| plugins: [ | ||
| svelte({ | ||
| hydratable: true, | ||
| }), | ||
| resolve(), | ||
| ], | ||
| } |
@@ -1,89 +0,131 @@ | ||
| import svelte from 'rollup-plugin-svelte'; | ||
| import resolve from 'rollup-plugin-node-resolve'; | ||
| import commonjs from 'rollup-plugin-commonjs'; | ||
| import livereload from 'rollup-plugin-livereload'; | ||
| import { terser } from 'rollup-plugin-terser'; | ||
| import json from 'rollup-plugin-json'; | ||
| import svelte from "rollup-plugin-svelte" | ||
| import resolve from "rollup-plugin-node-resolve" | ||
| import commonjs from "rollup-plugin-commonjs" | ||
| import livereload from "rollup-plugin-livereload" | ||
| import { terser } from "rollup-plugin-terser" | ||
| import json from "rollup-plugin-json" | ||
| const production = !process.env.ROLLUP_WATCH; | ||
| const production = !process.env.ROLLUP_WATCH | ||
| const lodash_fp_exports = [ | ||
| "find", "isUndefined", "split", | ||
| "last", "union", "reduce", "isObject", | ||
| "cloneDeep", "some", "isArray", "map", | ||
| "filter", "keys", "isFunction", "isEmpty", | ||
| "countBy", "join", "includes", "flatten", | ||
| "constant", "first", "intersection", "take", | ||
| "has", "mapValues", "isString", "isBoolean", | ||
| "isNull", "isNumber", "isObjectLike", "isDate", | ||
| "clone", "values", "keyBy", "isNaN", | ||
| "isInteger", "toNumber"]; | ||
| "find", | ||
| "isUndefined", | ||
| "split", | ||
| "last", | ||
| "union", | ||
| "reduce", | ||
| "isObject", | ||
| "cloneDeep", | ||
| "some", | ||
| "isArray", | ||
| "map", | ||
| "filter", | ||
| "keys", | ||
| "isFunction", | ||
| "isEmpty", | ||
| "countBy", | ||
| "join", | ||
| "includes", | ||
| "flatten", | ||
| "constant", | ||
| "first", | ||
| "intersection", | ||
| "take", | ||
| "has", | ||
| "mapValues", | ||
| "isString", | ||
| "isBoolean", | ||
| "isNull", | ||
| "isNumber", | ||
| "isObjectLike", | ||
| "isDate", | ||
| "clone", | ||
| "values", | ||
| "keyBy", | ||
| "isNaN", | ||
| "isInteger", | ||
| "toNumber", | ||
| ] | ||
| const lodash_exports = [ | ||
| "flow", "head", | ||
| "tail", "findIndex", "startsWith", | ||
| "dropRight", "takeRight", | ||
| "trim", "split", "replace", | ||
| "merge", "assign"]; | ||
| "flow", | ||
| "head", | ||
| "tail", | ||
| "findIndex", | ||
| "startsWith", | ||
| "dropRight", | ||
| "takeRight", | ||
| "trim", | ||
| "split", | ||
| "replace", | ||
| "merge", | ||
| "assign", | ||
| ] | ||
| const coreExternal = [ | ||
| "lodash", "lodash/fp", "date-fns", | ||
| "lunr", "safe-buffer", "shortid", | ||
| "@nx-js/compiler-util" | ||
| ]; | ||
| "lodash", | ||
| "lodash/fp", | ||
| "date-fns", | ||
| "lunr", | ||
| "safe-buffer", | ||
| "shortid", | ||
| "@nx-js/compiler-util", | ||
| ] | ||
| export default { | ||
| input: 'src/Test/testMain.js', | ||
| output: { | ||
| sourcemap: true, | ||
| format: 'iife', | ||
| name: 'app', | ||
| file: 'public/bundle.js' | ||
| }, | ||
| plugins: [ | ||
| svelte({ | ||
| // enable run-time checks when not in production | ||
| dev: !production, | ||
| // we'll extract any component CSS out into | ||
| // a separate file — better for performance | ||
| css: css => { | ||
| css.write('public/bundle.css'); | ||
| }, | ||
| hydratable:true | ||
| }), | ||
| input: "src/Test/testMain.js", | ||
| output: { | ||
| sourcemap: true, | ||
| format: "iife", | ||
| name: "app", | ||
| file: "public/bundle.js", | ||
| }, | ||
| plugins: [ | ||
| svelte({ | ||
| // enable run-time checks when not in production | ||
| dev: !production, | ||
| // we'll extract any component CSS out into | ||
| // a separate file — better for performance | ||
| css: css => { | ||
| css.write("public/bundle.css") | ||
| }, | ||
| // If you have external dependencies installed from | ||
| // npm, you'll most likely need these plugins. In | ||
| // some cases you'll need additional configuration — | ||
| // consult the documentation for details: | ||
| // https://github.com/rollup/rollup-plugin-commonjs | ||
| resolve({ | ||
| browser: true, | ||
| dedupe: importee => { | ||
| return importee === 'svelte' | ||
| || importee.startsWith('svelte/') | ||
| || coreExternal.includes(importee); | ||
| } | ||
| }), | ||
| commonjs({ | ||
| namedExports: { | ||
| "lodash/fp": lodash_fp_exports, | ||
| "lodash":lodash_exports, | ||
| "shortid": ["generate"] | ||
| } | ||
| }), | ||
| json(), | ||
| hydratable: true, | ||
| }), | ||
| // Watch the `public` directory and refresh the | ||
| // browser on changes when not in production | ||
| !production && livereload('public'), | ||
| // If you have external dependencies installed from | ||
| // npm, you'll most likely need these plugins. In | ||
| // some cases you'll need additional configuration — | ||
| // consult the documentation for details: | ||
| // https://github.com/rollup/rollup-plugin-commonjs | ||
| resolve({ | ||
| browser: true, | ||
| dedupe: importee => { | ||
| return ( | ||
| importee === "svelte" || | ||
| importee.startsWith("svelte/") || | ||
| coreExternal.includes(importee) | ||
| ) | ||
| }, | ||
| }), | ||
| commonjs({ | ||
| namedExports: { | ||
| "lodash/fp": lodash_fp_exports, | ||
| lodash: lodash_exports, | ||
| shortid: ["generate"], | ||
| }, | ||
| }), | ||
| json(), | ||
| // If we're building for production (npm run build | ||
| // instead of npm run dev), minify | ||
| production && terser() | ||
| ], | ||
| watch: { | ||
| clearScreen: false | ||
| } | ||
| }; | ||
| // Watch the `public` directory and refresh the | ||
| // browser on changes when not in production | ||
| !production && livereload("public"), | ||
| // If we're building for production (npm run build | ||
| // instead of npm run dev), minify | ||
| production && terser(), | ||
| ], | ||
| watch: { | ||
| clearScreen: false, | ||
| }, | ||
| } |
@@ -1,61 +0,86 @@ | ||
| const { readdir, stat, copyFile } = require("fs-extra"); | ||
| const { constants } = require("fs"); | ||
| const { join, basename } = require("path"); | ||
| const { readdir, stat, copyFile } = require("fs-extra") | ||
| const { constants } = require("fs") | ||
| const { join, basename } = require("path") | ||
| const packagesFolder = ".."; | ||
| const packagesFolder = ".." | ||
| const jsFile = dir => join(dir, "index.js"); | ||
| const generatorsFile = dir => join(dir, "generators.js"); | ||
| const jsMapFile = dir => join(dir, "index.js.map"); | ||
| const sourceJs = jsFile("dist"); | ||
| const sourceJsMap = jsMapFile("dist"); | ||
| const componentsFile = "components.json"; | ||
| const sourceGenerators = generatorsFile("dist"); | ||
| const jsFile = dir => join(dir, "index.js") | ||
| const jsMapFile = dir => join(dir, "index.js.map") | ||
| const sourceJs = jsFile("dist") | ||
| const sourceJsMap = jsMapFile("dist") | ||
| const componentsFile = "components.json" | ||
| const appPackages = join(packagesFolder, "server", "appPackages"); | ||
| const appPackages = join(packagesFolder, "server", "appPackages") | ||
| const publicMain = appName => join(appPackages, appName, "public", "main", "lib", "node_modules", "@budibase", "bootstrap-components"); | ||
| const publicUnauth = appName => join(appPackages, appName, "public", "unauthenticated", "lib", "node_modules", "@budibase", "bootstrap-components"); | ||
| const nodeModulesDist = appName => join(appPackages, appName, "node_modules", "@budibase", "bootstrap-components", "dist"); | ||
| const nodeModules = appName => join(appPackages, appName, "node_modules", "@budibase", "bootstrap-components"); | ||
| const publicMain = appName => | ||
| join( | ||
| appPackages, | ||
| appName, | ||
| "public", | ||
| "main", | ||
| "lib", | ||
| "node_modules", | ||
| "@budibase", | ||
| "bootstrap-components" | ||
| ) | ||
| const publicUnauth = appName => | ||
| join( | ||
| appPackages, | ||
| appName, | ||
| "public", | ||
| "unauthenticated", | ||
| "lib", | ||
| "node_modules", | ||
| "@budibase", | ||
| "bootstrap-components" | ||
| ) | ||
| const nodeModulesDist = appName => | ||
| join( | ||
| appPackages, | ||
| appName, | ||
| "node_modules", | ||
| "@budibase", | ||
| "bootstrap-components", | ||
| "dist" | ||
| ) | ||
| const nodeModules = appName => | ||
| join( | ||
| appPackages, | ||
| appName, | ||
| "node_modules", | ||
| "@budibase", | ||
| "bootstrap-components" | ||
| ) | ||
| (async () => { | ||
| ;(async () => { | ||
| const apps = await readdir(appPackages) | ||
| const apps = await readdir(appPackages); | ||
| const copySource = file => async toDir => { | ||
| const dest = join(toDir, basename(file)); | ||
| try { | ||
| await copyFile(file, dest, constants.COPYFILE_FICLONE); | ||
| console.log(`COPIED ${file} to ${dest}`); | ||
| } catch(e) { | ||
| console.log(`COPY FAILED ${file} to ${dest}: ${e}`); | ||
| } | ||
| const copySource = file => async toDir => { | ||
| const dest = join(toDir, basename(file)) | ||
| try { | ||
| await copyFile(file, dest, constants.COPYFILE_FICLONE) | ||
| console.log(`COPIED ${file} to ${dest}`) | ||
| } catch (e) { | ||
| console.log(`COPY FAILED ${file} to ${dest}: ${e}`) | ||
| } | ||
| } | ||
| const copySourceJs = copySource(sourceJs); | ||
| const copySourceJsMap = copySource(sourceJsMap); | ||
| const copyGenerators = copySource(sourceGenerators); | ||
| const copyComponentsJson = copySource(componentsFile); | ||
| const copySourceJs = copySource(sourceJs) | ||
| const copySourceJsMap = copySource(sourceJsMap) | ||
| const copyComponentsJson = copySource(componentsFile) | ||
| for(let app of apps) { | ||
| if(!(await stat(join(appPackages, app))).isDirectory()) continue; | ||
| for (let app of apps) { | ||
| if (!(await stat(join(appPackages, app))).isDirectory()) continue | ||
| await copySourceJs(nodeModulesDist(app)); | ||
| await copySourceJsMap(nodeModulesDist(app)); | ||
| await copyGenerators(nodeModulesDist(app)); | ||
| await copySourceJs(nodeModulesDist(app)) | ||
| await copySourceJsMap(nodeModulesDist(app)) | ||
| await copyComponentsJson(nodeModules(app)); | ||
| await copyComponentsJson(nodeModules(app)) | ||
| await copySourceJs(join(publicMain(app), "dist")); | ||
| await copySourceJsMap(join(publicMain(app), "dist")); | ||
| await copyGenerators(join(publicMain(app), "dist")); | ||
| await copySourceJs(join(publicMain(app), "dist")) | ||
| await copySourceJsMap(join(publicMain(app), "dist")) | ||
| await copySourceJs(join(publicUnauth(app), "dist")); | ||
| await copySourceJsMap(join(publicUnauth(app), "dist")); | ||
| await copyGenerators(join(publicUnauth(app), "dist")); | ||
| } | ||
| })(); | ||
| await copySourceJs(join(publicUnauth(app), "dist")) | ||
| await copySourceJsMap(join(publicUnauth(app), "dist")) | ||
| } | ||
| })() |
@@ -1,9 +0,9 @@ | ||
| export const buildStyle = (styles) => { | ||
| let str = ""; | ||
| for(let s in styles) { | ||
| if(styles[s]) { | ||
| str += `${s}: ${styles[s]}; ` | ||
| } | ||
| export const buildStyle = styles => { | ||
| let str = "" | ||
| for (let s in styles) { | ||
| if (styles[s]) { | ||
| str += `${s}: ${styles[s]}; ` | ||
| } | ||
| return str; | ||
| } | ||
| } | ||
| return str | ||
| } |
| // https://github.com/kaisermann/svelte-css-vars | ||
| export default (node, props) => { | ||
| Object.entries(props).forEach(([key, value]) => { | ||
| node.style.setProperty(`--${key}`, value); | ||
| }); | ||
| return { | ||
| update(new_props) { | ||
| Object.entries(new_props).forEach(([key, value]) => { | ||
| node.style.setProperty(`--${key}`, value); | ||
| delete props[key]; | ||
| }); | ||
| Object.keys(props).forEach(name => | ||
| node.style.removeProperty(`--${name}`), | ||
| ); | ||
| props = new_props; | ||
| }, | ||
| }; | ||
| }; | ||
| Object.entries(props).forEach(([key, value]) => { | ||
| node.style.setProperty(`--${key}`, value) | ||
| }) | ||
| return { | ||
| update(new_props) { | ||
| Object.entries(new_props).forEach(([key, value]) => { | ||
| node.style.setProperty(`--${key}`, value) | ||
| delete props[key] | ||
| }) | ||
| Object.keys(props).forEach(name => node.style.removeProperty(`--${name}`)) | ||
| props = new_props | ||
| }, | ||
| } | ||
| } |
@@ -1,1 +0,1 @@ | ||
| export const emptyProps = () => ({_component:""}); | ||
| export const emptyProps = () => ({ _component: "" }) |
@@ -1,3 +0,2 @@ | ||
| export {default as form} from "./Form.svelte"; | ||
| export {default as nav} from "./Nav.svelte"; | ||
| export { default as form } from "./Form.svelte" | ||
| export { default as nav } from "./Nav.svelte" |
@@ -1,46 +0,43 @@ | ||
| import { writable } from "svelte/store"; | ||
| import Login from "../Login.svelte"; | ||
| import Grid from "../Grid.svelte"; | ||
| import Form from "../Form.svelte"; | ||
| import Textbox from "../Textbox.svelte"; | ||
| import Text from "../Text.svelte"; | ||
| import Nav from "../Nav.svelte"; | ||
| import Panel from "../Panel.svelte"; | ||
| import StackPanel from "../StackPanel.svelte"; | ||
| import Table from "../Table.svelte"; | ||
| import Button from "../Button.svelte"; | ||
| import { createApp } from "@budibase/client/src/createApp"; | ||
| import Login from "../Login.svelte" | ||
| import Grid from "../Grid.svelte" | ||
| import Form from "../Form.svelte" | ||
| import Textbox from "../Textbox.svelte" | ||
| import Text from "../Text.svelte" | ||
| import Nav from "../Nav.svelte" | ||
| import Panel from "../Panel.svelte" | ||
| import StackPanel from "../StackPanel.svelte" | ||
| import Table from "../Table.svelte" | ||
| import Button from "../Button.svelte" | ||
| import { createApp } from "@budibase/client/src/createApp" | ||
| export default async () => { | ||
| export default async () => { | ||
| const componentLibraries = { | ||
| components: { | ||
| login: Login, | ||
| grid: Grid, | ||
| form: Form, | ||
| textbox: Textbox, | ||
| text: Text, | ||
| nav: Nav, | ||
| panel: Panel, | ||
| table: Table, | ||
| stackpanel: StackPanel, | ||
| button: Button, | ||
| }, | ||
| } | ||
| const componentLibraries = { | ||
| components : { | ||
| login : Login, | ||
| grid : Grid, | ||
| form : Form, | ||
| textbox : Textbox, | ||
| text: Text, | ||
| nav: Nav, | ||
| panel: Panel, | ||
| table: Table, | ||
| stackpanel: StackPanel, | ||
| button: Button | ||
| } | ||
| } | ||
| const appDef = { hierarchy: {}, actions: {} } | ||
| const user = { name: "yeo", permissions: [] } | ||
| const appDef = {hierarchy:{}, actions:{}}; | ||
| const user = {name:"yeo", permissions:[]}; | ||
| var app = createApp(componentLibraries, appDef, user); | ||
| app.store.update(s => { | ||
| s.people = [ | ||
| {name:"bob", address: "123 Main Street", status: "Open"}, | ||
| {name:"poppy", address: "456 Side Road", status: "Closed"}, | ||
| {name:"Oscar", address: "678 Dodgy Alley", status: "Open"}, | ||
| ]; | ||
| return s; | ||
| }) | ||
| var app = createApp(componentLibraries, appDef, user) | ||
| app.store.update(s => { | ||
| s.people = [ | ||
| { name: "bob", address: "123 Main Street", status: "Open" }, | ||
| { name: "poppy", address: "456 Side Road", status: "Closed" }, | ||
| { name: "Oscar", address: "678 Dodgy Alley", status: "Open" }, | ||
| ] | ||
| return s | ||
| }) | ||
| return app; | ||
| } | ||
| return app | ||
| } |
@@ -1,253 +0,247 @@ | ||
| export const props = { | ||
| login: { _component: "components/login" }, | ||
| login: { _component:"components/login" }, | ||
| form: { | ||
| _component: "components/form", | ||
| formControls: [ | ||
| { | ||
| control: { | ||
| _component: "components/textbox", | ||
| }, | ||
| label: "First Name", | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/textbox", | ||
| }, | ||
| label: "Last Name", | ||
| }, | ||
| ], | ||
| }, | ||
| form: { | ||
| _component: "components/form", | ||
| formControls: [ | ||
| { | ||
| control: { | ||
| _component: "components/textbox" | ||
| }, | ||
| label:"First Name" | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/textbox" | ||
| }, | ||
| label:"Last Name" | ||
| } | ||
| ] | ||
| }, | ||
| nav: { | ||
| _component: "components/nav", | ||
| navBarBackground: "red", | ||
| navBarBorder: "1px solid maroon", | ||
| navBarColor: "black", | ||
| selectedItemBackground: "maroon", | ||
| selectedItemColor: "white", | ||
| selectedItemBorder: "green", | ||
| itemHoverBackground: "yellow", | ||
| itemHoverColor: "pink", | ||
| items: [ | ||
| { | ||
| title: "People", | ||
| component: { | ||
| _component: "components/panel", | ||
| text: "People Panel", | ||
| padding: "40px", | ||
| border: "2px solid pink", | ||
| background: "mistyrose", | ||
| }, | ||
| }, | ||
| { | ||
| title: "Animals", | ||
| component: { | ||
| _component: "components/panel", | ||
| text: "Animals Panel", | ||
| padding: "40px", | ||
| border: "2px solid green", | ||
| background: "azure", | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| nav: { | ||
| _component: "components/nav", | ||
| navBarBackground: "red", | ||
| navBarBorder: "1px solid maroon", | ||
| navBarColor: "black", | ||
| selectedItemBackground: "maroon", | ||
| selectedItemColor: "white", | ||
| selectedItemBorder: "green", | ||
| itemHoverBackground: "yellow", | ||
| itemHoverColor: "pink", | ||
| items: [ | ||
| { | ||
| title: "People", | ||
| component: { | ||
| _component: "components/panel", | ||
| text:"People Panel", | ||
| padding: "40px", | ||
| border: "2px solid pink", | ||
| background: "mistyrose" | ||
| } | ||
| }, | ||
| { | ||
| title: "Animals", | ||
| component: { | ||
| _component: "components/panel", | ||
| text:"Animals Panel", | ||
| padding: "40px", | ||
| border: "2px solid green", | ||
| background: "azure" | ||
| } | ||
| } | ||
| ] | ||
| table: { | ||
| _component: "components/table", | ||
| columns: [ | ||
| { | ||
| title: { | ||
| "##bbstate": "NameColumnName", | ||
| "##bbsource": "store", | ||
| "##bbstatefallback": "Name", | ||
| }, | ||
| value: { | ||
| "##bbstate": "name", | ||
| "##bbsource": "context", | ||
| }, | ||
| }, | ||
| { | ||
| title: "Address", | ||
| value: { | ||
| "##bbstate": "address", | ||
| "##bbsource": "context", | ||
| }, | ||
| }, | ||
| { | ||
| title: "Status", | ||
| value: { | ||
| "##bbstate": "status", | ||
| "##bbsource": "context", | ||
| }, | ||
| }, | ||
| ], | ||
| data: { | ||
| "##bbstate": "people", | ||
| }, | ||
| onRowClick: [ | ||
| { | ||
| "##eventHandlerType": "Set State", | ||
| parameters: { | ||
| path: "NameColumnName", | ||
| value: { | ||
| "##bbstate": "name", | ||
| "##bbsource": "context", | ||
| "##bbstatefallback": "balls to that", | ||
| }, | ||
| }, | ||
| }, | ||
| ], | ||
| tableClass: "table-default", | ||
| theadClass: "thead-default", | ||
| tbodyClass: "tbody-default", | ||
| trClass: "tr-default", | ||
| thClass: "th-default", | ||
| }, | ||
| table: { | ||
| _component:"components/table", | ||
| columns: [ | ||
| { | ||
| title: { | ||
| "##bbstate":"NameColumnName", | ||
| "##bbsource":"store", | ||
| "##bbstatefallback": "Name" | ||
| }, | ||
| value: { | ||
| "##bbstate":"name", | ||
| "##bbsource":"context" | ||
| } | ||
| }, | ||
| { | ||
| title: "Address", | ||
| value: { | ||
| "##bbstate":"address", | ||
| "##bbsource":"context" | ||
| } | ||
| }, | ||
| { | ||
| title: "Status", | ||
| value: { | ||
| "##bbstate":"status", | ||
| "##bbsource":"context" | ||
| } | ||
| } | ||
| ], | ||
| data: { | ||
| "##bbstate":"people" | ||
| grid: { | ||
| _component: "components/grid", | ||
| gridTemplateColumns: "[left] auto [center] auto [right] auto", | ||
| gridTemplateRows: "[top] auto [middle] auto [bottom] auto", | ||
| children: [ | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "1", | ||
| background: "blue", | ||
| textAlign: "center", | ||
| color: "white", | ||
| }, | ||
| onRowClick: [ | ||
| { | ||
| "##eventHandlerType": "Set State", | ||
| parameters: { | ||
| path: "NameColumnName", | ||
| value: { | ||
| "##bbstate":"name", | ||
| "##bbsource":"context", | ||
| "##bbstatefallback": "balls to that" | ||
| } | ||
| } | ||
| } | ||
| ], | ||
| tableClass: "table-default", | ||
| theadClass: "thead-default", | ||
| tbodyClass: "tbody-default", | ||
| trClass: "tr-default", | ||
| thClass: "th-default" | ||
| gridColumn: "left", | ||
| gridRow: "top", | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "2", | ||
| background: "red", | ||
| textAlign: "center", | ||
| color: "white", | ||
| padding: "10px", | ||
| }, | ||
| gridColumn: "center", | ||
| gridRow: "middle", | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "3", | ||
| background: "yellow", | ||
| textAlign: "center", | ||
| color: "black", | ||
| }, | ||
| gridColumn: "right", | ||
| gridRow: "bottom", | ||
| }, | ||
| ], | ||
| }, | ||
| boundStackPanel: { | ||
| _component: "components/stackpanel", | ||
| direction: "horizontal", | ||
| children: [ | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "STATIC", | ||
| }, | ||
| }, | ||
| ], | ||
| data: { | ||
| "##bbstate": "people", | ||
| }, | ||
| grid: { | ||
| _component: "components/grid", | ||
| gridTemplateColumns: "[left] auto [center] auto [right] auto", | ||
| gridTemplateRows: "[top] auto [middle] auto [bottom] auto", | ||
| children : [ | ||
| dataItemComponent: { | ||
| _component: "components/panel", | ||
| text: { | ||
| "##bbstate": "name", | ||
| "##bbsource": "context", | ||
| "##bbstatefallback": "balls to that", | ||
| }, | ||
| padding: "10px", | ||
| border: "5px solid black", | ||
| margin: "10px", | ||
| hoverColor: "white", | ||
| hoverBackground: "black", | ||
| height: "200px", | ||
| weight: "200px", | ||
| }, | ||
| }, | ||
| hiddenNav: { | ||
| _component: "components/stackpanel", | ||
| children: [ | ||
| { | ||
| control: { | ||
| _component: "components/button", | ||
| contentText: "Peep", | ||
| onClick: [ | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "1", | ||
| background: "blue", | ||
| textAlign:"center", | ||
| color: "white" | ||
| }, | ||
| gridColumn: "left", | ||
| gridRow: "top" | ||
| "##eventHandlerType": "Set State", | ||
| parameters: { | ||
| path: "selected", | ||
| value: "People", | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/button", | ||
| contentText: "Ani", | ||
| onClick: [ | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "2", | ||
| background: "red", | ||
| textAlign:"center", | ||
| color: "white", | ||
| padding: "10px" | ||
| }, | ||
| gridColumn: "center", | ||
| gridRow: "middle" | ||
| "##eventHandlerType": "Set State", | ||
| parameters: { | ||
| path: "selected", | ||
| value: "Animals", | ||
| }, | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "3", | ||
| background: "yellow", | ||
| textAlign:"center", | ||
| color: "black" | ||
| }, | ||
| gridColumn: "right", | ||
| gridRow: "bottom" | ||
| } | ||
| ] | ||
| }, | ||
| boundStackPanel: { | ||
| _component: "components/stackpanel", | ||
| direction: "horizontal", | ||
| children: [ | ||
| { | ||
| control: { | ||
| _component: "components/text", | ||
| value: "STATIC" | ||
| } | ||
| } | ||
| ], | ||
| data: { | ||
| "##bbstate":"people" | ||
| ], | ||
| }, | ||
| dataItemComponent: { | ||
| _component: "components/panel", | ||
| text: { | ||
| "##bbstate":"name", | ||
| "##bbsource":"context", | ||
| "##bbstatefallback": "balls to that" | ||
| }, | ||
| padding: "10px", | ||
| border: "5px solid black", | ||
| margin: "10px", | ||
| hoverColor: "white", | ||
| hoverBackground: "black", | ||
| height:"200px", | ||
| weight:"200px" | ||
| } | ||
| }, | ||
| hiddenNav: { | ||
| _component: "components/stackpanel", | ||
| children: [ | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/nav", | ||
| hideNavBar: true, | ||
| selectedItem: { | ||
| "##bbstate": "selected", | ||
| "##bbsource": "store", | ||
| "##bbstatefallback": "Animals", | ||
| }, | ||
| items: [ | ||
| { | ||
| control:{ | ||
| _component: "components/button", | ||
| contentText: "Peep", | ||
| onClick: [ | ||
| { | ||
| "##eventHandlerType": "Set State", | ||
| parameters: { | ||
| path: "selected", | ||
| value: "People" | ||
| } | ||
| } | ||
| ] | ||
| } | ||
| title: "People", | ||
| component: { | ||
| _component: "components/panel", | ||
| text: "People Panel", | ||
| padding: "40px", | ||
| border: "2px solid pink", | ||
| background: "mistyrose", | ||
| }, | ||
| }, | ||
| { | ||
| control:{ | ||
| _component: "components/button", | ||
| contentText: "Ani", | ||
| onClick: [ | ||
| { | ||
| "##eventHandlerType": "Set State", | ||
| parameters: { | ||
| path: "selected", | ||
| value: "Animals" | ||
| } | ||
| } | ||
| ] | ||
| } | ||
| title: "Animals", | ||
| component: { | ||
| _component: "components/panel", | ||
| text: "Animals Panel", | ||
| padding: "40px", | ||
| border: "2px solid green", | ||
| background: "azure", | ||
| }, | ||
| }, | ||
| { | ||
| control: { | ||
| _component: "components/nav", | ||
| hideNavBar: true, | ||
| selectedItem: { | ||
| "##bbstate":"selected", | ||
| "##bbsource":"store", | ||
| "##bbstatefallback": "Animals" | ||
| }, | ||
| items: [ | ||
| { | ||
| title: "People", | ||
| component: { | ||
| _component: "components/panel", | ||
| text:"People Panel", | ||
| padding: "40px", | ||
| border: "2px solid pink", | ||
| background: "mistyrose" | ||
| } | ||
| }, | ||
| { | ||
| title: "Animals", | ||
| component: { | ||
| _component: "components/panel", | ||
| text:"Animals Panel", | ||
| padding: "40px", | ||
| border: "2px solid green", | ||
| background: "azure" | ||
| } | ||
| } | ||
| ] | ||
| } | ||
| } | ||
| ] | ||
| } | ||
| } | ||
| ], | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| } |
@@ -1,7 +0,7 @@ | ||
| import App from './TestApp.svelte'; | ||
| import App from "./TestApp.svelte" | ||
| const app = new App({ | ||
| target: document.body, | ||
| }); | ||
| target: document.body, | ||
| }) | ||
| export default app; | ||
| export default app |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Network access
Supply chain riskThis module accesses the network.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by1.98%
2699301
- Lines of code
- increased by26.64%
33015
- Number of medium supply chain risk alerts
- decreased by-100%
0
Worsened metrics
- Number of package files
- decreased by-27.03%
27
No dependency changes