eddev 0.1.49 → 0.1.50

package/fields/ImageWell.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare type Props = {
+    previewSize: string;
+    value: number;
+    onChange: (value: number | null) => void;
+};
+export declare function ImageWell(props: Props): JSX.Element;
+export {};

package/fields/ImageWell.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImageWell = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("@stitches/react");
+var react_2 = require("react");
+function ImageWell(props) {
+    var _a = (0, react_2.useState)(null), selectedImage = _a[0], setSelectedImage = _a[1];
+    var _b = (0, react_2.useState)(false), imageIsLoading = _b[0], setImageIsLoading = _b[1];
+    (0, react_2.useEffect)(function () {
+        if (props.value) {
+            var cancelled = false;
+            setImageIsLoading(true);
+            fetch("/wp-json/ed/v1/media/" + Number(props.value))
+                .then(function (response) { return response.json(); })
+                .then(function (image) {
+                setImageIsLoading(false);
+                setSelectedImage(image);
+            });
+        }
+    }, [props.value]);
+    return ((0, jsx_runtime_1.jsxs)(Wrapper, { children: [imageIsLoading ? ((0, jsx_runtime_1.jsx)(Loading, { children: (0, jsx_runtime_1.jsx)(Spinner, {}, void 0) }, void 0)) : selectedImage ? ((0, jsx_runtime_1.jsx)(ImageContainer, { children: (0, jsx_runtime_1.jsx)("img", { src: selectedImage.sizes[props.previewSize] || selectedImage.sizes["thumbnail"] }, void 0) }, void 0)) : null, (0, jsx_runtime_1.jsx)(Toolbar, { children: selectedImage || imageIsLoading ? ((0, jsx_runtime_1.jsxs)(react_2.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button, { children: "Remove" }, void 0), (0, jsx_runtime_1.jsx)(Button, { children: "Edit" }, void 0), (0, jsx_runtime_1.jsx)(Button, { children: "View" }, void 0)] }, void 0)) : null }, void 0)] }, void 0));
+}
+exports.ImageWell = ImageWell;
+var Wrapper = (0, react_1.styled)("div", {
+    position: "relative",
+    display: "block",
+    width: "100%",
+    border: "1px solid #aaaaaa",
+});
+var ImageContainer = (0, react_1.styled)("div", {
+    padding: "4px",
+    img: {
+        maxWidth: "100%",
+    },
+});
+var spin = (0, react_1.keyframes)({
+    from: {
+        transform: "rotate(0deg)",
+    },
+    to: {
+        transform: "rotate(360deg)",
+    },
+});
+var Spinner = (0, react_1.styled)("div", {
+    display: "block",
+    width: "32px",
+    height: "32px",
+    border: "4px solid transparent",
+    borderTop: "currentColor",
+    animation: "".concat(spin, " 1s linear infinite"),
+});
+var Loading = (0, react_1.styled)("div", {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    padding: "8px",
+});
+var Toolbar = (0, react_1.styled)("div", {
+    position: "absolute",
+    top: 0,
+    right: 0,
+    padding: "4px",
+});

package/fields/installFieldTypes.js

@@ -34,8 +34,9 @@ function installFieldTypes() {
     var _loop_1 = function (name_1) {
         var type = fields_1.default[name_1];
         var Component = type.render;
-        var init = function (_a) {
-            var $el = _a.$el, cid = _a.cid, data = _a.data;
+        var init = function (field) {
+            console.log("Field is", field);
+            var $el = field.$el, cid = field.cid, data = field.data;
             var input = $el.find("input[type='hidden']");
             var container = document.createElement("div");
             $el.append(container);
@@ -52,9 +53,20 @@ exports.installFieldTypes = installFieldTypes;
 function FieldWrapper(_a) {
     var input = _a.input, defaultValue = _a.defaultValue, Component = _a.Component, settings = _a.settings;
     var _b = (0, react_1.useState)(function () { var _a; return (_a = (input.value ? JSON.parse(input.value) : null)) !== null && _a !== void 0 ? _a : defaultValue; }), value = _b[0], setValue = _b[1];
+    var _c = (0, react_1.useState)(false), valueChanged = _c[0], setValueChanged = _c[1];
     (0, react_1.useEffect)(function () {
         input.value = JSON.stringify(value);
-        console.log(input.value);
-    }, [value]);
-    return (0, jsx_runtime_1.jsx)(Component, { value: value, onChange: setValue, settings: settings }, void 0);
+        if (valueChanged) {
+            try {
+                // @ts-ignore
+                window.jQuery(input).change();
+            }
+            catch (err) { }
+            setValueChanged(false);
+        }
+    }, [value, valueChanged]);
+    return ((0, jsx_runtime_1.jsx)(Component, { value: value, onChange: function (value) {
+            setValue(value);
+            setValueChanged(true);
+        }, settings: settings }, void 0));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eddev",
-  "version": "0.1.49",
+  "version": "0.1.50",
   "main": "./index.js",
   "license": "MIT",
   "bin": {

package/blocks/EditorErrorBoundary.d.ts

@@ -1,15 +0,0 @@
-import React, { Component, ErrorInfo, ReactNode } from "react";
-interface Props {
-    children: ReactNode;
-}
-interface State {
-    hasError: boolean;
-    error?: Error;
-}
-export declare class EditorErrorBoundary extends Component<Props, State> {
-    state: State;
-    static getDerivedStateFromError(err: Error): State;
-    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
-    render(): React.ReactNode;
-}
-export {};

package/blocks/EditorErrorBoundary.js

@@ -1,64 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.EditorErrorBoundary = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var EditorErrorBoundary = /** @class */ (function (_super) {
-    __extends(EditorErrorBoundary, _super);
-    function EditorErrorBoundary() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.state = {
-            hasError: false,
-        };
-        return _this;
-    }
-    EditorErrorBoundary.getDerivedStateFromError = function (err) {
-        // Update state so the next render will show the fallback UI.
-        return { hasError: true, error: err };
-    };
-    EditorErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
-        console.error("Uncaught error:", error, errorInfo);
-    };
-    EditorErrorBoundary.prototype.render = function () {
-        if (this.state.hasError) {
-            var err = this.state.error;
-            return ((0, jsx_runtime_1.jsx)("pre", __assign({ style: {
-                    fontSize: "12px",
-                    color: "red",
-                    border: "1px solid red",
-                    borderRadius: "4px",
-                    padding: "4px",
-                    overflowX: "auto",
-                } }, { children: err.stack }), void 0));
-        }
-        return this.props.children;
-    };
-    return EditorErrorBoundary;
-}(react_1.Component));
-exports.EditorErrorBoundary = EditorErrorBoundary;

package/build/codegen-worker-script.d.ts

@@ -1,5 +0,0 @@
-export declare type CodegenOptions = {
-    baseDirectory: string;
-    watch: boolean;
-};
-export declare function beginWork(opts: CodegenOptions): Promise<void>;