@wener/console
Version:
Base console UI toolkit
117 lines (116 loc) • 4.8 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;
}
import React, { memo } from "react";
import { PiBrowser } from "react-icons/pi";
import { FloatingFocusManager, FloatingPortal } from "@floating-ui/react";
import { useStore } from "zustand";
import { useShallow } from "zustand/react/shallow";
import { useStoreWithEqualityFn } from "zustand/traditional";
import { shallow } from "zustand/vanilla/shallow";
import { usePopover } from "../../floating/index.js";
import { cn } from "../../utils/cn.js";
import { getRootWindow } from "../ReactWindow.js";
var WindowDockItem = /*#__PURE__*/ memo(function (param) {
var win = param.win;
var iconClass = "w-8 h-8 ";
var _useStoreWithEqualityFn = useStoreWithEqualityFn(win.store, function (param) {
var minimized = param.minimized, icon = param.icon, title = param.title;
if ( /*#__PURE__*/React.isValidElement(icon)) {
icon = /*#__PURE__*/ React.cloneElement(icon, {
className: iconClass
});
}
return {
minimized: minimized,
icon: icon,
title: title
};
}, shallow), minimized = _useStoreWithEqualityFn.minimized, icon = _useStoreWithEqualityFn.icon, title = _useStoreWithEqualityFn.title;
var _usePopover = usePopover({
hover: true,
placement: "left"
}), refs = _usePopover.refs, open = _usePopover.open, context = _usePopover.context, floatingStyles = _usePopover.floatingStyles, getFloatingProps = _usePopover.getFloatingProps, getReferenceProps = _usePopover.getReferenceProps;
return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("button", _object_spread_props(_object_spread({
type: "button",
className: cn("h-10 w-10", "text-base-content hover:text-base-content flex items-center justify-center", "bg-base-200 rounded", !minimized ? "active bg-base-300" : "opacity-75")
}, getReferenceProps()), {
onClick: function () {
win.minimize();
},
ref: refs.setReference
}), icon !== null && icon !== void 0 ? icon : /*#__PURE__*/ React.createElement(PiBrowser, {
className: iconClass
})), open && /*#__PURE__*/ React.createElement(FloatingPortal, null, /*#__PURE__*/ React.createElement(FloatingFocusManager, {
context: context
}, /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({
className: "bg-base-200 rounded p-1 text-xs opacity-85",
ref: refs.setFloating
}, getFloatingProps()), {
style: floatingStyles
}), title))));
});
export var WindowDockList = /*#__PURE__*/ memo(function () {
var windows = useStore(getRootWindow().store, useShallow(function (s) {
return s.windows;
}));
return /*#__PURE__*/ React.createElement("div", {
className: "flex h-full flex-row items-center gap-0.5 md:flex-col"
}, windows.map(function (win) {
return /*#__PURE__*/ React.createElement(WindowDockItem, {
key: win.id,
win: win
});
}));
});