@wener/console
Version:
Base console UI toolkit
49 lines (48 loc) • 1.87 kB
JavaScript
import React from "react";
import { DynamicRender } from "./index.js";
import { showDialog } from "./showDialog.js";
var meta = {
title: "components/DynamicRender",
parameters: {
layout: "fullscreen"
}
};
export default meta;
export var Demo = function () {
return /*#__PURE__*/ React.createElement("div", {
className: "prose"
}, /*#__PURE__*/ React.createElement("h2", null, "TopLevel"), /*#__PURE__*/ React.createElement(Control, null), /*#__PURE__*/ React.createElement("div", {
className: "p-6"
}, /*#__PURE__*/ React.createElement(DynamicRender.Root, null, /*#__PURE__*/ React.createElement("h3", null, "Nested"), /*#__PURE__*/ React.createElement(Control, null), /*#__PURE__*/ React.createElement(DynamicRender.Outlet, null))));
};
var Control = function () {
var render = DynamicRender.useRenderer().render;
return /*#__PURE__*/ React.createElement("div", {
className: "flex gap-2"
}, /*#__PURE__*/ React.createElement("button", {
className: "btn",
onClick: function () {
render({
id: "foo",
content: /*#__PURE__*/ React.createElement("div", null, "Foo")
});
}
}, "Foo"), /*#__PURE__*/ React.createElement("button", {
className: "btn",
onClick: function () {
render({
id: "bar",
content: /*#__PURE__*/ React.createElement("div", null, "Bar")
});
}
}, "Bar"), /*#__PURE__*/ React.createElement("button", {
className: "btn",
onClick: function () {
showDialog({
title: "\u6D4B\u8BD5",
description: "\u6D4B\u8BD5\u63CF\u8FF0",
content: /*#__PURE__*/ React.createElement("div", null, "\u6D4B\u8BD5\u5185\u5BB9")
});
}
}, "Dialog"));
};