npm - @ossy/pages - Versions diffs - 0.10.1 → 0.11.0 - Mend

@ossy/pages 0.10.1 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/build/index.js +1 -1
package/package.json +3 -3

package/build/index.js CHANGED Viewed

	@@ -1 +1 @@
1	- import e,{useState as a,useEffect as t}from"react";import{View as n,Title as r,Text as s,Button as o,Image as l,Card as i,Guide as c,Stack as m,ProfileCard as p,Tabs as d,Dropdown as g,ContextMenu as y,Tags as v,ResumeExperience as u,PageSection as x,Input as f}from"@ossy/design-system";function h(){return h=Object.assign?Object.assign.bind():function(e){for(var a=1;a<arguments.length;a++){var t=arguments[a];for(var n in t)({}).hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},h.apply(null,arguments)}const E=({columns:a=[]})=>e.createElement(n,{layout:"row",placeContent:"normal space-between",gap:"xl"},a.map(a=>e.createElement("div",{style:{maxWidth:`var(--max-width-${a.maxWidth}, 100%)`}},e.createElement(r,{as:"h3",variant:"tertiary",style:{marginBottom:"var(--space-m)"}},a.title),!!a.text&&e.createElement(s,null,a.text),!!a.list&&e.createElement("ul",{key:a.title,style:{padding:"0"}},a.list.map(({label:a,...t})=>e.createElement("li",{key:a,style:{listStyle:"none"}},e.createElement(o,h({variant:"link"},t,{style:{marginBottom:"var(--space-m)"}}),a))))))),b=({title:a,titleMaxWidth:t="800px",text:n,actions:l=[]})=>e.createElement("div",{"data-component":"hero"},e.createElement("style",{href:"@ossy/pages/hero",precedence:"high"},'\n [data-component="hero"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n }\n\n @media (min-width: 820px) {\n [data-component="hero"] {\n /* min-height: 60vh; */\n flex: 0 0 auto;\n }\n }\n '),e.createElement(r,{variant:"display",style:{maxWidth:t,marginBottom:"var(--space-l)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-l)"}},n),e.createElement("div",{style:{display:"flex",gap:"var(--space-m)"}},l.map(({label:a,...t})=>e.createElement(o,h({},t,{key:a}),a)))),w=({columns:a=[]})=>e.createElement(n,{layout:"row",placeContent:"normal space-between",gap:"xl",className:"footer"},e.createElement("style",{href:"@ossy/pages/footer",precedence:"high"},"\n .footer {\n padding: var(--space-s);\n }\n\n .footer .title {\n margin-bottom: var(--space-m);\n }\n\n .footer .list {\n padding: 0;\n }\n\n .footer .list-item {\n list-style: none;\n }\n "),a.map(a=>e.createElement("div",{style:{maxWidth:`var(--max-width-${a.maxWidth}, 100%)`}},e.createElement(r,{as:"h3",variant:"tertiary",className:"title",style:{color:"var(--color-primary)"}},a.title),!!a.text&&e.createElement(s,{style:{color:"var(--color-primary)"}},a.text),!!a.list&&e.createElement("ul",{className:"list",key:a.title},a.list.map(({label:a,...t})=>e.createElement("li",{className:"list-item",key:a},e.createElement(o,h({variant:"link"},t,{style:{marginBottom:"var(--space-m)"}}),a))))))),k=[{id:"about",surface:"decorated",style:{padding:"var(--space-xxl) var(--space-m)"},render:({about:a,socialProof:t})=>e.createElement(e.Fragment,null,e.createElement(n,{alignItems:"stretch",justifyContent:"center",style:{marginBottom:"var(--space-xl)"}},a.columns.map(({name:a,role:t,imgSrc:n,text:o})=>e.createElement("div",{key:a,style:{display:"flex",flexDirection:"column",justifyContent:"center"}},e.createElement(l,{key:a,src:n,style:{borderRadius:"50%",width:"100%",maxWidth:"200px",height:"auto",margin:"0 auto",marginBottom:"var(--space-l)"}}),e.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"var(--space-s)",alignItems:"center",marginBottom:"var(--space-l)"}},e.createElement(r,{as:"h1",variant:"primary"},a),e.createElement(r,{as:"h2",variant:"lead"},t)),e.createElement(s,{style:{textAlign:"center",maxWidth:"600px",margin:"0 auto"}},o)))),e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-l)",textAlign:"center"}},t.title),e.createElement(n,{layout:"row",justifyContent:"space-between",gap:"m"},t.columns.map(({title:a,logo:t})=>e.createElement("div",{key:a,style:{textAlign:"center"}},e.createElement(i,null,e.createElement(l,{src:t,style:{height:"20px",width:"auto"}}))))))},{id:"hero",surface:"primary",style:{padding:"var(--space-xxl) var(--space-m) var(--space-xl)"},render:({hero:a})=>e.createElement(b,a)},{id:"services",surface:"primary",maxWidth:"large",layout:"row",placeContent:"stretch space-around",gap:"xl",style:{borderBottom:"1px solid var(--separator-primary)",padding:"var(--space-xxl) var(--space-m)"},render:({services:a})=>e.createElement(e.Fragment,null,a.map(({title:a,text:t})=>e.createElement("div",{key:a,style:{textAlign:"center"}},e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"600px"}},t))))},{id:"projects",surface:"primary",style:{padding:"var(--space-xxl) var(--space-m) var(--space-xl)",minHeight:"60vh"},render:({projects:a})=>e.createElement(e.Fragment,null,e.createElement(c,{title:a.title,titleVariant:"display",text:a.text,style:{textAlign:"left",maxWidth:"600px",marginBottom:"var(--space-xl)"}}),a.categories.map(({title:a,text:t,links:n})=>e.createElement("div",{style:{marginBottom:"var(--space-xl)"}},e.createElement(r,{title:a,variant:"tertiary",style:{marginBottom:"var(--space-l)"}},a),e.createElement(s,null,t),e.createElement(m,null,n.map(a=>e.createElement(m,{horizontal:!0,style:{marginBottom:"var(--space-m)"}},a.map(a=>e.createElement(o,h({},a,{variant:"link",target:"_blank",style:{marginRight:"var(--space-m)"}})))))))))},{id:"contact",surface:"accent",style:{padding:"var(--space-xxl) var(--space-m)",borderBottom:"1px solid var(--separator-primary)"},render:({contact:a})=>e.createElement(w,{columns:a.columns})}],B=(e,a)=>{const t=e=>e?.date?.split(" - ")?.[0]\|\|"1900",n=new Date(t(e));return new Date(t(a))-n},C=(e=[])=>{e.sort(B);const[n,r]=a([]),[s,o]=a([]),[l,i]=a([]),[c,m]=a([]),[p,d]=a([]),[g,y]=a();Object.keys(e.flatMap(e=>e.tags).filter(e=>!!e).reduce((e,a)=>({[a]:"",...e}),{}));const v=Object.keys(e.reduce((e,a)=>({[a.typeOfExperience]:"",...e}),{}));t(()=>{let a=e;p.length&&(a=e.filter(e=>e?.tags?.map(e=>e.toLowerCase())?.some(e=>p.map(e=>e.toLowerCase()).includes(e)))),g&&(a=a.filter(e=>e.typeOfExperience===g));const t=(e=>e.reduce((e,a)=>(e[a.typeOfExperience\|\|"Other"].push(a),e),{Work:[],Education:[],Project:[],Other:[]}))(a);r(t.Work),o(t.Education),i(t.Project),m(t.Other)},[p,e,g]);return{work:n,education:s,project:l,other:c,tags:[],categories:v,activeTags:p,toggleActiveTag:e=>{d(a=>a.includes(e)?a.filter(a=>a!==e):[...a,e])},activeExperienceType:g,toggleActiveExperienceType:e=>{e!==g&&y("All"===e?void 0:e)}}},N=({status:a,profile:t,experiences:n,translations:s,profileCardProps:l={},actions:i=[]})=>{const{work:c,education:m,project:x,other:f,tags:E,categories:b,activeTags:w,toggleActiveTag:k,activeExperienceType:B,toggleActiveExperienceType:N}=C(n),j=[{id:"All",label:s.all},{id:"Work",label:s.work},{id:"Project",label:s.projects},{id:"Education",label:s.education},{id:"Other",label:s.other}].filter(e=>"All"===e.id?e:b.includes(e.id)),S=[{title:s.work,experiences:c},{title:s.projects,experiences:x},{title:s.education,experiences:m},{title:s.other,experiences:f}];return e.createElement("div",{"data-component":"@ossy/pages/resume","data-status":a},e.createElement("style",{href:"@ossy/pages/resume",precedence:"high"},'\n [data-component="@ossy/pages/resume"] {\n\n --padding: var(--resume-padding, 0);\n --background: var(--resume-background, transparent);\n --header-padding: var(--resume-header-padding, 8px 24px 8px 0);\n --header-justify-content: var(--resume-header-justify-content, center);\n --filter-padding: var(--resume-filter-padding, var(--space-s) var(--space-m));\n --content-background: var(--resume-content-background, transparent);\n\n background: var(--background);\n padding: var(--padding);\n display: grid;\n grid-template-columns: 1fr;\n grid-template-rows: fit-content fit-content fit-content;\n grid-template-areas:\n "profile-summary"\n "actions"\n "content";\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="actions"] {\n min-width: 0;\n box-sizing: border-box;\n grid-area: actions;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: var(--header-padding);\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="actions"]::-webkit-scrollbar {\n display: none;\n }\n\n [data-component="@ossy/pages/resume"] .secondary-actions {\n display: none;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="profile-summary"] {\n grid-area: profile-summary;\n z-index: 1;\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="content"] {\n display: flex;\n width: 100%;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n grid-area: content;\n padding: var(--space-l) var(--space-m);\n margin: var(--content-margin);\n gap: var(--space-xl);\n background: var(--content-background);\n }\n\n [data-component="@ossy/pages/resume"] [data-animation="fade-in"] {\n opacity: 0;\n transition-property: opacity, transform;\n transition-duration: 1s, 1s;\n transition-timing-function: ease-in-out;\n transform: translateZ(0);\n }\n\n [data-component="@ossy/pages/resume"] [data-scroll] {\n scrollbar-width: none;\n overflow-y: auto;\n }\n\n [data-component="@ossy/pages/resume"] [data-scroll]::-webkit-scrollbar {\n display: none;\n }\n\n [data-component="@ossy/pages/resume"][data-status="Success"] [data-animation="fade-in"] {\n opacity: 1;\n }\n\n [data-component="@ossy/pages/resume"] .content-section {\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n width: 100%;\n max-width: 700px;\n }\n\n @media (min-width: 1200px) {\n [data-component="@ossy/pages/resume"] {\n height: 100vh;\n grid-template-columns: 400px 1fr;\n grid-template-rows: min-content 1fr;\n grid-template-areas:\n "profile-summary actions"\n "profile-summary content";\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="actions"] {\n justify-content: space-between;\n }\n\n [data-component="@ossy/pages/resume"] .secondary-actions {\n display: flex;\n }\n }\n\n @media (min-width: 1900px) {\n [data-component="@ossy/pages/resume"] [data-slot="content"] {\n grid-column-start: profile-summary;\n grid-column-end: content;\n grid-row-start: content;\n grid-row-end: content;\n }\n }\n '),e.createElement(p,h({"data-scroll":!0,"data-slot":"profile-summary",activeTags:w,onTagClick:k,translations:s,surface:"primary"},l,t)),e.createElement("header",{className:"actions","data-slot":"actions","data-surface":"primary"},e.createElement(d,{tabs:j,activeTabId:B\|\|"All",onTabClick:(e,a)=>N(a.id),style:{borderBottom:E.length?"var(--header-border-bottom)":void 0}}),e.createElement("div",{className:"secondary-actions"},i.map(({label:a,contextMenu:t,...n})=>t?e.createElement(g,{trigger:e.createElement(o,n,a)},e.createElement(y,null,t.map(a=>e.createElement(y.Item,a,a.label)))):e.createElement(o,n,a))),!!E.length&&e.createElement(v,{tags:E,activeTags:w,onSelect:k,style:{padding:"var(--filter-padding)",display:"flex"}})),e.createElement("main",{className:"content","data-slot":"content","data-scroll":!0},S.filter(e=>!!e.experiences.length).map(({title:a,experiences:t})=>e.createElement("section",{className:"content-section",key:a},e.createElement(r,{variant:"primary",style:{textAlign:"center"}},a),e.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"var(--space-l)"}},t.map(a=>e.createElement(u,{key:a.id\|\|a.title,title:a.title,subTitle:a.subTitle,date:a.date,description:a.description,website:a.website,github:a.github,tags:a.tags})))))))},j=({title:a,titleVariant:t="secondary",titleAs:n="h2",text:o,children:l,maxWidth:i="l",...c})=>e.createElement(x,h({maxWidth:i},c,{style:{padding:"var(--space-xl) var(--space-m)",borderBottom:"1px solid var(--separator-primary)"}}),e.createElement(r,{as:n,variant:t,style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"600px",marginBottom:"var(--space-xl)"}},o),l),S=({theme:a={}})=>e.createElement(e.Fragment,null,e.createElement(j,{title:"Theme overview",titleVariant:"primary",titleAs:"h1",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "}),e.createElement(j,{title:"Colors",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row-wrap",gap:"xl"},Object.entries(a.color).map(([a])=>e.createElement("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"flex-start",flexWrap:"wrap",gap:"var(--space-l)"}},e.createElement("div",{variant:a,style:{width:"200px",height:"var(--space-xl)",backgroundColor:`var(--color-${a})`,boxShadow:"2px 2px 10px 0 hsla(0, 0%, 90%, .8)",borderRadius:"var(--space-xs)"}}),e.createElement(s,null,a))))),e.createElement(j,{title:"Spacing",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row",gap:"xl"},Object.entries(a.space).map(([a,t])=>e.createElement("div",{style:{display:"flex",flexDirection:"column",justifyContent:"flex-end",alignItems:"center"}},e.createElement("div",{style:{background:"var(--button-cta-background)",width:"20px",height:t,borderRadius:"var(--space-xxs)",marginBottom:"var(--space-m)"}}),e.createElement(s,null,a," - ",t))))),e.createElement(j,{title:"Content sizes (max width)",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{gap:"s"},Object.entries(a["max-width"]).map(([a,t])=>e.createElement(n,{layout:"row",gap:"l"},e.createElement(s,{style:{flexBasis:"90px"}},a," - ",t),e.createElement("div",{style:{background:"var(--color-accent)",width:"100%",maxWidth:`calc(var(--max-width-${a}) / 2)`,height:"20px",borderRadius:"var(--space-xxs)"}}))))),e.createElement(j,{title:"Surfaces",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row-wrap",gap:"xl"},Object.entries(a.surface).map(([a,t])=>e.createElement("div",{style:{background:`var(--surface-${a})`,width:"300px",height:"300px",display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"var(--space-s)",border:"1px solid var(--separator-primary)"}},e.createElement(s,null,a))))),e.createElement(j,{title:"Separators",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row",gap:"xl"},Object.entries(a.separator).map(([a])=>e.createElement("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"flex-start",flexWrap:"wrap",gap:"var(--space-l)",marginBottom:"var(--space-xl)"}},e.createElement("div",{variant:a,style:{width:"300px",height:"1px",backgroundColor:`var(--separator-${a})`}}),e.createElement(s,null,a))))),e.createElement(j,{title:"Typography",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-m)"}},"Titles"),e.createElement(n,{layout:"row-wrap",gap:"xl",placeItems:"center",style:{marginBottom:"var(--space-xl)"}},Object.entries(a.title).filter(([e])=>"default"!==e).map(([a])=>e.createElement("div",{style:{padding:"var(--space-l)",borderRadius:"var(--space-s)",border:"1px solid var(--separator-primary)",display:"flex",justifyContent:"center",alignItems:"center"}},e.createElement(r,{variant:a},a)))),e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-m)"}},"Text"),e.createElement(n,{layout:"row",gap:"xl",placeItems:"center"},Object.entries(a.text).map(([a])=>e.createElement("div",{style:{padding:"var(--space-l)",borderRadius:"var(--space-s)",border:"1px solid var(--separator-primary)"}},e.createElement(s,{variant:a},a))))),e.createElement(j,{title:"Buttons",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row-wrap",gap:"xl",alignItems:"center",justifyContent:"flex-start"},Object.entries(a.button).map(([a])=>e.createElement(o,{variant:a,style:{flexGrow:"0",flexShrink:"0"}},a))))),A=({title:t="Sign in",subtitle:n="Enter your credentials to access your account",onSubmit:l,signUpLink:i,forgotPasswordLink:c,loading:m=!1})=>{const[p,d]=a(""),[g,y]=a("");return e.createElement("div",{"data-component":"@ossy/pages/login"},e.createElement("style",{href:"@ossy/pages/login",precedence:"high"},'\n [data-component="@ossy/pages/login"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/login"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/login"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/login"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/login"] .links {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n gap: var(--space-s);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),l?.({email:p,password:g})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Email"),e.createElement(f,{type:"email",name:"email",placeholder:"you@example.com",value:p,onChange:e=>d(e.target.value),required:!0,autoComplete:"email"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Password"),e.createElement(f,{type:"password",name:"password",placeholder:"••••••••",value:g,onChange:e=>y(e.target.value),required:!0,autoComplete:"current-password"})),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:m},m?"Signing in...":"Sign in"),e.createElement("div",{className:"links"},c&&e.createElement(o,h({variant:"link"},c),"Forgot password?"),i&&e.createElement(o,h({variant:"link"},i),"Create an account")))))},T=({title:t="Create an account",subtitle:n="Get started with your free account",onSubmit:l,loginLink:i,termsLink:c,loading:m=!1})=>{const[p,d]=a(""),[g,y]=a(""),[v,u]=a("");return e.createElement("div",{"data-component":"@ossy/pages/sign-up"},e.createElement("style",{href:"@ossy/pages/sign-up",precedence:"high"},'\n [data-component="@ossy/pages/sign-up"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/sign-up"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/sign-up"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/sign-up"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/sign-up"] .terms {\n font-size: 0.875rem;\n color: var(--foreground-secondary, inherit);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),l?.({email:p,password:g,name:v})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Name"),e.createElement(f,{type:"text",name:"name",placeholder:"Your name",value:v,onChange:e=>u(e.target.value),autoComplete:"name"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Email"),e.createElement(f,{type:"email",name:"email",placeholder:"you@example.com",value:p,onChange:e=>d(e.target.value),required:!0,autoComplete:"email"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Password"),e.createElement(f,{type:"password",name:"password",placeholder:"••••••••",value:g,onChange:e=>y(e.target.value),required:!0,autoComplete:"new-password"})),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:m},m?"Creating account...":"Create account"),c&&e.createElement(s,{variant:"small",className:"terms",style:{textAlign:"center"}},"By signing up, you agree to our"," ",e.createElement(o,h({variant:"link"},c,{style:{padding:0}}),"Terms of Service")),i&&e.createElement(o,h({variant:"link"},i,{style:{alignSelf:"center"}}),"Already have an account? Sign in"))))},L=({title:t="Reset password",subtitle:n="Enter your email and we'll send you a link to reset your password",onSubmit:l,loginLink:i,successMessage:c="Check your email for a reset link.",loading:m=!1,success:p=!1})=>{const[d,g]=a("");return p?e.createElement("div",{"data-component":"@ossy/pages/forgot-password"},e.createElement("style",{href:"@ossy/pages/forgot-password",precedence:"high"},'\n [data-component="@ossy/pages/forgot-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/forgot-password"] .success-actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},"Check your email"),e.createElement(s,{style:{marginBottom:"var(--space-l)",maxWidth:"400px"}},c),i&&e.createElement("div",{className:"success-actions"},e.createElement(o,h({variant:"cta"},i),"Back to sign in"))):e.createElement("div",{"data-component":"@ossy/pages/forgot-password"},e.createElement("style",{href:"@ossy/pages/forgot-password",precedence:"high"},'\n [data-component="@ossy/pages/forgot-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/forgot-password"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/forgot-password"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/forgot-password"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),l?.({email:d})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Email"),e.createElement(f,{type:"email",name:"email",placeholder:"you@example.com",value:d,onChange:e=>g(e.target.value),required:!0,autoComplete:"email"})),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:m},m?"Sending...":"Send reset link"),i&&e.createElement(o,h({variant:"link"},i,{style:{alignSelf:"center"}}),"Back to sign in"))))},D=({title:a="Verify your email",subtitle:t="We've sent a verification link to your email address. Click the link to activate your account.",onResend:n,loginLink:l,loading:i=!1,resent:c=!1})=>e.createElement("div",{"data-component":"@ossy/pages/verify-email"},e.createElement("style",{href:"@ossy/pages/verify-email",precedence:"high"},'\n [data-component="@ossy/pages/verify-email"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/verify-email"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n margin-top: var(--space-xl);\n align-items: center;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-l)",maxWidth:"400px"}},t),c&&e.createElement(s,{variant:"small",style:{color:"var(--color-accent)",marginBottom:"var(--space-m)"}},"A new verification link has been sent."),e.createElement("div",{className:"actions"},n&&e.createElement(o,{variant:"secondary",onClick:n,disabled:i},i?"Sending...":"Resend verification email"),l&&e.createElement(o,h({variant:"link"},l),"Back to sign in"))),W=({title:t="Set new password",subtitle:n="Enter your new password below",onSubmit:l,loginLink:i,loading:c=!1,success:m=!1,successMessage:p="Your password has been reset."})=>{const[d,g]=a(""),[y,v]=a("");if(m)return e.createElement("div",{"data-component":"@ossy/pages/reset-password"},e.createElement("style",{href:"@ossy/pages/reset-password",precedence:"high"},'\n [data-component="@ossy/pages/reset-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/reset-password"] .success-actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},"Password reset"),e.createElement(s,{style:{marginBottom:"var(--space-l)",maxWidth:"400px"}},p),i&&e.createElement("div",{className:"success-actions"},e.createElement(o,h({variant:"cta"},i),"Sign in")));const u=d===y\|\|!y;return e.createElement("div",{"data-component":"@ossy/pages/reset-password"},e.createElement("style",{href:"@ossy/pages/reset-password",precedence:"high"},'\n [data-component="@ossy/pages/reset-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/reset-password"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/reset-password"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/reset-password"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/reset-password"] .error {\n color: var(--color-error, #c00);\n font-size: 0.875rem;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),d===y&&l?.({password:d})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"New password"),e.createElement(f,{type:"password",name:"password",placeholder:"••••••••",value:d,onChange:e=>g(e.target.value),required:!0,minLength:8,autoComplete:"new-password"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Confirm password"),e.createElement(f,{type:"password",name:"confirmPassword",placeholder:"••••••••",value:y,onChange:e=>v(e.target.value),required:!0,minLength:8,autoComplete:"new-password"}),y&&!u&&e.createElement(s,{className:"error"},"Passwords do not match")),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:c\|\|!u\|\|d.length<8},c?"Resetting...":"Reset password"),i&&e.createElement(o,h({variant:"link"},i,{style:{alignSelf:"center"}}),"Back to sign in"))))},P=({title:t="Delete account",subtitle:n="This action cannot be undone. All your data will be permanently removed.",confirmText:l="delete my account",onSubmit:i,cancelLink:c,loading:m=!1})=>{const[p,d]=a(""),g=p.toLowerCase()===l.toLowerCase();return e.createElement("div",{"data-component":"@ossy/pages/delete-account"},e.createElement("style",{href:"@ossy/pages/delete-account",precedence:"high"},'\n [data-component="@ossy/pages/delete-account"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/delete-account"] .content {\n max-width: 480px;\n text-align: center;\n }\n\n [data-component="@ossy/pages/delete-account"] .warning {\n padding: var(--space-m);\n background: var(--surface-secondary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n margin: var(--space-xl) 0;\n border: 1px solid var(--color-error, #c00);\n }\n\n [data-component="@ossy/pages/delete-account"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n margin-top: var(--space-xl);\n }\n\n [data-component="@ossy/pages/delete-account"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/delete-account"] .actions {\n display: flex;\n gap: var(--space-m);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-m)",textAlign:"center"}},n),e.createElement("div",{className:"warning"},e.createElement(s,{variant:"small"},"This will permanently delete your account and all associated data. This action cannot be undone.")),e.createElement("form",{onSubmit:e=>{e.preventDefault(),p.toLowerCase()===l.toLowerCase()&&i?.()}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Type ",e.createElement("strong",null,l)," to confirm"),e.createElement(f,{type:"text",value:p,onChange:e=>d(e.target.value),placeholder:l,autoComplete:"off"})),e.createElement("div",{className:"actions"},c&&e.createElement(o,h({variant:"secondary"},c),"Cancel"),e.createElement(o,{type:"submit",variant:"cta",disabled:m\|\|!g,style:{background:"var(--color-error, #c00)"}},m?"Deleting...":"Delete account"))))},I=({title:t="Two-factor authentication",subtitle:n="Add an extra layer of security to your account",enabled:l=!1,onEnable:i,onDisable:c,onVerify:m,loading:p=!1})=>{const[d,g]=a("");return l?e.createElement("div",{"data-component":"@ossy/pages/two-factor"},e.createElement("style",{href:"@ossy/pages/two-factor",precedence:"high"},'\n [data-component="@ossy/pages/two-factor"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/two-factor"] .content {\n max-width: 480px;\n text-align: center;\n }\n\n [data-component="@ossy/pages/two-factor"] .success {\n padding: var(--space-m);\n background: var(--surface-secondary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n margin: var(--space-xl) 0;\n color: var(--color-accent);\n }\n\n [data-component="@ossy/pages/two-factor"] .actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},t),e.createElement(s,{style:{marginBottom:"var(--space-m)"}},"Two-factor authentication is enabled on your account."),e.createElement("div",{className:"success"},e.createElement(s,{variant:"small"},"Your account is protected with 2FA.")),c&&e.createElement("div",{className:"actions"},e.createElement(o,{variant:"secondary",onClick:c,disabled:p,style:{color:"var(--color-error, #c00)"}},p?"Disabling...":"Disable 2FA"))):e.createElement("div",{"data-component":"@ossy/pages/two-factor"},e.createElement("style",{href:"@ossy/pages/two-factor",precedence:"high"},'\n [data-component="@ossy/pages/two-factor"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/two-factor"] .content {\n max-width: 480px;\n text-align: center;\n }\n\n [data-component="@ossy/pages/two-factor"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n margin-top: var(--space-xl);\n }\n\n [data-component="@ossy/pages/two-factor"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/two-factor"] .steps {\n text-align: left;\n margin: var(--space-xl) 0;\n padding: var(--space-m);\n background: var(--surface-secondary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n }\n\n [data-component="@ossy/pages/two-factor"] .steps ol {\n margin: 0;\n padding-left: var(--space-l);\n }\n\n [data-component="@ossy/pages/two-factor"] .steps li {\n margin-bottom: var(--space-s);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},t),e.createElement(s,{style:{marginBottom:"var(--space-m)"}},n),e.createElement("div",{className:"steps"},e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-s)"}},"To enable 2FA:"),e.createElement("ol",null,e.createElement("li",null,e.createElement(s,{variant:"small"},"Download an authenticator app (e.g. Google Authenticator)")),e.createElement("li",null,e.createElement(s,{variant:"small"},"Scan the QR code we'll show you")),e.createElement("li",null,e.createElement(s,{variant:"small"},"Enter the 6-digit code to verify")))),i?e.createElement(o,{variant:"cta",onClick:i,disabled:p},p?"Setting up...":"Enable 2FA"):e.createElement("form",{onSubmit:e=>{e.preventDefault(),m?.(d)}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Verification code"),e.createElement(f,{type:"text",placeholder:"000000",value:d,onChange:e=>g(e.target.value.replace(/\D/g,"").slice(0,6)),maxLength:6,autoComplete:"one-time-code"})),e.createElement(o,{type:"submit",variant:"cta",disabled:p\|\|6!==d.length},p?"Verifying...":"Verify and enable")))},R=({title:a="Simple, transparent pricing",subtitle:t="Choose the plan that fits your needs",plans:n=[],billingToggle:l})=>{const c=n.length>0?n:[{id:"starter",name:"Starter",price:"$9",period:"/month",description:"Perfect for individuals and small projects",features:["Up to 3 projects","Basic analytics","Email support"],cta:{label:"Get started",href:"/signup"},highlighted:!1},{id:"pro",name:"Pro",price:"$29",period:"/month",description:"For growing teams and businesses",features:["Unlimited projects","Advanced analytics","Priority support","API access"],cta:{label:"Start free trial",href:"/signup"},highlighted:!0},{id:"enterprise",name:"Enterprise",price:"Custom",period:"",description:"For large organizations with custom needs",features:["Everything in Pro","Dedicated support","Custom integrations","SLA"],cta:{label:"Contact sales",href:"/contact"},highlighted:!1}];return e.createElement("div",{"data-component":"@ossy/pages/pricing"},e.createElement("style",{href:"@ossy/pages/pricing",precedence:"high"},'\n [data-component="@ossy/pages/pricing"] {\n padding: var(--space-xxl) var(--space-m);\n }\n\n [data-component="@ossy/pages/pricing"] .header {\n text-align: center;\n margin-bottom: var(--space-xxl);\n max-width: 600px;\n margin-left: auto;\n margin-right: auto;\n }\n\n [data-component="@ossy/pages/pricing"] .plans {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n gap: var(--space-xl);\n max-width: 1200px;\n margin: 0 auto;\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/pricing"] .plan-card {\n display: flex;\n flex-direction: column;\n height: 100%;\n padding: var(--space-xl);\n border-radius: var(--space-m);\n border: 1px solid var(--separator-primary);\n position: relative;\n }\n\n [data-component="@ossy/pages/pricing"] .plan-card.highlighted {\n border-color: var(--color-primary);\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);\n }\n\n [data-component="@ossy/pages/pricing"] .plan-price {\n display: flex;\n align-items: baseline;\n gap: var(--space-xs);\n margin-bottom: var(--space-s);\n }\n\n [data-component="@ossy/pages/pricing"] .plan-features {\n list-style: none;\n padding: 0;\n margin: var(--space-l) 0;\n flex: 1;\n }\n\n [data-component="@ossy/pages/pricing"] .plan-features li {\n padding: var(--space-s) 0;\n border-bottom: 1px solid var(--separator-secondary, transparent);\n display: flex;\n align-items: center;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/pricing"] .plan-features li:last-child {\n border-bottom: none;\n }\n '),e.createElement("div",{className:"header"},e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{marginBottom:l?"var(--space-l)":0}},t),l),e.createElement("div",{className:"plans"},c.map(a=>e.createElement(i,{key:a.id,surface:"primary",className:"plan-card "+(a.highlighted?"highlighted":"")},e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-s)"}},a.name),e.createElement("div",{className:"plan-price"},e.createElement(r,{variant:"display"},a.price),a.period&&e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.period)),e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-m)"}},a.description),e.createElement("ul",{className:"plan-features"},a.features?.map((a,t)=>e.createElement("li",{key:t},a))),a.cta&&e.createElement(o,h({variant:a.highlighted?"cta":"default"},a.cta,{style:{marginTop:"auto"}}),a.cta.label)))))},q=({title:a="Settings",subtitle:t="Manage your account and preferences",sections:n=[]})=>{const l=n.length>0?n:[{id:"profile",title:"Profile",description:"Update your personal information",fields:[{id:"name",label:"Name",type:"text",placeholder:"Your name"},{id:"email",label:"Email",type:"email",placeholder:"you@example.com"}],submitLabel:"Save changes"},{id:"security",title:"Security",description:"Manage your password and security settings",fields:[{id:"current-password",label:"Current password",type:"password",placeholder:"••••••••"},{id:"new-password",label:"New password",type:"password",placeholder:"••••••••"}],submitLabel:"Update password"},{id:"notifications",title:"Notifications",description:"Choose how you want to be notified",toggles:[{id:"email",label:"Email notifications",description:"Receive updates via email"},{id:"marketing",label:"Marketing emails",description:"Receive product updates and tips"}]}];return e.createElement("div",{"data-component":"@ossy/pages/settings"},e.createElement("style",{href:"@ossy/pages/settings",precedence:"high"},'\n [data-component="@ossy/pages/settings"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/settings"] .section {\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/settings"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n margin-bottom: var(--space-l);\n }\n\n [data-component="@ossy/pages/settings"] .toggle-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n }\n\n [data-component="@ossy/pages/settings"] .toggle-row:last-child {\n border-bottom: none;\n }\n\n [data-component="@ossy/pages/settings"] .toggle-label {\n display: flex;\n flex-direction: column;\n gap: var(--space-xs);\n }\n\n [data-component="@ossy/pages/settings"] .toggle-checkbox {\n width: 44px;\n height: 24px;\n accent-color: var(--color-primary);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),l.map(a=>e.createElement(x,{key:a.id,surface:"primary",style:{marginBottom:"var(--space-xl)",padding:"var(--space-xl)"}},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-s)"}},a.title),e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-l)"}},a.description),a.fields?.map(a=>e.createElement("div",{key:a.id,className:"field"},e.createElement(s,{variant:"small"},a.label),e.createElement(f,h({type:a.type,id:a.id,placeholder:a.placeholder},a)))),a.toggles?.map(a=>e.createElement("div",{key:a.id,className:"toggle-row"},e.createElement("div",{className:"toggle-label"},e.createElement(s,null,a.label),a.description&&e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.description)),e.createElement("input",{type:"checkbox",className:"toggle-checkbox",checked:a.value??!1,onChange:e=>a.onChange?.(e.target.checked)}))),a.submitLabel&&e.createElement(o,{variant:"cta",style:{marginTop:"var(--space-m)"}},a.submitLabel))))},O=({title:a="Dashboard",subtitle:t,children:n,stats:o=[]})=>{const l=o.length>0?o:[{label:"Active users",value:"—"},{label:"Revenue",value:"—"},{label:"Conversions",value:"—"}];return e.createElement("div",{"data-component":"@ossy/pages/dashboard"},e.createElement("style",{href:"@ossy/pages/dashboard",precedence:"high"},'\n [data-component="@ossy/pages/dashboard"] {\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/dashboard"] .header {\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/dashboard"] .stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: var(--space-l);\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/dashboard"] .stat-card {\n padding: var(--space-l);\n border-radius: var(--space-m);\n border: 1px solid var(--separator-primary);\n }\n '),e.createElement("div",{className:"header"},e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),t&&e.createElement(s,{style:{color:"var(--foreground-secondary)"}},t)),e.createElement("div",{className:"stats"},l.map((a,t)=>e.createElement(i,{key:t,surface:"primary",className:"stat-card"},e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-xs)"}},a.label),e.createElement(r,{variant:"primary"},a.value)))),n)},z=({title:a="Billing",subtitle:t="Manage your subscription and payment methods",currentPlan:n,paymentMethod:l,invoices:c=[],onChangePlanLink:m,onUpdatePaymentLink:p})=>{const d=n\|\|{name:"Pro",price:"$29/month",status:"active",nextBillingDate:"March 18, 2026"},g=l\|\|{last4:"4242",brand:"Visa",expiry:"12/28"};return e.createElement("div",{"data-component":"@ossy/pages/billing"},e.createElement("style",{href:"@ossy/pages/billing",precedence:"high"},'\n [data-component="@ossy/pages/billing"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/billing"] .section {\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/billing"] .plan-card,\n [data-component="@ossy/pages/billing"] .payment-card {\n padding: var(--space-xl);\n border-radius: var(--space-m);\n border: 1px solid var(--separator-primary);\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--space-m);\n margin-bottom: var(--space-m);\n }\n\n [data-component="@ossy/pages/billing"] .invoice-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n }\n\n [data-component="@ossy/pages/billing"] .invoice-row:last-child {\n border-bottom: none;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),e.createElement("div",{className:"section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Current plan"),e.createElement(i,{surface:"primary",className:"plan-card"},e.createElement("div",null,e.createElement(r,{variant:"primary"},d.name),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},d.price," · ",d.status),d.nextBillingDate&&e.createElement(s,{variant:"small",style:{display:"block",marginTop:"var(--space-xs)"}},"Next billing: ",d.nextBillingDate)),m&&e.createElement(o,h({variant:"secondary"},m),"Change plan"))),e.createElement("div",{className:"section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Payment method"),e.createElement(i,{surface:"primary",className:"payment-card"},e.createElement("div",null,e.createElement(s,null,g.brand," •••• ",g.last4),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},"Expires ",g.expiry)),p&&e.createElement(o,h({variant:"secondary"},p),"Update"))),c.length>0&&e.createElement("div",{className:"section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Invoices"),e.createElement(i,{surface:"primary",style:{padding:"var(--space-m)"}},c.map((a,t)=>e.createElement("div",{key:t,className:"invoice-row"},e.createElement("div",null,e.createElement(s,null,a.date\|\|"Mar 18, 2026"),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.description\|\|"Pro plan")),e.createElement("div",{style:{display:"flex",alignItems:"center",gap:"var(--space-m)"}},e.createElement(s,null,a.amount\|\|"$29.00"),a.downloadLink&&e.createElement(o,h({variant:"link"},a.downloadLink),"Download")))))))},F=({title:a="Welcome!",subtitle:t="Let's get you set up",steps:n=[],currentStep:l=0,onNext:i,onBack:c,onSkip:m,completeLabel:p="Get started"})=>{const d=n.length>0?n:[{id:"profile",title:"Complete your profile",description:"Add your name and avatar so your team can recognize you."},{id:"workspace",title:"Create your workspace",description:"Set up your first workspace to start collaborating."},{id:"invite",title:"Invite your team",description:"Bring your team on board to work together."}],g=d[l],y=l===d.length-1;return e.createElement("div",{"data-component":"@ossy/pages/onboarding"},e.createElement("style",{href:"@ossy/pages/onboarding",precedence:"high"},'\n [data-component="@ossy/pages/onboarding"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 70vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/onboarding"] .progress {\n display: flex;\n gap: var(--space-s);\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/onboarding"] .progress-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--separator-primary);\n transition: background 0.2s;\n }\n\n [data-component="@ossy/pages/onboarding"] .progress-dot.active {\n background: var(--color-primary);\n }\n\n [data-component="@ossy/pages/onboarding"] .content {\n max-width: 480px;\n text-align: center;\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/onboarding"] .actions {\n display: flex;\n gap: var(--space-m);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),e.createElement("div",{className:"progress"},d.map((a,t)=>e.createElement("div",{key:t,className:"progress-dot "+(t<=l?"active":"")}))),e.createElement("div",{className:"content"},e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},g?.title\|\|a),e.createElement(s,{style:{color:"var(--foreground-secondary)"}},g?.description\|\|t)),e.createElement("div",{className:"actions"},l>0&&c&&e.createElement(o,{variant:"secondary",onClick:c},"Back"),m&&!y&&e.createElement(o,{variant:"link",onClick:m},"Skip"),e.createElement(o,{variant:"cta",onClick:()=>i?.(y?"complete":l+1)},y?p:"Next")))},M=({title:a="Team",subtitle:t="Invite and manage your team members",members:n=[],pendingInvites:l=[],onInvite:c,onRemoveMember:m,onResendInvite:p,onCancelInvite:d})=>{const g=n.length>0?n:[{id:"1",name:"You",email:"you@example.com",role:"Owner"},{id:"2",name:"Jane Doe",email:"jane@example.com",role:"Admin"}],y=l.length>0?l:[{id:"1",email:"pending@example.com",role:"Member",status:"pending"}];return e.createElement("div",{"data-component":"@ossy/pages/team"},e.createElement("style",{href:"@ossy/pages/team",precedence:"high"},'\n [data-component="@ossy/pages/team"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/team"] .invite-form {\n display: flex;\n gap: var(--space-m);\n margin-bottom: var(--space-xl);\n flex-wrap: wrap;\n }\n\n [data-component="@ossy/pages/team"] .invite-form input {\n flex: 1;\n min-width: 200px;\n }\n\n [data-component="@ossy/pages/team"] .member-row,\n [data-component="@ossy/pages/team"] .pending-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n flex-wrap: wrap;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/team"] .member-row:last-child,\n [data-component="@ossy/pages/team"] .pending-row:last-child {\n border-bottom: none;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),c&&e.createElement("form",{className:"invite-form",onSubmit:e=>{e.preventDefault();const a=e.target.email?.value;a&&c({email:a})}},e.createElement(f,{type:"email",name:"email",placeholder:"Email address",required:!0}),e.createElement(o,{type:"submit",variant:"cta"},"Invite")),e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Members"),e.createElement(i,{surface:"primary",style:{padding:"var(--space-m)",marginBottom:"var(--space-xl)"}},g.map(a=>e.createElement("div",{key:a.id,className:"member-row"},e.createElement("div",null,e.createElement(s,null,a.name),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.email," · ",a.role)),m&&"Owner"!==a.role&&e.createElement(o,{variant:"link",onClick:()=>m(a),style:{color:"var(--color-error, #c00)"}},"Remove")))),y.length>0&&e.createElement(e.Fragment,null,e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Pending invites"),e.createElement(i,{surface:"primary",style:{padding:"var(--space-m)"}},y.map(a=>e.createElement("div",{key:a.id,className:"pending-row"},e.createElement("div",null,e.createElement(s,null,a.email),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.role," · ",a.status)),e.createElement("div",{style:{display:"flex",gap:"var(--space-s)"}},p&&e.createElement(o,{variant:"link",onClick:()=>p(a)},"Resend"),d&&e.createElement(o,{variant:"link",onClick:()=>d(a),style:{color:"var(--color-error, #c00)"}},"Cancel")))))))},H=({title:a="API Keys",subtitle:t="Manage your API keys for programmatic access",keys:n=[],onCreateKey:l,onRevokeKey:c})=>{const m=n.length>0?n:[{id:"1",name:"Production",prefix:"sk_live_••••••••••••",created:"Mar 1, 2026"},{id:"2",name:"Development",prefix:"sk_test_••••••••••••",created:"Feb 15, 2026"}];return e.createElement("div",{"data-component":"@ossy/pages/api-keys"},e.createElement("style",{href:"@ossy/pages/api-keys",precedence:"high"},'\n [data-component="@ossy/pages/api-keys"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/api-keys"] .key-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n flex-wrap: wrap;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/api-keys"] .key-row:last-child {\n border-bottom: none;\n }\n\n [data-component="@ossy/pages/api-keys"] .warning {\n padding: var(--space-m);\n background: var(--surface-secondary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n margin-bottom: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xl)"}},t),e.createElement("div",{className:"warning"},e.createElement(s,{variant:"small"},"Keep your API keys secure. Never share them or commit them to version control.")),l&&e.createElement(o,{variant:"cta",onClick:l,style:{marginBottom:"var(--space-xl)"}},"Create new key"),e.createElement(i,{surface:"primary",style:{padding:"var(--space-m)"}},m.map(a=>e.createElement("div",{key:a.id,className:"key-row"},e.createElement("div",null,e.createElement(s,null,a.name),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)",fontFamily:"monospace"}},a.prefix),a.created&&e.createElement(s,{variant:"small",style:{display:"block",color:"var(--foreground-secondary)"}},"Created ",a.created)),c&&e.createElement(o,{variant:"link",onClick:()=>c(a),style:{color:"var(--color-error, #c00)"}},"Revoke")))))},K=({title:a="Help & Support",subtitle:t="Find answers or get in touch",faqs:n=[],contactEmail:l,contactLink:i,documentationLink:c})=>{const m=n.length>0?n:[{question:"How do I reset my password?",answer:'Go to Settings > Security and click "Reset password". You\'ll receive an email with a link to set a new password.'},{question:"How do I change my plan?",answer:"Visit the Billing page to upgrade or downgrade your subscription. Changes take effect immediately."},{question:"How do I invite team members?",answer:"Go to the Team page and enter their email address. They'll receive an invitation to join your workspace."}];return e.createElement("div",{"data-component":"@ossy/pages/support"},e.createElement("style",{href:"@ossy/pages/support",precedence:"high"},'\n [data-component="@ossy/pages/support"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/support"] .faq-item {\n padding: var(--space-l) 0;\n border-bottom: 1px solid var(--separator-primary);\n }\n\n [data-component="@ossy/pages/support"] .faq-item:last-child {\n border-bottom: none;\n }\n\n [data-component="@ossy/pages/support"] .faq-question {\n margin-bottom: var(--space-s);\n }\n\n [data-component="@ossy/pages/support"] .contact-section {\n margin-top: var(--space-xxl);\n padding-top: var(--space-xxl);\n border-top: 1px solid var(--separator-primary);\n text-align: center;\n }\n\n [data-component="@ossy/pages/support"] .contact-actions {\n display: flex;\n gap: var(--space-m);\n justify-content: center;\n flex-wrap: wrap;\n margin-top: var(--space-m);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-l)"}},"Frequently asked questions"),m.map((a,t)=>e.createElement("div",{key:t,className:"faq-item"},e.createElement(r,{variant:"tertiary",as:"h3",className:"faq-question"},a.question),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.answer))),e.createElement("div",{className:"contact-section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-s)"}},"Still need help?"),e.createElement(s,{style:{marginBottom:"var(--space-m)"}},l?`Reach out at ${l}`:"We're here to help."),e.createElement("div",{className:"contact-actions"},i&&e.createElement(o,h({variant:"cta"},i),"Contact support"),c&&e.createElement(o,h({variant:"secondary"},c),"Documentation"))))},G=({title:a="Page not found",subtitle:t="The page you're looking for doesn't exist or has been moved.",homeLink:n})=>e.createElement("div",{"data-component":"@ossy/pages/not-found"},e.createElement("style",{href:"@ossy/pages/not-found",precedence:"high"},'\n [data-component="@ossy/pages/not-found"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 70vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/not-found"] .code {\n font-size: 6rem;\n font-weight: 200;\n line-height: 1;\n color: var(--foreground-secondary, #999);\n margin-bottom: var(--space-m);\n }\n\n [data-component="@ossy/pages/not-found"] .actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement("div",{className:"code"},"404"),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"400px",marginBottom:"var(--space-l)"}},t),n&&e.createElement("div",{className:"actions"},e.createElement(o,h({variant:"cta"},n),"Go to homepage"))),$=({title:a="Access denied",subtitle:t="You don't have permission to view this page.",homeLink:n,loginLink:l})=>e.createElement("div",{"data-component":"@ossy/pages/unauthorized"},e.createElement("style",{href:"@ossy/pages/unauthorized",precedence:"high"},'\n [data-component="@ossy/pages/unauthorized"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 70vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/unauthorized"] .code {\n font-size: 6rem;\n font-weight: 200;\n line-height: 1;\n color: var(--foreground-secondary, #999);\n margin-bottom: var(--space-m);\n }\n\n [data-component="@ossy/pages/unauthorized"] .actions {\n display: flex;\n gap: var(--space-m);\n margin-top: var(--space-xl);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),e.createElement("div",{className:"code"},"403"),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"400px",marginBottom:"var(--space-l)"}},t),e.createElement("div",{className:"actions"},n&&e.createElement(o,h({variant:"cta"},n),"Go to homepage"),l&&e.createElement(o,h({variant:"secondary"},l),"Sign in"))),V=({title:a="We'll be back soon",subtitle:t="We're performing scheduled maintenance. Please check back in a few minutes.",estimatedTime:n})=>e.createElement("div",{"data-component":"@ossy/pages/maintenance"},e.createElement("style",{href:"@ossy/pages/maintenance",precedence:"high"},'\n [data-component="@ossy/pages/maintenance"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/maintenance"] .icon {\n font-size: 4rem;\n margin-bottom: var(--space-xl);\n opacity: 0.5;\n }\n '),e.createElement("div",{className:"icon"},"⚙️"),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"400px",marginBottom:"var(--space-s)"}},t),n&&e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},"Estimated downtime: ",n)),U=({title:a="No data yet",subtitle:t="Get started by creating your first item.",icon:n,action:l,secondaryAction:i})=>e.createElement("div",{"data-component":"@ossy/pages/empty-state"},e.createElement("style",{href:"@ossy/pages/empty-state",precedence:"high"},'\n [data-component="@ossy/pages/empty-state"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 40vh;\n padding: var(--space-xxl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/empty-state"] .icon {\n font-size: 4rem;\n margin-bottom: var(--space-xl);\n opacity: 0.4;\n }\n\n [data-component="@ossy/pages/empty-state"] .actions {\n display: flex;\n gap: var(--space-m);\n margin-top: var(--space-xl);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),n&&e.createElement("div",{className:"icon"},n),e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{maxWidth:"400px",color:"var(--foreground-secondary)"}},t),e.createElement("div",{className:"actions"},l&&e.createElement(o,h({variant:"cta"},l),l.label\|\|"Get started"),i&&e.createElement(o,h({variant:"secondary"},i),i.label\|\|"Learn more")));export{H as ApiKeys,z as Billing,O as Dashboard,P as DeleteAccount,U as EmptyState,E as Footer,L as ForgotPassword,k as LandingPage2020,A as Login,V as Maintenance,G as NotFound,F as Onboarding,R as Pricing,W as ResetPassword,N as Resume,q as Settings,T as SignUp,K as Support,M as Team,S as ThemeDisplay,I as TwoFactorSetup,$ as Unauthorized,D as VerifyEmail,C as useResume};
1	+ import e,{useState as a,useEffect as t}from"react";import{View as n,Title as r,Text as s,Button as o,Image as i,Card as l,Guide as c,Stack as m,ProfileCard as p,Tabs as d,Dropdown as g,ContextMenu as y,Tags as v,ResumeExperience as u,PageSection as x,Input as f}from"@ossy/design-system";function h(){return h=Object.assign?Object.assign.bind():function(e){for(var a=1;a<arguments.length;a++){var t=arguments[a];for(var n in t)({}).hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},h.apply(null,arguments)}const E=({columns:a=[]})=>e.createElement(n,{layout:"row",placeContent:"normal space-between",gap:"xl"},a.map(a=>e.createElement("div",{style:{maxWidth:`var(--max-width-${a.maxWidth}, 100%)`}},e.createElement(r,{as:"h3",variant:"tertiary",style:{marginBottom:"var(--space-m)"}},a.title),!!a.text&&e.createElement(s,null,a.text),!!a.list&&e.createElement("ul",{key:a.title,style:{padding:"0"}},a.list.map(({label:a,...t})=>e.createElement("li",{key:a,style:{listStyle:"none"}},e.createElement(o,h({variant:"link"},t,{style:{marginBottom:"var(--space-m)"}}),a))))))),b=({title:a,titleMaxWidth:t="800px",text:n,actions:i=[]})=>e.createElement("div",{"data-component":"hero"},e.createElement("style",{href:"@ossy/pages/hero",precedence:"high"},'\n [data-component="hero"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n }\n\n @media (min-width: 820px) {\n [data-component="hero"] {\n /* min-height: 60vh; */\n flex: 0 0 auto;\n }\n }\n '),e.createElement(r,{variant:"display",style:{maxWidth:t,marginBottom:"var(--space-l)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-l)"}},n),e.createElement("div",{style:{display:"flex",gap:"var(--space-m)"}},i.map(({label:a,...t})=>e.createElement(o,h({},t,{key:a}),a)))),w=({columns:a=[]})=>e.createElement(n,{layout:"row",placeContent:"normal space-between",gap:"xl",className:"footer"},e.createElement("style",{href:"@ossy/pages/footer",precedence:"high"},"\n .footer {\n padding: var(--space-s);\n }\n\n .footer .title {\n margin-bottom: var(--space-m);\n }\n\n .footer .list {\n padding: 0;\n }\n\n .footer .list-item {\n list-style: none;\n }\n "),a.map(a=>e.createElement("div",{style:{maxWidth:`var(--max-width-${a.maxWidth}, 100%)`}},e.createElement(r,{as:"h3",variant:"tertiary",className:"title",style:{color:"var(--color-primary)"}},a.title),!!a.text&&e.createElement(s,{style:{color:"var(--color-primary)"}},a.text),!!a.list&&e.createElement("ul",{className:"list",key:a.title},a.list.map(({label:a,...t})=>e.createElement("li",{className:"list-item",key:a},e.createElement(o,h({variant:"link"},t,{style:{marginBottom:"var(--space-m)"}}),a))))))),k=[{id:"about",surface:"decorated",style:{padding:"var(--space-xxl) var(--space-m)"},render:({about:a,socialProof:t})=>e.createElement(e.Fragment,null,e.createElement(n,{alignItems:"stretch",justifyContent:"center",style:{marginBottom:"var(--space-xl)"}},a.columns.map(({name:a,role:t,imgSrc:n,text:o})=>e.createElement("div",{key:a,style:{display:"flex",flexDirection:"column",justifyContent:"center"}},e.createElement(i,{key:a,src:n,style:{borderRadius:"50%",width:"100%",maxWidth:"200px",height:"auto",margin:"0 auto",marginBottom:"var(--space-l)"}}),e.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"var(--space-s)",alignItems:"center",marginBottom:"var(--space-l)"}},e.createElement(r,{as:"h1",variant:"primary"},a),e.createElement(r,{as:"h2",variant:"lead"},t)),e.createElement(s,{style:{textAlign:"center",maxWidth:"600px",margin:"0 auto"}},o)))),e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-l)",textAlign:"center"}},t.title),e.createElement(n,{layout:"row",justifyContent:"space-between",gap:"m"},t.columns.map(({title:a,logo:t})=>e.createElement("div",{key:a,style:{textAlign:"center"}},e.createElement(l,null,e.createElement(i,{src:t,style:{height:"20px",width:"auto"}}))))))},{id:"hero",surface:"primary",style:{padding:"var(--space-xxl) var(--space-m) var(--space-xl)"},render:({hero:a})=>e.createElement(b,a)},{id:"services",surface:"primary",maxWidth:"large",layout:"row",placeContent:"stretch space-around",gap:"xl",style:{borderBottom:"1px solid var(--separator-primary)",padding:"var(--space-xxl) var(--space-m)"},render:({services:a})=>e.createElement(e.Fragment,null,a.map(({title:a,text:t})=>e.createElement("div",{key:a,style:{textAlign:"center"}},e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"600px"}},t))))},{id:"projects",surface:"primary",style:{padding:"var(--space-xxl) var(--space-m) var(--space-xl)",minHeight:"60vh"},render:({projects:a})=>e.createElement(e.Fragment,null,e.createElement(c,{title:a.title,titleVariant:"display",text:a.text,style:{textAlign:"left",maxWidth:"600px",marginBottom:"var(--space-xl)"}}),a.categories.map(({title:a,text:t,links:n})=>e.createElement("div",{style:{marginBottom:"var(--space-xl)"}},e.createElement(r,{title:a,variant:"tertiary",style:{marginBottom:"var(--space-l)"}},a),e.createElement(s,null,t),e.createElement(m,null,n.map(a=>e.createElement(m,{horizontal:!0,style:{marginBottom:"var(--space-m)"}},a.map(a=>e.createElement(o,h({},a,{variant:"link",target:"_blank",style:{marginRight:"var(--space-m)"}})))))))))},{id:"contact",surface:"accent",style:{padding:"var(--space-xxl) var(--space-m)",borderBottom:"1px solid var(--separator-primary)"},render:({contact:a})=>e.createElement(w,{columns:a.columns})}],B=(e,a)=>{const t=e=>e?.date?.split(" - ")?.[0]\|\|"1900",n=new Date(t(e));return new Date(t(a))-n},C=(e=[])=>{e.sort(B);const[n,r]=a([]),[s,o]=a([]),[i,l]=a([]),[c,m]=a([]),[p,d]=a([]),[g,y]=a();Object.keys(e.flatMap(e=>e.tags).filter(e=>!!e).reduce((e,a)=>({[a]:"",...e}),{}));const v=Object.keys(e.reduce((e,a)=>({[a.typeOfExperience]:"",...e}),{}));t(()=>{let a=e;p.length&&(a=e.filter(e=>e?.tags?.map(e=>e.toLowerCase())?.some(e=>p.map(e=>e.toLowerCase()).includes(e)))),g&&(a=a.filter(e=>e.typeOfExperience===g));const t=(e=>e.reduce((e,a)=>(e[a.typeOfExperience\|\|"Other"].push(a),e),{Work:[],Education:[],Project:[],Other:[]}))(a);r(t.Work),o(t.Education),l(t.Project),m(t.Other)},[p,e,g]);return{work:n,education:s,project:i,other:c,tags:[],categories:v,activeTags:p,toggleActiveTag:e=>{d(a=>a.includes(e)?a.filter(a=>a!==e):[...a,e])},activeExperienceType:g,toggleActiveExperienceType:e=>{e!==g&&y("All"===e?void 0:e)}}},N=({status:a,profile:t,experiences:n,translations:s,profileCardProps:i={},actions:l=[]})=>{const{work:c,education:m,project:x,other:f,tags:E,categories:b,activeTags:w,toggleActiveTag:k,activeExperienceType:B,toggleActiveExperienceType:N}=C(n),j=[{id:"All",label:s.all},{id:"Work",label:s.work},{id:"Project",label:s.projects},{id:"Education",label:s.education},{id:"Other",label:s.other}].filter(e=>"All"===e.id?e:b.includes(e.id)),S=[{title:s.work,experiences:c},{title:s.projects,experiences:x},{title:s.education,experiences:m},{title:s.other,experiences:f}];return e.createElement("div",{"data-component":"@ossy/pages/resume","data-status":a},e.createElement("style",{href:"@ossy/pages/resume",precedence:"high"},'\n [data-component="@ossy/pages/resume"] {\n\n --padding: var(--resume-padding, 0);\n --background: var(--resume-background, transparent);\n --header-padding: var(--resume-header-padding, 8px 24px 8px 0);\n --header-justify-content: var(--resume-header-justify-content, center);\n --filter-padding: var(--resume-filter-padding, var(--space-s) var(--space-m));\n --content-background: var(--resume-content-background, transparent);\n\n background: var(--background);\n padding: var(--padding);\n display: grid;\n grid-template-columns: 1fr;\n grid-template-rows: fit-content fit-content fit-content;\n grid-template-areas:\n "profile-summary"\n "actions"\n "content";\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="actions"] {\n min-width: 0;\n box-sizing: border-box;\n grid-area: actions;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: var(--header-padding);\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="actions"]::-webkit-scrollbar {\n display: none;\n }\n\n [data-component="@ossy/pages/resume"] .secondary-actions {\n display: none;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="profile-summary"] {\n grid-area: profile-summary;\n z-index: 1;\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="content"] {\n display: flex;\n width: 100%;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n grid-area: content;\n padding: var(--space-l) var(--space-m);\n margin: var(--content-margin);\n gap: var(--space-xl);\n background: var(--content-background);\n }\n\n [data-component="@ossy/pages/resume"] [data-animation="fade-in"] {\n opacity: 0;\n transition-property: opacity, transform;\n transition-duration: 1s, 1s;\n transition-timing-function: ease-in-out;\n transform: translateZ(0);\n }\n\n [data-component="@ossy/pages/resume"] [data-scroll] {\n scrollbar-width: none;\n overflow-y: auto;\n }\n\n [data-component="@ossy/pages/resume"] [data-scroll]::-webkit-scrollbar {\n display: none;\n }\n\n [data-component="@ossy/pages/resume"][data-status="Success"] [data-animation="fade-in"] {\n opacity: 1;\n }\n\n [data-component="@ossy/pages/resume"] .content-section {\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n width: 100%;\n max-width: 700px;\n }\n\n @media (min-width: 1200px) {\n [data-component="@ossy/pages/resume"] {\n height: 100vh;\n grid-template-columns: 400px 1fr;\n grid-template-rows: min-content 1fr;\n grid-template-areas:\n "profile-summary actions"\n "profile-summary content";\n }\n\n [data-component="@ossy/pages/resume"] [data-slot="actions"] {\n justify-content: space-between;\n }\n\n [data-component="@ossy/pages/resume"] .secondary-actions {\n display: flex;\n }\n }\n\n @media (min-width: 1900px) {\n [data-component="@ossy/pages/resume"] [data-slot="content"] {\n grid-column-start: profile-summary;\n grid-column-end: content;\n grid-row-start: content;\n grid-row-end: content;\n }\n }\n '),e.createElement(p,h({"data-scroll":!0,"data-slot":"profile-summary",activeTags:w,onTagClick:k,translations:s,surface:"primary"},i,t)),e.createElement("header",{className:"actions","data-slot":"actions","data-surface":"primary"},e.createElement(d,{tabs:j,activeTabId:B\|\|"All",onTabClick:(e,a)=>N(a.id),style:{borderBottom:E.length?"var(--header-border-bottom)":void 0}}),e.createElement("div",{className:"secondary-actions"},l.map(({label:a,contextMenu:t,...n})=>t?e.createElement(g,{trigger:e.createElement(o,n,a)},e.createElement(y,null,t.map(a=>e.createElement(y.Item,a,a.label)))):e.createElement(o,n,a))),!!E.length&&e.createElement(v,{tags:E,activeTags:w,onSelect:k,style:{padding:"var(--filter-padding)",display:"flex"}})),e.createElement("main",{className:"content","data-slot":"content","data-scroll":!0},S.filter(e=>!!e.experiences.length).map(({title:a,experiences:t})=>e.createElement("section",{className:"content-section",key:a},e.createElement(r,{variant:"primary",style:{textAlign:"center"}},a),e.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"var(--space-l)"}},t.map(a=>e.createElement(u,{key:a.id\|\|a.title,title:a.title,subTitle:a.subTitle,date:a.date,description:a.description,website:a.website,github:a.github,tags:a.tags})))))))},j=({title:a,titleVariant:t="secondary",titleAs:n="h2",text:o,children:i,maxWidth:l="l",...c})=>e.createElement(x,h({maxWidth:l},c,{style:{padding:"var(--space-xl) var(--space-m)",borderBottom:"1px solid var(--separator-primary)"}}),e.createElement(r,{as:n,variant:t,style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"600px",marginBottom:"var(--space-xl)"}},o),i),S=({theme:a={}})=>e.createElement(e.Fragment,null,e.createElement(j,{title:"Theme overview",titleVariant:"primary",titleAs:"h1",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "}),e.createElement(j,{title:"Colors",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row-wrap",gap:"xl"},Object.entries(a.color).map(([a])=>e.createElement("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"flex-start",flexWrap:"wrap",gap:"var(--space-l)"}},e.createElement("div",{variant:a,style:{width:"200px",height:"var(--space-xl)",backgroundColor:`var(--color-${a})`,border:"1px solid var(--separator-primary)",borderRadius:"var(--space-xs)",boxSizing:"border-box"}}),e.createElement(s,null,a))))),e.createElement(j,{title:"Spacing",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row",gap:"xl"},Object.entries(a.space).map(([a,t])=>e.createElement("div",{style:{display:"flex",flexDirection:"column",justifyContent:"flex-end",alignItems:"center"}},e.createElement("div",{style:{background:"var(--button-cta-background)",width:"20px",height:t,borderRadius:"var(--space-xxs)",marginBottom:"var(--space-m)"}}),e.createElement(s,null,a," - ",t))))),e.createElement(j,{title:"Content sizes (max width)",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{gap:"s"},Object.entries(a["max-width"]).map(([a,t])=>e.createElement(n,{layout:"row",gap:"l"},e.createElement(s,{style:{flexBasis:"90px"}},a," - ",t),e.createElement("div",{style:{background:"var(--color-accent)",width:"100%",maxWidth:`calc(var(--max-width-${a}) / 2)`,height:"20px",borderRadius:"var(--space-xxs)"}}))))),e.createElement(j,{title:"Surfaces",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row-wrap",gap:"xl"},Object.entries(a.surface).map(([a,t])=>e.createElement("div",{style:{background:`var(--surface-${a})`,width:"300px",height:"300px",display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"var(--space-s)",border:"1px solid var(--separator-primary)"}},e.createElement(s,null,a))))),e.createElement(j,{title:"Separators",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row",gap:"xl"},Object.entries(a.separator).map(([a])=>e.createElement("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"flex-start",flexWrap:"wrap",gap:"var(--space-l)",marginBottom:"var(--space-xl)"}},e.createElement("div",{variant:a,style:{width:"300px",height:"1px",backgroundColor:`var(--separator-${a})`}}),e.createElement(s,null,a))))),e.createElement(j,{title:"Typography",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-m)"}},"Titles"),e.createElement(n,{layout:"row-wrap",gap:"xl",placeItems:"center",style:{marginBottom:"var(--space-xl)"}},Object.entries(a.title).filter(([e])=>"default"!==e).map(([a])=>e.createElement("div",{style:{padding:"var(--space-l)",borderRadius:"var(--space-s)",border:"1px solid var(--separator-primary)",display:"flex",justifyContent:"center",alignItems:"center"}},e.createElement(r,{variant:a},a)))),e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-m)"}},"Text"),e.createElement(n,{layout:"row",gap:"xl",placeItems:"center"},Object.entries(a.text).map(([a])=>e.createElement("div",{style:{padding:"var(--space-l)",borderRadius:"var(--space-s)",border:"1px solid var(--separator-primary)"}},e.createElement(s,{variant:a},a))))),e.createElement(j,{title:"Buttons",text:"\n Here you can find an overview of our patterns, colors, and components.\n Keep in mind that this is only an overview, for usage examples and documentation go to\n our Storybook page.\n "},e.createElement(n,{layout:"row-wrap",gap:"xl",alignItems:"center",justifyContent:"flex-start"},Object.entries(a.button).map(([a])=>e.createElement(o,{variant:a,style:{flexGrow:"0",flexShrink:"0"}},a))))),A=({title:t="Sign in",subtitle:n="Enter your credentials to access your account",onSubmit:i,signUpLink:l,forgotPasswordLink:c,loading:m=!1})=>{const[p,d]=a(""),[g,y]=a("");return e.createElement("div",{"data-component":"@ossy/pages/login"},e.createElement("style",{href:"@ossy/pages/login",precedence:"high"},'\n [data-component="@ossy/pages/login"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/login"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/login"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/login"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/login"] .links {\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n gap: var(--space-s);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),i?.({email:p,password:g})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Email"),e.createElement(f,{type:"email",name:"email",placeholder:"you@example.com",value:p,onChange:e=>d(e.target.value),required:!0,autoComplete:"email"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Password"),e.createElement(f,{type:"password",name:"password",placeholder:"••••••••",value:g,onChange:e=>y(e.target.value),required:!0,autoComplete:"current-password"})),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:m},m?"Signing in...":"Sign in"),e.createElement("div",{className:"links"},c&&e.createElement(o,h({variant:"link"},c),"Forgot password?"),l&&e.createElement(o,h({variant:"link"},l),"Create an account")))))},T=({title:t="Create an account",subtitle:n="Get started with your free account",onSubmit:i,loginLink:l,termsLink:c,loading:m=!1})=>{const[p,d]=a(""),[g,y]=a(""),[v,u]=a("");return e.createElement("div",{"data-component":"@ossy/pages/sign-up"},e.createElement("style",{href:"@ossy/pages/sign-up",precedence:"high"},'\n [data-component="@ossy/pages/sign-up"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/sign-up"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/sign-up"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/sign-up"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/sign-up"] .terms {\n font-size: 0.875rem;\n color: var(--foreground-secondary, inherit);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),i?.({email:p,password:g,name:v})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Name"),e.createElement(f,{type:"text",name:"name",placeholder:"Your name",value:v,onChange:e=>u(e.target.value),autoComplete:"name"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Email"),e.createElement(f,{type:"email",name:"email",placeholder:"you@example.com",value:p,onChange:e=>d(e.target.value),required:!0,autoComplete:"email"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Password"),e.createElement(f,{type:"password",name:"password",placeholder:"••••••••",value:g,onChange:e=>y(e.target.value),required:!0,autoComplete:"new-password"})),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:m},m?"Creating account...":"Create account"),c&&e.createElement(s,{variant:"small",className:"terms",style:{textAlign:"center"}},"By signing up, you agree to our"," ",e.createElement(o,h({variant:"link"},c,{style:{padding:0}}),"Terms of Service")),l&&e.createElement(o,h({variant:"link"},l,{style:{alignSelf:"center"}}),"Already have an account? Sign in"))))},L=({title:t="Reset password",subtitle:n="Enter your email and we'll send you a link to reset your password",onSubmit:i,loginLink:l,successMessage:c="Check your email for a reset link.",loading:m=!1,success:p=!1})=>{const[d,g]=a("");return p?e.createElement("div",{"data-component":"@ossy/pages/forgot-password"},e.createElement("style",{href:"@ossy/pages/forgot-password",precedence:"high"},'\n [data-component="@ossy/pages/forgot-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/forgot-password"] .success-actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},"Check your email"),e.createElement(s,{style:{marginBottom:"var(--space-l)",maxWidth:"400px"}},c),l&&e.createElement("div",{className:"success-actions"},e.createElement(o,h({variant:"cta"},l),"Back to sign in"))):e.createElement("div",{"data-component":"@ossy/pages/forgot-password"},e.createElement("style",{href:"@ossy/pages/forgot-password",precedence:"high"},'\n [data-component="@ossy/pages/forgot-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/forgot-password"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/forgot-password"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/forgot-password"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),i?.({email:d})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Email"),e.createElement(f,{type:"email",name:"email",placeholder:"you@example.com",value:d,onChange:e=>g(e.target.value),required:!0,autoComplete:"email"})),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:m},m?"Sending...":"Send reset link"),l&&e.createElement(o,h({variant:"link"},l,{style:{alignSelf:"center"}}),"Back to sign in"))))},D=({title:a="Verify your email",subtitle:t="We've sent a verification link to your email address. Click the link to activate your account.",onResend:n,loginLink:i,loading:l=!1,resent:c=!1})=>e.createElement("div",{"data-component":"@ossy/pages/verify-email"},e.createElement("style",{href:"@ossy/pages/verify-email",precedence:"high"},'\n [data-component="@ossy/pages/verify-email"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/verify-email"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n margin-top: var(--space-xl);\n align-items: center;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-l)",maxWidth:"400px"}},t),c&&e.createElement(s,{variant:"small",style:{color:"var(--color-accent)",marginBottom:"var(--space-m)"}},"A new verification link has been sent."),e.createElement("div",{className:"actions"},n&&e.createElement(o,{variant:"secondary",onClick:n,disabled:l},l?"Sending...":"Resend verification email"),i&&e.createElement(o,h({variant:"link"},i),"Back to sign in"))),W=({title:t="Set new password",subtitle:n="Enter your new password below",onSubmit:i,loginLink:l,loading:c=!1,success:m=!1,successMessage:p="Your password has been reset."})=>{const[d,g]=a(""),[y,v]=a("");if(m)return e.createElement("div",{"data-component":"@ossy/pages/reset-password"},e.createElement("style",{href:"@ossy/pages/reset-password",precedence:"high"},'\n [data-component="@ossy/pages/reset-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/reset-password"] .success-actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},"Password reset"),e.createElement(s,{style:{marginBottom:"var(--space-l)",maxWidth:"400px"}},p),l&&e.createElement("div",{className:"success-actions"},e.createElement(o,h({variant:"cta"},l),"Sign in")));const u=d===y\|\|!y;return e.createElement("div",{"data-component":"@ossy/pages/reset-password"},e.createElement("style",{href:"@ossy/pages/reset-password",precedence:"high"},'\n [data-component="@ossy/pages/reset-password"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/reset-password"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n }\n\n [data-component="@ossy/pages/reset-password"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/reset-password"] .actions {\n display: flex;\n flex-direction: column;\n gap: var(--space-m);\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/reset-password"] .error {\n color: var(--color-error, #c00);\n font-size: 0.875rem;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-xl)",textAlign:"center"}},n),e.createElement("form",{onSubmit:e=>{e.preventDefault(),d===y&&i?.({password:d})}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"New password"),e.createElement(f,{type:"password",name:"password",placeholder:"••••••••",value:d,onChange:e=>g(e.target.value),required:!0,minLength:8,autoComplete:"new-password"})),e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Confirm password"),e.createElement(f,{type:"password",name:"confirmPassword",placeholder:"••••••••",value:y,onChange:e=>v(e.target.value),required:!0,minLength:8,autoComplete:"new-password"}),y&&!u&&e.createElement(s,{className:"error"},"Passwords do not match")),e.createElement("div",{className:"actions"},e.createElement(o,{type:"submit",variant:"cta",disabled:c\|\|!u\|\|d.length<8},c?"Resetting...":"Reset password"),l&&e.createElement(o,h({variant:"link"},l,{style:{alignSelf:"center"}}),"Back to sign in"))))},P=({title:t="Delete account",subtitle:n="This action cannot be undone. All your data will be permanently removed.",confirmText:i="delete my account",onSubmit:l,cancelLink:c,loading:m=!1})=>{const[p,d]=a(""),g=p.toLowerCase()===i.toLowerCase();return e.createElement("div",{"data-component":"@ossy/pages/delete-account"},e.createElement("style",{href:"@ossy/pages/delete-account",precedence:"high"},'\n [data-component="@ossy/pages/delete-account"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/delete-account"] .content {\n max-width: 480px;\n text-align: center;\n }\n\n [data-component="@ossy/pages/delete-account"] .warning {\n padding: var(--space-m);\n background: var(--surface-primary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n margin: var(--space-xl) 0;\n border: 1px solid var(--color-error, #c00);\n }\n\n [data-component="@ossy/pages/delete-account"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n margin-top: var(--space-xl);\n }\n\n [data-component="@ossy/pages/delete-account"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/delete-account"] .actions {\n display: flex;\n gap: var(--space-m);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)",textAlign:"center"}},t),e.createElement(s,{style:{marginBottom:"var(--space-m)",textAlign:"center"}},n),e.createElement("div",{className:"warning"},e.createElement(s,{variant:"small"},"This will permanently delete your account and all associated data. This action cannot be undone.")),e.createElement("form",{onSubmit:e=>{e.preventDefault(),p.toLowerCase()===i.toLowerCase()&&l?.()}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Type ",e.createElement("strong",null,i)," to confirm"),e.createElement(f,{type:"text",value:p,onChange:e=>d(e.target.value),placeholder:i,autoComplete:"off"})),e.createElement("div",{className:"actions"},c&&e.createElement(o,h({variant:"secondary"},c),"Cancel"),e.createElement(o,{type:"submit",variant:"cta",disabled:m\|\|!g,style:{background:"var(--color-error, #c00)"}},m?"Deleting...":"Delete account"))))},I=({title:t="Two-factor authentication",subtitle:n="Add an extra layer of security to your account",enabled:i=!1,onEnable:l,onDisable:c,onVerify:m,loading:p=!1})=>{const[d,g]=a("");return i?e.createElement("div",{"data-component":"@ossy/pages/two-factor"},e.createElement("style",{href:"@ossy/pages/two-factor",precedence:"high"},'\n [data-component="@ossy/pages/two-factor"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/two-factor"] .content {\n max-width: 480px;\n text-align: center;\n }\n\n [data-component="@ossy/pages/two-factor"] .success {\n padding: var(--space-m);\n background: var(--surface-primary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n margin: var(--space-xl) 0;\n color: var(--color-accent);\n }\n\n [data-component="@ossy/pages/two-factor"] .actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},t),e.createElement(s,{style:{marginBottom:"var(--space-m)"}},"Two-factor authentication is enabled on your account."),e.createElement("div",{className:"success"},e.createElement(s,{variant:"small"},"Your account is protected with 2FA.")),c&&e.createElement("div",{className:"actions"},e.createElement(o,{variant:"secondary",onClick:c,disabled:p,style:{color:"var(--color-error, #c00)"}},p?"Disabling...":"Disable 2FA"))):e.createElement("div",{"data-component":"@ossy/pages/two-factor"},e.createElement("style",{href:"@ossy/pages/two-factor",precedence:"high"},'\n [data-component="@ossy/pages/two-factor"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 60vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/two-factor"] .content {\n max-width: 480px;\n text-align: center;\n }\n\n [data-component="@ossy/pages/two-factor"] form {\n width: 100%;\n max-width: 400px;\n display: flex;\n flex-direction: column;\n gap: var(--space-l);\n margin-top: var(--space-xl);\n }\n\n [data-component="@ossy/pages/two-factor"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/two-factor"] .steps {\n text-align: left;\n margin: var(--space-xl) 0;\n padding: var(--space-m);\n background: var(--surface-primary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n }\n\n [data-component="@ossy/pages/two-factor"] .steps ol {\n margin: 0;\n padding-left: var(--space-l);\n }\n\n [data-component="@ossy/pages/two-factor"] .steps li {\n margin-bottom: var(--space-s);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},t),e.createElement(s,{style:{marginBottom:"var(--space-m)"}},n),e.createElement("div",{className:"steps"},e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-s)"}},"To enable 2FA:"),e.createElement("ol",null,e.createElement("li",null,e.createElement(s,{variant:"small"},"Download an authenticator app (e.g. Google Authenticator)")),e.createElement("li",null,e.createElement(s,{variant:"small"},"Scan the QR code we'll show you")),e.createElement("li",null,e.createElement(s,{variant:"small"},"Enter the 6-digit code to verify")))),l?e.createElement(o,{variant:"cta",onClick:l,disabled:p},p?"Setting up...":"Enable 2FA"):e.createElement("form",{onSubmit:e=>{e.preventDefault(),m?.(d)}},e.createElement("div",{className:"field"},e.createElement(s,{variant:"small"},"Verification code"),e.createElement(f,{type:"text",placeholder:"000000",value:d,onChange:e=>g(e.target.value.replace(/\D/g,"").slice(0,6)),maxLength:6,autoComplete:"one-time-code"})),e.createElement(o,{type:"submit",variant:"cta",disabled:p\|\|6!==d.length},p?"Verifying...":"Verify and enable")))},R=({title:a="Simple, transparent pricing",subtitle:t="Choose the plan that fits your needs",plans:n=[],billingToggle:i})=>{const c=n.length>0?n:[{id:"starter",name:"Starter",price:"$9",period:"/month",description:"Perfect for individuals and small projects",features:["Up to 3 projects","Basic analytics","Email support"],cta:{label:"Get started",href:"/signup"},highlighted:!1},{id:"pro",name:"Pro",price:"$29",period:"/month",description:"For growing teams and businesses",features:["Unlimited projects","Advanced analytics","Priority support","API access"],cta:{label:"Start free trial",href:"/signup"},highlighted:!0},{id:"enterprise",name:"Enterprise",price:"Custom",period:"",description:"For large organizations with custom needs",features:["Everything in Pro","Dedicated support","Custom integrations","SLA"],cta:{label:"Contact sales",href:"/contact"},highlighted:!1}];return e.createElement("div",{"data-component":"@ossy/pages/pricing"},e.createElement("style",{href:"@ossy/pages/pricing",precedence:"high"},'\n [data-component="@ossy/pages/pricing"] {\n padding: var(--space-xxl) var(--space-m);\n }\n\n [data-component="@ossy/pages/pricing"] .header {\n text-align: center;\n margin-bottom: var(--space-xxl);\n max-width: 600px;\n margin-left: auto;\n margin-right: auto;\n }\n\n [data-component="@ossy/pages/pricing"] .plans {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n gap: var(--space-xl);\n max-width: 1200px;\n margin: 0 auto;\n align-items: stretch;\n }\n\n [data-component="@ossy/pages/pricing"] .plan-card {\n display: flex;\n flex-direction: column;\n height: 100%;\n padding: var(--space-xl);\n border-radius: var(--space-m);\n border: 1px solid var(--separator-primary);\n position: relative;\n }\n\n [data-component="@ossy/pages/pricing"] .plan-card.highlighted {\n border-color: var(--color-primary);\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);\n }\n\n [data-component="@ossy/pages/pricing"] .plan-price {\n display: flex;\n align-items: baseline;\n gap: var(--space-xs);\n margin-bottom: var(--space-s);\n }\n\n [data-component="@ossy/pages/pricing"] .plan-features {\n list-style: none;\n padding: 0;\n margin: var(--space-l) 0;\n flex: 1;\n }\n\n [data-component="@ossy/pages/pricing"] .plan-features li {\n padding: var(--space-s) 0;\n border-bottom: 1px solid var(--separator-secondary, transparent);\n display: flex;\n align-items: center;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/pricing"] .plan-features li:last-child {\n border-bottom: none;\n }\n '),e.createElement("div",{className:"header"},e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{marginBottom:i?"var(--space-l)":0}},t),i),e.createElement("div",{className:"plans"},c.map(a=>e.createElement(l,{key:a.id,surface:"primary",className:"plan-card "+(a.highlighted?"highlighted":"")},e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-s)"}},a.name),e.createElement("div",{className:"plan-price"},e.createElement(r,{variant:"display"},a.price),a.period&&e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.period)),e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-m)"}},a.description),e.createElement("ul",{className:"plan-features"},a.features?.map((a,t)=>e.createElement("li",{key:t},a))),a.cta&&e.createElement(o,h({variant:a.highlighted?"cta":"default"},a.cta,{style:{marginTop:"auto"}}),a.cta.label)))))},q=({title:a="Settings",subtitle:t="Manage your account and preferences",sections:n=[]})=>{const i=n.length>0?n:[{id:"profile",title:"Profile",description:"Update your personal information",fields:[{id:"name",label:"Name",type:"text",placeholder:"Your name"},{id:"email",label:"Email",type:"email",placeholder:"you@example.com"}],submitLabel:"Save changes"},{id:"security",title:"Security",description:"Manage your password and security settings",fields:[{id:"current-password",label:"Current password",type:"password",placeholder:"••••••••"},{id:"new-password",label:"New password",type:"password",placeholder:"••••••••"}],submitLabel:"Update password"},{id:"notifications",title:"Notifications",description:"Choose how you want to be notified",toggles:[{id:"email",label:"Email notifications",description:"Receive updates via email"},{id:"marketing",label:"Marketing emails",description:"Receive product updates and tips"}]}];return e.createElement("div",{"data-component":"@ossy/pages/settings"},e.createElement("style",{href:"@ossy/pages/settings",precedence:"high"},'\n [data-component="@ossy/pages/settings"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/settings"] .section {\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/settings"] .field {\n display: flex;\n flex-direction: column;\n gap: var(--space-s);\n margin-bottom: var(--space-l);\n }\n\n [data-component="@ossy/pages/settings"] .toggle-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n }\n\n [data-component="@ossy/pages/settings"] .toggle-row:last-child {\n border-bottom: none;\n }\n\n [data-component="@ossy/pages/settings"] .toggle-label {\n display: flex;\n flex-direction: column;\n gap: var(--space-xs);\n }\n\n [data-component="@ossy/pages/settings"] .toggle-checkbox {\n width: 44px;\n height: 24px;\n accent-color: var(--color-primary);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),i.map(a=>e.createElement(x,{key:a.id,surface:"primary",style:{marginBottom:"var(--space-xl)",padding:"var(--space-xl)"}},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-s)"}},a.title),e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-l)"}},a.description),a.fields?.map(a=>e.createElement("div",{key:a.id,className:"field"},e.createElement(s,{variant:"small"},a.label),e.createElement(f,h({type:a.type,id:a.id,placeholder:a.placeholder},a)))),a.toggles?.map(a=>e.createElement("div",{key:a.id,className:"toggle-row"},e.createElement("div",{className:"toggle-label"},e.createElement(s,null,a.label),a.description&&e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.description)),e.createElement("input",{type:"checkbox",className:"toggle-checkbox",checked:a.value??!1,onChange:e=>a.onChange?.(e.target.checked)}))),a.submitLabel&&e.createElement(o,{variant:"cta",style:{marginTop:"var(--space-m)"}},a.submitLabel))))},O=({title:a="Dashboard",subtitle:t,children:n,stats:o=[]})=>{const i=o.length>0?o:[{label:"Active users",value:"—"},{label:"Revenue",value:"—"},{label:"Conversions",value:"—"}];return e.createElement("div",{"data-component":"@ossy/pages/dashboard"},e.createElement("style",{href:"@ossy/pages/dashboard",precedence:"high"},'\n [data-component="@ossy/pages/dashboard"] {\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/dashboard"] .header {\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/dashboard"] .stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: var(--space-l);\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/dashboard"] .stat-card {\n padding: var(--space-l);\n border-radius: var(--space-m);\n border: 1px solid var(--separator-primary);\n }\n '),e.createElement("div",{className:"header"},e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),t&&e.createElement(s,{style:{color:"var(--foreground-secondary)"}},t)),e.createElement("div",{className:"stats"},i.map((a,t)=>e.createElement(l,{key:t,surface:"primary",className:"stat-card"},e.createElement(s,{variant:"small",style:{marginBottom:"var(--space-xs)"}},a.label),e.createElement(r,{variant:"primary"},a.value)))),n)},z=({title:a="Billing",subtitle:t="Manage your subscription and payment methods",currentPlan:n,paymentMethod:i,invoices:c=[],onChangePlanLink:m,onUpdatePaymentLink:p})=>{const d=n\|\|{name:"Pro",price:"$29/month",status:"active",nextBillingDate:"March 18, 2026"},g=i\|\|{last4:"4242",brand:"Visa",expiry:"12/28"};return e.createElement("div",{"data-component":"@ossy/pages/billing"},e.createElement("style",{href:"@ossy/pages/billing",precedence:"high"},'\n [data-component="@ossy/pages/billing"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/billing"] .section {\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/billing"] .plan-card,\n [data-component="@ossy/pages/billing"] .payment-card {\n padding: var(--space-xl);\n border-radius: var(--space-m);\n border: 1px solid var(--separator-primary);\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--space-m);\n margin-bottom: var(--space-m);\n }\n\n [data-component="@ossy/pages/billing"] .invoice-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n }\n\n [data-component="@ossy/pages/billing"] .invoice-row:last-child {\n border-bottom: none;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),e.createElement("div",{className:"section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Current plan"),e.createElement(l,{surface:"primary",className:"plan-card"},e.createElement("div",null,e.createElement(r,{variant:"primary"},d.name),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},d.price," · ",d.status),d.nextBillingDate&&e.createElement(s,{variant:"small",style:{display:"block",marginTop:"var(--space-xs)"}},"Next billing: ",d.nextBillingDate)),m&&e.createElement(o,h({variant:"secondary"},m),"Change plan"))),e.createElement("div",{className:"section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Payment method"),e.createElement(l,{surface:"primary",className:"payment-card"},e.createElement("div",null,e.createElement(s,null,g.brand," •••• ",g.last4),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},"Expires ",g.expiry)),p&&e.createElement(o,h({variant:"secondary"},p),"Update"))),c.length>0&&e.createElement("div",{className:"section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Invoices"),e.createElement(l,{surface:"primary",style:{padding:"var(--space-m)"}},c.map((a,t)=>e.createElement("div",{key:t,className:"invoice-row"},e.createElement("div",null,e.createElement(s,null,a.date\|\|"Mar 18, 2026"),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.description\|\|"Pro plan")),e.createElement("div",{style:{display:"flex",alignItems:"center",gap:"var(--space-m)"}},e.createElement(s,null,a.amount\|\|"$29.00"),a.downloadLink&&e.createElement(o,h({variant:"link"},a.downloadLink),"Download")))))))},F=({title:a="Welcome!",subtitle:t="Let's get you set up",steps:n=[],currentStep:i=0,onNext:l,onBack:c,onSkip:m,completeLabel:p="Get started"})=>{const d=n.length>0?n:[{id:"profile",title:"Complete your profile",description:"Add your name and avatar so your team can recognize you."},{id:"workspace",title:"Create your workspace",description:"Set up your first workspace to start collaborating."},{id:"invite",title:"Invite your team",description:"Bring your team on board to work together."}],g=d[i],y=i===d.length-1;return e.createElement("div",{"data-component":"@ossy/pages/onboarding"},e.createElement("style",{href:"@ossy/pages/onboarding",precedence:"high"},'\n [data-component="@ossy/pages/onboarding"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 70vh;\n padding: var(--space-xl) var(--space-m);\n }\n\n [data-component="@ossy/pages/onboarding"] .progress {\n display: flex;\n gap: var(--space-s);\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/onboarding"] .progress-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--separator-primary);\n transition: background 0.2s;\n }\n\n [data-component="@ossy/pages/onboarding"] .progress-dot.active {\n background: var(--color-primary);\n }\n\n [data-component="@ossy/pages/onboarding"] .content {\n max-width: 480px;\n text-align: center;\n margin-bottom: var(--space-xxl);\n }\n\n [data-component="@ossy/pages/onboarding"] .actions {\n display: flex;\n gap: var(--space-m);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),e.createElement("div",{className:"progress"},d.map((a,t)=>e.createElement("div",{key:t,className:"progress-dot "+(t<=i?"active":"")}))),e.createElement("div",{className:"content"},e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},g?.title\|\|a),e.createElement(s,{style:{color:"var(--foreground-secondary)"}},g?.description\|\|t)),e.createElement("div",{className:"actions"},i>0&&c&&e.createElement(o,{variant:"secondary",onClick:c},"Back"),m&&!y&&e.createElement(o,{variant:"link",onClick:m},"Skip"),e.createElement(o,{variant:"cta",onClick:()=>l?.(y?"complete":i+1)},y?p:"Next")))},M=({title:a="Team",subtitle:t="Invite and manage your team members",members:n=[],pendingInvites:i=[],onInvite:c,onRemoveMember:m,onResendInvite:p,onCancelInvite:d})=>{const g=n.length>0?n:[{id:"1",name:"You",email:"you@example.com",role:"Owner"},{id:"2",name:"Jane Doe",email:"jane@example.com",role:"Admin"}],y=i.length>0?i:[{id:"1",email:"pending@example.com",role:"Member",status:"pending"}];return e.createElement("div",{"data-component":"@ossy/pages/team"},e.createElement("style",{href:"@ossy/pages/team",precedence:"high"},'\n [data-component="@ossy/pages/team"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/team"] .invite-form {\n display: flex;\n gap: var(--space-m);\n margin-bottom: var(--space-xl);\n flex-wrap: wrap;\n }\n\n [data-component="@ossy/pages/team"] .invite-form input {\n flex: 1;\n min-width: 200px;\n }\n\n [data-component="@ossy/pages/team"] .member-row,\n [data-component="@ossy/pages/team"] .pending-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n flex-wrap: wrap;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/team"] .member-row:last-child,\n [data-component="@ossy/pages/team"] .pending-row:last-child {\n border-bottom: none;\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),c&&e.createElement("form",{className:"invite-form",onSubmit:e=>{e.preventDefault();const a=e.target.email?.value;a&&c({email:a})}},e.createElement(f,{type:"email",name:"email",placeholder:"Email address",required:!0}),e.createElement(o,{type:"submit",variant:"cta"},"Invite")),e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Members"),e.createElement(l,{surface:"primary",style:{padding:"var(--space-m)",marginBottom:"var(--space-xl)"}},g.map(a=>e.createElement("div",{key:a.id,className:"member-row"},e.createElement("div",null,e.createElement(s,null,a.name),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.email," · ",a.role)),m&&"Owner"!==a.role&&e.createElement(o,{variant:"link",onClick:()=>m(a),style:{color:"var(--color-error, #c00)"}},"Remove")))),y.length>0&&e.createElement(e.Fragment,null,e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-m)"}},"Pending invites"),e.createElement(l,{surface:"primary",style:{padding:"var(--space-m)"}},y.map(a=>e.createElement("div",{key:a.id,className:"pending-row"},e.createElement("div",null,e.createElement(s,null,a.email),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.role," · ",a.status)),e.createElement("div",{style:{display:"flex",gap:"var(--space-s)"}},p&&e.createElement(o,{variant:"link",onClick:()=>p(a)},"Resend"),d&&e.createElement(o,{variant:"link",onClick:()=>d(a),style:{color:"var(--color-error, #c00)"}},"Cancel")))))))},H=({title:a="API Keys",subtitle:t="Manage your API keys for programmatic access",keys:n=[],onCreateKey:i,onRevokeKey:c})=>{const m=n.length>0?n:[{id:"1",name:"Production",prefix:"sk_live_••••••••••••",created:"Mar 1, 2026"},{id:"2",name:"Development",prefix:"sk_test_••••••••••••",created:"Feb 15, 2026"}];return e.createElement("div",{"data-component":"@ossy/pages/api-keys"},e.createElement("style",{href:"@ossy/pages/api-keys",precedence:"high"},'\n [data-component="@ossy/pages/api-keys"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/api-keys"] .key-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: var(--space-m) 0;\n border-bottom: 1px solid var(--separator-primary);\n flex-wrap: wrap;\n gap: var(--space-s);\n }\n\n [data-component="@ossy/pages/api-keys"] .key-row:last-child {\n border-bottom: none;\n }\n\n [data-component="@ossy/pages/api-keys"] .warning {\n padding: var(--space-m);\n background: var(--surface-primary, rgba(0,0,0,0.05));\n border-radius: var(--space-s);\n margin-bottom: var(--space-xl);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xl)"}},t),e.createElement("div",{className:"warning"},e.createElement(s,{variant:"small"},"Keep your API keys secure. Never share them or commit them to version control.")),i&&e.createElement(o,{variant:"cta",onClick:i,style:{marginBottom:"var(--space-xl)"}},"Create new key"),e.createElement(l,{surface:"primary",style:{padding:"var(--space-m)"}},m.map(a=>e.createElement("div",{key:a.id,className:"key-row"},e.createElement("div",null,e.createElement(s,null,a.name),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)",fontFamily:"monospace"}},a.prefix),a.created&&e.createElement(s,{variant:"small",style:{display:"block",color:"var(--foreground-secondary)"}},"Created ",a.created)),c&&e.createElement(o,{variant:"link",onClick:()=>c(a),style:{color:"var(--color-error, #c00)"}},"Revoke")))))},K=({title:a="Help & Support",subtitle:t="Find answers or get in touch",faqs:n=[],contactEmail:i,contactLink:l,documentationLink:c})=>{const m=n.length>0?n:[{question:"How do I reset my password?",answer:'Go to Settings > Security and click "Reset password". You\'ll receive an email with a link to set a new password.'},{question:"How do I change my plan?",answer:"Visit the Billing page to upgrade or downgrade your subscription. Changes take effect immediately."},{question:"How do I invite team members?",answer:"Go to the Team page and enter their email address. They'll receive an invitation to join your workspace."}];return e.createElement("div",{"data-component":"@ossy/pages/support"},e.createElement("style",{href:"@ossy/pages/support",precedence:"high"},'\n [data-component="@ossy/pages/support"] {\n padding: var(--space-xl) var(--space-m);\n max-width: 800px;\n margin: 0 auto;\n }\n\n [data-component="@ossy/pages/support"] .faq-item {\n padding: var(--space-l) 0;\n border-bottom: 1px solid var(--separator-primary);\n }\n\n [data-component="@ossy/pages/support"] .faq-item:last-child {\n border-bottom: none;\n }\n\n [data-component="@ossy/pages/support"] .faq-question {\n margin-bottom: var(--space-s);\n }\n\n [data-component="@ossy/pages/support"] .contact-section {\n margin-top: var(--space-xxl);\n padding-top: var(--space-xxl);\n border-top: 1px solid var(--separator-primary);\n text-align: center;\n }\n\n [data-component="@ossy/pages/support"] .contact-actions {\n display: flex;\n gap: var(--space-m);\n justify-content: center;\n flex-wrap: wrap;\n margin-top: var(--space-m);\n }\n '),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{marginBottom:"var(--space-xxl)"}},t),e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-l)"}},"Frequently asked questions"),m.map((a,t)=>e.createElement("div",{key:t,className:"faq-item"},e.createElement(r,{variant:"tertiary",as:"h3",className:"faq-question"},a.question),e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},a.answer))),e.createElement("div",{className:"contact-section"},e.createElement(r,{variant:"tertiary",as:"h2",style:{marginBottom:"var(--space-s)"}},"Still need help?"),e.createElement(s,{style:{marginBottom:"var(--space-m)"}},i?`Reach out at ${i}`:"We're here to help."),e.createElement("div",{className:"contact-actions"},l&&e.createElement(o,h({variant:"cta"},l),"Contact support"),c&&e.createElement(o,h({variant:"secondary"},c),"Documentation"))))},G=({title:a="Page not found",subtitle:t="The page you're looking for doesn't exist or has been moved.",homeLink:n})=>e.createElement("div",{"data-component":"@ossy/pages/not-found"},e.createElement("style",{href:"@ossy/pages/not-found",precedence:"high"},'\n [data-component="@ossy/pages/not-found"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 70vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/not-found"] .code {\n font-size: 6rem;\n font-weight: 200;\n line-height: 1;\n color: var(--foreground-secondary, #999);\n margin-bottom: var(--space-m);\n }\n\n [data-component="@ossy/pages/not-found"] .actions {\n margin-top: var(--space-xl);\n }\n '),e.createElement("div",{className:"code"},"404"),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"400px",marginBottom:"var(--space-l)"}},t),n&&e.createElement("div",{className:"actions"},e.createElement(o,h({variant:"cta"},n),"Go to homepage"))),$=({title:a="Access denied",subtitle:t="You don't have permission to view this page.",homeLink:n,loginLink:i})=>e.createElement("div",{"data-component":"@ossy/pages/unauthorized"},e.createElement("style",{href:"@ossy/pages/unauthorized",precedence:"high"},'\n [data-component="@ossy/pages/unauthorized"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 70vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/unauthorized"] .code {\n font-size: 6rem;\n font-weight: 200;\n line-height: 1;\n color: var(--foreground-secondary, #999);\n margin-bottom: var(--space-m);\n }\n\n [data-component="@ossy/pages/unauthorized"] .actions {\n display: flex;\n gap: var(--space-m);\n margin-top: var(--space-xl);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),e.createElement("div",{className:"code"},"403"),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"400px",marginBottom:"var(--space-l)"}},t),e.createElement("div",{className:"actions"},n&&e.createElement(o,h({variant:"cta"},n),"Go to homepage"),i&&e.createElement(o,h({variant:"secondary"},i),"Sign in"))),V=({title:a="We'll be back soon",subtitle:t="We're performing scheduled maintenance. Please check back in a few minutes.",estimatedTime:n})=>e.createElement("div",{"data-component":"@ossy/pages/maintenance"},e.createElement("style",{href:"@ossy/pages/maintenance",precedence:"high"},'\n [data-component="@ossy/pages/maintenance"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n padding: var(--space-xl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/maintenance"] .icon {\n font-size: 4rem;\n margin-bottom: var(--space-xl);\n opacity: 0.5;\n }\n '),e.createElement("div",{className:"icon"},"⚙️"),e.createElement(r,{variant:"display",style:{marginBottom:"var(--space-m)"}},a),e.createElement(s,{style:{maxWidth:"400px",marginBottom:"var(--space-s)"}},t),n&&e.createElement(s,{variant:"small",style:{color:"var(--foreground-secondary)"}},"Estimated downtime: ",n)),U=({title:a="No data yet",subtitle:t="Get started by creating your first item.",icon:n,action:i,secondaryAction:l})=>e.createElement("div",{"data-component":"@ossy/pages/empty-state"},e.createElement("style",{href:"@ossy/pages/empty-state",precedence:"high"},'\n [data-component="@ossy/pages/empty-state"] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 40vh;\n padding: var(--space-xxl) var(--space-m);\n text-align: center;\n }\n\n [data-component="@ossy/pages/empty-state"] .icon {\n font-size: 4rem;\n margin-bottom: var(--space-xl);\n opacity: 0.4;\n }\n\n [data-component="@ossy/pages/empty-state"] .actions {\n display: flex;\n gap: var(--space-m);\n margin-top: var(--space-xl);\n justify-content: center;\n flex-wrap: wrap;\n }\n '),n&&e.createElement("div",{className:"icon"},n),e.createElement(r,{variant:"tertiary",style:{marginBottom:"var(--space-s)"}},a),e.createElement(s,{style:{maxWidth:"400px",color:"var(--foreground-secondary)"}},t),e.createElement("div",{className:"actions"},i&&e.createElement(o,h({variant:"cta"},i),i.label\|\|"Get started"),l&&e.createElement(o,h({variant:"secondary"},l),l.label\|\|"Learn more")));export{H as ApiKeys,z as Billing,O as Dashboard,P as DeleteAccount,U as EmptyState,E as Footer,L as ForgotPassword,k as LandingPage2020,A as Login,V as Maintenance,G as NotFound,F as Onboarding,R as Pricing,W as ResetPassword,N as Resume,q as Settings,T as SignUp,K as Support,M as Team,S as ThemeDisplay,I as TwoFactorSetup,$ as Unauthorized,D as VerifyEmail,C as useResume};

package/package.json CHANGED Viewed

@@ -5,7 +5,7 @@
     "url": "git+https://github.com/ossy-se/packages.git"
   },
   "description": "SaaS page templates and layouts: auth (login, signup, forgot password, verify email), pricing, settings, dashboard, 404, landing page, resume",
-  "version": "0.10.1",
+  "version": "0.11.0",
   "source": "src/index.js",
   "type": "module",
   "module": "build/index.js",
@@ -31,7 +31,7 @@
     ]
   },
   "dependencies": {
-    "@ossy/themes": "^0.10.1",
+    "@ossy/themes": "^0.11.0",
     "moment": "^2.29.4"
   },
   "peerDependencies": {
@@ -47,5 +47,5 @@
     "/build",
     "README.md"
   ],
-  "gitHead": "fa8cbcb5f24811e6844c929d7fa7cd1d2544efa7"
+  "gitHead": "ed1343d2ac7fa32121aa4b2074a01ac3562a2d75"
 }