"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const outline_1 = require("@heroicons/react/24/outline");
const react_1 = tslib_1.__importStar(require("react"));
const NotiHeader = (0, react_1.forwardRef)(({ isPreview, onBack, title }, ref) => (react_1.default.createElement("div", { ref: ref, className: 'relative flex shrink-0 items-center px-4 pb-1.5 pt-3' },
    react_1.default.createElement("button", { "aria-label": 'Back', className: [
            'absolute left-4 inline-flex items-center justify-center rounded-lg p-2',
            'text-gray-600 hover:bg-gray-100',
            'transition-all duration-300 ease-[cubic-bezier(0.16,1,0.3,1)]',
            isPreview ? 'translate-x-0 opacity-100' : 'pointer-events-none -translate-x-2 opacity-0',
        ].join(' '), onClick: onBack, type: 'button' },
        react_1.default.createElement(outline_1.ArrowLeftIcon, { className: 'h-4 w-4' })),
    react_1.default.createElement("div", { className: [
            'truncate text-base font-semibold text-gray-900',
            'transition-all duration-300 ease-[cubic-bezier(0.16,1,0.3,1)]',
            isPreview ? 'pl-10' : 'pl-0',
        ].join(' ') }, isPreview ? title !== null && title !== void 0 ? title : 'Thông báo' : 'Trung tâm thông báo'))));
NotiHeader.displayName = 'NotiHeader';
exports.default = NotiHeader;
//# sourceMappingURL=NotiHeader.js.map