给猫猫添加AI和基础走路动画

.gitignore

@@ -75,4 +75,6 @@ Plugins/*/Intermediate/*
 DerivedDataCache/*
 
 # ---> MingSimulator
+node_modules/*
 !Plugins/**/ThirdParty/**
+*.log

.vscode/launch.json

@@ -0,0 +1,19 @@
+{
+    // 使用 IntelliSense 了解相关属性。 
+    // 悬停以查看现有属性的描述。
+    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "node",
+            "request": "attach",
+            "name": "Attach",
+            "sourceMaps":true,
+            "port": 8081,
+            "skipFiles": [
+                "<node_internals>/**"
+            ],
+            //"preLaunchTask": "tsc: build - tsconfig.json"
+        }
+    ]
+}

Config/DefaultPuerts.ini

@@ -2,5 +2,7 @@
 
 [/Script/Puerts.PuertsSetting]
 AutoModeEnable=True
-DebugEnable=True
+DebugEnable=False
+DebugPort=8080
+WaitDebugger=False
 

Content/JavaScript/UsingReactUMG.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const puerts_1 = require("puerts");
+const react_umg_1 = require("react-umg");
+const UI = require("./ui");
+//用React来写UI
+let world = puerts_1.argv.getByName("GameInstance").GetWorld();
+react_umg_1.ReactUMG.init(world);
+UI.Load();
+//# sourceMappingURL=UsingReactUMG.js.map

Content/JavaScript/UsingReactUMG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UsingReactUMG.js","sourceRoot":"","sources":["../../TypeScript/UsingReactUMG.ts"],"names":[],"mappings":";;AACA,mCAA4B;AAC5B,yCAAmC;AACnC,2BAA2B;AAE3B,YAAY;AACZ,IAAI,KAAK,GAAI,aAAI,CAAC,SAAS,CAAC,cAAc,CAAqB,CAAC,QAAQ,EAAE,CAAC;AAC3E,oBAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AACrB,EAAE,CAAC,IAAI,EAAE,CAAC"}

Content/JavaScript/bp/local_player.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const UE = require("ue");
+class TS_Actor extends UE.Actor {
+}
+exports.default = TS_Actor;
+//# sourceMappingURL=local_player.js.map

Content/JavaScript/bp/local_player.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"local_player.js","sourceRoot":"","sources":["../../../TypeScript/bp/local_player.ts"],"names":[],"mappings":";;AAAA,yBAAwB;AAExB,MAAM,QAAS,SAAQ,EAAE,CAAC,KAAK;CAG9B;AACD,kBAAe,QAAQ,CAAC"}

Content/JavaScript/entry.js

@@ -1,4 +1,51 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-console.log("---------------------------------0---------------------");
+const UE = require("ue");
+const puerts_1 = require("puerts");
+// require("./react-umg/react-umg")
+// require("./ui/index")
+// require("./ui/ui-components")
+console.log('--------------------------0----------------------');
+//用React来写UI
+let gameInstance = puerts_1.argv.getByName("GameInstance");
+let world = gameInstance.GetWorld();
+//TODO 1.需要一个Actor用来Tick
+//TODO 2.需要一个UUSerWidget派生类给ts用
+//TODO 3.需要一个快速创建Actor和快速创建界面的方法扩展
+//TODO 4.需要一个入口场景，以子关卡形式加载其他场景
+//TODO 5.需要加载基础ui管理
+//TODO 6.加载BP并且生成大篷车Actor
+puerts_1.blueprint.load(UE.Game.BP.Buildings.China.Cave.Cave_C);
+const CaveClass = UE.Game.BP.Buildings.China.Cave.Cave_C;
+let CaveActor = UE.GameplayStatics.BeginDeferredActorSpawnFromClass(gameInstance, CaveClass.StaticClass(), undefined);
+UE.GameplayStatics.FinishSpawningActor(CaveActor, undefined);
+CaveActor.K2_SetActorLocation(new UE.Vector(1000, 1900, 10), false, undefined, false);
+//TODO 7.加载BP并且生成精英Actor
+puerts_1.blueprint.load(UE.Game.BP.Humans.China.Collector.Collector_C);
+const CollectorClass = UE.Game.BP.Humans.China.Collector.Collector_C;
+let CollectorActor = UE.GameplayStatics.BeginDeferredActorSpawnFromClass(gameInstance, CollectorClass.StaticClass(), undefined);
+UE.GameplayStatics.FinishSpawningActor(CollectorActor, undefined);
+CollectorActor.K2_SetActorLocation(new UE.Vector(1000, 2100, 10), false, undefined, false);
+//TODO 7.加载BP并且生成植物
+puerts_1.blueprint.load(UE.Game.BP.Plants.AppleTree.AppleTree_C);
+const PlantsClass = UE.Game.BP.Plants.AppleTree.AppleTree_C;
+let PlantsActor = UE.GameplayStatics.BeginDeferredActorSpawnFromClass(gameInstance, PlantsClass.StaticClass(), undefined);
+UE.GameplayStatics.FinishSpawningActor(PlantsActor, undefined);
+PlantsActor.K2_SetActorLocation(new UE.Vector(1000, 2200, 10), false, undefined, false);
+//TODO 7.加载BP并且生成动物
+puerts_1.blueprint.load(UE.Game.BP.Animals.Cat.Cat_C);
+const AnimalClass = UE.Game.BP.Animals.Cat.Cat_C;
+let AnimalActor = UE.GameplayStatics.BeginDeferredActorSpawnFromClass(gameInstance, AnimalClass.StaticClass(), undefined);
+UE.GameplayStatics.FinishSpawningActor(AnimalActor, undefined);
+AnimalActor.K2_SetActorLocation(new UE.Vector(1000, 2300, 10), false, undefined, false);
+//TODO 8.加载BP并且打开一个界面
+puerts_1.blueprint.load(UE.Game.BP.UI.Main.CaveUI.CaveUI_C);
+const WidgetClass = UE.Game.BP.UI.Main.CaveUI.CaveUI_C;
+let widget = UE.UMGManager.CreateWidget(world, WidgetClass.StaticClass());
+widget.AddToViewport(0);
+widget.Name.SetText("我的部落");
+widget.Age.SetText("10年");
+//ReactUMG.init(world);
+//UI.Load();
+console.log('--------------------------1----------------------');
 //# sourceMappingURL=entry.js.map

Content/JavaScript/entry.js.map

@@ -1 +1 @@
-{"version":3,"file":"entry.js","sourceRoot":"","sources":["../../TypeScript/entry.ts"],"names":[],"mappings":";;AAGA,OAAO,CAAC,GAAG,CAAC,yDAAyD,CAAC,CAAA"}
+{"version":3,"file":"entry.js","sourceRoot":"","sources":["../../TypeScript/entry.ts"],"names":[],"mappings":"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"}

Content/JavaScript/react-umg/components.js

@@ -82,7 +82,6 @@ exports.EditorUtilitySpinBox = 'EditorUtilitySpinBox';
 exports.EditorUtilityThrobber = 'EditorUtilityThrobber';
 exports.EditorUtilityTreeView = 'EditorUtilityTreeView';
 exports.ToolMenuWidget = 'ToolMenuWidget';
-exports.TakeRecorderOverlayWidget = 'TakeRecorderOverlayWidget';
 exports.AudioMaterialButton = 'AudioMaterialButton';
 exports.AudioMaterialEnvelope = 'AudioMaterialEnvelope';
 exports.AudioMaterialKnob = 'AudioMaterialKnob';
@@ -100,7 +99,10 @@ exports.AudioFrequencySlider = 'AudioFrequencySlider';
 exports.AudioVectorscope = 'AudioVectorscope';
 exports.Synth2DSlider = 'Synth2DSlider';
 exports.SynthKnob = 'SynthKnob';
+exports.TakeRecorderOverlayWidget = 'TakeRecorderOverlayWidget';
 exports.ReactWidget = 'ReactWidget';
 exports.ObjectMixerEditorUWidget = 'ObjectMixerEditorUWidget';
+exports.CaveUI_C = 'CaveUI_C';
+exports.lazyloadComponents.CaveUI_C = '/Game/BP/UI/Main/CaveUI.CaveUI_C';
 exports.DefaultBurnIn_C = 'DefaultBurnIn_C';
 exports.lazyloadComponents.DefaultBurnIn_C = '/Engine/Sequencer/DefaultBurnIn.DefaultBurnIn_C';

Content/JavaScript/react-umg/react-umg.js

@@ -0,0 +1,271 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReactUMG = void 0;
+const Reconciler = require("react-reconciler");
+const puerts = require("puerts");
+const UE = require("ue");
+let world;
+function deepEquals(x, y) {
+    if (x === y)
+        return true;
+    if (!(x instanceof Object) || !(y instanceof Object))
+        return false;
+    for (var p in x) { // all x[p] in y
+        if (p == 'children' || p == 'Slot')
+            continue;
+        if (!deepEquals(x[p], y[p]))
+            return false;
+    }
+    for (var p in y) {
+        if (p == 'children' || p == 'Slot')
+            continue;
+        if (!x.hasOwnProperty(p))
+            return false;
+    }
+    return true;
+}
+class UEWidget {
+    constructor(type, props) {
+        this.type = type;
+        this.callbackRemovers = {};
+        try {
+            this.init(type, props);
+        }
+        catch (e) {
+            console.error("create " + type + " throw " + e);
+        }
+    }
+    init(type, props) {
+        let classPath = exports.lazyloadComponents[type];
+        if (classPath) {
+            //this.nativePtr = asyncUIManager.CreateComponentByClassPathName(classPath);
+            this.nativePtr = UE.NewObject(UE.Class.Load(classPath));
+        }
+        else {
+            this.nativePtr = new UE[type]();
+        }
+        let myProps = {};
+        for (const key in props) {
+            let val = props[key];
+            if (key == 'Slot') {
+                this.slot = val;
+            }
+            else if (typeof val === 'function') {
+                this.bind(key, val);
+            }
+            else if (key !== 'children') {
+                myProps[key] = val;
+            }
+        }
+        //console.log("UEWidget", type, JSON.stringify(myProps))
+        puerts.merge(this.nativePtr, myProps);
+        //console.log(type + ' inited')
+    }
+    bind(name, callback) {
+        let nativePtr = this.nativePtr;
+        let prop = nativePtr[name];
+        if (typeof prop.Add === 'function') {
+            prop.Add(callback);
+            this.callbackRemovers[name] = () => {
+                prop.Remove(callback);
+            };
+        }
+        else if (typeof prop.Bind == 'function') {
+            prop.Bind(callback);
+            this.callbackRemovers[name] = () => {
+                prop.Unbind();
+            };
+        }
+        else {
+            console.warn("unsupport callback " + name);
+        }
+    }
+    update(oldProps, newProps) {
+        let myProps = {};
+        let propChange = false;
+        for (var key in newProps) {
+            let oldProp = oldProps[key];
+            let newProp = newProps[key];
+            if (key != 'children' && oldProp != newProp) {
+                if (key == 'Slot') {
+                    this.slot = newProp;
+                    //console.log("update slot..", this.toJSON());
+                    puerts.merge(this.nativeSlotPtr, newProp);
+                    UE.UMGManager.SynchronizeSlotProperties(this.nativeSlotPtr);
+                }
+                else if (typeof newProp === 'function') {
+                    this.unbind(key);
+                    this.bind(key, newProp);
+                }
+                else {
+                    myProps[key] = newProp;
+                    propChange = true;
+                }
+            }
+        }
+        if (propChange) {
+            //console.log("update props", this.toJSON(), JSON.stringify(myProps));
+            puerts.merge(this.nativePtr, myProps);
+            UE.UMGManager.SynchronizeWidgetProperties(this.nativePtr);
+        }
+    }
+    unbind(name) {
+        let remover = this.callbackRemovers[name];
+        this.callbackRemovers[name] = undefined;
+        if (remover) {
+            remover();
+        }
+    }
+    unbindAll() {
+        for (var key in this.callbackRemovers) {
+            this.callbackRemovers[key]();
+        }
+        this.callbackRemovers = {};
+    }
+    appendChild(child) {
+        let nativeSlot = this.nativePtr.AddChild(child.nativePtr);
+        //console.log("appendChild", (await this.nativePtr).toJSON(), (await child.nativePtr).toJSON());
+        child.nativeSlot = nativeSlot;
+    }
+    removeChild(child) {
+        child.unbindAll();
+        this.nativePtr.RemoveChild(child.nativePtr);
+        //console.log("removeChild", (await this.nativePtr).toJSON(), (await child.nativePtr).toJSON())
+    }
+    set nativeSlot(value) {
+        this.nativeSlotPtr = value;
+        //console.log('setting nativeSlot', value.toJSON());
+        if (this.slot) {
+            puerts.merge(this.nativeSlotPtr, this.slot);
+            UE.UMGManager.SynchronizeSlotProperties(this.nativeSlotPtr);
+        }
+    }
+}
+class UEWidgetRoot {
+    constructor(nativePtr) {
+        this.nativePtr = nativePtr;
+    }
+    appendChild(child) {
+        let nativeSlot = this.nativePtr.AddChild(child.nativePtr);
+        child.nativeSlot = nativeSlot;
+    }
+    removeChild(child) {
+        child.unbindAll();
+        this.nativePtr.RemoveChild(child.nativePtr);
+    }
+    addToViewport(z) {
+        if (!this.Added) {
+            this.nativePtr.AddToViewport(z);
+            this.Added = true;
+        }
+    }
+    removeFromViewport() {
+        this.nativePtr.RemoveFromViewport();
+    }
+    getWidget() {
+        return this.nativePtr;
+    }
+}
+const hostConfig = {
+    getRootHostContext() {
+        return {};
+    },
+    //CanvasPanel()的parentHostContext是getRootHostContext返回的值
+    getChildHostContext(parentHostContext) {
+        return parentHostContext; //no use, share one
+    },
+    appendInitialChild(parent, child) {
+        parent.appendChild(child);
+    },
+    appendChildToContainer(container, child) {
+        container.appendChild(child);
+    },
+    appendChild(parent, child) {
+        parent.appendChild(child);
+    },
+    createInstance(type, props) {
+        return new UEWidget(type, props);
+    },
+    createTextInstance(text) {
+        return new UEWidget("TextBlock", { Text: text });
+    },
+    finalizeInitialChildren() {
+        return false;
+    },
+    getPublicInstance(instance) {
+        console.warn('getPublicInstance');
+        return instance;
+    },
+    now: Date.now,
+    prepareForCommit() {
+        //log('prepareForCommit');
+    },
+    resetAfterCommit(container) {
+        container.addToViewport(0);
+    },
+    resetTextContent() {
+        console.error('resetTextContent not implemented!');
+    },
+    shouldSetTextContent(type, props) {
+        return false;
+    },
+    commitTextUpdate(textInstance, oldText, newText) {
+        if (oldText != newText) {
+            textInstance.update({}, { Text: newText });
+        }
+    },
+    //return false表示不更新，真值将会出现到commitUpdate的updatePayload里头
+    prepareUpdate(instance, type, oldProps, newProps) {
+        try {
+            return !deepEquals(oldProps, newProps);
+        }
+        catch (e) {
+            console.error(e.message);
+            return true;
+        }
+    },
+    commitUpdate(instance, updatePayload, type, oldProps, newProps) {
+        try {
+            instance.update(oldProps, newProps);
+        }
+        catch (e) {
+            console.error("commitUpdate fail!, " + e);
+        }
+    },
+    removeChildFromContainer(container, child) {
+        console.error('removeChildFromContainer');
+        //container.removeChild(child).catch(e => {
+        //    console.error('removeChildFromContainer , e:' + e.message);
+        //});
+    },
+    removeChild(parent, child) {
+        parent.removeChild(child);
+    },
+    //useSyncScheduling: true,
+    supportsMutation: true,
+    isPrimaryRenderer: true,
+    supportsPersistence: false,
+    supportsHydration: false,
+    shouldDeprioritizeSubtree: undefined,
+    setTimeout: undefined,
+    clearTimeout: undefined,
+    cancelDeferredCallback: undefined,
+    noTimeout: undefined,
+    scheduleDeferredCallback: undefined,
+};
+const reconciler = Reconciler(hostConfig);
+exports.ReactUMG = {
+    render: function (reactElement) {
+        if (world == undefined) {
+            throw new Error("init with World first!");
+        }
+        let root = new UEWidgetRoot(UE.UMGManager.CreateReactWidget(world));
+        const container = reconciler.createContainer(root, false, false);
+        reconciler.updateContainer(reactElement, container, null, null);
+        return root;
+    },
+    init: function (inWorld) {
+        world = inWorld;
+    }
+};
+//# sourceMappingURL=react-umg.js.map

Content/JavaScript/test.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("./entry");
+const UI = require("./ui");
+UI.Load();
+let msg = "wtf";
+console.log("wtf");
+//# sourceMappingURL=test.js.map

Content/JavaScript/test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"test.js","sourceRoot":"","sources":["../../TypeScript/test.ts"],"names":[],"mappings":";;AAAA,OAAO,CAAC,SAAS,CAAC,CAAA;AAClB,2BAA2B;AAC3B,EAAE,CAAC,IAAI,EAAE,CAAC;AACV,IAAI,GAAG,GAAG,KAAK,CAAA;AACf,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA"}

Content/JavaScript/ui/index.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Load = void 0;
+const React = require("react");
+const react_umg_1 = require("react-umg");
+const ui_components_1 = require("./ui-components");
+let SlotOfVerticalBox = {
+    LayoutData: {
+        Offsets: {
+            Left: 120,
+            Top: 120,
+            Right: 480,
+            Bottom: 80
+        }
+    }
+};
+class Hello extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            names: props.names,
+            buttonTextureIndex: 0,
+        };
+    }
+    render() {
+        return (React.createElement(react_umg_1.CanvasPanel, null,
+            React.createElement(react_umg_1.VerticalBox, { Slot: SlotOfVerticalBox },
+                React.createElement(react_umg_1.HorizontalBox, null,
+                    React.createElement(react_umg_1.Button, { OnHovered: () => this.setState({ buttonTextureIndex: 1 }), OnUnhovered: () => this.setState({ buttonTextureIndex: 0 }) }, this.state.buttonTextureIndex == 0 ? 'normal' : 'hovered')),
+                this.state.names.map((name, idx) => React.createElement(ui_components_1.StatusBar, { name: name, key: idx })))));
+    }
+}
+function Load() {
+    return react_umg_1.ReactUMG.render(React.createElement(Hello, { names: ["Health:", "Energy:"] }));
+}
+exports.Load = Load;
+;
+//# sourceMappingURL=index.js.map

Content/JavaScript/ui/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../TypeScript/ui/index.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,yCAAyH;AACzH,mDAAyC;AAUzC,IAAI,iBAAiB,GAAoB;IACrC,UAAU,EAAE;QACR,OAAO,EAAE;YACL,IAAI,EAAE,GAAG;YACT,GAAG,EAAE,GAAG;YACR,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,EAAE;SACb;KACJ;CACJ,CAAA;AAED,MAAM,KAAM,SAAQ,KAAK,CAAC,SAAuB;IAC7C,YAAY,KAAY;QACtB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACX,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,kBAAkB,EAAG,CAAC;SACvB,CAAC;IACJ,CAAC;IACD,MAAM;QACF,OAAO,CACH,oBAAC,uBAAW;YACR,oBAAC,uBAAW,IAAC,IAAI,EAAE,iBAAiB;gBAChC,oBAAC,yBAAa;oBACd,oBAAC,kBAAM,IAAC,SAAS,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,kBAAkB,EAAE,CAAC,EAAC,CAAC,EAAE,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,kBAAkB,EAAE,CAAC,EAAC,CAAC,IACrH,IAAI,CAAC,KAAK,CAAC,kBAAkB,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CACrD,CACO;gBACf,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,oBAAC,yBAAS,IAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,CAC9D,CACJ,CACjB,CAAC;IACN,CAAC;CACJ;AAED,SAAgB,IAAI;IAChB,OAAO,oBAAQ,CAAC,MAAM,CAClB,oBAAC,KAAK,IAAC,KAAK,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,GAAG,CAC1C,CAAC;AACN,CAAC;AAJD,oBAIC;AAAA,CAAC"}

Content/JavaScript/ui/ui-components.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusBar = void 0;
+const React = require("react");
+const react_umg_1 = require("react-umg");
+let SlotOfProgressBar = {
+    Size: {
+        SizeRule: 1
+    }
+};
+class StatusBar extends React.Component {
+    constructor(props) {
+        super(props);
+        this.onIncrement = () => this.setState({ percent: this.state.percent + 0.01 });
+        this.onDecrement = () => this.setState({ percent: this.state.percent - 0.01 });
+        if ((props.initialPercent || 0) < 0) {
+            throw new Error('initialPercent < 0');
+        }
+        this.state = {
+            percent: props.initialPercent || 0.5
+        };
+    }
+    get color() {
+        return { R: 1 - this.state.percent, G: 0, B: this.state.percent };
+    }
+    render() {
+        return (React.createElement(react_umg_1.HorizontalBox, null,
+            React.createElement(react_umg_1.TextBlock, { Text: `${this.props.name}(${this.state.percent.toFixed(2)})` }),
+            React.createElement(react_umg_1.ProgressBar, { Percent: this.state.percent, Slot: SlotOfProgressBar, FillColorAndOpacity: this.color }),
+            React.createElement(react_umg_1.Button, { OnClicked: this.onIncrement }, "+"),
+            React.createElement(react_umg_1.Button, { OnClicked: this.onDecrement }, "-")));
+    }
+}
+exports.StatusBar = StatusBar;
+//# sourceMappingURL=ui-components.js.map

Content/JavaScript/ui/ui-components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-components.js","sourceRoot":"","sources":["../../../TypeScript/ui/ui-components.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,yCAA6F;AAY7F,IAAI,iBAAiB,GAAsB;IACvC,IAAI,EAAE;QACF,QAAQ,EAAE,CAAC;KACd;CACJ,CAAA;AAED,MAAa,SAAU,SAAQ,KAAK,CAAC,SAAuB;IACxD,YAAY,KAAY;QACtB,KAAK,CAAC,KAAK,CAAC,CAAC;QAef,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,EAAC,CAAC,CAAC;QACxE,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,EAAC,CAAC,CAAC;QAdtE,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE;YACnC,MAAM,IAAI,KAAK,CAAC,oBAAoB,CAAC,CAAC;SACvC;QAED,IAAI,CAAC,KAAK,GAAG;YACX,OAAO,EAAE,KAAK,CAAC,cAAc,IAAI,GAAG;SACrC,CAAC;IACJ,CAAC;IAED,IAAI,KAAK;QACL,OAAO,EAAC,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,EAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAC,CAAC;IACrE,CAAC;IAKD,MAAM;QACF,OAAO,CACH,oBAAC,yBAAa;YACV,oBAAC,qBAAS,IAAC,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,GAAG;YAC1E,oBAAC,uBAAW,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,IAAI,CAAC,KAAK,GAAG;YACrG,oBAAC,kBAAM,IAAC,SAAS,EAAE,IAAI,CAAC,WAAW,QAAa;YAChD,oBAAC,kBAAM,IAAC,SAAS,EAAE,IAAI,CAAC,WAAW,QAAa,CACpC,CACnB,CAAC;IACN,CAAC;CACJ;AA9BD,8BA8BC"}