https://grid.is/_next/static/chunks/app/get-started/page-c1298c577ebdffd5.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5477,6774],{6774:(e,t,a)=>{"use strict";a.r(t),a.d(t,{default:()=>m});var s=a(95155),r=a(30966),n=a(24104),o=a(12115),l=a(45088);a(53443);var i=(0,a(60380).c)({defaultClassName:"_1xcy3n94",variantClassNames:{type:{static:"_1xcy3n95",hover:"_1xcy3n96"}},defaultVariants:{},compoundVariants:[]}),c=a(7293);function d({children:e,row:t,column:a,distanceFromCenter:r,type:n,columnSpan:o,isMobile:p}){let h=(0,c.a)();return(0,s.jsx)("div",{className:i({type:n}),style:(0,l.D)({"var(--_1xcy3n90)":`${r??1}`,"var(--_1xcy3n91)":`${t}`,"var(--_1xcy3n92)":`${a}`,"var(--_1xcy3n93)":`${o??2}`,...p??h?{padding:"0 40px"}:{}}),children:e})}var p=a(57664);a(51729),a(27696);var h=a(88707),u=a(56697);function m({children:e,type:t,cta:a,ctaPath:i,ctaNote:y,heading:x,isVisible:g,ref:v,buttonBackground:b,buttonText:N,buttonHover:j,columns:f}){let C=null!=f,k=(0,c.a)(),[w,_]=(0,o.useState)(window.innerWidth);(0,o.useEffect)(()=>{let e=()=>_(window.innerWidth);return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]);let T=(0,o.useMemo)(()=>{let e,a=w<h.f.mdl,s=f??(k?3:a?4:5);return e=!C&&k?[8,1]:4===s?[9,2]:[9,3],{rowCount:C?"hover"===t?12:10:k?10:"hover"===t?12:10,columnCount:s,buttonPosition:e}},[t,k,w,f,C]),A=(0,o.useMemo)(()=>Array.from({length:T.rowCount*T.columnCount}).map((e,a)=>{let r=a%T.columnCount+1,n=Math.floor(a/T.columnCount)+1,o=`${n}_${r}`;if(n===T.buttonPosition[0]&&r===T.buttonPosition[1])return null;let l=Math.ceil(T.rowCount/2),i=Math.ceil(T.columnCount/2),c=Math.sqrt(Math.pow(Math.max(l-1,T.rowCount-l),2)+Math.pow(Math.max(i-1,T.columnCount-i),2)),p=Math.max(0,1-Math.sqrt(Math.pow(n-l,2)+Math.pow(r-i,2))/c);return(0,s.jsx)(d,{row:n,column:r,columnSpan:1,distanceFromCenter:p,type:t,isMobile:!C&&void 0},o)}),[t,T,C]),S=(0,o.useCallback)(e=>{if(!a||!i||k)return null;let t=k?3:2;return Array.from({length:T.rowCount*T.columnCount}).map((o,l)=>{let c=l%T.columnCount+1,h=Math.floor(l/T.columnCount)+1,m=`${h}_${c}`;return h===T.buttonPosition[0]&&c===T.buttonPosition[1]?(0,s.jsxs)(r.A.Parent,{animationState:e?"animate-in":"animate-out",children:[(0,s.jsx)(d,{row:h,column:c,columnSpan:t,children:(0,s.jsx)(r.A.Child,{index:5,elementType:"div",displayType:"flex",className:"_1r3750v6",children:(0,s.jsx)(n.$,{href:i||"",background:b,color:N,hoverColor:j,padding:"large",arrowType:"None",className:"_1r3750v7",trackEvent:"CTA Clicked",trackProperties:{label:a,destination:i,section_type:"hero",section_heading:x,position:"hero"},children:(0,s.jsx)("span",{className:(0,p.typography)({size:"pLarge"}),children:a})})})}),y&&(0,s.jsx)(d,{row:h+1,column:c,columnSpan:t,children:(0,s.jsx)(r.A.Child,{index:6,elementType:"div",displayType:"flex",className:"_1r3750v8",children:(0,s.jsx)("span",{className:(0,p.typography)({size:"pSmall",textAlign:"center"}),style:{color:u.colorVars.white,opacity:.7},children:y})})})]},m):null})},[a,i,y,x,T,k,b,N,j]);return(0,s.jsxs)("div",{className:"_1r3750v2",ref:v,style:(0,l.D)({"var(--_1r3750v1)":`${T.rowCount}`,"var(--_1r3750v0)":`${T.columnCount}`}),children:[e,S(g),(C||!k)&&(0,s.jsxs)("div",{className:"_1r3750v5",role:"presentation",children:[A,Array.from({length:T.rowCount}).map((e,t)=>(0,s.jsx)("div",{className:"_1r3750v3",style:{gridRow:t+1}},t)),Array.from({length:T.columnCount}).map((e,t)=>(0,s.jsx)("div",{className:"_1r3750v4","data-column":t+1,style:{gridColumn:t+1}},t))]})]})}},13543:()=>{},13587:(e,t,a)=>{"use strict";a.d(t,{Yo:()=>r,ap:()=>o,yp:()=>s,ys:()=>n}),a(51729),a(13543);var s="_17aqinp0",r="_17aqinp2",n="_17aqinp3",o="_17aqinp1"},15750:(e,t,a)=>{"use strict";a.d(t,{GetStarted:()=>C});var s=a(95155),r=a(12115),n=a(81106),o=a(57664),l=a(57161),i=a(30966),c=a(24104),d=a(41478),p=a(39318),h=a(74207),u=a(13587),m=a(3077),y=a.n(m),x=a(60509),g=a(28272),v=a(78631);a(57268);var b="_6ahk163",N="_6ahk16f",j="_6ahk167";let f=[{name:"Engine",command:g.Ls.engine,docs:"https://docs.grid.is/spreadsheet-engine/"},{name:"Viewer",command:g.Ls.viewer,docs:"https://docs.grid.is/spreadsheet-viewer/"},{name:"Editor",command:g.Ls.editor,docs:"https://docs.grid.is/spreadsheet-editor/"},{name:"Agent Tools",command:g.Ls.agentTools,docs:"https://docs.grid.is/agent-tools/"}];function C(){let e=(0,r.useRef)(null),t=(0,n.W)(e,{once:!0}),{theme:a}=(0,x.e)();return(0,s.jsx)(i.A.Parent,{animationState:t?"animate-in":"animate-out",children:(0,s.jsx)(l.A,{children:(0,s.jsxs)("div",{ref:e,className:"_6ahk160",children:[(0,s.jsxs)("div",{className:u.yp,children:[(0,s.jsx)(h.q,{}),(0,s.jsx)("div",{className:u.ap,children:(0,s.jsxs)(i.A.Child,{index:1,elementType:"div",displayType:"flex",className:"_6ahk161",children:[(0,s.jsx)("p",{className:(0,o.typography)({size:"eyebrow",textAlign:"center"}),style:{color:a.eyebrow},children:"GET STARTED"}),(0,s.jsx)("h1",{className:(0,o.typography)({size:"h1",weight:"regular",textAlign:"center",balance:"balance"}),style:{color:a.heading},children:"Start building in minutes"}),(0,s.jsx)("p",{className:(0,o.typography)({size:"pLarge",textAlign:"center",maxWidth:"prose",balance:"pretty"}),style:{color:a.body,opacity:.9},children:"Every GRID package installs from npm with a free evaluation license. Add the engine, viewer, or editor, then hand it to your agent or follow the quickstart yourself."})]})})]}),(0,s.jsxs)("div",{className:"_6ahk162",children:[(0,s.jsxs)(i.A.Child,{index:2,elementType:"div",displayType:"flex",className:b,children:[(0,s.jsx)("p",{className:(0,o.typography)({size:"eyebrow"}),style:{color:a.eyebrow},children:"WITH YOUR AGENT"}),(0,s.jsx)("h3",{className:(0,o.typography)({size:"h3",weight:"regular"}),style:{color:a.heading},children:"Hand it to your agent"}),(0,s.jsx)("p",{className:(0,o.typography)({size:"pSmall"}),style:{color:a.body,opacity:.85},children:"Paste this prompt into Claude Code, Cursor, Copilot, or any agent that can run shell commands. It installs GRID's skills and scaffolds a working spreadsheet editor."}),(0,s.jsx)(d.H,{multiline:!0,text:g.rN,displayNode:(0,p.T)(g.rN),className:"_6ahk164"}),(0,s.jsxs)("div",{className:"_6ahk165",children:[(0,s.jsx)("p",{className:(0,o.typography)({size:"pSmall"}),style:{color:a.body,opacity:.85,fontWeight:600},children:"Or connect the tools at runtime"}),(0,s.jsx)("p",{className:(0,o.typography)({size:"pSmall"}),style:{color:a.body,opacity:.85},children:"Add GRID's spreadsheet tools to your agent as an MCP server, so it reads, calculates, and edits workbooks directly instead of generating code."}),(0,s.jsx)(d.H,{text:g.ds,displayNode:(0,p.s)(g.ds),className:j})]}),(0,s.jsx)("div",{className:"_6ahk16a",children:(0,s.jsx)(c.$,{href:"https://docs.grid.is/agent-tools/",buttonType:"border",borderColor:a.buttonBackgroun

