PanelDock — پنل کناری قابل‌تغییر اندازه
کپی کد پنل کناری قابل‌تغییر اندازه برای بازرس (Inspector) و لایه‌هاست. دستگیره کپی کد است و با کشیدن یا فلش‌ها عرض را تغییر می‌دهد. روی موبایل پنل در برگهٔ پایینی داک باز می‌شود.
- برای بازرس ویژگی‌ها، لایه‌ها و تنظیمات کنار بوم.
- برای فهرست‌های کناری ثابت، از SideNavigation استفاده کنید.
وضعیت: beta · لایه: ۳ (کپی کد) · کد: کپی کد
import { PanelDock } from '@tokapps/tuk';نمونهٔ زنده
کد قابل کپی
پایه
import { PanelDock } from '@tokapps/tuk';<PanelDock title="بازرس" side="left" defaultWidth={320}> <p>ویژگی‌های عنصر انتخاب‌شده.</p></PanelDock>دو تب با ذخیرهٔ عرض
import { PanelDock } from '@tokapps/tuk';<div style={{ position: 'relative' }}> <PanelDock side="left" title="بازرس" width={width} onWidthChange={setWidth} onResizeEnd={(w) => localStorage.setItem('inspector-width', String(w))} minWidth={240} maxWidth={480} tabs={[ { id: 'props', label: 'ویژگی‌ها', content: <Props /> }, { id: 'layers', label: 'لایه‌ها', content: <Layers /> }, ]} /></div>نوار باریک با دکمهٔ جمع
<PanelDock side="right" title="لایه‌ها" collapsible defaultCollapsed={false}> <Layers /></PanelDock>سمت فیزیکی
کپی کد همیشه سمت چپ صفحه است، حتی در صفحهٔ RTL. محتوای داخل پنل RTL می‌ماند. فلش‌های دستگیره هم فیزیکی‌اند: در پنل چپ کپی کد عرض را زیاد می‌کند و در پنل راست کپی کد.
رفتار
| ورودی | عملکرد |
|---|---|
| کشیدن دستگیره | تغییر عرض بین کپی کد و کپی کد |
| فلش‌ها (فیزیکی) | گام کپی کد؛ با کپی کد ×۵ |
| کپی کد / کپی کد | کمینه / بیشینه |
| دوبار کلیک | بازگشت به کپی کد |
| دکمهٔ جمع | تبدیل به نوار باریک (کپی کد) |
دسترس‌پذیری
دستگیره کپی کد با کپی کد، کپی کد و کپی کد است. جزئیات در کپی کد.