amis-theme-editor
Version:
amis主题编辑器
225 lines (222 loc) • 6.96 kB
JavaScript
/**
* amis-theme-editor v2.0.22-beta.2
* Copyright 2018-2023 @fex
*/
import { __assign } from 'tslib';
import { render } from 'amis-core';
import React__default from 'react';
import cx from 'classnames';
import { getSchemaTpl } from '../tpl.js';
import { registerComponent } from './index.js';
import { i18n } from 'i18n-runtime';
var ThemePanelBase = function (props) {
var onEdit = props.onEdit,
activeId = props.activeId;
function handleEdit() {
onEdit({
title: i18n("0fd8c6a15323966b5ec33c28c62d01a8"),
path: "component.panel",
body: getSchemaTpl('collapseGroup', [{
title: i18n("cd6f79e7bff1337c12c86a15ceedd6da"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18n("961534b4ea37e4e88aada736b299d063"),
body: [{
label: false,
type: 'amis-theme-border',
name: 'panel.body.border'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("0103eb2d3dca70270d1a74e9ec987ac9"),
body: [{
mode: 'default',
type: 'amis-theme-radius',
name: 'panel.body.border'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("4e7f76261f8c4c6d78998f85fc1f4c6e"),
body: [{
mode: 'default',
hidePadding: true,
type: 'amis-theme-padding-and-margin',
name: 'panel.body.margin',
source: '${sizesOptions}'
}]
}, {
type: 'amis-theme-shadow-editor',
name: 'panel.body.boxShadow',
label: false,
hasSenior: false
}]
}, {
title: i18n("030c8cb75e9707285b28c4931bfeddc5"),
body: [{
type: 'amis-theme-font-editor',
label: false,
hasSenior: false,
hideFontFamily: true,
name: 'heading.body.font'
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
body: [{
label: i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
type: 'amis-theme-color-picker',
name: 'heading.body.bg',
options: '${colorOptions}',
labelMode: 'input'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("961534b4ea37e4e88aada736b299d063"),
body: [{
label: false,
type: 'amis-theme-border',
name: 'heading.body.border'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
mode: 'default',
hideMargin: true,
type: 'amis-theme-padding-and-margin',
name: 'heading.body.padding',
source: '${sizesOptions}'
}]
}]
}, {
title: i18n("132a78bdf68d6d17bde00aa807bbf032"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
body: [{
label: i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
type: 'amis-theme-color-picker',
name: 'panel.body.bg',
options: '${colorOptions}',
labelMode: 'input'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
mode: 'default',
hideMargin: true,
type: 'amis-theme-padding-and-margin',
name: 'body.body.padding',
source: '${sizesOptions}'
}]
}]
}, {
title: i18n("b3b287010ea79586507a77e0580d9cad"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
body: [{
label: i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
type: 'amis-theme-color-picker',
name: 'footer.body.bg',
options: '${colorOptions}',
labelMode: 'input'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("961534b4ea37e4e88aada736b299d063"),
body: [{
label: false,
type: 'amis-theme-border',
name: 'footer.body.border'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
mode: 'default',
hideMargin: true,
type: 'amis-theme-padding-and-margin',
name: 'footer.body.padding',
source: '${sizesOptions}'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18n("fa966345577ba81af19408f203db968f"),
body: [{
type: 'amis-theme-select',
name: 'footer.body.buttonSpace',
label: i18n("60bac4c0a381a42b320a703227be59eb"),
options: '${sizesOptions}'
}]
}]
}])
});
}
return React__default.createElement("div", {
className: "Theme-Panel-base"
}, React__default.createElement("div", {
className: "Theme-Panel-base-item"
}, React__default.createElement("div", {
className: cx('Theme-Panel-base-item-content', 'Theme-Panel-base-item-content--', activeId === 'component.panel' && 'Theme-Panel-base-item-content--active'),
onClick: function () {
return handleEdit();
}
}, render({
type: 'panel',
title: i18n("1ddb54c8369b5a8706fdd6b64a3f4484"),
body: i18n("e5a88d6b4826a7e0d3fcd9e84e0be275"),
actions: [{
type: 'button',
label: i18n("a5681e29ad7dedd3068a0570751b665e"),
actionType: 'dialog',
dialog: {
title: i18n("02d9819ddaaaeb1b7b22b12608c7e5ca"),
body: i18n("930dcc01ce6501d2ece3235288bafcb2"),
className: 'themeEditor-DialogView'
}
}, {
type: 'button',
label: i18n("b1ec0d9e3a470f5bc919edf8a2287003"),
actionType: 'dialog',
dialog: {
title: i18n("02d9819ddaaaeb1b7b22b12608c7e5ca"),
body: i18n("930dcc01ce6501d2ece3235288bafcb2"),
className: 'themeEditor-DialogView'
}
}]
}))));
};
var ThemePanel = function (props) {
return {
title: i18n("ded3b8a54c8c5b475fdfd4fc9872c784"),
body: [{
title: i18n("d614b4f0555dbb3c7eb13e778fd77293"),
body: function (onEdit) {
return React__default.createElement(ThemePanelBase, __assign({}, props, {
onEdit: onEdit
}));
}
}]
};
};
registerComponent('panel', {
type: 'layout',
label: i18n("cd6f79e7bff1337c12c86a15ceedd6da"),
key: 'panel',
component: function () {
return ThemePanel;
}
});