[{"data":1,"prerenderedAt":3566},["ShallowReactive",2],{"content-\u002Fen\u002Fcomponents\u002Fnumber-box":3,"content-en-fallback-\u002Fen\u002Fcomponents\u002Fnumber-box":1909},{"id":4,"title":5,"body":6,"description":1900,"extension":1901,"meta":1902,"nav":1903,"navigation":1904,"path":1905,"seo":1906,"stem":1907,"__hash__":1908},"content_en\u002Fen\u002Fcomponents\u002Fnumber-box.md","NumberBox",{"type":7,"value":8,"toc":1889},"minimark",[9,13,34,52,102,107,125,220,224,271,396,407,411,457,589,673,677,707,768,772,781,797,809,944,948,972,1010,1105,1108,1199,1203,1222,1285,1289,1708,1758,1795,1885],[10,11,5],"h1",{"id":12},"numberbox",[14,15,16,17,20,21,29,30,33],"p",{},"The NumberBox lets users enter and adjust numbers (quantity, price, tax rate, font size…). Its style and behavior reproduce the WinUI 3 (Windows App SDK) ",[18,19,5],"strong",{},": it is essentially a ",[18,22,23,24,28],{},"TextBox + math parsing + ",[25,26,27],"code",{},"NaN"," semantics",", so this component embeds ",[25,31,32],{},"FluereInput"," (consistent with the embedded TextBox in the WinUI template) and implements WinUI's value-handling semantics, validation modes, spin buttons and inline expressions.",[14,35,36,37,40,41,44,45,47,48,51],{},"Values follow WinUI's ",[18,38,39],{},"Value ↔ Text dual channel",": when the value changes, the formatted text is written back to the input box; on blur or Enter, the text is parsed and the value updated. Clearing the input box yields ",[25,42,43],{},"null"," (corresponding to WinUI's ",[25,46,27],{},"), at which point ",[25,49,50],{},"placeholder"," is shown.",[53,54,55],"blockquote",{},[14,56,57,58,61,62,65,66,69,70,73,74,77,78,81,82,73,85,73,88,73,91,94,95,73,98,101],{},"Difference from the original plan in ",[25,59,60],{},"docs\u002Ftodo.md",": reuse of reka-ui's ",[25,63,64],{},"NumberField"," was originally planned, but its ",[25,67,68],{},"NumberFieldInput"," has a few hard conflicts with WinUI — ",[25,71,72],{},"Home"," \u002F ",[25,75,76],{},"End"," are mapped to min \u002F max (WinUI leaves them to the TextBox to move the caret), invalid input clears the value on blur (WinUI keeps the original value), arrow keys snap to the step (WinUI adds directly), the wheel direction is reversed, and ",[25,79,80],{},"LargeChange"," is hardcoded to 10 steps. Here the \"reuse\" approach is kept but re-implemented as a self-contained implementation: the ",[25,83,84],{},"format",[25,86,87],{},"parse",[25,89,90],{},"expression",[25,92,93],{},"step"," four pure-function layers plus the ",[25,96,97],{},"use-number-box",[25,99,100],{},"use-spin-repeat"," two hooks, each unit-testable independently.",[103,104,106],"h2",{"id":105},"basic-usage","Basic usage",[14,108,109,112,113,116,117,120,121,124],{},[25,110,111],{},"v-model"," binds the numeric value, ",[25,114,115],{},"header"," is WinUI's title row (also the default accessible name), and ",[25,118,119],{},"description"," renders below the control and acts as ",[25,122,123],{},"aria-describedby",".",[126,127,128,135],"demo-block",{"title":106},[129,130,132],"template",{"v-slot:preview":131},"",[133,134],"number-box-basic-demo",{},[129,136,137],{"v-slot:code":131},[138,139,143],"pre",{"className":140,"code":141,"language":142,"meta":131,"style":131},"language-vue shiki shiki-themes github-light github-dark","\u003CFluereNumberBox v-model=\"quantity\" header=\"Quantity\" \u002F>\n\u003CFluereNumberBox v-model=\"price\" header=\"Unit price\" description=\"Supports decimals\" \u002F>\n","vue",[25,144,145,185],{"__ignoreMap":131},[146,147,150,154,158,162,165,169,172,174,177,179,182],"span",{"class":148,"line":149},"line",1,[146,151,153],{"class":152},"sVt8B","\u003C",[146,155,157],{"class":156},"s9eBZ","FluereNumberBox",[146,159,161],{"class":160},"sScJk"," v-model",[146,163,164],{"class":152},"=",[146,166,168],{"class":167},"sZZnC","\"",[146,170,171],{"class":152},"quantity",[146,173,168],{"class":167},[146,175,176],{"class":160}," header",[146,178,164],{"class":152},[146,180,181],{"class":167},"\"Quantity\"",[146,183,184],{"class":152}," \u002F>\n",[146,186,188,190,192,194,196,198,201,203,205,207,210,213,215,218],{"class":148,"line":187},2,[146,189,153],{"class":152},[146,191,157],{"class":156},[146,193,161],{"class":160},[146,195,164],{"class":152},[146,197,168],{"class":167},[146,199,200],{"class":152},"price",[146,202,168],{"class":167},[146,204,176],{"class":160},[146,206,164],{"class":152},[146,208,209],{"class":167},"\"Unit price\"",[146,211,212],{"class":160}," description",[146,214,164],{"class":152},[146,216,217],{"class":167},"\"Supports decimals\"",[146,219,184],{"class":152},[103,221,223],{"id":222},"range-and-step","Range and step",[14,225,226,73,229,232,233,73,236,239,240,73,243,246,247,249,250,253,254,249,257,259,260,73,263,266,267,270],{},[25,227,228],{},"min",[25,230,231],{},"max"," map to ",[25,234,235],{},"Minimum",[25,237,238],{},"Maximum"," (by default no bounds are set, in which case ",[25,241,242],{},"aria-valuemin",[25,244,245],{},"aria-valuemax"," are not rendered); ",[25,248,93],{}," is ",[25,251,252],{},"SmallChange"," (arrow keys \u002F wheel \u002F spin buttons), ",[25,255,256],{},"largeStep",[25,258,80],{}," (",[25,261,262],{},"PageUp",[25,264,265],{},"PageDown","). Consistent with WinUI: ",[18,268,269],{},"no step snapping",", values are only clamped (or wrapped) when out of range.",[126,272,273,278],{"title":223},[129,274,275],{"v-slot:preview":131},[276,277],"number-box-step-demo",{},[129,279,280],{"v-slot:code":131},[138,281,283],{"className":140,"code":282,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"quantity\"\n  :min=\"0\"\n  :max=\"500\"\n  :step=\"10\"\n  :large-step=\"100\"\n  header=\"Quantity\"\n\u002F>\n\u003CFluereNumberBox v-model=\"ratio\" :min=\"0\" :max=\"1\" :step=\"0.1\" header=\"Ratio\" \u002F>\n",[25,284,285,292,306,324,340,356,373,384,390],{"__ignoreMap":131},[146,286,287,289],{"class":148,"line":149},[146,288,153],{"class":152},[146,290,291],{"class":156},"FluereNumberBox\n",[146,293,294,297,299,301,303],{"class":148,"line":187},[146,295,296],{"class":160},"  v-model",[146,298,164],{"class":152},[146,300,168],{"class":167},[146,302,171],{"class":152},[146,304,305],{"class":167},"\"\n",[146,307,309,312,314,316,318,322],{"class":148,"line":308},3,[146,310,311],{"class":152},"  :",[146,313,228],{"class":160},[146,315,164],{"class":152},[146,317,168],{"class":167},[146,319,321],{"class":320},"sj4cs","0",[146,323,305],{"class":167},[146,325,327,329,331,333,335,338],{"class":148,"line":326},4,[146,328,311],{"class":152},[146,330,231],{"class":160},[146,332,164],{"class":152},[146,334,168],{"class":167},[146,336,337],{"class":320},"500",[146,339,305],{"class":167},[146,341,343,345,347,349,351,354],{"class":148,"line":342},5,[146,344,311],{"class":152},[146,346,93],{"class":160},[146,348,164],{"class":152},[146,350,168],{"class":167},[146,352,353],{"class":320},"10",[146,355,305],{"class":167},[146,357,359,361,364,366,368,371],{"class":148,"line":358},6,[146,360,311],{"class":152},[146,362,363],{"class":160},"large-step",[146,365,164],{"class":152},[146,367,168],{"class":167},[146,369,370],{"class":320},"100",[146,372,305],{"class":167},[146,374,376,379,381],{"class":148,"line":375},7,[146,377,378],{"class":160},"  header",[146,380,164],{"class":152},[146,382,383],{"class":167},"\"Quantity\"\n",[146,385,387],{"class":148,"line":386},8,[146,388,389],{"class":152},"\u002F>\n",[146,391,393],{"class":148,"line":392},9,[146,394,395],{"class":152},"\u003CFluereNumberBox v-model=\"ratio\" :min=\"0\" :max=\"1\" :step=\"0.1\" header=\"Ratio\" \u002F>\n",[14,397,398,399,402,403,406],{},"Pass ",[25,400,401],{},"wrap-enabled"," for ",[25,404,405],{},"IsWrapEnabled",": after reaching an endpoint the value wraps around to the other end, and both buttons stay usable.",[103,408,410],{"id":409},"spin-buttons","Spin buttons",[14,412,413,416,417,420,421,424,425,428,429,432,433,435,436,439,440,73,443,446,447,450,451,73,454,124],{},[25,414,415],{},"spinButtonPlacementMode"," maps to ",[25,418,419],{},"SpinButtonPlacementMode",": ",[25,422,423],{},"hidden"," (default) \u002F ",[25,426,427],{},"inline"," (up\u002Fdown buttons inline to the right of the input box) \u002F ",[25,430,431],{},"compact"," (a button panel floats up on focus). ",[25,434,427],{}," shares a TextBox border with the input box; the buttons are 32×24, margin 4, corner radius 4; holding a button steps once immediately, then repeats every 250ms (the WinUI ",[25,437,438],{},"RepeatButton"," ",[25,441,442],{},"Delay",[25,444,445],{},"Interval"," defaults). Buttons never enter the Tab sequence (WinUI ",[25,448,449],{},"IsTabStop=False",") but can be activated with ",[25,452,453],{},"Enter",[25,455,456],{},"Space",[126,458,460,465],{"title":459},"Inline buttons",[129,461,462],{"v-slot:preview":131},[463,464],"number-box-inline-demo",{},[129,466,467],{"v-slot:code":131},[138,468,470],{"className":140,"code":469,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"fontSize\"\n  :min=\"9\"\n  :max=\"72\"\n  spin-button-placement-mode=\"inline\"\n  header=\"Font size\"\n\u002F>\n\u003CFluereNumberBox\n  v-model=\"zoom\"\n  :min=\"0.5\"\n  :max=\"3\"\n  :step=\"0.25\"\n  spin-button-placement-mode=\"inline\"\n  header=\"Zoom\"\n\u002F>\n",[25,471,472,478,491,506,521,531,540,544,549,554,560,566,572,578,584],{"__ignoreMap":131},[146,473,474,476],{"class":148,"line":149},[146,475,153],{"class":152},[146,477,291],{"class":156},[146,479,480,482,484,486,489],{"class":148,"line":187},[146,481,296],{"class":160},[146,483,164],{"class":152},[146,485,168],{"class":167},[146,487,488],{"class":152},"fontSize",[146,490,305],{"class":167},[146,492,493,495,497,499,501,504],{"class":148,"line":308},[146,494,311],{"class":152},[146,496,228],{"class":160},[146,498,164],{"class":152},[146,500,168],{"class":167},[146,502,503],{"class":320},"9",[146,505,305],{"class":167},[146,507,508,510,512,514,516,519],{"class":148,"line":326},[146,509,311],{"class":152},[146,511,231],{"class":160},[146,513,164],{"class":152},[146,515,168],{"class":167},[146,517,518],{"class":320},"72",[146,520,305],{"class":167},[146,522,523,526,528],{"class":148,"line":342},[146,524,525],{"class":160},"  spin-button-placement-mode",[146,527,164],{"class":152},[146,529,530],{"class":167},"\"inline\"\n",[146,532,533,535,537],{"class":148,"line":358},[146,534,378],{"class":160},[146,536,164],{"class":152},[146,538,539],{"class":167},"\"Font size\"\n",[146,541,542],{"class":148,"line":375},[146,543,389],{"class":152},[146,545,546],{"class":148,"line":386},[146,547,548],{"class":152},"\u003CFluereNumberBox\n",[146,550,551],{"class":148,"line":392},[146,552,553],{"class":152},"  v-model=\"zoom\"\n",[146,555,557],{"class":148,"line":556},10,[146,558,559],{"class":152},"  :min=\"0.5\"\n",[146,561,563],{"class":148,"line":562},11,[146,564,565],{"class":152},"  :max=\"3\"\n",[146,567,569],{"class":148,"line":568},12,[146,570,571],{"class":152},"  :step=\"0.25\"\n",[146,573,575],{"class":148,"line":574},13,[146,576,577],{"class":152},"  spin-button-placement-mode=\"inline\"\n",[146,579,581],{"class":148,"line":580},14,[146,582,583],{"class":152},"  header=\"Zoom\"\n",[146,585,587],{"class":148,"line":586},15,[146,588,389],{"class":152},[126,590,592,597],{"title":591},"Compact buttons",[129,593,594],{"v-slot:preview":131},[595,596],"number-box-compact-demo",{},[129,598,599],{"v-slot:code":131},[138,600,602],{"className":140,"code":601,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"opacity\"\n  :min=\"0\"\n  :max=\"100\"\n  spin-button-placement-mode=\"compact\"\n  header=\"Opacity\"\n\u002F>\n",[25,603,604,610,623,637,651,660,669],{"__ignoreMap":131},[146,605,606,608],{"class":148,"line":149},[146,607,153],{"class":152},[146,609,291],{"class":156},[146,611,612,614,616,618,621],{"class":148,"line":187},[146,613,296],{"class":160},[146,615,164],{"class":152},[146,617,168],{"class":167},[146,619,620],{"class":152},"opacity",[146,622,305],{"class":167},[146,624,625,627,629,631,633,635],{"class":148,"line":308},[146,626,311],{"class":152},[146,628,228],{"class":160},[146,630,164],{"class":152},[146,632,168],{"class":167},[146,634,321],{"class":320},[146,636,305],{"class":167},[146,638,639,641,643,645,647,649],{"class":148,"line":326},[146,640,311],{"class":152},[146,642,231],{"class":160},[146,644,164],{"class":152},[146,646,168],{"class":167},[146,648,370],{"class":320},[146,650,305],{"class":167},[146,652,653,655,657],{"class":148,"line":342},[146,654,525],{"class":160},[146,656,164],{"class":152},[146,658,659],{"class":167},"\"compact\"\n",[146,661,662,664,666],{"class":148,"line":358},[146,663,378],{"class":160},[146,665,164],{"class":152},[146,667,668],{"class":167},"\"Opacity\"\n",[146,670,671],{"class":148,"line":375},[146,672,389],{"class":152},[103,674,676],{"id":675},"inline-expressions","Inline expressions",[14,678,679,416,682,685,686,689,690,693,694,439,697,693,700,439,703,706],{},[25,680,681],{},"accepts-expression",[25,683,684],{},"AcceptsExpression",": on blur or Enter it evaluates expressions composed of ",[25,687,688],{},"+ - * \u002F ^"," and parentheses, with precedence ",[25,691,692],{},"^"," > ",[25,695,696],{},"*",[25,698,699],{},"\u002F",[25,701,702],{},"+",[25,704,705],{},"-",". After evaluation the raw expression is not preserved (it is replaced by the result).",[126,708,709,714],{"title":676},[129,710,711],{"v-slot:preview":131},[712,713],"number-box-expression-demo",{},[129,715,716],{"v-slot:code":131},[138,717,719],{"className":140,"code":718,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"total\"\n  accepts-expression\n  placeholder=\"e.g. (2+3)*4^2\"\n  header=\"Computed value\"\n\u002F>\n",[25,720,721,727,740,745,755,764],{"__ignoreMap":131},[146,722,723,725],{"class":148,"line":149},[146,724,153],{"class":152},[146,726,291],{"class":156},[146,728,729,731,733,735,738],{"class":148,"line":187},[146,730,296],{"class":160},[146,732,164],{"class":152},[146,734,168],{"class":167},[146,736,737],{"class":152},"total",[146,739,305],{"class":167},[146,741,742],{"class":148,"line":308},[146,743,744],{"class":160},"  accepts-expression\n",[146,746,747,750,752],{"class":148,"line":326},[146,748,749],{"class":160},"  placeholder",[146,751,164],{"class":152},[146,753,754],{"class":167},"\"e.g. (2+3)*4^2\"\n",[146,756,757,759,761],{"class":148,"line":342},[146,758,378],{"class":160},[146,760,164],{"class":152},[146,762,763],{"class":167},"\"Computed value\"\n",[146,765,766],{"class":148,"line":358},[146,767,389],{"class":152},[103,769,771],{"id":770},"validation-modes","Validation modes",[14,773,774,416,777,780],{},[25,775,776],{},"validationMode",[25,778,779],{},"ValidationMode",":",[782,783,784,791],"ul",{},[785,786,787,790],"li",{},[25,788,789],{},"invalidInputOverwritten"," (default): on blur \u002F Enter, invalid input is overwritten by the formatted text of the current value, and out-of-range values are clamped back into the range;",[785,792,793,796],{},[25,794,795],{},"disabled",": keeps the user's input and out-of-range values, leaving validation to the consumer.",[14,798,799,802,803,805,806,808],{},[25,800,801],{},"Escape"," always discards the input and returns to the current value; ",[25,804,453],{}," commits the input (and swallows the key to avoid triggering an implicit form submission, matching how WinUI handles ",[25,807,453],{},").",[126,810,811,816],{"title":771},[129,812,813],{"v-slot:preview":131},[814,815],"number-box-validation-demo",{},[129,817,818],{"v-slot:code":131},[138,819,821],{"className":140,"code":820,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox v-model=\"strict\" :min=\"0\" :max=\"100\" header=\"Default: invalid input overwritten\" \u002F>\n\u003CFluereNumberBox\n  v-model=\"lenient\"\n  :min=\"0\"\n  :max=\"100\"\n  validation-mode=\"disabled\"\n  header=\"Keep input\"\n\u002F>\n",[25,822,823,874,880,893,907,921,931,940],{"__ignoreMap":131},[146,824,825,827,829,831,833,835,838,840,843,845,847,849,851,853,855,857,859,861,863,865,867,869,872],{"class":148,"line":149},[146,826,153],{"class":152},[146,828,157],{"class":156},[146,830,161],{"class":160},[146,832,164],{"class":152},[146,834,168],{"class":167},[146,836,837],{"class":152},"strict",[146,839,168],{"class":167},[146,841,842],{"class":152}," :",[146,844,228],{"class":160},[146,846,164],{"class":152},[146,848,168],{"class":167},[146,850,321],{"class":320},[146,852,168],{"class":167},[146,854,842],{"class":152},[146,856,231],{"class":160},[146,858,164],{"class":152},[146,860,168],{"class":167},[146,862,370],{"class":320},[146,864,168],{"class":167},[146,866,176],{"class":160},[146,868,164],{"class":152},[146,870,871],{"class":167},"\"Default: invalid input overwritten\"",[146,873,184],{"class":152},[146,875,876,878],{"class":148,"line":187},[146,877,153],{"class":152},[146,879,291],{"class":156},[146,881,882,884,886,888,891],{"class":148,"line":308},[146,883,296],{"class":160},[146,885,164],{"class":152},[146,887,168],{"class":167},[146,889,890],{"class":152},"lenient",[146,892,305],{"class":167},[146,894,895,897,899,901,903,905],{"class":148,"line":326},[146,896,311],{"class":152},[146,898,228],{"class":160},[146,900,164],{"class":152},[146,902,168],{"class":167},[146,904,321],{"class":320},[146,906,305],{"class":167},[146,908,909,911,913,915,917,919],{"class":148,"line":342},[146,910,311],{"class":152},[146,912,231],{"class":160},[146,914,164],{"class":152},[146,916,168],{"class":167},[146,918,370],{"class":320},[146,920,305],{"class":167},[146,922,923,926,928],{"class":148,"line":358},[146,924,925],{"class":160},"  validation-mode",[146,927,164],{"class":152},[146,929,930],{"class":167},"\"disabled\"\n",[146,932,933,935,937],{"class":148,"line":375},[146,934,378],{"class":160},[146,936,164],{"class":152},[146,938,939],{"class":167},"\"Keep input\"\n",[146,941,942],{"class":148,"line":386},[146,943,389],{"class":152},[103,945,947],{"id":946},"formatting-and-locale","Formatting and locale",[14,949,950,259,953,956,957,960,961,964,965,968,969,971],{},[25,951,952],{},"formatOptions",[25,954,955],{},"Intl.NumberFormatOptions",") maps to ",[25,958,959],{},"NumberFormatter",", and ",[25,962,963],{},"locale"," determines the decimal point \u002F group separators \u002F minus sign — ",[18,966,967],{},"display and parsing share the same set of symbols",". SSR apps are recommended to pass ",[25,970,963],{}," explicitly: by default the runtime's default locale is used, but the server and browser defaults may differ (e.g. the de-DE decimal point), producing a hydration mismatch on the first frame.",[14,973,974,975,978,979,982,983,986,987,994,995,998,999,1002,1003,1006,1007,124],{},"WinUI's default ",[25,976,977],{},"DecimalFormatter"," is set to ",[25,980,981],{},"IntegerDigits(1)"," + ",[25,984,985],{},"FractionDigits(0)",", which on several WinAppSDK versions rounds the displayed value to an integer (",[988,989,993],"a",{"href":990,"rel":991},"https:\u002F\u002Fgithub.com\u002Fmicrosoft\u002Fmicrosoft-ui-xaml\u002Fissues\u002F8780",[992],"nofollow","microsoft\u002Fmicrosoft-ui-xaml#8780",": entering 25.8 shows 26 after blur). On the web side decimals are not dropped by default (",[25,996,997],{},"maximumFractionDigits: 20","), otherwise a usage such as ",[25,1000,1001],{},"step = 0.1"," becomes unusable at the display layer; pass ",[25,1004,1005],{},":format-options=\"{ maximumFractionDigits: 0 }\""," to get WinUI's integer look. Before display, a WinUI-style 10-significant-digit rounding is also applied to wipe out floating-point noise such as ",[25,1008,1009],{},"0.1 + 0.2 = 0.30000000000000004",[126,1011,1012,1017],{"title":947},[129,1013,1014],{"v-slot:preview":131},[1015,1016],"number-box-format-demo",{},[129,1018,1019],{"v-slot:code":131},[138,1020,1022],{"className":140,"code":1021,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"integer\"\n  :format-options=\"{ maximumFractionDigits: 0 }\"\n  header=\"Integer appearance\"\n\u002F>\n\u003CFluereNumberBox\n  v-model=\"fixed\"\n  :format-options=\"{ minimumFractionDigits: 2, maximumFractionDigits: 2 }\"\n  header=\"Fixed two decimal places\"\n\u002F>\n\u003CFluereNumberBox v-model=\"german\" locale=\"de-DE\" header=\"de-DE: 1.234,5\" \u002F>\n",[25,1023,1024,1030,1043,1064,1073,1077,1081,1086,1091,1096,1100],{"__ignoreMap":131},[146,1025,1026,1028],{"class":148,"line":149},[146,1027,153],{"class":152},[146,1029,291],{"class":156},[146,1031,1032,1034,1036,1038,1041],{"class":148,"line":187},[146,1033,296],{"class":160},[146,1035,164],{"class":152},[146,1037,168],{"class":167},[146,1039,1040],{"class":152},"integer",[146,1042,305],{"class":167},[146,1044,1045,1047,1050,1052,1054,1057,1059,1062],{"class":148,"line":308},[146,1046,311],{"class":152},[146,1048,1049],{"class":160},"format-options",[146,1051,164],{"class":152},[146,1053,168],{"class":167},[146,1055,1056],{"class":152},"{ maximumFractionDigits: ",[146,1058,321],{"class":320},[146,1060,1061],{"class":152}," }",[146,1063,305],{"class":167},[146,1065,1066,1068,1070],{"class":148,"line":326},[146,1067,378],{"class":160},[146,1069,164],{"class":152},[146,1071,1072],{"class":167},"\"Integer appearance\"\n",[146,1074,1075],{"class":148,"line":342},[146,1076,389],{"class":152},[146,1078,1079],{"class":148,"line":358},[146,1080,548],{"class":152},[146,1082,1083],{"class":148,"line":375},[146,1084,1085],{"class":152},"  v-model=\"fixed\"\n",[146,1087,1088],{"class":148,"line":386},[146,1089,1090],{"class":152},"  :format-options=\"{ minimumFractionDigits: 2, maximumFractionDigits: 2 }\"\n",[146,1092,1093],{"class":148,"line":392},[146,1094,1095],{"class":152},"  header=\"Fixed two decimal places\"\n",[146,1097,1098],{"class":148,"line":556},[146,1099,389],{"class":152},[146,1101,1102],{"class":148,"line":562},[146,1103,1104],{"class":152},"\u003CFluereNumberBox v-model=\"german\" locale=\"de-DE\" header=\"de-DE: 1.234,5\" \u002F>\n",[103,1106,1107],{"id":795},"Disabled",[126,1109,1111,1116],{"title":1110},"Disabled state",[129,1112,1113],{"v-slot:preview":131},[1114,1115],"number-box-disabled-demo",{},[129,1117,1118],{"v-slot:code":131},[138,1119,1121],{"className":140,"code":1120,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  :model-value=\"35\"\n  :min=\"0\"\n  :max=\"100\"\n  disabled\n  spin-button-placement-mode=\"inline\"\n  header=\"Disabled\"\n\u002F>\n",[25,1122,1123,1129,1145,1159,1173,1178,1186,1195],{"__ignoreMap":131},[146,1124,1125,1127],{"class":148,"line":149},[146,1126,153],{"class":152},[146,1128,291],{"class":156},[146,1130,1131,1133,1136,1138,1140,1143],{"class":148,"line":187},[146,1132,311],{"class":152},[146,1134,1135],{"class":160},"model-value",[146,1137,164],{"class":152},[146,1139,168],{"class":167},[146,1141,1142],{"class":320},"35",[146,1144,305],{"class":167},[146,1146,1147,1149,1151,1153,1155,1157],{"class":148,"line":308},[146,1148,311],{"class":152},[146,1150,228],{"class":160},[146,1152,164],{"class":152},[146,1154,168],{"class":167},[146,1156,321],{"class":320},[146,1158,305],{"class":167},[146,1160,1161,1163,1165,1167,1169,1171],{"class":148,"line":326},[146,1162,311],{"class":152},[146,1164,231],{"class":160},[146,1166,164],{"class":152},[146,1168,168],{"class":167},[146,1170,370],{"class":320},[146,1172,305],{"class":167},[146,1174,1175],{"class":148,"line":342},[146,1176,1177],{"class":160},"  disabled\n",[146,1179,1180,1182,1184],{"class":148,"line":358},[146,1181,525],{"class":160},[146,1183,164],{"class":152},[146,1185,530],{"class":167},[146,1187,1188,1190,1192],{"class":148,"line":375},[146,1189,378],{"class":160},[146,1191,164],{"class":152},[146,1193,1194],{"class":167},"\"Disabled\"\n",[146,1196,1197],{"class":148,"line":386},[146,1198,389],{"class":152},[103,1200,1202],{"id":1201},"form-submission","Form submission",[14,1204,1205,1206,1209,1210,1213,1214,1217,1218,1221],{},"When placed inside a ",[25,1207,1208],{},"\u003Cform>"," with a ",[25,1211,1212],{},"name",", it adds a hidden native ",[25,1215,1216],{},"\u003Cinput type=\"hidden\">"," submitting ",[25,1219,1220],{},"name=value"," (an empty string when there is no value).",[126,1223,1224,1229],{"title":1202},[129,1225,1226],{"v-slot:preview":131},[1227,1228],"number-box-form-demo",{},[129,1230,1231],{"v-slot:code":131},[138,1232,1234],{"className":140,"code":1233,"language":142,"meta":131,"style":131},"\u003Cform @submit.prevent=\"onSubmit\">\n  \u003CFluereNumberBox v-model=\"amount\" name=\"amount\" :min=\"0\" :step=\"8\" spin-button-placement-mode=\"inline\" header=\"Amount\" \u002F>\n  \u003CFluereButton type=\"submit\" appearance=\"primary\">Submit\u003C\u002FFluereButton>\n\u003C\u002Fform>\n",[25,1235,1236,1266,1271,1276],{"__ignoreMap":131},[146,1237,1238,1240,1243,1246,1249,1251,1254,1256,1258,1261,1263],{"class":148,"line":149},[146,1239,153],{"class":152},[146,1241,1242],{"class":156},"form",[146,1244,1245],{"class":152}," @",[146,1247,1248],{"class":160},"submit",[146,1250,124],{"class":152},[146,1252,1253],{"class":160},"prevent",[146,1255,164],{"class":152},[146,1257,168],{"class":167},[146,1259,1260],{"class":152},"onSubmit",[146,1262,168],{"class":167},[146,1264,1265],{"class":152},">\n",[146,1267,1268],{"class":148,"line":187},[146,1269,1270],{"class":152},"  \u003CFluereNumberBox v-model=\"amount\" name=\"amount\" :min=\"0\" :step=\"8\" spin-button-placement-mode=\"inline\" header=\"Amount\" \u002F>\n",[146,1272,1273],{"class":148,"line":308},[146,1274,1275],{"class":152},"  \u003CFluereButton type=\"submit\" appearance=\"primary\">Submit\u003C\u002FFluereButton>\n",[146,1277,1278,1281,1283],{"class":148,"line":326},[146,1279,1280],{"class":152},"\u003C\u002F",[146,1282,1242],{"class":156},[146,1284,1265],{"class":152},[103,1286,1288],{"id":1287},"api","API",[1290,1291,1292,1311],"table",{},[1293,1294,1295],"thead",{},[1296,1297,1298,1302,1305,1308],"tr",{},[1299,1300,1301],"th",{},"Prop (Props)",[1299,1303,1304],{},"Type",[1299,1306,1307],{},"Default",[1299,1309,1310],{},"Description",[1312,1313,1314,1344,1362,1387,1407,1431,1450,1472,1492,1514,1535,1552,1569,1588,1609,1630,1650,1670,1689],"tbody",{},[1296,1315,1316,1322,1327,1332],{},[1317,1318,1319],"td",{},[25,1320,1321],{},"modelValue",[1317,1323,1324],{},[25,1325,1326],{},"number | null",[1317,1328,1329],{},[25,1330,1331],{},"—",[1317,1333,1334,1335,1337,1338,1340,1341,1343],{},"Current value (",[25,1336,111],{},"); ",[25,1339,43],{}," means no value (WinUI ",[25,1342,27],{},")",[1296,1345,1346,1351,1355,1359],{},[1317,1347,1348],{},[25,1349,1350],{},"defaultValue",[1317,1352,1353],{},[25,1354,1326],{},[1317,1356,1357],{},[25,1358,43],{},[1317,1360,1361],{},"Uncontrolled initial value",[1296,1363,1364,1370,1375,1380],{},[1317,1365,1366,73,1368],{},[25,1367,228],{},[25,1369,231],{},[1317,1371,1372],{},[25,1373,1374],{},"number",[1317,1376,1377,1379],{},[25,1378,1331],{}," (no bounds)",[1317,1381,1382,1383,73,1385,1343],{},"Range (WinUI ",[25,1384,235],{},[25,1386,238],{},[1296,1388,1389,1393,1397,1402],{},[1317,1390,1391],{},[25,1392,93],{},[1317,1394,1395],{},[25,1396,1374],{},[1317,1398,1399],{},[25,1400,1401],{},"1",[1317,1403,1404,1405,1343],{},"Step (WinUI ",[25,1406,252],{},[1296,1408,1409,1413,1417,1421],{},[1317,1410,1411],{},[25,1412,256],{},[1317,1414,1415],{},[25,1416,1374],{},[1317,1418,1419],{},[25,1420,353],{},[1317,1422,1423,1424,1426,1427,73,1429,1343],{},"Large step (WinUI ",[25,1425,80],{},", ",[25,1428,262],{},[25,1430,265],{},[1296,1432,1433,1437,1442,1447],{},[1317,1434,1435],{},[25,1436,795],{},[1317,1438,1439],{},[25,1440,1441],{},"boolean",[1317,1443,1444],{},[25,1445,1446],{},"false",[1317,1448,1449],{},"Whether the control is disabled",[1296,1451,1452,1456,1461,1465],{},[1317,1453,1454],{},[25,1455,115],{},[1317,1457,1458],{},[25,1459,1460],{},"string",[1317,1462,1463],{},[25,1464,1331],{},[1317,1466,1467,1468,1471],{},"Top title (WinUI ",[25,1469,1470],{},"Header","), also the default accessible name",[1296,1473,1474,1479,1483,1487],{},[1317,1475,1476],{},[25,1477,1478],{},"label",[1317,1480,1481],{},[25,1482,1460],{},[1317,1484,1485],{},[25,1486,1331],{},[1317,1488,1489,1490,1343],{},"Accessible name (takes precedence over ",[25,1491,115],{},[1296,1493,1494,1498,1502,1506],{},[1317,1495,1496],{},[25,1497,119],{},[1317,1499,1500],{},[25,1501,1460],{},[1317,1503,1504],{},[25,1505,1331],{},[1317,1507,1508,1509,1511,1512],{},"Description below the control (WinUI ",[25,1510,1310],{},"), also used as ",[25,1513,123],{},[1296,1515,1516,1520,1524,1528],{},[1317,1517,1518],{},[25,1519,50],{},[1317,1521,1522],{},[25,1523,1460],{},[1317,1525,1526],{},[25,1527,1331],{},[1317,1529,1530,1531,1534],{},"Placeholder (WinUI ",[25,1532,1533],{},"PlaceholderText","), shown only when there is no value",[1296,1536,1537,1541,1545,1549],{},[1317,1538,1539],{},[25,1540,1212],{},[1317,1542,1543],{},[25,1544,1460],{},[1317,1546,1547],{},[25,1548,1331],{},[1317,1550,1551],{},"Form submission name, paired with the hidden native input",[1296,1553,1554,1558,1562,1566],{},[1317,1555,1556],{},[25,1557,963],{},[1317,1559,1560],{},[25,1561,1460],{},[1317,1563,1564],{},[25,1565,1331],{},[1317,1567,1568],{},"BCP 47 language tag; determines the formatting and parsing symbols",[1296,1570,1571,1575,1579,1583],{},[1317,1572,1573],{},[25,1574,952],{},[1317,1576,1577],{},[25,1578,955],{},[1317,1580,1581],{},[25,1582,997],{},[1317,1584,1585,1586,1343],{},"Number formatting (WinUI ",[25,1587,959],{},[1296,1589,1590,1594,1599,1604],{},[1317,1591,1592],{},[25,1593,415],{},[1317,1595,1596],{},[25,1597,1598],{},"'hidden' | 'compact' | 'inline'",[1317,1600,1601],{},[25,1602,1603],{},"'hidden'",[1317,1605,1606,1607,1343],{},"Spin button presentation (WinUI ",[25,1608,419],{},[1296,1610,1611,1615,1620,1625],{},[1317,1612,1613],{},[25,1614,776],{},[1317,1616,1617],{},[25,1618,1619],{},"'invalidInputOverwritten' | 'disabled'",[1317,1621,1622],{},[25,1623,1624],{},"'invalidInputOverwritten'",[1317,1626,1627,1628,1343],{},"Validation mode (WinUI ",[25,1629,779],{},[1296,1631,1632,1637,1641,1645],{},[1317,1633,1634],{},[25,1635,1636],{},"wrapEnabled",[1317,1638,1639],{},[25,1640,1441],{},[1317,1642,1643],{},[25,1644,1446],{},[1317,1646,1647,1648,1343],{},"Wrap around at the endpoints (WinUI ",[25,1649,405],{},[1296,1651,1652,1657,1661,1665],{},[1317,1653,1654],{},[25,1655,1656],{},"acceptsExpression",[1317,1658,1659],{},[25,1660,1441],{},[1317,1662,1663],{},[25,1664,1446],{},[1317,1666,1667,1668,1343],{},"Whether inline expressions are parsed (WinUI ",[25,1669,684],{},[1296,1671,1672,1677,1681,1686],{},[1317,1673,1674],{},[25,1675,1676],{},"increaseLabel",[1317,1678,1679],{},[25,1680,1460],{},[1317,1682,1683],{},[25,1684,1685],{},"'Increase'",[1317,1687,1688],{},"Accessible name of the plus button (localized from a resource in WinUI)",[1296,1690,1691,1696,1700,1705],{},[1317,1692,1693],{},[25,1694,1695],{},"decreaseLabel",[1317,1697,1698],{},[25,1699,1460],{},[1317,1701,1702],{},[25,1703,1704],{},"'Decrease'",[1317,1706,1707],{},"Accessible name of the minus button",[1290,1709,1710,1722],{},[1293,1711,1712],{},[1296,1713,1714,1717,1720],{},[1299,1715,1716],{},"Event",[1299,1718,1719],{},"Payload",[1299,1721,1310],{},[1312,1723,1724,1740],{},[1296,1725,1726,1731,1735],{},[1317,1727,1728],{},[25,1729,1730],{},"update:modelValue",[1317,1732,1733],{},[25,1734,1326],{},[1317,1736,1737,1738,1343],{},"Value change (",[25,1739,111],{},[1296,1741,1742,1747,1752],{},[1317,1743,1744],{},[25,1745,1746],{},"valueChanged",[1317,1748,1749],{},[25,1750,1751],{},"{ oldValue: number | null, newValue: number | null }",[1317,1753,1754,1755,1343],{},"Value change (corresponds to WinUI ",[25,1756,1757],{},"ValueChanged",[1290,1759,1760,1769],{},[1293,1761,1762],{},[1296,1763,1764,1767],{},[1299,1765,1766],{},"Slot (Slots)",[1299,1768,1310],{},[1312,1770,1771,1785],{},[1296,1772,1773,1777],{},[1317,1774,1775],{},[25,1776,115],{},[1317,1778,1779,1780,73,1782,1343],{},"Top title row (WinUI ",[25,1781,1470],{},[25,1783,1784],{},"HeaderTemplate",[1296,1786,1787,1791],{},[1317,1788,1789],{},[25,1790,119],{},[1317,1792,1508,1793,1343],{},[25,1794,1310],{},[53,1796,1797,1828,1848,1858],{},[14,1798,1799,1800,1803,1804,1426,1806,73,1808,1810,1811,1426,1813,1815,1816,1818,1819,1822,1823,73,1825,1827],{},"Keyboard and pointer handling follow ",[25,1801,1802],{},"NumberBox.cpp",": arrow keys step by ",[25,1805,252],{},[25,1807,262],{},[25,1809,265],{}," by ",[25,1812,80],{},[25,1814,453],{}," commits, ",[25,1817,801],{}," reverts, and gaining focus selects the whole text; the mouse wheel only responds while the input box holds focus, scrolling up increments (",[25,1820,1821],{},"MouseWheelDelta > 0","). WinUI leaves ",[25,1824,72],{},[25,1826,76],{}," to the TextBox, and this component likewise does not treat them as step keys.",[14,1829,1830,1831,1834,1835,73,1838,73,1840,1842,1843,73,1845,1847],{},"Accessibility: the input box carries ",[25,1832,1833],{},"role=\"spinbutton\""," with ",[25,1836,1837],{},"aria-valuenow",[25,1839,242],{},[25,1841,245],{}," (the latter two are not rendered when no bounds are set, matching WinUI's behavior of composing them into the UIA name only once ",[25,1844,235],{},[25,1846,238],{}," are rewritten); the spin buttons do not enter the Tab sequence but can be activated by keyboard, and each carries an accessible name.",[14,1849,1850,1851,982,1854,1857],{},"Two web-side approximations: the compact popup approximates WinUI's Acrylic surface with ",[25,1852,1853],{},"colorNeutralBackground1",[25,1855,1856],{},"shadow16"," (the Fluent token set has no material tokens); when the inline buttons appear, the right side of the input box gives up an extra 84px to keep text from pressing onto the buttons (WinUI lets text press under the buttons).",[14,1859,1860,1861,1864,1865,1867,1868,1871,1872,1874,1875,1877,1878,1881,1882,1884],{},"WinUI's ",[25,1862,1863],{},"Text"," property is not exposed as a separate prop: on the web side the input-box text is derived from ",[25,1866,111],{}," plus formatting (",[25,1869,1870],{},"Value → Text","); use ",[25,1873,952],{}," for custom text display. The WinUI initialization order of \"when both ",[25,1876,1863],{}," and ",[25,1879,1880],{},"Value"," are set, ",[25,1883,1880],{}," wins\" therefore does not apply.",[1886,1887,1888],"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":131,"searchDepth":187,"depth":187,"links":1890},[1891,1892,1893,1894,1895,1896,1897,1898,1899],{"id":105,"depth":187,"text":106},{"id":222,"depth":187,"text":223},{"id":409,"depth":187,"text":410},{"id":675,"depth":187,"text":676},{"id":770,"depth":187,"text":771},{"id":946,"depth":187,"text":947},{"id":795,"depth":187,"text":1107},{"id":1201,"depth":187,"text":1202},{"id":1287,"depth":187,"text":1288},"A numeric input control for entering numbers, validating ranges and incremental stepping.","md",{},{"title":5},true,"\u002Fen\u002Fcomponents\u002Fnumber-box",{"title":5,"description":1900},"en\u002Fcomponents\u002Fnumber-box","OW4ikddAyX4Obbwna70qBhmL_itcH4S2pTJoUH-nOrA",{"id":1910,"title":1911,"body":1912,"description":3559,"extension":1901,"meta":3560,"nav":3561,"navigation":1904,"path":3562,"seo":3563,"stem":3564,"__hash__":3565},"content\u002Fcomponents\u002Fnumber-box.md","NumberBox 数字框",{"type":7,"value":1913,"toc":3548},[1914,1917,1933,1949,1985,1988,2001,2071,2074,2111,2216,2224,2227,2262,2376,2457,2460,2481,2530,2533,2539,2551,2562,2691,2694,2714,2741,2829,2832,2919,2922,2937,2992,2994,3383,3429,3465,3546],[10,1915,1911],{"id":1916},"numberbox-数字框",[14,1918,1919,1920,1922,1923,1929,1930,1932],{},"数字框让用户输入与调整数字（数量、价格、税率、字号……）。样式与行为还原 WinUI 3（Windows App SDK）的 ",[18,1921,5],{},"：它本质上是一个 ",[18,1924,1925,1926,1928],{},"TextBox + 数学解析 + ",[25,1927,27],{}," 语义","，因此本组件内嵌 ",[25,1931,32],{},"（与 WinUI 模板里内嵌 TextBox 一致），并把 WinUI 的取值口径、校验模式、增减按钮与内联表达式逐项落地。",[14,1934,1935,1936,1939,1940,1942,1943,1945,1946,1948],{},"取值遵循 WinUI 的 ",[18,1937,1938],{},"Value ↔ Text 双通道","：值变化时用格式化文本回写输入框；失焦或回车时解析文本再更新值。清空输入框会得到 ",[25,1941,43],{},"（对应 WinUI 的 ",[25,1944,27],{},"），此时显示 ",[25,1947,50],{},"。",[53,1950,1951],{},[14,1952,1953,1954,1956,1957,1959,1960,1962,1963,73,1965,1967,1968,1970,1971,73,1973,73,1975,73,1977,1979,1980,73,1982,1984],{},"与 ",[25,1955,60],{}," 原计划的差异：原本打算复用 reka-ui 的 ",[25,1958,64],{},"，但它的 ",[25,1961,68],{}," 与 WinUI 有几处硬冲突 —— ",[25,1964,72],{},[25,1966,76],{}," 被映射成最小值 \u002F 最大值（WinUI 交给 TextBox 移动光标）、非法输入在失焦时把值清空（WinUI 保留原值）、方向键按步长吸附（WinUI 直接相加）、滚轮方向相反、",[25,1969,80],{}," 写死 10 步。这里保留「复用」的思路但改为自持实现：",[25,1972,84],{},[25,1974,87],{},[25,1976,90],{},[25,1978,93],{}," 四个纯函数层 + ",[25,1981,97],{},[25,1983,100],{}," 两个 hook，可单独单测。",[103,1986,1987],{"id":1987},"基础用法",[14,1989,1990,1992,1993,1995,1996,1998,1999,1948],{},[25,1991,111],{}," 绑定数值，",[25,1994,115],{}," 是 WinUI 的标题行（同时作为缺省的可访问名），",[25,1997,119],{}," 渲染在控件下方并作为 ",[25,2000,123],{},[126,2002,2003,2007],{"title":1987},[129,2004,2005],{"v-slot:preview":131},[133,2006],{},[129,2008,2009],{"v-slot:code":131},[138,2010,2012],{"className":140,"code":2011,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox v-model=\"quantity\" header=\"数量\" \u002F>\n\u003CFluereNumberBox v-model=\"price\" header=\"单价\" description=\"支持小数\" \u002F>\n",[25,2013,2014,2039],{"__ignoreMap":131},[146,2015,2016,2018,2020,2022,2024,2026,2028,2030,2032,2034,2037],{"class":148,"line":149},[146,2017,153],{"class":152},[146,2019,157],{"class":156},[146,2021,161],{"class":160},[146,2023,164],{"class":152},[146,2025,168],{"class":167},[146,2027,171],{"class":152},[146,2029,168],{"class":167},[146,2031,176],{"class":160},[146,2033,164],{"class":152},[146,2035,2036],{"class":167},"\"数量\"",[146,2038,184],{"class":152},[146,2040,2041,2043,2045,2047,2049,2051,2053,2055,2057,2059,2062,2064,2066,2069],{"class":148,"line":187},[146,2042,153],{"class":152},[146,2044,157],{"class":156},[146,2046,161],{"class":160},[146,2048,164],{"class":152},[146,2050,168],{"class":167},[146,2052,200],{"class":152},[146,2054,168],{"class":167},[146,2056,176],{"class":160},[146,2058,164],{"class":152},[146,2060,2061],{"class":167},"\"单价\"",[146,2063,212],{"class":160},[146,2065,164],{"class":152},[146,2067,2068],{"class":167},"\"支持小数\"",[146,2070,184],{"class":152},[103,2072,2073],{"id":2073},"区间与步进",[14,2075,2076,73,2078,2080,2081,73,2083,2085,2086,73,2088,2090,2091,2093,2094,2096,2097,2093,2099,2101,2102,73,2104,2106,2107,2110],{},[25,2077,228],{},[25,2079,231],{}," 对应 ",[25,2082,235],{},[25,2084,238],{},"（缺省不设上下界，此时也不渲染 ",[25,2087,242],{},[25,2089,245],{},"）；",[25,2092,93],{}," 是 ",[25,2095,252],{},"（方向键 \u002F 滚轮 \u002F 增减按钮），",[25,2098,256],{},[25,2100,80],{},"（",[25,2103,262],{},[25,2105,265],{},"）。与 WinUI 一致：",[18,2108,2109],{},"不做步长吸附","，只在越界时钳制（或回绕）。",[126,2112,2113,2117],{"title":2073},[129,2114,2115],{"v-slot:preview":131},[276,2116],{},[129,2118,2119],{"v-slot:code":131},[138,2120,2122],{"className":140,"code":2121,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"quantity\"\n  :min=\"0\"\n  :max=\"500\"\n  :step=\"10\"\n  :large-step=\"100\"\n  header=\"数量\"\n\u002F>\n\u003CFluereNumberBox v-model=\"ratio\" :min=\"0\" :max=\"1\" :step=\"0.1\" header=\"比例\" \u002F>\n",[25,2123,2124,2130,2142,2156,2170,2184,2198,2207,2211],{"__ignoreMap":131},[146,2125,2126,2128],{"class":148,"line":149},[146,2127,153],{"class":152},[146,2129,291],{"class":156},[146,2131,2132,2134,2136,2138,2140],{"class":148,"line":187},[146,2133,296],{"class":160},[146,2135,164],{"class":152},[146,2137,168],{"class":167},[146,2139,171],{"class":152},[146,2141,305],{"class":167},[146,2143,2144,2146,2148,2150,2152,2154],{"class":148,"line":308},[146,2145,311],{"class":152},[146,2147,228],{"class":160},[146,2149,164],{"class":152},[146,2151,168],{"class":167},[146,2153,321],{"class":320},[146,2155,305],{"class":167},[146,2157,2158,2160,2162,2164,2166,2168],{"class":148,"line":326},[146,2159,311],{"class":152},[146,2161,231],{"class":160},[146,2163,164],{"class":152},[146,2165,168],{"class":167},[146,2167,337],{"class":320},[146,2169,305],{"class":167},[146,2171,2172,2174,2176,2178,2180,2182],{"class":148,"line":342},[146,2173,311],{"class":152},[146,2175,93],{"class":160},[146,2177,164],{"class":152},[146,2179,168],{"class":167},[146,2181,353],{"class":320},[146,2183,305],{"class":167},[146,2185,2186,2188,2190,2192,2194,2196],{"class":148,"line":358},[146,2187,311],{"class":152},[146,2189,363],{"class":160},[146,2191,164],{"class":152},[146,2193,168],{"class":167},[146,2195,370],{"class":320},[146,2197,305],{"class":167},[146,2199,2200,2202,2204],{"class":148,"line":375},[146,2201,378],{"class":160},[146,2203,164],{"class":152},[146,2205,2206],{"class":167},"\"数量\"\n",[146,2208,2209],{"class":148,"line":386},[146,2210,389],{"class":152},[146,2212,2213],{"class":148,"line":392},[146,2214,2215],{"class":152},"\u003CFluereNumberBox v-model=\"ratio\" :min=\"0\" :max=\"1\" :step=\"0.1\" header=\"比例\" \u002F>\n",[14,2217,2218,2219,2080,2221,2223],{},"传 ",[25,2220,401],{},[25,2222,405],{},"：到端点后回绕到另一端，且两个按钮始终可用。",[103,2225,2226],{"id":2226},"增减按钮",[14,2228,2229,2080,2231,2233,2234,2236,2237,2239,2240,2242,2243,2245,2246,2248,2249,73,2251,2253,2254,2256,2257,73,2259,2261],{},[25,2230,415],{},[25,2232,419],{},"：",[25,2235,423],{},"（默认）\u002F ",[25,2238,427],{},"（输入框右侧内联上 \u002F 下按钮）\u002F ",[25,2241,431],{},"（聚焦时浮出按钮面板）。",[25,2244,427],{}," 与输入框共用一个 TextBox 边框，按钮 32×24、外边距 4、圆角 4；按住按钮会立即步进一次，随后每 250ms 重复（WinUI ",[25,2247,438],{}," 的 ",[25,2250,442],{},[25,2252,445],{}," 缺省值）。按钮不进入 Tab 序列（WinUI ",[25,2255,449],{},"），但可用 ",[25,2258,453],{},[25,2260,456],{}," 激活。",[126,2263,2265,2269],{"title":2264},"内联按钮",[129,2266,2267],{"v-slot:preview":131},[463,2268],{},[129,2270,2271],{"v-slot:code":131},[138,2272,2274],{"className":140,"code":2273,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"fontSize\"\n  :min=\"9\"\n  :max=\"72\"\n  spin-button-placement-mode=\"inline\"\n  header=\"字号\"\n\u002F>\n\u003CFluereNumberBox\n  v-model=\"zoom\"\n  :min=\"0.5\"\n  :max=\"3\"\n  :step=\"0.25\"\n  spin-button-placement-mode=\"inline\"\n  header=\"缩放\"\n\u002F>\n",[25,2275,2276,2282,2294,2308,2322,2330,2339,2343,2347,2351,2355,2359,2363,2367,2372],{"__ignoreMap":131},[146,2277,2278,2280],{"class":148,"line":149},[146,2279,153],{"class":152},[146,2281,291],{"class":156},[146,2283,2284,2286,2288,2290,2292],{"class":148,"line":187},[146,2285,296],{"class":160},[146,2287,164],{"class":152},[146,2289,168],{"class":167},[146,2291,488],{"class":152},[146,2293,305],{"class":167},[146,2295,2296,2298,2300,2302,2304,2306],{"class":148,"line":308},[146,2297,311],{"class":152},[146,2299,228],{"class":160},[146,2301,164],{"class":152},[146,2303,168],{"class":167},[146,2305,503],{"class":320},[146,2307,305],{"class":167},[146,2309,2310,2312,2314,2316,2318,2320],{"class":148,"line":326},[146,2311,311],{"class":152},[146,2313,231],{"class":160},[146,2315,164],{"class":152},[146,2317,168],{"class":167},[146,2319,518],{"class":320},[146,2321,305],{"class":167},[146,2323,2324,2326,2328],{"class":148,"line":342},[146,2325,525],{"class":160},[146,2327,164],{"class":152},[146,2329,530],{"class":167},[146,2331,2332,2334,2336],{"class":148,"line":358},[146,2333,378],{"class":160},[146,2335,164],{"class":152},[146,2337,2338],{"class":167},"\"字号\"\n",[146,2340,2341],{"class":148,"line":375},[146,2342,389],{"class":152},[146,2344,2345],{"class":148,"line":386},[146,2346,548],{"class":152},[146,2348,2349],{"class":148,"line":392},[146,2350,553],{"class":152},[146,2352,2353],{"class":148,"line":556},[146,2354,559],{"class":152},[146,2356,2357],{"class":148,"line":562},[146,2358,565],{"class":152},[146,2360,2361],{"class":148,"line":568},[146,2362,571],{"class":152},[146,2364,2365],{"class":148,"line":574},[146,2366,577],{"class":152},[146,2368,2369],{"class":148,"line":580},[146,2370,2371],{"class":152},"  header=\"缩放\"\n",[146,2373,2374],{"class":148,"line":586},[146,2375,389],{"class":152},[126,2377,2379,2383],{"title":2378},"紧凑按钮",[129,2380,2381],{"v-slot:preview":131},[595,2382],{},[129,2384,2385],{"v-slot:code":131},[138,2386,2388],{"className":140,"code":2387,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"opacity\"\n  :min=\"0\"\n  :max=\"100\"\n  spin-button-placement-mode=\"compact\"\n  header=\"不透明度\"\n\u002F>\n",[25,2389,2390,2396,2408,2422,2436,2444,2453],{"__ignoreMap":131},[146,2391,2392,2394],{"class":148,"line":149},[146,2393,153],{"class":152},[146,2395,291],{"class":156},[146,2397,2398,2400,2402,2404,2406],{"class":148,"line":187},[146,2399,296],{"class":160},[146,2401,164],{"class":152},[146,2403,168],{"class":167},[146,2405,620],{"class":152},[146,2407,305],{"class":167},[146,2409,2410,2412,2414,2416,2418,2420],{"class":148,"line":308},[146,2411,311],{"class":152},[146,2413,228],{"class":160},[146,2415,164],{"class":152},[146,2417,168],{"class":167},[146,2419,321],{"class":320},[146,2421,305],{"class":167},[146,2423,2424,2426,2428,2430,2432,2434],{"class":148,"line":326},[146,2425,311],{"class":152},[146,2427,231],{"class":160},[146,2429,164],{"class":152},[146,2431,168],{"class":167},[146,2433,370],{"class":320},[146,2435,305],{"class":167},[146,2437,2438,2440,2442],{"class":148,"line":342},[146,2439,525],{"class":160},[146,2441,164],{"class":152},[146,2443,659],{"class":167},[146,2445,2446,2448,2450],{"class":148,"line":358},[146,2447,378],{"class":160},[146,2449,164],{"class":152},[146,2451,2452],{"class":167},"\"不透明度\"\n",[146,2454,2455],{"class":148,"line":375},[146,2456,389],{"class":152},[103,2458,2459],{"id":2459},"内联表达式",[14,2461,2462,2080,2464,2466,2467,2469,2470,693,2472,439,2474,693,2476,439,2478,2480],{},[25,2463,681],{},[25,2465,684],{},"：失焦或回车时求值 ",[25,2468,688],{}," 与括号组成的表达式，优先级为 ",[25,2471,692],{},[25,2473,696],{},[25,2475,699],{},[25,2477,702],{},[25,2479,705],{},"。求值后原始表达式不会被保留（会替换为结果）。",[126,2482,2483,2487],{"title":2459},[129,2484,2485],{"v-slot:preview":131},[712,2486],{},[129,2488,2489],{"v-slot:code":131},[138,2490,2492],{"className":140,"code":2491,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox v-model=\"total\" accepts-expression placeholder=\"例如 (2+3)*4^2\" header=\"计算值\" \u002F>\n",[25,2493,2494],{"__ignoreMap":131},[146,2495,2496,2498,2500,2502,2504,2506,2508,2510,2513,2516,2518,2521,2523,2525,2528],{"class":148,"line":149},[146,2497,153],{"class":152},[146,2499,157],{"class":156},[146,2501,161],{"class":160},[146,2503,164],{"class":152},[146,2505,168],{"class":167},[146,2507,737],{"class":152},[146,2509,168],{"class":167},[146,2511,2512],{"class":160}," accepts-expression",[146,2514,2515],{"class":160}," placeholder",[146,2517,164],{"class":152},[146,2519,2520],{"class":167},"\"例如 (2+3)*4^2\"",[146,2522,176],{"class":160},[146,2524,164],{"class":152},[146,2526,2527],{"class":167},"\"计算值\"",[146,2529,184],{"class":152},[103,2531,2532],{"id":2532},"校验模式",[14,2534,2535,2080,2537,2233],{},[25,2536,776],{},[25,2538,779],{},[782,2540,2541,2546],{},[785,2542,2543,2545],{},[25,2544,789],{},"（默认）：失焦 \u002F 回车时，非法输入被当前值的格式化文本覆盖，越界值钳制回区间；",[785,2547,2548,2550],{},[25,2549,795],{},"：保留用户输入与越界值，交给消费方自行校验。",[14,2552,2553,2555,2556,2558,2559,2561],{},[25,2554,801],{}," 始终丢弃输入、回到当前值；",[25,2557,453],{}," 结算输入（并吃掉按键，避免触发隐式表单提交，与 WinUI 处理 ",[25,2560,453],{}," 的方式一致）。",[126,2563,2564,2568],{"title":2532},[129,2565,2566],{"v-slot:preview":131},[814,2567],{},[129,2569,2570],{"v-slot:code":131},[138,2571,2573],{"className":140,"code":2572,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox v-model=\"strict\" :min=\"0\" :max=\"100\" header=\"默认：非法输入被覆盖\" \u002F>\n\u003CFluereNumberBox\n  v-model=\"lenient\"\n  :min=\"0\"\n  :max=\"100\"\n  validation-mode=\"disabled\"\n  header=\"保留输入\"\n\u002F>\n",[25,2574,2575,2624,2630,2642,2656,2670,2678,2687],{"__ignoreMap":131},[146,2576,2577,2579,2581,2583,2585,2587,2589,2591,2593,2595,2597,2599,2601,2603,2605,2607,2609,2611,2613,2615,2617,2619,2622],{"class":148,"line":149},[146,2578,153],{"class":152},[146,2580,157],{"class":156},[146,2582,161],{"class":160},[146,2584,164],{"class":152},[146,2586,168],{"class":167},[146,2588,837],{"class":152},[146,2590,168],{"class":167},[146,2592,842],{"class":152},[146,2594,228],{"class":160},[146,2596,164],{"class":152},[146,2598,168],{"class":167},[146,2600,321],{"class":320},[146,2602,168],{"class":167},[146,2604,842],{"class":152},[146,2606,231],{"class":160},[146,2608,164],{"class":152},[146,2610,168],{"class":167},[146,2612,370],{"class":320},[146,2614,168],{"class":167},[146,2616,176],{"class":160},[146,2618,164],{"class":152},[146,2620,2621],{"class":167},"\"默认：非法输入被覆盖\"",[146,2623,184],{"class":152},[146,2625,2626,2628],{"class":148,"line":187},[146,2627,153],{"class":152},[146,2629,291],{"class":156},[146,2631,2632,2634,2636,2638,2640],{"class":148,"line":308},[146,2633,296],{"class":160},[146,2635,164],{"class":152},[146,2637,168],{"class":167},[146,2639,890],{"class":152},[146,2641,305],{"class":167},[146,2643,2644,2646,2648,2650,2652,2654],{"class":148,"line":326},[146,2645,311],{"class":152},[146,2647,228],{"class":160},[146,2649,164],{"class":152},[146,2651,168],{"class":167},[146,2653,321],{"class":320},[146,2655,305],{"class":167},[146,2657,2658,2660,2662,2664,2666,2668],{"class":148,"line":342},[146,2659,311],{"class":152},[146,2661,231],{"class":160},[146,2663,164],{"class":152},[146,2665,168],{"class":167},[146,2667,370],{"class":320},[146,2669,305],{"class":167},[146,2671,2672,2674,2676],{"class":148,"line":358},[146,2673,925],{"class":160},[146,2675,164],{"class":152},[146,2677,930],{"class":167},[146,2679,2680,2682,2684],{"class":148,"line":375},[146,2681,378],{"class":160},[146,2683,164],{"class":152},[146,2685,2686],{"class":167},"\"保留输入\"\n",[146,2688,2689],{"class":148,"line":386},[146,2690,389],{"class":152},[103,2692,2693],{"id":2693},"格式化与区域设置",[14,2695,2696,2101,2698,2700,2701,2703,2704,2706,2707,2710,2711,2713],{},[25,2697,952],{},[25,2699,955],{},"）对应 ",[25,2702,959],{},"，",[25,2705,963],{}," 决定小数点 \u002F 分组分隔符 \u002F 负号 —— ",[18,2708,2709],{},"显示与解析共用同一套符号","。SSR 应用建议显式传 ",[25,2712,963],{},"：缺省时用运行环境的默认区域设置，而服务端与浏览器的默认值可能不同（例如 de-DE 的小数点），首帧会出现水合不一致。",[14,2715,2716,2717,2719,2720,982,2722,2724,2725,2728,2729,2731,2732,2734,2735,2737,2738,2740],{},"WinUI 的默认 ",[25,2718,977],{}," 被设成 ",[25,2721,981],{},[25,2723,985],{},"，在多个 WinAppSDK 版本上会把显示值四舍五入到整数（",[988,2726,993],{"href":990,"rel":2727},[992],"：输入 25.8 失焦后显示 26）。Web 侧缺省不丢小数（",[25,2730,997],{},"），否则 ",[25,2733,1001],{}," 这类用法在显示层直接不可用；需要 WinUI 的整数观感时传 ",[25,2736,1005],{}," 即可。显示前还会做一次 WinUI 的 10 位有效数字舍入，抹掉 ",[25,2739,1009],{}," 这类浮点噪声。",[126,2742,2743,2747],{"title":2693},[129,2744,2745],{"v-slot:preview":131},[1015,2746],{},[129,2748,2749],{"v-slot:code":131},[138,2750,2752],{"className":140,"code":2751,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  v-model=\"integer\"\n  :format-options=\"{ maximumFractionDigits: 0 }\"\n  header=\"整数外观\"\n\u002F>\n\u003CFluereNumberBox\n  v-model=\"fixed\"\n  :format-options=\"{ minimumFractionDigits: 2, maximumFractionDigits: 2 }\"\n  header=\"固定两位小数\"\n\u002F>\n\u003CFluereNumberBox v-model=\"german\" locale=\"de-DE\" header=\"de-DE：1.234,5\" \u002F>\n",[25,2753,2754,2760,2772,2790,2799,2803,2807,2811,2815,2820,2824],{"__ignoreMap":131},[146,2755,2756,2758],{"class":148,"line":149},[146,2757,153],{"class":152},[146,2759,291],{"class":156},[146,2761,2762,2764,2766,2768,2770],{"class":148,"line":187},[146,2763,296],{"class":160},[146,2765,164],{"class":152},[146,2767,168],{"class":167},[146,2769,1040],{"class":152},[146,2771,305],{"class":167},[146,2773,2774,2776,2778,2780,2782,2784,2786,2788],{"class":148,"line":308},[146,2775,311],{"class":152},[146,2777,1049],{"class":160},[146,2779,164],{"class":152},[146,2781,168],{"class":167},[146,2783,1056],{"class":152},[146,2785,321],{"class":320},[146,2787,1061],{"class":152},[146,2789,305],{"class":167},[146,2791,2792,2794,2796],{"class":148,"line":326},[146,2793,378],{"class":160},[146,2795,164],{"class":152},[146,2797,2798],{"class":167},"\"整数外观\"\n",[146,2800,2801],{"class":148,"line":342},[146,2802,389],{"class":152},[146,2804,2805],{"class":148,"line":358},[146,2806,548],{"class":152},[146,2808,2809],{"class":148,"line":375},[146,2810,1085],{"class":152},[146,2812,2813],{"class":148,"line":386},[146,2814,1090],{"class":152},[146,2816,2817],{"class":148,"line":392},[146,2818,2819],{"class":152},"  header=\"固定两位小数\"\n",[146,2821,2822],{"class":148,"line":556},[146,2823,389],{"class":152},[146,2825,2826],{"class":148,"line":562},[146,2827,2828],{"class":152},"\u003CFluereNumberBox v-model=\"german\" locale=\"de-DE\" header=\"de-DE：1.234,5\" \u002F>\n",[103,2830,2831],{"id":2831},"禁用",[126,2833,2835,2839],{"title":2834},"禁用状态",[129,2836,2837],{"v-slot:preview":131},[1114,2838],{},[129,2840,2841],{"v-slot:code":131},[138,2842,2844],{"className":140,"code":2843,"language":142,"meta":131,"style":131},"\u003CFluereNumberBox\n  :model-value=\"35\"\n  :min=\"0\"\n  :max=\"100\"\n  disabled\n  spin-button-placement-mode=\"inline\"\n  header=\"禁用\"\n\u002F>\n",[25,2845,2846,2852,2866,2880,2894,2898,2906,2915],{"__ignoreMap":131},[146,2847,2848,2850],{"class":148,"line":149},[146,2849,153],{"class":152},[146,2851,291],{"class":156},[146,2853,2854,2856,2858,2860,2862,2864],{"class":148,"line":187},[146,2855,311],{"class":152},[146,2857,1135],{"class":160},[146,2859,164],{"class":152},[146,2861,168],{"class":167},[146,2863,1142],{"class":320},[146,2865,305],{"class":167},[146,2867,2868,2870,2872,2874,2876,2878],{"class":148,"line":308},[146,2869,311],{"class":152},[146,2871,228],{"class":160},[146,2873,164],{"class":152},[146,2875,168],{"class":167},[146,2877,321],{"class":320},[146,2879,305],{"class":167},[146,2881,2882,2884,2886,2888,2890,2892],{"class":148,"line":326},[146,2883,311],{"class":152},[146,2885,231],{"class":160},[146,2887,164],{"class":152},[146,2889,168],{"class":167},[146,2891,370],{"class":320},[146,2893,305],{"class":167},[146,2895,2896],{"class":148,"line":342},[146,2897,1177],{"class":160},[146,2899,2900,2902,2904],{"class":148,"line":358},[146,2901,525],{"class":160},[146,2903,164],{"class":152},[146,2905,530],{"class":167},[146,2907,2908,2910,2912],{"class":148,"line":375},[146,2909,378],{"class":160},[146,2911,164],{"class":152},[146,2913,2914],{"class":167},"\"禁用\"\n",[146,2916,2917],{"class":148,"line":386},[146,2918,389],{"class":152},[103,2920,2921],{"id":2921},"表单提交",[14,2923,2924,2925,2927,2928,2930,2931,2933,2934,2936],{},"位于 ",[25,2926,1208],{}," 内并传 ",[25,2929,1212],{}," 时，会补一个隐藏的原生 ",[25,2932,1216],{},"，提交 ",[25,2935,1220],{},"（无值时提交空串）。",[126,2938,2939,2943],{"title":2921},[129,2940,2941],{"v-slot:preview":131},[1227,2942],{},[129,2944,2945],{"v-slot:code":131},[138,2946,2948],{"className":140,"code":2947,"language":142,"meta":131,"style":131},"\u003Cform @submit.prevent=\"onSubmit\">\n  \u003CFluereNumberBox v-model=\"amount\" name=\"amount\" :min=\"0\" :step=\"8\" spin-button-placement-mode=\"inline\" header=\"金额\" \u002F>\n  \u003CFluereButton type=\"submit\" appearance=\"primary\">提交\u003C\u002FFluereButton>\n\u003C\u002Fform>\n",[25,2949,2950,2974,2979,2984],{"__ignoreMap":131},[146,2951,2952,2954,2956,2958,2960,2962,2964,2966,2968,2970,2972],{"class":148,"line":149},[146,2953,153],{"class":152},[146,2955,1242],{"class":156},[146,2957,1245],{"class":152},[146,2959,1248],{"class":160},[146,2961,124],{"class":152},[146,2963,1253],{"class":160},[146,2965,164],{"class":152},[146,2967,168],{"class":167},[146,2969,1260],{"class":152},[146,2971,168],{"class":167},[146,2973,1265],{"class":152},[146,2975,2976],{"class":148,"line":187},[146,2977,2978],{"class":152},"  \u003CFluereNumberBox v-model=\"amount\" name=\"amount\" :min=\"0\" :step=\"8\" spin-button-placement-mode=\"inline\" header=\"金额\" \u002F>\n",[146,2980,2981],{"class":148,"line":308},[146,2982,2983],{"class":152},"  \u003CFluereButton type=\"submit\" appearance=\"primary\">提交\u003C\u002FFluereButton>\n",[146,2985,2986,2988,2990],{"class":148,"line":326},[146,2987,1280],{"class":152},[146,2989,1242],{"class":156},[146,2991,1265],{"class":152},[103,2993,1288],{"id":1287},[1290,2995,2996,3012],{},[1293,2997,2998],{},[1296,2999,3000,3003,3006,3009],{},[1299,3001,3002],{},"属性（Props）",[1299,3004,3005],{},"类型",[1299,3007,3008],{},"默认",[1299,3010,3011],{},"说明",[1312,3013,3014,3039,3056,3080,3099,3122,3139,3159,3178,3200,3220,3237,3254,3273,3292,3311,3330,3349,3366],{},[1296,3015,3016,3020,3024,3028],{},[1317,3017,3018],{},[25,3019,1321],{},[1317,3021,3022],{},[25,3023,1326],{},[1317,3025,3026],{},[25,3027,1331],{},[1317,3029,3030,3031,2090,3033,3035,3036,3038],{},"当前值（",[25,3032,111],{},[25,3034,43],{}," 表示无值（WinUI 的 ",[25,3037,27],{},"）",[1296,3040,3041,3045,3049,3053],{},[1317,3042,3043],{},[25,3044,1350],{},[1317,3046,3047],{},[25,3048,1326],{},[1317,3050,3051],{},[25,3052,43],{},[1317,3054,3055],{},"非受控初始值",[1296,3057,3058,3064,3068,3073],{},[1317,3059,3060,73,3062],{},[25,3061,228],{},[25,3063,231],{},[1317,3065,3066],{},[25,3067,1374],{},[1317,3069,3070,3072],{},[25,3071,1331],{},"（不设界）",[1317,3074,3075,3076,73,3078,3038],{},"区间（WinUI ",[25,3077,235],{},[25,3079,238],{},[1296,3081,3082,3086,3090,3094],{},[1317,3083,3084],{},[25,3085,93],{},[1317,3087,3088],{},[25,3089,1374],{},[1317,3091,3092],{},[25,3093,1401],{},[1317,3095,3096,3097,3038],{},"步长（WinUI ",[25,3098,252],{},[1296,3100,3101,3105,3109,3113],{},[1317,3102,3103],{},[25,3104,256],{},[1317,3106,3107],{},[25,3108,1374],{},[1317,3110,3111],{},[25,3112,353],{},[1317,3114,3115,3116,2703,3118,73,3120,3038],{},"大步长（WinUI ",[25,3117,80],{},[25,3119,262],{},[25,3121,265],{},[1296,3123,3124,3128,3132,3136],{},[1317,3125,3126],{},[25,3127,795],{},[1317,3129,3130],{},[25,3131,1441],{},[1317,3133,3134],{},[25,3135,1446],{},[1317,3137,3138],{},"是否禁用",[1296,3140,3141,3145,3149,3153],{},[1317,3142,3143],{},[25,3144,115],{},[1317,3146,3147],{},[25,3148,1460],{},[1317,3150,3151],{},[25,3152,1331],{},[1317,3154,3155,3156,3158],{},"顶部标题（WinUI ",[25,3157,1470],{},"），同时是缺省可访问名",[1296,3160,3161,3165,3169,3173],{},[1317,3162,3163],{},[25,3164,1478],{},[1317,3166,3167],{},[25,3168,1460],{},[1317,3170,3171],{},[25,3172,1331],{},[1317,3174,3175,3176,3038],{},"可访问名称（优先于 ",[25,3177,115],{},[1296,3179,3180,3184,3188,3192],{},[1317,3181,3182],{},[25,3183,119],{},[1317,3185,3186],{},[25,3187,1460],{},[1317,3189,3190],{},[25,3191,1331],{},[1317,3193,3194,3195,3197,3198],{},"控件下方说明（WinUI ",[25,3196,1310],{},"），并作为 ",[25,3199,123],{},[1296,3201,3202,3206,3210,3214],{},[1317,3203,3204],{},[25,3205,50],{},[1317,3207,3208],{},[25,3209,1460],{},[1317,3211,3212],{},[25,3213,1331],{},[1317,3215,3216,3217,3219],{},"占位符（WinUI ",[25,3218,1533],{},"），仅无值时显示",[1296,3221,3222,3226,3230,3234],{},[1317,3223,3224],{},[25,3225,1212],{},[1317,3227,3228],{},[25,3229,1460],{},[1317,3231,3232],{},[25,3233,1331],{},[1317,3235,3236],{},"表单提交名，配合隐藏原生 input",[1296,3238,3239,3243,3247,3251],{},[1317,3240,3241],{},[25,3242,963],{},[1317,3244,3245],{},[25,3246,1460],{},[1317,3248,3249],{},[25,3250,1331],{},[1317,3252,3253],{},"BCP 47 语言标记，决定格式化与解析符号",[1296,3255,3256,3260,3264,3268],{},[1317,3257,3258],{},[25,3259,952],{},[1317,3261,3262],{},[25,3263,955],{},[1317,3265,3266],{},[25,3267,997],{},[1317,3269,3270,3271,3038],{},"数值格式（WinUI ",[25,3272,959],{},[1296,3274,3275,3279,3283,3287],{},[1317,3276,3277],{},[25,3278,415],{},[1317,3280,3281],{},[25,3282,1598],{},[1317,3284,3285],{},[25,3286,1603],{},[1317,3288,3289,3290,3038],{},"增减按钮呈现方式（WinUI ",[25,3291,419],{},[1296,3293,3294,3298,3302,3306],{},[1317,3295,3296],{},[25,3297,776],{},[1317,3299,3300],{},[25,3301,1619],{},[1317,3303,3304],{},[25,3305,1624],{},[1317,3307,3308,3309,3038],{},"校验模式（WinUI ",[25,3310,779],{},[1296,3312,3313,3317,3321,3325],{},[1317,3314,3315],{},[25,3316,1636],{},[1317,3318,3319],{},[25,3320,1441],{},[1317,3322,3323],{},[25,3324,1446],{},[1317,3326,3327,3328,3038],{},"到端点后回绕（WinUI ",[25,3329,405],{},[1296,3331,3332,3336,3340,3344],{},[1317,3333,3334],{},[25,3335,1656],{},[1317,3337,3338],{},[25,3339,1441],{},[1317,3341,3342],{},[25,3343,1446],{},[1317,3345,3346,3347,3038],{},"是否解析内联表达式（WinUI ",[25,3348,684],{},[1296,3350,3351,3355,3359,3363],{},[1317,3352,3353],{},[25,3354,1676],{},[1317,3356,3357],{},[25,3358,1460],{},[1317,3360,3361],{},[25,3362,1685],{},[1317,3364,3365],{},"加号按钮可访问名（WinUI 由资源本地化）",[1296,3367,3368,3372,3376,3380],{},[1317,3369,3370],{},[25,3371,1695],{},[1317,3373,3374],{},[25,3375,1460],{},[1317,3377,3378],{},[25,3379,1704],{},[1317,3381,3382],{},"减号按钮可访问名",[1290,3384,3385,3397],{},[1293,3386,3387],{},[1296,3388,3389,3392,3395],{},[1299,3390,3391],{},"事件（Events）",[1299,3393,3394],{},"载荷",[1299,3396,3011],{},[1312,3398,3399,3414],{},[1296,3400,3401,3405,3409],{},[1317,3402,3403],{},[25,3404,1730],{},[1317,3406,3407],{},[25,3408,1326],{},[1317,3410,3411,3412,3038],{},"值变化（",[25,3413,111],{},[1296,3415,3416,3420,3424],{},[1317,3417,3418],{},[25,3419,1746],{},[1317,3421,3422],{},[25,3423,1751],{},[1317,3425,3426,3427,3038],{},"值变化（对应 WinUI ",[25,3428,1757],{},[1290,3430,3431,3440],{},[1293,3432,3433],{},[1296,3434,3435,3438],{},[1299,3436,3437],{},"插槽（Slots）",[1299,3439,3011],{},[1312,3441,3442,3455],{},[1296,3443,3444,3448],{},[1317,3445,3446],{},[25,3447,115],{},[1317,3449,3450,3451,73,3453,3038],{},"顶部标题行（WinUI ",[25,3452,1470],{},[25,3454,1784],{},[1296,3456,3457,3461],{},[1317,3458,3459],{},[25,3460,119],{},[1317,3462,3194,3463,3038],{},[25,3464,1310],{},[53,3466,3467,3497,3515,3523],{},[14,3468,3469,3470,3472,3473,3475,3476,73,3478,3480,3481,3475,3483,3485,3486,3488,3489,3491,3492,73,3494,3496],{},"键盘与指针口径对照 ",[25,3471,1802],{},"：方向键按 ",[25,3474,252],{},"、",[25,3477,262],{},[25,3479,265],{}," 按 ",[25,3482,80],{},[25,3484,453],{}," 结算、",[25,3487,801],{}," 回滚、获得焦点即全选文本；滚轮仅在输入框持有焦点时响应，向上滚为增（",[25,3490,1821],{},"）。WinUI 把 ",[25,3493,72],{},[25,3495,76],{}," 留给 TextBox，本组件同样不把它们当作步进键。",[14,3498,3499,3500,3502,3503,73,3505,73,3507,3509,3510,73,3512,3514],{},"无障碍：输入框带 ",[25,3501,1833],{}," 与 ",[25,3504,1837],{},[25,3506,242],{},[25,3508,245],{},"（未设置上下界时后两者不渲染，对应 WinUI 只在 ",[25,3511,235],{},[25,3513,238],{}," 被改写时才把它们拼进 UIA name 的口径）；增减按钮不进 Tab 序列但可键盘激活，并带可访问名。",[14,3516,3517,3518,982,3520,3522],{},"两处 Web 侧近似：紧凑浮层用 ",[25,3519,1853],{},[25,3521,1856],{}," 近似 WinUI 的 Acrylic 表面（Fluent 令牌集中没有材质令牌）；内联按钮出现时输入框右侧额外让出 84px，避免文本压到按钮上（WinUI 允许文本压在按钮下方）。",[14,3524,3525,3526,3528,3529,3531,3532,3534,3535,3537,3538,3502,3540,3542,3543,3545],{},"WinUI 的 ",[25,3527,1863],{}," 属性不作为独立 prop 暴露：Web 侧输入框文本由 ",[25,3530,111],{}," 加格式化派生（",[25,3533,1870],{},"），需要自定义文本展示时用 ",[25,3536,952],{},"；WinUI「同时设置 ",[25,3539,1863],{},[25,3541,1880],{}," 时以 ",[25,3544,1880],{}," 为准」的初始化顺序因此不适用。",[1886,3547,1888],{},{"title":131,"searchDepth":187,"depth":187,"links":3549},[3550,3551,3552,3553,3554,3555,3556,3557,3558],{"id":1987,"depth":187,"text":1987},{"id":2073,"depth":187,"text":2073},{"id":2226,"depth":187,"text":2226},{"id":2459,"depth":187,"text":2459},{"id":2532,"depth":187,"text":2532},{"id":2693,"depth":187,"text":2693},{"id":2831,"depth":187,"text":2831},{"id":2921,"depth":187,"text":2921},{"id":1287,"depth":187,"text":1288},"数字输入框，用于录入数字、校验区间与步进取值。",{},{"title":1911},"\u002Fcomponents\u002Fnumber-box",{"title":1911,"description":3559},"components\u002Fnumber-box","rT3zmHsHG2jnLQn-7ITY82ppXdtcasfR5jBRJ6u6OjU",1792150929969]