https://studio.findem.ai/assets/DesignSystems-Di_q1AZY.js

1import{W as me,O as xe,u as ue,r as n,_,j as e,N,by as E,B as p,b7 as Y,cT as H,X as pe,c2 as fe,M as he,S as G,aE as ge,dN as je,bD as be,T as ye,ce as Ne,ak as ke,d as g,C as ve,a4 as we,D as Se,a9 as Ce,hE as ze}from"./index-C-_Qp0pL.js";import{E as De}from"./eye-CzqvBRgF.js";import{P as Le}from"./pen-line-Cee-01vK.js";import{L as Pe}from"./layers-CACXNwOE.js";import{G as _e}from"./globe-DgT1w9OU.js";const Ee=[["path",{d:"M12 4v16",key:"1654pz"}],["path",{d:"M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2",key:"e0r10z"}],["path",{d:"M9 20h6",key:"s66wpe"}]],Fe=me("type",Ee),Ie=".pptx,.zip,.json,.css,.md,.markdown",Me=(s="")=>{const a=[],l=/--([\w-]+):\s*(rgb\([^)]+\)|#[0-9a-fA-F]{3,8})/g;let o;for(;(o=l.exec(s))&&a.length<16;)a.push({name:o[1],value:o[2]});return a},Ue=(s=[])=>[...new Set(s.map(a=>a.family).filter(Boolean))];function k(s){return s?.design_system_id||s?.id||""}function Ae(s){return[s?.name,s?.description,s?.published?"published":"draft",s?.is_default?"default":""].filter(Boolean).join(" ").toLowerCase()}function Be(s){return(s?.name||"").trim().toLowerCase()==="findem illuminate"}function ee({system:s}){const a=!!s?.is_default,l=Be(s);return e.jsx("span",{className:`inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-lg shadow-sm ring-1 ${a||l?"bg-amber-50 text-amber-700 ring-amber-100":"bg-paper text-ink-soft ring-paper-border"}`,children:l?e.jsx(ze,{className:"h-4 w-4 object-contain",alt:""}):e.jsx(E,{size:14,"aria-hidden":"true"})})}function Te({label:s,count:a,muted:l,defaultCollapsed:o=!1,emptyLabel:c,children:f}){const[i,d]=n.useState(o);return e.jsxs("div",{className:"mb-3",children:[e.jsxs(p,{variant:"ghost",size:"sm",onClick:()=>d(r=>!r),"aria-expanded":!i,className:"group h-auto w-full !justify-start gap-1.5 px-2.5 pb-1 pt-3 !text-left",children:[i?e.jsx(Se,{size:13,className:"text-ink-mute"}):e.jsx(Ce,{size:13,className:"text-ink-mute"}),e.jsx("span",{className:`text-[11px] font-semibold uppercase tracking-[0.12em] group-hover:text-ink ${l?"text-ink-mute":"text-ink-soft"}`,children:s}),typeof a=="number"?e.jsx("span",{className:"ml-1 text-[11px] font-medium text-ink-mute",children:a}):null]}),i?null:a>0?f:e.jsx("p",{className:"px-4 py-2 text-[12px] leading-5 text-ink-mute",children:c})]})}function Oe({system:s,active:a,onClick:l}){return e.jsxs(p,{variant:"ghost",onClick:l,className:`h-auto w-full !justify-start gap-3 rounded-lg px-2.5 py-2 !text-left transition-colors ${a?"!bg-paper-active text-ink":"text-ink-soft hover:!bg-paper-soft hover:text-ink"}`,children:[e.jsx(ee,{system:s}),e.jsxs("span",{className:"min-w-0 flex-1",children:[e.jsx("span",{className:"block truncate text-left text-[13.5px] font-medium",children:s.name}),s.description?e.jsx("span",{className:"block truncate text-left text-[11.5px] font-normal text-ink-mute",children:s.description}):null]}),s.is_default?e.jsx(g,{tone:"warning",className:"rounded px-1.5 py-0.5 text-[10px] uppercase tracking-wide",children:"Default"}):s.published?e.jsx(g,{tone:"success",className:"rounded px-1.5 py-0.5 text-[10px] uppercase tracking-wide",children:"Live"}):e.jsx(g,{tone:"neutral",className:"rounded px-1.5 py-0.5 text-[10px] uppercase tracking-wide",children:"Draft"})]})}function $({label:s,systems:a,selectedId:l,onSelect:o,emptyLabel:c,muted:f,defaultCollapsed:i}){return e.jsx(Te,{label:s,count:a.length,muted:f,emptyLabel:c,defaultCollapsed:i,children:e.jsx("div",{className:"space-y-0.5",children:a.map(d=>{const r=k(d);return e.jsx(Oe,{system:d,active:r===l,onClick:()=>o(r)},r)})})})}function R({label:s,value:a}){return e.jsxs("div",{className:"min-w-0",children:[e.jsx("p",{className:"text-[11px] font-semibold uppercase tracking-[0.12em] text-ink-mute",children:s}),e.jsx("p",{className:"mt-1 truncate text-[13px] font-medium text-ink",children:a})]})}function $e({items:s}){return s.length?e.jsx("div",{className:"flex flex-wrap gap-2",children:s.map(a=>e.jsxs("span",{title:`--${a.name}: ${a.value}`,className:"flex items-center gap-1.5 rounded-md border border-paper-border bg-paper px-2 py-1 text-[11px] text-ink-soft",children:[e.jsx("span",{className:"h-3.5 w-3.5 rounded-sm border border-stone-300",style:{background:a.value}}),a.name]},a.name))}):e.jsx("p",{className:"text-[13px] text-ink-mute",children:"No colour tokens found."})}function Re({system:s,detail:a,loading:l,error:o,success:c,busy:f,onMakeDefault:i}){if(!s)return e.jsx("div",{className:"flex h-full items-center justify-center p-10",children:e.jsx(Ne,{icon:e.jsx(E,{size:28}),title:"Select a design system",description:"Pick a system on the left to inspect tokens, fonts, components, and guidance.",className:"max-w-sm"})});const d=k(s),r=a||s,x=r.components||[],v=Ue(r.fonts||[]),D=Me(r.tokens_css||""),w=s.published?"Published":"Draft",h=f===d;return e.jsxs("div",{className:"w-full max-w-5xl px-4 py-5 sm:px-8 sm:py-7",children:[o?e.jsx(N,{tone:"warning",icon:e.jsx(ke,{size:14}),className:"mb-5",children:o}):null,c?e.jsx(N,{tone:"success",className:"mb-5",children:c}):null,e.jsxs("div",{className:"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between",children:[e.jsxs("div",{className:"flex min-w-0 items-start gap-3",children:[e.jsx(ee,{system:s}),e.jsxs("div",{className:"min-w-0",children:[e.jsxs("div",{className:"flex flex-wrap items-center gap-2",children:[e.jsx("h1",{className:"truncate text-xl font-semibold text-ink",children:s.name}),s.is_default?e.jsx(g,{tone:"warning",children:"Personal default"}):null,s.published?e.jsx(g,{tone:"success",children:"Published"}):e.jsx(g,{children:"Draft"})]}),e.jsx("p",{className:"mt-1 max-w-3xl text-[13px] leading-5 text-ink-soft",children:s.description||"A design system for rendered Studio deliverables."})]})]}),e.jsxs("div",{className:"flex shrink-0 flex-wrap items-center gap-2",children:[e.jsx(p,{variant:"primary",size:"sm",iconLeft:e.jsx(De,{size:14}),children:"Preview"}),e.jsx(p,{size:"sm",iconLeft:e.jsx(Le,{size:14}),disabled:!0,title:"Editing tokens and fonts is coming next.",children:"Edit"}),s.is_default?null:e.jsx(p,{size:"sm",loading:h,onClick:()=>i(d),iconLeft:h?null:e.jsx(ve,{size:14}),children:"Use this system"})]})]}),e.jsxs("div",{className:"mt-6 grid gap-4 border-y border-paper-border py-4 sm:grid-cols-3",children:[e.jsx(R,{label:"Status",value:w}),e.jsx(R,{label:"Components",value:`${s.component_count||x.length||0} components`}),e.jsx(R,{label:"Fonts",value:`${s.font_count||v.length||0} fonts`})]}),l?e.jsx("div",{className:"mt-6 flex min-h-[360px] items-center justify-center",children:e.jsx(G,{size:"sm",label:"Loading design system..."})}):e.jsxs("div",{className:"mt-6 space-y-8 pb-8",children:[e.jsxs("section",{children:[e.jsx("p",{className:"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ink-mute",children:"Colours"}),e.jsx($e,{items:D})]}),e.jsxs("section",{className:"grid gap-6 lg:grid-cols-[minmax(0,0.65fr)_minmax(0,1fr)]",children:[e.jsxs("div",{children:[e.jsxs("p",{className:"mb-2 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-[0.12em] text-ink-mute",children:[e.jsx(Fe,{size:13})," Fonts"]}),v.length?e.jsx("ul",{className:"space-y-1 text-[13px] leading-5 text-ink-soft",children:v.map(u=>e.jsx("li",{children:u},u))}):e.jsx("p",{className:"text-[13px] text-ink-mute",children:"No fonts listed."})]}),e.jsxs("div",{children:[e.jsxs("p",{className:"mb-2 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-[0.12em] text-ink-mute",children:[e.jsx(Pe,{size:13})," Components"]}),x.length?e.jsx("div",{className:"flex flex-wrap gap-1.5",children:x.map(u=>e.jsx(g,{children:u.id||u.name},u.id||u.name))}):e.jsx("p",{className:"text-[13px] text-ink-mute",children:"No components listed."})]})]}),r.readme_md?e.jsxs("section",{children:[e.jsxs("div",{className:"mb-2 flex flex-wrap items-center justify-between gap-3",children:[e.jsxs("p",{className:"flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-[0.12em] text-ink-mute",children:[e.jsx(we,{size:13})," Guidance"]}),e.jsx(g,{tone:"neutral",children:"Scrolls with this pane"})]}),e.jsx("div",{className:"whitespace-pre-wrap rounded-lg border border-paper-border bg-paper px-4 py-3 font-mono text-[12px] leading-6 text-ink-soft",children:r.readme_md})]}):null,e.jsxs("p",{className:"flex items-center gap-1.5 border-t border-paper-border pt-4 text-[11.5px] text-ink-mute",children:[e.jsx(_e,{size:12}),"Upload a reference deck or packaged system anytime; published systems are immediately available to artifact and workflow renders."]})]})]})}function Je(){const s=xe(),{isOrgMcpScope:a,isMcpOrgAdmin:l,mcpScopeLabel:o}=ue(),[c,f]=n.useState([]),[i,d]=n.useState(!0),[r,x]=n.useState(""),[v,D]=n.useState(""),[w,h]=n.useState(null),[u,F]=n.useState(null),[se,X]=n.useState(!1),[te,W]=n.useState(""),[y,ae]=n.useState(""),[I,ne]=n.useState(!1),[le,M]=n.useState(!1),[S,U]=n.useState(null),[A,L]=n.useState(""),[Z,B]=n.useState(!1),[j,q]=n.useState(!1),[J,C]=n.useState(""),T=n.useRef(null),P=n.useCallback(()=>a?(f([]),d(!1),Promise.resolve()):(d(!0),x(""),_.list().then(t=>f(Array.isArray(t?.designSystems)?t.designSystems:[])).catch(t=>x(t?.message||"Could not load design systems.")).finally(()=>d(!1))),[a]);n.useEffect(()=>{P()},[P]);const z=n.useMemo(()=>{const t=y.trim().toLowerCase();return t?c.filter(m=>Ae(m).includes(t)):c},[y,c]),O=z.filter(t=>t.is_default),K=z.filter(t=>!t.is_default&&t.published),Q=z.filter(t=>!t.is_default&&!t.published),ie=O[0]?k(O[0]):k(K[0]||Q[0]||z[0]),b=w&&z.some(t=>k(t)===w)?w:ie,re=c.find(t=>k(t)===b)||null;n.useEffect(()=>{if(a||!b||i){F(null);return}let t=!0;return F(null),X(!0),x(""),_.get(b).then(m=>{t&&F(m?.designSystem||null)}

1).catch(m=>{t&&x(m?.message||"Could not load the design system.")}).finally(()=>{t&&X(!1)}),()=>{t=!1}},[b,a,i]);const oe=async t=>{W(t);try{await _.setDefault(t),h(t),await P()}catch(m){x(m?.message||"Could not set the default.")}finally{W("")}},V=()=>{j||(M(!1),U(null),L(""),B(!1),C(""),T.current&&(T.current.value=""))},ce=t=>{U(t||null),C(""),t&&!A.trim()&&L(t.name.replace(/\.[^.]+$/,"").replace(/[_-]+/g," "))},de=async()=>{if(!S||j){S||C("Choose a file to upload.");return}q(!0),C(""),D("");try{const m=(await _.upload(S,{name:A,makeDefault:Z}))?.designSystem;await P(),m?.design_system_id&&h(m.design_system_id),D(`${m?.name||"Design system"} is ready for your Personal workspace.`),M(!1),U(null),L(""),B(!1)}catch(t){C(t?.message||"Could not import the design system.")}finally{q(!1)}};if(a){const t=o||"this MCP organization";return e.jsxs("div",{className:"mx-auto w-full max-w-3xl px-4 py-10 sm:px-8",children:[e.jsx("h1",{className:"text-xl font-semibold text-ink",children:"Design systems"}),e.jsxs(N,{tone:"info",icon:e.jsx(E,{size:14}),className:"mt-4 text-[13px] leading-6",children:[e.jsxs("strong",{className:"font-semibold",children:["Scope: ",t,"."]})," ","Organization branding applies to compatible outputs from every public agent in this workspace.",l?" Manage it from the Agents page so its organization-wide impact is clear.":" Only an organization owner or admin can change it."," ","Switch to Personal to choose a design system for your own Personal runs."]}),e.jsxs("div",{className:"mt-5 flex flex-wrap gap-2",children:[l?e.jsx(p,{variant:"primary",onClick:()=>s("/agents?branding=1"),children:"Open org branding"}):null,e.jsx(p,{variant:"secondary",onClick:()=>s("/agents"),children:"Back to agents"})]})]})}return e.jsxs("div",{className:"flex min-h-full flex-col text-ink md:h-full md:min-h-0 md:overflow-hidden md:flex-row",children:[e.jsxs("aside",{className:"flex shrink-0 flex-col border-b border-paper-border md:min-h-0 md:w-[320px] md:border-b-0 md:border-r",children:[e.jsxs("div",{className:"flex items-center justify-between gap-2 px-4 pb-2 pt-5",children:[e.jsxs("div",{className:"min-w-0",children:[e.jsx("p",{className:"text-[11px] font-semibold uppercase tracking-[0.12em] text-ink-mute",children:"Workspace"}),e.jsx("h1",{className:"mt-1 text-lg font-semibold text-ink",children:"Design systems"})]}),e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(Y,{label:"Upload design system",icon:e.jsx(H,{size:16}),variant:"ghost",size:"icon",onClick:()=>M(!0),className:"h-8 w-8 text-ink-mute"}),e.jsx(Y,{label:I?"Close design system search":"Search design systems",icon:I?e.jsx(pe,{size:16}):e.jsx(fe,{size:16}),variant:"ghost",size:"icon",onClick:()=>ne(t=>!t),className:"h-8 w-8 text-ink-mute"})]})]}),e.jsxs(N,{tone:"info",icon:e.jsx(E,{size:14}),className:"mx-4 mb-3 text-[12px] leading-5",children:[e.jsx("strong",{className:"font-semibold",children:"Scope: Personal."})," ","Your default design system styles compatible outputs from public agents you run in Personal. It does not change their output formats or affect an MCP organization."]}),e.jsxs("div",{className:"flex-1 px-2 pb-6 md:min-h-0 md:overflow-y-auto",children:[I?e.jsx("div",{className:"pb-2",children:e.jsx(he,{autoFocus:!0,value:y,onChange:t=>ae(t.target.value),placeholder:"Search design systems",inputClassName:"py-1.5 text-[13px]"})}):null,i?e.jsx("div",{className:"px-3 py-6",children:e.jsx(G,{label:"Loading design systems..."})}):null,i?null:e.jsxs(e.Fragment,{children:[e.jsx($,{label:"Personal default",systems:O,selectedId:b,onSelect:h,emptyLabel:y?"No default system matches this search.":"No Personal default is set."}),e.jsx($,{label:"Published systems",systems:K,selectedId:b,onSelect:h,emptyLabel:y?"No published systems match this search.":"No other published systems yet."}),e.jsx($,{label:"Drafts",systems:Q,selectedId:b,onSelect:h,emptyLabel:y?"No drafts match this search.":"No drafts yet.",muted:!0,defaultCollapsed:!0})]})]})]}),e.jsx("main",{className:"min-w-0 flex-1 md:h-full md:min-h-0 md:overflow-y-auto",children:i?e.jsx("div",{className:"flex h-full items-center justify-center p-10",children:e.jsx(G,{label:"Loading design systems..."})}

1):e.jsx(Re,{system:re,detail:u,loading:se,error:r,success:v,busy:te,onMakeDefault:oe})}),e.jsx(ge,{open:le,onClose:V,title:"Upload design system",description:"Use a reference PPTX deck, or upload a package containing tokens, brand guidance, components and fonts.",footer:e.jsxs(e.Fragment,{children:[e.jsx(p,{onClick:V,disabled:j,children:"Cancel"}),e.jsx(p,{variant:"primary",onClick:de,loading:j,iconLeft:e.jsx(H,{size:14}),children:"Import design system"})]}),children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(je,{inputRef:T,label:"Design-system file",accept:Ie,disabled:j,selectedLabel:S?.name||"No file selected",buttonLabel:S?"Replace file":"Choose file",hint:"PPTX, ZIP, JSON, CSS or Markdown · maximum 25 MB",onChange:t=>ce(t.target.files?.[0]||null)}),e.jsx(be,{label:"Name",value:A,onChange:t=>L(t.target.value),placeholder:"e.g. Acme executive presentations",hint:"Defaults to the uploaded filename.",disabled:j}),e.jsx(ye,{checked:Z,onChange:B,disabled:j,label:"Make this my Personal default"}),e.jsx(N,{tone:"info",className:"text-[13px]",children:"PowerPoint imports extract theme colours, fonts, slide ratio and layout families. ZIP packages can include README.md or SKILL.md, tokens.css, components/*.html and fonts/."}),J?e.jsx(N,{tone:"danger",children:J}):null]})})]})}export{Je as default};