القائمة
Cutting diagram PDF layout, dimension labels, and rendering. Use when fixing or enhancing the PDF cutting diagram — panel labels, dimension overlays, sheet dimensions, legend table, or SVG layout.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Blueprint for building or upgrading detail pages (entity views with tabs/sections) to match Unity ERP's visual depth standard. Use when creating a new detail page, upgrading an existing one that feels flat, or adding tabs/sections to an entity view. Covers page canvas, sticky headers, sidebar decisions, gradient stat cards, and accent borders.
Use when adding a new furniture template, modifying parametric parts generation, extending the configurator UI (forms, previews, edge banding), or porting the configurator pattern to another project.
Use when building a Polygon sales document — pitch advert, capability pamphlet, product brochure, or any image-and-quote-led PDF in the spine+nervous-system visual brand. Triggers include "build a pitch pamphlet for [prospect]", "make an advert for [agent name]", revising/extending the existing Tight Factories advert or Purchasing Agent pamphlet, or porting the same pattern to a new agent (Inter-Site Transfer Agent, Daily Brief Agent, etc.).
Tailwind CSS v4 and shadcn v4 reference for Unity ERP. Use when writing or editing Tailwind classes, modifying globals.css or @theme config, adding shadcn components, or any frontend styling work. Prevents writing outdated v3 syntax from training data.
Unity ERP domain-specific business rules. Use when working on staff/attendance/payroll, time clock logic, file storage/uploads, or any module where non-obvious business logic applies.
Use when writing a self-contained brief for a fresh Claude or Codex session to pick up unfinished work — including "paste this into a new session" prompts, Codex CLI invocation phrases, or any handoff to another runtime/agent. Enforces local-desktop-only execution, contract shape, and the load-bearing first-line rule that scattered memory files don't reliably enforce.
| name | cutlist-pdf |
| description | Cutting diagram PDF layout, dimension labels, and rendering. Use when fixing or enhancing the PDF cutting diagram — panel labels, dimension overlays, sheet dimensions, legend table, or SVG layout. |
| argument-hint | [issue or enhancement to address] |
| allowed-tools | Read, Grep, Glob, Edit, Write, Bash |
Scope: $ARGUMENTS
| File | Purpose |
|---|---|
components/features/cutlist/CuttingDiagramPDF.tsx | Main PDF renderer (@react-pdf/renderer) |
components/features/cutlist/CutterCutListPDF.tsx | Order Cutting Plan tab cutter cut-list PDF renderer |
components/features/cutlist/preview.tsx | Interactive canvas preview — reference implementation for visual accuracy |
components/features/cutlist/primitives/CuttingDiagramButton.tsx | Download button, lazy-imports the PDF component |
lib/cutlist/cutter-cut-list-helpers.ts | Shared helpers for cutter PDF filenames, label maps, and rotation-aware placed edge banding |
lib/cutlist/types.ts | Placement, SheetLayout, and related types |
@react-pdf/renderer must be dynamically imported (causes build timeouts otherwise). The button component does this via Promise.all([import('@react-pdf/renderer'), import('../CuttingDiagramPDF')]).
Order-level cutter PDFs follow the same rule in CutterCutListButton.tsx. Keep shared types and helpers in non-React-PDF modules so buttons do not import the PDF document at module scope, not even for types.
x, y — position on sheet (mm, top-left origin)w, h — placed dimensions on sheet (already accounts for rotation)rot — 0 or 90original_length_mm, original_width_mm — part's catalog dimensions (before placement)grain — 'length' | 'width' | 'any'label — letter identifier (A, B, C...)part_id — e.g. "Left Side", "Back"p.w and p.h (placed dimensions). These match what the operator sees on the sheet.original_length_mm and original_width_mm (catalog spec).preview.tsx) is the source of truth for visual correctness — it uses pl.w/pl.h.buildPartLabelMap() plus getBasePartName(placement.part_id) before falling back to placement labels.getPlacedBandEdges(placement) when drawing edge marks, because band_edges is source-part orientation and placement.rot changes which side is visible on the placed rectangle.The PDF uses @react-pdf/renderer View transforms for vertical text.
-90deg rotation works with transformOrigin: '0 0'(left, top)(left, top - width) to (left + height, top)To center rotated text within a panel spanning v.top to v.top + v.height:
left: v.left + v.fontSize * 0.6 // slight inset from panel left edge
top: v.top + v.height // anchor at bottom; text extends upward to top
width: v.height // becomes the visual height after rotation
height: v.fontSize + 2 // becomes the visual width (thin)
transform: 'rotate(-90deg)'
transformOrigin: '0 0'
left: 2
top: DIM_OFFSET + diagramH // anchor at bottom of diagram area
width: diagramH // spans full diagram height
transform: 'rotate(-90deg)'
transformOrigin: '0 0'
DIM_OFFSET = 22 — reserved space for dimension labels outside the diagram areaPDF_PALETTE — array of { bg, text } color pairs for part coloringMath.min((diagramW) / sheetW, (diagramH) / sheetL) fits sheet into available spacepageW - margins - DIM_OFFSET wide, dynamically sized height@react-pdf/renderer does not reliably render Unicode — stick to ASCII:
length) → |width) → -ooriginal_width_mm/original_length_mm for on-panel dimension labels — these don't account for rotation and will show swapped values for rotated parts.rotate(-90deg) + transformOrigin: '0 0', content extends upward. Set top to the bottom of the desired visual area, not the center or top.@react-pdf/renderer mangles many Unicode characters (em dash, arrows, circles). Always use plain ASCII equivalents.preview.tsx) — they should match visually.