djedi-json - npm Package Compare versions

Comparing version 0.1.1 to 0.2.1

build/CMSType/edits/Children/index.d.ts

@@ -6,4 +6,5 @@ import { ChildrenProps } from './type';
     allowed?: string[];
+    append: boolean;
     self?: boolean;
     label?: string;
 };

build/CMSType/edits/Children/type.d.ts

 import { CMSConfigSettings } from '../../types';
 export interface ChildrenProps extends Partial<CMSConfigSettings> {
     allowed?: string[];
+    append?: boolean;
     self?: boolean;
 }

build/core/config/index.d.ts

@@ -0,2 +1,14 @@
+/// <reference types="react" />
 export declare const validateConfig: (config: Config) => void;
+export declare const createNodeConfig: (passedConfig: ComponentConfig) => {
+    title: string;
+    description?: string;
+    editable: boolean;
+    removable: boolean;
+    icon: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    Component: import("react").FunctionComponent<any>;
+    type: string;
+    content: Record<string, any>;
+    editOnClick?: boolean;
+};
 export declare const createConfig: (passedConfig: Partial<Config>) => Config;

build/index.d.ts

 import CMSType from './CMSType';
-import CMSContext from './contexts/cms';
-import EditContext from './contexts/editcontext';
+import { useCMS } from './contexts/cms';
+import { useEdit } from './contexts/editcontext';
 import CMS from './core/CMS';
 import { createConfig, validateConfig } from './core/config';
+import { createEmpty } from './core/Node';
 import Renderer from './Renderer';
-export { CMS, CMSType, Renderer, createConfig, validateConfig, CMSContext, EditContext };
+export { CMS, CMSType, Renderer, createConfig, validateConfig, createEmpty, useCMS, useEdit };

build/index.esm.js

@@ -55,3 +55,3 @@ import * as React from 'react';
     if (settings === void 0) { settings = {}; }
-    return __assign(__assign({}, (settings || {})), { type: TYPE_IDENTIFIER$2 });
+    return __assign(__assign({ append: true }, (settings || {})), { type: TYPE_IDENTIFIER$2 });
 };
@@ -158,5 +158,8 @@
 };
+var createNodeConfig = function (passedConfig) {
+    return __assign({ icon: null, removable: true, editable: true }, passedConfig);
+};
 var createConfig = function (passedConfig) {
     var edit = __assign(__assign({}, DEFAULT_EDIT_MAP), (passedConfig.edit || {}));
-    var config = __assign(__assign({}, passedConfig), { components: __spreadArray([], ((passedConfig === null || passedConfig === void 0 ? void 0 : passedConfig.components) || [])), edit: edit });
+    var config = __assign(__assign({}, passedConfig), { components: __spreadArray([], ((passedConfig === null || passedConfig === void 0 ? void 0 : passedConfig.components) || [])).map(createNodeConfig), edit: edit });
     // validate the config before continuing
@@ -330,3 +333,3 @@ validateConfig(config);
             }, ref: ref }, "+"),
-        open && (React__default.createElement("div", { className: styles$4.chooser }, possibleChildren.map(function (s) { return (React__default.createElement("button", { onClick: function () { return handleClick(s.type); }, key: s.type }, s.title.substring(0, 1))); })))));
+        open && (React__default.createElement("div", { className: styles$4.chooser }, possibleChildren.map(function (s) { return (React__default.createElement("button", { onClick: function () { return handleClick(s.type); }, key: s.type }, s.icon || s.title.substring(0, 1))); })))));
 };
@@ -403,11 +406,11 @@
     var ref = React__default.useRef(null);
+    // DERIVED
+    var Component = config.Component, _d = config.content, content = _d === void 0 ? {} : _d;
+    var isomorphic = content.isomorphic;
+    var childrenConfig = Object.values(content).find(function (c) { return c.type === 'input/children'; }); // todo: Use a nice way to find all active child-like input types
     // CONTEXTS
     var setTree = useCMS().setTree;
     // STATES
-    var _d = React__default.useState(false), editing = _d[0], setEdit = _d[1];
-    var _e = React__default.useState(false), over = _e[0], setOver = _e[1];
-    // DERIVED
-    var Component = config.Component, _f = config.content, content = _f === void 0 ? {} : _f;
-    var isomorphic = content.isomorphic;
-    var hasChild = Object.values(content).some(function (c) { return c.type === 'input/children'; }); // todo: Use a nice way to find all active child-like input types
+    var _e = React__default.useState(isomorphic), editing = _e[0], setEdit = _e[1];
+    var _f = React__default.useState(false), over = _f[0], setOver = _f[1];
     var append = React__default.useCallback(function (type) {
@@ -435,15 +438,14 @@ setTree({ payload: createEmpty(type), type: 'add', path: __spreadArray(__spreadArray([], path), ['content', 'children']) });
             } },
