[{"data":1,"prerenderedAt":1301},["ShallowReactive",2],{"navigation_docs":3,"-utilities-composables-use-theme":353,"-utilities-composables-use-theme-surround":843,"component-example-themeSelectUseThemeExample":848,"component-example-ast-themeSelectUseThemeExample":851},[4,114,302],{"title":5,"path":6,"stem":7,"children":8,"page":34},"Documentation","\u002Fdocumentation","1.documentation",[9,35,56,93],{"title":10,"path":11,"stem":12,"children":13,"page":34},"Getting Started","\u002Fdocumentation\u002Fgetting-started","1.documentation\u002F1.getting-started",[14,18,22,26,30],{"title":15,"path":16,"stem":17},"Installation","\u002Fdocumentation\u002Fgetting-started\u002Finstallation","1.documentation\u002F1.getting-started\u002F1.installation",{"title":19,"path":20,"stem":21},"Agents","\u002Fdocumentation\u002Fgetting-started\u002Fagents","1.documentation\u002F1.getting-started\u002F2.agents",{"title":23,"path":24,"stem":25},"Migration","\u002Fdocumentation\u002Fgetting-started\u002Fmigration","1.documentation\u002F1.getting-started\u002F3.migration",{"title":27,"path":28,"stem":29},"Contributing","\u002Fdocumentation\u002Fgetting-started\u002Fcontributing","1.documentation\u002F1.getting-started\u002F4.contributing",{"title":31,"path":32,"stem":33},"What's new","\u002Fdocumentation\u002Fgetting-started\u002Fwhats-new","1.documentation\u002F1.getting-started\u002F5.whats-new",false,{"title":36,"path":37,"stem":38,"children":39,"page":34},"Guidelines","\u002Fdocumentation\u002Fguidelines","1.documentation\u002F2.guidelines",[40,44,48,52],{"title":41,"path":42,"stem":43},"Design Principles","\u002Fdocumentation\u002Fguidelines\u002Fdesign-principles","1.documentation\u002F2.guidelines\u002F1.design-principles",{"title":45,"path":46,"stem":47},"Accessibility","\u002Fdocumentation\u002Fguidelines\u002Faccessibility","1.documentation\u002F2.guidelines\u002F2.accessibility",{"title":49,"path":50,"stem":51},"Interactions","\u002Fdocumentation\u002Fguidelines\u002Finteractions","1.documentation\u002F2.guidelines\u002F3.interactions",{"title":53,"path":54,"stem":55},"Components","\u002Fdocumentation\u002Fguidelines\u002Fcomponents","1.documentation\u002F2.guidelines\u002F4.components",{"title":57,"path":58,"stem":59,"children":60,"page":34},"Design","\u002Fdocumentation\u002Fdesign","1.documentation\u002F3.design",[61,65,69,73,77,81,85,89],{"title":62,"path":63,"stem":64},"Tokens","\u002Fdocumentation\u002Fdesign\u002Ftokens","1.documentation\u002F3.design\u002F1.tokens",{"title":66,"path":67,"stem":68},"Color Palette","\u002Fdocumentation\u002Fdesign\u002Fcolor-palette","1.documentation\u002F3.design\u002F2.color-palette",{"title":70,"path":71,"stem":72},"Elevation","\u002Fdocumentation\u002Fdesign\u002Felevation","1.documentation\u002F3.design\u002F3.elevation",{"title":74,"path":75,"stem":76},"Spacing","\u002Fdocumentation\u002Fdesign\u002Fspacing","1.documentation\u002F3.design\u002F4.spacing",{"title":78,"path":79,"stem":80},"Border Radius","\u002Fdocumentation\u002Fdesign\u002Fborder-radius","1.documentation\u002F3.design\u002F5.border-radius",{"title":82,"path":83,"stem":84},"Typography","\u002Fdocumentation\u002Fdesign\u002Ftypography","1.documentation\u002F3.design\u002F6.typography",{"title":86,"path":87,"stem":88},"Icons","\u002Fdocumentation\u002Fdesign\u002Ficons","1.documentation\u002F3.design\u002F7.icons",{"title":90,"path":91,"stem":92},"Motion","\u002Fdocumentation\u002Fdesign\u002Fmotion","1.documentation\u002F3.design\u002F8.motion",{"title":94,"path":95,"stem":96,"children":97,"page":34},"Content","\u002Fdocumentation\u002Fcontent","1.documentation\u002F4.content",[98,102,106,110],{"title":99,"path":100,"stem":101},"Wording","\u002Fdocumentation\u002Fcontent\u002Fwording","1.documentation\u002F4.content\u002F1.wording",{"title":103,"path":104,"stem":105},"Messaging","\u002Fdocumentation\u002Fcontent\u002Fmessaging","1.documentation\u002F4.content\u002F2.messaging",{"title":107,"path":108,"stem":109},"Glossary","\u002Fdocumentation\u002Fcontent\u002Fglossary","1.documentation\u002F4.content\u002F3.glossary",{"title":111,"path":112,"stem":113},"Artificial Intelligence","\u002Fdocumentation\u002Fcontent\u002Fartificial-intelligence","1.documentation\u002F4.content\u002F4.artificial-intelligence",{"title":53,"path":115,"stem":116,"children":117,"page":34},"\u002Fcomponents","2.components",[118,122,126,130,134,138,142,146,150,154,158,162,166,170,174,178,182,186,190,194,198,202,206,210,214,218,222,226,230,234,238,242,246,250,254,258,262,266,270,274,278,282,286,290,294,298],{"title":119,"path":120,"stem":121},"Action Menu","\u002Fcomponents\u002Faction-menu","2.components\u002Faction-menu",{"title":123,"path":124,"stem":125},"Avatar","\u002Fcomponents\u002Favatar","2.components\u002Favatar",{"title":127,"path":128,"stem":129},"Badge","\u002Fcomponents\u002Fbadge","2.components\u002Fbadge",{"title":131,"path":132,"stem":133},"Banner","\u002Fcomponents\u002Fbanner","2.components\u002Fbanner",{"title":135,"path":136,"stem":137},"Button","\u002Fcomponents\u002Fbutton","2.components\u002Fbutton",{"title":139,"path":140,"stem":141},"Card","\u002Fcomponents\u002Fcard","2.components\u002Fcard",{"title":143,"path":144,"stem":145},"Chart","\u002Fcomponents\u002Fchart","2.components\u002Fchart",{"title":147,"path":148,"stem":149},"Checkbox","\u002Fcomponents\u002Fcheckbox","2.components\u002Fcheckbox",{"title":151,"path":152,"stem":153},"Collapsible","\u002Fcomponents\u002Fcollapsible","2.components\u002Fcollapsible",{"title":155,"path":156,"stem":157},"Colorpicker","\u002Fcomponents\u002Fcolorpicker","2.components\u002Fcolorpicker",{"title":159,"path":160,"stem":161},"Data Table","\u002Fcomponents\u002Fdata-table","2.components\u002Fdata-table",{"title":163,"path":164,"stem":165},"Datepicker","\u002Fcomponents\u002Fdatepicker","2.components\u002Fdatepicker",{"title":167,"path":168,"stem":169},"Email Field","\u002Fcomponents\u002Femail-field","2.components\u002Femail-field",{"title":171,"path":172,"stem":173},"Empty State","\u002Fcomponents\u002Fempty-state","2.components\u002Fempty-state",{"title":175,"path":176,"stem":177},"Entity Data Table","\u002Fcomponents\u002Fentity-data-table","2.components\u002Fentity-data-table",{"title":179,"path":180,"stem":181},"Entity Select","\u002Fcomponents\u002Fentity-select","2.components\u002Fentity-select",{"title":183,"path":184,"stem":185},"Floating UI","\u002Fcomponents\u002Ffloating-ui","2.components\u002Ffloating-ui",{"title":187,"path":188,"stem":189},"Help Text","\u002Fcomponents\u002Fhelp-text","2.components\u002Fhelp-text",{"title":191,"path":192,"stem":193},"Icon","\u002Fcomponents\u002Ficon","2.components\u002Ficon",{"title":195,"path":196,"stem":197},"Link","\u002Fcomponents\u002Flink","2.components\u002Flink",{"title":199,"path":200,"stem":201},"Loader","\u002Fcomponents\u002Floader","2.components\u002Floader",{"title":203,"path":204,"stem":205},"Modal","\u002Fcomponents\u002Fmodal","2.components\u002Fmodal",{"title":207,"path":208,"stem":209},"Number Field","\u002Fcomponents\u002Fnumber-field","2.components\u002Fnumber-field",{"title":211,"path":212,"stem":213},"Pagination","\u002Fcomponents\u002Fpagination","2.components\u002Fpagination",{"title":215,"path":216,"stem":217},"Password Field","\u002Fcomponents\u002Fpassword-field","2.components\u002Fpassword-field",{"title":219,"path":220,"stem":221},"Popover","\u002Fcomponents\u002Fpopover","2.components\u002Fpopover",{"title":223,"path":224,"stem":225},"Progress Bar","\u002Fcomponents\u002Fprogress-bar","2.components\u002Fprogress-bar",{"title":227,"path":228,"stem":229},"Promo Badge","\u002Fcomponents\u002Fpromo-badge","2.components\u002Fpromo-badge",{"title":231,"path":232,"stem":233},"Radio Group","\u002Fcomponents\u002Fradio-group","2.components\u002Fradio-group",{"title":235,"path":236,"stem":237},"Search","\u002Fcomponents\u002Fsearch","2.components\u002Fsearch",{"title":239,"path":240,"stem":241},"Select","\u002Fcomponents\u002Fselect","2.components\u002Fselect",{"title":243,"path":244,"stem":245},"Skeleton Bar","\u002Fcomponents\u002Fskeleton-bar","2.components\u002Fskeleton-bar",{"title":247,"path":248,"stem":249},"Slider","\u002Fcomponents\u002Fslider","2.components\u002Fslider",{"title":251,"path":252,"stem":253},"Snackbar","\u002Fcomponents\u002Fsnackbar","2.components\u002Fsnackbar",{"title":255,"path":256,"stem":257},"Status Dot","\u002Fcomponents\u002Fstatus-dot","2.components\u002Fstatus-dot",{"title":259,"path":260,"stem":261},"Switch","\u002Fcomponents\u002Fswitch","2.components\u002Fswitch",{"title":263,"path":264,"stem":265},"Tabs","\u002Fcomponents\u002Ftabs","2.components\u002Ftabs",{"title":267,"path":268,"stem":269},"Text","\u002Fcomponents\u002Ftext","2.components\u002Ftext",{"title":271,"path":272,"stem":273},"Text Editor","\u002Fcomponents\u002Ftext-editor","2.components\u002Ftext-editor",{"title":275,"path":276,"stem":277},"Text Field","\u002Fcomponents\u002Ftext-field","2.components\u002Ftext-field",{"title":279,"path":280,"stem":281},"Textarea","\u002Fcomponents\u002Ftextarea","2.components\u002Ftextarea",{"title":283,"path":284,"stem":285},"Theme Select","\u002Fcomponents\u002Ftheme-select","2.components\u002Ftheme-select",{"title":287,"path":288,"stem":289},"Toast","\u002Fcomponents\u002Ftoast","2.components\u002Ftoast",{"title":291,"path":292,"stem":293},"Tooltip","\u002Fcomponents\u002Ftooltip","2.components\u002Ftooltip",{"title":295,"path":296,"stem":297},"Unit Field","\u002Fcomponents\u002Funit-field","2.components\u002Funit-field",{"title":299,"path":300,"stem":301},"URL Field","\u002Fcomponents\u002Furl-field","2.components\u002Furl-field",{"title":303,"path":304,"stem":305,"children":306,"page":34},"Utilities","\u002Futilities","3.utilities",[307,319,336,344],{"title":53,"path":308,"stem":309,"children":310,"page":34},"\u002Futilities\u002Fcomponents","3.utilities\u002Fcomponents",[311,315],{"title":312,"path":313,"stem":314},"Inset","\u002Futilities\u002Fcomponents\u002Finset","3.utilities\u002Fcomponents\u002Finset",{"title":316,"path":317,"stem":318},"Theme Provider","\u002Futilities\u002Fcomponents\u002Ftheme-provider","3.utilities\u002Fcomponents\u002Ftheme-provider",{"title":320,"path":321,"stem":322,"children":323,"page":34},"Composables","\u002Futilities\u002Fcomposables","3.utilities\u002Fcomposables",[324,328,332],{"title":325,"path":326,"stem":327},"useFutureFlags","\u002Futilities\u002Fcomposables\u002Fuse-future-flags","3.utilities\u002Fcomposables\u002Fuse-future-flags",{"title":329,"path":330,"stem":331},"useSnackbar","\u002Futilities\u002Fcomposables\u002Fuse-snackbar","3.utilities\u002Fcomposables\u002Fuse-snackbar",{"title":333,"path":334,"stem":335},"useTheme","\u002Futilities\u002Fcomposables\u002Fuse-theme","3.utilities\u002Fcomposables\u002Fuse-theme",{"title":337,"path":338,"stem":339,"children":340,"page":34},"Directives","\u002Futilities\u002Fdirectives","3.utilities\u002Fdirectives",[341],{"title":291,"path":342,"stem":343},"\u002Futilities\u002Fdirectives\u002Ftooltip","3.utilities\u002Fdirectives\u002Ftooltip",{"title":345,"path":346,"stem":347,"children":348,"page":34},"Plugins","\u002Futilities\u002Fplugins","3.utilities\u002Fplugins",[349],{"title":350,"path":351,"stem":352},"Device helper","\u002Futilities\u002Fplugins\u002Fdevice-helper","3.utilities\u002Fplugins\u002Fdevice-helper",{"id":354,"title":333,"body":355,"description":837,"extension":838,"links":839,"meta":840,"navigation":454,"path":334,"seo":841,"stem":335,"__hash__":842},"docs\u002F3.utilities\u002Fcomposables\u002Fuse-theme.md",{"type":356,"value":357,"toc":827},"minimark",[358,363,368,417,496,503,507,512,518,627,631,729,733,783,787,810,814,823],[359,360],"component-example",{":full-width":361,"name":362},"true","theme-select-use-theme-example",[364,365,367],"h2",{"id":366},"usage","Usage",[369,370,371,374,375,378,379,382,383,386,387,389,390,393,394,397,398,401,402,405,406,412,413,416],"p",{},[372,373,333],"code",{}," manages the application color theme. It tracks the user's preference (",[372,376,377],{},"light",", ",[372,380,381],{},"dark",", or ",[372,384,385],{},"system","), resolves ",[372,388,385],{}," against the operating system via ",[372,391,392],{},"prefers-color-scheme",", writes the resolved value to a target element's ",[372,395,396],{},"data-theme"," attribute (the document root by default), and persists the choice to ",[372,399,400],{},"localStorage",". Bind the returned ",[372,403,404],{},"theme"," ref to ",[407,408,409],"a",{"href":284},[410,411,283],"strong",{}," with ",[372,414,415],{},"v-model"," to let users control it.",[418,419,424],"pre",{"className":420,"code":421,"language":422,"meta":423,"style":423},"language-ts shiki shiki-themes github-light github-dark-default github-dark-default","import { useTheme } from \"@shopware-ag\u002Fmeteor-component-library\";\n\nconst { theme, resolvedTheme, setTheme, stop } = useTheme();\n","ts","",[372,425,426,449,456],{"__ignoreMap":423},[427,428,431,435,439,442,446],"span",{"class":429,"line":430},"line",1,[427,432,434],{"class":433},"sLfaJ","import",[427,436,438],{"class":437},"sSgjj"," { useTheme } ",[427,440,441],{"class":433},"from",[427,443,445],{"class":444},"sL1yV"," \"@shopware-ag\u002Fmeteor-component-library\"",[427,447,448],{"class":437},";\n",[427,450,452],{"class":429,"line":451},2,[427,453,455],{"emptyLinePlaceholder":454},true,"\n",[427,457,459,462,465,468,470,473,475,478,480,483,486,489,493],{"class":429,"line":458},3,[427,460,461],{"class":433},"const",[427,463,464],{"class":437}," { ",[427,466,404],{"class":467},"sfxXV",[427,469,378],{"class":437},[427,471,472],{"class":467},"resolvedTheme",[427,474,378],{"class":437},[427,476,477],{"class":467},"setTheme",[427,479,378],{"class":437},[427,481,482],{"class":467},"stop",[427,484,485],{"class":437}," } ",[427,487,488],{"class":433},"=",[427,490,492],{"class":491},"s71ug"," useTheme",[427,494,495],{"class":437},"();\n",[369,497,498,499,502],{},"The preference is shared: instances using the same ",[372,500,501],{},"storageKey"," stay in sync within the document and across browser tabs.",[364,504,506],{"id":505},"api","API",[508,509,511],"h3",{"id":510},"options","Options",[369,513,514,517],{},[372,515,516],{},"useTheme(options?)"," accepts:",[519,520,521,537],"table",{},[522,523,524],"thead",{},[525,526,527,531,534],"tr",{},[528,529,530],"th",{},"Option",[528,532,533],{},"Type",[528,535,536],{},"Description",[538,539,540,566,588,606],"tbody",{},[525,541,542,547,552],{},[543,544,545],"td",{},[372,546,501],{},[543,548,549],{},[372,550,551],{},"string | null",[543,553,554,555,557,558,561,562,565],{},"The ",[372,556,400],{}," key used to persist the preference. Defaults to ",[372,559,560],{},"\"mt-theme\"",". Set it to ",[372,563,564],{},"null"," to disable persistence.",[525,567,568,573,578],{},[543,569,570],{},[372,571,572],{},"target",[543,574,575],{},[372,576,577],{},"HTMLElement",[543,579,580,581,583,584,587],{},"The element whose ",[372,582,396],{}," attribute is kept in sync with the resolved theme. Defaults to ",[372,585,586],{},"document.documentElement",".",[525,589,590,595,600],{},[543,591,592],{},[372,593,594],{},"defaultTheme",[543,596,597],{},[372,598,599],{},"\"light\" | \"dark\" | \"system\"",[543,601,602,603,587],{},"The preference used when nothing has been persisted yet. Defaults to ",[372,604,605],{},"\"system\"",[525,607,608,613,618],{},[543,609,610],{},[372,611,612],{},"applyToTarget",[543,614,615],{},[372,616,617],{},"boolean",[543,619,620,621,623,624,626],{},"Whether to write the resolved theme to the target's ",[372,622,396],{}," attribute. Defaults to ",[372,625,361],{},". Disable it when the host applies the theme itself.",[508,628,630],{"id":629},"return-value","Return value",[519,632,633,644],{},[522,634,635],{},[525,636,637,640,642],{},[528,638,639],{},"Member",[528,641,533],{},[528,643,536],{},[538,645,646,675,697,711],{},[525,647,648,652,657],{},[543,649,650],{},[372,651,404],{},[543,653,654],{},[372,655,656],{},"Ref\u003CTheme>",[543,658,659,660,378,663,382,666,668,669,412,673,587],{},"The user's preference: ",[372,661,662],{},"\"light\"",[372,664,665],{},"\"dark\"",[372,667,605],{},". Writable; bind it to ",[407,670,671],{"href":284},[410,672,283],{},[372,674,415],{},[525,676,677,681,686],{},[543,678,679],{},[372,680,472],{},[543,682,683],{},[372,684,685],{},"ComputedRef\u003CResolvedTheme>",[543,687,688,689,691,692,694,695,587],{},"The applied theme after resolving ",[372,690,605],{},": ",[372,693,662],{}," or ",[372,696,665],{},[525,698,699,703,708],{},[543,700,701],{},[372,702,477],{},[543,704,705],{},[372,706,707],{},"(theme: Theme) => void",[543,709,710],{},"Sets the preference programmatically.",[525,712,713,717,722],{},[543,714,715],{},[372,716,482],{},[543,718,719],{},[372,720,721],{},"() => void",[543,723,724,725,728],{},"Releases all listeners. Called automatically on scope disposal when used inside a component or ",[372,726,727],{},"effectScope","; call it manually when using the composable outside of an active scope.",[508,730,732],{"id":731},"types","Types",[418,734,736],{"className":420,"code":735,"language":422,"meta":423,"style":423},"type Theme = \"light\" | \"dark\" | \"system\";\ntype ResolvedTheme = \"light\" | \"dark\";\n",[372,737,738,766],{"__ignoreMap":423},[427,739,740,743,747,750,753,756,759,761,764],{"class":429,"line":430},[427,741,742],{"class":433},"type",[427,744,746],{"class":745},"s0wlp"," Theme",[427,748,749],{"class":433}," =",[427,751,752],{"class":444}," \"light\"",[427,754,755],{"class":433}," |",[427,757,758],{"class":444}," \"dark\"",[427,760,755],{"class":433},[427,762,763],{"class":444}," \"system\"",[427,765,448],{"class":437},[427,767,768,770,773,775,777,779,781],{"class":429,"line":451},[427,769,742],{"class":433},[427,771,772],{"class":745}," ResolvedTheme",[427,774,749],{"class":433},[427,776,752],{"class":444},[427,778,755],{"class":433},[427,780,758],{"class":444},[427,782,448],{"class":437},[364,784,786],{"id":785},"behavior","Behavior",[788,789,790,799,804],"ul",{},[791,792,793,794,378,796,798],"li",{},"While the preference is ",[372,795,385],{},[372,797,472],{}," updates live when the operating system preference changes.",[791,800,801,802,587],{},"Invalid persisted values are ignored and fall back to ",[372,803,594],{},[791,805,806,807,809],{},"Meteor tokens are theme-aware through ",[372,808,396],{},", so applying the resolved theme to the document root themes every Meteor component on the page.",[364,811,813],{"id":812},"related-components","Related components",[788,815,816],{},[791,817,818,822],{},[407,819,820],{"href":284},[410,821,283],{},": the select component built for choosing the theme this composable manages.",[824,825,826],"style",{},"html pre.shiki code .sLfaJ, html code.shiki .sLfaJ{--shiki-light:#D73A49;--shiki-default:#FF7B72;--shiki-dark:#FF7B72}html pre.shiki code .sSgjj, html code.shiki .sSgjj{--shiki-light:#24292E;--shiki-default:#E6EDF3;--shiki-dark:#E6EDF3}html pre.shiki code .sL1yV, html code.shiki .sL1yV{--shiki-light:#032F62;--shiki-default:#A5D6FF;--shiki-dark:#A5D6FF}html pre.shiki code .sfxXV, html code.shiki .sfxXV{--shiki-light:#005CC5;--shiki-default:#79C0FF;--shiki-dark:#79C0FF}html pre.shiki code .s71ug, html code.shiki .s71ug{--shiki-light:#6F42C1;--shiki-default:#D2A8FF;--shiki-dark:#D2A8FF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s0wlp, html code.shiki .s0wlp{--shiki-light:#6F42C1;--shiki-default:#FFA657;--shiki-dark:#FFA657}",{"title":423,"searchDepth":451,"depth":451,"links":828},[829,830,835,836],{"id":366,"depth":451,"text":367},{"id":505,"depth":451,"text":506,"children":831},[832,833,834],{"id":510,"depth":458,"text":511},{"id":629,"depth":458,"text":630},{"id":731,"depth":458,"text":732},{"id":785,"depth":451,"text":786},{"id":812,"depth":451,"text":813},"A composable for managing the application color theme, resolving the system preference, and persisting the choice.","md",null,{},{"title":333,"description":837},"dXbxJHPExu5eN0wT8Btj7N7WEXkrqIrUQ3ibRnRqd1c",[844,846],{"title":329,"path":330,"stem":331,"description":845,"children":-1},"A composable for publishing snackbar notifications from anywhere in your app.",{"title":291,"path":342,"stem":343,"description":847,"children":-1},"A v-tooltip directive for attaching a tooltip to any element, a lightweight alternative to the Tooltip component.",{"code":849,"pascalName":850},"\u003Cscript setup lang=\"ts\">\nimport MtThemeSelect from \"@shopware-ag\u002Fmeteor-component-library\u002FMtThemeSelect\";\nimport MtText from \"@shopware-ag\u002Fmeteor-component-library\u002FMtText\";\n\u002F\u002F useTheme has no subpath export, so it is imported from the barrel.\nimport { useTheme } from \"@shopware-ag\u002Fmeteor-component-library\";\n\n\u002F\u002F Persistence and global application are disabled so the docs page itself\n\u002F\u002F stays untouched. Omit these options in your app.\nconst { theme, resolvedTheme } = useTheme({\n  storageKey: null,\n  applyToTarget: false,\n});\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cdiv style=\"display: flex; flex-direction: column; gap: 16px\">\n    \u003Cmt-theme-select v-model=\"theme\" label=\"Color theme\" \u002F>\n\n    \u003Cmt-text>Resolved theme: {{ resolvedTheme }}\u003C\u002Fmt-text>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","ThemeSelectUseThemeExample",{"data":852,"body":853,"toc":1299},{"title":423,"description":423},{"type":854,"children":855},"root",[856,1294],{"type":857,"tag":418,"props":858,"children":861},"element",{"className":859,"code":849,"language":860,"meta":423,"style":423},"language-vue shiki shiki-themes github-light github-dark-default github-dark-default","vue",[862],{"type":857,"tag":372,"props":863,"children":864},{"__ignoreMap":423},[865,907,933,958,968,992,1000,1009,1018,1061,1079,1097,1106,1123,1131,1148,1180,1227,1235,1261,1278],{"type":857,"tag":427,"props":866,"children":867},{"class":429,"line":430},[868,875,881,887,892,896,902],{"type":857,"tag":427,"props":869,"children":871},{"style":870},"--shiki-light:#24292E;--shiki-default:#E6EDF3;--shiki-dark:#E6EDF3",[872],{"type":873,"value":874},"text","\u003C",{"type":857,"tag":427,"props":876,"children":878},{"style":877},"--shiki-light:#22863A;--shiki-default:#7EE787;--shiki-dark:#7EE787",[879],{"type":873,"value":880},"script",{"type":857,"tag":427,"props":882,"children":884},{"style":883},"--shiki-light:#6F42C1;--shiki-default:#79C0FF;--shiki-dark:#79C0FF",[885],{"type":873,"value":886}," setup",{"type":857,"tag":427,"props":888,"children":889},{"style":883},[890],{"type":873,"value":891}," lang",{"type":857,"tag":427,"props":893,"children":894},{"style":870},[895],{"type":873,"value":488},{"type":857,"tag":427,"props":897,"children":899},{"style":898},"--shiki-light:#032F62;--shiki-default:#A5D6FF;--shiki-dark:#A5D6FF",[900],{"type":873,"value":901},"\"ts\"",{"type":857,"tag":427,"props":903,"children":904},{"style":870},[905],{"type":873,"value":906},">\n",{"type":857,"tag":427,"props":908,"children":909},{"class":429,"line":451},[910,915,920,924,929],{"type":857,"tag":427,"props":911,"children":913},{"style":912},"--shiki-light:#D73A49;--shiki-default:#FF7B72;--shiki-dark:#FF7B72",[914],{"type":873,"value":434},{"type":857,"tag":427,"props":916,"children":917},{"style":870},[918],{"type":873,"value":919}," MtThemeSelect ",{"type":857,"tag":427,"props":921,"children":922},{"style":912},[923],{"type":873,"value":441},{"type":857,"tag":427,"props":925,"children":926},{"style":898},[927],{"type":873,"value":928}," \"@shopware-ag\u002Fmeteor-component-library\u002FMtThemeSelect\"",{"type":857,"tag":427,"props":930,"children":931},{"style":870},[932],{"type":873,"value":448},{"type":857,"tag":427,"props":934,"children":935},{"class":429,"line":458},[936,940,945,949,954],{"type":857,"tag":427,"props":937,"children":938},{"style":912},[939],{"type":873,"value":434},{"type":857,"tag":427,"props":941,"children":942},{"style":870},[943],{"type":873,"value":944}," MtText ",{"type":857,"tag":427,"props":946,"children":947},{"style":912},[948],{"type":873,"value":441},{"type":857,"tag":427,"props":950,"children":951},{"style":898},[952],{"type":873,"value":953}," \"@shopware-ag\u002Fmeteor-component-library\u002FMtText\"",{"type":857,"tag":427,"props":955,"children":956},{"style":870},[957],{"type":873,"value":448},{"type":857,"tag":427,"props":959,"children":961},{"class":429,"line":960},4,[962],{"type":857,"tag":427,"props":963,"children":965},{"style":964},"--shiki-light:#6A737D;--shiki-default:#8B949E;--shiki-dark:#8B949E",[966],{"type":873,"value":967},"\u002F\u002F useTheme has no subpath export, so it is imported from the barrel.\n",{"type":857,"tag":427,"props":969,"children":971},{"class":429,"line":970},5,[972,976,980,984,988],{"type":857,"tag":427,"props":973,"children":974},{"style":912},[975],{"type":873,"value":434},{"type":857,"tag":427,"props":977,"children":978},{"style":870},[979],{"type":873,"value":438},{"type":857,"tag":427,"props":981,"children":982},{"style":912},[983],{"type":873,"value":441},{"type":857,"tag":427,"props":985,"children":986},{"style":898},[987],{"type":873,"value":445},{"type":857,"tag":427,"props":989,"children":990},{"style":870},[991],{"type":873,"value":448},{"type":857,"tag":427,"props":993,"children":995},{"class":429,"line":994},6,[996],{"type":857,"tag":427,"props":997,"children":998},{"emptyLinePlaceholder":454},[999],{"type":873,"value":455},{"type":857,"tag":427,"props":1001,"children":1003},{"class":429,"line":1002},7,[1004],{"type":857,"tag":427,"props":1005,"children":1006},{"style":964},[1007],{"type":873,"value":1008},"\u002F\u002F Persistence and global application are disabled so the docs page itself\n",{"type":857,"tag":427,"props":1010,"children":1012},{"class":429,"line":1011},8,[1013],{"type":857,"tag":427,"props":1014,"children":1015},{"style":964},[1016],{"type":873,"value":1017},"\u002F\u002F stays untouched. Omit these options in your app.\n",{"type":857,"tag":427,"props":1019,"children":1021},{"class":429,"line":1020},9,[1022,1026,1030,1035,1039,1043,1047,1051,1056],{"type":857,"tag":427,"props":1023,"children":1024},{"style":912},[1025],{"type":873,"value":461},{"type":857,"tag":427,"props":1027,"children":1028},{"style":870},[1029],{"type":873,"value":464},{"type":857,"tag":427,"props":1031,"children":1033},{"style":1032},"--shiki-light:#005CC5;--shiki-default:#79C0FF;--shiki-dark:#79C0FF",[1034],{"type":873,"value":404},{"type":857,"tag":427,"props":1036,"children":1037},{"style":870},[1038],{"type":873,"value":378},{"type":857,"tag":427,"props":1040,"children":1041},{"style":1032},[1042],{"type":873,"value":472},{"type":857,"tag":427,"props":1044,"children":1045},{"style":870},[1046],{"type":873,"value":485},{"type":857,"tag":427,"props":1048,"children":1049},{"style":912},[1050],{"type":873,"value":488},{"type":857,"tag":427,"props":1052,"children":1054},{"style":1053},"--shiki-light:#6F42C1;--shiki-default:#D2A8FF;--shiki-dark:#D2A8FF",[1055],{"type":873,"value":492},{"type":857,"tag":427,"props":1057,"children":1058},{"style":870},[1059],{"type":873,"value":1060},"({\n",{"type":857,"tag":427,"props":1062,"children":1064},{"class":429,"line":1063},10,[1065,1070,1074],{"type":857,"tag":427,"props":1066,"children":1067},{"style":870},[1068],{"type":873,"value":1069},"  storageKey: ",{"type":857,"tag":427,"props":1071,"children":1072},{"style":1032},[1073],{"type":873,"value":564},{"type":857,"tag":427,"props":1075,"children":1076},{"style":870},[1077],{"type":873,"value":1078},",\n",{"type":857,"tag":427,"props":1080,"children":1082},{"class":429,"line":1081},11,[1083,1088,1093],{"type":857,"tag":427,"props":1084,"children":1085},{"style":870},[1086],{"type":873,"value":1087},"  applyToTarget: ",{"type":857,"tag":427,"props":1089,"children":1090},{"style":1032},[1091],{"type":873,"value":1092},"false",{"type":857,"tag":427,"props":1094,"children":1095},{"style":870},[1096],{"type":873,"value":1078},{"type":857,"tag":427,"props":1098,"children":1100},{"class":429,"line":1099},12,[1101],{"type":857,"tag":427,"props":1102,"children":1103},{"style":870},[1104],{"type":873,"value":1105},"});\n",{"type":857,"tag":427,"props":1107,"children":1109},{"class":429,"line":1108},13,[1110,1115,1119],{"type":857,"tag":427,"props":1111,"children":1112},{"style":870},[1113],{"type":873,"value":1114},"\u003C\u002F",{"type":857,"tag":427,"props":1116,"children":1117},{"style":877},[1118],{"type":873,"value":880},{"type":857,"tag":427,"props":1120,"children":1121},{"style":870},[1122],{"type":873,"value":906},{"type":857,"tag":427,"props":1124,"children":1126},{"class":429,"line":1125},14,[1127],{"type":857,"tag":427,"props":1128,"children":1129},{"emptyLinePlaceholder":454},[1130],{"type":873,"value":455},{"type":857,"tag":427,"props":1132,"children":1134},{"class":429,"line":1133},15,[1135,1139,1144],{"type":857,"tag":427,"props":1136,"children":1137},{"style":870},[1138],{"type":873,"value":874},{"type":857,"tag":427,"props":1140,"children":1141},{"style":877},[1142],{"type":873,"value":1143},"template",{"type":857,"tag":427,"props":1145,"children":1146},{"style":870},[1147],{"type":873,"value":906},{"type":857,"tag":427,"props":1149,"children":1151},{"class":429,"line":1150},16,[1152,1157,1162,1167,1171,1176],{"type":857,"tag":427,"props":1153,"children":1154},{"style":870},[1155],{"type":873,"value":1156},"  \u003C",{"type":857,"tag":427,"props":1158,"children":1159},{"style":877},[1160],{"type":873,"value":1161},"div",{"type":857,"tag":427,"props":1163,"children":1164},{"style":883},[1165],{"type":873,"value":1166}," style",{"type":857,"tag":427,"props":1168,"children":1169},{"style":870},[1170],{"type":873,"value":488},{"type":857,"tag":427,"props":1172,"children":1173},{"style":898},[1174],{"type":873,"value":1175},"\"display: flex; flex-direction: column; gap: 16px\"",{"type":857,"tag":427,"props":1177,"children":1178},{"style":870},[1179],{"type":873,"value":906},{"type":857,"tag":427,"props":1181,"children":1183},{"class":429,"line":1182},17,[1184,1189,1194,1199,1203,1208,1213,1217,1222],{"type":857,"tag":427,"props":1185,"children":1186},{"style":870},[1187],{"type":873,"value":1188},"    \u003C",{"type":857,"tag":427,"props":1190,"children":1191},{"style":877},[1192],{"type":873,"value":1193},"mt-theme-select",{"type":857,"tag":427,"props":1195,"children":1196},{"style":883},[1197],{"type":873,"value":1198}," v-model",{"type":857,"tag":427,"props":1200,"children":1201},{"style":870},[1202],{"type":873,"value":488},{"type":857,"tag":427,"props":1204,"children":1205},{"style":898},[1206],{"type":873,"value":1207},"\"theme\"",{"type":857,"tag":427,"props":1209,"children":1210},{"style":883},[1211],{"type":873,"value":1212}," label",{"type":857,"tag":427,"props":1214,"children":1215},{"style":870},[1216],{"type":873,"value":488},{"type":857,"tag":427,"props":1218,"children":1219},{"style":898},[1220],{"type":873,"value":1221},"\"Color theme\"",{"type":857,"tag":427,"props":1223,"children":1224},{"style":870},[1225],{"type":873,"value":1226}," \u002F>\n",{"type":857,"tag":427,"props":1228,"children":1230},{"class":429,"line":1229},18,[1231],{"type":857,"tag":427,"props":1232,"children":1233},{"emptyLinePlaceholder":454},[1234],{"type":873,"value":455},{"type":857,"tag":427,"props":1236,"children":1238},{"class":429,"line":1237},19,[1239,1243,1248,1253,1257],{"type":857,"tag":427,"props":1240,"children":1241},{"style":870},[1242],{"type":873,"value":1188},{"type":857,"tag":427,"props":1244,"children":1245},{"style":877},[1246],{"type":873,"value":1247},"mt-text",{"type":857,"tag":427,"props":1249,"children":1250},{"style":870},[1251],{"type":873,"value":1252},">Resolved theme: {{ resolvedTheme }}\u003C\u002F",{"type":857,"tag":427,"props":1254,"children":1255},{"style":877},[1256],{"type":873,"value":1247},{"type":857,"tag":427,"props":1258,"children":1259},{"style":870},[1260],{"type":873,"value":906},{"type":857,"tag":427,"props":1262,"children":1264},{"class":429,"line":1263},20,[1265,1270,1274],{"type":857,"tag":427,"props":1266,"children":1267},{"style":870},[1268],{"type":873,"value":1269},"  \u003C\u002F",{"type":857,"tag":427,"props":1271,"children":1272},{"style":877},[1273],{"type":873,"value":1161},{"type":857,"tag":427,"props":1275,"children":1276},{"style":870},[1277],{"type":873,"value":906},{"type":857,"tag":427,"props":1279,"children":1281},{"class":429,"line":1280},21,[1282,1286,1290],{"type":857,"tag":427,"props":1283,"children":1284},{"style":870},[1285],{"type":873,"value":1114},{"type":857,"tag":427,"props":1287,"children":1288},{"style":877},[1289],{"type":873,"value":1143},{"type":857,"tag":427,"props":1291,"children":1292},{"style":870},[1293],{"type":873,"value":906},{"type":857,"tag":824,"props":1295,"children":1296},{},[1297],{"type":873,"value":1298},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":423,"searchDepth":451,"depth":451,"links":1300},[],1787065092987]