@jogak/ui 0.1.0-alpha.11 → 0.1.0-alpha.12

package/dist/index.cjs

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),i=require("react"),C=require("@jogak/core"),h=require("@jogak/core/renderers/react"),E=require("prism-react-renderer"),X=require("react-dom");function B(o){var e,t,r="";if(typeof o=="string"||typeof o=="number")r+=o;else if(typeof o=="object")if(Array.isArray(o)){var g=o.length;for(e=0;e<g;e++)o[e]&&(t=B(o[e]))&&(r&&(r+=" "),r+=t)}else for(t in o)o[t]&&(r&&(r+=" "),r+=t);return r}function w(){for(var o,e,t=0,r="",g=arguments.length;t<g;t++)(o=arguments[t])&&(e=B(o))&&(r&&(r+=" "),r+=e);return r}function W({selectedEntryId:o,selectedJogakName:e,onSelect:t}){const[r,g]=i.useState(""),{metaTree:n,searchMeta:s}=h.useRegistryMeta(),l=r.trim().length>0?s(r):null;return a.jsxs("aside",{"data-testid":"sidebar",className:"jogak:flex jogak:flex-col jogak:h-full jogak:overflow-auto jogak:border-r jogak:border-[var(--jogak-color-border)]",children:[a.jsx("div",{className:"jogak:p-3 jogak:border-b jogak:border-[var(--jogak-color-border)]",children:a.jsx("input",{type:"search",placeholder:"Search components...",value:r,onChange:c=>{g(c.target.value)},className:"jogak:w-full jogak:px-2 jogak:py-1.5 jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-md)]","aria-label":"Search components"})}),a.jsx("nav",{className:"jogak:flex-1 jogak:overflow-auto jogak:py-2",children:l!==null?a.jsx(Y,{metas:l,selectedEntryId:o,selectedJogakName:e,onSelect:t}):a.jsx(D,{node:n,selectedEntryId:o,selectedJogakName:e,onSelect:t})})]})}function Y({metas:o,selectedEntryId:e,selectedJogakName:t,onSelect:r}){return o.length===0?a.jsx("p",{className:"jogak:px-3 jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px]",children:"No results"}):a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:p-0",children:o.map(g=>a.jsx("li",{children:a.jsx(z,{meta:g,selectedEntryId:e,selectedJogakName:t,onSelect:r,indent:0})},g.id))})}function D({node:o,selectedEntryId:e,selectedJogakName:t,onSelect:r,depth:g=0}){return a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:pr-0 jogak:py-0 jogak:pl-[var(--jogak-tree-pl)]",style:{"--jogak-tree-pl":`${g*12}px`},children:Object.entries(o).map(([n,s])=>a.jsx("li",{children:"id"in s?a.jsx(z,{meta:s,selectedEntryId:e,selectedJogakName:t,onSelect:r,indent:0}):a.jsx(Z,{label:n,node:s,selectedEntryId:e,selectedJogakName:t,onSelect:r,depth:g+1})},n))})}function Z({label:o,node:e,selectedEntryId:t,selectedJogakName:r,onSelect:g,depth:n}){const[s,l]=i.useState(!0);return a.jsxs("div",{children:[a.jsxs("button",{type:"button",onClick:()=>{l(c=>!c)},className:"jogak:flex jogak:items-center jogak:gap-1 jogak:w-full jogak:px-3 jogak:py-1 jogak:bg-transparent jogak:border-none jogak:cursor-pointer jogak:text-[12px] jogak:font-semibold jogak:text-[var(--jogak-color-fg-muted)] jogak:uppercase jogak:tracking-wider","aria-expanded":s,children:[a.jsx("span",{children:s?"▾":"▸"}),o]}),s&&a.jsx(D,{node:e,selectedEntryId:t,selectedJogakName:r,onSelect:g,depth:n})]})}function z({meta:o,selectedEntryId:e,selectedJogakName:t,onSelect:r,indent:g}){const n=o.id===e,[s,l]=i.useState(n);i.useEffect(()=>{n&&l(!0)},[n]);const c=o.title.split("/").pop()??o.title,d=16+g*12;return a.jsxs("div",{children:[a.jsxs("button",{type:"button",onClick:()=>{if(n)l(j=>!j);else{l(!0);const j=o.jogakNames[0];j!==void 0&&r(o.id,j)}},className:w("jogak:flex jogak:items-center jogak:gap-1.5 jogak:w-full jogak:pr-3 jogak:py-[5px]","jogak:pl-[var(--jogak-entry-pl)]","jogak:border-none jogak:cursor-pointer jogak:text-left jogak:text-[13px]",n?"jogak:bg-[var(--jogak-color-accent-bg)] jogak:text-[var(--jogak-color-accent)] jogak:font-medium":"jogak:bg-transparent jogak:text-[var(--jogak-color-fg)] jogak:font-normal"),style:{"--jogak-entry-pl":`${d}px`},"aria-expanded":s,children:[a.jsx("span",{className:"jogak:text-[10px] jogak:shrink-0 jogak:leading-none",children:s?"▾":"▸"}),c]}),s&&a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:p-0",children:o.jogakNames.map(j=>{const k=n&&j===t;return a.jsx("li",{children:a.jsx("button",{type:"button",onClick:()=>{r(o.id,j)},className:w("jogak:block jogak:w-full jogak:text-left jogak:pr-3 jogak:py-1","jogak:pl-[var(--jogak-jogak-pl)]","jogak:border-none jogak:cursor-pointer jogak:text-[12px]",k?"jogak:bg-[var(--jogak-color-accent-bg-soft)] jogak:text-[var(--jogak-color-accent-fg)] jogak:font-medium":"jogak:bg-transparent jogak:text-[var(--jogak-color-fg-muted)] jogak:font-normal"),style:{"--jogak-jogak-pl":`${d+18}px`},"aria-current":k?"true":void 0,children:j})},j)})})]})}function K(o,e){const t=e==null?void 0:e.control,r=(e==null?void 0:e.action)!==void 0&&e.action!==!1,g=(e==null?void 0:e.type)==="function"||typeof o=="function";return r||g?"action":t==="boolean"||typeof o=="boolean"?"boolean":t==="number"||t==="range"||typeof o=="number"?"number":t==="select"||t==="radio"||(e==null?void 0:e.options)!==void 0&&e.options.length>0?"select":t==="text"||t==="color"||typeof o=="string"?"text":"json"}const R="jogak:px-2 jogak:py-1 jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-md)] jogak:text-[13px] jogak:w-full jogak:max-w-[280px]",A="jogak:px-5 jogak:py-1.5 jogak:text-left jogak:text-[var(--jogak-color-fg-muted)] jogak:font-medium jogak:text-[12px] jogak:border-b jogak:border-[var(--jogak-color-border)]",_="jogak:px-5 jogak:py-2 jogak:align-middle jogak:border-b jogak:border-[var(--jogak-color-border-muted)]";function T({argKey:o,value:e,argType:t,onArgChange:r}){switch(K(e,t)){case"boolean":return a.jsx("input",{type:"checkbox",checked:e===!0,onChange:n=>{r(o,n.target.checked)},className:"jogak:cursor-pointer jogak:w-4 jogak:h-4 jogak:accent-[var(--jogak-color-accent)]"});case"number":return a.jsx("input",{type:"number",value:typeof e=="number"?e:"",onChange:n=>{r(o,n.target.valueAsNumber)},className:R});case"select":{const n=(t==null?void 0:t.options)??[];return a.jsx("select",{value:String(e??""),onChange:s=>{r(o,s.target.value)},className:R,children:n.map(s=>a.jsx("option",{value:String(s),children:String(s)},String(s)))})}case"text":return a.jsx("input",{type:"text",value:typeof e=="string"?e:String(e??""),onChange:n=>{r(o,n.target.value)},className:R});case"action":return a.jsx("span",{className:"jogak:inline-block jogak:px-2 jogak:py-0.5 jogak:text-[11px] jogak:font-semibold jogak:text-[var(--jogak-color-violet)] jogak:bg-[var(--jogak-color-violet-bg)] jogak:border jogak:border-[var(--jogak-color-violet-border)] jogak:rounded-[var(--jogak-radius-md)] jogak:font-[family-name:var(--jogak-font-mono)] jogak:leading-none",children:"(action)"});case"json":return a.jsx("code",{className:"jogak:text-[12px] jogak:text-[var(--jogak-color-fg-muted)] jogak:font-[family-name:var(--jogak-font-mono)]",children:JSON.stringify(e)})}}function H({args:o,argTypes:e,onArgChange:t}){const g=Array.from(new Set([...Object.keys(o),...Object.keys(e)])).map(n=>[n,o[n]]);return a.jsxs("div",{className:"jogak:border-t-2 jogak:border-[var(--jogak-color-border)]",children:[a.jsx("div",{className:"jogak:px-5 jogak:py-1.5 jogak:text-[11px] jogak:font-bold jogak:text-[var(--jogak-color-fg-subtle)] jogak:uppercase jogak:tracking-[0.08em] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:bg-[var(--jogak-color-bg-subtle)]",children:"Controls"}),g.length===0?a.jsx("div",{className:"jogak:px-5 jogak:py-3 jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px]",children:"No args defined"}):a.jsxs("table",{className:"jogak:w-full jogak:border-collapse jogak:text-[13px]",children:[a.jsx("thead",{children:a.jsxs("tr",{children:[a.jsx("th",{className:A,children:"Name"}),a.jsx("th",{className:A,children:"Control"}),a.jsx("th",{className:A,children:"Description"})]})}),a.jsx("tbody",{children:g.map(([n,s])=>{const l=e[n];return a.jsxs("tr",{children:[a.jsx("td",{className:w(_,"jogak:font-[family-name:var(--jogak-font-mono)] jogak:text-[12px] jogak:text-[var(--jogak-color-fg)] jogak:whitespace-nowrap"),children:n}),a.jsx("td",{className:_,children:a.jsx(T,{argKey:n,value:s,argType:l,onArgChange:t})}),a.jsx("td",{className:w(_,"jogak:text-[var(--jogak-color-fg-subtle)]"),children:(l==null?void 0:l.description)??""})]},n)})})]})]})}function oo(o){if(o.length===0)return"()";try{return o.map(e=>{var t;if(e===null)return"null";if(e===void 0)return"undefined";if(typeof e=="function")return"[Function]";if(typeof e=="object"){const r=((t=e.constructor)==null?void 0:t.name)??"Object";return r!=="Object"&&r!=="Array"?`[${r}]`:JSON.stringify(e)}return JSON.stringify(e)}).join(", ")}catch{return"[unserializable]"}}function eo(o){const e=new Date(o),t=e.getHours().toString().padStart(2,"0"),r=e.getMinutes().toString().padStart(2,"0"),g=e.getSeconds().toString().padStart(2,"0"),n=e.getMilliseconds().toString().padStart(3,"0");return`${t}:${r}:${g}.${n}`}function F(){const[o,e]=i.useState(()=>C.defaultActionChannel.getLogs());i.useEffect(()=>C.defaultActionChannel.subscribe(e),[]);const t=o.length===0;return a.jsxs("div",{className:"jogak:h-full jogak:flex jogak:flex-col",children:[a.jsxs("div",{className:"jogak:px-5 jogak:py-1.5 jogak:text-[11px] jogak:font-bold jogak:text-[var(--jogak-color-fg-subtle)] jogak:uppercase jogak:tracking-[0.08em] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:bg-[var(--jogak-color-bg-subtle)] jogak:flex jogak:items-center jogak:justify-between jogak:shrink-0",children:[a.jsxs("span",{children:["Actions ",o.length>0&&`(${o.length.toString()})`]}),a.jsx("button",{type:"button",onClick:()=>{C.defaultActionChannel.clear()},disabled:t,className:w("jogak:text-[10px] jogak:font-semibold jogak:px-2 jogak:py-0.5 jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-sm)] jogak:bg-[var(--jogak-color-bg)] jogak:normal-case jogak:tracking-normal",t?"jogak:text-[var(--jogak-color-fg-subtle)] jogak:cursor-default":"jogak:text-[var(--jogak-color-fg)] jogak:cursor-pointer"),children:"Clear"})]}),a.jsx("div",{className:"jogak:flex-1 jogak:overflow-auto",children:t?a.jsx("div",{className:"jogak:px-5 jogak:py-3 jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px] jogak:leading-none",children:"함수 prop이 호출되면 여기에 기록됩니다"}):a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:p-0 jogak:font-[family-name:var(--jogak-font-mono)] jogak:text-[12px]",children:o.map(r=>a.jsxs("li",{className:"jogak:flex jogak:items-baseline jogak:gap-[10px] jogak:px-5 jogak:py-1.5 jogak:border-b jogak:border-[var(--jogak-color-border-muted)]",children:[a.jsx("span",{className:"jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[11px] jogak:min-w-[92px]",children:eo(r.timestamp)}),a.jsx("span",{className:"jogak:text-[var(--jogak-color-violet)] jogak:font-semibold",children:r.name}),a.jsxs("span",{className:"jogak:text-[var(--jogak-color-fg)] jogak:break-all jogak:flex-1",children:["(",oo(r.args),")"]})]},r.id))})})]})}function ao({children:o,className:e,style:t,"data-testid":r}){const g=i.useRef(null),[n,s]=i.useState(null);return i.useEffect(()=>{const l=g.current;if(l===null)return;const c=l.shadowRoot??l.attachShadow({mode:"open"});s(c)},[]),a.jsx("div",{ref:g,className:e,"data-testid":r,style:t,children:n!==null?X.createPortal(o,n):null})}function to({entry:o,args:e,userPreviewUrl:t,previewEntryPath:r,className:g,"data-testid":n}){const s=i.useRef(null),[l,c]=i.useState(!1),d=t!==""?`${t}${r}`:"/preview-frame.html";return i.useEffect(()=>{const j=k=>{const p=s.current;if(p===null||k.source!==p.contentWindow)return;const f=k.data;f==null||typeof f!="object"||f.type==="jogak:ready"&&c(!0)};return window.addEventListener("message",j),()=>{window.removeEventListener("message",j)}},[]),i.useEffect(()=>{var k;if(!l)return;const j=s.current;j!==null&&((k=j.contentWindow)==null||k.postMessage({type:"jogak:setProps",entryId:o.id,args:e},"*"))},[l,o,e]),i.useEffect(()=>{const j=s.current;return()=>{j!==null&&queueMicrotask(()=>{var k;(k=j.contentWindow)==null||k.postMessage({type:"jogak:unmount"},"*")})}},[]),a.jsx("iframe",{ref:s,src:d,title:"Preview",className:g,"data-testid":n})}const ro=60;function no(o,e){const t=so(o),{children:r,restProps:g}=go(e),n=Object.entries(g).filter(([,k])=>k!==void 0).map(([k,p])=>lo(k,p)),s=jo(r),l=s!==null,c=n.length===0?"":" "+n.join(" "),d=l?`<${t}${c}>${s??""}</${t}>`:`<${t}${c} />`;if(d.length<=ro&&!d.includes(`
-`))return d;const j=n.length===0?"":`
-  `+n.join(`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("react"),C=require("@jogak/core"),h=require("@jogak/core/renderers/react"),E=require("prism-react-renderer"),X=require("react-dom");function D(o){var e,t,r="";if(typeof o=="string"||typeof o=="number")r+=o;else if(typeof o=="object")if(Array.isArray(o)){var g=o.length;for(e=0;e<g;e++)o[e]&&(t=D(o[e]))&&(r&&(r+=" "),r+=t)}else for(t in o)o[t]&&(r&&(r+=" "),r+=t);return r}function v(){for(var o,e,t=0,r="",g=arguments.length;t<g;t++)(o=arguments[t])&&(e=D(o))&&(r&&(r+=" "),r+=e);return r}function B({selectedEntryId:o,selectedJogakName:e,onSelect:t}){const[r,g]=c.useState(""),{metaTree:s,searchMeta:n}=h.useRegistryMeta(),i=r.trim().length>0?n(r):null;return a.jsxs("aside",{"data-testid":"sidebar",className:"jogak:flex jogak:flex-col jogak:h-full jogak:overflow-auto jogak:border-r jogak:border-[var(--jogak-color-border)]",children:[a.jsx("div",{className:"jogak:p-3 jogak:border-b jogak:border-[var(--jogak-color-border)]",children:a.jsx("input",{type:"search",placeholder:"Search components...",value:r,onChange:j=>{g(j.target.value)},className:"jogak:w-full jogak:px-2 jogak:py-1.5 jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-md)]","aria-label":"Search components"})}),a.jsx("nav",{className:"jogak:flex-1 jogak:overflow-auto jogak:py-2",children:i!==null?a.jsx(Y,{metas:i,selectedEntryId:o,selectedJogakName:e,onSelect:t}):a.jsx(W,{node:s,selectedEntryId:o,selectedJogakName:e,onSelect:t})})]})}function Y({metas:o,selectedEntryId:e,selectedJogakName:t,onSelect:r}){return o.length===0?a.jsx("p",{className:"jogak:px-3 jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px]",children:"No results"}):a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:p-0",children:o.map(g=>a.jsx("li",{children:a.jsx(z,{meta:g,selectedEntryId:e,selectedJogakName:t,onSelect:r,indent:0})},g.id))})}function W({node:o,selectedEntryId:e,selectedJogakName:t,onSelect:r,depth:g=0}){return a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:pr-0 jogak:py-0 jogak:pl-[var(--jogak-tree-pl)]",style:{"--jogak-tree-pl":`${g*12}px`},children:Object.entries(o).map(([s,n])=>a.jsx("li",{children:"id"in n?a.jsx(z,{meta:n,selectedEntryId:e,selectedJogakName:t,onSelect:r,indent:0}):a.jsx(Z,{label:s,node:n,selectedEntryId:e,selectedJogakName:t,onSelect:r,depth:g+1})},s))})}function Z({label:o,node:e,selectedEntryId:t,selectedJogakName:r,onSelect:g,depth:s}){const[n,i]=c.useState(!0);return a.jsxs("div",{children:[a.jsxs("button",{type:"button",onClick:()=>{i(j=>!j)},className:"jogak:flex jogak:items-center jogak:gap-1 jogak:w-full jogak:px-3 jogak:py-1 jogak:bg-transparent jogak:border-none jogak:cursor-pointer jogak:text-[12px] jogak:font-semibold jogak:text-[var(--jogak-color-fg-muted)] jogak:uppercase jogak:tracking-wider","aria-expanded":n,children:[a.jsx("span",{children:n?"▾":"▸"}),o]}),n&&a.jsx(W,{node:e,selectedEntryId:t,selectedJogakName:r,onSelect:g,depth:s})]})}function z({meta:o,selectedEntryId:e,selectedJogakName:t,onSelect:r,indent:g}){const s=o.id===e,[n,i]=c.useState(s);c.useEffect(()=>{s&&i(!0)},[s]);const j=o.title.split("/").pop()??o.title,d=16+g*12;return a.jsxs("div",{children:[a.jsxs("button",{type:"button",onClick:()=>{if(s)i(l=>!l);else{i(!0);const l=o.jogakNames[0];l!==void 0&&r(o.id,l)}},className:v("jogak:flex jogak:items-center jogak:gap-1.5 jogak:w-full jogak:pr-3 jogak:py-[5px]","jogak:pl-[var(--jogak-entry-pl)]","jogak:border-none jogak:cursor-pointer jogak:text-left jogak:text-[13px]",s?"jogak:bg-[var(--jogak-color-accent-bg)] jogak:text-[var(--jogak-color-accent)] jogak:font-medium":"jogak:bg-transparent jogak:text-[var(--jogak-color-fg)] jogak:font-normal"),style:{"--jogak-entry-pl":`${d}px`},"aria-expanded":n,children:[a.jsx("span",{className:"jogak:text-[10px] jogak:shrink-0 jogak:leading-none",children:n?"▾":"▸"}),j]}),n&&a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:p-0",children:o.jogakNames.map(l=>{const k=s&&l===t;return a.jsx("li",{children:a.jsx("button",{type:"button",onClick:()=>{r(o.id,l)},className:v("jogak:block jogak:w-full jogak:text-left jogak:pr-3 jogak:py-1","jogak:pl-[var(--jogak-jogak-pl)]","jogak:border-none jogak:cursor-pointer jogak:text-[12px]",k?"jogak:bg-[var(--jogak-color-accent-bg-soft)] jogak:text-[var(--jogak-color-accent-fg)] jogak:font-medium":"jogak:bg-transparent jogak:text-[var(--jogak-color-fg-muted)] jogak:font-normal"),style:{"--jogak-jogak-pl":`${d+18}px`},"aria-current":k?"true":void 0,children:l})},l)})})]})}function K(o,e){const t=e==null?void 0:e.control,r=(e==null?void 0:e.action)!==void 0&&e.action!==!1,g=(e==null?void 0:e.type)==="function"||typeof o=="function";return r||g?"action":t==="boolean"||typeof o=="boolean"?"boolean":t==="number"||t==="range"||typeof o=="number"?"number":t==="select"||t==="radio"||(e==null?void 0:e.options)!==void 0&&e.options.length>0?"select":t==="text"||t==="color"||typeof o=="string"?"text":"json"}const _="jogak:px-2 jogak:py-1 jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-md)] jogak:text-[13px] jogak:w-full jogak:max-w-[280px]",R="jogak:px-5 jogak:py-1.5 jogak:text-left jogak:text-[var(--jogak-color-fg-muted)] jogak:font-medium jogak:text-[12px] jogak:border-b jogak:border-[var(--jogak-color-border)]",A="jogak:px-5 jogak:py-2 jogak:align-middle jogak:border-b jogak:border-[var(--jogak-color-border-muted)]";function T({argKey:o,value:e,argType:t,onArgChange:r}){switch(K(e,t)){case"boolean":return a.jsx("input",{type:"checkbox",checked:e===!0,onChange:s=>{r(o,s.target.checked)},className:"jogak:cursor-pointer jogak:w-4 jogak:h-4 jogak:accent-[var(--jogak-color-accent)]"});case"number":return a.jsx("input",{type:"number",value:typeof e=="number"?e:"",onChange:s=>{r(o,s.target.valueAsNumber)},className:_});case"select":{const s=(t==null?void 0:t.options)??[];return a.jsx("select",{value:String(e??""),onChange:n=>{r(o,n.target.value)},className:_,children:s.map(n=>a.jsx("option",{value:String(n),children:String(n)},String(n)))})}case"text":return a.jsx("input",{type:"text",value:typeof e=="string"?e:String(e??""),onChange:s=>{r(o,s.target.value)},className:_});case"action":return a.jsx("span",{className:"jogak:inline-block jogak:px-2 jogak:py-0.5 jogak:text-[11px] jogak:font-semibold jogak:text-[var(--jogak-color-violet)] jogak:bg-[var(--jogak-color-violet-bg)] jogak:border jogak:border-[var(--jogak-color-violet-border)] jogak:rounded-[var(--jogak-radius-md)] jogak:font-[family-name:var(--jogak-font-mono)] jogak:leading-none",children:"(action)"});case"json":return a.jsx("code",{className:"jogak:text-[12px] jogak:text-[var(--jogak-color-fg-muted)] jogak:font-[family-name:var(--jogak-font-mono)]",children:JSON.stringify(e)})}}function H({args:o,argTypes:e,onArgChange:t}){const g=Array.from(new Set([...Object.keys(o),...Object.keys(e)])).map(n=>[n,o[n]]),s=g.some(([n])=>{var i;return((i=e[n])==null?void 0:i.defaultValue)!==void 0});return a.jsxs("div",{className:"jogak:border-t-2 jogak:border-[var(--jogak-color-border)]",children:[a.jsx("div",{className:"jogak:px-5 jogak:py-1.5 jogak:text-[11px] jogak:font-bold jogak:text-[var(--jogak-color-fg-subtle)] jogak:uppercase jogak:tracking-[0.08em] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:bg-[var(--jogak-color-bg-subtle)]",children:"Controls"}),g.length===0?a.jsx("div",{className:"jogak:px-5 jogak:py-3 jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px]",children:"No args defined"}):a.jsxs("table",{className:"jogak:w-full jogak:border-collapse jogak:text-[13px]",children:[a.jsx("thead",{children:a.jsxs("tr",{children:[a.jsx("th",{className:R,children:"Name"}),a.jsx("th",{className:R,children:"Control"}),s&&a.jsx("th",{className:R,children:"Default"}),a.jsx("th",{className:R,children:"Description"})]})}),a.jsx("tbody",{children:g.map(([n,i])=>{const j=e[n];return a.jsxs("tr",{children:[a.jsx("td",{className:v(A,"jogak:font-[family-name:var(--jogak-font-mono)] jogak:text-[12px] jogak:text-[var(--jogak-color-fg)] jogak:whitespace-nowrap"),children:n}),a.jsx("td",{className:A,children:a.jsx(T,{argKey:n,value:i,argType:j,onArgChange:t})}),s&&a.jsx("td",{className:v(A,"jogak:font-[family-name:var(--jogak-font-mono)] jogak:text-[12px] jogak:text-[var(--jogak-color-fg-muted)] jogak:whitespace-nowrap"),children:(j==null?void 0:j.defaultValue)!==void 0?oo(j.defaultValue):""}),a.jsx("td",{className:v(A,"jogak:text-[var(--jogak-color-fg-subtle)]"),children:(j==null?void 0:j.description)??""})]},n)})})]})]})}function oo(o){if(typeof o=="string")return`'${o}'`;if(typeof o=="number"||typeof o=="boolean"||o===null)return String(o);try{return JSON.stringify(o)}catch{return String(o)}}function eo(o){if(o.length===0)return"()";try{return o.map(e=>{var t;if(e===null)return"null";if(e===void 0)return"undefined";if(typeof e=="function")return"[Function]";if(typeof e=="object"){const r=((t=e.constructor)==null?void 0:t.name)??"Object";return r!=="Object"&&r!=="Array"?`[${r}]`:JSON.stringify(e)}return JSON.stringify(e)}).join(", ")}catch{return"[unserializable]"}}function ao(o){const e=new Date(o),t=e.getHours().toString().padStart(2,"0"),r=e.getMinutes().toString().padStart(2,"0"),g=e.getSeconds().toString().padStart(2,"0"),s=e.getMilliseconds().toString().padStart(3,"0");return`${t}:${r}:${g}.${s}`}function F(){const[o,e]=c.useState(()=>C.defaultActionChannel.getLogs());c.useEffect(()=>C.defaultActionChannel.subscribe(e),[]);const t=o.length===0;return a.jsxs("div",{className:"jogak:h-full jogak:flex jogak:flex-col",children:[a.jsxs("div",{className:"jogak:px-5 jogak:py-1.5 jogak:text-[11px] jogak:font-bold jogak:text-[var(--jogak-color-fg-subtle)] jogak:uppercase jogak:tracking-[0.08em] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:bg-[var(--jogak-color-bg-subtle)] jogak:flex jogak:items-center jogak:justify-between jogak:shrink-0",children:[a.jsxs("span",{children:["Actions ",o.length>0&&`(${o.length.toString()})`]}),a.jsx("button",{type:"button",onClick:()=>{C.defaultActionChannel.clear()},disabled:t,className:v("jogak:text-[10px] jogak:font-semibold jogak:px-2 jogak:py-0.5 jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-sm)] jogak:bg-[var(--jogak-color-bg)] jogak:normal-case jogak:tracking-normal",t?"jogak:text-[var(--jogak-color-fg-subtle)] jogak:cursor-default":"jogak:text-[var(--jogak-color-fg)] jogak:cursor-pointer"),children:"Clear"})]}),a.jsx("div",{className:"jogak:flex-1 jogak:overflow-auto",children:t?a.jsx("div",{className:"jogak:px-5 jogak:py-3 jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px] jogak:leading-none",children:"함수 prop이 호출되면 여기에 기록됩니다"}):a.jsx("ul",{className:"jogak:list-none jogak:m-0 jogak:p-0 jogak:font-[family-name:var(--jogak-font-mono)] jogak:text-[12px]",children:o.map(r=>a.jsxs("li",{className:"jogak:flex jogak:items-baseline jogak:gap-[10px] jogak:px-5 jogak:py-1.5 jogak:border-b jogak:border-[var(--jogak-color-border-muted)]",children:[a.jsx("span",{className:"jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[11px] jogak:min-w-[92px]",children:ao(r.timestamp)}),a.jsx("span",{className:"jogak:text-[var(--jogak-color-violet)] jogak:font-semibold",children:r.name}),a.jsxs("span",{className:"jogak:text-[var(--jogak-color-fg)] jogak:break-all jogak:flex-1",children:["(",eo(r.args),")"]})]},r.id))})})]})}function to({children:o,className:e,style:t,"data-testid":r}){const g=c.useRef(null),[s,n]=c.useState(null);return c.useEffect(()=>{const i=g.current;if(i===null)return;const j=i.shadowRoot??i.attachShadow({mode:"open"});n(j)},[]),a.jsx("div",{ref:g,className:e,"data-testid":r,style:t,children:s!==null?X.createPortal(o,s):null})}function ro({entry:o,args:e,userPreviewUrl:t,previewEntryPath:r,className:g,"data-testid":s}){const n=c.useRef(null),[i,j]=c.useState(!1),d=t!==""?`${t}${r}`:"/preview-frame.html";return c.useEffect(()=>{const l=k=>{const f=n.current;if(f===null||k.source!==f.contentWindow)return;const p=k.data;p==null||typeof p!="object"||p.type==="jogak:ready"&&j(!0)};return window.addEventListener("message",l),()=>{window.removeEventListener("message",l)}},[]),c.useEffect(()=>{var k;if(!i)return;const l=n.current;l!==null&&((k=l.contentWindow)==null||k.postMessage({type:"jogak:setProps",entryId:o.id,args:e},"*"))},[i,o,e]),c.useEffect(()=>{const l=n.current;return()=>{l!==null&&queueMicrotask(()=>{var k;(k=l.contentWindow)==null||k.postMessage({type:"jogak:unmount"},"*")})}},[]),a.jsx("iframe",{ref:n,src:d,title:"Preview",className:g,"data-testid":s})}const no=60;function so(o,e){const t=go(o),{children:r,restProps:g}=jo(e),s=Object.entries(g).filter(([,k])=>k!==void 0).map(([k,f])=>io(k,f)),n=lo(r),i=n!==null,j=s.length===0?"":" "+s.join(" "),d=i?`<${t}${j}>${n??""}</${t}>`:`<${t}${j} />`;if(d.length<=no&&!d.includes(`
+`))return d;const l=s.length===0?"":`
+  `+s.join(`
   `)+`
-`;if(l){const k=(s??"").split(`
-`).map(p=>`  ${p}`).join(`
-`);return`<${t}${j}>
+`;if(i){const k=(n??"").split(`
+`).map(f=>`  ${f}`).join(`
+`);return`<${t}${l}>
 ${k}
-</${t}>`}return`<${t}${j}/>`}function so(o){const e=o.meta.component;if(e!==void 0){if(typeof e.displayName=="string"&&e.displayName.length>0)return e.displayName;if(typeof e.name=="string"&&e.name.length>0)return e.name}const t=o.title.split("/").pop();return t!==void 0&&t.length>0?t:"Component"}function go(o){const{children:e,...t}=o;return{children:e,restProps:t}}function jo(o){return o==null?null:typeof o=="string"?o.length===0?null:o:typeof o=="number"||typeof o=="bigint"?`{${o.toString()}}`:typeof o=="boolean"?null:`{${I(o)}}`}function lo(o,e){if(e===!0)return o;if(e===!1)return`${o}={false}`;if(e===null)return`${o}={null}`;if(typeof e=="string"){const t=e.replace(/"/gu,"&quot;");return`${o}="${t}"`}return typeof e=="number"||typeof e=="bigint"?`${o}={${e.toString()}}`:typeof e=="function"?`${o}={fn}`:`${o}={${I(e)}}`}function I(o){try{return JSON.stringify(o)}catch{return String(o)}}const U={mobile:375,tablet:768,desktop:"none"},io={mobile:"Mobile",tablet:"Tablet",desktop:"Desktop"},P={white:{"--jogak-canvas-bg":"#ffffff","--jogak-canvas-bg-image":"none","--jogak-canvas-bg-size":"auto","--jogak-canvas-bg-position":"0 0"},dark:{"--jogak-canvas-bg":"#1f2937","--jogak-canvas-bg-image":"none","--jogak-canvas-bg-size":"auto","--jogak-canvas-bg-position":"0 0"},transparent:{"--jogak-canvas-bg":"#ffffff","--jogak-canvas-bg-image":"linear-gradient(45deg, #e2e8f0 25%, transparent 25%), linear-gradient(-45deg, #e2e8f0 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #e2e8f0 75%), linear-gradient(-45deg, transparent 75%, #e2e8f0 75%)","--jogak-canvas-bg-size":"16px 16px","--jogak-canvas-bg-position":"0 0, 0 8px, 8px -8px, -8px 0px"}},L="jogak:bg-[var(--jogak-canvas-bg)] jogak:bg-[image:var(--jogak-canvas-bg-image)] jogak:bg-[length:var(--jogak-canvas-bg-size)] jogak:bg-[position:var(--jogak-canvas-bg-position)]";function co(o){return E.themes[o]??E.themes.vsDark}function G({entryId:o,jogakName:e,overrideArgs:t,onArgChange:r,onReset:g,codeTheme:n,onResolveJogak:s,previewIsolation:l="iframe",userPreviewUrl:c="",previewEntryPath:d="/__jogak_preview__/index.html"}){const j=h.useEntry(o),[k,p]=i.useState("desktop"),[f,y]=i.useState("white"),[N,b]=i.useState("controls"),v=co(n);return j.status==="unknown"?a.jsxs("div",{"data-testid":"preview-not-found",className:"jogak:p-6 jogak:text-[var(--jogak-color-error)]",children:["Entry not found: ",o]}):j.status==="error"?a.jsxs("div",{"data-testid":"preview-error",className:"jogak:p-6 jogak:text-[var(--jogak-color-error-fg)] jogak:bg-[var(--jogak-color-bg-error)] jogak:h-full jogak:flex jogak:flex-col jogak:gap-3 jogak:items-start",children:[a.jsxs("div",{className:"jogak:font-semibold",children:["Failed to load entry: ",o]}),a.jsx("pre",{className:"jogak:m-0 jogak:p-3 jogak:bg-[var(--jogak-color-bg)] jogak:border jogak:border-[var(--jogak-color-error-border)] jogak:rounded-[var(--jogak-radius-lg)] jogak:text-[12px] jogak:whitespace-pre-wrap jogak:max-w-full",children:j.error.message})]}):j.status==="loading"?a.jsx(ko,{meta:j.meta,jogakName:e,viewport:k,bgMode:f,onViewportChange:p,onBgModeChange:y}):a.jsx(uo,{entry:j.entry,jogakName:e,overrideArgs:t,onArgChange:r,onReset:g,onResolveJogak:s,viewport:k,bgMode:f,bottomTab:N,onViewportChange:p,onBgModeChange:y,onBottomTabChange:b,prismTheme:v,previewIsolation:l,userPreviewUrl:c,previewEntryPath:d})}function ko({meta:o,jogakName:e,viewport:t,bgMode:r,onViewportChange:g,onBgModeChange:n}){const s=e??o.jogakNames[0]??"...",l=U[t];return a.jsxs("div",{"data-testid":"preview-loading",className:"jogak:flex jogak:flex-col jogak:h-full",children:[a.jsx(Q,{title:o.title,jogakName:s,viewport:t,bgMode:r,onViewportChange:g,onBgModeChange:n,showReset:!1,onReset:()=>{}}),a.jsx("div",{className:`jogak:flex-1 jogak:overflow-auto jogak:min-h-[320px] ${L}`,style:P[r],children:a.jsx("div",{className:"jogak:mx-auto jogak:p-6 jogak:max-w-[var(--jogak-canvas-mw)]",style:{"--jogak-canvas-mw":l==="none"?"100%":`${l}px`},children:a.jsxs("div",{className:"jogak-skeleton-shimmer jogak:border jogak:border-dashed jogak:border-[var(--jogak-color-border)] jogak:rounded-[var(--jogak-radius-xl)] jogak:p-4 jogak:flex jogak:items-center jogak:justify-center jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px] jogak:min-h-[256px]",children:["Loading ",o.title,"…"]})})})]})}function uo({entry:o,jogakName:e,overrideArgs:t,onArgChange:r,onReset:g,onResolveJogak:n,viewport:s,bgMode:l,bottomTab:c,onViewportChange:d,onBgModeChange:j,onBottomTabChange:k,prismTheme:p,previewIsolation:f,userPreviewUrl:y,previewEntryPath:N}){var J;const b=e??((J=o.jogaks[0])==null?void 0:J.name)??null;if(i.useEffect(()=>{e===null&&b!==null&&n!==void 0&&n(o.id,b)},[e,b,o.id,n]),b===null)return a.jsxs("div",{className:"jogak:p-6 jogak:text-[var(--jogak-color-error)]",children:["Entry has no jogaks: ",o.id]});const v=o.jogaks.find(S=>S.name===b);if(v===void 0)return a.jsxs("div",{className:"jogak:p-6 jogak:text-[var(--jogak-color-error)]",children:["Jogak not found: ",b]});const $={...v.args??{},...t},u={...o.meta.argTypes??{},...v.argTypes??{}},x=Object.keys(t).length>0,m=U[s];return a.jsxs("div",{className:"jogak:flex jogak:flex-col jogak:h-full",children:[a.jsx(Q,{title:o.title,jogakName:v.name,viewport:s,bgMode:l,onViewportChange:d,onBgModeChange:j,showReset:x,onReset:g}),a.jsx("div",{className:`jogak:flex-1 jogak:overflow-auto jogak:min-h-[320px] ${L}`,style:P[l],children:a.jsx("div",{"data-jogak-content":!0,className:"jogak:mx-auto jogak:p-6 jogak:max-w-[var(--jogak-canvas-mw)]",style:{"--jogak-canvas-mw":m==="none"?"100%":`${m}px`},children:a.jsx(po,{entry:o,args:$,theme:p,previewIsolation:f,userPreviewUrl:y,previewEntryPath:N},`${o.id}/${v.name}`)})}),a.jsxs("div",{"data-testid":"bottom-panel",className:"jogak:h-[260px] jogak:shrink-0 jogak:flex jogak:flex-col jogak:border-t-2 jogak:border-[var(--jogak-color-border)]",children:[a.jsx("div",{role:"tablist",className:"jogak:flex jogak:gap-1 jogak:pt-1 jogak:px-3 jogak:pb-0 jogak:bg-[var(--jogak-color-bg)] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:shrink-0",children:["controls","actions"].map(S=>{const q=c===S;return a.jsx("button",{type:"button",role:"tab","aria-selected":q,onClick:()=>{k(S)},className:w("jogak:px-[14px] jogak:py-[6px] jogak:text-[12px] jogak:bg-transparent jogak:border-x-0 jogak:border-t-0 jogak:border-b-2 jogak:border-solid jogak:-mb-px jogak:cursor-pointer jogak:capitalize",q?"jogak:font-semibold jogak:text-[var(--jogak-color-fg-strong)] jogak:border-[var(--jogak-color-accent)]":"jogak:font-medium jogak:text-[var(--jogak-color-fg-muted)] jogak:border-transparent"),children:S},S)})}),a.jsx("div",{className:"jogak:flex-1 jogak:min-h-0 jogak:overflow-auto",children:c==="controls"?a.jsx(H,{args:$,argTypes:u,onArgChange:r}):a.jsx(F,{})})]})]})}function Q({title:o,jogakName:e,viewport:t,bgMode:r,onViewportChange:g,onBgModeChange:n,showReset:s,onReset:l}){return a.jsxs("div",{className:"jogak:flex jogak:items-center jogak:gap-[10px] jogak:px-[14px] jogak:py-[7px] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:bg-[var(--jogak-color-bg)] jogak:shrink-0",children:[a.jsxs("div",{className:"jogak:flex-1 jogak:text-[13px]",children:[a.jsx("span",{className:"jogak:text-[var(--jogak-color-fg-subtle)]",children:o}),a.jsx("span",{className:"jogak:text-[var(--jogak-color-border-strong)] jogak:mx-1.5 jogak:leading-none",children:"/"}),a.jsx("span",{className:"jogak:text-[var(--jogak-color-fg-strong)] jogak:font-semibold",children:e})]}),a.jsx("div",{className:"jogak:flex jogak:gap-0.5 jogak:bg-[var(--jogak-color-bg-subtle)] jogak:rounded-[var(--jogak-radius-lg)] jogak:p-0.5",children:["mobile","tablet","desktop"].map(c=>a.jsx("button",{type:"button",onClick:()=>{g(c)},"aria-pressed":t===c,className:w("jogak:px-[9px] jogak:py-[3px] jogak:text-[12px] jogak:border-none jogak:rounded-[var(--jogak-radius-md)] jogak:cursor-pointer jogak:transition-all jogak:duration-100",t===c?"jogak:bg-[var(--jogak-color-bg-elevated)] jogak:text-[var(--jogak-color-fg-strong)] jogak:font-semibold jogak:shadow-[0_1px_2px_rgba(0,0,0,0.08)]":"jogak:bg-transparent jogak:text-[var(--jogak-color-fg-muted)] jogak:font-normal jogak:shadow-none"),children:io[c]},c))}),a.jsx("div",{className:"jogak:flex jogak:gap-1 jogak:items-center",children:["white","dark","transparent"].map(c=>a.jsx("button",{type:"button",onClick:()=>{n(c)},"aria-pressed":r===c,"aria-label":`${c} background`,className:w("jogak:w-5 jogak:h-5 jogak:rounded-[var(--jogak-radius-md)] jogak:border-2 jogak:cursor-pointer jogak:p-0 jogak:shrink-0",L,r===c?"jogak:border-[var(--jogak-color-accent)]":"jogak:border-[var(--jogak-color-border-strong)]"),style:P[c]},c))}),s&&a.jsx("button",{type:"button",onClick:l,className:"jogak:px-[10px] jogak:py-[3px] jogak:text-[12px] jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-md)] jogak:bg-[var(--jogak-color-bg)] jogak:cursor-pointer jogak:text-[var(--jogak-color-fg)] jogak:leading-none",children:"Reset"})]})}function po({entry:o,args:e,theme:t,previewIsolation:r,userPreviewUrl:g,previewEntryPath:n}){const[s,l]=i.useState(!1),c=no(o,e),d=a.jsxs("div",{className:"jogak:relative",children:[a.jsx(fo,{entry:o,args:e,previewIsolation:r,userPreviewUrl:g,previewEntryPath:n}),a.jsx("button",{type:"button",onClick:()=>{l(j=>!j)},"aria-pressed":s,"aria-label":s?"Hide source code":"Show source code",className:w("jogak:absolute jogak:bottom-2 jogak:right-2 jogak:px-[9px] jogak:py-1","jogak:text-[11px] jogak:font-[family-name:var(--jogak-font-mono)] jogak:font-semibold jogak:tracking-[0.02em]","jogak:text-[var(--jogak-color-bg)] jogak:border-none jogak:rounded-[5px] jogak:cursor-pointer","jogak:shadow-[0_1px_4px_rgba(0,0,0,0.2)] jogak:transition-[background-color] jogak:duration-150 jogak:leading-none",s?"jogak:bg-[var(--jogak-color-accent)]":"jogak:bg-[#1e293b]"),children:"</>"})]});return a.jsxs("div",{children:[d,s&&a.jsx("div",{className:"jogak:mt-2 jogak:rounded-[var(--jogak-radius-xl)] jogak:overflow-hidden jogak:h-[320px] jogak:shadow-[0_0_0_1px_rgba(0,0,0,0.08),_0_4px_16px_rgba(0,0,0,0.12)]",children:a.jsx(bo,{source:c,theme:t})})]})}const M="jogak:border jogak:border-dashed jogak:border-[var(--jogak-color-border)] jogak:rounded-[var(--jogak-radius-xl)] jogak:p-4 jogak:pb-9";function fo({entry:o,args:e,previewIsolation:t,userPreviewUrl:r,previewEntryPath:g}){return t==="shadow"?a.jsx(ao,{"data-testid":"preview-content",className:M,children:a.jsx(mo,{entry:o,args:e})}):t==="iframe"?a.jsx(to,{entry:o,args:e,userPreviewUrl:r,previewEntryPath:g,"data-testid":"preview-content",className:`${M} jogak:block jogak:w-full jogak:bg-transparent jogak:min-h-[256px]`}):a.jsx(xo,{entry:o,args:e})}function xo({entry:o,args:e}){const t=i.useRef(null);return i.useEffect(()=>{const r=t.current;if(r!==null)return h.reactAdapter.render(o,e,r),()=>{queueMicrotask(()=>{h.reactAdapter.unmount(r)})}},[o]),i.useEffect(()=>{const r=t.current;r!==null&&h.reactAdapter.render(o,e,r)},[o,e]),a.jsx("div",{ref:t,"data-testid":"preview-content",className:M})}function mo({entry:o,args:e}){const t=i.useRef(null);return i.useEffect(()=>{const r=t.current;if(r!==null)return h.reactAdapter.render(o,e,r),()=>{queueMicrotask(()=>{h.reactAdapter.unmount(r)})}},[o]),i.useEffect(()=>{const r=t.current;r!==null&&h.reactAdapter.render(o,e,r)},[o,e]),a.jsx("div",{ref:t,"data-testid":"preview-content-shadow"})}function bo({source:o,theme:e}){const[t,r]=i.useState(!1),g=e.plain.backgroundColor??"#1e293b";if(o===void 0)return a.jsx("div",{className:"jogak:h-full jogak:flex jogak:items-center jogak:justify-center jogak:bg-[var(--jogak-source-bg)] jogak:text-[#94a3b8] jogak:text-[13px]",style:{"--jogak-source-bg":g},children:"Source not available"});const n=()=>{navigator.clipboard.writeText(o).then(()=>{r(!0),setTimeout(()=>{r(!1)},2e3)})};return a.jsxs("div",{className:"jogak:relative jogak:h-full",children:[a.jsx("button",{type:"button",onClick:n,className:"jogak:absolute jogak:top-[10px] jogak:right-3 jogak:z-[1] jogak:px-[9px] jogak:py-[3px] jogak:text-[11px] jogak:bg-[rgba(255,255,255,0.1)] jogak:text-[#e2e8f0] jogak:border jogak:border-[rgba(255,255,255,0.18)] jogak:rounded-[var(--jogak-radius-md)] jogak:cursor-pointer jogak:leading-none",children:t?"✓ Copied":"Copy"}),a.jsx(E.Highlight,{code:o.trim(),language:"tsx",theme:e,children:({style:s,tokens:l,getLineProps:c,getTokenProps:d})=>a.jsx("pre",{className:"jogak:m-0 jogak:py-3 jogak:px-0 jogak:text-[12.5px] jogak:leading-[1.7] jogak:font-[family-name:var(--jogak-font-mono)] jogak:h-full jogak:box-border jogak:overflow-auto",style:s,children:l.map((j,k)=>a.jsxs("div",{...c({line:j}),className:"jogak:flex jogak:pr-6",style:c({line:j}).style,children:[a.jsx("span",{className:"jogak:select-none jogak:min-w-10 jogak:pl-[14px] jogak:pr-[14px] jogak:text-right jogak:text-[rgba(148,163,184,0.45)] jogak:shrink-0 jogak:leading-[1.7]",children:k+1}),a.jsx("span",{children:j.map((p,f)=>a.jsx("span",{...d({token:p})},f))})]},k))})})]})}function V(){if(typeof window>"u")return null;const o=new URLSearchParams(window.location.search),e=o.get("entry");if(e===null)return null;const t=o.get("jogak");return{entryId:e,jogakName:t}}function ho(o,e){const t=new URLSearchParams;t.set("entry",o),t.set("jogak",e),window.history.pushState({},"",`?${t.toString()}`)}function vo({entries:o,metas:e,codeTheme:t="vsDark",previewIsolation:r="iframe",userPreviewUrl:g="",previewEntryPath:n="/__jogak_preview__/index.html",userViteUrl:s}={}){const l=g!==""?g:s??"",c=i.useMemo(()=>{if(o!==void 0){e!==void 0&&console.warn("[jogak] JogakApp received both `entries` and `metas` — `entries` (eager) takes precedence.");const u=new C.ComponentRegistry;for(const x of o)u.register(x);return u}if(e!==void 0)for(const u of e)C.defaultRegistry.registerMeta(u);return C.defaultRegistry},[o,e]),d=i.useMemo(()=>V(),[]),[j,k]=i.useState((d==null?void 0:d.entryId)??null),[p,f]=i.useState((d==null?void 0:d.jogakName)??null),[y,N]=i.useState({});i.useEffect(()=>{const u=()=>{const x=V();x!==null?(k(x.entryId),f(x.jogakName),N({})):(k(null),f(null))};return window.addEventListener("popstate",u),()=>{window.removeEventListener("popstate",u)}},[]);const b=i.useCallback((u,x)=>{k(u),f(x),N({}),ho(u,x)},[]),v=i.useCallback((u,x)=>{if(k(m=>m===u?u:m),f(m=>m??x),typeof window<"u"){const m=new URLSearchParams(window.location.search);m.get("entry")===u&&m.get("jogak")===null&&(m.set("jogak",x),window.history.replaceState({},"",`?${m.toString()}`))}},[]),O=i.useCallback((u,x)=>{N(m=>({...m,[u]:x}))},[]),$=i.useCallback(()=>{N({})},[]);return a.jsx(h.JogakProvider,{registry:c,children:a.jsxs("div",{"data-jogak-shell":!0,className:"jogak:grid jogak:grid-cols-[260px_1fr] jogak:h-dvh jogak:overflow-hidden",children:[a.jsx(W,{selectedEntryId:j,selectedJogakName:p,onSelect:b}),a.jsx("main",{className:"jogak:overflow-hidden jogak:min-h-0",children:j!==null?a.jsx(G,{entryId:j,jogakName:p,overrideArgs:y,onArgChange:O,onReset:$,codeTheme:t,onResolveJogak:v,previewIsolation:r,userPreviewUrl:l,previewEntryPath:n}):a.jsx("div",{className:"jogak:flex jogak:items-center jogak:justify-center jogak:h-full jogak:text-[var(--jogak-color-fg-subtle)]",children:"Select a component from the sidebar"})})]})})}function wo(){const o=h.useRegistry(),e=i.useMemo(()=>o.getAll(),[o]),t=i.useMemo(()=>o.getTree(),[o]),r=i.useMemo(()=>g=>o.search(g),[o]);return{entries:e,tree:t,search:r}}exports.Actions=F;exports.Controls=H;exports.JogakApp=vo;exports.Preview=G;exports.Sidebar=W;exports.useRegistry=wo;
+</${t}>`}return`<${t}${l}/>`}function go(o){const e=o.meta.component;if(e!==void 0){if(typeof e.displayName=="string"&&e.displayName.length>0)return e.displayName;if(typeof e.name=="string"&&e.name.length>0)return e.name}const t=o.title.split("/").pop();return t!==void 0&&t.length>0?t:"Component"}function jo(o){const{children:e,...t}=o;return{children:e,restProps:t}}function lo(o){return o==null?null:typeof o=="string"?o.length===0?null:o:typeof o=="number"||typeof o=="bigint"?`{${o.toString()}}`:typeof o=="boolean"?null:`{${I(o)}}`}function io(o,e){if(e===!0)return o;if(e===!1)return`${o}={false}`;if(e===null)return`${o}={null}`;if(typeof e=="string"){const t=e.replace(/"/gu,"&quot;");return`${o}="${t}"`}return typeof e=="number"||typeof e=="bigint"?`${o}={${e.toString()}}`:typeof e=="function"?`${o}={fn}`:`${o}={${I(e)}}`}function I(o){try{return JSON.stringify(o)}catch{return String(o)}}const U={mobile:375,tablet:768,desktop:"none"},co={mobile:"Mobile",tablet:"Tablet",desktop:"Desktop"},O={white:{"--jogak-canvas-bg":"#ffffff","--jogak-canvas-bg-image":"none","--jogak-canvas-bg-size":"auto","--jogak-canvas-bg-position":"0 0"},dark:{"--jogak-canvas-bg":"#1f2937","--jogak-canvas-bg-image":"none","--jogak-canvas-bg-size":"auto","--jogak-canvas-bg-position":"0 0"},transparent:{"--jogak-canvas-bg":"#ffffff","--jogak-canvas-bg-image":"linear-gradient(45deg, #e2e8f0 25%, transparent 25%), linear-gradient(-45deg, #e2e8f0 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #e2e8f0 75%), linear-gradient(-45deg, transparent 75%, #e2e8f0 75%)","--jogak-canvas-bg-size":"16px 16px","--jogak-canvas-bg-position":"0 0, 0 8px, 8px -8px, -8px 0px"}},P="jogak:bg-[var(--jogak-canvas-bg)] jogak:bg-[image:var(--jogak-canvas-bg-image)] jogak:bg-[length:var(--jogak-canvas-bg-size)] jogak:bg-[position:var(--jogak-canvas-bg-position)]";function ko(o){return E.themes[o]??E.themes.vsDark}function G({entryId:o,jogakName:e,overrideArgs:t,onArgChange:r,onReset:g,codeTheme:s,onResolveJogak:n,previewIsolation:i="iframe",userPreviewUrl:j="",previewEntryPath:d="/__jogak_preview__/index.html"}){const l=h.useEntry(o),[k,f]=c.useState("desktop"),[p,y]=c.useState("white"),[N,b]=c.useState("controls"),w=ko(s);return l.status==="unknown"?a.jsxs("div",{"data-testid":"preview-not-found",className:"jogak:p-6 jogak:text-[var(--jogak-color-error)]",children:["Entry not found: ",o]}):l.status==="error"?a.jsxs("div",{"data-testid":"preview-error",className:"jogak:p-6 jogak:text-[var(--jogak-color-error-fg)] jogak:bg-[var(--jogak-color-bg-error)] jogak:h-full jogak:flex jogak:flex-col jogak:gap-3 jogak:items-start",children:[a.jsxs("div",{className:"jogak:font-semibold",children:["Failed to load entry: ",o]}),a.jsx("pre",{className:"jogak:m-0 jogak:p-3 jogak:bg-[var(--jogak-color-bg)] jogak:border jogak:border-[var(--jogak-color-error-border)] jogak:rounded-[var(--jogak-radius-lg)] jogak:text-[12px] jogak:whitespace-pre-wrap jogak:max-w-full",children:l.error.message})]}):l.status==="loading"?a.jsx(uo,{meta:l.meta,jogakName:e,viewport:k,bgMode:p,onViewportChange:f,onBgModeChange:y}):a.jsx(fo,{entry:l.entry,jogakName:e,overrideArgs:t,onArgChange:r,onReset:g,onResolveJogak:n,viewport:k,bgMode:p,bottomTab:N,onViewportChange:f,onBgModeChange:y,onBottomTabChange:b,prismTheme:w,previewIsolation:i,userPreviewUrl:j,previewEntryPath:d})}function uo({meta:o,jogakName:e,viewport:t,bgMode:r,onViewportChange:g,onBgModeChange:s}){const n=e??o.jogakNames[0]??"...",i=U[t];return a.jsxs("div",{"data-testid":"preview-loading",className:"jogak:flex jogak:flex-col jogak:h-full",children:[a.jsx(Q,{title:o.title,jogakName:n,viewport:t,bgMode:r,onViewportChange:g,onBgModeChange:s,showReset:!1,onReset:()=>{}}),a.jsx("div",{className:`jogak:flex-1 jogak:overflow-auto jogak:min-h-[320px] ${P}`,style:O[r],children:a.jsx("div",{className:"jogak:mx-auto jogak:p-6 jogak:max-w-[var(--jogak-canvas-mw)]",style:{"--jogak-canvas-mw":i==="none"?"100%":`${i}px`},children:a.jsxs("div",{className:"jogak-skeleton-shimmer jogak:border jogak:border-dashed jogak:border-[var(--jogak-color-border)] jogak:rounded-[var(--jogak-radius-xl)] jogak:p-4 jogak:flex jogak:items-center jogak:justify-center jogak:text-[var(--jogak-color-fg-subtle)] jogak:text-[13px] jogak:min-h-[256px]",children:["Loading ",o.title,"…"]})})})]})}function fo({entry:o,jogakName:e,overrideArgs:t,onArgChange:r,onReset:g,onResolveJogak:s,viewport:n,bgMode:i,bottomTab:j,onViewportChange:d,onBgModeChange:l,onBottomTabChange:k,prismTheme:f,previewIsolation:p,userPreviewUrl:y,previewEntryPath:N}){var V;const b=e??((V=o.jogaks[0])==null?void 0:V.name)??null;if(c.useEffect(()=>{e===null&&b!==null&&s!==void 0&&s(o.id,b)},[e,b,o.id,s]),b===null)return a.jsxs("div",{className:"jogak:p-6 jogak:text-[var(--jogak-color-error)]",children:["Entry has no jogaks: ",o.id]});const w=o.jogaks.find(S=>S.name===b);if(w===void 0)return a.jsxs("div",{className:"jogak:p-6 jogak:text-[var(--jogak-color-error)]",children:["Jogak not found: ",b]});const $={...w.args??{},...t},u={...o.meta.argTypes??{},...w.argTypes??{}},x=Object.keys(t).length>0,m=U[n];return a.jsxs("div",{className:"jogak:flex jogak:flex-col jogak:h-full",children:[a.jsx(Q,{title:o.title,jogakName:w.name,viewport:n,bgMode:i,onViewportChange:d,onBgModeChange:l,showReset:x,onReset:g}),a.jsx("div",{className:`jogak:flex-1 jogak:overflow-auto jogak:min-h-[320px] ${P}`,style:O[i],children:a.jsx("div",{"data-jogak-content":!0,className:"jogak:mx-auto jogak:p-6 jogak:max-w-[var(--jogak-canvas-mw)]",style:{"--jogak-canvas-mw":m==="none"?"100%":`${m}px`},children:a.jsx(po,{entry:o,args:$,theme:f,previewIsolation:p,userPreviewUrl:y,previewEntryPath:N},`${o.id}/${w.name}`)})}),a.jsxs("div",{"data-testid":"bottom-panel",className:"jogak:h-[260px] jogak:shrink-0 jogak:flex jogak:flex-col jogak:border-t-2 jogak:border-[var(--jogak-color-border)]",children:[a.jsx("div",{role:"tablist",className:"jogak:flex jogak:gap-1 jogak:pt-1 jogak:px-3 jogak:pb-0 jogak:bg-[var(--jogak-color-bg)] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:shrink-0",children:["controls","actions"].map(S=>{const J=j===S;return a.jsx("button",{type:"button",role:"tab","aria-selected":J,onClick:()=>{k(S)},className:v("jogak:px-[14px] jogak:py-[6px] jogak:text-[12px] jogak:bg-transparent jogak:border-x-0 jogak:border-t-0 jogak:border-b-2 jogak:border-solid jogak:-mb-px jogak:cursor-pointer jogak:capitalize",J?"jogak:font-semibold jogak:text-[var(--jogak-color-fg-strong)] jogak:border-[var(--jogak-color-accent)]":"jogak:font-medium jogak:text-[var(--jogak-color-fg-muted)] jogak:border-transparent"),children:S},S)})}),a.jsx("div",{className:"jogak:flex-1 jogak:min-h-0 jogak:overflow-auto",children:j==="controls"?a.jsx(H,{args:$,argTypes:u,onArgChange:r}):a.jsx(F,{})})]})]})}function Q({title:o,jogakName:e,viewport:t,bgMode:r,onViewportChange:g,onBgModeChange:s,showReset:n,onReset:i}){return a.jsxs("div",{className:"jogak:flex jogak:items-center jogak:gap-[10px] jogak:px-[14px] jogak:py-[7px] jogak:border-b jogak:border-[var(--jogak-color-border)] jogak:bg-[var(--jogak-color-bg)] jogak:shrink-0",children:[a.jsxs("div",{className:"jogak:flex-1 jogak:text-[13px]",children:[a.jsx("span",{className:"jogak:text-[var(--jogak-color-fg-subtle)]",children:o}),a.jsx("span",{className:"jogak:text-[var(--jogak-color-border-strong)] jogak:mx-1.5 jogak:leading-none",children:"/"}),a.jsx("span",{className:"jogak:text-[var(--jogak-color-fg-strong)] jogak:font-semibold",children:e})]}),a.jsx("div",{className:"jogak:flex jogak:gap-0.5 jogak:bg-[var(--jogak-color-bg-subtle)] jogak:rounded-[var(--jogak-radius-lg)] jogak:p-0.5",children:["mobile","tablet","desktop"].map(j=>a.jsx("button",{type:"button",onClick:()=>{g(j)},"aria-pressed":t===j,className:v("jogak:px-[9px] jogak:py-[3px] jogak:text-[12px] jogak:border-none jogak:rounded-[var(--jogak-radius-md)] jogak:cursor-pointer jogak:transition-all jogak:duration-100",t===j?"jogak:bg-[var(--jogak-color-bg-elevated)] jogak:text-[var(--jogak-color-fg-strong)] jogak:font-semibold jogak:shadow-[0_1px_2px_rgba(0,0,0,0.08)]":"jogak:bg-transparent jogak:text-[var(--jogak-color-fg-muted)] jogak:font-normal jogak:shadow-none"),children:co[j]},j))}),a.jsx("div",{className:"jogak:flex jogak:gap-1 jogak:items-center",children:["white","dark","transparent"].map(j=>a.jsx("button",{type:"button",onClick:()=>{s(j)},"aria-pressed":r===j,"aria-label":`${j} background`,className:v("jogak:w-5 jogak:h-5 jogak:rounded-[var(--jogak-radius-md)] jogak:border-2 jogak:cursor-pointer jogak:p-0 jogak:shrink-0",P,r===j?"jogak:border-[var(--jogak-color-accent)]":"jogak:border-[var(--jogak-color-border-strong)]"),style:O[j]},j))}),n&&a.jsx("button",{type:"button",onClick:i,className:"jogak:px-[10px] jogak:py-[3px] jogak:text-[12px] jogak:border jogak:border-[var(--jogak-color-border-strong)] jogak:rounded-[var(--jogak-radius-md)] jogak:bg-[var(--jogak-color-bg)] jogak:cursor-pointer jogak:text-[var(--jogak-color-fg)] jogak:leading-none",children:"Reset"})]})}function po({entry:o,args:e,theme:t,previewIsolation:r,userPreviewUrl:g,previewEntryPath:s}){const[n,i]=c.useState(!1),j=so(o,e),d=a.jsxs("div",{className:"jogak:relative",children:[a.jsx(xo,{entry:o,args:e,previewIsolation:r,userPreviewUrl:g,previewEntryPath:s}),a.jsx("button",{type:"button",onClick:()=>{i(l=>!l)},"aria-pressed":n,"aria-label":n?"Hide source code":"Show source code",className:v("jogak:absolute jogak:bottom-2 jogak:right-2 jogak:px-[9px] jogak:py-1","jogak:text-[11px] jogak:font-[family-name:var(--jogak-font-mono)] jogak:font-semibold jogak:tracking-[0.02em]","jogak:text-[var(--jogak-color-bg)] jogak:border-none jogak:rounded-[5px] jogak:cursor-pointer","jogak:shadow-[0_1px_4px_rgba(0,0,0,0.2)] jogak:transition-[background-color] jogak:duration-150 jogak:leading-none",n?"jogak:bg-[var(--jogak-color-accent)]":"jogak:bg-[#1e293b]"),children:"</>"})]});return a.jsxs("div",{children:[d,n&&a.jsx("div",{className:"jogak:mt-2 jogak:rounded-[var(--jogak-radius-xl)] jogak:overflow-hidden jogak:h-[320px] jogak:shadow-[0_0_0_1px_rgba(0,0,0,0.08),_0_4px_16px_rgba(0,0,0,0.12)]",children:a.jsx(ho,{source:j,theme:t})})]})}const M="jogak:border jogak:border-dashed jogak:border-[var(--jogak-color-border)] jogak:rounded-[var(--jogak-radius-xl)] jogak:p-4 jogak:pb-9";function xo({entry:o,args:e,previewIsolation:t,userPreviewUrl:r,previewEntryPath:g}){return t==="shadow"?a.jsx(to,{"data-testid":"preview-content",className:M,children:a.jsx(bo,{entry:o,args:e})}):t==="iframe"?a.jsx(ro,{entry:o,args:e,userPreviewUrl:r,previewEntryPath:g,"data-testid":"preview-content",className:`${M} jogak:block jogak:w-full jogak:bg-transparent jogak:min-h-[256px]`}):a.jsx(mo,{entry:o,args:e})}function mo({entry:o,args:e}){const t=c.useRef(null);return c.useEffect(()=>{const r=t.current;if(r!==null)return h.reactAdapter.render(o,e,r),()=>{queueMicrotask(()=>{h.reactAdapter.unmount(r)})}},[o]),c.useEffect(()=>{const r=t.current;r!==null&&h.reactAdapter.render(o,e,r)},[o,e]),a.jsx("div",{ref:t,"data-testid":"preview-content",className:M})}function bo({entry:o,args:e}){const t=c.useRef(null);return c.useEffect(()=>{const r=t.current;if(r!==null)return h.reactAdapter.render(o,e,r),()=>{queueMicrotask(()=>{h.reactAdapter.unmount(r)})}},[o]),c.useEffect(()=>{const r=t.current;r!==null&&h.reactAdapter.render(o,e,r)},[o,e]),a.jsx("div",{ref:t,"data-testid":"preview-content-shadow"})}function ho({source:o,theme:e}){const[t,r]=c.useState(!1),g=e.plain.backgroundColor??"#1e293b";if(o===void 0)return a.jsx("div",{className:"jogak:h-full jogak:flex jogak:items-center jogak:justify-center jogak:bg-[var(--jogak-source-bg)] jogak:text-[#94a3b8] jogak:text-[13px]",style:{"--jogak-source-bg":g},children:"Source not available"});const s=()=>{navigator.clipboard.writeText(o).then(()=>{r(!0),setTimeout(()=>{r(!1)},2e3)})};return a.jsxs("div",{className:"jogak:relative jogak:h-full",children:[a.jsx("button",{type:"button",onClick:s,className:"jogak:absolute jogak:top-[10px] jogak:right-3 jogak:z-[1] jogak:px-[9px] jogak:py-[3px] jogak:text-[11px] jogak:bg-[rgba(255,255,255,0.1)] jogak:text-[#e2e8f0] jogak:border jogak:border-[rgba(255,255,255,0.18)] jogak:rounded-[var(--jogak-radius-md)] jogak:cursor-pointer jogak:leading-none",children:t?"✓ Copied":"Copy"}),a.jsx(E.Highlight,{code:o.trim(),language:"tsx",theme:e,children:({style:n,tokens:i,getLineProps:j,getTokenProps:d})=>a.jsx("pre",{className:"jogak:m-0 jogak:py-3 jogak:px-0 jogak:text-[12.5px] jogak:leading-[1.7] jogak:font-[family-name:var(--jogak-font-mono)] jogak:h-full jogak:box-border jogak:overflow-auto",style:n,children:i.map((l,k)=>a.jsxs("div",{...j({line:l}),className:"jogak:flex jogak:pr-6",style:j({line:l}).style,children:[a.jsx("span",{className:"jogak:select-none jogak:min-w-10 jogak:pl-[14px] jogak:pr-[14px] jogak:text-right jogak:text-[rgba(148,163,184,0.45)] jogak:shrink-0 jogak:leading-[1.7]",children:k+1}),a.jsx("span",{children:l.map((f,p)=>a.jsx("span",{...d({token:f})},p))})]},k))})})]})}function q(){if(typeof window>"u")return null;const o=new URLSearchParams(window.location.search),e=o.get("entry");if(e===null)return null;const t=o.get("jogak");return{entryId:e,jogakName:t}}function vo(o,e){const t=new URLSearchParams;t.set("entry",o),t.set("jogak",e),window.history.pushState({},"",`?${t.toString()}`)}function wo({entries:o,metas:e,codeTheme:t="vsDark",previewIsolation:r="iframe",userPreviewUrl:g="",previewEntryPath:s="/__jogak_preview__/index.html",userViteUrl:n}={}){const i=g!==""?g:n??"",j=c.useMemo(()=>{if(o!==void 0){e!==void 0&&console.warn("[jogak] JogakApp received both `entries` and `metas` — `entries` (eager) takes precedence.");const u=new C.ComponentRegistry;for(const x of o)u.register(x);return u}if(e!==void 0)for(const u of e)C.defaultRegistry.registerMeta(u);return C.defaultRegistry},[o,e]),d=c.useMemo(()=>q(),[]),[l,k]=c.useState((d==null?void 0:d.entryId)??null),[f,p]=c.useState((d==null?void 0:d.jogakName)??null),[y,N]=c.useState({});c.useEffect(()=>{const u=()=>{const x=q();x!==null?(k(x.entryId),p(x.jogakName),N({})):(k(null),p(null))};return window.addEventListener("popstate",u),()=>{window.removeEventListener("popstate",u)}},[]);const b=c.useCallback((u,x)=>{k(u),p(x),N({}),vo(u,x)},[]),w=c.useCallback((u,x)=>{if(k(m=>m===u?u:m),p(m=>m??x),typeof window<"u"){const m=new URLSearchParams(window.location.search);m.get("entry")===u&&m.get("jogak")===null&&(m.set("jogak",x),window.history.replaceState({},"",`?${m.toString()}`))}},[]),L=c.useCallback((u,x)=>{N(m=>({...m,[u]:x}))},[]),$=c.useCallback(()=>{N({})},[]);return a.jsx(h.JogakProvider,{registry:j,children:a.jsxs("div",{"data-jogak-shell":!0,className:"jogak:grid jogak:grid-cols-[260px_1fr] jogak:h-dvh jogak:overflow-hidden",children:[a.jsx(B,{selectedEntryId:l,selectedJogakName:f,onSelect:b}),a.jsx("main",{className:"jogak:overflow-hidden jogak:min-h-0",children:l!==null?a.jsx(G,{entryId:l,jogakName:f,overrideArgs:y,onArgChange:L,onReset:$,codeTheme:t,onResolveJogak:w,previewIsolation:r,userPreviewUrl:i,previewEntryPath:s}):a.jsx("div",{className:"jogak:flex jogak:items-center jogak:justify-center jogak:h-full jogak:text-[var(--jogak-color-fg-subtle)]",children:"Select a component from the sidebar"})})]})})}function No(){const o=h.useRegistry(),e=c.useMemo(()=>o.getAll(),[o]),t=c.useMemo(()=>o.getTree(),[o]),r=c.useMemo(()=>g=>o.search(g),[o]);return{entries:e,tree:t,search:r}}exports.Actions=F;exports.Controls=H;exports.JogakApp=wo;exports.Preview=G;exports.Sidebar=B;exports.useRegistry=No;