-            React__default.createElement(Component, __assign({}, ((tree === null || tree === void 0 ? void 0 : tree.content) || {}), (hasChild
+            React__default.createElement(Component, __assign({}, ((tree === null || tree === void 0 ? void 0 : tree.content) || {}), (childrenConfig
                 ? {
                     children: (React__default.createElement(React__default.Fragment, null,
                         children,
-                        React__default.createElement(Append, { onClick: append, config: config }))),
+                        childrenConfig.append && React__default.createElement(Append, { onClick: append, config: config }))),
                 }
                 : {}))),
-            over && (React__default.createElement("span", { className: styles.toolbar },
-                React__default.createElement("button", { onClick: function () { return setEdit(function (v) { return !v; }); } },
-                    React__default.createElement(SvgEdit, { fill: "currentColor" })),
-                React__default.createElement("button", { onClick: remove },
-                    React__default.createElement(SvgDelete, { fill: "currentColor" }),
-                    ' ')))),
+            Boolean(over && (config.removable || config.editable)) && (React__default.createElement("span", { className: styles.toolbar },
+                config.editable && (React__default.createElement("button", { onClick: function () { return setEdit(function (v) { return !v; }); } },
+                    React__default.createElement(SvgEdit, { fill: "currentColor" }))),
+                config.removable && (React__default.createElement("button", { onClick: remove },
+                    React__default.createElement(SvgDelete, { fill: "currentColor" })))))),
         editing && React__default.createElement(EditGroup, { content: content })))));
@@ -1930,3 +1932,3 @@ };
 
-export { CMS, CMSContext, index as CMSType, EditContext, Renderer, createConfig, validateConfig };
+export { CMS, index as CMSType, Renderer, createConfig, createEmpty, useCMS, useEdit, validateConfig };
 //# sourceMappingURL=index.esm.js.map

build/index.js

@@ -83,3 +83,3 @@ 'use strict';
     if (settings === void 0) { settings = {}; }
-    return __assign(__assign({}, (settings || {})), { type: TYPE_IDENTIFIER$2 });
+    return __assign(__assign({ append: true }, (settings || {})), { type: TYPE_IDENTIFIER$2 });
 };
@@ -186,5 +186,8 @@
 };
+var createNodeConfig = function (passedConfig) {
+    return __assign({ icon: null, removable: true, editable: true }, passedConfig);
+};
 var createConfig = function (passedConfig) {
     var edit = __assign(__assign({}, DEFAULT_EDIT_MAP), (passedConfig.edit || {}));
-    var config = __assign(__assign({}, passedConfig), { components: __spreadArray([], ((passedConfig === null || passedConfig === void 0 ? void 0 : passedConfig.components) || [])), edit: edit });
+    var config = __assign(__assign({}, passedConfig), { components: __spreadArray([], ((passedConfig === null || passedConfig === void 0 ? void 0 : passedConfig.components) || [])).map(createNodeConfig), edit: edit });
     // validate the config before continuing
@@ -358,3 +361,3 @@ validateConfig(config);
             }, ref: ref }, "+"),
-        open && (React__default['default'].createElement("div", { className: styles$4.chooser }, possibleChildren.map(function (s) { return (React__default['default'].createElement("button", { onClick: function () { return handleClick(s.type); }, key: s.type }, s.title.substring(0, 1))); })))));
+        open && (React__default['default'].createElement("div", { className: styles$4.chooser }, possibleChildren.map(function (s) { return (React__default['default'].createElement("button", { onClick: function () { return handleClick(s.type); }, key: s.type }, s.icon || s.title.substring(0, 1))); })))));
 };
@@ -431,11 +434,11 @@
     var ref = React__default['default'].useRef(null);
+    // DERIVED
+    var Component = config.Component, _d = config.content, content = _d === void 0 ? {} : _d;
+    var isomorphic = content.isomorphic;
+    var childrenConfig = Object.values(content).find(function (c) { return c.type === 'input/children'; }); // todo: Use a nice way to find all active child-like input types
     // CONTEXTS
     var setTree = useCMS().setTree;
     // STATES
