@wener/console
Version:
Base console UI toolkit
211 lines (210 loc) • 7.77 kB
JavaScript
function _define_property(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
}
else {
obj[key] = value;
}
return obj;
}
function _object_spread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
if (typeof Object.getOwnPropertySymbols === "function") {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function (key) {
_define_property(target, key, source[key]);
});
}
return target;
}
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);
}
return keys;
}
function _object_spread_props(target, source) {
source = source != null ? source : {};
if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
}
else {
ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
return target;
}
function _object_without_properties(source, excluded) {
if (source == null)
return {};
var target = {}, sourceKeys, key, i;
if (typeof Reflect !== "undefined" && Reflect.ownKeys) {
sourceKeys = Reflect.ownKeys(source);
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0)
continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key))
continue;
target[key] = source[key];
}
return target;
}
target = _object_without_properties_loose(source, excluded);
if (Object.getOwnPropertySymbols) {
sourceKeys = Object.getOwnPropertySymbols(source);
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0)
continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key))
continue;
target[key] = source[key];
}
}
return target;
}
function _object_without_properties_loose(source, excluded) {
if (source == null)
return {};
var target = {}, sourceKeys = Object.getOwnPropertyNames(source), key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0)
continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key))
continue;
target[key] = source[key];
}
return target;
}
import React from "react";
import { clsx } from "clsx";
import { Icon, LeftContentRightLayout } from "../../components/index.js";
import { cn } from "../../utils/cn.js";
import { NavLink } from "../links/index.js";
import { Tooltip } from "../Tooltip.js";
import { IconMenuSidebarLayout } from "./IconMenuSidebarLayout.js";
var MenuBarItem = function (_0) {
var _ref = _0.item, title = _ref.title, href = _ref.href, icon = _ref.icon, iconActive = _ref.iconActive, className = _ref.className, props = _object_without_properties(_ref, [
"title",
"href",
"icon",
"iconActive",
"className"
]);
// NavLink 使用 useLocation 会每次 rerender
return /*#__PURE__*/ React.createElement(Tooltip.Composite, {
delay: 0,
content: title,
portal: true,
placement: "right",
className: "hidden md:block"
}, href ? /*#__PURE__*/ React.createElement(NavLink, _object_spread({
href: href,
className: function (param) {
var isActive = param.isActive;
return clsx("btn btn-square btn-ghost btn-sm h-10 w-10 p-0", isActive ? "text-base-content/90" : "opacity-70", className);
}
}, props), function (param) {
var isActive = param.isActive;
return /*#__PURE__*/ React.createElement(Icon, {
icon: icon,
active: isActive,
activeIcon: iconActive,
className: "size-6"
});
}) : /*#__PURE__*/ React.createElement("button", _object_spread({
type: "button",
className: clsx("btn btn-square btn-ghost btn-sm h-10 w-10 p-0", "opacity-70", className)
}, props), /*#__PURE__*/ React.createElement(Icon, {
icon: icon,
className: "size-6"
})));
};
(function (IconSidebarLayout) {
IconSidebarLayout.Layout = function (_0) {
var className = _0.className, top = _0.top, bottom = _0.bottom, center = _0.center, children = _0.children, props = _object_without_properties(_0, [
"className",
"top",
"bottom",
"center",
"children"
]);
// bp 为 md
// 小设备使用行显示
/* 48+8+1 - 外层无 padding，因为可能中间会有滚动，外层 padding 后非常窄 */ return /*#__PURE__*/ React.createElement(LeftContentRightLayout, _object_spread({
left: /*#__PURE__*/ React.createElement(Tooltip.Provider, null, /*#__PURE__*/ React.createElement(IconMenuSidebarLayout, {
top: renderItems(top),
center: renderItems(center),
bottom: renderItems(bottom)
})),
className: cn("h-full flex-col md:flex-row", className)
}, props), children);
};
IconSidebarLayout.Item = MenuBarItem;
var Divider = function (_0) {
var children = _0.children, props = _object_without_properties(_0, [
"children"
]);
return /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({}, props), {
className: cn("w-full border-b pt-4 text-center text-[12px] font-bold opacity-40", props.className)
}), children);
};
function renderItems(items) {
if (!Array.isArray(items)) {
return items;
}
var n = 0;
var renderItem = function (item) {
var key = n++;
if ( /*#__PURE__*/React.isValidElement(item)) {
return [
item
];
}
if ("type" in item && item.type === "group") {
var o = [];
if (item.title) {
o.push(/*#__PURE__*/ React.createElement(Divider, {
key: key
}, item.title));
}
if ("items" in item && Array.isArray(item.items)) {
return o.concat(items.flatMap(function (v) {
return renderItem(v);
}));
}
return o;
}
return [
/*#__PURE__*/ React.createElement(MenuBarItem, {
key: key,
item: item
})
];
};
return items.flatMap(function (item, i) {
return renderItem(item);
});
}
})(IconSidebarLayout || (IconSidebarLayout = {}));
export var IconSidebarLayout;