@betty-blocks/cli 25.27.3 → 25.28.0

package/assets/component-set/__package.json

@@ -1,28 +1,68 @@
 {
   "name": "component-set",
-  "version": "1.0.0",
+  "version": "1.227.0",
   "main": "dist/templates.json",
   "license": "UNLICENSED",
-  "private": true,
+  "private": false,
   "devDependencies": {
-    "@betty-blocks/cli": "^23.20.0",
-    "eslint": "^5.9.0",
-    "eslint-config-airbnb": "17.1.0",
-    "eslint-config-prettier": "^3.3.0",
-    "eslint-plugin-import": "^2.14.0",
-    "eslint-plugin-jsx-a11y": "^6.1.1",
-    "eslint-plugin-prettier": "^3.0.0",
-    "eslint-plugin-react": "^7.11.1",
-    "prettier": "^1.15.3",
-    "nodemon": "^1.19.1",
-    "rimraf": "^3.0.0"
+    "@betty-blocks/cli": "^25.27.1",
+    "@commitlint/cli": "^16.1.0",
+    "@commitlint/config-angular": "^16.0.0",
+    "@semantic-release/changelog": "^6.0.1",
+    "@semantic-release/git": "^10.0.1",
+    "@types/node": "^17.0.10",
+    "@typescript-eslint/eslint-plugin": "^5.21.0",
+    "@typescript-eslint/parser": "^5.21.0",
+    "eslint": "^8.3.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.27.1",
+    "eslint-plugin-react-hooks": "^4.3.0",
+    "husky": "^4.2.5",
+    "nodemon": "^2.0.15",
+    "prettier": "^2.5.0",
+    "semantic-release": "^19.0.2",
+    "webpack": "^5.64.4",
+    "webpack-cli": "^4.9.1"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "yarn lint",
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
   },
   "scripts": {
-    "start": "bb components serve",
+    "start": "bb components serve -p 5002",
     "build": "bb components build",
     "dev": "nodemon",
-    "preview": "bb components preview",
-    "lint": "eslint --ext js ./src"
+    "lint": "eslint --ext .js,.ts,.tsx ./src",
+    "lint:ci": "yarn lint --max-warnings 0",
+    "prettier:base": "prettier --single-quote",
+    "prettier:check": "yarn prettier:base --list-different \"src/**/*.js\"",
+    "prettier:write": "yarn prettier:base --write \"src/**/*.js\"",
+    "upload": "bb components publish -b material-ui-component-set",
+    "test": "echo \"Error: no test specified\" && exit 0",
+    "bundle": "npx webpack --config webpack.config.js"
+  },
+  "files": ["dist"],
+  "dependencies": {
+    "@betty-blocks/component-sdk": "^1.7.1",
+    "@date-io/date-fns": "^1.3.13",
+    "@material-ui/core": "^4.9.11",
+    "@material-ui/icons": "^4.11.2",
+    "@material-ui/lab": "^4.0.0-alpha.50",
+    "@material-ui/pickers": "^3.2.10",
+    "@material-ui/styles": "^4.9.10",
+    "date-fns": "^2.11.0",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
   },
-  "files": ["dist"]
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/bettyblocks/material-ui-component-set.git"
+  }
 }

package/assets/component-set/src/prefabs/helloWorld.ts

@@ -0,0 +1,48 @@
+import * as React from 'react';
+import {
+  component,
+  prefab,
+  variable,
+  Icon,
+  font,
+  buttongroup,
+  color,
+  ThemeColor,
+} from '@betty-blocks/component-sdk';
+import { showOn } from '../utils';
+
+const attributes = {
+  category: 'CONTENT',
+  icon: Icon.TextInputIcon,
+};
+
+const options = {
+  content: variable('Content', { value: ['This is my first component!'] }),
+  type: font('Type', { value: 'Title1' }),
+  align: buttongroup(
+    'Align',
+    [
+      ['Left', 'left'],
+      ['Center', 'center'],
+      ['Right', 'right'],
+    ],
+    { value: 'left' },
+  ),
+  padding: buttongroup(
+    'Padding',
+    [
+      ['None', 'none'],
+      ['Dense', 'dense'],
+      ['Normal', 'normal'],
+    ],
+    { value: 'normal' },
+  ),
+  color: color('Text color', {
+    value: ThemeColor.BLACK,
+    ...showOn('styles'),
+  }),
+};
+
+export default prefab('Hello World', attributes, null, [
+  component('HelloWorld', { options }, []),
+]);

package/assets/component-set/src/utils.ts

@@ -0,0 +1,18 @@
+import { PrefabComponentOption, showIfTrue } from '@betty-blocks/component-sdk';
+
+// TODO: export OptionProducer from the sdk
+type OptionProducer = (key: string) => PrefabComponentOption;
+type Attributes = Partial<PrefabComponentOption>;
+
+export type PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
+
+export const updateOption = (
+  producer: OptionProducer,
+  attrs: Attributes,
+): OptionProducer => {
+  return (key) => ({ ...producer(key), ...attrs });
+};
+
+export const showOn = (key: string) => ({
+  configuration: { condition: showIfTrue(key) },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@betty-blocks/cli",
-  "version": "25.27.3",
+  "version": "25.28.0",
   "description": "A Betty Blocks CLI",
   "main": "build/index.js",
   "author": "Niek Nijland <niek.nijland@bettyblocks.com>",

package/assets/component-set/src/prefabs/helloWorld.js

@@ -1,52 +0,0 @@
-(() => ({
-  name: 'HelloWorld',
-  icon: 'TitleIcon',
-  category: 'CONTENT',
-  structure: [
-    {
-      name: 'HelloWorld',
-      options: [
-        {
-          type: 'FONT',
-          label: 'Type',
-          key: 'type',
-          value: 'Title1',
-        },
-        {
-          type: 'TEXT',
-          label: 'Content',
-          key: 'content',
-          value: 'Hello World!',
-        },
-        {
-          type: 'CUSTOM',
-          label: 'Align',
-          key: 'align',
-          value: 'center',
-          configuration: {
-            as: 'BUTTONGROUP',
-            dataType: 'string',
-            allowedInput: [
-              { name: 'Left', value: 'left' },
-              { name: 'Center', value: 'center' },
-              { name: 'Right', value: 'right' },
-            ],
-          },
-        },
-        {
-          type: 'SIZES',
-          label: 'Padding',
-          key: 'padding',
-          value: ['S', 'S', 'S', 'S'],
-        },
-        {
-          type: 'COLOR',
-          label: 'Color',
-          key: 'color',
-          value: 'Black',
-        },
-      ],
-      descendants: [],
-    },
-  ],
-}))();