Synced and resolved conflicts.

Author: ludomikula

README.md

@@ -81,3 +81,4 @@ You can access Openblocks from [cloud-hosted version](https://cloud.openblocks.d
 - [File upload with REST API](https://cloud.openblocks.dev/apps/63a2651e660ad97d59eb4a51/view)
 - [Shopping cart demo using transformers/state/drawer](https://cloud.openblocks.dev/apps/63a422a344075b798fe3ae06/view)
 - [Module demo: color picker](https://cloud.openblocks.dev/apps/63a58f1e85d4cb49cebad1d4/view)
+- [S3 File Management](https://cloud.openblocks.dev/apps/63c7aa55686c4f301cf4d755/view)

client/packages/create-openblocks-plugin/index.js

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 import fs from "fs-extra";
 import path from "node:path";
-import { spawn } from "node:child_process";
+import { spawn } from "cross-spawn";
 import { writeFileSync, existsSync } from "node:fs";
 import chalk from "chalk";
 import { createCommand } from "commander";

client/packages/create-openblocks-plugin/package.json

@@ -1,11 +1,12 @@
 {
   "name": "create-openblocks-plugin",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "bin": "./index.js",
   "type": "module",
   "dependencies": {
     "chalk": "4",
     "commander": "^9.4.1",
+    "cross-spawn": "^7.0.3",
     "fs-extra": "^10.1.0",
     "openblocks-dev-utils": "workspace:^"
   },

client/packages/openblocks-cli/actions/init.js

@@ -1,6 +1,6 @@
 import path from "path";
 import fs from "fs-extra";
-import { spawn } from "child_process";
+import { spawn } from "cross-spawn";
 import paths from "../config/paths.js";
 import { createRequire } from "node:module";
 const require = createRequire(import.meta.url);
@@ -84,9 +84,9 @@ export default async function initAction(options) {
 
   const notCopiedFiles = ["package.json", "README.md", "README-template.md", "node_modules"];
   fs.copySync(templateDir, "./", {
-    filter: (src) => notCopiedFiles.every((i) => !src.startsWith(`${templateDir}/${i}`)),
+    filter: (src) => notCopiedFiles.every((i) => !src.startsWith(path.join(templateDir, i))),
   });
-  fs.copyFile(`${templateDir}/README-template.md`, "./README.md");
+  fs.copyFile(path.join(templateDir, "README-template.md"), "./README.md");
   console.log("template files copied");
 
   const dependencies = [];

client/packages/openblocks-cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "openblocks-cli",
   "description": "CLI tool used to start build publish openblocks components",
-  "version": "0.0.22",
+  "version": "0.0.24",
   "bin": "./index.js",
   "type": "module",
   "exports": {
@@ -26,6 +26,7 @@
     "axios": "^1.1.3",
     "chalk": "4",
     "commander": "^9.4.1",
+    "cross-spawn": "^7.0.3",
     "fs-extra": "^10.1.0",
     "openblocks-dev-utils": "workspace:^",
     "react": "^17",

client/packages/openblocks/src/components/TypographyText.tsx

@@ -0,0 +1,61 @@
+import { Typography } from "antd";
+import React from "react";
+import styled from "styled-components";
+
+const AntdTypographyText = styled(Typography.Text)`
+  font-size: 14px;
+  color: #333333;
+  line-height: 14px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: block;
+
+  :is(.ant-typography-edit-content) {
+    color: red;
+    padding: unset;
+    margin: unset !important;
+    left: unset;
+  }
+
+  .ant-input,
+  .ant-input:focus,
+  .ant-input-focused {
+    height: 24px !important;
+    min-height: 24px;
+    background: #ffffff;
+    border: 1px solid #3377ff;
+    border-radius: 4px;
+    padding: 4px 8px;
+    margin: -5px 0 3px -9px;
+    white-space: nowrap;
+
+    font-size: 14px;
+    color: #333333;
+    line-height: 14px;
+
+    ::-webkit-scrollbar {
+      display: none;
+    }
+  }
+`;
+
+export const TypographyText = (props: {
+  value: string;
+  editing: boolean;
+  onChange: (value: string) => void;
+}) => (
+  <AntdTypographyText
+    title={props.value}
+    ellipsis={true}
+    editable={{
+      enterIcon: null,
+      tooltip: false,
+      editing: props.editing,
+      icon: null,
+      triggerType: ["text"],
+      onChange: props.onChange,
+    }}
+  >
+    {props.value}
+  </AntdTypographyText>
+);

client/packages/openblocks/src/components/layout/Layout.tsx

@@ -22,7 +22,7 @@ const SideBarV2 = styled(SideBar)`
   .sidebar-section:not(:last-child)::after {
     content: "";
     display: block;
-    width: 192px;
+    width: 204px;
     height: 1px;
     background-color: #ebebeb;
     margin: 0 auto 4px;

client/packages/openblocks/src/components/layout/SideBarItem.tsx

@@ -12,7 +12,7 @@ const Wrapper = styled.div<{ size?: SideBarSize; selected?: boolean }>`
   border-radius: 4px;
   display: flex;
   align-items: center;
-  padding: 0 26px;
+  padding: 0 8px 0 26px;
   cursor: pointer;
 
   :hover {

client/packages/openblocks/src/components/table/EditableCell.tsx

@@ -129,12 +129,3 @@ export function EditableCell<T extends JSONValue>(props: EditableCellProps<T>) {
     </ColumnTypeView>
   );
 }
-
-export function updateChangeValueFn<T extends JSONValue>(
-  dispatch: DispatchType,
-  equalOriginFn: (value: T) => boolean
-) {
-  return (value: T) => {
-    dispatch(changeChildAction("changeValue", equalOriginFn(value) ? null : value));
-  };
-}

client/packages/openblocks/src/comps/comps/moduleComp/moduleComp.tsx

@@ -281,21 +281,22 @@ class ModuleTmpComp extends ModuleCompBase {
         this.dispatch(customAction<ModuleReadyAction>({ type: "moduleReady", comp }));
       });
 
-      return setFieldsNoTypeCheck(this, { moduleRootComp, moduleDsl });
+      return setFieldsNoTypeCheck(this, { moduleDsl });
     }
 
     // module ready
     if (isMyCustomAction<ModuleReadyAction>(action, "moduleReady")) {
-      if (!this.moduleRootComp) {
+      const moduleRootComp = action.value.comp;
+      if (!moduleRootComp) {
         return this;
       }
 
       let updateFields: Record<string, any> = {
         isReady: true,
-        moduleRootComp: action.value.comp,
+        moduleRootComp,
       };
 
-      const moduleLayoutComp = this.moduleRootComp.children.ui.getModuleLayoutComp();
+      const moduleLayoutComp = moduleRootComp.children.ui.getModuleLayoutComp();
       if (moduleLayoutComp) {
         const inputs = moduleLayoutComp.getInputs().map((i) => i.getView());
         const inputChild = this.children.inputs.setInputs(inputs);