1(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,56419,e=>{e.v({container:"HomePageCommunity-module__RpsDiq__container",primaryColumn:"HomePageCommunity-module__RpsDiq__primaryColumn",review:"HomePageCommunity-module__RpsDiq__review",reviewAuthor:"HomePageCommunity-module__RpsDiq__reviewAuthor",reviewBody:"HomePageCommunity-module__RpsDiq__reviewBody",reviewExternalLink:"HomePageCommunity-module__RpsDiq__reviewExternalLink",reviewHeader:"HomePageCommunity-module__RpsDiq__reviewHeader",reviewTitle:"HomePageCommunity-module__RpsDiq__reviewTitle",root:"HomePageCommunity-module__RpsDiq__root",secondaryColumn:"HomePageCommunity-module__RpsDiq__secondaryColumn",stat:"HomePageCommunity-module__RpsDiq__stat",statLabel:"HomePageCommunity-module__RpsDiq__statLabel",statValue:"HomePageCommunity-module__RpsDiq__statValue",stats:"HomePageCommunity-module__RpsDiq__stats"})},112732,e=>{e.v({floating:"HomePageOverlaysDemo-module__mqp2pG__floating",label:"HomePageOverlaysDemo-module__mqp2pG__label",popoverDropdown:"HomePageOverlaysDemo-module__mqp2pG__popoverDropdown"})},629368,e=>{e.v({description:"HomePageComponents-module__avxBcG__description",root:"HomePageComponents-module__avxBcG__root"})},551687,e=>{e.v({code:"HomePageDarkColorScheme-module__xq6gqa__code",darkIcon:"HomePageDarkColorScheme-module__xq6gqa__darkIcon",demo:"HomePageDarkColorScheme-module__xq6gqa__demo",description:"HomePageDarkColorScheme-module__xq6gqa__description",image:"HomePageDarkColorScheme-module__xq6gqa__image",lightIcon:"HomePageDarkColorScheme-module__xq6gqa__lightIcon",root:"HomePageDarkColorScheme-module__xq6gqa__root"})},368478,e=>{e.v({carouselIndicator:"HomePageExtensions-module__K7f5GG__carouselIndicator",demo:"HomePageExtensions-module__K7f5GG__demo",demoArea:"HomePageExtensions-module__K7f5GG__demoArea",demoControl:"HomePageExtensions-module__K7f5GG__demoControl",demoDescription:"HomePageExtensions-module__K7f5GG__demoDescription",demoHeader:"HomePageExtensions-module__K7f5GG__demoHeader",demoTitle:"HomePageExtensions-module__K7f5GG__demoTitle",description:"HomePageExtensions-module__K7f5GG__description",grid:"HomePageExtensions-module__K7f5GG__grid",root:"HomePageExtensions-module__K7f5GG__root"})},268683,e=>{e.v({description:"HomePageGetStarted-module__0tIFgq__description",guides:"HomePageGetStarted-module__0tIFgq__guides",root:"HomePageGetStarted-module__0tIFgq__root"})},139727,e=>{e.v({column:"HomePageHooks-module__288CWa__column",demos:"HomePageHooks-module__288CWa__demos",description:"HomePageHooks-module__288CWa__description",header:"HomePageHooks-module__288CWa__header",root:"HomePageHooks-module__288CWa__root",title:"HomePageHooks-module__288CWa__title",titleLink:"HomePageHooks-module__288CWa__titleLink"})},506417,e=>{e.v({arrow:"SocialCards-module__QjItPW__arrow",card:"SocialCards-module__QjItPW__card",description:"SocialCards-module__QjItPW__description",discord:"SocialCards-module__QjItPW__discord",github:"SocialCards-module__QjItPW__github",hc:"SocialCards-module__QjItPW__hc",icon:"SocialCards-module__QjItPW__icon",title:"SocialCards-module__QjItPW__title",twitter:"SocialCards-module__QjItPW__twitter"})},130307,e=>
1{e.v({cards:"HomePageJoin-module___yhS-q__cards",description:"HomePageJoin-module___yhS-q__description",root:"HomePageJoin-module___yhS-q__root"})},125762,e=>{e.v({action:"HomePageJumbotron-module__LspnZW__action",actions:"HomePageJumbotron-module__LspnZW__actions",container:"HomePageJumbotron-module__LspnZW__container",image:"HomePageJumbotron-module__LspnZW__image",main:"HomePageJumbotron-module__LspnZW__main",overlay:"HomePageJumbotron-module__LspnZW__overlay",root:"HomePageJumbotron-module__LspnZW__root",slide:"HomePageJumbotron-module__LspnZW__slide"})},638004,e=>{e.v({code:"HomePageLLM-module__92scuG__code",column:"HomePageLLM-module__92scuG__column",main:"HomePageLLM-module__92scuG__main",root:"HomePageLLM-module__92scuG__root"})},612282,(e,a,t)=>{a.exports=[{name:"Metabase",image:"https://opencollective-production.s3.us-west-1.amazonaws.com/account-avatar/6daa6216-6749-4a98-96c9-976d311cec1e/54813187-8601-458a-bec2-8ac3df42919b.png",url:"https://www.metabase.com/?utm_campaign=opencollective",monthlyDonation:null,totalDonations:38},{name:"PropelAuth",image:"https://opencollective-production.s3.us-west-1.amazonaws.com/account-avatar/e6d0bf51-6618-4c51-a19f-a6f79d71779b/social-logo-small.png",url:"https://www.propelauth.com",monthlyDonation:null,totalDonations:34},{name:"Medplum",image:"https://opencollective-production.s3.us-west-1.amazonaws.com/account-avatar/ce7222f1-22a5-48d7-8d54-a91405c1b02a/medplum-symbol-512x512.png",url:"https://www.medplum.com/",monthlyDonation:null,totalDonations:28},{name:"N-iX Ltd",image:"https://opencollective-production.s3.us-west-1.amazonaws.com/account-avatar/6d43cabd-7f83-4770-8b2e-068e70aded73/N-iX_Logo-RGB_Main%20(2).jpg",url:"https://www.n-ix.com/",monthlyDonation:null,totalDonations:20},{name:"Followerhit",image:"https://opencollective-production.s3.us-west-1.amazonaws.com/account-avatar/58c39ad3-082f-46e5-aa75-e1a195d3179b/followerhit-square-d.webp",url:"https://followerhit.de/",monthlyDonation:null,totalDonations:16}]},206410,e=>{e.v({description:"HomePageSponsors-module__OgcdSW__description",image:"HomePageSponsors-module__OgcdSW__image",inner:"HomePageSponsors-module__OgcdSW__inner",name:"HomePageSponsors-module__OgcdSW__name",sponsor:"HomePageSponsors-module__OgcdSW__sponsor",sponsors:"HomePageSponsors-module__OgcdSW__sponsors",title:"HomePageSponsors-module__OgcdSW__title"})},10617,e=>{e.v({column:"HomePageStyles-module__KOzceW__column",main:"HomePageStyles-module__KOzceW__main",root:"HomePageStyles-module__KOzceW__root"})},605775,e=>{e.v({body:"HomePageUI-module__TsrwGa__body",control:"HomePageUI-module__TsrwGa__control",controls:"HomePageUI-module__TsrwGa__controls",description:"HomePageUI-module__TsrwGa__description",highlight:"HomePageUI-module__TsrwGa__highlight",image:"HomePageUI-module__TsrwGa__image",overlay:"HomePageUI-module__TsrwGa__overlay",supTitle:"HomePageUI-module__TsrwGa__supTitle",title:"HomePageUI-module__TsrwGa__title",wrapper:"HomePageUI-module__TsrwGa__wrapper"})},60117,e=>{e.v({root:"HomePage-module__WYAHaG__root"})},426309,e=>{"use strict";var a=e.i(391398);e.i(629122);var t=e.i(517923);e.i(858568);var l=e.i(271105),o=e.i(41158),n=e.i(639613),i=e.i(79897),s=e.i(232471),r=e.i(140763),d=e.i(804052),c=e.i(97462),m=e.i(332204),u=e.i(505704),h=e.i(500518),A=e.i(454386),p=e.i(607935),g=e.i(882377);let x=g.Container.withProps({size:1440});var f=e.i(56206),v=e.i(883364),_=e.i(242273);function b({className:e,...t}){return(0,a.jsx)(v.Text,{className:(0,f.default)(_.default.root,e),...t})}var j=e.i(359596);function H({className:e,children:t,href:l="/",...s}){return(0,a.jsx)(i.Anchor,{component:o.default,href:l,className:(0,f.default)(j.default.root,e),...s,children:(0,a.jsxs)("span",{className:j.default.inner,children:[t,(0,a.jsx)(n.ArrowUpRightIcon,{size:16})]})})}var w=e.i(378320);function M({className:e,...t}){return(0,a.jsx)(d.Title,{className:(0,f.default)(w.default.title,e),...t})}var y=e.i(172129);let V=[{title:"Autocomplete with search highlight",name:"AutocompleteHighlight",component:c.AutocompleteHighlight},{title:"Multiselect with selected items limit",name:"MaxSelectedItems",component:m.MaxSelectedItems},{title:"Creatable Multiselect",name:"MultiSelectCreatable",component:u.MultiSelectCreatable},{title:"Select with search in dropdown",name:"SelectDropdownSearch",component:h.SelectDropdownSearch},{title:"Select with custom option component",name:"SelectOptionComponent",component:A.SelectOptionComponent},{title:"Transfer list with inline options list",name:"TransferList",hiddenOnMobile:!0,component:p.TransferList}];function Z({title:e,name:t,hiddenOnMobile:l,component:r}
1){return(0,a.jsxs)(s.Box,{visibleFrom:l?"sm":void 0,className:y.default.demo,children:[(0,a.jsxs)("header",{className:y.default.demoHeader,children:[(0,a.jsx)(d.Title,{order:3,className:y.default.demoTitle,children:e}),(0,a.jsxs)(i.Anchor,{component:o.default,href:`/combobox/?e=${t}`,className:y.default.demoLink,children:[(0,a.jsx)("span",{children:"View example code"}),(0,a.jsx)(n.ArrowUpRightIcon,{size:16})]})]}),(0,a.jsx)("div",{className:y.default.demoArea,children:(0,a.jsx)(r,{})})]})}function L(){let e=V.map(e=>(0,a.jsx)(Z,{...e},e.name));return(0,a.jsx)("section",{className:y.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"Combobox component"}),(0,a.jsx)(b,{className:y.default.description,children:"Combobox is a composable component which can be used to create custom select, multiselect, autocomplete, tags input and other similar components. It provides a lot of flexibility and gives you full control over the UI and behavior while keeping your codebase clean and simple."}),(0,a.jsx)(H,{href:"/combobox/?e=BasicSelect",children:"Explore all 50+ Combobox examples"}),(0,a.jsx)(r.SimpleGrid,{cols:{lg:3,sm:2},className:y.default.grid,children:e})]})})}var C=e.i(544117),k=e.i(141806),E=e.i(725695),S=e.i(266721);let I=[{title:"One of the best UI libraries I've come across.",body:"<p>I am a senior Frontend Developer and wanted to use something new instead of Material UI and came across this, it has been well thought of all the different scenarios you and come across, and the hooks are just pure love :)</p><p>Thank you so much for this.</p>",link:"https://github.com/orgs/mantinedev/discussions/5783",author:{nickname:"smsuraj100",avatar:"https://avatars.githubusercontent.com/u/16137686?v=4"}},{title:"You nailed it!",body:"<p>Man, I've been doing Front-End for 20 years. This is, hands-down, the best component library I've ever used. What's more, the parts that I didn't like (Styling from JS Objects, slow with big forms) have been addressed in v7. Please keep it up, this library deserves more exposure, it just works and works well and beautifully. Many thanks to <a href='https://github.com/rtivital' target='_blank'>@rtivital</a> and the contributors!</p>",link:"https://github.com/orgs/mantinedev/discussions/6150",author:{nickname:"sideral",avatar:"https://avatars.githubusercontent.com/u/192025?v=4"}},{title:"Absurdly good",body:"<p>Hope this kind of post is ok - just wanted to say thank you.</p><p>I've been writing software professionally for 25 years, with the last 15 in web (mostly internal projects in my company). This is easily the best component library I've ever used.</p><p>In every other instance I've run into the boundaries of what the library does and have to spend a lot of time and energy customizing or extending it. Not only does Mantine provide easy access to everything under the hood, but 99% the things you need are provided as default options. I've started to lose count of the \"guess I'd better build my standard xyz... oh wait, they have that too\" moments. Also the docs are perfect.</p><p>Bravo, thank you.</p>",link:"https://github.com/orgs/mantinedev/discussions/5504",author:{nickname:"leighton-carr",avatar:"https://avatars.githubusercontent.com/u/18201458?v=4"}},{title:"Thank you mantine ð",body:"<p>Dear Mantine Team, thank you for putting this library together. I have started to use and love Mantine in my free time, and bringing this great library to good use in our company now. All the developers are very pleased with the development experience, the time savings for any bigger project is insane. The amount of flexibility we have with our designers and developers will result in great products. All thanks to every contributor. Continue the good work!</p>",link:"https://github.com/orgs/mantinedev/discussions/3741",author:{nickname:"Gitgud6969",avatar:"https://avatars.githubusercontent.com/u/57042505?v=4"}},{title:"A solution for every problem",body:"<p>Mantine has a solution for every problem Iâve needed to solve in my web app. Components and props are named clearly, design choices promote simplicity, and it looks beautiful out of the box. Thank y
1ou for jump starting my application in a big way!</p>",link:"https://github.com/orgs/mantinedev/discussions/5456",author:{nickname:"SeeSharpCode",avatar:"https://avatars.githubusercontent.com/u/10228483?v=4"}},{title:"Thank you Mantine!",body:"<p>Out of all react component libraries that I have ever seen this one is the most straight forward, easy to use, well documented and really beautiful. I plan on switching and using this full time. Just wanted to say huge thanks to the people that made this.</p>",link:"https://github.com/orgs/mantinedev/discussions/259",author:{nickname:"OmkoBass",avatar:"https://avatars.githubusercontent.com/u/40026131?v=4"}}];var P=e.i(56419);function N({data:e}){return(0,a.jsxs)("article",{className:P.default.review,children:[(0,a.jsxs)("div",{className:P.default.reviewHeader,children:[(0,a.jsxs)(E.Group,{gap:"sm",children:[(0,a.jsx)(k.Avatar,{src:e.author.avatar,alt:e.author.nickname,size:30}),(0,a.jsxs)(v.Text,{component:"a",href:`https://github.com/${e.author.nickname}`,className:P.default.reviewAuthor,children:["@",e.author.nickname]})]}),(0,a.jsxs)(i.Anchor,{className:P.default.reviewExternalLink,href:e.link,target:"_blank",children:[(0,a.jsx)("span",{children:"Open on GitHub"}),(0,a.jsx)(C.ArrowSquareOutIcon,{size:16})]})]}),(0,a.jsx)(v.Text,{component:"a",href:e.link,target:"_blank",className:P.default.reviewTitle,children:e.title}),(0,a.jsx)("div",{className:P.default.reviewBody,dangerouslySetInnerHTML:{__html:e.body}})]})}function F({label:e,value:t,link:l}){return(0,a.jsxs)("a",{href:l,target:"_blank",className:P.default.stat,rel:"noreferrer",children:[(0,a.jsx)(v.Text,{className:P.default.statValue,children:t}),(0,a.jsx)(v.Text,{className:P.default.statLabel,children:e})]})}function G(){let e=I.map((e,t)=>(0,a.jsx)(N,{data:e},t));return(0,a.jsx)("section",{className:P.default.root,children:(0,a.jsx)(x,{className:P.default.container,children:(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:60,children:[(0,a.jsx)("div",{children:(0,a.jsxs)("div",{className:P.default.primaryColumn,children:[(0,a.jsx)(M,{order:2,children:"Trusted by thousands of developers"}),(0,a.jsx)(b,{children:"30,000+ GitHub stars, 5M+ monthly downloads, 500+ contributors. Mantine is built in the open and shaped by the developers who use it every day."}),(0,a.jsx)(H,{href:"https://github.com/orgs/mantinedev/discussions/categories/kind-words",children:"View all reviews from the community"}),(0,a.jsxs)("div",{className:P.default.stats,children:[(0,a.jsx)(F,{value:"30,000+",label:"Stars on GitHub",link:S.meta.gitHubLinks.mantine}),(0,a.jsx)(F,{value:"5M+",label:"Monthly downloads",link:"https://www.npmjs.com/package/@mantine/hooks"}),(0,a.jsx)(F,{value:"12,000+",label:"Discord members",link:S.meta.discordLink})]})]})}),(0,a.jsx)("div",{className:P.default.secondaryColumn,children:e})]})})})}var D=e.i(191788),T=e.i(610941),z=e.i(284629),B=e.i(260360);function R({data:e}){let[t,l]=(0,D.useState)(e[0]),[o,n]=(0,D.useState)(null),[i,s]=(0,D.useState)({}),r=e.map(e=>{let o;return(0,a.jsx)(z.UnstyledButton,{onClick:()=>l(e),ref:(o=e.value,e=>{i[o]=e,s(i)}),className:B.default.control,mod:{active:t.value===e.value},children:(0,a.jsx)("span",{className:B.default.controlLabel,children:e.label})},e.value)});return(0,a.jsxs)("div",{className:B.default.root,children:[(0,a.jsxs)("div",{className:B.default.controls,ref:n,children:[r,(0,a.jsx)(T.FloatingIndicator,{target:i[t.value],parent:o,className:B.default.indicator})]}),(0,a.jsx)("div",{className:B.default.content,children:t.content})]})}var q=e.i(972913),W=e.i(567179),U=e.i(294788),Q=e.i(996969),O=e.i(613529),K=e.i(853312),J=e.i(988798),X=e.i(841209),Y=e.i(622048),$=e.i(267073);let ee={size:"lg",radius:"md"},ea=[{value:"frontend",label:"Frontend",children:[{value:"react",label:"React"},{value:"vue",label:"Vue"},{value:"svelte",label:"Svelte"}]},{value:"backend",label:"Backend",children:[{value:"nodejs",label:"Node.js"},{value:"go",label:"Go"},{value:"rust",label:"Rust"}]}];function et(){return(0,a.jsx)("div",{children:(0,a.jsxs)(r.SimpleGrid,{cols:{md:3},spacing:"xl",verticalSpacing:25,children:[(0,a.jsx)(X.TextInput,{label:"Text input",placeholder:"Text input",...ee}),(0,a.jsx)(O.NumberInput,{label:"Number input",placeholder:"Number input",...ee,prefix:"$ ",thousandSeparator:!0,defaultValue:30712}),(0,a.jsx)($.DatePickerInput,{label:"Date range picker",placeholder:"Your last vacation",popoverProps:{radius:"md"},type:"range",...ee}),(0,a.jsx)(q.ColorInput,{label:"Color input",defaultValue:"#129ce0",placeholder:"What other library has color input?",format:"rgba",popoverProps:{radius:"md"},...ee}),(0,a.jsx)(Y.TreeSelect,{label:"Tree select",placeholder:"Pick from the tree",...ee,data:ea,defaultValue:"react",comboboxProps:{radius:"md"}}),(0,a.jsx)(W.FileInput,{label:"File input",placeholder:"Upload file",...ee}),(0,a.jsx)(J.Select,{label:"Select",placeholder:"Pick one option",...ee,checkIconPosition:"right",defaultValue:"ð«ð· France",data:["ð©ðª Germany","ð«ð· France","ð¬ð§ United Kingdom","ðºð¸ United States of America"]}),(0,a.jsx)(Q.MultiSelect,{label:"Multiselect",placeholder:"Search and pick",...ee,comboboxProps:{radius:"md"},defaultValue:["React","Vue"],searchable:!0,checkIconPosition:"right",data:["React","Angular","Vue","Svelte","Ember","Preact","Solid","Alpine"]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{size:"lg",children:"Pin input"}),(0,a.jsx)(K.PinInput,{...ee})]})]})})}var el=e.i(171481);let eo=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M228,48V96a12,12,0,0,1-12,12H168a12,12,0,0,1,0-24h19l-7.8-7.8a75.55,75.55,0,0,0-53.32-22.26h-.43A75.49,75.49,0,0,0,72.39,75.57,12,12,0,1,1,55.61,58.41a99.38,99.38,0,0,1,69.87-28.47H126A99.42,99.42,0,0,1,196.2,59.23L204,67V48a12,12,0,0,1,24,0Z
1M183.61,180.43a75.49,75.49,0,0,1-53.09,21.63h-.43A75.55,75.55,0,0,1,76.77,179.8L69,172H88a12,12,0,0,0,0-24H40a12,12,0,0,0-12,12v48a12,12,0,0,0,24,0V189l7.8,7.8A99.42,99.42,0,0,0,130,226.06h.56a99.38,99.38,0,0,0,69.87-28.47,12,12,0,0,0-16.78-17.16Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M216,128a88,88,0,1,1-88-88A88,88,0,0,1,216,128Z",opacity:"0.2"}),D.createElement("path",{d:"M224,48V96a8,8,0,0,1-8,8H168a8,8,0,0,1,0-16h28.69L182.06,73.37a79.56,79.56,0,0,0-56.13-23.43h-.45A79.52,79.52,0,0,0,69.59,72.71,8,8,0,0,1,58.41,61.27a96,96,0,0,1,135,.79L208,76.69V48a8,8,0,0,1,16,0ZM186.41,183.29a80,80,0,0,1-112.47-.66L59.31,168H88a8,8,0,0,0,0-16H40a8,8,0,0,0-8,8v48a8,8,0,0,0,16,0V179.31l14.63,14.63A95.43,95.43,0,0,0,130,222.06h.53a95.36,95.36,0,0,0,67.07-27.33,8,8,0,0,0-11.18-11.44Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M224,48V96a8,8,0,0,1-8,8H168a8,8,0,0,1-5.66-13.66L180.65,72a79.48,79.48,0,0,0-54.72-22.09h-.45A79.52,79.52,0,0,0,69.59,72.71,8,8,0,0,1,58.41,61.27,96,96,0,0,1,192,60.7l18.36-18.36A8,8,0,0,1,224,48ZM186.41,183.29A80,80,0,0,1,75.35,184l18.31-18.31A8,8,0,0,0,88,152H40a8,8,0,0,0-8,8v48a8,8,0,0,0,13.66,5.66L64,195.3a95.42,95.42,0,0,0,66,26.76h.53a95.36,95.36,0,0,0,67.07-27.33,8,8,0,0,0-11.18-11.44Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M222,48V96a6,6,0,0,1-6,6H168a6,6,0,0,1,0-12h33.52L183.47,72a81.51,81.51,0,0,0-57.53-24h-.46A81.5,81.5,0,0,0,68.19,71.28a6,6,0,1,1-8.38-8.58,93.38,93.38,0,0,1,65.67-26.76H126a93.45,93.45,0,0,1,66,27.53l18,18V48a6,6,0,0,1,12,0ZM187.81,184.72a81.5,81.5,0,0,1-57.29,23.34h-.46a81.51,81.51,0,0,1-57.53-24L54.48,166H88a6,6,0,0,0,0-12H40a6,6,0,0,0-6,6v48a6,6,0,0,0,12,0V174.48l18,18.05a93.45,93.45,0,0,0,66,27.53h.52a93.38,93.38,0,0,0,65.67-26.76,6,6,0,1,0-8.38-8.58Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M224,48V96a8,8,0,0,1-8,8H168a8,8,0,0,1,0-16h28.69L182.06,73.37a79.56,79.56,0,0,0-56.13-23.43h-.45A79.52,79.52,0,0,0,69.59,72.71,8,8,0,0,1,58.41,61.27a96,96,0,0,1,135,.79L208,76.69V48a8,8,0,0,1,16,0ZM186.41,183.29a80,80,0,0,1-112.47-.66L59.31,168H88a8,8,0,0,0,0-16H40a8,8,0,0,0-8,8v48a8,8,0,0,0,16,0V179.31l14.63,14.63A95.43,95.43,0,0,0,130,222.06h.53a95.36,95.36,0,0,0,67.07-27.33,8,8,0,0,0-11.18-11.44Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M220,48V96a4,4,0,0,1-4,4H168a4,4,0,0,1,0-8h38.34L184.89,70.54A84,84,0,0,0,66.8,69.85a4,4,0,1,1-5.6-5.72,92,92,0,0,1,129.34.76L212,86.34V48a4,4,0,0,1,8,0ZM189.2,186.15a83.44,83.44,0,0,1-58.68,23.91h-.47a83.52,83.52,0,0,1-58.94-24.6L49.66,164H88a4,4,0,0,0,0-8H40a4,4,0,0,0-4,4v48a4,4,0,0,0,8,0V169.66l21.46,21.45A91.43,91.43,0,0,0,130,218.06h.51a91.45,91.45,0,0,0,64.28-26.19,4,4,0,1,0-5.6-5.72Z"}))]]),en=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:eo}));en.displayName="ArrowsClockwiseIcon";var ei=e.i(392385),es=e.i(210200),er=e.i(89495),ed=e.i(900374),ec=e.i(853907),em=e.i(613688);let eu=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M200,28H160a20,20,0,0,0-20,20V208a20,20,0,0,0,20,20h40a20,20,0,0,0,20-20V48A20,20,0,0,0,200,28Zm-4,176H164V52h32ZM96,28H56A20,20,0,0,0,36,48V208a20,20,0,0,0,20,20H96a20,20,0,0,0,20-20V48A20,20,0,0,0,96,28ZM92,204H60V52H92Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M208,48V208a8,8,0,0,1-8,8H160a8,8,0,0,1-8-8V48a8,8,0,0,1,8-8h40A8,8,0,0,1,208,48ZM96,40H56a8,8,0,0,0-8,8V208a8,8,0,0,0,8,8H96a8,8,0,0,0,8-8V48A8,8,0,0,0,96,40Z",opacity:"0.2"}),D.createElement("path",{d:"M200,32H160a16,16,0,0,0-16,16V208a16,16,0,0,0,16,16h40a16,16,0,0,0,16-16V48A16,16,0,0,0,200,32Zm0,176H160V48h40ZM96,32H56A16,16,0,0,0,40,48V208a16,16,0,0,0,16,16H96a16,16,0,0,0,16-16V48A16,16,0,0,0,96,32Zm0,176H56V48H96Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M216,48V208a16,16,0,0,1-16,16H160a16,16,0,0,1-16-16V48a16,16,0,0,1,16-16h40A16,16,0,0,1,216,48ZM96,32H56A16,16,0,0,0,40,48V208a16,16,0,0,0,16,16H96a16,16,0,0,0,16-16V48A16,16,0,0,0,96,32Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M200,34H160a14,14,0,0,0-14,14V208a14,14,0,0,0,14,14h40a14,14,0,0,0,14-14V48A14,14,0,0,0,200,34Zm2,174a2,2,0,0,1-2,2H160a2,2,0,0,1-2-2V48a2,2,0,0,1,2-2h40a2,2,0,0,1,2,2ZM96,34H56A14,14,0,0,0,42,48V208a14,14,0,0,0,14,14H96a14,14,0,0,0,14-14V48A14,14,0,0,0,96,34Zm2,174a2,2,0,0,1-2,2H56a2,2,0,0,1-2-2V48a2,2,0,0,1,2-2H96a2,2,0,0,1,2,2Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M200,32H160a16,16,0,0,0-16,16V208a16,16,0,0,0,16,16h40a16,16,0,0,0,16-16V48A16,16,0,0,0,200,32Zm0,176H160V48h40ZM96,32H56A16,16,0,0,0,40,48V208a16,16,0,0,0,16,16H96a16,16,0,0,0,16-16V48A16,16,0,0,0,96,32Zm0,176H56V48H96Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M200,36H160a12,12,0,0,0-12,12V208a12,12,0,0,0,12,12h40a12,12,0,0,0,12-12V48A12,12,0,0,0,200,36Zm4,172a4,4,0,0,1-4,4H160a4,4,0,0,1-4-4V48a4,4,0,0,1,4-4h40a4,4,0,0,1,4,4ZM96,36H56A12,12,0,0,0,44,48V208a12,12,0,0,0,12,12H96a12,12,0,0,0,12-12V48A12,12,0,0,0,96,36Zm4,172a4,4,0,0,1-4,4H56a4,4,0,0,1-4-4V48a4,4,0,0,1,4-4H96a4,4,0,0,1,4,4Z"}))]]),eh=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:eu}));eh.displayName="PauseIcon";let eA=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M124,216a12,12,0,0,1-12,12H48a12,12,0,0,1-12-12V40A12,12,0,0,1,48,28h64a12,12,0,0,1,0,24H60V204h52A12,12,0,0,1,124,216Zm108.49-96.49-40-40a12,12,0,0,0-17,17L195,116H112a12,12,0,0,0,0,24h83l-19.52,19.51a12,12,0,0,0,17,17l40-40A12,12,0,0,0,232.49,119.51Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M224,56V200a16,16,0,0,1-16,16H48V40H208A16,16,0,0,1,224,56Z",o
1pacity:"0.2"}),D.createElement("path",{d:"M120,216a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H56V208h56A8,8,0,0,1,120,216Zm109.66-93.66-40-40a8,8,0,0,0-11.32,11.32L204.69,120H112a8,8,0,0,0,0,16h92.69l-26.35,26.34a8,8,0,0,0,11.32,11.32l40-40A8,8,0,0,0,229.66,122.34Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M120,216a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H56V208h56A8,8,0,0,1,120,216Zm109.66-93.66-40-40A8,8,0,0,0,176,88v32H112a8,8,0,0,0,0,16h64v32a8,8,0,0,0,13.66,5.66l40-40A8,8,0,0,0,229.66,122.34Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M118,216a6,6,0,0,1-6,6H48a6,6,0,0,1-6-6V40a6,6,0,0,1,6-6h64a6,6,0,0,1,0,12H54V210h58A6,6,0,0,1,118,216Zm110.24-92.24-40-40a6,6,0,0,0-8.48,8.48L209.51,122H112a6,6,0,0,0,0,12h97.51l-29.75,29.76a6,6,0,1,0,8.48,8.48l40-40A6,6,0,0,0,228.24,123.76Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M120,216a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H56V208h56A8,8,0,0,1,120,216Zm109.66-93.66-40-40a8,8,0,0,0-11.32,11.32L204.69,120H112a8,8,0,0,0,0,16h92.69l-26.35,26.34a8,8,0,0,0,11.32,11.32l40-40A8,8,0,0,0,229.66,122.34Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M116,216a4,4,0,0,1-4,4H48a4,4,0,0,1-4-4V40a4,4,0,0,1,4-4h64a4,4,0,0,1,0,8H52V212h60A4,4,0,0,1,116,216Zm110.83-90.83-40-40a4,4,0,0,0-5.66,5.66L214.34,124H112a4,4,0,0,0,0,8H214.34l-33.17,33.17a4,4,0,0,0,5.66,5.66l40-40A4,4,0,0,0,226.83,125.17Z"}))]]),ep=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:eA}));ep.displayName="SignOutIcon";var eg=e.i(471714),ex=e.i(823439),ef=e.i(485108),ev=e.i(610287),e_=e.i(124307),eb=e.i(702992),ej=e.i(383312),eH=e.i(951254);function ew(){let e=(0,eH.useMantineTheme)();return(0,a.jsxs)(ev.Menu,{width:300,position:"bottom-start",transitionProps:{transition:"pop"},styles:{item:{fontSize:16},label:{fontSize:14}},radius:"md",children:[(0,a.jsx)(ev.Menu.Target,{children:(0,a.jsx)(ef.Button,{variant:"default",rightSection:(0,a.jsx)(er.DotsThreeIcon,{size:24}),miw:200,size:"lg",radius:"md",justify:"space-between",children:"User Menu"})}),(0,a.jsxs)(ev.Menu.Dropdown,{children:[(0,a.jsx)(ev.Menu.Item,{rightSection:(0,a.jsx)(ei.CaretRightIcon,{size:18}),children:(0,a.jsxs)(E.Group,{children:[(0,a.jsx)(k.Avatar,{radius:"xl",src:"https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/avatars/avatar-8.png"}),(0,a.jsxs)("div",{children:[(0,a.jsx)(v.Text,{fw:500,children:"Nancy Horsekisser"}),(0,a.jsx)(v.Text,{size:"xs",c:"dimmed",children:"[email protected]"})]})]})}),(0,a.jsx)(ev.Menu.Divider,{}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(ec.HeartIcon,{weight:"fill",size:18,color:e.colors.red[6]}),children:"Liked posts"}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(eg.StarIcon,{weight:"fill",size:18,color:e.colors.yellow[6]}),children:"Saved posts"}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(es.ChatCircleIcon,{weight:"fill",size:18,color:e.colors.blue[6]}),children:"Your comments"}),(0,a.jsx)(ev.Menu.Label,{children:"Settings"}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(ed.GearSixIcon,{size:18}),children:"Account settings"}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(en,{size:18}),children:"Change account"}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(ep,{size:18}),children:"Logout"}),(0,a.jsx)(ev.Menu.Divider,{}),(0,a.jsx)(ev.Menu.Label,{children:"Danger zone"}),(0,a.jsx)(ev.Menu.Item,{leftSection:(0,a.jsx)(eh,{size:18}),children:"Pause subscription"}),(0,a.jsx)(ev.Menu.Item,{color:"red",leftSection:(0,a.jsx)(ex.TrashIcon,{size:18}),children:"Delete account"})]})]})}function eM(){let[e,t]=(0,D.useState)(1);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsxs)(eb.Stepper,{active:e,onStepClick:t,visibleFrom:"sm",children:[(0,a.jsx)(eb.Stepper.Step,{label:"First step",description:"Create an account"}),(0,a.jsx)(eb.Stepper.Step,{label:"Second step",description:"Verify email"}),(0,a.jsx)(eb.Stepper.Step,{label:"Final step",description:"Get full access"}),(0,a.jsx)(eb.Stepper.Completed,{children:"Completed, click back button to get to previous step"})]}),(0,a.jsxs)(eb.Stepper,{active:e,onStepClick:t,hiddenFrom:"sm",orientation:"vertical",children:[(0,a.jsx)(eb.Stepper.Step,{label:"First step",description:"Create an account"}),(0,a.jsx)(eb.Stepper.Step,{label:"Second step",description:"Verify email"}),(0,a.jsx)(eb.Stepper.Step,{label:"Final step",description:"Get full access"}),(0,a.jsx)(eb.Stepper.Completed,{children:"Completed, click back button to get to previous step"})]})]})}function ey(){return(0,a.jsx)(ej.Tabs,{defaultValue:"gallery",styles:{tab:{fontSize:"var(--mantine-font-size-md)",gap:3,paddingInlineStart:10}},radius:"md",children:(0,a.jsxs)(ej.Tabs.List,{children:[(0,a.jsx)(ej.Tabs.Tab,{value:"gallery",leftSection:(0,a.jsx)(em.ImageIcon,{size:18,color:"var(--mantine-color-dimmed)"}),children:"Gallery"}),(0,a.jsx)(ej.Tabs.Tab,{value:"messages",leftSection:(0,a.jsx)(es.ChatCircleIcon,{size:18,color:"var(--mantine-color-dimmed)"}),children:"Messages"}),(0,a.jsx)(ej.Tabs.Tab,{value:"settings",leftSection:(0,a.jsx)(ed.GearSixIcon,{size:18,color:"var(--mantine-color-dimmed)"}),children:"Settings"})]})})}function eV(){return(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:50,children:[(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",dis
1play:"block",children:"Stepper"}),(0,a.jsx)(eM,{})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",display:"block",children:"Tabs"}),(0,a.jsx)(ey,{})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",display:"block",children:"Pagination"}),(0,a.jsx)(e_.Pagination,{total:56,size:"lg",radius:"md"})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",display:"block",children:"Menu"}),(0,a.jsx)(ew,{})]})]})}var eZ=e.i(405289),eL=e.i(257177),eC=e.i(37541),ek=e.i(191830),eE=e.i(369974),eS=e.i(424302),eI=e.i(392862),eP=e.i(690920),eN=e.i(892791),eF=e.i(671640),eG=e.i(431868),eD=e.i(541772),eT=e.i(29260),ez=e.i(112732);function eB(){let[e,t]=(0,eD.useDisclosure)(!1),[l,o]=(0,eD.useDisclosure)(!1);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(eS.Modal,{opened:e,onClose:t.close,title:"Authenticate",radius:"md",children:(0,a.jsx)(eT.AuthenticationForm,{noShadow:!0,noPadding:!0})}),(0,a.jsx)(ek.Drawer,{opened:l,onClose:o.close,title:"Authenticate",radius:"md",offset:5,children:(0,a.jsx)(eT.AuthenticationForm,{noShadow:!0,noPadding:!0})}),(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:"xl",children:[(0,a.jsxs)(r.SimpleGrid,{cols:{xs:2},children:[(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",display:"block",children:"Popover"}),(0,a.jsxs)(eI.Popover,{radius:"md",position:"bottom-start",shadow:"md",children:[(0,a.jsx)(eI.Popover.Target,{children:(0,a.jsx)(ef.Button,{miw:200,size:"lg",variant:"default",radius:"md",rightSection:(0,a.jsx)(eZ.SlidersHorizontalIcon,{size:22}),justify:"space-between",children:"Filters"})}),(0,a.jsxs)(eI.Popover.Dropdown,{className:ez.default.popoverDropdown,children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",display:"block",mb:3,size:"md",className:ez.default.label,children:"Order status"}),(0,a.jsx)(eN.SegmentedControl,{data:["In progress","Delivered"],radius:"md",size:"md"}),(0,a.jsx)(U.Input.Label,{labelElement:"div",display:"block",mb:5,mt:"md",size:"md",className:ez.default.label,children:"Brand"}),(0,a.jsx)(eC.Checkbox,{label:"Cannon",size:"md",defaultChecked:!0}),(0,a.jsx)(eC.Checkbox,{label:"Nikon",mt:8,size:"md",defaultChecked:!0}),(0,a.jsx)(eC.Checkbox,{label:"Sony",mt:8,size:"md"}),(0,a.jsx)(eC.Checkbox,{label:"Fuji",mt:8,size:"md"}),(0,a.jsx)(eC.Checkbox,{label:"Leica",mt:8,size:"md"}),(0,a.jsx)(U.Input.Label,{labelElement:"div",display:"block",mb:5,mt:24,size:"md",className:ez.default.label,children:"Price range"}),(0,a.jsx)(eP.Radio.Group,{defaultValue:"200",children:(0,a.jsxs)(eF.Stack,{gap:8,children:[(0,a.jsx)(eP.Radio,{label:"Less than $100",value:"100",size:"md"}),(0,a.jsx)(eP.Radio,{label:"$100 - $200",value:"200",size:"md"}),(0,a.jsx)(eP.Radio,{label:"$200 - $500",value:"500",size:"md"}),(0,a.jsx)(eP.Radio,{label:"$500 - $1000",value:"1000",size:"md"}),(0,a.jsx)(eP.Radio,{label:"More than $1000",value:"1001",size:"md"})]})})]})]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",children:"Hover card"}),(0,a.jsxs)(eE.HoverCard,{width:320,shadow:"md",withArrow:!0,openDelay:200,closeDelay:400,position:"bottom-start",arrowOffset:15,radius:"md",children:[(0,a.jsx)(eE.HoverCard.Target,{children:(0,a.jsxs)(E.Group,{w:"max-content",children:[(0,a.jsx)(k.Avatar,{src:"https://avatars.githubusercontent.com/u/79146003?s=200&v=4",radius:"xl"}),(0,a.jsxs)(eF.Stack,{gap:5,children:[(0,a.jsx)(v.Text,{size:"sm",fw:700,lh:1,c:"bright",children:"Mantine"}),(0,a.jsx)(i.Anchor,{href:"https://twitter.com/mantinedev",c:"dimmed",size:"xs",lh:1,children:"@mantinedev"})]})]})}),(0,a.jsxs)(eE.HoverCard.Dropdown,{children:[(0,a.jsxs)(E.Group,{children:[(0,a.jsx)(k.Avatar,{src:"https://avatars.githubusercontent.com/u/79146003?s=200&v=4",radius:"xl"}),(0,a.jsxs)(eF.Stack,{gap:5,children:[(0,a.jsx)(v.Text,{size:"sm",fw:700,lh:1,c:"bright",children:"Mantine"}),(0,a.jsx)(i.Anchor,{href:"https://twitter.com/mantinedev",c:"dimmed",size:"xs",lh:1,children:"@mantinedev"})]})]}),(0,a.jsx)(v.Text,{size:"sm",mt:"md",children:"Customizable React components and hooks library with focus on usability, accessibility and developer experience"}),(0,a.jsxs)(E.Group,{mt:"md",gap:"xl",children:[(0,a.jsxs)(v.Text,{size:"sm",children:[(0,a.jsx)(s.Box,{component:"b",c:"bright",children:"0"})," ","Following"]}),(0,a.jsxs)(v.Text,{size:"sm",children:[(0,a.jsx)(s.Box,{component:"b",c:"bright",children:"1,174"})," ","Followers"]})]})]})]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",dis
1play:"block",children:"Tooltip"}),(0,a.jsx)(eG.Tooltip,{label:"Tooltip",withArrow:!0,children:(0,a.jsx)(eL.Badge,{className:ez.default.tooltip,size:"lg",variant:"dot",color:"yellow",children:"Hover me to see a tooltip"})})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",mb:"sm",display:"block",children:"Modal and Drawer"}),(0,a.jsxs)(E.Group,{children:[(0,a.jsx)(ef.Button,{variant:"default",radius:"md",onClick:t.open,children:"Open modal"}),(0,a.jsx)(ef.Button,{variant:"default",radius:"md",onClick:o.open,children:"Open drawer"})]})]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)(U.Input.Label,{labelElement:"div",size:"lg",children:"Floating tooltip"}),(0,a.jsx)(eG.Tooltip.Floating,{label:"Floating tooltip",withinPortal:!1,children:(0,a.jsx)("div",{className:ez.default.floating,children:"Hover me to see a tooltip that follows mouse cursor"})})]})]})]})}var eR=e.i(629368);function eq(){return(0,a.jsx)("section",{className:eR.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"120+ components"}),(0,a.jsx)(b,{className:eR.default.description,children:"Build your next app faster with high-quality, well-tested components. Mantine includes everything you need to create complex web applications with ease: custom select, date pickers, notifications, modals, and more."}),(0,a.jsx)(R,{data:[{label:"Inputs",value:"inputs",content:(0,a.jsx)(et,{})},{label:"Overlays",value:"overlays",content:(0,a.jsx)(eB,{})},{label:"Navigation",value:"navigation",content:(0,a.jsx)(eV,{})}]})]})})}var eW=e.i(597746),eU=e.i(915793),eQ=e.i(724288),eO=e.i(549328);e.i(822434);var eK=e.i(104752);let eJ={src:e.i(441129).default,width:1640,height:770,blurWidth:8,blurHeight:4,blurDataURL:"data:image/webp;base64,UklGRrwAAABXRUJQVlA4TLAAAAAvB8AAAM1VICICHgjACQQAAIDdr/mCAAAAAgAAAACAAAAAAAAAAAAIAKAAAAAAAAAAAEHAkLQGAADwQAYNAAAAAM5/AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPCXB7KRAwAAAHD+6X4AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAXKQKxnQaC8J3O0wGSsCZewdlyvrvf30mI41YpIZk9If1AA=="};var eX=e.i(551687);let eY=`import { MantineProvider } from '@mantine/core'; 2 3function Demo() { 4 return ( 5 <MantineProvider defaultColorScheme="dark"> 6 <App /> 7 </MantineProvider> 8 ); 9}`;function e$(){let{toggleColorScheme:e}=(0,eO.useMantineColorScheme)();return(0,a.jsx)("section",{className:eX.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"Dark color scheme"}),(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:50,verticalSpacing:"xl",className:eX.default.demo,children:[(0,a.jsx)(eQ.Image,{src:eJ.src,className:eX.default.image,radius:"md"}),(0,a.jsxs)("div",{children:[(0,a.jsx)(b,{className:eX.default.description,children:"Add dark theme to your application with just a few lines of code â Mantine exports global styles both for light and dark theme, all components support dark theme out of the box."}),(0,a.jsx)(eK.MdxCodeHighlight,{code:eY,language:"tsx",className:eX.default.code}),(0,a.jsx)(E.Group,{justify:"center",mt:"xl",children:(0,a.jsx)(ef.Button,{variant:"default",radius:"md",onClick:()=>e(),leftSection:(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(eU.SunIcon,{className:eX.default.darkIcon}),(0,a.jsx)(eW.MoonStarsIcon,{className:eX.default.lightIcon})]}),children:"Toggle color scheme"})})]})]})]})})}var e0=e.i(837048),e1=e.i(719834),e2=e.i(371542),e4=e.i(200140),e6=e.i(975073);e.i(615393);var e8=e.i(972084),e3=e.i(368478);let e5=["https://images.unsplash.com/photo-1598928506311-c55ded91a20c?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=720&q=80","https://images.unsplash.com/photo-1567767292278-a4f21aa2d36e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=720&q=80","https://images.unsplash.com/photo-1605774337664-7a846e9cdf17?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=720&q=80","https://images.unsplash.com/photo-1554995207-c18c203602cb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=720&q=80","https://images.unsplash.com/photo-1616486029423-aaa4789e8c9a?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=720&q=80"];function e7({title:e,description:t,children:l}){return(0,a.jsxs)("section",{className:e3.default.demo,children:[(0,a.jsxs)("header",{className:e3.default.demoHeader,children:[(0,a.jsx)(d.Title,{order:3,className:e3.default.demoTitle,children:e}),(0,a.jsx)(v.Text,{className:e3.default.demoDescription,children:t})]}),(0,a.jsx)("div",{className:e3.default.demoArea,children:l})]})}function e9(){let e=e6.TipTapDemos.usage.component,t=(0,D.useRef)(-1),l=e5.map(e=>(0,a.jsx)(e2.Carousel.Slide,{children:(0,a.jsx)(eQ.Image,{src:e,height:220,radius:"md",alt:""})},e));return(0,a.jsx)("section",{className:e3.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"Extensions"}),(0,a.jsx)(b,{className:e3.default.description,children:"Extensions are additional packages that provide extra functionality to Mantine, such as rich text editor, notifications system, charts, modals manager and more. They are built to be easily integrated into your application and provide a seamless experience."}),(0,a.jsx)(H,{href:"/x/extensions",children:"Browse all extensions"}),(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},className:e3.default.grid,verticalSpacing:30,children:[(0,a.jsx)(e7,{title:"Rich text editor",description:"TipTap based rich text editor",children:(0,a.jsx)(e,{stickyOffset:56})}),(0,a.jsx)("div",{children:(0,a.jsxs)(eF.Stack,{children:[(0,a.jsx)(e7,{title:"Notifications system",description:"Show/update/hide notifications at any part of your application",children:(0,a.jsx)(E.Group,{justify:"center",children:(0,a.jsx)(ef.Button,{className:e3.default.demoControl,variant:"default",radiu
9s:"md",size:"lg",onClick:()=>{window.clearTimeout(t.current);let e=e4.notifications.show({id:"home-page-demo",withBorder:!0,loading:!0,title:"Loading your data",radius:"md",message:"Data will be loaded in 3 seconds, you cannot close this yet",autoClose:!1,withCloseButton:!1});t.current=window.setTimeout(()=>{e4.notifications.update({id:e,color:"teal",withBorder:!0,title:"Data was loaded",radius:"md",message:"Notification will close in 2 seconds, you can close this notification now",icon:(0,a.jsx)(e0.CheckIcon,{size:18}),loading:!1,autoClose:2e3})},3e3)},children:"Show notification"})})}),(0,a.jsx)(e7,{title:"Spotlight",description:"Ctrl + K command palette, can be used for search or common actions",children:(0,a.jsx)(E.Group,{justify:"center",children:(0,a.jsx)(ef.Button,{className:e3.default.demoControl,size:"lg",radius:"md",variant:"default",onClick:e8.searchHandlers.open,rightSection:(0,a.jsx)(e1.MagnifyingGlassIcon,{size:20,color:"var(--mantine-color-dimmed)"}),miw:300,justify:"space-between",children:"Open search spotlight"})})}),(0,a.jsx)(e7,{title:"Carousel",description:"Embla based carousel component",children:(0,a.jsx)(e2.Carousel,{withIndicators:!0,emblaOptions:{loop:!0},classNames:{root:e3.default.carousel,controls:e3.default.carouselControls,indicator:e3.default.carouselIndicator},children:l})})]})})]})]})})}let ae=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M128,12a92.1,92.1,0,0,0-92,92c0,24.53,9.55,50.13,26.19,70.22,10,12,21.56,21.07,34.05,26.76L85,227.27A12,12,0,0,0,96,244h64a12,12,0,0,0,11-16.73L159.76,201c12.49-5.69,24.08-14.73,34.05-26.76C210.45,154.13,220,128.53,220,104A92.1,92.1,0,0,0,128,12Zm13.8,208H114.2l5.35-12.49a73.1,73.1,0,0,0,16.9,0Zm33.53-61.09C161.93,175.09,145.12,184,128,184s-33.93-8.91-47.33-25.09C67.73,143.29,60,122.76,60,104a68,68,0,0,1,136,0C196,122.76,188.27,143.29,175.33,158.91Zm-6.34-47q-.6.06-1.2.06a12,12,0,0,1-11.93-10.81,28,28,0,0,0-19.47-23.91,12,12,0,1,1,7.22-22.89,51.94,51.94,0,0,1,36.13,44.42A12,12,0,0,1,169,111.94Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M137.89,199.13h0L152,232H104l14.09-32.87h0C78.59,192.18,48,144.83,48,104a80,80,0,0,1,160,0C208,144.83,177.41,192.18,137.89,199.13Z",opacity:"0.2"}),D.createElement("path",{d:"M128,16a88.1,88.1,0,0,0-88,88c0,23.43,9.4,49.42,25.13,69.5,12.08,15.41,26.5,26,41.91,31.09L96.65,228.85A8,8,0,0,0,104,240h48a8,8,0,0,0,7.35-11.15L149,204.59c15.4-5.07,29.83-15.68,41.91-31.09C206.6,153.42,216,127.43,216,104A88.1,88.1,0,0,0,128,16Zm11.87,208H116.13l6.94-16.19c1.64.12,3.28.19,4.93.19s3.29-.07,4.93-.19Zm38.4-60.37C163.94,181.93,146.09,192,128,192s-35.94-10.07-50.27-28.37C64.12,146.27,56,124,56,104a72,72,0,0,1,144,0C200,124,191.88,146.27,178.27,163.63Zm-1-59.74A8.52,8.52,0,0,1,176,104a8,8,0,0,1-7.88-6.68,41.29,41.29,0,0,0-33.43-33.43,8,8,0,1,1,2.64-15.78,57.5,57.5,0,0,1,46.57,46.57A8,8,0,0,1,177.32,103.89Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M128,16a88.1,88.1,0,0,0-88,88c0,23.43,9.4,49.42,25.13,69.5,12.08,15.41,26.5,26,41.91,31.09L96.65,228.85A8,8,0,0,0,104,240h48a8,8,0,0,0,7.35-11.15L149,204.59c15.4-5.07,29.83-15.68,41.91-31.09C206.6,153.42,216,127.43,216,104A88.1,88.1,0,0,0,128,16Zm49.32,87.89A8.52,8.52,0,0,1,176,104a8,8,0,0,1-7.88-6.68,41.29,41.29,0,0,0-33.43-33.43,8,8,0,1,1,2.64-15.78,57.5,57.5,0,0,1,46.57,46.57A8,8,0,0,1,177.32,103.89Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M128,18a86.1,86.1,0,0,0-86,86c0,23,9.24,48.52,24.71,68.27,12.37,15.79,27.23,26.42,43.05,31.07l-11.27,26.3A6,6,0,0,0,104,238h48a6,6,0,0,0,5.51-8.36l-11.27-26.3c15.82-4.65,30.68-15.28,43-31.07C204.76,152.52,214,127,214,104A86.1,86.1,0,0,0,128,18ZM112.17,204l.58.14a2.05,2.05,0,0,1-.58-.14Zm30.73,22H113.1l8.7-20.31a62.15,62.15,0,0,0,12.4,0ZM128,194c-33.52,0-74-40.15-74-90a74,74,0,0,1,148,0C202,153.85,161.52,194,128,194Zm49-92.08a6.74,6.74,0,0,1-1,.08,6,6,0,0,1-5.91-5A43.29,43.29,0,0,0,135,61.92a6,6,0,1,1,2-11.84A55.48,55.48,0,0,1,181.92,95,6,6,0,0,1,177,101.92Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M128,16a88.1,88.1,0,0,0-88,88c0,23.43,9.4,49.42,25.13,69.5,12.08,15.41,26.5,26,41.91,31.09L96.65,228.85A8,8,0,0,0,104,240h48a8,8,0,0,0,7.35-11.15L149,204.59c15.4-5.07,29.83-15.68,41.91-31.09C206.6,153.42,216,127.43,216,104A88.1,88.1,0,0,0,128,16Zm11.87,208H116.13l6.94-16.19c1.64.12,3.28.19,4.93.19s3.29-.07,4.93-.19Zm38.4-60.37C163.94,181.93,146.09,192,128,192s-35.94-10.07-50.27-28.37C64.12,146.27,56,124,56,104a72,72,0,0,1,144,0C200,124,191.88,146.27,178.27,163.63Zm-1-59.74A8.52,8.52,0,0,1,176,104a8,8,0,0,1-7.88-6.68,41.29,41.29,0,0,0-33.43-33.43,8,8,0,1,1,2.64-15.78,57.5,57.5,0,0,1,46.57,46.57A8,8,0,0,1,177.32,103.89Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M128,20a84.09,84.09,0,0,0-84,84c0,22.57,9.08,47.63,24.28,67,12.68,16.17,28,26.81,44.22,31l-12.18,28.4A4,4,0,0,0,104,236h48a4,4,0,0,0,3.68-5.58L143.5,202c16.23-4.17,31.54-14.81,44.22-31,15.2-19.41,24.28-44.47,24.28-67A84.09,84.09,0,0,0,128,20Zm17.93,208H110.07l10.48-24.46a60.56,60.56,0,0,0,14.9,0ZM128,196c-42.1,0-76-50.33-76-92a76,76,0,0,1,152,0C204,145.67,170.1,196,128,196ZM180,95.34a4,4,0,0,1-3.29,4.61,5,5,0,0,1-.66,0,4,4,0,0,1-3.95-3.34A45.31,45.31,0,0,0,135.34,60a4,4,0,0,1,1.32
9-7.9A53.46,53.46,0,0,1,180,95.34Z"}))]]),aa=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:ae}));aa.displayName="BalloonIcon";var at=e.i(773141);let al=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M222.41,155.16a12,12,0,0,0-11.56-.69A16,16,0,0,1,188,139,16.2,16.2,0,0,1,202.8,124a15.83,15.83,0,0,1,8,1.5A12,12,0,0,0,228,114.7V72a20,20,0,0,0-20-20H176a40.15,40.15,0,0,0-12.62-29.16,39.67,39.67,0,0,0-29.94-10.76,40.08,40.08,0,0,0-37.34,37C96,50.07,96,51,96,52H64A20,20,0,0,0,44,72v28a40.15,40.15,0,0,0-29.16,12.62A40,40,0,0,0,41.1,179.9a28.3,28.3,0,0,0,2.9.1v28a20,20,0,0,0,20,20H208a20,20,0,0,0,20-20V165.31A12,12,0,0,0,222.41,155.16ZM204,204H68V165.31a12,12,0,0,0-17.15-10.84A15.9,15.9,0,0,1,42.8,156,16.2,16.2,0,0,1,28,141.06a16,16,0,0,1,22.82-15.52A12,12,0,0,0,68,114.7V76h42.7a12,12,0,0,0,10.83-17.15A15.9,15.9,0,0,1,120,50.8,16.19,16.19,0,0,1,134.94,36a16,16,0,0,1,15.53,22.81A12,12,0,0,0,161.31,76H204v24c-1,0-1.93,0-2.9.11A40,40,0,0,0,204,180h0Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M204,168a28,28,0,0,0,12-2.69V208a8,8,0,0,1-8,8H64a8,8,0,0,1-8-8V165.31a28,28,0,1,1,0-50.62V72a8,8,0,0,1,8-8h46.69a28,28,0,1,1,50.61,0H208a8,8,0,0,1,8,8v42.69A28,28,0,1,0,204,168Z",opacity:"0.2"}),D.createElement("path",{d:"M220.27,158.54a8,8,0,0,0-7.7-.46,20,20,0,1,1,0-36.16A8,8,0,0,0,224,114.69V72a16,16,0,0,0-16-16H171.78a35.36,35.36,0,0,0,.22-4,36.15,36.15,0,0,0-11.36-26.25,36,36,0,0,0-60.55,23.63,36.56,36.56,0,0,0,.14,6.62H64A16,16,0,0,0,48,72v32.22a35.36,35.36,0,0,0-4-.22,36.12,36.12,0,0,0-26.24,11.36,35.7,35.7,0,0,0-9.69,27,36.08,36.08,0,0,0,33.31,33.6,36.56,36.56,0,0,0,6.62-.14V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V165.31A8,8,0,0,0,220.27,158.54ZM208,208H64V165.31a8,8,0,0,0-11.43-7.23,20,20,0,1,1,0-36.16A8,8,0,0,0,64,114.69V72h46.69a8,8,0,0,0,7.23-11.43,20,20,0,1,1,36.16,0A8,8,0,0,0,161.31,72H208v32.23a35.68,35.68,0,0,0-6.62-.14A36,36,0,0,0,204,176a35.36,35.36,0,0,0,4-.22Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M165.78,224H208a16,16,0,0,0,16-16V170.35A8,8,0,0,0,212.94,163a23.37,23.37,0,0,1-8.94,1.77c-13.23,0-24-11.1-24-24.73s10.77-24.73,24-24.73a23.37,23.37,0,0,1,8.94,1.77A8,8,0,0,0,224,109.65V72a16,16,0,0,0-16-16H171.78a35.36,35.36,0,0,0,.22-4,36,36,0,0,0-72,0,35.36,35.36,0,0,0,.22,4H64A16,16,0,0,0,48,72v32.22a35.36,35.36,0,0,0-4-.22,36,36,0,0,0,0,72,35.36,35.36,0,0,0,4-.22V208a16,16,0,0,0,16,16h42.22"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M219.21,160.24a6,6,0,0,0-5.78-.35,22,22,0,1,1-11.05-41.83,22.15,22.15,0,0,1,11.05,2.06A6,6,0,0,0,222,114.7V72a14,14,0,0,0-14-14H169.48a35,35,0,0,0,.52-6,34.1,34.1,0,0,0-10.73-24.78,33.64,33.64,0,0,0-25.45-9.15A34,34,0,0,0,102.54,58H64A14,14,0,0,0,50,72v34.53a34,34,0,0,0-30.79,10.2,34,34,0,0,0,22.31,57.18,34.34,34.34,0,0,0,8.48-.44V208a14,14,0,0,0,14,14H208a14,14,0,0,0,14-14V165.31A6,6,0,0,0,219.21,160.24ZM210,208a2,2,0,0,1-2,2H64a2,2,0,0,1-2-2V165.31a6,6,0,0,0-6-6,5.92,5.92,0,0,0-2.57.58,22,22,0,0,1-31.38-18.46,22,22,0,0,1,31.38-21.31A6,6,0,0,0,62,114.7V72a2,2,0,0,1,2-2h46.69a6,6,0,0,0,5.42-8.57,22.25,22.25,0,0,1-2-11,22,22,0,1,1,41.83,11A6,6,0,0,0,161.3,70H208a2,2,0,0,1,2,2v34.54a34,34,0,0,0-39.93,31.28,33.71,33.71,0,0,0,9.14,25.45A34.15,34.15,0,0,0,210,173.48Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M220.27,158.54a8,8,0,0,0-7.7-.46,20,20,0,1,1,0-36.16A8,8,0,0,0,224,114.69V72a16,16,0,0,0-16-16H171.78a35.36,35.36,0,0,0,.22-4,36.11,36.11,0,0,0-11.36-26.24,36,36,0,0,0-60.55,23.62,36.56,36.56,0,0,0,.14,6.62H64A16,16,0,0,0,48,72v32.22a35.36,35.36,0,0,0-4-.22,36.12,36.12,0,0,0-26.24,11.36,35.7,35.7,0,0,0-9.69,27,36.08,36.08,0,0,0,33.31,33.6,35.68,35.68,0,0,0,6.62-.14V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V165.31A8,8,0,0,0,220.27,158.54ZM208,208H64V165.31a8,8,0,0,0-11.43-7.23,20,20,0,1,1,0-36.16A8,8,0,0,0,64,114.69V72h46.69a8,8,0,0,0,7.23-11.43,20,20,0,1,1,36.16,0A8,8,0,0,0,161.31,72H208v32.23a35.68,35.68,0,0,0-6.62-.14A36,36,0,0,0,204,176a35.36,35.36,0,0,0,4-.22Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M218.14,161.93a4,4,0,0,0-3.86-.24,24,24,0,0,1-34.23-23.25,24,24,0,0,1,34.23-20.13A4,4,0,0,0,220,114.7V72a12,12,0,0,0-12-12H167a32,32,0,1,0-62.91-10.33A32.57,32.57,0,0,0,105,60H64A12,12,0,0,0,52,72v37a32,32,0,1,0-10.33,62.91A32.28,32.28,0,0,0,52,171v37a12,12,0,0,0,12,12H208a12,12,0,0,0,12-12V165.31A4,4,0,0,0,218.14,161.93ZM212,208a4,4,0,0,1-4,4H64a4,4,0,0,1-4-4V165.31a4,4,0,0,0-1.86-3.38,4,4,0,0,0-3.85-.24,24,24,0,0,1-34.24-20.13,24,24,0,0,1,34.24-23.25A4,4,0,0,0,60,114.7V72a4,4,0,0,1,4-4h46.69a4,4,0,0,0,3.62-5.71,24,24,0,0,1,20.13-34.24,24,24,0,0,1,23.25,34.24A4,4,0,0,0,161.31,68H208a4,4,0,0,1,4,4v37a32.57,32.57,0,0,0-10.33-.94A32,32,0,1,0,212,171Z"}))]]),ao=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:al}));ao.displayName="PuzzlePieceIcon";let an=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M227.85,46.89a20,20,0,0,0-18.74-18.74c-13.13-.77-46.65.42-74.48,28.24L131,60H74.36a19.83,19.83,0,0,0-14.14,5.86L25.87,100.19a20,20,0,0,0,11.35,33.95l37.14,5.18,42.32,42.32,5.19,37.18A19.88,19.88,0,0,0,135.34,235a20.13,20.13,0,0,0,6.37,1,19.9,19.9,0,0,0,14.1-5.87l34.34-34.35A19.85,19.85,0,0,0,196,181.64V125l3.6-3.59C227.43,93.54,228.62,60,227.85,46.89ZM76,84h31L75.75,115.28l-27.23-3.8ZM151.6,73.37A72.27,72.27,0,0,1,204,52a72.17,72.17,0,0,1-21.38,52.41L128,159,97,128ZM172,180l-27.49,27.49-3.8-27.23L172,149Zm-72,22c-8.71,11.85-26.19,26-60,26a12,12,0,0,1-12-12c0-33.84,14.12-51.32,26-60A12,12,0,1,1,68.18,175.3C62.3,179.63,55.51,187.8,53,203c15.21-2.51,23.37-9.3,27.7-15.18A12,12,0,1,1,100,202Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M184,120v61.65a8,8,0,0,1-2.34,5.65l-34.35,34.35a8,8,0,0,1-13.57-4.53L128,176ZM136,72H74.35a8,8,0,0,0-5.65,2.34L34.35,108.69a8,8,0,0,0,4.53,13.57L80,128ZM40,216c37.65,0,50.69-19.69,54.56-28.18L68.18,161.44C59.69,165.31,40,178.35,40,216Z",opacity:"0.2"}),D.createElement("path",{d:"M223.85,47.12a16,16,0,0,0-15-15c-12.58-.75-44.73.4-71.41,27.07L132.69,64H74.36A15.91,15.91,0,0,0,63,68.68L28.7,103a16,16,0,0,0,9.07,27.16l38.47,5.37,44.21,44.21,5.37,38.49a15.94,15.94,0,0,0,10.78,12.92,16.11,16.11,0,0,0,5.1.83A15.91,15.91,0,0,0,153,227.3L187.32,193A15.91,15.91,0,0,0,192,181.64V123.31l4.77-4.77C223.45,91.86,224.6,59.71,223.85,47.12ZM74.3
96,80h42.33L77.16,119.52,40,114.34Zm74.41-9.45a76.65,76.65,0,0,1,59.11-22.47,76.46,76.46,0,0,1-22.42,59.16L128,164.68,91.32,128ZM176,181.64,141.67,216l-5.19-37.17L176,139.31Zm-74.16,9.5C97.34,201,82.29,224,40,224a8,8,0,0,1-8-8c0-42.29,23-57.34,32.86-61.85a8,8,0,0,1,6.64,14.56c-6.43,2.93-20.62,12.36-23.12,38.91,26.55-2.5,36-16.69,38.91-23.12a8,8,0,1,1,14.56,6.64Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M101.85,191.14C97.34,201,82.29,224,40,224a8,8,0,0,1-8-8c0-42.29,23-57.34,32.86-61.85a8,8,0,0,1,6.64,14.56c-6.43,2.93-20.62,12.36-23.12,38.91,26.55-2.5,36-16.69,38.91-23.12a8,8,0,1,1,14.56,6.64Zm122-144a16,16,0,0,0-15-15c-12.58-.75-44.73.4-71.4,27.07h0L88,108.7A8,8,0,0,1,76.67,97.39l26.56-26.57A4,4,0,0,0,100.41,64H74.35A15.9,15.9,0,0,0,63,68.68L28.7,103a16,16,0,0,0,9.07,27.16l38.47,5.37,44.21,44.21,5.37,38.49a15.94,15.94,0,0,0,10.78,12.92,16.11,16.11,0,0,0,5.1.83A15.91,15.91,0,0,0,153,227.3L187.32,193A16,16,0,0,0,192,181.65V155.59a4,4,0,0,0-6.83-2.82l-26.57,26.56a8,8,0,0,1-11.71-.42,8.2,8.2,0,0,1,.6-11.1l49.27-49.27h0C223.45,91.86,224.6,59.71,223.85,47.12Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M221.86,47.24a14,14,0,0,0-13.11-13.1c-12.31-.73-43.77.39-69.88,26.5L133.52,66H74.35a13.9,13.9,0,0,0-9.89,4.1L30.11,104.44a14,14,0,0,0,7.94,23.76l39.13,5.46,45.16,45.16L127.8,218a14,14,0,0,0,23.76,7.92l34.35-34.35a13.91,13.91,0,0,0,4.1-9.89V122.48l5.35-5.35h0C221.46,91,222.59,59.56,221.86,47.24ZM38.11,115a2,2,0,0,1,.49-2L72.94,78.58A2,2,0,0,1,74.35,78h47.17L77.87,121.64l-38.14-5.32A1.93,1.93,0,0,1,38.11,115ZM178,181.65a2,2,0,0,1-.59,1.41L143.08,217.4a2,2,0,0,1-3.4-1.11l-5.32-38.16L178,134.48Zm8.87-73h0L128,167.51,88.49,128l58.87-58.88a78.47,78.47,0,0,1,60.69-23A2,2,0,0,1,209.88,48,78.47,78.47,0,0,1,186.88,108.64ZM100,190.31C95.68,199.84,81.13,222,40,222a6,6,0,0,1-6-6c0-41.13,22.16-55.68,31.69-60a6,6,0,1,1,5,10.92c-7,3.17-22.53,13.52-24.47,42.91,29.39-1.94,39.74-17.52,42.91-24.47a6,6,0,1,1,10.92,5Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M223.85,47.12a16,16,0,0,0-15-15c-12.58-.75-44.73.4-71.41,27.07L132.69,64H74.36A15.91,15.91,0,0,0,63,68.68L28.7,103a16,16,0,0,0,9.07,27.16l38.47,5.37,44.21,44.21,5.37,38.49a15.94,15.94,0,0,0,10.78,12.92,16.11,16.11,0,0,0,5.1.83A15.91,15.91,0,0,0,153,227.3L187.32,193A15.91,15.91,0,0,0,192,181.64V123.31l4.77-4.77C223.45,91.86,224.6,59.71,223.85,47.12ZM74.36,80h42.33L77.16,119.52,40,114.34Zm74.41-9.45a76.65,76.65,0,0,1,59.11-22.47,76.46,76.46,0,0,1-22.42,59.16L128,164.68,91.32,128ZM176,181.64,141.67,216l-5.19-37.17L176,139.31Zm-74.16,9.5C97.34,201,82.29,224,40,224a8,8,0,0,1-8-8c0-42.29,23-57.34,32.86-61.85a8,8,0,0,1,6.64,14.56c-6.43,2.93-20.62,12.36-23.12,38.91,26.55-2.5,36-16.69,38.91-23.12a8,8,0,1,1,14.56,6.64Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M219.86,47.36a12,12,0,0,0-11.22-11.22c-12-.71-42.82.38-68.35,25.91L134.35,68h-60a11.9,11.9,0,0,0-8.48,3.52L31.52,105.85a12,12,0,0,0,6.81,20.37l39.79,5.55,46.11,46.11,5.55,39.81a12,12,0,0,0,20.37,6.79l34.34-34.35a11.9,11.9,0,0,0,3.52-8.48v-60l5.94-5.94C219.48,90.18,220.57,59.41,219.86,47.36ZM36.21,115.6a3.94,3.94,0,0,1,1-4.09L71.53,77.17A4,4,0,0,1,74.35,76h52L78.58,123.76,39.44,118.3A3.94,3.94,0,0,1,36.21,115.6ZM180,181.65a4,4,0,0,1-1.17,2.83l-34.35,34.34a4,4,0,0,1-6.79-2.25l-5.46-39.15L180,129.65Zm-52-11.31L85.66,128l60.28-60.29c23.24-23.24,51.25-24.23,62.22-23.58a3.93,3.93,0,0,1,3.71,3.71c.65,11-.35,39-23.58,62.22ZM98.21,189.48C94,198.66,80,220,40,220a4,4,0,0,1-4-4c0-40,21.34-54,30.52-58.21a4,4,0,0,1,3.32,7.28c-7.46,3.41-24.43,14.66-25.76,46.85,32.19-1.33,43.44-18.3,46.85-25.76a4,4,0,1,1,7.28,3.32Z"}))]]),ai=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:an}));ai.displayName="RocketLaunchIcon";var as=e.i(767799),ar=e.i(574280),ad=e.i(614148),ac=e.i(993107);function am({icon:e,title:t,description:l}){return(0,a.jsxs)("section",{className:ac.default.feature,children:[(0,a.jsx)(ad.ThemeIcon,{className:ac.default.featureIcon,size:50,radius:"md",children:(0,a.jsx)(e,{size:30})}),(0,a.jsxs)("div",{children:[(0,a.jsx)(v.Text,{component:"h3",className:ac.default.featureTitle,children:t}),(0,a.jsx)(v.Text,{className:ac.default.featureDescription,children:l})]})]})}function au({data:e}){let t=e.map((e,t)=>(0,a.jsx)(am,{...e},t));return(0,a.jsx)("div",{className:ac.default.features,children:t})}var ah=e.i(959377);let aA=[{icon:ao,title:"Seamless integration",description:"useForm hook works out of the box with all Mantine inputs"},{icon:at.GaugeIcon,title:"Excellent performance",description:"useForm rerenders only for validation and status changes, usually only 2-3 times per form lifecycle"},{icon:aa,title:"Lightweight",description:"6.3kb minified + gzipped, no depen
9dencies except React"},{icon:ai,title:"Fully featured",description:"useForm supports lists and nested objects, multiple validation approaches (including schema based with zod) and an easy way to manage subscriptions to values updates"}];function ap(){return(0,a.jsx)("section",{className:ah.default.root,children:(0,a.jsx)(x,{children:(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:50,verticalSpacing:30,children:[(0,a.jsx)("div",{className:ah.default.column,"data-primary":!0,children:(0,a.jsxs)("div",{className:ah.default.main,children:[(0,a.jsx)(M,{order:2,children:"Form library"}),(0,a.jsx)(b,{className:ah.default.description,children:"@mantine/form â performant form library designed for Mantine components. Works out of the box with all Mantine inputs."}),(0,a.jsx)(H,{href:"/form/package",children:"Explore all form features"}),(0,a.jsx)(au,{data:aA})]})}),(0,a.jsx)("div",{className:ah.default.column,children:(0,a.jsx)(as.Demo,{data:ar.FormDemos.usage})})]})})})}e.i(293716);var ag=e.i(511013),ax=e.i(268683);function af(){return(0,a.jsx)("section",{className:ax.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"Ready to get started?"}),(0,a.jsx)(b,{className:ax.default.description,children:"Mantine can be used with any modern React framework or build tool: get started with Next.js, Vite, React Router and other tools in minutes by following the installation guide or using one of the available templates."}),(0,a.jsx)(H,{href:"/",children:"Get started without a framework"}),(0,a.jsx)("div",{className:ax.default.guides,"data-dimmed":!0,children:(0,a.jsx)(ag.FrameworksGuides,{})})]})})}var av=e.i(839608),a_=e.i(76206),ab=e.i(79712),aj=e.i(198421),aH=e.i(560111),aw=e.i(139727);function aM({children:e,title:t,description:l,link:n}){return(0,a.jsxs)("section",{className:aw.default.column,children:[(0,a.jsxs)("header",{className:aw.default.header,children:[(0,a.jsx)(d.Title,{order:3,className:aw.default.title,children:(0,a.jsx)(o.default,{href:n,className:aw.default.titleLink,children:t})}),(0,a.jsx)(v.Text,{className:aw.default.description,children:l})]}),e]})}function ay(){let e=(0,av.useMediaQuery)("(max-width: 62em)");return(0,a.jsx)("section",{className:aw.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"Hooks library"}),(0,a.jsx)(b,{children:"70+ hooks for handling tricky and common parts of your application"}),(0,a.jsx)(H,{href:"/hooks/package",children:"Browse all hooks"}),(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},className:aw.default.demos,spacing:"xl",children:[(0,a.jsx)(aM,{title:"use-move",description:"use-move hook handles move behavior over given element, can be used to build custom sliders",link:"/hooks/use-move",children:(0,a.jsx)(as.Demo,{data:a_.SliderDemos.customSlider,demoProps:{defaultExpanded:!1,maxCollapsedHeight:e?150:480}})}),(0,a.jsx)(aM,{title:"use-resize-observer",description:"use-resize-observer hook tracks element size and position changes",link:"/hooks/use-resize-observer",children:(0,a.jsx)(as.Demo,{data:aH.UseResizeObserverDemos.usage,demoProps:{defaultExpanded:!1}})}),(0,a.jsx)(aM,{title:"use-hotkeys",description:"use-hotkeys hook allows binding keyboard shortcuts to actions",link:"/hooks/use-hotkeys",children:(0,a.jsx)(as.Demo,{data:aj.UseHotkeysDemos.index,demoProps:{defaultExpanded:!1}})}),(0,a.jsx)(aM,{title:"use-eye-dropper",description:"use-eye-dropper hook allows picking colors from anywhere on the screen",link:"/hooks/use-eye-dropper",children:(0,a.jsx)(as.Demo,{data:ab.UseEyeDropperDemos.usage,demoProps:{defaultExpanded:!1,maxCollapsedHeight:e?150:256}})})]})]})})}var aV=e.i(804938),aZ=e.i(716450),aL=e.i(78747),aC=e.i(506417);let ak={discord:(0,a.jsx)(aV.DiscordIcon,{size:30,className:aC.default.icon}),twitter:(0,a.jsx)(function({size:e,style:t,...l}){return(0,a.jsx)(s.Box,{component:"svg",xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 24 24",style:[{width:e,height:e},t],...l,children:(0,a.jsx)("path",{d:"M14.095479,10.316482L22.286354,1h-1.940718l-7.115352,8.087682L7.551414,1H1l8.589488,12.231093L1,23h1.940717 l7.509372-8.542861L16.448587,23H23L14.095479,10.316482z M11.436522,13.338465l-0.871624-1.218704l-6.924311-9.68815h2.981339 l5.58978,7.82155l0.867949,1.218704l7.26506,10.166271h-2.981339L11.436522,13.338465z"})})},{size:30,className:aC.default.icon}),github:(0,a.jsx)(aZ.GithubIcon,{size:30,className:aC.default.icon}),mantine:(0,a.jsx)("div",{className:aC.default.icon,children:(0,a.jsx)(aL.MantineLogo,{size:50,type:"mark"})})};function aE({icon:e,title:t,description:l,className:o,...i}){return(0,a.jsxs)("a",{className:(0,f.default)(aC.default.card,o),target:"_blank",rel:"noreferrer",...i,children:[ak[e],(0,a.jsx)(n.ArrowUpRightIcon,{size:20,className:aC.default.arrow}),(0,a.jsxs)("div",{className:aC.default.body,children:[(0,a.jsx)("div",{className:aC.default.title,children:t}),(0,a.jsx)("div",{className:aC.default.description,children:l})]})]})}function aS(){return(0,a.jsx)(aE,{icon:"discord",className:aC.default.discord,href:S.meta.discordLink,title:"Chat on Discord",description:"Join a community of 10,000+ developers to ask questions, share feedback and explore upcoming features"})}function aI(){return(0,a.jsx)(aE,{icon:"github",className:aC.default.github,href:S.meta.gitHubLinks.discussions,title:"Start a discussion",description:"Request new features, ask questions and provide feedback with GitHub discussions"})}function aP(){return(0,a.jsx)(aE,{icon:"twitter",className:aC.default.twitter,href:S.meta.twitterLink,title:"Follow on X",description:"Get notified about new minor and major releases"})}var aN=e.i(130307);function aF(){return(0,a.jsx)("section",{className:aN.default.root,children:(0,a.jsxs)(x,{children:[(0,a.jsx)(M,{order:2,children:"Join the community"}),(0,a.jsx)(b,{className:aN.default.description,children:"Mantine is an open-source project with a growing community of developers and contributors. Join us on GitHub, Discord, Twitter and other platforms to stay updated and get help with your projects."}),(0,a.jsx)("div",{className:aN.default.cards,children:(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:10,children:[(0,a.jsx)(aS,{}),(0,a.jsxs)(eF.Stack,{gap:10,children:[(0,a.jsx)(aI,{}),(0,a.jsx)(aP,{})]})]})})]})})}let aG={src:e.i(670307).default,width:2200,height:4512,blurWidth:4,blurHeight:8,blurDataURL:"data:image/webp;base64,UklGRtAAAABXRUJQVlA4TMQAAAAvA8ABAM1VICICHgjACQQAAIBYDR8CgAAAAgAAAAAAAAAIAAAAAAAAAAAAACAADwAQILAgZdcCAADwQEBOAAAAAM7/fh9LAAAACgAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAApJoHAnICAAAAcP73SQgAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAAYAAAACKLEtkXWvdoyGeeB5DMloe+Of9rJG0+wXJvzJ5cKlYprRpd3QzVVLfqMuQFgP/rbiHQQFOQP"},aD={src:e.i(230695).default,width:2200,height:4512,blurWidth:4,blurHeight:8,blurDataURL:"data:image/webp;base64,UklGRtIAAABXRUJQVlA4TMYAAAAvA8ABAM1VICICHgiwCQAAAACLRIKACgUAAAQAAUAAAAAAAAAAAAAIBAEAQAAAAEAgARDgqAgAAMADQauBAAAAOP9XP7sxAACAAAAAAAAAAAAAAAAAAAAAAAAAAAAAYAAAAAAA2fkeCNoJBAAAwPm/XxIBAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAACgAAAOIOplqLrLennuZ8gLcNGR/R1NxDr/+MX22ls6xmddiGFf7DVoKzI2KWEE2CgPlu
9+RdPh6F4QwY="};var aT=e.i(125762);function az(){return(0,a.jsxs)("section",{className:aT.default.root,children:[(0,a.jsx)("div",{className:aT.default.overlay}),(0,a.jsxs)(x,{className:aT.default.container,children:[(0,a.jsx)(s.Box,{darkHidden:!0,className:aT.default.image,style:{backgroundImage:`url(${aD.src})`}}),(0,a.jsx)(s.Box,{lightHidden:!0,className:aT.default.image,style:{backgroundImage:`url(${aG.src})`}}),(0,a.jsxs)("div",{className:aT.default.main,children:[(0,a.jsxs)(M,{order:1,children:["A fully featured React",(0,a.jsx)("br",{})," components library"]}),(0,a.jsx)(b,{children:"Build fully functional accessible web applications faster than ever â Mantine includes more than 120 customizable components and 70 hooks to cover you in any situation"}),(0,a.jsxs)("div",{className:aT.default.actions,children:[(0,a.jsx)(ef.Button,{component:o.default,href:"/getting-started",className:aT.default.action,"data-get-started":!0,justify:"space-between",rightSection:(0,a.jsx)(n.ArrowUpRightIcon,{size:26}),children:"Get Started"}),(0,a.jsx)(ef.Button,{className:aT.default.action,"data-github":!0,rightSection:(0,a.jsx)(aZ.GithubIcon,{size:26}),justify:"space-between",component:"a",href:S.meta.gitHubLinks.mantine,children:"GitHub"})]})]})]})]})}let aB=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232,44H160a43.86,43.86,0,0,0-32,13.85A43.86,43.86,0,0,0,96,44H24A12,12,0,0,0,12,56V200a12,12,0,0,0,12,12H96a20,20,0,0,1,20,20,12,12,0,0,0,24,0,20,20,0,0,1,20-20h72a12,12,0,0,0,12-12V56A12,12,0,0,0,232,44ZM96,188H36V68H96a20,20,0,0,1,20,20V192.81A43.79,43.79,0,0,0,96,188Zm124,0H160a43.71,43.71,0,0,0-20,4.83V88a20,20,0,0,1,20-20h60ZM164,96h32a12,12,0,0,1,0,24H164a12,12,0,0,1,0-24Zm44,52a12,12,0,0,1-12,12H164a12,12,0,0,1,0-24h32A12,12,0,0,1,208,148Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232,56V200H160a32,32,0,0,0-32,32V88a32,32,0,0,1,32-32Z",opacity:"0.2"}),D.createElement("path",{d:"M232,48H160a40,40,0,0,0-32,16A40,40,0,0,0,96,48H24a8,8,0,0,0-8,8V200a8,8,0,0,0,8,8H96a24,24,0,0,1,24,24,8,8,0,0,0,16,0,24,24,0,0,1,24-24h72a8,8,0,0,0,8-8V56A8,8,0,0,0,232,48ZM96,192H32V64H96a24,24,0,0,1,24,24V200A39.81,39.81,0,0,0,96,192Zm128,0H160a39.81,39.81,0,0,0-24,8V88a24,24,0,0,1,24-24h64ZM160,88h40a8,8,0,0,1,0,16H160a8,8,0,0,1,0-16Zm48,40a8,8,0,0,1-8,8H160a8,8,0,0,1,0-16h40A8,8,0,0,1,208,128Zm0,32a8,8,0,0,1-8,8H160a8,8,0,0,1,0-16h40A8,8,0,0,1,208,160Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232,48H168a32,32,0,0,0-32,32v87.73a8.17,8.17,0,0,1-7.47,8.25,8,8,0,0,1-8.53-8V80A32,32,0,0,0,88,48H24a8,8,0,0,0-8,8V200a8,8,0,0,0,8,8H96a24,24,0,0,1,24,23.94,7.9,7.9,0,0,0,5.12,7.55A8,8,0,0,0,136,232a24,24,0,0,1,24-24h72a8,8,0,0,0,8-8V56A8,8,0,0,0,232,48ZM208,168H168.27a8.17,8.17,0,0,1-8.25-7.47,8,8,0,0,1,8-8.53h39.73a8.17,8.17,0,0,1,8.25,7.47A8,8,0,0,1,208,168Zm0-32H168.27a8.17,8.17,0,0,1-8.25-7.47,8,8,0,0,1,8-8.53h39.73a8.17,8.17,0,0,1,8.25,7.47A8,8,0,0,1,208,136Zm0-32H168.27A8.17,8.17,0,0,1,160,96.53,8,8,0,0,1,168,88h39.73A8.17,8.17,0,0,1,216,95.47,8,8,0,0,1,208,104Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232,50H160a38,38,0,0,0-32,17.55A38,38,0,0,0,96,50H24a6,6,0,0,0-6,6V200a6,6,0,0,0,6,6H96a26,26,0,0,1,26,26,6,6,0,0,0,12,0,26,26,0,0,1,26-26h72a6,6,0,0,0,6-6V56A6,6,0,0,0,232,50ZM96,194H30V62H96a26,26,0,0,1,26,26V204.31A37.86,37.86,0,0,0,96,194Zm130,0H160a37.87,37.87,0,0,0-26,10.32V88a26,26,0,0,1,26-26h66ZM160,90h40a6,6,0,0,1,0,12H160a6,6,0,0,1,0-12Zm46,38a6,6,0,0,1-6,6H160a6,6,0,0,1,0-12h40A6,6,0,0,1,206,128Zm0,32a6,6,0,0,1-6,6H160a6,6,0,0,1,0-12h40A6,6,0,0,1,206,160Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232,48H160a40,40,0,0,0-32,16A40,40,0,0,0,96,48H24a8,8,0,0,0-8,8V200a8,8,0,0,0,8,8H96a24,24,0,0,1,24,24,8,8,0,0,0,16,0,24,24,0,0,1,24-24h72a8,8,0,0,0,8-8V56A8,8,0,0,0,232,48ZM96,192H32V64H96a24,24,0,0,1,24,24V200A39.81,39.81,0,0,0,96,192Zm128,0H160a39.81,39.81,0,0,0-24,8V88a24,24,0,0,1,24-24h64ZM160,88h40a8,8,0,0,1,0,16H160a8,8,0,0,1,0-16Zm48,40a8,8,0,0,1-8,8H160a8,8,0,0,1,0-16h40A8,8,0,0,1,208,128Zm0,32a8,8,0,0,1-8,8H160a8,8,0,0,1,0-16h40A8,8,0,0,1,208,160Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232,52H160a36,36,0,0,0-32,19.54A36,36,0,0,0,96,52H24a4,4,0,0,0-4,4V200a4,4,0,0,0,4,4H96a28,28,0,0,1,28,28,4,4,0,0,0,8,0,28,28,0,0,1,28-28h72a4,4,0,0,0,4-4V56A4,4,0,0,0,232,52ZM96,196H28V60H96a28,28,0,0,1,28,28V209.4A35.94,35.94,0,0,0,96,196Zm132,0H160a35.94,35.94,0,0,0-28,13.41V88a28,28,0,0,1,28-28h68ZM160,92h40a4,4,0,0,1,0,8H160a4,4,0,0,1,0-8Zm44,36a4,4,0,0,1-4,4H160a4,4,0,0,1,0-8h40A4,4,0,0,1,204,128Zm0,32a4,4,0,0,1-4,4H160a4,4,0,0,1,0-8h40A4,4,0,0,1,204,160Z"}))]]),aR=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:aB}));aR.displayName="BookOpenTextIcon";let aq=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M252,124a60.14,60.14,0,0,0-32-53.08,52,52,0,0,0-92-32.11A52,52,0,0,0,36,70.92a60,60,0,0,0,0,106.14,52,52,0,0,0,92,32.13,52,52,0,0,0,92-32.13A60.05,60.05,0,0,0,252,124ZM88,204a28,28,0,0,1-26.85-20.07c1,0,1.89.07,2.85.07h8a12,12,0,0,0,0-24H64A36,36,0,0,1,52,90.05a12,12,0,0,0,8-11.32V72a28,28,0,0,1,56,0v60.18a51.61,51.61,0,0,0-7.2-3.85,12,12,0,1,0-9.6,22A28,28,0,0,1,88,204Zm104-44h-8a12,12,0,0,0,0,24h8c1,0,1.9,0,2.85-.07a28,28,0,1,1-38-33.61,12,12,0,1,0-9.6-22,51.61,51.61,0,0,0-7.2,3.85V72a28,28,0,0,1,56,0v6.73a12,12,0,0,0,8,11.32,36,36,0,0,1-12,70Zm16-44a12,12,0,0,1-12,12,40,40,0,0,1-40-40V84a12,12,0,0,1,24,0v4a16,16,0,0,0,16,16A12,12,0,0,1,208,116ZM100,88a40,40,0,0,1-40,40,12,12,0,0,1,0-24A16,16,0,0,0,76,88V84a12,12,0,0,1,24,0Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M240,124a48,48,0,0,1-32,45.27h0V176a40,40,0,0,1-80,0,40,40,0,0,1-80,0v-6.73h0a48,48,0,0,1,0-90.54V72a40,40,0,0,1,80,0,40,40,0,0,1,80,0v6.73A48,48,0,0,1,240,124Z",opacity:"0.2"}),D.createElement("path",{d:"M248,124a56.11,56.11,0,0,0-32-50.61V72a48,48,0,0,0-88-26.49A48,48,0,0,0,40,72v1.39a56,56,0,0,0,0,101.2V176a48,48,0,0,0,88,26.49A48,48,0,0,0,216,176v-1.41A56.09,56.09,0,0,0,248,124ZM88,208a32,32,0,0,1-31.81-28.56A55.87,55.87,0,0,0,64,180h8a8,8,0,0,0,0-16H64A40,40,0,0,1,50.67,86.27,8,8,0,0,0,56,78.73V72a32,32,0,0,1,64,0v68.26A47.8,47.8,0,0,0,88,128a8,8,0,0,0,0,16,32,32,0,0,1,0,64Zm104-44h-8a8,8,0,0,0,0,16h8a55.87,55.87,0,0,0,7.81-.56A32,32,0,1,1,168,144a8,8,0,0,0,0-16,47.8,47.8,0,0,0-32,12.26V72a32,32,0,0,1,64,0v6.73a8,8,0,0,0,5.33,7.54A40,40,0,0,1,192,164Zm16-52a8,8,0,0,1-8,8h-4a36,36,0,0,1-36-36V80a8,8,0,0,1,16,0v4a20,20,0,0,0,20,20h4A8,8,0,0,1,208,112ZM60,120H56a8,8,0,0,1,0-16h4A20,20,0,0,0,80,84V80a8,8,0,0,1,16,0v4A36,36,0,0,1,60,120Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M212,76V72a44,44,0,0,0-74.86-31.31,3.93,3.93,0,0,0-1.14,2.8v88.72a4,4,0,0,0,6.2,3.33A47.67,47.67,0,0,1,167.68,128a8.18,8.18,0,0,1,8.31,7.58,8,8,0,0,1-8,8.42,32,32,0,0,0-32,32v33.88a4,4,0,0,0,1.49,3.12,47.92,47.92,0,0,0,74.21-17.16,4,4,0,0,0-4.49-5.56A68.06,68.06,0,0,1,192,192h-7.73a8.18,8.18,0,0,1-8.25-7.47,8,8,0,0,1,8-8.53h8a51.6,51.6,0,0,0,24-5.88v0A52,52,0,0,0,212,76Zm-12,36h-4a36,36,0,0,1-36-36V72a8,8,0,0,1,16,0v4a20,20,0,0,0,20,20h4a8,8,0,0,1,0,16ZM88,28A44.05,44.05,0,0,0,44,72v4a52,52,0,0,0-4,94.12h0A51.6,51.6,0,0,0,64,176h7.73A8.18,8.18,0,0,1,80,183.47,8,8,0,0,1,72,192H64a67.48,67.48,0,0,1-15.21-1.73,4,4,0,0,0-4.5,5.55A47.93,47.93,0,0,0,118.51,213a4,4,0,0,0,1.49-3.12V176a32,32,0,0,0-32-32,8,8,0,0,1-8-8.42A8.18,8.18,0,0,1,88.32,128a47.67,47.67,0,0,1,25.48,7.54,4,4,0,0,0,6.2-3.33V43.49a4,4,0,0,0-1.14-2.81A43.85,43.85,0,0,0,88,28Zm8,48a36,36,0,0,1-36,36H56a8,8,0,0,1,0-16h4A20,20,0,0,0,80,76V72a8,8,0,0,1,16,0Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M246,124a54.13,54.13,0,0,0-32-49.33V72a46,46,0,0,0-86-22.67A46,46,0,0,0,42,72v2.67a54,54,0,0,0,0,98.63V176a46,46,0,0,0,86,22.67A46,46,0,0,0,214,176v-2.7A54.07,54.07,0,0,0,246,124ZM88,210a34,34,0,0,1-34-32.94A53.67,53.67,0,0,0,64,178h8a6,6,0,0,0,0-12H64A42,42,0,0,1,50,84.39a6,6,0,0,0,4-5.66V72a34,34,0,0,1,68,0v73.05A45.89,45.89,0,0,0,88,130a6,6,0,0,0,0,12,34,34,0,0,1,0,68Zm104-44h-8a6,6,0,0,0,0,12h8a53.67,53.67,0,0,0,10-.94A34,34,0,1,1,168,142a6,6,0,0,0,0-12,45.89,45.89,0,0,0-34,15.05V72a34,34,0,0,1,68,0v6.73a6,6,0,0,0,4,5.66A42,42,0,0,1,192,166Zm14-54a6,6,0,0,1-6,6h-4a34,34,0,0,1-34-34V80a6,6,0,0,1,12,0v4a22,22,0,0,0,22,22h4A6,6,0,0,1,206,112ZM60,118H56a6,6,0,0,1,0-12h4A22,22,0,0,0,82,84V80a6,6,0,0,1,12,0v4A34,34,0,0,1,60,118Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M248,124a56.11,56.11,0,0,0-32-50.61V72a48,48,0,0,0-88-26.49A48,48,0,0,0,40,72v1.39a56,56,0,0,0,0,101.2V176a48,48,0,0,0,88,26.49A48,48,0,0,0,216,176v-1.41A56.09,56.09,0,0,0,248,124ZM88,208a32,32,0,0,1-31.81-28.56A55.87,55.87,0,0,0,64,180h8a8,8,0,0,0,0-16H64A40,40,0,0,1,50.67,86.27,8,8,0,0,0,56,78.73V72a32,32,0,0,1,64,0v68.26A47.8,47.8,0,0,0,88,128a8,8,0,0,0,0,16,32,32,0,0,1,0,64Zm104-44h-8a8,8,0,0,0,0,16h8a55.87,55.87,0,0,0,7.81-.56A32,32,0,1,1,168,144a8,8,0,0,0,0-16,47.8,47.8,0,0,0-32,12.26V72a32,32,0,0,1,64,0v6.73a8,8,0,0,0,5.33,7.54A40,40,0,0,1,192,164Zm16-52a8,8,0,0,1-8,8h-4a36,36,0,0,1-36-36V80a8,8,0,0,1,16,0v4a20,20,0,0,0,20,20h4A8,8,0,0,1,208,112ZM60,120H56a8,8,0,0,1,0-16h4A20,20,0,0,0,80,84V80a8,8,0,0,1,16,0v4A36,36,0,0,1,60,120Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M244,124a52.1,52.1,0,0,0-32-48V72a44,44,0,0,0-84-18.3A44,44,0,0,0,44,72v4a52,52,0,0,0,0,96v4a44,44,0,0,0,84,18.3A44,44,0,0,0,212,176v-4A52.07,52.07,0,0,0,244,124ZM88,212a36,36,0,0,1-36-36v-1.41A52.13,52.13,0,0,0,64,176h8a4,4,0,0,0,0-8H64A44,44,0,0,1,49.33,82.5,4,4,0,0,0,52,78.73V72a36,36,0,0,1,72,0v78.75A44,44,0,0,0,88,132a4,4,0,0,0,0,8,36,36,0,0,1,0,72Zm104-44h-8a4,4,0,0,0,0,8h8a52.13,52.13,0,0,0,12-1.41V176a36,36,0,1,1-36-36,4,4,0,0,0,0-8,44,44,0,0,0-36,18.75V72a36,36,0,0,1,72,0v6.73a4,4,0,0,0,2.67,3.77A44,44,0,0,1,192,168Zm12-56a4,4,0,0,1-4,4h-4a32,32,0,0,1-32-32V80a4,4,0,0,1,8,0v4a24,24,0,0,0,24,24h4A4,4,0,0,1,204,112ZM92,84a32,32,0,0,1-32,32H56a4,4,0,0,1,0-8h4A24,24,0,0,0,84,84V80a4,4,0,0,1,8,0Z"}))]]),aW=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:aq}));aW.displayName="BrainIcon";var aU=e.i(119004);let aQ=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M240.49,63.51a12,12,0,0,0-17,0L192,95,161,64l31.52-31.51a12,12,0,0,0-17-17L144,47,120.49,23.51a12,12,0,1,0-17,17L107,44,56.89,94.14a44,44,0,0,0,0,62.23l12.88,12.88L23.51,215.51a12,12,0,0,0,17,17l46.26-46.26,12.88,12.88a44,44,0,0,0,62.23,0L212,149l3.51,3.52a12,12,0,0,0,17-17L209,112l31.52-31.51A12,12,0,0,0,240.49,63.51Zm-95.6,118.63a20,20,0,0,1-28.29,0L73.86,139.4a20,20,0,0,1,0-28.29L124,61l71,71Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M212,132l-58.63,58.63a32,32,0,0,1-45.25,0L65.37,147.88a32,32,0,0,1,0-45.25L124,44Z",opacity:"0.2"}),D.createElement("path",{d:"M237.66,66.34a8,8,0,0,0-11.32,0L192,100.69,155.31,64l34.35-34.34a8,8,0,1,0-11.32-11.32L144,52.69,117.66,26.34a8,8,0,0,0-11.32,11.32L112.69,44l-53,53a40,40,0,0,0,0,56.57l15.71,
915.71L26.34,218.34a8,8,0,0,0,11.32,11.32l49.09-49.09,15.71,15.71a40,40,0,0,0,56.57,0l53-53,6.34,6.35a8,8,0,0,0,11.32-11.32L203.31,112l34.35-34.34A8,8,0,0,0,237.66,66.34ZM147.72,185a24,24,0,0,1-33.95,0L71,142.23a24,24,0,0,1,0-33.95l53-53L200.69,132Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M237.66,77.66,203.31,112l26.35,26.34a8,8,0,0,1-11.32,11.32L212,143.31l-53,53a40,40,0,0,1-56.57,0L86.75,180.57,37.66,229.66a8,8,0,0,1-11.32-11.32l49.09-49.09L59.72,153.54a40,40,0,0,1,0-56.57l53-53-6.35-6.34a8,8,0,0,1,11.32-11.32L144,52.69l34.34-34.35a8,8,0,1,1,11.32,11.32L155.31,64,192,100.69l34.34-34.35a8,8,0,0,1,11.32,11.32Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M236.24,67.76a6,6,0,0,0-8.48,0L192,103.51,152.49,64l35.75-35.76a6,6,0,0,0-8.48-8.48L144,55.51,116.24,27.76a6,6,0,1,0-8.48,8.48L115.51,44,61.13,98.38a38,38,0,0,0,0,53.75l17.13,17.12-50.5,50.51a6,6,0,1,0,8.48,8.48l50.51-50.5,17.13,17.13a38,38,0,0,0,53.74,0L212,140.49l7.76,7.75a6,6,0,0,0,8.48-8.48L200.49,112l35.75-35.76A6,6,0,0,0,236.24,67.76ZM149.13,186.38a26,26,0,0,1-36.77,0L69.62,143.64a26,26,0,0,1,0-36.77L124,52.49,203.51,132Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M237.66,66.34a8,8,0,0,0-11.32,0L192,100.69,155.31,64l34.35-34.34a8,8,0,1,0-11.32-11.32L144,52.69,117.66,26.34a8,8,0,0,0-11.32,11.32L112.69,44l-53,53a40,40,0,0,0,0,56.57l15.71,15.71L26.34,218.34a8,8,0,0,0,11.32,11.32l49.09-49.09,15.71,15.71a40,40,0,0,0,56.57,0l53-53,6.34,6.35a8,8,0,0,0,11.32-11.32L203.31,112l34.35-34.34A8,8,0,0,0,237.66,66.34ZM147.72,185a24,24,0,0,1-33.95,0L71,142.23a24,24,0,0,1,0-33.95l53-53L200.69,132Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M234.83,69.17a4,4,0,0,0-5.66,0L192,106.34,149.66,64l37.17-37.17a4,4,0,1,0-5.66-5.66L144,58.34,114.83,29.17a4,4,0,0,0-5.66,5.66L118.34,44,62.54,99.8a36.05,36.05,0,0,0,0,50.91l18.55,18.54L29.17,221.17a4,4,0,0,0,5.66,5.66l51.92-51.92,18.54,18.55a36.06,36.06,0,0,0,50.91,0l55.8-55.8,9.17,9.17a4,4,0,0,0,5.66-5.66L197.66,112l37.17-37.17A4,4,0,0,0,234.83,69.17ZM150.54,187.8a28,28,0,0,1-39.59,0L68.2,145.05a28,28,0,0,1,0-39.59L124,49.66,206.34,132Z"}))]]),aO=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:aQ}));aO.displayName="PlugIcon";var aK=e.i(638004);let aJ=`# Reference Mantine docs in Cursor 10@Docs https://mantine.dev/llms.txt 11 12# Or download full documentation 13curl -o mantine-docs.txt https://mantine.dev/llms-full.txt 14 15# Use with ChatGPT/Claude 16"Using Mantine, how do I create a dark mode toggle? 17Reference: https://mantine.dev/llms.txt"`,aX=`# Install Mantine skills for AI agents 18npx skills add https://github.com/mantinedev/skills \\ 19 --skill mantine-combobox 20npx skills add https://github.com/mantinedev/skills \\ 21 --skill mantine-form 22npx skills add https://github.com/mantinedev/skills \\ 23 --skill mantine-custom-components 24 25# Use in your AI prompt: 26# "Use $mantine-form and build a profile 27# form with validation and nested fields"`,aY=`// Add to your MCP client configuration 28{ 29 "mcpServers": { 30 "mantine": { 31 "command": "npx", 32 "args": ["-y", "@mantine/mcp-server"] 33 } 34 } 35} 36 37// Available tools: 38// - list_items 39// - get_item_doc 40// - get_item_props 41// - search_docs`,a$=[{label:"Documentation",value:"docs",content:(0,a.jsx)(eK.MdxCodeHighlight,{code:aJ,language:"bash",className:aK.default.code})},{label:"Skills",value:"skills",content:(0,a.jsx)(eK.MdxCodeHighlight,{code:aX,language:"bash",className:aK.default.code})},{label:"MCP server",value:"mcp",content:(0,a.jsx)(eK.MdxCodeHighlight,{code:aY,language:"json",className:aK.default.code})}];function a0(){return(0,a.jsx)(R,{data:a$})}let a1=[{icon:aU.FileTextIcon,title:"LLM documentation",description:"llms.txt and llms-full.txt files follow the LLMs.txt standard â use them with Cursor, Windsurf, ChatGPT, Claude, and other AI tools"},{icon:aW,title:"Skills for AI agents",description:"Install Mantine skills for complex tasks like building forms, custom components, and combobox-based inputs"},{icon:aO,title:"MCP server",description:"Use @mantine/mcp-server to give AI agents direct access to component docs, props, and search across the entire library"},{icon:aR,title:"Always up to date",description:"LLM documentation is regenerated
41with every release â AI tools always have access to the latest API and examples"}];function a2(){return(0,a.jsx)("section",{className:aK.default.root,children:(0,a.jsx)(x,{children:(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:50,verticalSpacing:30,children:[(0,a.jsx)("div",{className:aK.default.column,children:(0,a.jsxs)("div",{className:aK.default.main,children:[(0,a.jsx)(M,{order:2,children:"Built for the AI-assisted workflow"}),(0,a.jsx)(b,{className:aK.default.description,children:"LLM-optimized docs, agent skills for complex tasks, and an MCP server for direct API access â Mantine is designed to work with Cursor, Claude Code, Windsurf, and every AI coding tool you already use."}),(0,a.jsx)(H,{href:"/guides/llms/",children:"Learn more about LLM integrations"}),(0,a.jsx)(au,{data:a1})]})}),(0,a.jsx)("div",{className:aK.default.column,children:(0,a.jsx)(a0,{})})]})})})}var a4=e.i(612282),a6=e.i(206410);function a8(){let e=a4.default.map(e=>(0,a.jsxs)("a",{href:e.url,target:"_blank",rel:"noreferrer","aria-label":`Mantine is sponsored by ${e.name} ð`,className:a6.default.sponsor,children:[(0,a.jsx)(eQ.Image,{src:e.image,className:a6.default.image,alt:e.name,loading:"lazy"}),(0,a.jsx)("span",{className:a6.default.name,children:e.name})]},e.name));return(0,a.jsxs)(x,{className:a6.default.inner,children:[(0,a.jsx)(v.Text,{className:a6.default.title,children:"Sponsored by"}),(0,a.jsxs)("div",{className:a6.default.sponsors,children:[e,(0,a.jsxs)("a",{href:"https://opencollective.com/mantinedev",target:"_blank",rel:"noreferrer","aria-label":"You? Sponsor Mantine",className:a6.default.sponsor,children:[(0,a.jsx)("span",{className:a6.default.name,children:"You? â¤ï¸"}),(0,a.jsx)("div",{className:a6.default.description,children:"Sponsor Mantine to get featured here and support the project."})]})]})]})}let a3=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M51.51,104.49l-32-32a12,12,0,0,1,0-17l32-32a12,12,0,1,1,17,17L45,64,68.49,87.51a12,12,0,0,1-17,17Zm48,0a12,12,0,0,0,17,0l32-32a12,12,0,0,0,0-17l-32-32a12,12,0,1,0-17,17L123,64,99.51,87.51A12,12,0,0,0,99.51,104.49ZM200,36H180a12,12,0,0,0,0,24h16V196H60V140a12,12,0,0,0-24,0v60a20,20,0,0,0,20,20H200a20,20,0,0,0,20-20V56A20,20,0,0,0,200,36Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M152,32V96a16,16,0,0,1-16,16H32A16,16,0,0,1,16,96V32A16,16,0,0,1,32,16H136A16,16,0,0,1,152,32Z",opacity:"0.2"}),D.createElement("path",{d:"M58.34,101.66l-32-32a8,8,0,0,1,0-11.32l32-32A8,8,0,0,1,69.66,37.66L43.31,64,69.66,90.34a8,8,0,0,1-11.32,11.32Zm40,0a8,8,0,0,0,11.32,0l32-32a8,8,0,0,0,0-11.32l-32-32A8,8,0,0,0,98.34,37.66L124.69,64,98.34,90.34A8,8,0,0,0,98.34,101.66ZM200,40H176a8,8,0,0,0,0,16h24V200H56V136a8,8,0,0,0-16,0v64a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V56A16,16,0,0,0,200,40Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M200,40H168a16,16,0,0,0-16-16H32A16,16,0,0,0,16,40v80a16,16,0,0,0,16,16h8v64a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V56A16,16,0,0,0,200,40ZM106.34,61.66a8,8,0,0,1,11.32-11.32l24,24a8,8,0,0,1,0,11.32l-24,24a8,8,0,0,1-11.32-11.32L124.69,80Zm-64,24a8,8,0,0,1,0-11.32l24-24A8,8,0,0,1,77.66,61.66L59.31,80,77.66,98.34a8,8,0,0,1-11.32,11.32ZM200,200H56V136h96a16,16,0,0,0,16-16V56h32Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M59.76,100.24l-32-32a6,6,0,0,1,0-8.48l32-32a6,6,0,1,1,8.48,8.48L40.49,64,68.24,91.76a6,6,0,1,1-8.48,8.48Zm40,0a6,6,0,0,0,8.48,0l32-32a6,6,0,0,0,0-8.48l-32-32a6,6,0,1,0-8.48,8.48L127.51,64,99.76,91.76A6,6,0,0,0,99.76,100.24ZM200,42H176a6,6,0,0,0,0,12h24a2,2,0,0,1,2,2V200a2,2,0,0,1-2,2H56a2,2,0,0,1-2-2V136a6,6,0,0,0-12,0v64a14,14,0,0,0,14,14H200a14,14,0,0,0,14-14V56A14,14,0,0,0,200,42Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M58.34,101.66l-32-32a8,8,0,0,1,0-11.32l32-32A8,8,0,0,1,69.66,37.66L43.31,64,69.66,90.34a8,8,0,0,1-11.32,11.32Zm40,0a8,8,0,0,0,11.32,0l32-32a8,8,0,0,0,0-11.32l-32-32A8,8,0,0,0,98.34,37.66L124.69,64,98.34,90.34A8,8,0,0,0,98.34,101.66ZM200,40H176a8,8,0,0,0,0,16h24V200H56V136a8,8,0,0,0-16,0v64a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V56A16,16,0,0,0,200,40Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M61.17,98.83l-32-32a4,4,0,0,1,0-5.66l32-32a4,4,0,0,1,5.66,5.66L37.66,64,66.83,93.17a4,4,0,0,1-5.66,5.66Zm40,0a4,4,0,0,0,5.66,0l32-32a4,4,0,0,0,0-5.66l-32-32a4,4,0,0,0-5.66,5.66L130.34,64,101.17,93.17A4,4,0,0,0,101.17,98.83ZM200,44H176a4,4,0,0,0,0,8h24a4,4,0,0,1,4,4V200a4,4,0,0,1-4,4H56a4,4,0,0,1-4-4V136a4,4,0,0,0-8,0v64a12,12,0,0,0,12,12H200a12,12,0,0,0,12-12V56A12,12,0,0,0,200,44Z"}))]]),a5=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:a3}));a5.displayName="CodeBlockIcon";var a7=e.i(89837);let a9=new Map([["bold",D.createElement(D.Fragment,null,D.createElement("path",{d:"M232.49,55.51l-32-32a12,12,0,0,0-17,0l-96,96A12,12,0,0,0,84,128v32a12,12,0,0,0,12,12h32a12,12,0,0,0,8.49-3.51l96-96A12,12,0,0,0,232.49,55.51ZM192,49l15,15L196,75,181,60Zm-69,99H108V133l56-56,15,15Zm105-7.43V208a20,20,0,0,1-20,20H48a20,20,0,0,1-20-20V48A20,20,0,0,1,48,28h67.43a12,12,0,0,1,0,24H52V204H204V140.57a12,12,0,0,1,24,0Z"}))],["duotone",D.createElement(D.Fragment,null,D.createElement("path",{d:"M200,88l-72,72H96V128l72-72Z",opacity:"0.2"}),D.createElement("path",{d:"M229.66,58.34l-32-32a8,8,0,0,0-11.32,0l-96,96A8,8,0,0,0,88,128v32a8,8,0,0,0,8,8h32a8,8,0,0,0,5.66-2.34l96-96A8,8,0,0,0,229.66,58.34ZM124.69,152H104V131.31l64-64L188.69,88ZM200,76.69,179.31,56,192,43.31,212.69,64ZM224,128v80a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h80a8,8,0,0,1,0,16H48V208H208V128a8,8,0,0,1,16,0Z"}))],["fill",D.createElement(D.Fragment,null,D.createElement("path",{d:"M224,128v80a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h80a8,8,0,0,1,0,16H48V208H208V128a8,8,0,0,1,16,0Zm5.66-58.34-96,96A8,8,0,0,1,128,168H96a8,8,0,0,1-8-8V128a8,8,0,0,1,2.34-5.66l96-96a8,8,0,0,1,11.32,0l32,32A8,8,0,0,1,229.66,69.66Zm-17-5.66L192,43.31,179.31,56,200,76.69Z"}))],["light",D.createElement(D.Fragment,null,D.createElement("path",{d:"M228.24,59.76l-32-32a6,6,0,0,0-8.48,0l-96,96A6,6,0,0,0,90,128v32a6,6,0,0,0,6,6h32a6,6,0,0,0,4.24-1.76l96-96A6,6,0,0,0,228.24,59.76ZM125.51,154H102V130.49l66-66L191.51,88ZM200,79.51,176.49,56,192,40.49,215.51,64ZM222,128v80a14,14,0,0,1-14,14H48a14,14,0,0,1-14-14V48A14,14,0,0,1,48,34h80a6,6,0,0,1,0,12H48a2,2,0,0,0-2,2V208a2,2,0,0,0,2,2H208a2,2,0,0,0,2-2V128a6,6,0,0,1,12,0Z"}))],["regular",D.createElement(D.Fragment,null,D.createElement("path",{d:"M229.66,58.34l-32-32a8,8,0,0,0-11.32,0l-96,96A8,8,0,0,0,88,128v32a8,8,0,0,0,8,8h32a8,8,0,0,0,5.66-2.34l96-96A8,8,0,0,0,229.66,58.34ZM124.69,152H104V131.31l64-64L188.69,88ZM200,76.69,179.31,56,192,43.31,212.69,64ZM224,128v80a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h80a8,8,0,0,1,0,16H48V208H208V128a8,8,0,0,1,16,0Z"}))],["thin",D.createElement(D.Fragment,null,D.createElement("path",{d:"M226.83,61.17l-32-32a4,4,0,0,0-5.66,0l-96,96A4,4,0,0,0,92,128v32a4,4,0,0,0,4,4h32a4,4,0,0,0,2.83-1.17l96-96A4,4,0,0,0,226.83,61.17Z
41M126.34,156H100V129.66l68-68L194.34,88ZM200,82.34,173.66,56,192,37.66,218.34,64ZM220,128v80a12,12,0,0,1-12,12H48a12,12,0,0,1-12-12V48A12,12,0,0,1,48,36h80a4,4,0,0,1,0,8H48a4,4,0,0,0-4,4V208a4,4,0,0,0,4,4H208a4,4,0,0,0,4-4V128a4,4,0,0,1,8,0Z"}))]]),te=D.forwardRef((e,a)=>D.createElement(el.default,{ref:a,...e,weights:a9}));te.displayName="NotePencilIcon";var ta=e.i(366586),tt=e.i(10617);let tl=[{icon:a7.CodeIcon,title:"Built with CSS",description:"Mantine styles are exposed as .css files â styles are performant and do not have any runtime overhead"},{icon:te,title:"Override anything",description:"All Mantine components support Styles API which allows to override any part of component styles with inline styles of classes"},{icon:a5,title:"PostCSS preset",description:"postcss-preset-mantine includes mixins and functions to apply dark/light, rtl and responsive styles"},{icon:aO,title:"Compatible with any styling solution",description:"You can bring your own library to style Mantine components (Emotion, Vanilla Extract, Sass, etc.) â you are not limited to any specific tool"}];function to(){return(0,a.jsx)("section",{className:tt.default.root,children:(0,a.jsx)(x,{children:(0,a.jsxs)(r.SimpleGrid,{cols:{md:2},spacing:50,verticalSpacing:30,children:[(0,a.jsx)("div",{className:tt.default.column,children:(0,a.jsxs)("div",{className:tt.default.main,children:[(0,a.jsx)(M,{order:2,children:"Flexible styling"}),(0,a.jsx)(b,{className:tt.default.description,children:"Mantine components are built with native CSS â styles are performant and easy to override"}),(0,a.jsx)(H,{href:"/styles/styles-overview/",children:"Learn more about styles"}),(0,a.jsx)(au,{data:tl})]})}),(0,a.jsx)("div",{className:tt.default.column,children:(0,a.jsx)(as.Demo,{data:ta.StylesDemos.dataAttributes})})]})})})}var tn=e.i(476273);let ti={src:e.i(817321).default,width:2294,height:2160,blurWidth:8,blurHeight:8,blurDataURL:"data:image/webp;base64,UklGRm4BAABXRUJQVlA4TGIBAAAvB8ABEM1VICICHgiADQIAAICFEAGJuAIUAAgQCCBAABAAEAEAAAAUCECAcAAAAQX04CBdeFB3SeocAADAAyGAQQQAADj/W2VQxIAADwAeAAAAAAAAAAAAAAAAAAAAAAAAQAABAEARJCrGNg8E9ggVAADg/L/tNBSHoAAAHvAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAIAgJSkz2eyAANggAAADnf1fUCcKJACiBI0FIQAIQAAAAAAAAAAAEAAIBAFwgoLRwBaiowyMhQmXNypwKluMgGN2YlgcnLC2wiWCqF4AVU0tjZjFyVC00ihMA4pARPB++mcO+9gXrd3zO4VvnvnqGhWL6oDaCkRp8zu1e2umAStxttarKgyi/2Mn2o2r9p8HdGWq4Gv8E9asoGV8G8/2KYJhf/ZOBC4BUhyiGmjMuxXIA/e1dNz28aT4A0IGtfyY+HKu+psu4/5v5pjN+Kgk="};var ts=e.i(605775);function tr(){return(0,a.jsx)("div",{className:ts.default.wrapper,children:(0,a.jsxs)(g.Container,{size:1440,className:ts.default.container,children:[(0,a.jsx)("div",{className:ts.default.image,style:{backgroundImage:`url(${ti.src})`}}),(0,a.jsx)(tn.Overlay,{className:ts.default.overlay,opacity:1,zIndex:1}),(0,a.jsxs)("div",{className:ts.default.body,children:[(0,a.jsx)(v.Text,{className:ts.default.supTitle,children:"Build even faster with Mantine UI"}),(0,a.jsxs)(d.Title,{className:ts.default.title,children:[(0,a.jsx)("span",{className:ts.default.highlight,children:"120+ responsive components"}),(0,a.jsx)("br",{})," built with Mantine"]}),(0,a.jsx)(v.Text,{className:ts.default.description,children:"Build your next website even faster with premade responsive components designed and built by Mantine maintainers and community. All components are free forever for everyone."}),(0,a.jsx)("div",{className:ts.default.controls,children:(0,a.jsx)(ef.Button,{className:ts.default.control,variant:"gradient",radius:"md",size:"lg",component:"a",href:"https://ui.mantine.dev/",rightSection:(0,a.jsx)(n.ArrowUpRightIcon,{}),justify:"space-between",miw:300,children:"Explore components"})})]})]})})}var td=e.i(60117);function tc(){return(0,a.jsxs)(l.Shell,{withNavbar:!1,fluid:!0,withNav:!1,children:[(0,a.jsxs)("div",{className:td.default.root,children:[(0,a.jsx)(az,{}),(0,a.jsx)(a8,{}),(0,a.jsx)(a2,{}),(0,a.jsx)(eq,{}),(0,a.jsx)(ay,{}),(0,a.jsx)(to,{}),(0,a.jsx)(e$,{}),(0,a.jsx)(L,{}),(0,a.jsx)(e9,{}),(0,a.jsx)(ap,{}),(0,a.jsx)(tr,{}),(0,a.jsx)(G,{}),(0,a.jsx)(aF,{}),(0,a.jsx)(af,{})]}),(0,a.jsx)(t.DocsFooter,{withNavbar:!1})]})}e.s(["default",0,function(){return(0,a.jsx)(tc,{})}],426309)},79744,(e,a,t)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/",()=>e.r(426309)]),a.hot&&a.hot.dispose(function(){window.__NEXT_P.push(["/"])})},242273,e=>{e.v({root:"HomePageDescription-module__9jxgeW__root"})},359596,e=>{e.v({inner:"HomePageLearnMore-module__XDXsfq__inner",root:"HomePageLearnMore-module__XDXsfq__root"})},378320,e=>{e.v({title:"HomePageTitle-module__6jceMG__title"})},172129,e=>{e.v({demo:"HomePageCombobox-module__pF4b2a__demo",demoArea:"HomePageCombobox-module__pF4b2a__demoArea",demoHeader:"HomePageCombobox-module__pF4b2a__demoHeader",demoLink:"HomePageCombobox-module__pF4b2a__demoLink",demoTitle:"HomePageCombobox-module__pF4b2a__demoTitle",description:"HomePageCombobox-module__pF4b2a__description",grid:"HomePageCombobox-module__pF4b2a__grid",root:"HomePageCombobox-module__pF4b2a__root"})},993107,e=>{e.v({feature:"HomePageFeature-module__G3uiSa__feature",featureDescription:"HomePageFeature-module__G3uiSa__featureDescription",featureIcon:"HomePageFeature-module__G3uiSa__featureIcon",featureTitle:"HomePageFeature-module__G3uiSa__featureTitle",features:"HomePageFeature-module__G3uiSa__features"})},959377,e=>{e.v({column:"HomePageForm-module__nvTQ9q__column",main:"HomePageForm-module__nvTQ9q__main",root:"HomePageForm-module__nvTQ9q__root"})},260360,e=>{e.v({content:"HomePageTabs-module__McP4fa__content",control:"HomePageTabs-module__McP4fa__control",controlLabel:"HomePageTabs-module__McP4fa__control
41Label",controls:"HomePageTabs-module__McP4fa__controls",indicator:"HomePageTabs-module__McP4fa__indicator"})}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.