[{"data":1,"prerenderedAt":193},["ShallowReactive",2],{"$fK8oyDGTU-WQUDAlLS-16HMScpGCwJ-UiMxJBuT2tlgE":3},{"newThing":4,"project":5,"cycle":8,"sections":20,"threads":170,"otherDocs":171,"images":172,"archiveItems":184,"links":192},null,{"id":6,"label":7,"liveBase":4},"design","Design",{"id":9,"num":10,"dir":11,"name":12,"title":13,"focus":4,"status":14,"statusNote":4,"created":15,"completed":4,"mode":4,"recordless":16,"thumbnail":17,"imageCount":18,"artifactCount":19,"lastActivity":15,"hasPickup":16,"hasInitialPrompt":16},"c22",22,"c22.violations-table","violations-table","Violations Table","archived","2026-09-11",false,"\u002Fcycles\u002Fdesign\u002Fc22-violations-table.png",3,0,[21,35,62,107,160],{"key":22,"title":23,"empty":16,"ast":24},"why","Why",{"type":25,"children":26},"root",[27],{"type":28,"tag":29,"props":30,"children":31},"element","p",{},[32],{"type":33,"value":34},"text","PolicyCard's default slot (c19) was only ever used for a violations table — it wasn't a generic composition point. Promoting the table to a standalone component and switching to a prop-based API keeps the summary logic contained within PolicyCard while making the table reusable on the full security policy detail page.",{"key":36,"title":37,"empty":16,"ast":38},"objective","Objective",{"type":25,"children":39},[40],{"type":28,"tag":29,"props":41,"children":42},{},[43,45,52,54,60],{"type":33,"value":44},"Create ",{"type":28,"tag":46,"props":47,"children":49},"code",{"className":48},[],[50],{"type":33,"value":51},"SecurityViolationsTable",{"type":33,"value":53}," as a standalone layer component and replace PolicyCard's default slot with a ",{"type":28,"tag":46,"props":55,"children":57},{"className":56},[],[58],{"type":33,"value":59},"violationSamples",{"type":33,"value":61}," prop.",{"key":63,"title":64,"empty":16,"ast":65},"scope","Scope",{"type":25,"children":66},[67],{"type":28,"tag":68,"props":69,"children":70},"ul",{},[71,97],{"type":28,"tag":72,"props":73,"children":74},"li",{},[75,81,83,89,91],{"type":28,"tag":76,"props":77,"children":78},"strong",{},[79],{"type":33,"value":80},"Layer:",{"type":33,"value":82}," New ",{"type":28,"tag":46,"props":84,"children":86},{"className":85},[],[87],{"type":33,"value":88},"security\u002FViolationsTable.vue",{"type":33,"value":90},", modified ",{"type":28,"tag":46,"props":92,"children":94},{"className":93},[],[95],{"type":33,"value":96},"security\u002FPolicyCard.vue",{"type":28,"tag":72,"props":98,"children":99},{},[100,105],{"type":28,"tag":76,"props":101,"children":102},{},[103],{"type":33,"value":104},"Design site:",{"type":33,"value":106}," Updated PolicyCard demo, new ViolationsTable demo, registry entries",{"key":108,"title":109,"empty":16,"ast":110},"key-changes","Key Changes",{"type":25,"children":111},[112],{"type":28,"tag":68,"props":113,"children":114},{},[115,125,143,148],{"type":28,"tag":72,"props":116,"children":117},{},[118,123],{"type":28,"tag":46,"props":119,"children":121},{"className":120},[],[122],{"type":33,"value":51},{"type":33,"value":124}," — standalone sortable table (Source, Dataflow, Destination, Violation, Time) using UxTableList + SecurityDataFlow",{"type":28,"tag":72,"props":126,"children":127},{},[128,134,136,141],{"type":28,"tag":46,"props":129,"children":131},{"className":130},[],[132],{"type":33,"value":133},"SecurityPolicyCard",{"type":33,"value":135}," — new ",{"type":28,"tag":46,"props":137,"children":139},{"className":138},[],[140],{"type":33,"value":59},{"type":33,"value":142}," prop; when non-empty, renders ViolationsTable in adjacent panel with \"Violation Samples X of Y\" footer and Remediate button",{"type":28,"tag":72,"props":144,"children":145},{},[146],{"type":33,"value":147},"Slot removed — prop is the API now",{"type":28,"tag":72,"props":149,"children":150},{},[151,153,158],{"type":33,"value":152},"Backward compatible — no ",{"type":28,"tag":46,"props":154,"children":156},{"className":155},[],[157],{"type":33,"value":59},{"type":33,"value":159}," = same card render as before",{"key":161,"title":162,"empty":16,"ast":163},"outcome","Outcome",{"type":25,"children":164},[165],{"type":28,"tag":29,"props":166,"children":167},{},[168],{"type":33,"value":169},"ViolationsTable serves double duty: PolicyCard uses it internally for summary view, security policy detail page can use it directly for the full dataset.",[],[],[173,176,180],{"src":17,"kind":174,"order":175},"hero",4999,{"src":177,"kind":178,"order":179},"\u002Fcycles\u002Fdesign\u002Fc22-violations-table-2.png","slice",2,{"src":181,"kind":182,"order":183},"\u002Fcycles\u002Fdesign\u002Fc22-violations-table-full.png","full",9000,[185],{"path":186,"title":13,"image":17,"gallery":187},"archive\u002F2026-q3\u002F2026-03-18-c22-violations-table",[188,190],{"src":17,"alt":189},"SecurityViolationsTable demo.",{"src":181,"alt":191},"Violations Table — full demo page",[],1789151089186]