@wener/console
Version:
Base console UI toolkit
25 lines (24 loc) • 1.18 kB
JavaScript
import React from 'react';
import { clsx } from 'clsx';
export var DockSidebar = function(param) {
var children = param.children, className = param.className, _param_open = param.open, open = _param_open === void 0 ? true : _param_open, _param_fixed = param.fixed, fixed = _param_fixed === void 0 ? false : _param_fixed;
return /*#__PURE__*/ React.createElement("aside", {
className: clsx(// Base layout
'flex items-center', // Small screen: horizontal bar at top
'order-1 w-full border-b px-2', // Medium screen: vertical sidebar on right
'md:order-6 md:w-[57px] md:flex-col md:border-b-0 md:border-l md:px-0', // Fixed positioning for standalone mode
fixed && [
'fixed',
// Small screen positioning with slide animation
'h-[57px]',
open ? 'top-0' : '-top-40',
'transition-[top,right]',
// Medium screen positioning with slide animation
'md:top-0 md:py-4',
open ? 'md:right-0' : 'md:-right-40',
'md:h-full'
], // Border color
'border-color', // Custom className
className)
}, children);
};