https://www.berea.edu/_next/static/chunks/pages/styleguide/featured-course-aba163719a4d50d4.js

1!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},s=(new e.Error).stack;s&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[s]="38fed34c-ab11-4745-9530-b3285c8d43d8",e._sentryDebugIdIdentifier="sentry-dbid-38fed34c-ab11-4745-9530-b3285c8d43d8")}catch(e){}}(),(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[1841],{26511:function(e,s,t){(window.__NEXT_P=window.__NEXT_P||[]).push(["/styleguide/featured-course",function(){return t(22875)}])},58428:function(e,s,t){"use strict";t.d(s,{Z:function(){return i}});var r=t(85893),n=t(67294),a=t(64421);function o(e){return Object.fromEntries(Object.entries(e).map(e=>{var s;let[t,r]=e;return[t,null!==(s=r.default)&&void 0!==s?s:"boolean"!==r.type&&""]}))}function l(e){let{propKey:s,control:t,values:n,set:a}=e;return(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("label",{className:"font-mono text-xs font-medium text-gray-400",children:s}),"select"===t.type&&(0,r.jsx)("div",{className:"flex overflow-hidden rounded border border-gray-200 text-xs font-medium",children:t.options.map(e=>(0,r.jsx)("button",{onClick:()=>a(s,e),className:"px-2.5 py-1 transition-colors ".concat(n[s]===e?"bg-brand-blue text-white":"bg-white text-gray-500 hover:text-gray-800"),children:e},e))}),"boolean"===t.type&&(0,r.jsx)("button",{onClick:()=>a(s,!n[s]),className:"relative h-5 w-9 rounded-full transition-colors ".concat(n[s]?"bg-brand-blue":"bg-gray-300"),role:"switch","aria-checked":n[s],children:(0,r.jsx)("span",{className:"absolute top-1 h-3 w-3 rounded-full bg-white shadow transition-transform ".concat(n[s]?"left-5":"left-1")})}),"text"===t.type&&(0,r.jsx)("input",{type:"text",value:n[s],onChange:e=>a(s,e.target.value),className:"rounded border border-gray-200 px-2 py-0.5 font-mono text-xs text-gray-700 focus:outline-none focus:ring-1 focus:ring-brand-blue"}),"number"===t.type&&(0,r.jsx)("input",{type:"number",value:n[s],min:t.min,max:t.max,onChange:e=>a(s,Number(e.target.value)),className:"w-16 rounded border border-gray-200 px-2 py-0.5 font-mono text-xs text-gray-700 focus:outline-none focus:ring-1 focus:ring-brand-blue"})]})}function c(){return(0,r.jsxs)("svg",{width:"8",height:"20",viewBox:"0 0 8 20",fill:"currentColor",className:"text-gray-400",children:[(0,r.jsx)("circle",{cx:"2",cy:"4",r:"1.25"}),(0,r.jsx)("circle",{cx:"6",cy:"4",r:"1.25"}),(0,r.jsx)("circle",{cx:"2",cy:"8",r:"1.25"}),(0,r.jsx)("circle",{cx:"6",cy:"8",r:"1.25"}),(0,r.jsx)("circle",{cx:"2",cy:"12",r:"1.25"}),(0,r.jsx)("circle",{cx:"6",cy:"12",r:"1.25"}),(0,r.jsx)("circle",{cx:"2",cy:"16",r:"1.25"}),(0,r.jsx)("circle",{cx:"6",cy:"16",r:"1.25"})]})}let d=[320,480,768];function i(e){let{schema:s,children:t,dataEditor:i,onValuesChange:x}=e,[u,m]=(0,n.useState)(o(s)),[h,p]=(0,n.useState)(null),[b,g]=(0,n.useState)(!1),y=(0,n.useRef)(null),f=(e,s)=>{let t={...u,[e]:s};m(t),null==x||x(t)},j=Object.entries(s).filter(e=>{let[,s]=e;return!s.showWhen}),N=Object.entries(s).filter(e=>{let[,s]=e;return s.showWhen&&(!s.showWhen||Object.entries(s.showWhen).every(e=>{let[s,t]=e;return String(u[s])===t}))});return(0,r.jsxs)("div",{children:[(0,r.jsxs)("div",{className:"flex flex-wrap items-center gap-4 roun

1ded-t-lg border border-b-0 border-gray-200 bg-gray-50 px-4 py-3",children:[j.map(e=>{let[s,t]=e;return(0,r.jsx)(l,{propKey:s,control:t,values:u,set:f},s)}),(0,r.jsxs)("div",{className:"ml-auto flex items-center gap-3",children:[(0,r.jsxs)("div",{className:"flex items-center gap-1",children:[d.map(e=>(0,r.jsx)("button",{onClick:()=>p(h===e?null:e),className:"px-1.5 py-0.5 font-mono text-xs transition-colors ".concat(h===e?"font-medium text-brand-blue":"text-gray-400 hover:text-gray-600"),children:e},e)),null!=h&&(0,r.jsx)("button",{onClick:()=>p(null),className:"px-1.5 py-0.5 font-mono text-xs text-gray-400 hover:text-gray-600",children:"↕ full"})]}),(0,r.jsx)("button",{onClick:()=>m(o(s)),className:"text-xs text-gray-400 hover:text-gray-600",children:"reset"})]})]}),N.length>0&&(0,r.jsx)("div",{className:"flex flex-wrap items-center gap-4 border border-b-0 border-t-0 border-gray-200 bg-white px-4 py-2.5",children:N.map(e=>{let[s,t]=e;return(0,r.jsx)(l,{propKey:s,control:t,values:u,set:f},s)})}),(0,r.jsxs)("div",{ref:y,className:"relative rounded-b-lg border border-gray-200 bg-[#ebebeb] ".concat(b?"select-none cursor-col-resize":""),children:[(0,r.jsx)("div",{className:"bg-white",style:null!=h?{width:h}:void 0,children:(0,r.jsx)(a.Z,{children:t(u)})}),(0,r.jsxs)("div",{className:"group absolute bottom-0 top-0 z-10 flex cursor-col-resize items-center justify-center",style:null!=h?{left:h-10,width:20}:{right:-10,width:20},onMouseDown:e=>{var s,t;e.preventDefault();let r=e.clientX,n=null!=h?h:null!==(t=null===(s=y.current)||void 0===s?void 0:s.clientWidth)&&void 0!==t?t:800;g(!0);let a=e=>{var s,t;let a=e.clientX-r;p(Math.min(null!==(t=null===(s=y.current)||void 0===s?void 0:s.clientWidth)&&void 0!==t?t:9999,Math.max(320,n+a)))},o=()=>{g(!1),document.removeEventListener("mousemove",a),document.removeEventListener("mouseup",o)};document.addEventListener("mousemove",a),document.addEventListener("mouseup",o)},children:[(0,r.jsx)("div",{className:"absolute inset-y-0 left-1/2 w-px -translate-x-px transition-colors ".concat(b?"bg-brand-blue/40":"bg-gray-300 group-hover:bg-gray-400")}),(0,r.jsx)("div",{className:"relative flex h-10 w-5 items-center justify-center rounded-full border shadow-sm transition-all ".concat(b?"border-brand-blue/30 bg-white shadow-brand-blue/20":"border-gray-200 bg-white group-hover:border-gray-300 group-hover:shadow-md"),children:(0,r.jsx)(c,{})}),null!=h&&(0,r.jsxs)("div",{className:"absolute bottom-4 left-1/2 -translate-x-1/2 whitespace-nowrap rounded bg-gray-900 px-1.5 py-0.5 font-mono text-xs text-white transition-opacity ".concat(b?"opacity-100":"opacity-0 group-hover:opacity-100"),children:[Math.round(h),"px"]})]})]}),i]})}},22875:function(e,s,t){"use strict";t.r(s),t.d(s,{default:function(){return c}});var r=t(85893),n=t(1340),a=t(58428),o=t(81278);let l=[{code:"CSC 226",name:"Software Design & Implementation",description:"Learn to design, implement, and test software systems using object-oriented principles and modern development practices.",prerequisites:"CSC 124"},{code:"BIO 301",name:"Molecular Biology",description:"Study of biological activity at the molecular level, including DNA replication, transcription, and translation.",prerequisites:"BIO 201, CHM 201"},{code:"ENG 382",name:"Creative Writing Workshop",description:"An intensive workshop in fiction and poetry writing with peer review and individual conferences."}];function c(){return(0,r.jsxs)(n.ZP,{children:[(0,r.jsxs)("div",{className:"mb-8 max-w-3xl",children:[(0,r.jsx)("h1",{className:"mb-2 text-2xl font-bold",children:"FeaturedCourse"}),(0,r.jsxs)("p",{className:"text-gray-600",children:["A prop-driven section for highlighting academic offerings, in four treatments (",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"variant"}),"): a faithful ",(0,r.jsx)("strong",{children:"grid"}),", a numbered registrar"," ",(0,r.jsx)("strong",{children:"index"}),", a card-as-link ",(0,r.jsx)("strong",{children:"card"}),", and an oversized ",(0,r.jsx)("strong",{children:"editorial"})," spread. All resolve color from"," ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"--tone-*"})," tokens, so the same markup reads correctly on a white or blue surface. Built on the shared editorial primitives (Overline, Hairline, ArrowLink)."]})]}),(0,r.jsx)(a.Z,{schema:{variant:{type:"select",options:["grid","index","card","editorial"],default:"grid",description:"Visual treatment"},tone:{type:"select",options:["white","blue"],default:"white",description:"Surface tone (blue is a dark surface)"},withLinks:{type:"boolean",default:!1,description:'Give each course an href — adds a "Vie

1w course →" CTA in card/editorial'}},children:e=>{let{variant:s,tone:t,withLinks:n}=e;return(0,r.jsx)(o.Z,{courses:n?l.map(e=>({...e,href:"/academics/courses/".concat(e.code.toLowerCase().replace(/\s+/g,"-"))})):l,variant:s,tone:t,heading:"Courses worth crossing campus for"})}}),(0,r.jsxs)("div",{className:"mt-12 max-w-3xl rounded-lg bg-gray-50 p-4",children:[(0,r.jsx)("h3",{className:"mb-2 font-semibold",children:"Component Props"}),(0,r.jsxs)("table",{className:"w-full text-sm",children:[(0,r.jsx)("thead",{children:(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("th",{className:"py-2 text-left",children:"Prop"}),(0,r.jsx)("th",{className:"py-2 text-left",children:"Type"}),(0,r.jsx)("th",{className:"py-2 text-left",children:"Description"})]})}),(0,r.jsxs)("tbody",{className:"text-gray-600",children:[(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"CourseItem[]"}),(0,r.jsx)("td",{className:"py-2",children:"Array of course objects"})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"variant"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"'grid' | 'index' | 'card' | 'editorial'?"}),(0,r.jsxs)("td",{className:"py-2",children:["Visual treatment (default ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"grid"}),")"]})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"tone"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"'white' | 'blue'?"}),(0,r.jsxs)("td",{className:"py-2",children:["Surface tone (default ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"white"}),"). On"," ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"blue"}),", the"," ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"card"})," variant gets a darker card fill for chartreuse contrast."]})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"eyebrow / heading"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"string?"}),(0,r.jsx)("td",{className:"py-2",children:"Section overline + heading"})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses[].code"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"string"}),(0,r.jsx)("td",{className:"py-2",children:"Course code (e.g., CSC 226)"})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses[].name"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"string"}),(0,r.jsx)("td",{className:"py-2",children:"Course name"})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses[].description"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"string"}),(0,r.jsx)("td",{className:"py-2",children:"Course description"})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses[].prerequisites"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"string?"}),(0,r.jsx)("td",{className:"py-2",children:"Optional prerequisite courses"})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses[].href"}),(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"string?"}),(0,r.jsxs)("td",{className:"py-2",children:["Optional per-course link. In ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"card"})," ","/ ",(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"editorial"}),", renders a CTA (and makes the card a link). When absent: no CTA, static."]})]})]})]})]}),(0,r.jsxs)("div",{className:"mt-4 max-w-3xl rounded-lg bg-gray-50 p-4",children:[(0,r.jsx)("h3",{className:"mb-2 font-semibold",children:"Props not in ACF"}),(0,r.jsx)("p",{className:"mb-3 text-sm text-gray-600",children:"Props the component accepts that aren't authored as ACF fields yet. For existing WP content they take the default shown."}),(0,r.jsxs)("table",{className:"w-full text-sm",children:[(0,r.jsx)("thead",{children:(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("th",{className:"py-2 text-left",children:"Prop"}),(0,r.jsx)("th",{className:"py-2 text-left",children:"In ACF?"}),(0,r.jsx)("th",{className:"py-2 text-left",children:"Default for existing WP content"})]})}),(0,r.jsxs)("tbody",{className:"text-gray-600",children:[(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"variant"}),(0,r.jsx)("td",{className:"py-2",children:"No"}),(0,r.jsxs)("td",{className:"py-2",children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"grid"})," — the WP adapter doesn't emit a treatment selector yet."]})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"tone"}),(0,r.jsx)("td",{className:"py-2",children:"No"}),(0,r.jsxs)("td",{className:"py-2",children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"white"})," — no ACF tone toggle yet."]})]}),(0,r.jsxs)("tr",{className:"border-b",children:[(0,r.jsx)("td",{className:"py-2 font-mono text-xs",children:"courses[].href"}),(0,r.jsx)("td",{className:"py-2",children:"No"}),(0,r.jsxs)("td",{className:"py-2",children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"undefined"})," — no per-course link field yet; CTA only renders when supplied."]})]})]})]})]}),(0,r.jsxs)("div",{className:"mt-4 max-w-3xl rounded-lg bg-gray-50 p-4",children:[(0,r.jsx)("h3",{className:"mb-2 font-semibold",children:"Files"}),(0,r.jsxs)("ul",{className:"space-y-1 text-sm text-gray-600",children:[(0,r.jsxs)("li",{children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"components/ui/types/featured-course.ts"})," — Type definitions"]}),(0,r.jsxs)("li",{children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"components/ui/next/FeaturedCourse/FeaturedCourse.tsx"})," — UI component"]}),(0,r.jsxs)("li",{children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"components/

1adapters/wordpress/featured-course.ts"})," — WordPress adapter"]}),(0,r.jsxs)("li",{children:[(0,r.jsx)("code",{className:"rounded bg-gray-100 px-1",children:"wp-blocks/acf-blocks/AcfFeaturedCourseBlock.tsx"})," — ACF block (WordPress binding: fragment + adapter)"]})]})]})]})}}},function(e){e.O(0,[1340,2888,9774,179],function(){return e(e.s=26511)}),_N_E=e.O()}]);