1d,color:a.buttonBackground,hoverColor:a.buttonHover,arrowType:"External link",trackEvent:"CTA Clicked",trackProperties:{label:"Agent tools docs",destination:"https://docs.grid.is/agent-tools/",section_type:"get-started",position:"agent-card"},children:(0,s.jsx)("span",{className:(0,o.typography)({size:"pSmall"}),children:"Agent tools docs"})})})]}),(0,s.jsxs)(i.A.Child,{index:3,elementType:"div",displayType:"flex",className:b,children:[(0,s.jsx)("p",{className:(0,o.typography)({size:"eyebrow"}),style:{color:a.eyebrow},children:"ON YOUR OWN"}),(0,s.jsx)("h3",{className:(0,o.typography)({size:"h3",weight:"regular"}),style:{color:a.heading},children:"Follow the quickstart"}),(0,s.jsx)("p",{className:(0,o.typography)({size:"pSmall"}),style:{color:a.body,opacity:.85},children:"Install the packages you need, then follow the quickstart guide to read, edit, and render your first spreadsheet."}),(0,s.jsx)("div",{className:"_6ahk166",children:f.map(e=>(0,s.jsx)(d.H,{text:e.command,displayNode:(0,p.s)(e.command),className:j},e.name))}),(0,s.jsxs)("div",{className:"_6ahk168",children:[(0,s.jsx)("p",{className:(0,o.typography)({size:"pSmall"}),style:{color:a.body,opacity:.85,fontWeight:600},children:"Quickstart guides"}),(0,s.jsx)("div",{className:"_6ahk169",children:f.map(e=>(0,s.jsx)(c.$,{href:e.docs,buttonType:"border",borderColor:a.buttonBackground,color:a.buttonBackground,hoverColor:a.buttonHover,arrowType:"External link",arrowSize:14,trackEvent:"CTA Clicked",trackProperties:{label:`${e.name} quickstart`,destination:e.docs,section_type:"get-started",position:"quickstart"},children:(0,s.jsx)("span",{className:(0,o.typography)({size:"pSmall"}),children:e.name})},e.name))})]})]})]}),(0,s.jsxs)(i.A.Child,{index:4,elementType:"div",displayType:"flex",className:"_6ahk16b",children:[(0,s.jsxs)("div",{className:"_6ahk16c",children:[(0,s.jsx)("p",{className:(0,o.typography)({size:"eyebrow"}),style:{color:a.eyebrow},children:"LICENSING"}),(0,s.jsx)("h3",{className:(0,o.typography)({size:"h3",weight:"regular"}),style:{color:a.heading},children:"Free to evaluate. License to ship."}),(0,s.jsxs)("p",{className:(0,o.typography)({size:"pSmall"}),style:{color:a.body,opacity:.85},children:["The"," ",(0,s.jsx)(y(),{href:g.Lt,target:"_blank",rel:"noopener noreferrer",className:N,style:{color:a.buttonBackground},onClick:()=>(0,v.u)("CTA Clicked",{label:"evaluation license",destination:g.Lt,section_type:"get-started",position:"license-band"}),children:"evaluation license"})," ","is free and full featured for development, evaluation, and internal prototypes. Shipping a commercial product requires a commercial license."]})]}),(0,s.jsx)("div",{className:"_6ahk16d",children:(0,s.jsx)(c.$,{href:"/license",buttonType:"border",borderColor:a.buttonBackground,color:a.buttonBackground,hoverColor:a.buttonHover,arrowType:"Internal link",trackEvent:"CTA Clicked",trackProperties:{label:"Commercial licensing",destination:"/license",section_type:"get-started",position:"license-band"},children:(0,s.jsx)("span",{className:(0,o.typography)({size:"pSmall"}),children:"Commercial licensing"})})})]}),(0,s.jsx)(i.A.Child,{index:5,elementType:"div",displayType:"flex",className:"_6ahk16e",children:(0,s.jsxs)("p",{className:(0,o.typography)({size:"pSmall",textAlign:"center"}),style:{color:a.body,opacity:.85},children:["Questions about installing or licensing?"," ",(0,s.jsx)(y(),{href:"/contact",className:N,style:{color:a.buttonBackground},onClick:()=>(0,v.u)("CTA Clicked",{label:"Contact us",destination:"/contact",section_type:"get-started",position:"contact"}),children:"Contact us"}),"."]})})]})})})}},19665:(e,t,a)=>{"use strict";a.d(t,{default:()=>i});var s=a(95155),r=a(12115),n=a(45088),o=a(2961),l=a.n(o);a(58263);let i=(0,r.memo)((0,r.forwardRef)(function({children:e,backgroundColor:t="transparent",rootClassName:a,className:r,style:o},i){return(0,s.jsx)("section",{"data-section":!0,ref:i,className:l()([a,"_8jxoe81"]),style:(0,n.D)({"var(--_8jxoe80)":t}),children:(0,s.jsx)("div",{className:l()(["_8jxoe82",r]),style:o,children:e})})}))},27696:()=>{},39318:(e,t,a)=>{"use strict";a.d(t,{T:()=>l,s:()=>o});var s=a(95155),r=a(56697);let n=new Set(["npm","npx","yarn","pnpm","bun"]);function o(e){return e.split(/(\s+)/).map((e,t)=>{if(""===e.trim())return e;let a=0===t&&n.has(e)?r.colorVars.green600:e.startsWith("@")||e.includes("/")?r.colorVars.white:void 0;return a?(0,s.jsx)("span",{style:{color:a},children:e},t):(0,s.jsx)("span",{children:e},t)})}function l(e){let t=e.split("\n");return t.map((e,a)=>{let r=n.has(e.trim().split(/\s+/)[0]);return(0,s.jsxs)("span",{children:[r?o(e):e,a<t.length-1?"\n":null]},a)})}},41478:(e,t,a)=>{"use strict";a.d(t,{H:()=>d});var s=a(95155),r=a(12115),n=a(2961),o=a.n(n),l=a(78631),i=a(56697);a(51729),a(83551),a(43308);var c=(0,a(60380).c)({defaultClassName:"oca82t0 _1055fj10",variantClassNames:{multiline:{true:"oca82t1"}},defaultVariants:{},compoundVariants:[]});let d=({text:e,display:t,displayNode:a,multiline:n=!1,className:d})=>{let[p,h]=(0,r.useState)(!1),u=(0,r.useRef)(null),m=(0,r.useRef)(null),y=async()=>{try{let t;await navigator.clipboard.writeText(e),(0,l.u)("Command Copied",{label:n?"agent prompt":e}),(t=m.current)&&"function"==typeof t.animate&&t.animate([{backgroundColor:`color-mix(in srgb, ${i.colorVars.green600} 28%, transparent)`},{backgroundColor:"transparent"}],{duration:3e3,easing:"ease-out"}),h(!0),u.current&&clearTimeout(u.current),u.current=setTimeout(()=>h(!1),2e3)}catch{}};return(0,s.jsxs)("div",{className:o()(c({multiline:n}),d),children:[(0,s.jsx)("code",{className:o()("oca82t2",{oca82t4:n}),children:(0,s.jsx)("span",{ref:m,className:"oca82t3",children:a??t??e})}),(0,s.jsx)("button",{type:"button",className:o()("oca82t5",{oca82t6:n}),onClick:y,"aria-label":"Copy to clipboard",children:p?"Copied":"Copy"})]})}},43308:()=>{},53443:()=>{},54862:(e,t,a)=>{Promise.resolve().then(a.bind(a,15750)),Promise.resolve().then(a.bind(a,41091)),Promise.resolve().then(a.bind(a,82018)),Promise.resolve().then(a.bind(a,13033)),Promise.resolve().then(a.bind(a,47787)),Promise.resolve().then(a.bind(a,60509))},57161:(e,t,a)=>{"use strict";a.d(t,{A:()=>s.default});var s=a(19665)},57268:()=>{},58263:()=>{},74207:(e,t,a)=>{"use strict";a.d(t,{q:()=>i});var s=a(95155),r=a(12115),n=a(60509),o=a(6774),l=a(13587);function i({type:e="static"}){let t=(0,r.useRef)(null),{theme:a}=(0,n.e)();return(0,s.jsx)("div",{className:l.Yo,"aria-hidden":"true",children:(0,s.jsx)(o.default,{type:e,columns:5,isVisible:!0,cta:void 0,ctaPath:void 0,ctaNote:void 0,heading:void 0,ref:t,buttonBackgroun

1d:a.buttonBackground,buttonText:a.buttonText,buttonHover:a.buttonHover,children:null})})}},83551:()=>{}},e=>{e.O(0,[1471,8329,6087,7058,5263,3230,4480,5757,9174,1573,3731,3700,3940,8441,8732,7358],()=>e(e.s=54862)),_N_E=e.O()}]);