-    var _d = React__default['default'].useState(false), editing = _d[0], setEdit = _d[1];
-    var _e = React__default['default'].useState(false), over = _e[0], setOver = _e[1];
-    // DERIVED
-    var Component = config.Component, _f = config.content, content = _f === void 0 ? {} : _f;
-    var isomorphic = content.isomorphic;
-    var hasChild = Object.values(content).some(function (c) { return c.type === 'input/children'; }); // todo: Use a nice way to find all active child-like input types
+    var _e = React__default['default'].useState(isomorphic), editing = _e[0], setEdit = _e[1];
+    var _f = React__default['default'].useState(false), over = _f[0], setOver = _f[1];
     var append = React__default['default'].useCallback(function (type) {
@@ -463,15 +466,14 @@ setTree({ payload: createEmpty(type), type: 'add', path: __spreadArray(__spreadArray([], path), ['content', 'children']) });
             } },
-            React__default['default'].createElement(Component, __assign({}, ((tree === null || tree === void 0 ? void 0 : tree.content) || {}), (hasChild
+            React__default['default'].createElement(Component, __assign({}, ((tree === null || tree === void 0 ? void 0 : tree.content) || {}), (childrenConfig
                 ? {
                     children: (React__default['default'].createElement(React__default['default'].Fragment, null,
                         children,
-                        React__default['default'].createElement(Append, { onClick: append, config: config }))),
+                        childrenConfig.append && React__default['default'].createElement(Append, { onClick: append, config: config }))),
                 }
                 : {}))),
-            over && (React__default['default'].createElement("span", { className: styles.toolbar },
-                React__default['default'].createElement("button", { onClick: function () { return setEdit(function (v) { return !v; }); } },
-                    React__default['default'].createElement(SvgEdit, { fill: "currentColor" })),
-                React__default['default'].createElement("button", { onClick: remove },
-                    React__default['default'].createElement(SvgDelete, { fill: "currentColor" }),
-                    ' ')))),
+            Boolean(over && (config.removable || config.editable)) && (React__default['default'].createElement("span", { className: styles.toolbar },
+                config.editable && (React__default['default'].createElement("button", { onClick: function () { return setEdit(function (v) { return !v; }); } },
+                    React__default['default'].createElement(SvgEdit, { fill: "currentColor" }))),
+                config.removable && (React__default['default'].createElement("button", { onClick: remove },
+                    React__default['default'].createElement(SvgDelete, { fill: "currentColor" })))))),
         editing && React__default['default'].createElement(EditGroup, { content: content })))));
@@ -1959,8 +1961,9 @@ };
 exports.CMS = CMS;
-exports.CMSContext = CMSContext;
 exports.CMSType = index;
-exports.EditContext = EditContext;
 exports.Renderer = Renderer;
 exports.createConfig = createConfig;
+exports.createEmpty = createEmpty;
+exports.useCMS = useCMS;
+exports.useEdit = useEdit;
 exports.validateConfig = validateConfig;
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "djedi-json",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "main": "build/index.js",
@@ -5,0 +5,0 @@ "module": "build/index.esm.js",

README.md

 # Djedi - JSON
 
-Pluggable DIY-admin able to utilize existing components from your frontend.
+A modular DIY-admin able to utilize existing components from your react frontend.
 
+[Documentation](#Documentation)
+[Develop this package!](#Development)
+
 ### installing
@@ -23,2 +26,7 @@
 
+## Contexts
+
+useCMS
+useEdit
+
 ### registering components
@@ -28,2 +36,4 @@
 
+- Context useEdit
+
 ## Pre-made edits
@@ -35,2 +45,4 @@
 
+append, self, allowed
+
 ### CMSType/String
@@ -42,2 +54,4 @@
 
+### CMSType/Custom
+
 options, can be either a list of strings or an object with `label`and `value` keys.
@@ -49,3 +63,3 @@
 type
-use createCMSType.
+use CMSType.custom.
 
@@ -57,1 +71,15 @@ ### overriding edits
 ## Typescript
+
+## Development
+
+Within this repo is an example Create-react-app that has a link into the folder above, being the admin.
+
+Get started:
+
+```
+npm ci; // install dependencies for djedi-json
+npm start; // starts the rollup build-watcher
+cd example;
+npm ci;  // install dependencies for the example app
+npm start; // start the CRA app.
+```

No alert changes

Improved metrics

Total package byte prevSize

384905

increased by0.84%

Lines of code

3897

increased by0.52%

Number of lines in readme file

80

increased by53.85%

No dependency changes