import{j as e,B as l,N as h,u,e as b,r as c,M as g,f as E,h as C,k as v,_ as j,c as y,a as _,w as f}from"./index-42f456b7.js";const N=`class MyExampleExtension_TS_ {
    constructor(
        zigbee,
        mqtt,
        state,
        publishEntityState,
        eventBus,
        enableDisableExtension,
        restartCallback,
        addExtension,
        settings,
        logger,
    ) {
        this.zigbee = zigbee;
        this.mqtt = mqtt;
        this.state = state;
        this.publishEntityState = publishEntityState;
        this.eventBus = eventBus;
        this.enableDisableExtension = enableDisableExtension;
        this.restartCallback = restartCallback;
        this.addExtension = addExtension;
        this.settings = settings;
        this.logger = logger;

        this.logger.info('Loaded  MyExampleExtension_TS_');
        this.mqttBaseTopic = this.settings.get().mqtt.base_topic;
    }

    /**
     * Called when the extension starts (on Zigbee2MQTT startup, or when the extension is saved at runtime)
     */
    start() {
        this.mqtt.publish('example/extension', 'hello from MyExampleExtension_TS_');

        // all possible events can be seen here: https://github.com/Koenkk/zigbee2mqtt/blob/master/lib/eventBus.ts

        this.eventBus.onStateChange(this, this.onStateChange.bind(this));
    }

    /**
     * Called when the extension stops (on Zigbee2MQTT shutdown, or when the extension is saved/removed at runtime)
     */
    stop() {
        this.eventBus.removeListeners(this);
    }

    async onStateChange(data) {
        // see typing (properties) here: https://github.com/Koenkk/zigbee2mqtt/blob/master/lib/types/types.d.ts => namespace eventdata
        const { entity, update } = data;

        // example how to toggle state
        if (entity.ID === '0x00158d000224154d') {
            this.logger.info(\`State changed for 0x00158d000224154d: \${JSON.stringify(data)}\`);

            // state changed for some device (example: clicked a button)
            if (update.action === 'single') {
                const myLampIeeAddr = '0x00124b001e73227f'; // change this

                this.mqtt.onMessage(\`\${this.mqttBaseTopic}/\${myLampIeeAddr}/set\`, JSON.stringify({ state: 'toggle' }));
            }
        }
    }
}

// eslint-disable-next-line no-undef
module.exports = MyExampleExtension_TS_;
`,S=h.create(r=>{const{updateExtensionCode:t,onCreated:o,ts:n}=r,{t:i}=u(["extensions","common"]),s=b(),[a,m]=c.useState(`example-user-extension${n}.js`),d=N.replace(/_TS_/g,n.toString()),x=()=>{t({name:a,code:d}),o({name:a,code:d}),s.remove()};return e.jsxs(g,{isOpen:s.visible,children:[e.jsx(E,{children:i("create_new_extension")}),e.jsxs(C,{children:[e.jsx("label",{className:"form-label",children:i("extension_name_propmt")}),e.jsx("input",{type:"text",className:"form-control",value:a,onChange:p=>m(p.target.value)})]}),e.jsxs(v,{children:[e.jsx("button",{type:"button",className:"btn btn-secondary",onClick:s.remove,children:i("common:close")}),e.jsx("button",{type:"button",className:"btn btn-primary",onClick:x,children:i("common:ok")})]})]})});function k(r){return e.jsx(l,{className:"btn btn-success me-2",onClick:()=>h.show(S,{ts:Date.now(),...r}),children:e.jsx("i",{className:"fa fa-plus"})})}const M=c.lazy(()=>j(()=>import("./CodeEditor-78989ae9.js"),["./CodeEditor-78989ae9.js","./index-42f456b7.js","./index-0f5e7faa.css","./extends-98964cd2.js"],import.meta.url));class w extends c.Component{constructor(){super(...arguments),this.state={},this.loadExtension=t=>{const{value:o}=t.target;this.setState({currentExtension:o})},this.onExtensionCodeChange=t=>{const{updateExtensionCode:o}=this.props,{currentExtension:n}=this.state;n&&o({name:n,code:t})},this.onSaveClick=()=>{const{saveExtensionCode:t}=this.props;t(this.getCurrentExtension())},this.removeExtension=()=>{const{removeExtension:t}=this.props;t(this.getCurrentExtension())}}getCurrentExtension(){const{currentExtension:t}=this.state,{extensions:o}=this.props;return o.find(n=>n.name===t)}renderControls(){const{currentExtension:t}=this.state,{extensions:o,t:n,updateExtensionCode:i}=this.props;return e.jsxs("div",{className:"row mb-2",children:[e.jsx("div",{className:"col-6",children:e.jsxs("select",{value:t,className:"form-control",onChange:this.loadExtension,children:[e.jsx("option",{hidden:!0,children:n("select_extension_to_edit")},"hidden"),o.map(({name:s})=>e.jsx("option",{value:s,children:s},s))]})}),e.jsxs("div",{className:"col-6",children:[e.jsx(k,{updateExtensionCode:i,onCreated:s=>this.setState({currentExtension:s.name})}),e.jsx(l,{prompt:!0,disabled:!t,onClick:this.removeExtension,className:"btn btn-danger me-2",children:e.jsx("i",{className:"fa fa-trash"})}),e.jsx(l,{disabled:!t,onClick:this.onSaveClick,className:"btn btn-primary",children:n("common:save")})]})]})}renderEditor(){var s;const{currentExtension:t}=this.state,{extensions:o,theme:n}=this.props,i=((s=o.find(a=>a.name===t))==null?void 0:s.code)??"";return e.jsx(M,{value:i,onChange:this.onExtensionCodeChange,theme:n})}render(){return e.jsx("div",{className:"card h-100",children:e.jsxs("div",{className:"card-body h-100",children:[this.renderControls(),this.renderEditor()]})})}}const T=["extensions","theme"],q=y(T,_)(f("extensions")(w));export{q as ConnectedExtensionsEditorPage};
