[{"data":1,"prerenderedAt":1071},["ShallowReactive",2],{"navigation":3,"\u002Fgetting-started\u002Finstallation":439},[4,30,256,281,366,375,402,424],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"\u002Fgetting-started","1.getting-started",[10,15,20,25],{"title":11,"path":12,"stem":13,"icon":14},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":16,"path":17,"stem":18,"icon":19},"Nuxt","\u002Fgetting-started\u002Fnuxt","1.getting-started\u002F3.nuxt","i-lucide-mountain",{"title":21,"path":22,"stem":23,"icon":24},"Theming","\u002Fgetting-started\u002Ftheming","1.getting-started\u002F4.theming","i-lucide-palette",{"title":26,"path":27,"stem":28,"icon":29},"MCP","\u002Fgetting-started\u002Fmcp","1.getting-started\u002F5.mcp","i-lucide-plug",{"title":31,"icon":6,"path":32,"stem":33,"children":34,"page":6},"Components","\u002Fcomponents","2.components",[35,43,51,59,67,75,83,92,100,104,108,116,124,133,141,149,157,166,174,182,191,199,203,211,220,228,236,240,248],{"title":36,"path":37,"stem":38,"children":39,"page":6},"Accordion","\u002Fcomponents\u002Faccordion","2.components\u002F01.accordion",[40],{"title":36,"path":41,"stem":42},"\u002Fcomponents\u002Faccordion\u002Foverview","2.components\u002F01.accordion\u002F1.overview",{"title":44,"path":45,"stem":46,"children":47,"page":6},"Alert","\u002Fcomponents\u002Falert","2.components\u002F02.alert",[48],{"title":44,"path":49,"stem":50},"\u002Fcomponents\u002Falert\u002Foverview","2.components\u002F02.alert\u002F1.overview",{"title":52,"path":53,"stem":54,"children":55,"page":6},"Button","\u002Fcomponents\u002Fbutton","2.components\u002F03.button",[56],{"title":52,"path":57,"stem":58},"\u002Fcomponents\u002Fbutton\u002Foverview","2.components\u002F03.button\u002F1.overview",{"title":60,"path":61,"stem":62,"children":63,"page":6},"Card","\u002Fcomponents\u002Fcard","2.components\u002F04.card",[64],{"title":60,"path":65,"stem":66},"\u002Fcomponents\u002Fcard\u002Foverview","2.components\u002F04.card\u002F1.overview",{"title":68,"path":69,"stem":70,"children":71,"page":6},"Carousel","\u002Fcomponents\u002Fcarousel","2.components\u002F05.carousel",[72],{"title":68,"path":73,"stem":74},"\u002Fcomponents\u002Fcarousel\u002Foverview","2.components\u002F05.carousel\u002F1.overview",{"title":76,"path":77,"stem":78,"children":79,"page":6},"Checkbox","\u002Fcomponents\u002Fcheckbox","2.components\u002F06.checkbox",[80],{"title":76,"path":81,"stem":82},"\u002Fcomponents\u002Fcheckbox\u002Foverview","2.components\u002F06.checkbox\u002F1.overview",{"title":84,"path":85,"stem":86,"children":87,"page":6},"Date Picker","\u002Fcomponents\u002Fdate-picker","2.components\u002F07.date-picker",[88],{"title":89,"path":90,"stem":91},"Date picker","\u002Fcomponents\u002Fdate-picker\u002Foverview","2.components\u002F07.date-picker\u002F1.overview",{"title":93,"path":94,"stem":95,"children":96,"page":6},"Dropdown","\u002Fcomponents\u002Fdropdown","2.components\u002F08.dropdown",[97],{"title":93,"path":98,"stem":99},"\u002Fcomponents\u002Fdropdown\u002Foverview","2.components\u002F08.dropdown\u002F1.overview",{"title":101,"path":102,"stem":103},"Heading","\u002Fcomponents\u002Fheading","2.components\u002F09.heading",{"title":105,"path":106,"stem":107},"Icon","\u002Fcomponents\u002Ficon","2.components\u002F10.icon",{"title":109,"path":110,"stem":111,"children":112,"page":6},"Input","\u002Fcomponents\u002Finput","2.components\u002F11.input",[113],{"title":109,"path":114,"stem":115},"\u002Fcomponents\u002Finput\u002Foverview","2.components\u002F11.input\u002F1.overview",{"title":117,"path":118,"stem":119,"children":120,"page":6},"Label","\u002Fcomponents\u002Flabel","2.components\u002F12.label",[121],{"title":117,"path":122,"stem":123},"\u002Fcomponents\u002Flabel\u002Foverview","2.components\u002F12.label\u002F1.overview",{"title":125,"path":126,"stem":127,"children":128,"page":6},"Phone Number","\u002Fcomponents\u002Fphone-number","2.components\u002F13.phone-number",[129],{"title":130,"path":131,"stem":132},"Phone number","\u002Fcomponents\u002Fphone-number\u002Foverview","2.components\u002F13.phone-number\u002F1.overview",{"title":134,"path":135,"stem":136,"children":137,"page":6},"Popover","\u002Fcomponents\u002Fpopover","2.components\u002F14.popover",[138],{"title":134,"path":139,"stem":140},"\u002Fcomponents\u002Fpopover\u002Foverview","2.components\u002F14.popover\u002F1.overview",{"title":142,"path":143,"stem":144,"children":145,"page":6},"Quantity","\u002Fcomponents\u002Fquantity","2.components\u002F15.quantity",[146],{"title":142,"path":147,"stem":148},"\u002Fcomponents\u002Fquantity\u002Foverview","2.components\u002F15.quantity\u002F1.overview",{"title":150,"path":151,"stem":152,"children":153,"page":6},"Radio","\u002Fcomponents\u002Fradio","2.components\u002F16.radio",[154],{"title":150,"path":155,"stem":156},"\u002Fcomponents\u002Fradio\u002Foverview","2.components\u002F16.radio\u002F1.overview",{"title":158,"path":159,"stem":160,"children":161,"page":6},"Radio Group","\u002Fcomponents\u002Fradio-group","2.components\u002F17.radio-group",[162],{"title":163,"path":164,"stem":165},"Radio group","\u002Fcomponents\u002Fradio-group\u002Foverview","2.components\u002F17.radio-group\u002F1.overview",{"title":167,"path":168,"stem":169,"children":170,"page":6},"Rating","\u002Fcomponents\u002Frating","2.components\u002F18.rating",[171],{"title":167,"path":172,"stem":173},"\u002Fcomponents\u002Frating\u002Foverview","2.components\u002F18.rating\u002F1.overview",{"title":175,"path":176,"stem":177,"children":178,"page":6},"Required","\u002Fcomponents\u002Frequired","2.components\u002F19.required",[179],{"title":175,"path":180,"stem":181},"\u002Fcomponents\u002Frequired\u002Foverview","2.components\u002F19.required\u002F1.overview",{"title":183,"path":184,"stem":185,"children":186,"page":6},"Scroll Area","\u002Fcomponents\u002Fscroll-area","2.components\u002F20.scroll-area",[187],{"title":188,"path":189,"stem":190},"Scroll area","\u002Fcomponents\u002Fscroll-area\u002Foverview","2.components\u002F20.scroll-area\u002F1.overview",{"title":192,"path":193,"stem":194,"children":195,"page":6},"Select","\u002Fcomponents\u002Fselect","2.components\u002F21.select",[196],{"title":192,"path":197,"stem":198},"\u002Fcomponents\u002Fselect\u002Foverview","2.components\u002F21.select\u002F1.overview",{"title":200,"path":201,"stem":202},"Spinner","\u002Fcomponents\u002Fspinner","2.components\u002F22.spinner",{"title":204,"path":205,"stem":206,"children":207,"page":6},"Switch","\u002Fcomponents\u002Fswitch","2.components\u002F23.switch",[208],{"title":204,"path":209,"stem":210},"\u002Fcomponents\u002Fswitch\u002Foverview","2.components\u002F23.switch\u002F1.overview",{"title":212,"path":213,"stem":214,"children":215,"page":6},"Tab Badge","\u002Fcomponents\u002Ftab-badge","2.components\u002F24.tab-badge",[216],{"title":217,"path":218,"stem":219},"Tab badge","\u002Fcomponents\u002Ftab-badge\u002Foverview","2.components\u002F24.tab-badge\u002F1.overview",{"title":221,"path":222,"stem":223,"children":224,"page":6},"Tabs","\u002Fcomponents\u002Ftabs","2.components\u002F25.tabs",[225],{"title":221,"path":226,"stem":227},"\u002Fcomponents\u002Ftabs\u002Foverview","2.components\u002F25.tabs\u002F1.overview",{"title":229,"path":230,"stem":231,"children":232,"page":6},"Tag","\u002Fcomponents\u002Ftag","2.components\u002F26.tag",[233],{"title":229,"path":234,"stem":235},"\u002Fcomponents\u002Ftag\u002Foverview","2.components\u002F26.tag\u002F1.overview",{"title":237,"path":238,"stem":239},"Text","\u002Fcomponents\u002Ftext","2.components\u002F27.text",{"title":241,"path":242,"stem":243,"children":244,"page":6},"Textarea","\u002Fcomponents\u002Ftextarea","2.components\u002F28.textarea",[245],{"title":241,"path":246,"stem":247},"\u002Fcomponents\u002Ftextarea\u002Foverview","2.components\u002F28.textarea\u002F1.overview",{"title":249,"path":250,"stem":251,"children":252,"page":6},"Tooltip","\u002Fcomponents\u002Ftooltip","2.components\u002F29.tooltip",[253],{"title":249,"path":254,"stem":255},"\u002Fcomponents\u002Ftooltip\u002Foverview","2.components\u002F29.tooltip\u002F1.overview",{"title":257,"icon":6,"path":258,"stem":259,"children":260,"page":6},"Foundations","\u002Ffoundations","2.foundations",[261,269,273,277],{"title":262,"icon":6,"path":263,"stem":264,"children":265,"page":6},"Color","\u002Ffoundations\u002Fcolor","2.foundations\u002F1.color",[266],{"title":262,"path":267,"stem":268},"\u002Ffoundations\u002Fcolor\u002Foverview","2.foundations\u002F1.color\u002F1.overview",{"title":270,"path":271,"stem":272},"Icons","\u002Ffoundations\u002Ficons","2.foundations\u002F2.icons",{"title":274,"path":275,"stem":276},"Logos and Pins","\u002Ffoundations\u002Flogos-and-pins","2.foundations\u002F3.logos-and-pins",{"title":278,"path":279,"stem":280},"Web layers","\u002Ffoundations\u002Fweb-layers","2.foundations\u002F4.web-layers",{"title":282,"icon":6,"path":283,"stem":284,"children":285,"page":6},"WIP","\u002Fwip","3.wip",[286,290,294,298,302,306,310,314,318,322,326,330,334,338,342,346,350,354,358,362],{"title":287,"path":288,"stem":289},"Additional","\u002Fwip\u002Fadditional","3.wip\u002Fadditional",{"title":291,"path":292,"stem":293},"Alt text","\u002Fwip\u002Falt-text","3.wip\u002Falt-text",{"title":295,"path":296,"stem":297},"AnnouncementBar","\u002Fwip\u002Fannouncement-bar","3.wip\u002Fannouncement-bar",{"title":299,"path":300,"stem":301},"Avatar","\u002Fwip\u002Favatar","3.wip\u002Favatar",{"title":303,"path":304,"stem":305},"Banner","\u002Fwip\u002Fbanner","3.wip\u002Fbanner",{"title":307,"path":308,"stem":309},"Breadcrumbs","\u002Fwip\u002Fbreadcrumbs","3.wip\u002Fbreadcrumbs",{"title":311,"path":312,"stem":313},"Divider & scroll","\u002Fwip\u002Fdivider-scroll","3.wip\u002Fdivider-scroll",{"title":315,"path":316,"stem":317},"FieldMessage","\u002Fwip\u002Ffield-message","3.wip\u002Ffield-message",{"title":319,"path":320,"stem":321},"Focus Ring","\u002Fwip\u002Ffocus-ring","3.wip\u002Ffocus-ring",{"title":323,"path":324,"stem":325},"InlineSeparator","\u002Fwip\u002Finline-separator","3.wip\u002Finline-separator",{"title":327,"path":328,"stem":329},"Modal & drawer","\u002Fwip\u002Fmodal-drawer","3.wip\u002Fmodal-drawer",{"title":331,"path":332,"stem":333},"Optional","\u002Fwip\u002Foptional","3.wip\u002Foptional",{"title":335,"path":336,"stem":337},"Pagination","\u002Fwip\u002Fpagination","3.wip\u002Fpagination",{"title":339,"path":340,"stem":341},"PasswordInput","\u002Fwip\u002Fpassword-input","3.wip\u002Fpassword-input",{"title":343,"path":344,"stem":345},"Pinned bar page","\u002Fwip\u002Fpinned-bar-page","3.wip\u002Fpinned-bar-page",{"title":347,"path":348,"stem":349},"PromotionalBar","\u002Fwip\u002Fpromotional-bar","3.wip\u002Fpromotional-bar",{"title":351,"path":352,"stem":353},"SearchInput","\u002Fwip\u002Fsearch-input","3.wip\u002Fsearch-input",{"title":355,"path":356,"stem":357},"StatusLine","\u002Fwip\u002Fstatus-line","3.wip\u002Fstatus-line",{"title":359,"path":360,"stem":361},"Stepper & loaderBar","\u002Fwip\u002Fstepper-loader-bar","3.wip\u002Fstepper-loader-bar",{"title":363,"path":364,"stem":365},"TextInput","\u002Fwip\u002Ftext-input","3.wip\u002Ftext-input",{"title":367,"icon":6,"path":368,"stem":369,"children":370,"page":6},"Overview","\u002Foverview","4.overview",[371],{"title":372,"path":373,"stem":374},"For developers","\u002Foverview\u002Ffor-developers","4.overview\u002F1.for-developers",{"title":376,"icon":6,"path":377,"stem":378,"children":379,"page":6},"Brand","\u002Fbrand","5.brand",[380,389],{"title":381,"icon":6,"path":382,"stem":383,"children":384,"page":6},"Brand guidelines","\u002Fbrand\u002Fbrand-guidelines","5.brand\u002F1.brand-guidelines",[385],{"title":386,"path":387,"stem":388},"Dr. Max Trademarks Guidelines","\u002Fbrand\u002Fbrand-guidelines\u002Fdr-max-trademarks-guidelines","5.brand\u002F1.brand-guidelines\u002F2.dr-max-trademarks-guidelines",{"title":390,"icon":6,"path":391,"stem":392,"children":393,"page":6},"Assets","\u002Fbrand\u002Fassets","5.brand\u002F2.assets",[394,398],{"title":395,"path":396,"stem":397},"Logos","\u002Fbrand\u002Fassets\u002Flogos","5.brand\u002F2.assets\u002F2.logos",{"title":399,"path":400,"stem":401},"Dr. Max Tagline","\u002Fbrand\u002Fassets\u002Fdr-max-tagline","5.brand\u002F2.assets\u002F3.dr-max-tagline",{"title":403,"icon":6,"path":404,"stem":405,"children":406,"page":6},"Content","\u002Fcontent","6.content",[407,411],{"title":408,"path":409,"stem":410},"Content accessibility","\u002Fcontent\u002Fcontent-accessibility","6.content\u002F1.content-accessibility",{"title":412,"icon":6,"path":413,"stem":414,"children":415,"page":6},"Content guidance","\u002Fcontent\u002Fcontent-guidelines","6.content\u002F2.content-guidelines",[416,420],{"title":417,"path":418,"stem":419},"Category color-coding","\u002Fcontent\u002Fcontent-guidelines\u002Fcategory-color-coding","6.content\u002F2.content-guidelines\u002F2.category-color-coding",{"title":421,"path":422,"stem":423},"Pop-up banners","\u002Fcontent\u002Fcontent-guidelines\u002Fpop-up-banners","6.content\u002F2.content-guidelines\u002F3.pop-up-banners",{"title":425,"icon":6,"path":426,"stem":427,"children":428,"page":6},"Accessibility","\u002Faccessibility","7.accessibility",[429],{"title":430,"path":431,"stem":432,"children":433,"icon":6},"Accessibility guidance","\u002Faccessibility\u002Faccessibility-guidance","7.accessibility\u002F1.accessibility-guidance\u002F1.index",[434,435],{"title":425,"path":431,"stem":432},{"title":436,"path":437,"stem":438},"Understanding WCAG 2.2","\u002Faccessibility\u002Faccessibility-guidance\u002Funderstanding-wcag-2-2","7.accessibility\u002F1.accessibility-guidance\u002F2.understanding-wcag-2-2",{"id":440,"title":11,"body":441,"description":1064,"extension":1065,"links":1066,"meta":1067,"navigation":1068,"path":12,"seo":1069,"stem":13,"__hash__":1070},"docs\u002F1.getting-started\u002F2.installation.md",{"type":442,"value":443,"toc":1056},"minimark",[444,449,475,496,500,517,535,538,675,691,695,698,725,732,736,739,934,938,941,971,975,978,1025,1043,1052],[445,446,448],"h2",{"id":447},"install-the-package","Install the package",[450,451,456],"pre",{"className":452,"code":453,"language":454,"meta":455,"style":455},"language-bash shiki shiki-themes material-theme-palenight","pnpm add @dr-max\u002Fui\n","bash","",[457,458,459],"code",{"__ignoreMap":455},[460,461,464,468,472],"span",{"class":462,"line":463},"line",1,[460,465,467],{"class":466},"s5Dmg","pnpm",[460,469,471],{"class":470},"sfyAc"," add",[460,473,474],{"class":470}," @dr-max\u002Fui\n",[476,477,478],"note",{},[479,480,481,482,485,486,489,490,495],"p",{},"The package is published to the Dr.Max Azure Artifacts feed — make sure your project's ",[457,483,484],{},".npmrc"," points the ",[457,487,488],{},"@drmax"," scope at the feed and you are ",[491,492,494],"a",{"href":493},"#authenticate-to-azure-artifacts","authenticated",".",[445,497,499],{"id":498},"authenticate-to-azure-artifacts","Authenticate to Azure Artifacts",[479,501,502,503,506,507,513,514,516],{},"Dependencies prefixed with ",[457,504,505],{},"@drmax\u002F"," resolve through the ",[491,508,512],{"href":509,"rel":510},"https:\u002F\u002Fdev.azure.com\u002Fdrmaxglobal\u002Fplatform-team\u002F_artifacts\u002Ffeed\u002Fdrmax-platform",[511],"nofollow","Azure Artifacts"," feed — your project's ",[457,515,484],{}," should point the scope at it:",[450,518,522],{"className":519,"code":520,"filename":484,"language":521,"meta":455,"style":455},"language-ini shiki shiki-themes material-theme-palenight","@drmax:registry=https:\u002F\u002Fpkgs.dev.azure.com\u002Fdrmaxglobal\u002Fplatform-team\u002F_packaging\u002Fdrmax-platform\u002Fnpm\u002Fregistry\u002F\nalways-auth=true\n","ini",[457,523,524,529],{"__ignoreMap":455},[460,525,526],{"class":462,"line":463},[460,527,528],{},"@drmax:registry=https:\u002F\u002Fpkgs.dev.azure.com\u002Fdrmaxglobal\u002Fplatform-team\u002F_packaging\u002Fdrmax-platform\u002Fnpm\u002Fregistry\u002F\n",[460,530,532],{"class":462,"line":531},2,[460,533,534],{},"always-auth=true\n",[479,536,537],{},"Then set up authorization once per machine:",[539,540,541,587],"tabs",{},[542,543,545,559,562,575],"tabs-item",{"label":544},"macOS",[479,546,547,548,553,554,558],{},"Generate a ",[491,549,552],{"href":550,"rel":551},"https:\u002F\u002Fdev.azure.com\u002Fdrmaxglobal\u002F_usersSettings\u002Ftokens",[511],"Personal Access Token"," with ",[555,556,557],"strong",{},"Packaging read & write"," scopes.",[560,561],"npmrc-auth-generator",{},[479,563,564,565,568,569,571,572,574],{},"Copy the snippet into your ",[555,566,567],{},"user-level"," ",[457,570,484],{}," file (in your home directory). Avoid modifying the ",[457,573,484],{}," file in the project! Then install dependencies:",[450,576,578],{"className":452,"code":577,"language":454,"meta":455,"style":455},"pnpm i\n",[457,579,580],{"__ignoreMap":455},[460,581,582,584],{"class":462,"line":463},[460,583,467],{"class":466},[460,585,586],{"class":470}," i\n",[542,588,590,599,618,633,655,662,672],{"label":589},"Windows",[479,591,592,593,598],{},"Install ",[491,594,597],{"href":595,"rel":596},"https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fvsts-npm-auth",[511],"vsts-npm-auth"," globally if you don't have it:",[450,600,602],{"className":452,"code":601,"language":454,"meta":455,"style":455},"npm install -g vsts-npm-auth\n",[457,603,604],{"__ignoreMap":455},[460,605,606,609,612,615],{"class":462,"line":463},[460,607,608],{"class":466},"npm",[460,610,611],{"class":470}," install",[460,613,614],{"class":470}," -g",[460,616,617],{"class":470}," vsts-npm-auth\n",[479,619,620,621,568,623,625,626,629,630,632],{},"Run it to get an Azure Artifacts token added to your ",[555,622,567],{},[457,624,484],{}," file (in the ",[457,627,628],{},"C:\\Users\\\u003Cuser>\\"," directory). Avoid modifying the ",[457,631,484],{}," file in the project!",[450,634,636],{"className":452,"code":635,"language":454,"meta":455,"style":455},"vsts-npm-auth -config path-to-your\\.npmrc\n",[457,637,638],{"__ignoreMap":455},[460,639,640,642,645,648,652],{"class":462,"line":463},[460,641,597],{"class":466},[460,643,644],{"class":470}," -config",[460,646,647],{"class":470}," path-to-your",[460,649,651],{"class":650},"s0W1g","\\.",[460,653,654],{"class":470},"npmrc\n",[479,656,657,658,661],{},"You don't need to do this every time — pnpm fails with ",[457,659,660],{},"401 Unauthorized"," when you need to run it again. Then install dependencies:",[450,663,664],{"className":452,"code":577,"language":454,"meta":455,"style":455},[457,665,666],{"__ignoreMap":455},[460,667,668,670],{"class":462,"line":463},[460,669,467],{"class":466},[460,671,586],{"class":470},[479,673,674],{},"Having issues? The manual approach on the macOS tab works on Windows too.",[476,676,677],{},[479,678,679,680,685,686,495],{},"The whole process is described in more detail in the official ",[491,681,684],{"href":682,"rel":683},"https:\u002F\u002Flearn.microsoft.com\u002Fen-us\u002Fazure\u002Fdevops\u002Fartifacts\u002Fnpm\u002Fnpmrc",[511],"Azure DevOps documentation"," and on the ",[491,687,690],{"href":688,"rel":689},"https:\u002F\u002Fdev.azure.com\u002Fdrmaxglobal\u002Fplatform-team\u002F_artifacts\u002Ffeed\u002Fdrmax-platform\u002Fconnect\u002Fnpm",[511],"feed's connect page",[445,692,694],{"id":693},"import-design-tokens","Import design tokens",[479,696,697],{},"Import the design tokens once in your app shell:",[450,699,704],{"className":700,"code":701,"filename":702,"language":703,"meta":455,"style":455},"language-css shiki shiki-themes material-theme-palenight","@import \"@dr-max\u002Fui\u002Ftheme.css\";\n","main.css","css",[457,705,706],{"__ignoreMap":455},[460,707,708,712,716,719,722],{"class":462,"line":463},[460,709,711],{"class":710},"s6cf3","@import",[460,713,715],{"class":714},"sAklC"," \"",[460,717,718],{"class":470},"@dr-max\u002Fui\u002Ftheme.css",[460,720,721],{"class":714},"\"",[460,723,724],{"class":714},";\n",[479,726,727,728,731],{},"Components assume a standard ",[457,729,730],{},"box-sizing: border-box"," reset, which any preflight\u002Fnormalize provides.",[445,733,735],{"id":734},"use-components","Use components",[479,737,738],{},"Import components from their subpaths — each entry carries its own precompiled CSS, so there is nothing else to set up:",[450,740,745],{"className":741,"code":742,"filename":743,"language":744,"meta":455,"style":455},"language-vue shiki shiki-themes material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { Button } from \"@dr-max\u002Fui\u002Fbutton\";\nimport { Heading } from \"@dr-max\u002Fui\u002Fheading\";\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CHeading as=\"h1\" variant=\"display-lg\">Vitamins\u003C\u002FHeading>\n  \u003CButton variant=\"primary-green\">Add to cart\u003C\u002FButton>\n\u003C\u002Ftemplate>\n","App.vue","vue",[457,746,747,776,802,825,835,842,852,896,925],{"__ignoreMap":455},[460,748,749,752,756,760,763,766,768,771,773],{"class":462,"line":463},[460,750,751],{"class":714},"\u003C",[460,753,755],{"class":754},"s-wAU","script",[460,757,759],{"class":758},"sJ14y"," setup",[460,761,762],{"class":758}," lang",[460,764,765],{"class":714},"=",[460,767,721],{"class":714},[460,769,770],{"class":470},"ts",[460,772,721],{"class":714},[460,774,775],{"class":714},">\n",[460,777,778,781,784,787,790,793,795,798,800],{"class":462,"line":531},[460,779,780],{"class":710},"import",[460,782,783],{"class":714}," {",[460,785,786],{"class":650}," Button",[460,788,789],{"class":714}," }",[460,791,792],{"class":710}," from",[460,794,715],{"class":714},[460,796,797],{"class":470},"@dr-max\u002Fui\u002Fbutton",[460,799,721],{"class":714},[460,801,724],{"class":714},[460,803,805,807,809,812,814,816,818,821,823],{"class":462,"line":804},3,[460,806,780],{"class":710},[460,808,783],{"class":714},[460,810,811],{"class":650}," Heading",[460,813,789],{"class":714},[460,815,792],{"class":710},[460,817,715],{"class":714},[460,819,820],{"class":470},"@dr-max\u002Fui\u002Fheading",[460,822,721],{"class":714},[460,824,724],{"class":714},[460,826,828,831,833],{"class":462,"line":827},4,[460,829,830],{"class":714},"\u003C\u002F",[460,832,755],{"class":754},[460,834,775],{"class":714},[460,836,838],{"class":462,"line":837},5,[460,839,841],{"emptyLinePlaceholder":840},true,"\n",[460,843,845,847,850],{"class":462,"line":844},6,[460,846,751],{"class":714},[460,848,849],{"class":754},"template",[460,851,775],{"class":714},[460,853,855,858,860,863,865,867,870,872,875,877,879,882,884,887,890,892,894],{"class":462,"line":854},7,[460,856,857],{"class":714},"  \u003C",[460,859,101],{"class":754},[460,861,862],{"class":758}," as",[460,864,765],{"class":714},[460,866,721],{"class":714},[460,868,869],{"class":470},"h1",[460,871,721],{"class":714},[460,873,874],{"class":758}," variant",[460,876,765],{"class":714},[460,878,721],{"class":714},[460,880,881],{"class":470},"display-lg",[460,883,721],{"class":714},[460,885,886],{"class":714},">",[460,888,889],{"class":650},"Vitamins",[460,891,830],{"class":714},[460,893,101],{"class":754},[460,895,775],{"class":714},[460,897,899,901,903,905,907,909,912,914,916,919,921,923],{"class":462,"line":898},8,[460,900,857],{"class":714},[460,902,52],{"class":754},[460,904,874],{"class":758},[460,906,765],{"class":714},[460,908,721],{"class":714},[460,910,911],{"class":470},"primary-green",[460,913,721],{"class":714},[460,915,886],{"class":714},[460,917,918],{"class":650},"Add to cart",[460,920,830],{"class":714},[460,922,52],{"class":754},[460,924,775],{"class":714},[460,926,928,930,932],{"class":462,"line":927},9,[460,929,830],{"class":714},[460,931,849],{"class":754},[460,933,775],{"class":714},[445,935,937],{"id":936},"apps-with-tailwind-css-4","Apps with Tailwind CSS 4",[479,939,940],{},"Keep your app's Tailwind imports and add the theme — do not scan the package source and do not import component styles manually:",[450,942,944],{"className":700,"code":943,"filename":702,"language":703,"meta":455,"style":455},"@import \"tailwindcss\";\n@import \"@dr-max\u002Fui\u002Ftheme.css\";\n",[457,945,946,959],{"__ignoreMap":455},[460,947,948,950,952,955,957],{"class":462,"line":463},[460,949,711],{"class":710},[460,951,715],{"class":714},[460,953,954],{"class":470},"tailwindcss",[460,956,721],{"class":714},[460,958,724],{"class":714},[460,960,961,963,965,967,969],{"class":462,"line":531},[460,962,711],{"class":710},[460,964,715],{"class":714},[460,966,718],{"class":470},[460,968,721],{"class":714},[460,970,724],{"class":714},[445,972,974],{"id":973},"aggregate-fallback","Aggregate fallback",[479,976,977],{},"Prefer the component subpaths above. For apps that want one global bundle instead, the root entry and aggregate stylesheet remain available:",[450,979,982],{"className":980,"code":981,"language":770,"meta":455,"style":455},"language-ts shiki shiki-themes material-theme-palenight","import { Button, Heading, Icon, Spinner, Text } from \"@dr-max\u002Fui\";\n",[457,983,984],{"__ignoreMap":455},[460,985,986,988,990,992,995,997,999,1002,1004,1007,1009,1012,1014,1016,1018,1021,1023],{"class":462,"line":463},[460,987,780],{"class":710},[460,989,783],{"class":714},[460,991,786],{"class":650},[460,993,994],{"class":714},",",[460,996,811],{"class":650},[460,998,994],{"class":714},[460,1000,1001],{"class":650}," Icon",[460,1003,994],{"class":714},[460,1005,1006],{"class":650}," Spinner",[460,1008,994],{"class":714},[460,1010,1011],{"class":650}," Text",[460,1013,789],{"class":714},[460,1015,792],{"class":710},[460,1017,715],{"class":714},[460,1019,1020],{"class":470},"@dr-max\u002Fui",[460,1022,721],{"class":714},[460,1024,724],{"class":714},[450,1026,1028],{"className":700,"code":1027,"language":703,"meta":455,"style":455},"@import \"@dr-max\u002Fui\u002Fstyle.css\";\n",[457,1029,1030],{"__ignoreMap":455},[460,1031,1032,1034,1036,1039,1041],{"class":462,"line":463},[460,1033,711],{"class":710},[460,1035,715],{"class":714},[460,1037,1038],{"class":470},"@dr-max\u002Fui\u002Fstyle.css",[460,1040,721],{"class":714},[460,1042,724],{"class":714},[1044,1045,1046],"warning",{},[479,1047,1048,1049,1051],{},"Don't combine ",[457,1050,1038],{}," with component subpath imports — the component CSS would load twice.",[1053,1054,1055],"style",{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .s5Dmg, html code.shiki .s5Dmg{--shiki-default:#FFCB6B}html pre.shiki code .sfyAc, html code.shiki .sfyAc{--shiki-default:#C3E88D}html pre.shiki code .s0W1g, html code.shiki .s0W1g{--shiki-default:#BABED8}html pre.shiki code .s6cf3, html code.shiki .s6cf3{--shiki-default:#89DDFF;--shiki-default-font-style:italic}html pre.shiki code .sAklC, html code.shiki .sAklC{--shiki-default:#89DDFF}html pre.shiki code .s-wAU, html code.shiki .s-wAU{--shiki-default:#F07178}html pre.shiki code .sJ14y, html code.shiki .sJ14y{--shiki-default:#C792EA}",{"title":455,"searchDepth":463,"depth":531,"links":1057},[1058,1059,1060,1061,1062,1063],{"id":447,"depth":531,"text":448},{"id":498,"depth":531,"text":499},{"id":693,"depth":531,"text":694},{"id":734,"depth":531,"text":735},{"id":936,"depth":531,"text":937},{"id":973,"depth":531,"text":974},"Install @dr-max\u002Fui and load the design tokens.","md",null,{},{"icon":14},{"title":11,"description":1064},"6I0cWixd8ybMx2lOzE3za09xD3JJJ_fhLCbuiydo81c",1793289677449]