[{"data":1,"prerenderedAt":2876},["ShallowReactive",2],{"content-\u002Fcomponents\u002Ftab-view":3,"content-en-fallback-\u002Fcomponents\u002Ftab-view":2875},{"id":4,"title":5,"body":6,"description":2866,"extension":2867,"meta":2868,"nav":2869,"navigation":2870,"path":2871,"seo":2872,"stem":2873,"__hash__":2874},"content\u002Fcomponents\u002Ftab-view.md","Tab View 选项卡",{"type":7,"value":8,"toc":2849},"minimark",[9,13,32,108,184,188,259,307,310,467,473,651,655,679,796,824,834,837,946,1059,1066,1139,1217,1220,1270,1336,1357,1366,1421,1424,1573,1598,1627,1711,1715,1874,1878,1884,2114,2183,2239,2244,2370,2416,2420,2435,2718,2749,2752,2845],[10,11,5],"h1",{"id":12},"tab-view-选项卡",[14,15,16,20,21,24,25,31],"p",{},[17,18,19],"code",{},"FluereTabView"," + ",[17,22,23],{},"FluereTabViewItem"," 对位 WinUI 3 \u002F Windows App SDK 的 ",[26,27,28],"strong",{},[17,29,30],{},"Microsoft.UI.Xaml.Controls.TabView","：一条可横向滚动的 tab 条 + 一个只显示选中项的内容区，支持关闭按钮、新建按钮、三种宽度模式，键位与焦点表现逐条抄源码。",[33,34,39],"pre",{"className":35,"code":36,"language":37,"meta":38,"style":38},"language-vue shiki shiki-themes github-light github-dark","\u003CFluereTabView v-model:selected-index=\"selected\" label=\"选项卡\">\n  \u003CFluereTabViewItem header=\"文档\" :is-closable=\"true\">面板内容\u003C\u002FFluereTabViewItem>\n  \u003CFluereTabViewItem header=\"图片\">面板内容\u003C\u002FFluereTabViewItem>\n\u003C\u002FFluereTabView>\n","vue","",[17,40,41,86,92,98],{"__ignoreMap":38},[42,43,46,50,53,57,60,63,66,70,73,75,78,80,83],"span",{"class":44,"line":45},"line",1,[42,47,49],{"class":48},"sVt8B","\u003C",[42,51,19],{"class":52},"s9eBZ",[42,54,56],{"class":55},"sScJk"," v-model",[42,58,59],{"class":48},":",[42,61,62],{"class":55},"selected-index",[42,64,65],{"class":48},"=",[42,67,69],{"class":68},"sZZnC","\"",[42,71,72],{"class":48},"selected",[42,74,69],{"class":68},[42,76,77],{"class":55}," label",[42,79,65],{"class":48},[42,81,82],{"class":68},"\"选项卡\"",[42,84,85],{"class":48},">\n",[42,87,89],{"class":44,"line":88},2,[42,90,91],{"class":48},"  \u003CFluereTabViewItem header=\"文档\" :is-closable=\"true\">面板内容\u003C\u002FFluereTabViewItem>\n",[42,93,95],{"class":44,"line":94},3,[42,96,97],{"class":48},"  \u003CFluereTabViewItem header=\"图片\">面板内容\u003C\u002FFluereTabViewItem>\n",[42,99,101,104,106],{"class":44,"line":100},4,[42,102,103],{"class":48},"\u003C\u002F",[42,105,19],{"class":52},[42,107,85],{"class":48},[109,110,112,118],"demo-block",{"title":111},"基础形态：图标 + 文本 + 面板",[113,114,115],"template",{"v-slot:preview":38},[116,117],"tab-view-basic-demo",{},[113,119,120],{"v-slot:code":38},[33,121,123],{"className":35,"code":122,"language":37,"meta":38,"style":38},"\u003CFluereTabView v-model:selected-index=\"selected\" label=\"示例选项卡\">\n  \u003CFluereTabViewItem v-for=\"tab in tabs\" :key=\"tab.title\" :header=\"tab.title\">\n    \u003Ctemplate #icon>\u003Ccomponent :is=\"tab.icon\" :size=\"16\" \u002F>\u003C\u002Ftemplate>\n    \u003Cdiv class=\"p-fluent-l\">…\u003C\u002Fdiv>\n  \u003C\u002FFluereTabViewItem>\n\u003C\u002FFluereTabView>\n",[17,124,125,154,159,164,169,175],{"__ignoreMap":38},[42,126,127,129,131,133,135,137,139,141,143,145,147,149,152],{"class":44,"line":45},[42,128,49],{"class":48},[42,130,19],{"class":52},[42,132,56],{"class":55},[42,134,59],{"class":48},[42,136,62],{"class":55},[42,138,65],{"class":48},[42,140,69],{"class":68},[42,142,72],{"class":48},[42,144,69],{"class":68},[42,146,77],{"class":55},[42,148,65],{"class":48},[42,150,151],{"class":68},"\"示例选项卡\"",[42,153,85],{"class":48},[42,155,156],{"class":44,"line":88},[42,157,158],{"class":48},"  \u003CFluereTabViewItem v-for=\"tab in tabs\" :key=\"tab.title\" :header=\"tab.title\">\n",[42,160,161],{"class":44,"line":94},[42,162,163],{"class":48},"    \u003Ctemplate #icon>\u003Ccomponent :is=\"tab.icon\" :size=\"16\" \u002F>\u003C\u002Ftemplate>\n",[42,165,166],{"class":44,"line":100},[42,167,168],{"class":48},"    \u003Cdiv class=\"p-fluent-l\">…\u003C\u002Fdiv>\n",[42,170,172],{"class":44,"line":171},5,[42,173,174],{"class":48},"  \u003C\u002FFluereTabViewItem>\n",[42,176,178,180,182],{"class":44,"line":177},6,[42,179,103],{"class":48},[42,181,19],{"class":52},[42,183,85],{"class":48},[185,186,187],"h2",{"id":187},"版本与证据口径",[189,190,191,204],"table",{},[192,193,194],"thead",{},[195,196,197,201],"tr",{},[198,199,200],"th",{},"项",[198,202,203],{},"值",[205,206,207,223,239],"tbody",{},[195,208,209,213],{},[210,211,212],"td",{},"规格源 tag",[210,214,215,218,219,222],{},[17,216,217],{},"winui3\u002Frelease\u002F2.5.1","（commit ",[17,220,221],{},"ba3a8d5","）",[195,224,225,228],{},[210,226,227],{},"关键文件",[210,229,230,20,233,20,236],{},[17,231,232],{},"src\u002Fcontrols\u002Fdev\u002FTabView\u002F{TabView.xaml,TabView_themeresources.xaml,TabView.idl,TabView.cpp,TabViewItem.cpp,TabViewListView.cpp,TabViewAutomationPeer.cpp,TabViewItemAutomationPeer.cpp}",[17,234,235],{},"Generated\u002F{TabView,TabViewItem}.properties.cpp",[17,237,238],{},"Strings\u002F{en-us,zh-CN}\u002FResources.resw",[195,240,241,244],{},[210,242,243],{},"内建文案",[210,245,246,247,250,251,254,255,258],{},"关闭 \u002F 新建 \u002F 滚动 \u002F 播报共 7 条",[26,248,249],{},"逐字","取自上游 ",[17,252,253],{},"Resources.resw","（见 ",[17,256,257],{},"packages\u002Fui\u002Fsrc\u002Ftab-view\u002Flocale.ts"," 的对照表）",[260,261,262,283],"blockquote",{},[14,263,264,270,271,274,275,278,279,282],{},[26,265,266,269],{},[17,267,268],{},"perf2026"," 不采纳","：上游存在 ",[17,272,273],{},"TabView_perf2026.xaml","（已挂进 ",[17,276,277],{},"TabView.vcxitems:43","），本库沿用 0.5.1 ",[17,280,281],{},"TitleBar"," 的裁定 —— 不读、不参考、不产生对应分支。",[14,284,285,291,292,295,296,295,299,302,303,306],{},[26,286,287,288],{},"不存在 ",[17,289,290],{},"TabViewItem.idl","：",[17,293,294],{},"TabViewItem"," \u002F ",[17,297,298],{},"TabViewItemTemplateSettings",[17,300,301],{},"TabViewListView"," \u002F 两个 AutomationPeer 的公开 API 全部写在 ",[17,304,305],{},"TabView.idl:203-285"," 里。",[185,308,309],{"id":309},"模板与几何",[189,311,312,322],{},[192,313,314],{},[195,315,316,319],{},[198,317,318],{},"结构",[198,320,321],{},"内容",[205,323,324,340,371,398,427,441],{},[195,325,326,329],{},[210,327,328],{},"根",[210,330,331,332,335,336,339],{},"两行：",[17,333,334],{},"Auto","（tab 条）\u002F ",[17,337,338],{},"*","（内容区）",[195,341,342,345],{},[210,343,344],{},"tab 条四列",[210,346,347,350,351,354,355,357,358,360,361,364,365,350,367,370],{},[17,348,349],{},"Auto MinWidth=2","（",[17,352,353],{},"TabStripHeader","）| ",[17,356,334],{},"（tab 条）| ",[17,359,334],{},"（新建按钮，容器 ",[17,362,363],{},"Padding 3,0,0,3","、底部对齐）| ",[17,366,338],{},[17,368,369],{},"TabStripFooter","），四列下方一条 1px 底边线",[195,372,373,376],{},[210,374,375],{},"顶部留白",[210,377,378,379,382,383,386,387,390,391,394,395],{},"tab 条上方 ",[26,380,381],{},"8px"," 来自 ",[17,384,385],{},"TabView.Padding = TabViewHeaderPadding(0,8,0,0)","（经 ",[17,388,389],{},"TabListView.Padding"," 传到 ",[17,392,393],{},"ItemsPresenter","），",[26,396,397],{},"不是 margin",[195,399,400,403],{},[210,401,402],{},"tab 项三列",[210,404,405,408,409,408,412,415,416,419,420,423,424],{},[17,406,407],{},"IconBox(Auto)"," | ",[17,410,411],{},"ContentPresenter(*)",[17,413,414],{},"CloseButton(Auto)","；",[17,417,418],{},"ContentPresenter"," 原文",[26,421,422],{},"没有 Margin","，两侧间距全部来自 ",[17,425,426],{},"TabContainer.Padding",[195,428,429,432],{},[210,430,431],{},"底边线",[210,433,434,350,437,440],{},[17,435,436],{},"TabViewBorderBrush",[17,438,439],{},"CardStrokeColorDefault","，1px）",[195,442,443,446],{},[210,444,445],{},"选中指示条",[210,447,448,451,452,455,456,459,460,463,464],{},[17,449,450],{},"SelectedBackgroundPath","（顶部圆角 8、左右各外扩 4px、底部两侧是半径 4 的",[26,453,454],{},"内凹","圆角）+ 两个 4×4 弧块（",[17,457,458],{},"Fill=TabViewBorderBrush","），三者都 ",[17,461,462],{},"x:Load=\"False\"","，选中时才 ",[17,465,466],{},"Visible",[14,468,469,470,291],{},"几何值逐条来自 ",[17,471,472],{},"TabView_themeresources.xaml:239-269",[189,474,475,484],{},[192,476,477],{},[195,478,479,482],{},[198,480,481],{},"量",[198,483,203],{},[205,485,486,499,515,530,547,567,584,604,618,635],{},[195,487,488,491],{},[210,489,490],{},"tab 最小高度",[210,492,493,350,496,222],{},[17,494,495],{},"32",[17,497,498],{},"TabViewItemMinHeight",[195,500,501,504],{},[210,502,503],{},"tab 最小 \u002F 最大宽度",[210,505,506,295,509,350,512,222],{},[17,507,508],{},"100",[17,510,511],{},"240",[26,513,514],{},"只在 Equal 模式经代码生效",[195,516,517,520],{},[210,518,519],{},"tab 内边距",[210,521,522,525,526,529],{},[17,523,524],{},"8,3,4,3","（关闭按钮可见）\u002F ",[17,527,528],{},"8,3,8,3","（不可见）",[195,531,532,535],{},[210,533,534],{},"header 字号 \u002F 图标盒",[210,536,537,295,540,543,544,222],{},[17,538,539],{},"12",[17,541,542],{},"16","（图标间距 ",[17,545,546],{},"0,0,10,0",[195,548,549,552],{},[210,550,551],{},"关闭按钮",[210,553,554,557,558,561,562,564,565],{},[17,555,556],{},"32×24","、圆角 ",[17,559,560],{},"4","、字号 ",[17,563,539],{},"、左边距 ",[17,566,560],{},[195,568,569,572],{},[210,570,571],{},"新建按钮",[210,573,574,557,576,561,578,580,581],{},[17,575,556],{},[17,577,560],{},[17,579,539],{},"、容器 ",[17,582,583],{},"3,0,0,3",[195,585,586,589],{},[210,587,588],{},"滚动按钮",[210,590,591,593,594,597,598,295,601],{},[17,592,556],{},"、字形字号 ",[17,595,596],{},"8","；容器 ",[17,599,600],{},"8,0,3,3",[17,602,603],{},"3,0,8,3",[195,605,606,609],{},[210,607,608],{},"分隔线",[210,610,611,614,615],{},[17,612,613],{},"1px","、",[17,616,617],{},"Margin 0,8,0,8",[195,619,620,623],{},[210,621,622],{},"边框",[210,624,625,628,629,20,632],{},[17,626,627],{},"1","；选中态 ",[17,630,631],{},"1,1,1,0",[17,633,634],{},"Margin -1,0,-1,1",[195,636,637,640],{},[210,638,639],{},"圆角",[210,641,642,643,646,647,650],{},"选中背景顶角 ",[17,644,645],{},"OverlayCornerRadius","(8)、三个按钮 ",[17,648,649],{},"ControlCornerRadius","(4)",[185,652,654],{"id":653},"键盘逐条对齐源码","键盘（逐条对齐源码）",[14,656,657,660,661,667,668,671,672,675,676,678],{},[17,658,659],{},"TabView"," ",[26,662,663,664],{},"没有 ",[17,665,666],{},"OnKeyDown","，只有三个 ",[17,669,670],{},"KeyboardAccelerator","（作用域 = 该 TabView，焦点在内容区里也生效）+ 新建按钮的一条 ",[17,673,674],{},"KeyDown","；方向键在 ",[17,677,294],{}," 级。",[189,680,681,694],{},[192,682,683],{},[195,684,685,688,691],{},[198,686,687],{},"触发键",[198,689,690],{},"前置条件",[198,692,693],{},"效果",[205,695,696,722,738,753,776],{},[195,697,698,703,709],{},[210,699,700],{},[17,701,702],{},"Ctrl+F4",[210,704,705,706],{},"选中项存在且 ",[17,707,708],{},"IsClosable",[210,710,711,712,350,715,718,719],{},"抛 ",[17,713,714],{},"tabCloseRequested",[17,716,717],{},"source: 'keyboard'","）；",[26,720,721],{},"不删除 tab",[195,723,724,729,732],{},[210,725,726],{},[17,727,728],{},"Ctrl+Tab",[210,730,731],{},"—",[210,733,734,735],{},"向后环形换选中（跳过禁用项）：",[17,736,737],{},"MoveSelection(true)",[195,739,740,745,747],{},[210,741,742],{},[17,743,744],{},"Ctrl+Shift+Tab",[210,746,731],{},[210,748,749,750],{},"向前环形换选中：",[17,751,752],{},"MoveSelection(false)",[195,754,755,764,767],{},[210,756,757,295,760,763],{},[17,758,759],{},"←",[17,761,762],{},"→","（焦点在 tab 条内）",[210,765,766],{},"不含 Alt \u002F Ctrl \u002F Meta",[210,768,769,770,415,773],{},"在焦点环上移动焦点 —— ",[17,771,772],{},"tab1 → tab1 关闭按钮 → tab2 → … → 新建按钮 → 回到 tab1",[26,774,775],{},"不改选中",[195,777,778,786,789],{},[210,779,780,295,783],{},[17,781,782],{},"Space",[17,784,785],{},"Enter",[210,787,788],{},"焦点在 tab 上",[210,790,791,792,795],{},"选中该 tab（底座 ",[17,793,794],{},"TabsTrigger"," 的键位）",[14,797,798,801,802,295,805,295,808,295,811,295,814,295,817,295,820,823],{},[26,799,800],{},"源码里没有的键","（负面证据，不要按直觉补）：",[17,803,804],{},"Ctrl+T",[17,806,807],{},"Ctrl+W",[17,809,810],{},"Ctrl+1..9",[17,812,813],{},"Home",[17,815,816],{},"End",[17,818,819],{},"Delete",[17,821,822],{},"Escape","。它们属宿主应用职责（WinUI Gallery \u002F Terminal 各自绑定）。",[260,825,826],{},[14,827,828,829,295,831,833],{},"浏览器限制：",[17,830,728],{},[17,832,702],{}," 在 Chrome \u002F Edge 里是「切换 \u002F 关闭浏览器标签页」的保留快捷键，页面可能收不到 keydown；组件照实现，可用性取决于宿主环境。",[185,835,836],{"id":836},"选择与关闭语义",[838,839,840,858,878,904,922,932],"ul",{},[841,842,843,350,846,849,850,852,853,295,855,857],"li",{},[26,844,845],{},"焦点移动不改选中",[17,847,848],{},"SingleSelectionFollowsFocus=False","）：方向键只挪焦点，",[17,851,728],{}," \u002F 点击 \u002F ",[17,854,782],{},[17,856,785],{}," 才改选中。",[841,859,860,863,864,866,867,869,870,873,874,877],{},[26,861,862],{},"组件绝不自行删除 tab","：关闭按钮与 ",[17,865,702],{}," 都只抛 ",[17,868,714],{},"（对齐 ",[17,871,872],{},"TabView.TabCloseRequested","，",[17,875,876],{},"TabViewItem.CloseRequested"," 合并进同一个事件）。删不删、删完选谁由消费方决定。",[841,879,880,883,884,887,888,891,892,895,896,899,900,903],{},[26,881,882],{},"删掉当前选中项时自动迁移","：按 ",[17,885,886],{},"TabView::OnItemsChanged"," 的规则 —— ",[17,889,890],{},"start = min(被移除下标, 剩余数 - 1)","，从该位置",[26,893,894],{},"向后环形","找第一个可用项；一圈都没有就不选中任何 tab。在",[26,897,898],{},"受控","模式下这个结果通过 ",[17,901,902],{},"update:selectedIndex"," 抛回。",[841,905,906,909,910,913,914,917,918,921],{},[26,907,908],{},"按身份跟随","：给子项 ",[17,911,912],{},":key","（或 ",[17,915,916],{},"value","）后，在选中项之前插入 \u002F 重排不会改变选中项（等价 WinUI 的 ",[17,919,920],{},"SelectedItem","）；没给稳定标识时退回下标语义。",[841,923,924,927,928,931],{},[26,925,926],{},"焦点归还","：切换 tab 时若焦点原本在旧面板里（面板会被卸载），焦点会送进新面板的第一个可聚焦元素；面板里没有可聚焦元素时回落到该 tab 本身（对齐 ",[17,929,930],{},"UpdateTabContent","）。",[841,933,934,937,938,941,942,945],{},[26,935,936],{},"新增按钮只抛事件","，并额外用 ",[17,939,940],{},"aria-live"," 播报「已添加新选项卡。」（对应上游的 UIA ",[17,943,944],{},"ItemAdded"," 通知）。",[109,947,949,954],{"title":948},"关闭与新建：数据由消费方管理",[113,950,951],{"v-slot:preview":38},[952,953],"tab-view-close-demo",{},[113,955,956],{"v-slot:code":38},[33,957,959],{"className":35,"code":958,"language":37,"meta":38,"style":38},"\u003CFluereTabView\n  v-model:selected-index=\"selected\"\n  label=\"可关闭选项卡\"\n  @tab-close-requested=\"onCloseRequested\"\n  @add-tab-button-click=\"onAddClick\"\n>\n  \u003CFluereTabViewItem v-for=\"(id, index) in openIds\" :key=\"id\" :header=\"titleOf(id, index)\">\n    …\n  \u003C\u002FFluereTabViewItem>\n\u003C\u002FFluereTabView>\n",[17,960,961,968,986,996,1013,1029,1033,1039,1045,1050],{"__ignoreMap":38},[42,962,963,965],{"class":44,"line":45},[42,964,49],{"class":48},[42,966,967],{"class":52},"FluereTabView\n",[42,969,970,973,975,977,979,981,983],{"class":44,"line":88},[42,971,972],{"class":55},"  v-model",[42,974,59],{"class":48},[42,976,62],{"class":55},[42,978,65],{"class":48},[42,980,69],{"class":68},[42,982,72],{"class":48},[42,984,985],{"class":68},"\"\n",[42,987,988,991,993],{"class":44,"line":94},[42,989,990],{"class":55},"  label",[42,992,65],{"class":48},[42,994,995],{"class":68},"\"可关闭选项卡\"\n",[42,997,998,1001,1004,1006,1008,1011],{"class":44,"line":100},[42,999,1000],{"class":48},"  @",[42,1002,1003],{"class":55},"tab-close-requested",[42,1005,65],{"class":48},[42,1007,69],{"class":68},[42,1009,1010],{"class":48},"onCloseRequested",[42,1012,985],{"class":68},[42,1014,1015,1017,1020,1022,1024,1027],{"class":44,"line":171},[42,1016,1000],{"class":48},[42,1018,1019],{"class":55},"add-tab-button-click",[42,1021,65],{"class":48},[42,1023,69],{"class":68},[42,1025,1026],{"class":48},"onAddClick",[42,1028,985],{"class":68},[42,1030,1031],{"class":44,"line":177},[42,1032,85],{"class":48},[42,1034,1036],{"class":44,"line":1035},7,[42,1037,1038],{"class":48},"  \u003CFluereTabViewItem v-for=\"(id, index) in openIds\" :key=\"id\" :header=\"titleOf(id, index)\">\n",[42,1040,1042],{"class":44,"line":1041},8,[42,1043,1044],{"class":48},"    …\n",[42,1046,1048],{"class":44,"line":1047},9,[42,1049,174],{"class":48},[42,1051,1053,1055,1057],{"class":44,"line":1052},10,[42,1054,103],{"class":48},[42,1056,19],{"class":52},[42,1058,85],{"class":48},[185,1060,1062,1063,222],{"id":1061},"宽度模式tabwidthmode","宽度模式（",[17,1064,1065],{},"tabWidthMode",[189,1067,1068,1080],{},[192,1069,1070],{},[195,1071,1072,1074,1077],{},[198,1073,203],{},[198,1075,1076],{},"WinUI",[198,1078,1079],{},"语义",[205,1081,1082,1102,1117],{},[195,1083,1084,1090,1095],{},[210,1085,1086,1089],{},[17,1087,1088],{},"equal","（缺省）",[210,1091,1092],{},[17,1093,1094],{},"Equal = 0",[210,1096,1097,1098,1101],{},"每项宽度 = ",[17,1099,1100],{},"clamp(可用宽 \u002F tab 数, 100, 240)","（代码测量，见组件注释）",[195,1103,1104,1109,1114],{},[210,1105,1106],{},[17,1107,1108],{},"size-to-content",[210,1110,1111],{},[17,1112,1113],{},"SizeToContent=1",[210,1115,1116],{},"宽度由内容决定，不设 item 宽",[195,1118,1119,1124,1129],{},[210,1120,1121],{},[17,1122,1123],{},"compact",[210,1125,1126],{},[17,1127,1128],{},"Compact = 2",[210,1130,1131,1132,1134,1135,1138],{},"同 ",[17,1133,1108],{},"，但",[26,1136,1137],{},"未被选中","的 tab 折叠成只剩图标（选中项强制恢复）",[109,1140,1142,1147],{"title":1141},"三种宽度模式对照",[113,1143,1144],{"v-slot:preview":38},[1145,1146],"tab-view-width-mode-demo",{},[113,1148,1149],{"v-slot:code":38},[33,1150,1152],{"className":35,"code":1151,"language":37,"meta":38,"style":38},"\u003CFluereTabView :tab-width-mode=\"mode\" :default-selected-index=\"0\" label=\"宽度模式\">\n  \u003CFluereTabViewItem header=\"选项卡一\">…\u003C\u002FFluereTabViewItem>\n  \u003CFluereTabViewItem header=\"选项卡二\">…\u003C\u002FFluereTabViewItem>\n\u003C\u002FFluereTabView>\n",[17,1153,1154,1199,1204,1209],{"__ignoreMap":38},[42,1155,1156,1158,1160,1163,1166,1168,1170,1173,1175,1177,1180,1182,1184,1188,1190,1192,1194,1197],{"class":44,"line":45},[42,1157,49],{"class":48},[42,1159,19],{"class":52},[42,1161,1162],{"class":48}," :",[42,1164,1165],{"class":55},"tab-width-mode",[42,1167,65],{"class":48},[42,1169,69],{"class":68},[42,1171,1172],{"class":48},"mode",[42,1174,69],{"class":68},[42,1176,1162],{"class":48},[42,1178,1179],{"class":55},"default-selected-index",[42,1181,65],{"class":48},[42,1183,69],{"class":68},[42,1185,1187],{"class":1186},"sj4cs","0",[42,1189,69],{"class":68},[42,1191,77],{"class":55},[42,1193,65],{"class":48},[42,1195,1196],{"class":68},"\"宽度模式\"",[42,1198,85],{"class":48},[42,1200,1201],{"class":44,"line":88},[42,1202,1203],{"class":48},"  \u003CFluereTabViewItem header=\"选项卡一\">…\u003C\u002FFluereTabViewItem>\n",[42,1205,1206],{"class":44,"line":94},[42,1207,1208],{"class":48},"  \u003CFluereTabViewItem header=\"选项卡二\">…\u003C\u002FFluereTabViewItem>\n",[42,1210,1211,1213,1215],{"class":44,"line":100},[42,1212,103],{"class":48},[42,1214,19],{"class":52},[42,1216,85],{"class":48},[185,1218,1219],{"id":1219},"溢出滚动",[14,1221,1222,1223,291,1226,1228,1229,1231,1232,1235,1236,1239,1240,1243,1244,1247,1248,1251,1252,1255,1256,1259,1260,1263,1264,873,1267,931],{},"放不下时 ",[26,1224,1225],{},"tab 先被压到下限、再溢出",[17,1227,1088],{}," 模式（缺省）的单 tab 宽是 ",[17,1230,1100],{},"，所以空间不够时先压到 ",[17,1233,1234],{},"TabViewItemMinWidth = 100","；一旦真的溢出（",[17,1237,1238],{},"scrollWidth - clientWidth > 0.5","），tab 条两侧出现滚动按钮，步长 ",[17,1241,1242],{},"50px","，贴左禁止「向后」、贴右禁止「向前」（判定阈值 ",[17,1245,1246],{},"0.1","），并且",[26,1249,1250],{},"按住即连续滚动","：按下立刻滚一次，",[17,1253,1254],{},"50ms"," 后每 ",[17,1257,1258],{},"100ms"," 重复一次（对齐上游 ",[17,1261,1262],{},"RepeatButton"," 的 ",[17,1265,1266],{},"Delay=\"50\" Interval=\"100\"",[17,1268,1269],{},"TabView.xaml:158,165",[14,1271,1272,1275,1276,1279,1280,1283,1284,1287,1288,1291,1292,1295,1296,350,1299,1302,1303,1306,1307,20,1310,660,1313,1316,1317,1327,1328,1331,1332,1335],{},[26,1273,1274],{},"溢出时不画滚动条","：上游 ",[17,1277,1278],{},"TabScrollViewerStyle"," 的模板（",[17,1281,1282],{},"TabView.xaml:133-173","）里",[26,1285,1286],{},"没有滚动条部件","，只有 ",[17,1289,1290],{},"ScrollContentPresenter"," 与左右两个箭头容器 —— ",[17,1293,1294],{},"ScrollViewer.ComputedHorizontalScrollBarVisibility"," 只绑给这两个容器的 ",[17,1297,1298],{},"Visibility",[17,1300,1301],{},":157,163","），也就是说它只决定「箭头出不出现」。本库照此实现：",[17,1304,1305],{},"overflow-x: auto"," 保留原生滚动（滚轮 \u002F Shift + 滚轮 \u002F 触摸 \u002F 横向滚轮增量），再用 ",[17,1308,1309],{},"scrollbar-width: none",[17,1311,1312],{},"::-webkit-scrollbar",[26,1314,1315],{},"不画原生滚动条","。于是 ",[26,1318,1319,1320,1322,1323,1326],{},"tab 高恒为 ",[17,1321,495],{},"、tab 条行高恒为 ",[17,1324,1325],{},"40","（8 + 32）","：经典滚动条会给行加一条 ≈ ",[17,1329,1330],{},"15px"," 的高度（有头 Chromium 实测 ",[17,1333,1334],{},"40 → 55","），既撑高 tab 条又挤压内容。",[14,1337,1338,1339,20,1342,1345,1346,1349,1350,20,1353,1356],{},"两个按钮 ",[17,1340,1341],{},"tabindex=\"-1\"",[17,1343,1344],{},"aria-hidden=\"true\""," —— ",[26,1347,1348],{},"不进 Tab 序、对读屏隐藏","，与 WinUI 的 ",[17,1351,1352],{},"IsTabStop=False",[17,1354,1355],{},"AccessibilityView=Raw"," 一致。隐藏滚动条后鼠标侧只剩箭头与滚轮（WinUI 的 tab 条本来就没有滚动条，因此这是对齐而不是让步）。",[260,1358,1359],{},[14,1360,1361,1362,1365],{},"已知注意事项：在 ",[17,1363,1364],{},"FluereScrollView"," 内部（如本文档站），竖向滚轮按「最近的可滚容器独占」规则会被外层接管 —— 指针停在 tab 条上时 Shift + 滚轮不会滚动 tab 条（横向滚轮增量 \u002F 触摸板横向滑动不受影响）。独立的页面里 Shift + 滚轮可正常横向滚动 tab 条（最小复现已验证）。这是滚动链归属的既有行为，不是滚动条隐藏引入的。",[109,1367,1369,1374],{"title":1368},"十个 tab 挤在 480px 里",[113,1370,1371],{"v-slot:preview":38},[1372,1373],"tab-view-overflow-demo",{},[113,1375,1376],{"v-slot:code":38},[33,1377,1379],{"className":35,"code":1378,"language":37,"meta":38,"style":38},"\u003Cdiv class=\"w-[480px] overflow-hidden\">\n  \u003CFluereTabView :default-selected-index=\"0\" label=\"溢出的选项卡条\">\n    \u003CFluereTabViewItem v-for=\"title in titles\" :key=\"title\" :header=\"title\">…\u003C\u002FFluereTabViewItem>\n  \u003C\u002FFluereTabView>\n\u003C\u002Fdiv>\n",[17,1380,1381,1398,1403,1408,1413],{"__ignoreMap":38},[42,1382,1383,1385,1388,1391,1393,1396],{"class":44,"line":45},[42,1384,49],{"class":48},[42,1386,1387],{"class":52},"div",[42,1389,1390],{"class":55}," class",[42,1392,65],{"class":48},[42,1394,1395],{"class":68},"\"w-[480px] overflow-hidden\"",[42,1397,85],{"class":48},[42,1399,1400],{"class":44,"line":88},[42,1401,1402],{"class":48},"  \u003CFluereTabView :default-selected-index=\"0\" label=\"溢出的选项卡条\">\n",[42,1404,1405],{"class":44,"line":94},[42,1406,1407],{"class":48},"    \u003CFluereTabViewItem v-for=\"title in titles\" :key=\"title\" :header=\"title\">…\u003C\u002FFluereTabViewItem>\n",[42,1409,1410],{"class":44,"line":100},[42,1411,1412],{"class":48},"  \u003C\u002FFluereTabView>\n",[42,1414,1415,1417,1419],{"class":44,"line":171},[42,1416,103],{"class":48},[42,1418,1387],{"class":52},[42,1420,85],{"class":48},[185,1422,1423],{"id":1423},"状态与关闭按钮",[189,1425,1426,1439],{},[192,1427,1428],{},[195,1429,1430,1433,1436],{},[198,1431,1432],{},"状态",[198,1434,1435],{},"触发",[198,1437,1438],{},"表现（token）",[205,1440,1441,1458,1472,1489,1510,1526,1543,1562],{},[195,1442,1443,1446,1448],{},[210,1444,1445],{},"rest",[210,1447,731],{},[210,1449,1450,1451,1454,1455],{},"底 ",[17,1452,1453],{},"--layerOnMicaBaseAltFillColorTransparent","（透明）、字 ",[17,1456,1457],{},"--colorNeutralForeground2",[195,1459,1460,1463,1466],{},[210,1461,1462],{},"hover",[210,1464,1465],{},"指针悬停（未选中 \u002F 未禁用）",[210,1467,1450,1468,1471],{},[17,1469,1470],{},"--layerOnMicaBaseAltFillColorSecondary","；右侧分隔线隐藏",[195,1473,1474,1477,1480],{},[210,1475,1476],{},"pressed",[210,1478,1479],{},"指针按下（未选中 \u002F 未禁用）",[210,1481,1450,1482,1485,1486],{},[17,1483,1484],{},"--layerOnMicaBaseAltFillColorDefault","、字 ",[17,1487,1488],{},"--colorNeutralForeground3",[195,1490,1491,1493,1496],{},[210,1492,72],{},[210,1494,1495],{},"选中",[210,1497,1450,1498,1501,1502,1505,1506,1509],{},[17,1499,1500],{},"--solidBackgroundFillColorTertiary"," + 顶角 8 + 1px ",[17,1503,1504],{},"--colorNeutralStrokeAlpha"," 描边 + 字 ",[17,1507,1508],{},"--colorNeutralForeground1"," + SemiBold",[195,1511,1512,1515,1519],{},[210,1513,1514],{},"disabled",[210,1516,1517],{},[17,1518,1514],{},[210,1520,1521,1522,1525],{},"字 ",[17,1523,1524],{},"--colorNeutralForegroundDisabled","、不可点、不进焦点环",[195,1527,1528,1531,1534],{},[210,1529,1530],{},"focus",[210,1532,1533],{},"键盘聚焦",[210,1535,1536,1539,1540,222],{},[17,1537,1538],{},"useFocusVisual"," 双层焦点矩形（外 2px + 内 1px，等价 ",[17,1541,1542],{},"FocusVisualMargin = -3",[195,1544,1545,1548,1551],{},[210,1546,1547],{},"关闭按钮 hover\u002Fpressed",[210,1549,1550],{},"指针悬停 \u002F 按下关闭按钮",[210,1552,1450,1553,295,1556,1559,1560],{},[17,1554,1555],{},"--subtleFillColorSecondary",[17,1557,1558],{},"--subtleFillColorTertiary","，字 ",[17,1561,1508],{},[195,1563,1564,1567,1570],{},[210,1565,1566],{},"新建按钮 hover\u002Fpressed",[210,1568,1569],{},"指针悬停 \u002F 按下",[210,1571,1572],{},"同上",[14,1574,1575,1578,1579,1582,1583,1586,1587,1590,1591,1597],{},[26,1576,1577],{},"所有状态都是瞬时切换","：上游 TabViewItem 的 hover \u002F pressed \u002F selected \u002F disabled 全部是 ",[17,1580,1581],{},"VisualState.Setters","，且所有 ",[17,1584,1585],{},"GoToState(..., false)","，文件里没有任何 ",[17,1588,1589],{},"EasingFunction","。因此本组件",[26,1592,1593,1594],{},"不写任何 ",[17,1595,1596],{},"transition","。",[14,1599,1600,1603,1604,1607,1608,1611,1612,1619,1620,1623,1624,1626],{},[17,1601,1602],{},"closeButtonOverlayMode"," 三档：",[17,1605,1606],{},"auto","（缺省）与 ",[17,1609,1610],{},"always"," 走",[26,1613,1614,1615,1618],{},"同一个 ",[17,1616,1617],{},"default:"," 分支","（总是显示），只有 ",[17,1621,1622],{},"on-pointer-over"," 是「悬停或选中才显示」—— 这是源码字面行为，不要按直觉把 ",[17,1625,1606],{}," 当成智能判断。",[109,1628,1630,1635],{"title":1629},"可关闭性、禁用与 on-pointer-over",[113,1631,1632],{"v-slot:preview":38},[1633,1634],"tab-view-states-demo",{},[113,1636,1637],{"v-slot:code":38},[33,1638,1640],{"className":35,"code":1639,"language":37,"meta":38,"style":38},"\u003CFluereTabView :close-button-overlay-mode=\"overlayMode\" :default-selected-index=\"0\" label=\"状态\">\n  \u003CFluereTabViewItem header=\"可关闭（选中）\">…\u003C\u002FFluereTabViewItem>\n  \u003CFluereTabViewItem header=\"可关闭（未选中）\">…\u003C\u002FFluereTabViewItem>\n  \u003CFluereTabViewItem header=\"不可关闭\" :is-closable=\"false\">…\u003C\u002FFluereTabViewItem>\n  \u003CFluereTabViewItem header=\"禁用\" disabled>…\u003C\u002FFluereTabViewItem>\n\u003C\u002FFluereTabView>\n",[17,1641,1642,1683,1688,1693,1698,1703],{"__ignoreMap":38},[42,1643,1644,1646,1648,1650,1653,1655,1657,1660,1662,1664,1666,1668,1670,1672,1674,1676,1678,1681],{"class":44,"line":45},[42,1645,49],{"class":48},[42,1647,19],{"class":52},[42,1649,1162],{"class":48},[42,1651,1652],{"class":55},"close-button-overlay-mode",[42,1654,65],{"class":48},[42,1656,69],{"class":68},[42,1658,1659],{"class":48},"overlayMode",[42,1661,69],{"class":68},[42,1663,1162],{"class":48},[42,1665,1179],{"class":55},[42,1667,65],{"class":48},[42,1669,69],{"class":68},[42,1671,1187],{"class":1186},[42,1673,69],{"class":68},[42,1675,77],{"class":55},[42,1677,65],{"class":48},[42,1679,1680],{"class":68},"\"状态\"",[42,1682,85],{"class":48},[42,1684,1685],{"class":44,"line":88},[42,1686,1687],{"class":48},"  \u003CFluereTabViewItem header=\"可关闭（选中）\">…\u003C\u002FFluereTabViewItem>\n",[42,1689,1690],{"class":44,"line":94},[42,1691,1692],{"class":48},"  \u003CFluereTabViewItem header=\"可关闭（未选中）\">…\u003C\u002FFluereTabViewItem>\n",[42,1694,1695],{"class":44,"line":100},[42,1696,1697],{"class":48},"  \u003CFluereTabViewItem header=\"不可关闭\" :is-closable=\"false\">…\u003C\u002FFluereTabViewItem>\n",[42,1699,1700],{"class":44,"line":171},[42,1701,1702],{"class":48},"  \u003CFluereTabViewItem header=\"禁用\" disabled>…\u003C\u002FFluereTabViewItem>\n",[42,1704,1705,1707,1709],{"class":44,"line":177},[42,1706,103],{"class":48},[42,1708,19],{"class":52},[42,1710,85],{"class":48},[185,1712,1714],{"id":1713},"与-winui-的差异逐条","与 WinUI 的差异（逐条）",[1716,1717,1718,1743,1762,1777,1788,1806,1823,1829,1850],"ol",{},[841,1719,1720,291,1723,1725,1726,1729,1730,1732,1733,1735,1736,350,1739,1742],{},[26,1721,1722],{},"子项是「数据型子组件」",[17,1724,23],{}," 不会挂载（父组件在渲染期读它的 props \u002F slots），因此它",[26,1727,1728],{},"不能"," emit；",[17,1731,876],{}," 合并进根组件的 ",[17,1734,714],{},"。子项插槽",[26,1737,1738],{},"不支持作用域参数",[17,1740,1741],{},"#header=\"{ … }\""," 拿不到值）。",[841,1744,1745,1751,1752,295,1755,295,1758,1761],{},[26,1746,1747,1748,1750],{},"子项必须是 ",[17,1749,19],{}," 的直接子元素","（可以包在 ",[17,1753,1754],{},"v-for",[17,1756,1757],{},"\u003Ctemplate>",[17,1759,1760],{},"v-if"," 里）。套了额外的原生元素或自定义组件时它会被忽略，并在开发期打印一条警告。",[841,1763,1764,1773,1774,1776],{},[26,1765,663,1766,295,1769,1772],{},[17,1767,1768],{},"TabItemsSource",[17,1770,1771],{},"TabItemTemplate"," \u002F 虚拟化","：Web 侧用 ",[17,1775,1754],{}," + 子组件即可。",[841,1778,1779,1784,1785,1597],{},[26,1780,663,1781],{},[17,1782,1783],{},"AddTabButtonCommand","：只抛 ",[17,1786,1787],{},"addTabButtonClick",[841,1789,1790,1798,1799,1802,1803,931],{},[26,1791,1792,1794,1795],{},[17,1793,1514],{}," 属性会被底座写成 ",[17,1796,1797],{},"disabled=\"false\"","：浏览器与 AT 都忽略非表单元素上的该属性，禁用语义由 ",[17,1800,1801],{},"aria-disabled"," 表达（样式一律用 ",[17,1804,1805],{},"[data-disabled]",[841,1807,1808,1811,1812,1814,1815,1818,1819,1822],{},[26,1809,1810],{},"header 超出时省略号","：WinUI 的 ",[17,1813,418],{}," 没设 ",[17,1816,1817],{},"TextTrimming","（会硬裁），Web 侧用 ",[17,1820,1821],{},"text-overflow: ellipsis"," 更可读 —— 这是唯一一处主动的排版差异。",[841,1824,1825,1828],{},[26,1826,1827],{},"选中背景的 4×4 内凹圆角用 CSS mask 表达","：上游是运行时生成的路径 + 两个弧块；等价几何，但不是逐像素一致（见「证据缺口」）。",[841,1830,1831,1836,1837,1839,1840,1843,1844,660,1847,1849],{},[26,1832,1833,1835],{},[17,1834,436],{}," 的映射","：上游 Light \u002F Default 下它是指向 ",[17,1838,439],{},"（一个 ",[17,1841,1842],{},"Color","）的别名，隐式转换路径无法从源码证实；本库按同值处理并",[26,1845,1846],{},"沿用仓库既有映射",[17,1848,1504],{},"（InfoBar \u002F ContentDialog 用的就是它）。",[841,1851,1852,1855,1856,295,1859,295,1862,1865,1866,1869,1870,1873],{},[26,1853,1854],{},"不做","：拖拽重排、tear-out 撕出、中键关闭、",[17,1857,1858],{},"TabStripDragOver",[17,1860,1861],{},"TabStripDrop",[17,1863,1864],{},"TabDrag*"," 事件、",[17,1867,1868],{},"ItemContainerTransitions","（其时长 \u002F 关键帧不在控件目录内）、高对比度色板（只保留 ",[17,1871,1872],{},"forced-colors"," 焦点环兜底）。",[185,1875,1877],{"id":1876},"api","API",[1879,1880,1882],"h3",{"id":1881},"flueretabview",[17,1883,19],{},[189,1885,1886,1902],{},[192,1887,1888],{},[195,1889,1890,1893,1896,1899],{},[198,1891,1892],{},"属性（Props）",[198,1894,1895],{},"类型",[198,1897,1898],{},"默认",[198,1900,1901],{},"对应 \u002F 说明",[205,1903,1904,1926,1950,1971,1998,2020,2046,2068,2093],{},[195,1905,1906,1911,1916,1920],{},[210,1907,1908],{},[17,1909,1910],{},"selectedIndex",[210,1912,1913],{},[17,1914,1915],{},"number",[210,1917,1918],{},[17,1919,731],{},[210,1921,1922,1925],{},[17,1923,1924],{},"v-model:selected-index","；传了即受控，不传为非受控",[195,1927,1928,1933,1937,1941],{},[210,1929,1930],{},[17,1931,1932],{},"defaultSelectedIndex",[210,1934,1935],{},[17,1936,1915],{},[210,1938,1939],{},[17,1940,1187],{},[210,1942,1943,1944,1947,1948,222],{},"非受控初始项（对齐 WinUI ",[17,1945,1946],{},"SelectedIndex"," 默认 ",[17,1949,1187],{},[195,1951,1952,1956,1961,1966],{},[210,1953,1954],{},[17,1955,1065],{},[210,1957,1958],{},[17,1959,1960],{},"'equal' | 'size-to-content' | 'compact'",[210,1962,1963],{},[17,1964,1965],{},"'equal'",[210,1967,1968],{},[17,1969,1970],{},"TabWidthMode",[195,1972,1973,1977,1982,1987],{},[210,1974,1975],{},[17,1976,1602],{},[210,1978,1979],{},[17,1980,1981],{},"'auto' | 'on-pointer-over' | 'always'",[210,1983,1984],{},[17,1985,1986],{},"'auto'",[210,1988,1989,415,1992,1994,1995,1997],{},[17,1990,1991],{},"CloseButtonOverlayMode",[17,1993,1606],{}," 与 ",[17,1996,1610],{}," 同行为",[195,1999,2000,2005,2010,2015],{},[210,2001,2002],{},[17,2003,2004],{},"isAddTabButtonVisible",[210,2006,2007],{},[17,2008,2009],{},"boolean",[210,2011,2012],{},[17,2013,2014],{},"true",[210,2016,2017],{},[17,2018,2019],{},"IsAddTabButtonVisible",[195,2021,2022,2027,2032,2036],{},[210,2023,2024],{},[17,2025,2026],{},"label",[210,2028,2029],{},[17,2030,2031],{},"string",[210,2033,2034],{},[17,2035,731],{},[210,2037,2038,2039,2042,2043],{},"tab 条的可访问名（",[17,2040,2041],{},"aria-label","）。上游 peer 无名称回退，",[26,2044,2045],{},"建议必填",[195,2047,2048,2053,2058,2062],{},[210,2049,2050],{},[17,2051,2052],{},"dir",[210,2054,2055],{},[17,2056,2057],{},"'ltr' | 'rtl'",[210,2059,2060],{},[17,2061,731],{},[210,2063,2064,2065,222],{},"只影响方向键的前进方向判定（",[17,2066,2067],{},"FlowDirection",[195,2069,2070,2075,2080,2084],{},[210,2071,2072],{},[17,2073,2074],{},"motion",[210,2076,2077],{},[17,2078,2079],{},"'auto' | 'none'",[210,2081,2082],{},[17,2083,1986],{},[210,2085,2086,2087,2089,2090],{},"只作用于滚动按钮的平滑滚动；",[17,2088,1606],{}," 尊重 ",[17,2091,2092],{},"prefers-reduced-motion",[195,2094,2095,2100,2104,2108],{},[210,2096,2097],{},[17,2098,2099],{},"locale",[210,2101,2102],{},[17,2103,2031],{},[210,2105,2106],{},[17,2107,731],{},[210,2109,2110,2111],{},"内建文案 locale，优先于 ",[17,2112,2113],{},"FluereConfigProvider",[189,2115,2116,2129],{},[192,2117,2118],{},[195,2119,2120,2123,2126],{},[198,2121,2122],{},"事件（Emits）",[198,2124,2125],{},"载荷",[198,2127,2128],{},"说明",[205,2130,2131,2144,2169],{},[195,2132,2133,2137,2141],{},[210,2134,2135],{},[17,2136,902],{},[210,2138,2139],{},[17,2140,1915],{},[210,2142,2143],{},"选中变化；受控模式下含「迁移后的结果」",[195,2145,2146,2150,2155],{},[210,2147,2148],{},[17,2149,714],{},[210,2151,2152],{},[17,2153,2154],{},"{ index, header, identity, source }",[210,2156,2157,2158,2161,2162,295,2165,2168],{},"关闭请求（",[17,2159,2160],{},"source"," 为 ",[17,2163,2164],{},"'close-button'",[17,2166,2167],{},"'keyboard'","）；组件不删数据",[195,2170,2171,2175,2180],{},[210,2172,2173],{},[17,2174,1787],{},[210,2176,2177],{},[17,2178,2179],{},"MouseEvent",[210,2181,2182],{},"新建按钮点击；组件不新增 tab",[189,2184,2185,2194],{},[192,2186,2187],{},[195,2188,2189,2192],{},[198,2190,2191],{},"插槽（Slots）",[198,2193,2128],{},[205,2195,2196,2208,2225],{},[195,2197,2198,2203],{},[210,2199,2200],{},[17,2201,2202],{},"default",[210,2204,2205,2207],{},[17,2206,23],{}," 列表（必须是直接子元素）",[195,2209,2210,2218],{},[210,2211,2212,295,2215],{},[17,2213,2214],{},"tab-strip-header",[17,2216,2217],{},"tab-strip-footer",[210,2219,2220,2221,295,2223,222],{},"tab 条左右两端的自定义内容（",[17,2222,353],{},[17,2224,369],{},[195,2226,2227,2232],{},[210,2228,2229],{},[17,2230,2231],{},"add",[210,2233,2234,2235,2238],{},"新建按钮的图标（默认是 ",[17,2236,2237],{},"Add"," 字形）",[1879,2240,2242],{"id":2241},"flueretabviewitem",[17,2243,23],{},[189,2245,2246,2258],{},[192,2247,2248],{},[195,2249,2250,2252,2254,2256],{},[198,2251,1892],{},[198,2253,1895],{},[198,2255,1898],{},[198,2257,1901],{},[205,2259,2260,2285,2308,2328,2349],{},[195,2261,2262,2267,2271,2276],{},[210,2263,2264],{},[17,2265,2266],{},"header",[210,2268,2269],{},[17,2270,2031],{},[210,2272,2273],{},[17,2274,2275],{},"''",[210,2277,2278,415,2281,2284],{},[17,2279,2280],{},"Header",[17,2282,2283],{},"#header"," 插槽优先于它",[195,2286,2287,2292,2296,2300],{},[210,2288,2289],{},[17,2290,2291],{},"isClosable",[210,2293,2294],{},[17,2295,2009],{},[210,2297,2298],{},[17,2299,2014],{},[210,2301,2302,2304,2305,222],{},[17,2303,708],{},"（不是 ",[17,2306,2307],{},"IsTabClosable",[195,2309,2310,2314,2318,2323],{},[210,2311,2312],{},[17,2313,1514],{},[210,2315,2316],{},[17,2317,2009],{},[210,2319,2320],{},[17,2321,2322],{},"false",[210,2324,2325],{},[17,2326,2327],{},"Control.IsEnabled = false",[195,2329,2330,2335,2339,2343],{},[210,2331,2332],{},[17,2333,2334],{},"ariaLabel",[210,2336,2337],{},[17,2338,2031],{},[210,2340,2341],{},[17,2342,731],{},[210,2344,2345,2348],{},[17,2346,2347],{},"AutomationProperties.Name","；缺省时 AT 从 header 文本取名（对齐 peer）",[195,2350,2351,2355,2360,2364],{},[210,2352,2353],{},[17,2354,916],{},[210,2356,2357],{},[17,2358,2359],{},"string | number",[210,2361,2362],{},[17,2363,731],{},[210,2365,2366,2367,2369],{},"稳定标识（等价 ",[17,2368,912],{},"），用于「按身份跟随选中」",[189,2371,2372,2380],{},[192,2373,2374],{},[195,2375,2376,2378],{},[198,2377,2191],{},[198,2379,2128],{},[205,2381,2382,2394,2406],{},[195,2383,2384,2391],{},[210,2385,2386,350,2388,222],{},[17,2387,2202],{},[17,2389,2390],{},"content",[210,2392,2393],{},"面板内容；非选中时会被卸载",[195,2395,2396,2400],{},[210,2397,2398],{},[17,2399,2266],{},[210,2401,2402,2403,2405],{},"富文本标题（优先于 ",[17,2404,2266],{}," 文本）",[195,2407,2408,2413],{},[210,2409,2410],{},[17,2411,2412],{},"icon",[210,2414,2415],{},"图标（16×16 盒）",[185,2417,2419],{"id":2418},"浏览器实测可复现","浏览器实测（可复现）",[14,2421,2422,2423,2426,2427,2430,2431,2434],{},"Playwright + 系统 Chrome（1280×900 \u002F DPR 1）在文档站本页实测：基础形态用 ",[17,2424,2425],{},"temp\u002Fpw-tab-view.mjs","（53 条断言），溢出的滚动条 \u002F 长按滚动专项用 ",[17,2428,2429],{},"temp\u002Fpw-tab-view-overflow.mjs","（21 条断言，",[26,2432,2433],{},"必须有头"," —— 无头 \u002F overlay 滚动条环境复现不出那 15px）：",[189,2436,2437,2446],{},[192,2438,2439],{},[195,2440,2441,2443],{},[198,2442,481],{},[198,2444,2445],{},"实测",[205,2447,2448,2460,2474,2488,2519,2534,2555,2568,2595,2640,2660,2680,2691,2702],{},[195,2449,2450,2453],{},[210,2451,2452],{},"tab 条高 \u002F 单 tab 高",[210,2454,2455,2457,2458],{},[17,2456,1325],{},"（8px 顶部留白 + 32 + 行内 1px 底边线）\u002F ",[17,2459,495],{},[195,2461,2462,2465],{},[210,2463,2464],{},"tab padding \u002F header 字号",[210,2466,2467,2470,2471],{},[17,2468,2469],{},"3px 4px 3px 8px","（关闭按钮可见，见下）\u002F ",[17,2472,2473],{},"12px",[195,2475,2476,2479],{},[210,2477,2478],{},"Equal 单 tab 宽",[210,2480,2481,2482,2485,2486],{},"行宽 718 − 左内容 2 − 新建按钮区 35 − 右内容 0 = 681 ⇒ ",[17,2483,2484],{},"227","（3 项）；7 项时仍按可用宽均分，溢出时落到下限 ",[17,2487,508],{},[195,2489,2490,2493],{},[210,2491,2492],{},"选中态",[210,2494,2495,2496,2499,2500,2502,2503,2506,2507,614,2510,614,2513,614,2516],{},"伪元素填充 ",[17,2497,2498],{},"rgb(249, 249, 249)","、顶角 ",[17,2501,381],{},"、四边 ",[17,2504,2505],{},"-1px -4px 0px -4px","、字重 ",[17,2508,2509],{},"600",[17,2511,2512],{},"border-width: 1px 1px 0px",[17,2514,2515],{},"margin: 0px -1px",[17,2517,2518],{},"z-index: 1",[195,2520,2521,2524],{},[210,2522,2523],{},"未选中 hover",[210,2525,2526,2529,2530,2533],{},[17,2527,2528],{},"rgba(0, 0, 0, 0.04)","（令牌 ",[17,2531,2532],{},"rgba(0, 0, 0, 0.039)","，Chrome 序列化成 0.04）",[195,2535,2536,2539],{},[210,2537,2538],{},"焦点矩形",[210,2540,2541,2542,20,2545,20,2548,2551,2552],{},"tab 上 ",[17,2543,2544],{},"outline: 2px solid rgb(0,0,0)",[17,2546,2547],{},"outline-offset: 1px",[17,2549,2550],{},"box-shadow: rgb(255,255,255) 0 0 0 1px","；roving 下聚焦项 ",[17,2553,2554],{},"tabindex=0",[195,2556,2557,2561],{},[210,2558,2559],{},[17,2560,728],{},[210,2562,2563,2564,2567],{},"选中 ",[17,2565,2566],{},"0 → 1","，焦点仍停在 tab 条（只改选中、不动焦点）",[195,2569,2570,2573],{},[210,2571,2572],{},"溢出（480px \u002F 10 个 tab）",[210,2574,2575,2576,2578,2579,2582,2583,2586,2587,2589,2590,1255,2592,2594],{},"单 tab ",[17,2577,508],{},"；两个滚动按钮可见且 ",[17,2580,2581],{},"aria-hidden=true","；点「向前」",[17,2584,2585],{},"scrollLeft +50","；到右端后「向前」",[17,2588,1514],{},"、「向后」可用；按住「向前」会连续滚动（按下即滚一次，",[17,2591,1254],{},[17,2593,1258],{}," 一次，到右端自停）",[195,2596,2597,2600],{},[210,2598,2599],{},"溢出时不画滚动条（有头 Chromium，经典滚动条）",[210,2601,2602,2603,614,2606,660,2609,2614,2615,2617,2618,614,2622,2625,2626,2628,2629,614,2632,2635,2636,2639],{},"修前 ",[17,2604,2605],{},"scroller.offsetHeight - clientHeight = 15",[17,2607,2608],{},".fui-tab-view__strip-row",[26,2610,2611],{},[17,2612,2613],{},"55","、单 tab 仍 ",[17,2616,495],{},"；隐藏原生滚动条后行高 ",[26,2619,2620],{},[17,2621,1325],{},[17,2623,2624],{},"offsetHeight - clientHeight = 0","、tab ",[17,2627,495],{},"，且 ",[17,2630,2631],{},"scrollWidth (998) > clientWidth (355)",[17,2633,2634],{},"scrollBy(50)"," \u002F Shift + 滚轮 仍生效 —— 测量方法：",[17,2637,2638],{},"chromium.launch({ headless: false })","（overlay 滚动条环境复现不出该 15px，必须用经典滚动条）",[195,2641,2642,2645],{},[210,2643,2644],{},"宽度模式",[210,2646,2647,2649,2650,2652,2653,2656,2657,2659],{},[17,2648,1108],{}," 宽度小于 Equal（按内容收紧）；",[17,2651,1123],{}," 未选中项 header ",[17,2654,2655],{},"display: none","、图标盒 ",[17,2658,542],{},"、选中项仍显示文本",[195,2661,2662,2665],{},[210,2663,2664],{},"可关闭性 \u002F 叠加模式",[210,2666,2667,2670,2671,2673,2674,415,2677,2679],{},[17,2668,2669],{},"isClosable=false"," 无关闭按钮；",[17,2672,1514],{}," 项 ",[17,2675,2676],{},"aria-disabled=true",[17,2678,1622],{}," 未悬停时无按钮、悬停后出现",[195,2681,2682,2685],{},[210,2683,2684],{},"关闭链路",[210,2686,2687,2688,2690],{},"点选中项后 ",[17,2689,702],{}," ⇒ 消费方删掉该项（3 → 2），且仍有选中项（向后环形迁移）",[195,2692,2693,2696],{},[210,2694,2695],{},"面板",[210,2697,2698,2699],{},"只有选中面板有内容，其余带 ",[17,2700,2701],{},"hidden",[195,2703,2704,2707],{},[210,2705,2706],{},"暗色",[210,2708,2709,2710,2713,2714,2717],{},"选中填充 ",[17,2711,2712],{},"rgb(40, 40, 40)","、前景 ",[17,2715,2716],{},"rgb(255, 255, 255)","、未选中透明",[260,2719,2720],{},[14,2721,2722,2725,2726,2729,2730,2733,2734,2737,2738,2740,2741,2744,2745,2748],{},[26,2723,2724],{},"实测抓到的两个真 bug","（数值断言当时全绿，只有浏览器暴露）：\n① 模板里的 kebab-case 属性（",[17,2727,2728],{},":is-closable=\"false\"","）在",[26,2731,2732],{},"原始 vnode props"," 里的键就是 ",[17,2735,2736],{},"is-closable","，只认 camelCase 会把 ",[17,2739,2322],{}," 当「没传」⇒ 关闭按钮照常渲染（见 ",[17,2742,2743],{},"collection.ts#readProp","）；\n② 选中背景是定位伪元素，按绘制次序会盖住常规流里的图标与文本 ⇒ 选中项整片纯色（现已把内容提升到同一层级，",[17,2746,2747],{},"elementFromPoint"," 断言守住）。",[185,2750,2751],{"id":2751},"实现要点与证据缺口",[838,2753,2754,2775,2788,2805],{},[841,2755,2756,350,2759,2762,2763,2766,2767,2770,2771,2774],{},[26,2757,2758],{},"子项收集在渲染期完成",[17,2760,2761],{},"collection.ts","）：",[17,2764,2765],{},"provide\u002Finject"," 注册式收集要等后代 ",[17,2768,2769],{},"setup()","，SSR 直出会缺整条 tab 条；这里在父组件渲染期直接读子 vnode 的 props \u002F slots（等价 React 的 ",[17,2772,2773],{},"cloneElement","），一次渲染得到完整列表。",[841,2776,2777,350,2780,2783,2784,2787],{},[26,2778,2779],{},"选中解析是纯函数",[17,2781,2782],{},"resolveSelectedIndex","）：渲染期不写响应式状态，SSR 与水合一致；迁移结果在 ",[17,2785,2786],{},"onUpdated"," 里回填 \u002F 抛回。",[841,2789,2790,1275,2793,2796,2797,2800,2801,2804],{},[26,2791,2792],{},"Equal 宽度在代码里量",[17,2794,2795],{},"UpdateTabWidths"," 也是这么做的（CSS 无法表达：scroller 宽度由内容决定，",[17,2798,2799],{},"flex: 1 1 0"," 会形成循环依赖）。量到之前 CSS 退回 ",[17,2802,2803],{},"inline-size: auto","（仍受 min \u002F max 夹持）。",[841,2806,2807,2810,2811,20,2814,2817,2818,350,2821,2824,2825,1263,2827,2829,2830,2833,2834,2837,2838,2841,2842,2844],{},[26,2808,2809],{},"证据缺口","：① 选中背景的路径真值由 ",[17,2812,2813],{},"StringCchPrintf",[17,2815,2816],{},"XamlReader::Load"," 运行时生成，仓库里没有可对照的实例字符串；② 三个 ",[17,2819,2820],{},"ThemeTransition",[17,2822,2823],{},"AddDeleteThemeTransition"," 等）与拖拽主题动画的时长 \u002F 关键帧不在控件目录内；③ 高对比度色板全部来自系统运行时；④ ",[17,2826,436],{},[17,2828,1842],{}," → ",[17,2831,2832],{},"Brush"," 隐式转换未证实；⑤ 上游键盘测试 ",[17,2835,2836],{},"TabViewTests.KeyboardTest"," 被标记 ",[17,2839,2840],{},"Ignore","（#7546），",[17,2843,782],{}," 一类语义只能当参考。",[2846,2847,2848],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}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 .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":38,"searchDepth":88,"depth":88,"links":2850},[2851,2852,2853,2854,2855,2857,2858,2859,2860,2864,2865],{"id":187,"depth":88,"text":187},{"id":309,"depth":88,"text":309},{"id":653,"depth":88,"text":654},{"id":836,"depth":88,"text":836},{"id":1061,"depth":88,"text":2856},"宽度模式（tabWidthMode）",{"id":1219,"depth":88,"text":1219},{"id":1423,"depth":88,"text":1423},{"id":1713,"depth":88,"text":1714},{"id":1876,"depth":88,"text":1877,"children":2861},[2862,2863],{"id":1881,"depth":94,"text":19},{"id":2241,"depth":94,"text":23},{"id":2418,"depth":88,"text":2419},{"id":2751,"depth":88,"text":2751},"选项卡容器：等宽 \u002F 按内容 \u002F 折叠三种宽度模式，tab 条可溢出滚动、每项可关闭，键位与焦点表现对齐 WinUI TabView。","md",{},{"title":5},true,"\u002Fcomponents\u002Ftab-view",{"title":5,"description":2866},"components\u002Ftab-view","F39lahqzOlzpWxe0M2oqN625rXVwF6sU_q5mUeZidTE",null,1792150927905]