{"version":3,"file":"ProcessFlow.BZR3VdwT.mjs","names":["c","useId","useRef","useState","startTransition"],"sources":["https:/framerusercontent.com/modules/sVc43mGoxUSMGP8gVypz/GQNPmO0kN0EBzQYR0bIQ/ProcessFlow.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{useEffect,useId,useRef,useState,startTransition}from\"react\";const TONES={light:{ink:\"#141516\",muted:\"#5E6368\",line:\"#141516\",rule:\"#CFCDC6\",surface:\"#FAFAF7\",signal:\"#E8611A\"},dark:{ink:\"#ECEBE6\",muted:\"#A3A7AB\",line:\"#ECEBE6\",rule:\"#34383C\",surface:\"#1F2225\",signal:\"#F07A3A\"}};/**\n * Process Flow — System Record\n * Ordered, accessible process / signal-flow diagram. Layout switches with a CSS\n * container query (no JS measurement, no layout shift). Connectors may draw once.\n *\n * @framerIntrinsicWidth 960\n * @framerIntrinsicHeight 140\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight auto\n */export default function ProcessFlow(props){const{caption=\"FIG. 1 \\xb7 Signal flow\",listLabel=\"\",steps=[],stackBelow=640,signalAfter=0,connectors=true,arrows=true,drawOnView=true,tone=\"light\",labelFont,dataFont}=props;const c={...TONES[tone]??TONES.light,...props.accent?{signal:props.accent}:{},...props.onAccent?{onSignal:props.onAccent}:{}};const uid=\"pf\"+useId().replace(/[^a-zA-Z0-9]/g,\"\");const ref=useRef(null);const isStatic=useIsStaticRenderer();const[reduced,setReduced]=useState(false);useEffect(()=>{if(typeof window===\"undefined\"||!window.matchMedia)return;const mq=window.matchMedia(\"(prefers-reduced-motion: reduce)\");const on=()=>startTransition(()=>setReduced(mq.matches));on();mq.addEventListener?.(\"change\",on);return()=>mq.removeEventListener?.(\"change\",on);},[]);const animate=drawOnView&&!isStatic&&!reduced;// The drawn state is the default and the final state. The sequence is a\n// brief re-trace that is armed only at the moment the figure enters view; if the\n// observer never fires (screenshots, print, old browsers) the diagram stays drawn.\nconst[phase,setPhase]=useState(\"static\");useEffect(()=>{if(!animate||typeof window===\"undefined\"||!(\"IntersectionObserver\"in window)||!ref.current)return;const el=ref.current;const r0=el.getBoundingClientRect();if(r0.top<window.innerHeight*.9&&r0.bottom>0)return;// already visible at load: no replay\nlet raf=0;const io=new IntersectionObserver(entries=>{if(!entries.some(e=>e.isIntersecting))return;io.disconnect();setPhase(\"armed\");raf=requestAnimationFrame(()=>{raf=requestAnimationFrame(()=>setPhase(\"play\"));});},{rootMargin:\"0px 0px -12% 0px\",threshold:0});io.observe(el);return()=>{io.disconnect();cancelAnimationFrame(raf);};},[animate]);const drawn=phase!==\"armed\";const step=steps.length>6?.11:.15;const css=`\n.${uid}{container-type:inline-size;position:relative;width:100%;margin:0}\n.${uid} ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;align-items:stretch}\n.${uid} li{display:flex;flex-direction:row;flex:1 1 0;min-width:0}\n.${uid} li:last-child{flex:1 1 0}\n.${uid} .n{flex:1 1 auto;min-width:0;border:1px solid ${c.line};background:${c.surface};padding:10px 12px}\n.${uid} .n.sig{box-shadow:inset 0 3px 0 ${c.signal}}\n.${uid} .k{display:flex;align-items:center;flex:0 0 40px;min-width:24px}\n.${uid} .k svg.h{display:block;width:100%;height:12px;overflow:visible}\n.${uid} .k svg.v{display:none}\n@container (max-width:${Math.max(240,stackBelow)}px){\n .${uid} ol{flex-direction:column}\n .${uid} li{flex-direction:column;flex:0 0 auto}\n .${uid} .k{flex:0 0 28px;justify-content:flex-start;padding-left:20px}\n .${uid} .k svg.h{display:none}\n .${uid} .k svg.v{display:block;width:12px;height:28px;overflow:visible}\n}\n.${uid} path.ln{stroke-dasharray:1}\n@keyframes ${uid}p{0%{box-shadow:inset 0 3px 0 ${c.signal}}100%{box-shadow:inset 0 3px 0 transparent}}\n.${uid}.play .n:not(.sig){animation:${uid}p .6s cubic-bezier(.2,0,0,1) both}\n@media (prefers-reduced-motion:reduce){.${uid} .n{animation:none!important}.${uid} path{transition:none!important}}\n`;const line=(i,dir)=>{const sig=signalAfter>0&&i+1===signalAfter;const col=sig?c.signal:c.line;const d=dir===\"h\"?\"M0 6 H100\":\"M6 0 V100\";const head=dir===\"h\"?\"M94 1 L100 6 L94 11\":\"M1 94 L6 100 L11 94\";return /*#__PURE__*/_jsxs(\"svg\",{className:dir,viewBox:dir===\"h\"?\"0 0 100 12\":\"0 0 12 100\",preserveAspectRatio:\"none\",\"aria-hidden\":\"true\",focusable:\"false\",children:[/*#__PURE__*/_jsx(\"path\",{className:\"ln\",d:d,pathLength:1,fill:\"none\",stroke:col,strokeWidth:sig?2:1.25,vectorEffect:\"non-scaling-stroke\",style:{strokeDashoffset:drawn?0:1,transition:phase===\"play\"?`stroke-dashoffset .28s cubic-bezier(.2,0,0,1) ${(i+.6)*step}s`:\"none\"}}),arrows?/*#__PURE__*/_jsx(\"path\",{d:head,fill:\"none\",stroke:col,strokeWidth:1.25,vectorEffect:\"non-scaling-stroke\",style:{opacity:drawn?1:0,transition:phase===\"play\"?`opacity .12s linear ${(i+.6)*step+.2}s`:\"none\"}}):null]});};return /*#__PURE__*/_jsxs(\"figure\",{ref:ref,className:uid+(phase===\"play\"?\" play\":\"\"),style:{...props.style,height:\"auto\"},children:[/*#__PURE__*/_jsx(\"style\",{children:css}),/*#__PURE__*/_jsx(\"ol\",{\"aria-label\":listLabel||caption,children:steps.map((s,i)=>{const sig=signalAfter>0&&(i+1===signalAfter||i===signalAfter);return /*#__PURE__*/_jsxs(\"li\",{children:[/*#__PURE__*/_jsxs(\"div\",{className:\"n\"+(sig?\" sig\":\"\"),style:phase===\"play\"?{animationDelay:`${i*step}s`}:undefined,children:[s.code?/*#__PURE__*/_jsx(\"span\",{style:{display:\"block\",color:c.muted,fontSize:12,letterSpacing:\"0.02em\",...dataFont},children:s.code}):null,/*#__PURE__*/_jsx(\"span\",{style:{display:\"block\",color:c.ink,fontSize:16,fontWeight:600,lineHeight:1.25,overflowWrap:\"anywhere\",...labelFont},children:s.label}),s.detail?/*#__PURE__*/_jsx(\"span\",{style:{display:\"block\",color:c.muted,fontSize:12,marginTop:4,...dataFont},children:s.detail}):null]}),connectors&&i<steps.length-1?/*#__PURE__*/_jsxs(\"div\",{className:\"k\",\"aria-hidden\":\"true\",children:[line(i,\"h\"),line(i,\"v\")]}):null]},i);})}),caption?/*#__PURE__*/_jsx(\"figcaption\",{style:{marginTop:12,paddingTop:8,borderTop:`1px solid ${c.rule}`,color:c.muted,fontSize:12,...dataFont},children:caption}):null]});}addPropertyControls(ProcessFlow,{caption:{type:ControlType.String,title:\"Caption\",defaultValue:\"FIG. 1 \\xb7 Signal flow \\xb7 Rev A\"},listLabel:{type:ControlType.String,title:\"List Label\",placeholder:\"Defaults to caption\",defaultValue:\"\"},steps:{type:ControlType.Array,title:\"Steps\",maxCount:8,control:{type:ControlType.Object,controls:{code:{type:ControlType.String,title:\"Code\",defaultValue:\"-A1\"},label:{type:ControlType.String,title:\"Label\",defaultValue:\"PLC\"},detail:{type:ControlType.String,title:\"Detail\",defaultValue:\"\"}}},defaultValue:[{code:\"-B1\",label:\"Sensor\",detail:\"24 V DC \\xb7 PNP\"},{code:\"-A1\",label:\"PLC\",detail:\"PROFINET\"},{code:\"-A2\",label:\"Robot controller\",detail:\"EtherNet/IP\"},{code:\"-R1\",label:\"Robot\",detail:\"35 kg \\xb7 1,831 mm\"},{code:\"-M1\",label:\"Conveyor\",detail:\"12 cases\"}]},stackBelow:{type:ControlType.Number,title:\"Stack Below\",defaultValue:640,min:320,max:1200,unit:\"px\",description:\"Component width at which steps stack vertically.\"},signalAfter:{type:ControlType.Number,title:\"Signal Path\",defaultValue:2,min:0,max:8,step:1,description:\"Highlights the connector after step N (0 = none).\"},connectors:{type:ControlType.Boolean,title:\"Connectors\",defaultValue:true},arrows:{type:ControlType.Boolean,title:\"Arrowheads\",defaultValue:true,hidden:p=>!p.connectors},drawOnView:{type:ControlType.Boolean,title:\"Draw Once\",defaultValue:true,hidden:p=>!p.connectors},tone:{type:ControlType.Enum,title:\"Tone\",options:[\"light\",\"dark\"],optionTitles:[\"Light\",\"Dark\"],defaultValue:\"light\",displaySegmentedControl:true},labelFont:{type:ControlType.Font,title:\"Label Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:\"16px\",variant:\"Semibold\",lineHeight:\"1.25em\"}},dataFont:{type:ControlType.Font,title:\"Data Font\",controls:\"extended\",defaultFontType:\"monospace\",defaultValue:{fontSize:\"12px\",lineHeight:\"1.3em\"}},accent:{type:ControlType.Color,title:\"Accent\",optional:true,description:\"Bind to the Accent color style so the site accent stays in one place.\"},onAccent:{type:ControlType.Color,title:\"On Accent\",optional:true,description:\"Text color on accent fills (Accent / On Accent style).\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ProcessFlow\",\"slots\":[],\"annotations\":{\"framerIntrinsicWidth\":\"960\",\"framerIntrinsicHeight\":\"140\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerSupportedLayoutHeight\":\"auto\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ProcessFlow.map"],"mappings":"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"}