/* --- src/screens-compare.jsx --- */ // New 04 신구조문 비교 + 하위문서 잔존 문구 탐지 — evidence-based panel layout const { useState: useStateE } = React; function CompareScreen({ go }){ const [picked, setPicked] = useStateE('seg-2'); // selected detected change const [tab, setTab] = useStateE('전체'); // Old vs New article (highlighted spans) const OLD = [ { type:'plain', text:'① 개인정보처리자는 다음 각 호의 어느 하나에 해당하는 경우에는 개인정보를 수집할 수 있으며 그 수집 목적의 범위에서 이용할 수 있다.' }, { type:'plain', text:'1. 정보주체의 동의를 받은 경우' }, { type:'plain', text:'2. 법률에 특별한 규정이 있거나 법령상 의무를 준수하기 위하여 ' }, { type:'mark', tone:'old', spanId:'seg-1', text:'불가피한 경우' }, { type:'plain', text:'3. 공공기관이 ' }, { type:'mark', tone:'old', spanId:'seg-2', text:'법령 등에서 정하는 소관 업무의 수행을 위하여 불가피한 경우' }, { type:'plain', text:'4. 정보주체와의 계약의 체결 및 이행을 위하여 ' }, { type:'mark', tone:'old', spanId:'seg-3', text:'불가피하게 필요한 경우' }, ]; const NEW = [ { type:'plain', text:'① 개인정보처리자는 다음 각 호의 어느 하나에 해당하는 경우에는 개인정보를 수집할 수 있으며 그 수집 목적의 범위에서 이용할 수 있다.' }, { type:'plain', text:'1. 정보주체의 동의를 받은 경우' }, { type:'plain', text:'2. 법률에 특별한 규정이 있거나 법령상 의무를 준수하기 위하여 ' }, { type:'mark', tone:'new', spanId:'seg-1', text:'필요한 경우' }, { type:'plain', text:'3. 공공기관이 ' }, { type:'mark', tone:'new', spanId:'seg-2', text:'법령등에서 정하는 소관 업무의 수행을 위하여 불가피한 경우로서 정보주체의 권리보다 명백히 우선하는 경우' }, { type:'plain', text:'4. 정보주체와의 계약의 체결 및 이행을 위하여 ' }, { type:'mark', tone:'new', spanId:'seg-3', text:'필요한 경우' }, { type:'add', spanId:'seg-4', text:'5. 정보주체 또는 그 법정대리인이 의사표시를 할 수 없는 상태에 있거나 주소불명 등으로 사전 동의를 받을 수 없는 경우' }, ]; // AI-detected changes (middle) const SEGMENTS = [ { id:'seg-1', kind:'완화', tone:'amber', from:'불가피한 경우', to:'필요한 경우', summary:'요건이 "불가피"에서 "필요"로 완화되었습니다. 이전 조항의 "불가피" 표현을 그대로 인용한 하위문서는 정비 필요성이 있습니다.', hits:18, severity:74 }, { id:'seg-2', kind:'단서 신설', tone:'blue', from:'법령 등에서 정하는 소관 업무의 수행을 위하여 불가피한 경우', to:'법령등에서 정하는 소관 업무의 수행을 위하여 불가피한 경우로서 정보주체의 권리보다 명백히 우선하는 경우', summary:'공공기관의 처리 근거에 "정보주체의 권리보다 명백히 우선" 단서가 신설되었습니다. 단서 미반영 하위문서가 다수 존재합니다.', hits:34, severity:92 }, { id:'seg-3', kind:'표현 정비', tone:'steel', from:'불가피하게 필요한 경우', to:'필요한 경우', summary:'표현이 단순화되었습니다. 의미상 큰 변화는 없으나 동일 표기 정비를 권고합니다.', hits:12, severity:48 }, { id:'seg-4', kind:'조항 신설', tone:'teal', from:'(없음)', to:'5. 정보주체 또는 법정대리인이 의사표시를 할 수 없는 경우', summary:'예외 조항이 신설되었습니다. 이를 반영하지 않은 하위문서는 운영 절차 보완이 필요합니다.', hits:9, severity:81 }, ]; const sel = SEGMENTS.find(s=>s.id===picked) || SEGMENTS[0]; // Right: residual occurrences in lower documents — filtered by selected segment const ALL_HITS = { 'seg-1': [ { id:'D-2841', kind:'시행령', src:'개인정보 보호법 시행령 제5조 제1항', agency:'중앙위원회 K', updated:'2024-08-12', sim:96, snippet:'… 법령상 의무를 준수하기 위하여 불가피한 경우에 한하여 개인정보를 …' }, { id:'D-2842', kind:'고시', src:'H부처 고시 제2024-3호 제3조', agency:'H부처', updated:'2024-03-02', sim:88, snippet:'… 업무 수행을 위하여 불가피한 경우로서 정보주체의 동의를 …' }, { id:'D-2843', kind:'조례', src:'광역시 X 정보화기본조례 제12조', agency:'광역시 X', updated:'2022-06-30', sim:81, snippet:'… 공공의 안전을 위하여 불가피한 경우 개인정보를 활용할 수 있다 …' }, { id:'D-2844', kind:'안내문', src:'복지급여 신청 안내문 2면', agency:'C부처', updated:'2023-11-14', sim:74, snippet:'… 다음 각 호의 사유로 불가피한 경우 동의 없이 처리됩니다 …' }, ], 'seg-2': [ { id:'D-2851', kind:'시행령', src:'개인정보 보호법 시행령 제5조 제2항', agency:'중앙위원회 K', updated:'2024-08-12', sim:96, hilite:'단서 미반영', snippet:'… 공공기관이 법령에서 정하는 소관 업무의 수행을 위하여 불가피한 경우에는 …' }, { id:'D-2852', kind:'고시', src:'중앙위원회 K 고시 제2023-7호', agency:'중앙위원회 K', updated:'2023-11-04', sim:91, hilite:'단서 미반영', snippet:'… 공공기관의 처리 근거를 불가피한 경우로 한정 …' }, { id:'D-2853', kind:'조례', src:'광역도 Y 개인정보 보호 규칙 제8조', agency:'광역도 Y', updated:'2023-02-21', sim:84, hilite:'단서 미반영', snippet:'… 공공기관의 직무 수행을 위하여 불가피한 경우 개인정보를 …' }, { id:'D-2854', kind:'조례', src:'광역시 Z 개인정보 보호 조례 제6조', agency:'광역시 Z', updated:'2021-09-15', sim:79, hilite:'단서 미반영', snippet:'… 공공기관이 소관 업무 수행에 불가피한 경우에 한하여 …' }, { id:'D-2855', kind:'민원서식', src:'주민등록표 등본 교부신청서 별지 제3호', agency:'H부처', updated:'2024-01-19', sim:72, snippet:'… 본 신청서는 「개인정보 보호법」제15조 제1항 제3호에 따라 처리됩니다 …' }, { id:'D-2856', kind:'안내문', src:'민원24 통합 안내 5장', agency:'H부처', updated:'2023-08-22', sim:68, snippet:'… 공공기관의 직무 수행을 위해 불가피한 경우 동의 없이 …' }, ], 'seg-3': [ { id:'D-2861', kind:'고시', src:'H부처 고시 제2023-12호 제5조', agency:'H부처', updated:'2023-04-10', sim:82, snippet:'… 계약 체결 및 이행을 위하여 불가피하게 필요한 경우 처리할 수 있다 …' }, { id:'D-2862', kind:'안내문', src:'근로계약서 표준양식 1면', agency:'D부처', updated:'2024-02-08', sim:71, snippet:'… 본인의 동의 없이 불가피하게 필요한 경우에만 활용됩니다 …' }, ], 'seg-4': [ { id:'D-2871', kind:'안내문', src:'응급의료 동의 안내문', agency:'C부처', updated:'2024-06-21', sim:0, hilite:'예외 조항 부재', snippet:'… 사전 동의가 없는 경우 처리할 수 없습니다 (※ 신설된 예외 조항 미반영) …' }, { id:'D-2872', kind:'시행령', src:'개인정보 보호법 시행령 제5조 제3항', agency:'중앙위원회 K', updated:'2024-08-12', sim:0, hilite:'예외 조항 부재', snippet:'… 본 조항에는 신설 제5호에 대응하는 운영 절차가 정의되지 않음 …' }, ], }; const hits = ALL_HITS[picked] || []; const filtered = tab==='전체' ? hits : hits.filter(h=> h.kind===tab); return ( 근거 자료 PDF, go('lower')}>하위규정 화면, go('analysis')}>분석 상세로 이동, ]} > {/* AI evidence banner */}
AI는 본 화면에서 법률 판단을 내리지 않습니다. 변경 문구와 하위문서 표현 간의 유사도를 정량 분석하여 검토 후보를 제시합니다.
모델 Claude·GPT-4o + KoBERT 법률 임베딩 · 임베딩 KoBERT-Legal · 출처: 국가법령정보센터 · 자치법규정보시스템 · 민원24 OCR · 최종 분석 2026.04.30 23:48
{/* Per-document Sync Law rates */}
{[ {l:'관련 행정규칙', v:91, n:'고시·훈령·예규 47건'}, {l:'관련 자치법규', v:72, n:'조례·규칙 124건'}, {l:'민원서식', v:54, n:'서식 38건'}, {l:'행정 안내문', v:49, n:'안내·공고 56건'}, ].map(s=>{ const tone = s.v>=85?'#1F7A6B':s.v>=70?'#5B7C99':'#C77A1B'; const soft = s.v>=85?'#DBEEEA':s.v>=70?'#EEF2F7':'#FBEFD9'; const txt = s.v>=85?'대체로 정비 완료':s.v>=70?'일부 정비 필요':'잔존 규제 의심 다수'; return (
{s.l} 싱크Law율 {txt}
{s.v} %
{s.n}
); })}
{/* Three columns: Old/New | AI Changes | Residual hits */}
{/* LEFT — Old vs New */}
상위법 개인정보 보호법 제15조
공포 2026.04.29 · 시행 2026.10.30
{/* legend */}
삭제·완화 추가·강화 표현 정비
{/* MIDDLE — AI detected changes */}
AI 감지 삭제·완화·신설 문구
4개 변경 단위 · 클릭 시 좌·우 패널이 연동됩니다
{SEGMENTS.map((s,i)=>{ const active = picked===s.id; const toneColor = s.tone==='amber'?'#C77A1B': s.tone==='blue'?'#2E5FB0': s.tone==='teal'?'#1F7A6B':'#5B7C99'; return ( ); })}
{/* RIGHT — Residual hits in lower documents */}
잔존 의심 하위문서 유사 문구
총 {hits.length}건
{['전체','시행령','고시','조례','민원서식','안내문'].map(t=>{ const cnt = t==='전체' ? hits.length : hits.filter(h=>h.kind===t).length; return ( ); })}
{filtered.length===0 && (
선택한 유형에서 감지된 잔존 문구가 없습니다.
)} {filtered.map((h,i)=>{ const docSync = h.sim ? Math.max(40, 100 - h.sim + 8) : 70; return (
{h.kind} {h.id} {h.hilite && 싱크 불일치 의심}
싱크Law율 {docSync}%
{h.src}
{h.agency} · 최종개정 {h.updated}
/g,'').replace(/<\/m>/g,'')}}/>
); })}
{/* BOTTOM — Status row */}
{/* Status summary card */}
AI 종합 검토 결과 (선택 변경 단위) {sel.kind}
{[ {l:'잔존 의심 문구', v: hits.length, s:'건 탐지', tone:'#C77A1B'}, {l:'유사도 평균', v: hits.length ? Math.round(hits.filter(h=>h.sim>0).reduce((a,b)=>a+b.sim,0)/Math.max(1,hits.filter(h=>h.sim>0).length)) : 0, s:'%', tone:'#0B2E5C'}, {l:'관련 기관', v: new Set(hits.map(h=>h.agency)).size, s:'개', tone:'#5B7C99'}, ].map(s=>(
{s.l}
{s.v} {s.s}
))}
본 결과는 AI의 의미 유사도 분석에 따른 검토 후보이며, 위법 여부 또는 정비 의무를 단정하지 않습니다. 소관부서의 검토를 거쳐 정비 필요성이 최종 판단됩니다.
{/* Three status badges */} h.agency)).size} unit="개 부서" desc="해당 잔존 문구의 소관 부서 식별" tag="자동 통보 대기" />
); } // ── Article column ── function ArticleColumn({ label, tone, lines, picked, onPick, divider, periodLabel }){ const stripe = tone==='rose' ? '#A8434A' : '#1F7A6B'; return (
{label} ({periodLabel || (tone==='rose' ? '~ 2026.04.28' : '2026.04.29 ~')})
{lines.map((l,i)=>{ if(l.type==='plain') return {l.text}; if(l.type==='add') { const active = picked===l.spanId; return (
onPick(l.spanId)} style={{ display:'block', margin:'8px 0', padding:'7px 10px', background:'#E6F4F1', borderLeft:'3px solid #1F7A6B', borderRadius:4, cursor:'pointer', outline: active ? '2px solid #1F7A6B' : 'none', outlineOffset: 1 }}> + 신설 {l.text}
); } // mark const active = picked===l.spanId; const isOld = tone==='rose'; const bg = isOld ? '#FBE9EB' : '#E6F4F1'; const bd = isOld ? '#A8434A' : '#1F7A6B'; return ( onPick(l.spanId)} style={{ background:bg, borderBottom:`2px solid ${bd}`, padding:'1px 4px', borderRadius:2, cursor:'pointer', outline: active ? `2px solid ${bd}` : 'none', outlineOffset: 1, textDecoration: isOld ? 'line-through' : 'none', textDecorationColor: isOld ? 'rgba(168,67,74,0.5)' : 'transparent' }}>{l.text} ); })}
); } function Pill({ k, v }){ return (
{k}
{v}
); } function StatusCard({ tone, icon, title, metric, unit, desc, tag }){ const tones = { amber: { strip:'#C77A1B', dot:'#C77A1B', soft:'#FBEFD9' }, blue: { strip:'#2E5FB0', dot:'#2E5FB0', soft:'#E6EEFB' }, teal: { strip:'#1F7A6B', dot:'#1F7A6B', soft:'#DBEEEA' }, }; const t = tones[tone]; return (
{title}
{metric} {unit}
{desc}
{tag}
); } const miniBtn = { display:'inline-flex', alignItems:'center', gap:4, padding:'4px 8px', fontSize:11, fontWeight:600, border:'1px solid var(--line-2)', borderRadius:5, background:'#fff', color:'var(--ink-2)', cursor:'pointer', fontFamily:'inherit' }; Object.assign(window, { CompareScreen });