[{"data":1,"prerenderedAt":2776},["ShallowReactive",2],{"navigation":3,"\u002Fcomponents\u002Fswipe-action":406,"\u002Fcomponents\u002Fswipe-action-surround":2771},[4,34,51,301,327,332,337],{"title":5,"path":6,"stem":7,"children":8,"package":11,"icon":33},"Getting Started","\u002Fgetting-started","1.getting-started\u002F1.index",[9,13,18,23,28],{"title":10,"path":6,"stem":7,"package":11,"icon":12},"Introduction",null,"i-lucide-house",{"title":14,"path":15,"stem":16,"package":11,"icon":17},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":19,"path":20,"stem":21,"package":11,"icon":22},"Icons","\u002Fgetting-started\u002Ficons","1.getting-started\u002F3.icons","i-lucide-sparkles",{"title":24,"path":25,"stem":26,"package":11,"icon":27},"CLI","\u002Fgetting-started\u002Fcli","1.getting-started\u002F4.cli","i-lucide-terminal",{"title":29,"path":30,"stem":31,"package":11,"icon":32},"Roadmap","\u002Fgetting-started\u002Froadmap","1.getting-started\u002F5.roadmap","i-lucide-map","i-lucide-rocket",{"title":35,"package":11,"icon":36,"path":37,"stem":38,"children":39,"page":50},"Packages","i-lucide-package","\u002Fpackages","2.packages",[40,45],{"title":41,"path":42,"stem":43,"package":11,"icon":44},"@vyui\u002Fcore","\u002Fpackages\u002Fcore","2.packages\u002F1.core","i-lucide-box",{"title":46,"path":47,"stem":48,"package":11,"icon":49},"@vyui\u002Fkit","\u002Fpackages\u002Fkit","2.packages\u002F2.kit","i-lucide-layers",false,{"title":52,"package":11,"icon":53,"path":54,"stem":55,"children":56},"Components","i-lucide-layout-grid","\u002Fcomponents","3.components",[57,59,65,70,75,80,85,90,95,100,105,110,115,120,125,130,135,140,144,149,153,158,163,168,173,178,183,188,193,198,203,208,213,218,223,228,233,238,242,246,251,256,261,266,271,276,280,284,288,292,296],{"title":52,"path":54,"stem":58,"package":11,"icon":53},"3.components\u002Findex",{"title":60,"path":61,"stem":62,"package":63,"icon":64},"Accordion","\u002Fcomponents\u002Faccordion","3.components\u002Faccordion","kit","i-lucide-list-collapse",{"title":66,"path":67,"stem":68,"package":63,"icon":69},"Action Sheet","\u002Fcomponents\u002Faction-sheet","3.components\u002Faction-sheet","i-lucide-panel-bottom",{"title":71,"path":72,"stem":73,"package":63,"icon":74},"Alert","\u002Fcomponents\u002Falert","3.components\u002Falert","i-lucide-triangle-alert",{"title":76,"path":77,"stem":78,"package":79,"icon":74},"Alert Dialog","\u002Fcomponents\u002Falert-dialog","3.components\u002Falert-dialog","core",{"title":81,"path":82,"stem":83,"package":63,"icon":84},"App","\u002Fcomponents\u002Fapp","3.components\u002Fapp","i-lucide-smartphone",{"title":86,"path":87,"stem":88,"package":63,"icon":89},"Aspect Ratio","\u002Fcomponents\u002Faspect-ratio","3.components\u002Faspect-ratio","i-lucide-ratio",{"title":91,"path":92,"stem":93,"package":63,"icon":94},"Avatar","\u002Fcomponents\u002Favatar","3.components\u002Favatar","i-lucide-circle-user-round",{"title":96,"path":97,"stem":98,"package":63,"icon":99},"Avatar Group","\u002Fcomponents\u002Favatar-group","3.components\u002Favatar-group","i-lucide-users-round",{"title":101,"path":102,"stem":103,"package":63,"icon":104},"Button","\u002Fcomponents\u002Fbutton","3.components\u002Fbutton","i-lucide-square-mouse-pointer",{"title":106,"path":107,"stem":108,"package":63,"icon":109},"Calendar","\u002Fcomponents\u002Fcalendar","3.components\u002Fcalendar","i-lucide-calendar-days",{"title":111,"path":112,"stem":113,"package":63,"icon":114},"Card","\u002Fcomponents\u002Fcard","3.components\u002Fcard","i-lucide-square",{"title":116,"path":117,"stem":118,"package":63,"icon":119},"Checkbox","\u002Fcomponents\u002Fcheckbox","3.components\u002Fcheckbox","i-lucide-square-check",{"title":121,"path":122,"stem":123,"package":79,"icon":124},"Collapsible","\u002Fcomponents\u002Fcollapsible","3.components\u002Fcollapsible","i-lucide-chevrons-down-up",{"title":126,"path":127,"stem":128,"package":79,"icon":129},"Dialog","\u002Fcomponents\u002Fdialog","3.components\u002Fdialog","i-lucide-app-window",{"title":131,"path":132,"stem":133,"package":79,"icon":134},"Draggable","\u002Fcomponents\u002Fdraggable","3.components\u002Fdraggable","i-lucide-move",{"title":136,"path":137,"stem":138,"package":63,"icon":139},"Form","\u002Fcomponents\u002Fform","3.components\u002Fform","i-lucide-clipboard-list",{"title":141,"path":142,"stem":143,"package":79,"icon":22},"Icon","\u002Fcomponents\u002Ficon","3.components\u002Ficon",{"title":145,"path":146,"stem":147,"package":63,"icon":148},"Input","\u002Fcomponents\u002Finput","3.components\u002Finput","i-lucide-text-cursor-input",{"title":150,"path":151,"stem":152,"package":63,"icon":69},"Island","\u002Fcomponents\u002Fisland","3.components\u002Fisland",{"title":154,"path":155,"stem":156,"package":63,"icon":157},"Island Button","\u002Fcomponents\u002Fisland-button","3.components\u002Fisland-button","i-lucide-circle-ellipsis",{"title":159,"path":160,"stem":161,"package":63,"icon":162},"Island Group","\u002Fcomponents\u002Fisland-group","3.components\u002Fisland-group","i-lucide-panels-top-left",{"title":164,"path":165,"stem":166,"package":63,"icon":167},"KeyboardAware","\u002Fcomponents\u002Fkeyboard-aware","3.components\u002Fkeyboard-aware","i-lucide-keyboard",{"title":169,"path":170,"stem":171,"package":63,"icon":172},"Label","\u002Fcomponents\u002Flabel","3.components\u002Flabel","i-lucide-tag",{"title":174,"path":175,"stem":176,"package":63,"icon":177},"Modal","\u002Fcomponents\u002Fmodal","3.components\u002Fmodal","i-lucide-gallery-vertical-end",{"title":179,"path":180,"stem":181,"package":79,"icon":182},"Navigation","\u002Fcomponents\u002Fnavigation","3.components\u002Fnavigation","i-lucide-route",{"title":184,"path":185,"stem":186,"package":63,"icon":187},"Number Field","\u002Fcomponents\u002Fnumber-field","3.components\u002Fnumber-field","i-lucide-list-plus",{"title":189,"path":190,"stem":191,"package":79,"icon":192},"Pagination","\u002Fcomponents\u002Fpagination","3.components\u002Fpagination","i-lucide-ellipsis",{"title":194,"path":195,"stem":196,"package":63,"icon":197},"Pin Input","\u002Fcomponents\u002Fpin-input","3.components\u002Fpin-input","i-lucide-key-round",{"title":199,"path":200,"stem":201,"package":63,"icon":202},"Placeholder","\u002Fcomponents\u002Fplaceholder","3.components\u002Fplaceholder","i-lucide-square-dashed",{"title":204,"path":205,"stem":206,"package":63,"icon":207},"Popover","\u002Fcomponents\u002Fpopover","3.components\u002Fpopover","i-lucide-message-square-more",{"title":209,"path":210,"stem":211,"package":63,"icon":212},"Progress","\u002Fcomponents\u002Fprogress","3.components\u002Fprogress","i-lucide-chart-no-axes-column-increasing",{"title":214,"path":215,"stem":216,"package":63,"icon":217},"Radio Group","\u002Fcomponents\u002Fradio-group","3.components\u002Fradio-group","i-lucide-circle-dot",{"title":219,"path":220,"stem":221,"package":63,"icon":222},"Rating","\u002Fcomponents\u002Frating","3.components\u002Frating","i-lucide-star",{"title":224,"path":225,"stem":226,"package":79,"icon":227},"Scroll View","\u002Fcomponents\u002Fscroll-view","3.components\u002Fscroll-view","i-lucide-scroll",{"title":229,"path":230,"stem":231,"package":63,"icon":232},"Select","\u002Fcomponents\u002Fselect","3.components\u002Fselect","i-lucide-list-check",{"title":234,"path":235,"stem":236,"package":63,"icon":237},"Separator","\u002Fcomponents\u002Fseparator","3.components\u002Fseparator","i-lucide-separator-horizontal",{"title":239,"path":240,"stem":241,"package":79,"icon":69},"Sheet","\u002Fcomponents\u002Fsheet","3.components\u002Fsheet",{"title":243,"path":244,"stem":245,"package":63,"icon":162},"Skeleton","\u002Fcomponents\u002Fskeleton","3.components\u002Fskeleton",{"title":247,"path":248,"stem":249,"package":63,"icon":250},"Slider","\u002Fcomponents\u002Fslider","3.components\u002Fslider","i-lucide-sliders-horizontal",{"title":252,"path":253,"stem":254,"package":63,"icon":255},"Sortable","\u002Fcomponents\u002Fsortable","3.components\u002Fsortable","i-lucide-list-restart",{"title":257,"path":258,"stem":259,"package":63,"icon":260},"Stepper","\u002Fcomponents\u002Fstepper","3.components\u002Fstepper","i-lucide-list-ordered",{"title":262,"path":263,"stem":264,"package":63,"icon":265},"Swipe Action","\u002Fcomponents\u002Fswipe-action","3.components\u002Fswipe-action","i-lucide-move-horizontal",{"title":267,"path":268,"stem":269,"package":63,"icon":270},"Swiper","\u002Fcomponents\u002Fswiper","3.components\u002Fswiper","i-lucide-gallery-horizontal-end",{"title":272,"path":273,"stem":274,"package":63,"icon":275},"Switch","\u002Fcomponents\u002Fswitch","3.components\u002Fswitch","i-lucide-toggle-right",{"title":277,"path":278,"stem":279,"package":63,"icon":162},"Tabs","\u002Fcomponents\u002Ftabs","3.components\u002Ftabs",{"title":281,"path":282,"stem":283,"package":63,"icon":148},"Textarea","\u002Fcomponents\u002Ftextarea","3.components\u002Ftextarea",{"title":285,"path":286,"stem":287,"package":63,"icon":207},"Toast","\u002Fcomponents\u002Ftoast","3.components\u002Ftoast",{"title":289,"path":290,"stem":291,"package":63,"icon":275},"Toggle","\u002Fcomponents\u002Ftoggle","3.components\u002Ftoggle",{"title":293,"path":294,"stem":295,"package":63,"icon":162},"Toggle Group","\u002Fcomponents\u002Ftoggle-group","3.components\u002Ftoggle-group",{"title":297,"path":298,"stem":299,"package":63,"icon":300},"Tray","\u002Fcomponents\u002Ftray","3.components\u002Ftray","i-lucide-square-dashed-bottom",{"title":302,"path":303,"stem":304,"children":305,"package":11,"icon":307},"Theming","\u002Ftheming","4.theming\u002F1.index",[306,308,312,317,322],{"title":302,"path":303,"stem":304,"package":11,"icon":307},"i-lucide-palette",{"title":309,"path":310,"stem":311,"package":11,"icon":250},"Overrides","\u002Ftheming\u002Foverrides","4.theming\u002F2.overrides",{"title":313,"path":314,"stem":315,"package":11,"icon":316},"Colors","\u002Ftheming\u002Fcolors","4.theming\u002F3.colors","i-lucide-swatch-book",{"title":318,"path":319,"stem":320,"package":11,"icon":321},"Dark Mode","\u002Ftheming\u002Fdark-mode","4.theming\u002F4.dark-mode","i-lucide-moon",{"title":323,"path":324,"stem":325,"package":11,"icon":326},"Fonts","\u002Ftheming\u002Ffonts","4.theming\u002F5.fonts","i-lucide-type",{"title":328,"path":329,"stem":330,"package":11,"icon":331},"Accessibility","\u002Faccessibility","5.accessibility","i-lucide-accessibility",{"title":333,"path":334,"stem":335,"package":11,"icon":336},"i18n","\u002Fi18n","6.i18n","i-lucide-languages",{"title":338,"path":339,"stem":340,"children":341,"package":11,"icon":343},"Composables","\u002Fcomposables","7.composables\u002F1.index",[342,344,349,354,359,364,369,374,378,383,387,391,396,401],{"title":338,"path":339,"stem":340,"package":11,"icon":343},"i-lucide-square-function",{"title":345,"path":346,"stem":347,"package":11,"icon":348},"useEmitAsProps","\u002Fcomposables\u002Fuse-emit-as-props","7.composables\u002F10.use-emit-as-props","i-lucide-zap",{"title":350,"path":351,"stem":352,"package":11,"icon":353},"useForwardPropsEmits","\u002Fcomposables\u002Fuse-forward-props-emits","7.composables\u002F11.use-forward-props-emits","i-lucide-merge",{"title":355,"path":356,"stem":357,"package":11,"icon":358},"useForwardExpose","\u002Fcomposables\u002Fuse-forward-expose","7.composables\u002F12.use-forward-expose","i-lucide-share-2",{"title":360,"path":361,"stem":362,"package":11,"icon":363},"useStateMachine","\u002Fcomposables\u002Fuse-state-machine","7.composables\u002F13.use-state-machine","i-lucide-workflow",{"title":365,"path":366,"stem":367,"package":11,"icon":368},"usePrimitiveElement","\u002Fcomposables\u002Fuse-primitive-element","7.composables\u002F14.use-primitive-element","i-lucide-crosshair",{"title":370,"path":371,"stem":372,"package":11,"icon":373},"useAppConfig","\u002Fcomposables\u002Fuse-app-config","7.composables\u002F2.use-app-config","i-lucide-settings",{"title":375,"path":376,"stem":377,"package":11,"icon":321},"useColorMode","\u002Fcomposables\u002Fuse-color-mode","7.composables\u002F3.use-color-mode",{"title":379,"path":380,"stem":381,"package":11,"icon":382},"useComponentIcons","\u002Fcomposables\u002Fuse-component-icons","7.composables\u002F4.use-component-icons","i-lucide-shapes",{"title":384,"path":385,"stem":386,"package":11,"icon":69},"useTray","\u002Fcomposables\u002Fuse-tray","7.composables\u002F5.use-tray",{"title":388,"path":389,"stem":390,"package":11,"icon":336},"i18n composables","\u002Fcomposables\u002Fi18n-composables","7.composables\u002F6.i18n-composables",{"title":392,"path":393,"stem":394,"package":11,"icon":395},"useId","\u002Fcomposables\u002Fuse-id","7.composables\u002F7.use-id","i-lucide-hash",{"title":397,"path":398,"stem":399,"package":11,"icon":400},"useFilter","\u002Fcomposables\u002Fuse-filter","7.composables\u002F8.use-filter","i-lucide-filter",{"title":402,"path":403,"stem":404,"package":11,"icon":405},"useForwardProps","\u002Fcomposables\u002Fuse-forward-props","7.composables\u002F9.use-forward-props","i-lucide-arrow-right-left",{"id":407,"title":262,"body":408,"description":2759,"extension":2760,"links":2761,"meta":2767,"navigation":2768,"package":63,"path":263,"seo":2769,"stem":264,"__hash__":2770},"docs\u002F3.components\u002Fswipe-action.md",{"type":409,"value":410,"toc":2740},"minimark",[411,416,428,433,441,445,456,1042,1051,1056,1066,1563,1567,1572,1759,1763,1774,1871,1875,1885,2056,2060,2122,2126,2233,2244,2269,2278,2282,2466,2478,2482,2524,2529,2533,2575,2579,2588,2631,2659,2662,2670,2683,2687,2709,2713,2736],[412,413,415],"h2",{"id":414},"overview","Overview",[417,418,419,423,424,427],"p",{},[420,421,422],"code",{},"VySwipeAction"," places an action panel behind a foreground row. A leftward drag reveals the panel, a short rightward flick closes it, and a sufficiently long or fast leftward swipe emits ",[420,425,426],{},"commit",".",[429,430],"component-code",{"height":431,"name":432},"160px","swipe-action-example",[434,435,438],"callout",{"color":436,"icon":437},"warning","i-lucide-pointer",[417,439,440],{},"Swipe gestures aren't wired up in the web preview yet, so the row won't slide here — view this on a device or in Lynx Explorer for the real interaction. The code below runs as-is on iOS and Android.",[412,442,444],{"id":443},"usage","Usage",[417,446,447,448,451,452,455],{},"Both ",[420,449,450],{},"rowWidth"," and ",[420,453,454],{},"actionWidth"," are required because the core gesture primitive performs its threshold and translation calculations in pixels.",[457,458,463],"pre",{"className":459,"code":460,"language":461,"meta":462,"style":462},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { VySwipeAction } from '@vyui\u002Fkit'\n\nconst open = ref(false)\nconst archived = ref(false)\n\nfunction archive() {\n  archived.value = true\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CVySwipeAction\n    v-if=\"!archived\"\n    v-model:open=\"open\"\n    :row-width=\"360\"\n    :action-width=\"96\"\n    @commit=\"archive\"\n  >\n    \u003Cview class=\"h-16 px-4 justify-center bg-white\">\n      \u003Ctext class=\"font-medium\">Quarterly report\u003C\u002Ftext>\n      \u003Ctext class=\"text-sm text-neutral-500\">Swipe left to archive\u003C\u002Ftext>\n    \u003C\u002Fview>\n\n    \u003Ctemplate #actions=\"{ close }\">\n      \u003Cview\n        class=\"w-24 items-center justify-center bg-primary-600\"\n        accessibility-element=\"true\"\n        accessibility-traits=\"button\"\n        accessibility-label=\"Archive quarterly report\"\n        @tap=\"archive(); close()\"\n      >\n        \u003Ctext class=\"text-white font-medium\">Archive\u003C\u002Ftext>\n      \u003C\u002Fview>\n    \u003C\u002Ftemplate>\n  \u003C\u002FVySwipeAction>\n\u003C\u002Ftemplate>\n","vue","",[420,464,465,500,528,548,555,579,597,602,617,634,640,650,655,665,674,690,705,720,735,750,756,779,811,840,850,855,885,893,908,923,938,953,968,974,1004,1014,1023,1033],{"__ignoreMap":462},[466,467,470,474,478,482,485,488,491,495,497],"span",{"class":468,"line":469},"line",1,[466,471,473],{"class":472},"sMK4o","\u003C",[466,475,477],{"class":476},"swJcz","script",[466,479,481],{"class":480},"spNyl"," setup",[466,483,484],{"class":480}," lang",[466,486,487],{"class":472},"=",[466,489,490],{"class":472},"\"",[466,492,494],{"class":493},"sfazB","ts",[466,496,490],{"class":472},[466,498,499],{"class":472},">\n",[466,501,503,507,510,514,517,520,523,525],{"class":468,"line":502},2,[466,504,506],{"class":505},"s7zQu","import",[466,508,509],{"class":472}," {",[466,511,513],{"class":512},"sTEyZ"," ref",[466,515,516],{"class":472}," }",[466,518,519],{"class":505}," from",[466,521,522],{"class":472}," '",[466,524,461],{"class":493},[466,526,527],{"class":472},"'\n",[466,529,531,533,535,538,540,542,544,546],{"class":468,"line":530},3,[466,532,506],{"class":505},[466,534,509],{"class":472},[466,536,537],{"class":512}," VySwipeAction",[466,539,516],{"class":472},[466,541,519],{"class":505},[466,543,522],{"class":472},[466,545,46],{"class":493},[466,547,527],{"class":472},[466,549,551],{"class":468,"line":550},4,[466,552,554],{"emptyLinePlaceholder":553},true,"\n",[466,556,558,561,564,566,569,572,576],{"class":468,"line":557},5,[466,559,560],{"class":480},"const",[466,562,563],{"class":512}," open ",[466,565,487],{"class":472},[466,567,513],{"class":568},"s2Zo4",[466,570,571],{"class":512},"(",[466,573,575],{"class":574},"sfNiH","false",[466,577,578],{"class":512},")\n",[466,580,582,584,587,589,591,593,595],{"class":468,"line":581},6,[466,583,560],{"class":480},[466,585,586],{"class":512}," archived ",[466,588,487],{"class":472},[466,590,513],{"class":568},[466,592,571],{"class":512},[466,594,575],{"class":574},[466,596,578],{"class":512},[466,598,600],{"class":468,"line":599},7,[466,601,554],{"emptyLinePlaceholder":553},[466,603,605,608,611,614],{"class":468,"line":604},8,[466,606,607],{"class":480},"function",[466,609,610],{"class":568}," archive",[466,612,613],{"class":472},"()",[466,615,616],{"class":472}," {\n",[466,618,620,623,625,628,631],{"class":468,"line":619},9,[466,621,622],{"class":512},"  archived",[466,624,427],{"class":472},[466,626,627],{"class":512},"value",[466,629,630],{"class":472}," =",[466,632,633],{"class":574}," true\n",[466,635,637],{"class":468,"line":636},10,[466,638,639],{"class":472},"}\n",[466,641,643,646,648],{"class":468,"line":642},11,[466,644,645],{"class":472},"\u003C\u002F",[466,647,477],{"class":476},[466,649,499],{"class":472},[466,651,653],{"class":468,"line":652},12,[466,654,554],{"emptyLinePlaceholder":553},[466,656,658,660,663],{"class":468,"line":657},13,[466,659,473],{"class":472},[466,661,662],{"class":476},"template",[466,664,499],{"class":472},[466,666,668,671],{"class":468,"line":667},14,[466,669,670],{"class":472},"  \u003C",[466,672,673],{"class":476},"VySwipeAction\n",[466,675,677,680,682,684,687],{"class":468,"line":676},15,[466,678,679],{"class":480},"    v-if",[466,681,487],{"class":472},[466,683,490],{"class":472},[466,685,686],{"class":493},"!archived",[466,688,689],{"class":472},"\"\n",[466,691,693,696,698,700,703],{"class":468,"line":692},16,[466,694,695],{"class":480},"    v-model:open",[466,697,487],{"class":472},[466,699,490],{"class":472},[466,701,702],{"class":493},"open",[466,704,689],{"class":472},[466,706,708,711,713,715,718],{"class":468,"line":707},17,[466,709,710],{"class":480},"    :row-width",[466,712,487],{"class":472},[466,714,490],{"class":472},[466,716,717],{"class":493},"360",[466,719,689],{"class":472},[466,721,723,726,728,730,733],{"class":468,"line":722},18,[466,724,725],{"class":480},"    :action-width",[466,727,487],{"class":472},[466,729,490],{"class":472},[466,731,732],{"class":493},"96",[466,734,689],{"class":472},[466,736,738,741,743,745,748],{"class":468,"line":737},19,[466,739,740],{"class":480},"    @commit",[466,742,487],{"class":472},[466,744,490],{"class":472},[466,746,747],{"class":493},"archive",[466,749,689],{"class":472},[466,751,753],{"class":468,"line":752},20,[466,754,755],{"class":472},"  >\n",[466,757,759,762,765,768,770,772,775,777],{"class":468,"line":758},21,[466,760,761],{"class":472},"    \u003C",[466,763,764],{"class":476},"view",[466,766,767],{"class":480}," class",[466,769,487],{"class":472},[466,771,490],{"class":472},[466,773,774],{"class":493},"h-16 px-4 justify-center bg-white",[466,776,490],{"class":472},[466,778,499],{"class":472},[466,780,782,785,788,790,792,794,797,799,802,805,807,809],{"class":468,"line":781},22,[466,783,784],{"class":472},"      \u003C",[466,786,787],{"class":476},"text",[466,789,767],{"class":480},[466,791,487],{"class":472},[466,793,490],{"class":472},[466,795,796],{"class":493},"font-medium",[466,798,490],{"class":472},[466,800,801],{"class":472},">",[466,803,804],{"class":512},"Quarterly report",[466,806,645],{"class":472},[466,808,787],{"class":476},[466,810,499],{"class":472},[466,812,814,816,818,820,822,824,827,829,831,834,836,838],{"class":468,"line":813},23,[466,815,784],{"class":472},[466,817,787],{"class":476},[466,819,767],{"class":480},[466,821,487],{"class":472},[466,823,490],{"class":472},[466,825,826],{"class":493},"text-sm text-neutral-500",[466,828,490],{"class":472},[466,830,801],{"class":472},[466,832,833],{"class":512},"Swipe left to archive",[466,835,645],{"class":472},[466,837,787],{"class":476},[466,839,499],{"class":472},[466,841,843,846,848],{"class":468,"line":842},24,[466,844,845],{"class":472},"    \u003C\u002F",[466,847,764],{"class":476},[466,849,499],{"class":472},[466,851,853],{"class":468,"line":852},25,[466,854,554],{"emptyLinePlaceholder":553},[466,856,858,860,862,865,868,870,872,875,878,881,883],{"class":468,"line":857},26,[466,859,761],{"class":472},[466,861,662],{"class":476},[466,863,864],{"class":472}," #",[466,866,867],{"class":480},"actions",[466,869,487],{"class":472},[466,871,490],{"class":472},[466,873,874],{"class":472},"{",[466,876,877],{"class":512}," close ",[466,879,880],{"class":472},"}",[466,882,490],{"class":472},[466,884,499],{"class":472},[466,886,888,890],{"class":468,"line":887},27,[466,889,784],{"class":472},[466,891,892],{"class":476},"view\n",[466,894,896,899,901,903,906],{"class":468,"line":895},28,[466,897,898],{"class":480},"        class",[466,900,487],{"class":472},[466,902,490],{"class":472},[466,904,905],{"class":493},"w-24 items-center justify-center bg-primary-600",[466,907,689],{"class":472},[466,909,911,914,916,918,921],{"class":468,"line":910},29,[466,912,913],{"class":480},"        accessibility-element",[466,915,487],{"class":472},[466,917,490],{"class":472},[466,919,920],{"class":493},"true",[466,922,689],{"class":472},[466,924,926,929,931,933,936],{"class":468,"line":925},30,[466,927,928],{"class":480},"        accessibility-traits",[466,930,487],{"class":472},[466,932,490],{"class":472},[466,934,935],{"class":493},"button",[466,937,689],{"class":472},[466,939,941,944,946,948,951],{"class":468,"line":940},31,[466,942,943],{"class":480},"        accessibility-label",[466,945,487],{"class":472},[466,947,490],{"class":472},[466,949,950],{"class":493},"Archive quarterly report",[466,952,689],{"class":472},[466,954,956,959,961,963,966],{"class":468,"line":955},32,[466,957,958],{"class":480},"        @tap",[466,960,487],{"class":472},[466,962,490],{"class":472},[466,964,965],{"class":493},"archive(); close()",[466,967,689],{"class":472},[466,969,971],{"class":468,"line":970},33,[466,972,973],{"class":472},"      >\n",[466,975,977,980,982,984,986,988,991,993,995,998,1000,1002],{"class":468,"line":976},34,[466,978,979],{"class":472},"        \u003C",[466,981,787],{"class":476},[466,983,767],{"class":480},[466,985,487],{"class":472},[466,987,490],{"class":472},[466,989,990],{"class":493},"text-white font-medium",[466,992,490],{"class":472},[466,994,801],{"class":472},[466,996,997],{"class":512},"Archive",[466,999,645],{"class":472},[466,1001,787],{"class":476},[466,1003,499],{"class":472},[466,1005,1007,1010,1012],{"class":468,"line":1006},35,[466,1008,1009],{"class":472},"      \u003C\u002F",[466,1011,764],{"class":476},[466,1013,499],{"class":472},[466,1015,1017,1019,1021],{"class":468,"line":1016},36,[466,1018,845],{"class":472},[466,1020,662],{"class":476},[466,1022,499],{"class":472},[466,1024,1026,1029,1031],{"class":468,"line":1025},37,[466,1027,1028],{"class":472},"  \u003C\u002F",[466,1030,422],{"class":476},[466,1032,499],{"class":472},[466,1034,1036,1038,1040],{"class":468,"line":1035},38,[466,1037,645],{"class":472},[466,1039,662],{"class":476},[466,1041,499],{"class":472},[417,1043,1044,1045,1047,1048,1050],{},"Handle ",[420,1046,426],{}," by completing or confirming the action. A committed row animates through the full ",[420,1049,450],{},"; removing the completed row from its list is the usual pattern.",[1052,1053,1055],"h3",{"id":1054},"delete-action","Delete action",[417,1057,1058,1059,1062,1063,427],{},"Use the slot's ",[420,1060,1061],{},"close"," function after a panel action. This animates the row closed and updates ",[420,1064,1065],{},"v-model:open",[457,1067,1069],{"className":459,"code":1068,"language":461,"meta":462,"style":462},"\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { VySwipeAction } from '@vyui\u002Fkit'\n\nconst open = ref(false)\nconst deleted = ref(false)\n\nfunction remove() {\n  deleted.value = true\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CVySwipeAction\n    v-if=\"!deleted\"\n    v-model:open=\"open\"\n    :row-width=\"320\"\n    :action-width=\"88\"\n    @commit=\"remove\"\n  >\n    \u003Ctemplate #default=\"{ open: isOpen }\">\n      \u003Cview class=\"h-16 px-4 flex-row items-center justify-between bg-white\">\n        \u003Ctext>Draft message\u003C\u002Ftext>\n        \u003Ctext class=\"text-sm text-neutral-500\">{{ isOpen ? 'Actions open' : 'Swipe left' }}\u003C\u002Ftext>\n      \u003C\u002Fview>\n    \u003C\u002Ftemplate>\n\n    \u003Ctemplate #actions=\"{ close }\">\n      \u003Cview\n        class=\"w-[88px] items-center justify-center bg-error-600\"\n        accessibility-element=\"true\"\n        accessibility-traits=\"button\"\n        accessibility-label=\"Delete draft message\"\n        @tap=\"remove(); close()\"\n      >\n        \u003Ctext class=\"text-white font-medium\">Delete\u003C\u002Ftext>\n      \u003C\u002Fview>\n    \u003C\u002Ftemplate>\n  \u003C\u002FVySwipeAction>\n\u003C\u002Ftemplate>\n",[420,1070,1071,1091,1109,1127,1131,1147,1164,1168,1179,1192,1196,1204,1208,1216,1222,1235,1247,1260,1273,1286,1290,1322,1341,1358,1385,1393,1401,1405,1429,1435,1448,1460,1472,1485,1498,1502,1529,1537,1545,1554],{"__ignoreMap":462},[466,1072,1073,1075,1077,1079,1081,1083,1085,1087,1089],{"class":468,"line":469},[466,1074,473],{"class":472},[466,1076,477],{"class":476},[466,1078,481],{"class":480},[466,1080,484],{"class":480},[466,1082,487],{"class":472},[466,1084,490],{"class":472},[466,1086,494],{"class":493},[466,1088,490],{"class":472},[466,1090,499],{"class":472},[466,1092,1093,1095,1097,1099,1101,1103,1105,1107],{"class":468,"line":502},[466,1094,506],{"class":505},[466,1096,509],{"class":472},[466,1098,513],{"class":512},[466,1100,516],{"class":472},[466,1102,519],{"class":505},[466,1104,522],{"class":472},[466,1106,461],{"class":493},[466,1108,527],{"class":472},[466,1110,1111,1113,1115,1117,1119,1121,1123,1125],{"class":468,"line":530},[466,1112,506],{"class":505},[466,1114,509],{"class":472},[466,1116,537],{"class":512},[466,1118,516],{"class":472},[466,1120,519],{"class":505},[466,1122,522],{"class":472},[466,1124,46],{"class":493},[466,1126,527],{"class":472},[466,1128,1129],{"class":468,"line":550},[466,1130,554],{"emptyLinePlaceholder":553},[466,1132,1133,1135,1137,1139,1141,1143,1145],{"class":468,"line":557},[466,1134,560],{"class":480},[466,1136,563],{"class":512},[466,1138,487],{"class":472},[466,1140,513],{"class":568},[466,1142,571],{"class":512},[466,1144,575],{"class":574},[466,1146,578],{"class":512},[466,1148,1149,1151,1154,1156,1158,1160,1162],{"class":468,"line":581},[466,1150,560],{"class":480},[466,1152,1153],{"class":512}," deleted ",[466,1155,487],{"class":472},[466,1157,513],{"class":568},[466,1159,571],{"class":512},[466,1161,575],{"class":574},[466,1163,578],{"class":512},[466,1165,1166],{"class":468,"line":599},[466,1167,554],{"emptyLinePlaceholder":553},[466,1169,1170,1172,1175,1177],{"class":468,"line":604},[466,1171,607],{"class":480},[466,1173,1174],{"class":568}," remove",[466,1176,613],{"class":472},[466,1178,616],{"class":472},[466,1180,1181,1184,1186,1188,1190],{"class":468,"line":619},[466,1182,1183],{"class":512},"  deleted",[466,1185,427],{"class":472},[466,1187,627],{"class":512},[466,1189,630],{"class":472},[466,1191,633],{"class":574},[466,1193,1194],{"class":468,"line":636},[466,1195,639],{"class":472},[466,1197,1198,1200,1202],{"class":468,"line":642},[466,1199,645],{"class":472},[466,1201,477],{"class":476},[466,1203,499],{"class":472},[466,1205,1206],{"class":468,"line":652},[466,1207,554],{"emptyLinePlaceholder":553},[466,1209,1210,1212,1214],{"class":468,"line":657},[466,1211,473],{"class":472},[466,1213,662],{"class":476},[466,1215,499],{"class":472},[466,1217,1218,1220],{"class":468,"line":667},[466,1219,670],{"class":472},[466,1221,673],{"class":476},[466,1223,1224,1226,1228,1230,1233],{"class":468,"line":676},[466,1225,679],{"class":480},[466,1227,487],{"class":472},[466,1229,490],{"class":472},[466,1231,1232],{"class":493},"!deleted",[466,1234,689],{"class":472},[466,1236,1237,1239,1241,1243,1245],{"class":468,"line":692},[466,1238,695],{"class":480},[466,1240,487],{"class":472},[466,1242,490],{"class":472},[466,1244,702],{"class":493},[466,1246,689],{"class":472},[466,1248,1249,1251,1253,1255,1258],{"class":468,"line":707},[466,1250,710],{"class":480},[466,1252,487],{"class":472},[466,1254,490],{"class":472},[466,1256,1257],{"class":493},"320",[466,1259,689],{"class":472},[466,1261,1262,1264,1266,1268,1271],{"class":468,"line":722},[466,1263,725],{"class":480},[466,1265,487],{"class":472},[466,1267,490],{"class":472},[466,1269,1270],{"class":493},"88",[466,1272,689],{"class":472},[466,1274,1275,1277,1279,1281,1284],{"class":468,"line":737},[466,1276,740],{"class":480},[466,1278,487],{"class":472},[466,1280,490],{"class":472},[466,1282,1283],{"class":493},"remove",[466,1285,689],{"class":472},[466,1287,1288],{"class":468,"line":752},[466,1289,755],{"class":472},[466,1291,1292,1294,1296,1298,1301,1303,1305,1307,1310,1313,1316,1318,1320],{"class":468,"line":758},[466,1293,761],{"class":472},[466,1295,662],{"class":476},[466,1297,864],{"class":472},[466,1299,1300],{"class":480},"default",[466,1302,487],{"class":472},[466,1304,490],{"class":472},[466,1306,874],{"class":472},[466,1308,1309],{"class":476}," open",[466,1311,1312],{"class":472},":",[466,1314,1315],{"class":512}," isOpen ",[466,1317,880],{"class":472},[466,1319,490],{"class":472},[466,1321,499],{"class":472},[466,1323,1324,1326,1328,1330,1332,1334,1337,1339],{"class":468,"line":781},[466,1325,784],{"class":472},[466,1327,764],{"class":476},[466,1329,767],{"class":480},[466,1331,487],{"class":472},[466,1333,490],{"class":472},[466,1335,1336],{"class":493},"h-16 px-4 flex-row items-center justify-between bg-white",[466,1338,490],{"class":472},[466,1340,499],{"class":472},[466,1342,1343,1345,1347,1349,1352,1354,1356],{"class":468,"line":813},[466,1344,979],{"class":472},[466,1346,787],{"class":476},[466,1348,801],{"class":472},[466,1350,1351],{"class":512},"Draft message",[466,1353,645],{"class":472},[466,1355,787],{"class":476},[466,1357,499],{"class":472},[466,1359,1360,1362,1364,1366,1368,1370,1372,1374,1376,1379,1381,1383],{"class":468,"line":842},[466,1361,979],{"class":472},[466,1363,787],{"class":476},[466,1365,767],{"class":480},[466,1367,487],{"class":472},[466,1369,490],{"class":472},[466,1371,826],{"class":493},[466,1373,490],{"class":472},[466,1375,801],{"class":472},[466,1377,1378],{"class":512},"{{ isOpen ? 'Actions open' : 'Swipe left' }}",[466,1380,645],{"class":472},[466,1382,787],{"class":476},[466,1384,499],{"class":472},[466,1386,1387,1389,1391],{"class":468,"line":852},[466,1388,1009],{"class":472},[466,1390,764],{"class":476},[466,1392,499],{"class":472},[466,1394,1395,1397,1399],{"class":468,"line":857},[466,1396,845],{"class":472},[466,1398,662],{"class":476},[466,1400,499],{"class":472},[466,1402,1403],{"class":468,"line":887},[466,1404,554],{"emptyLinePlaceholder":553},[466,1406,1407,1409,1411,1413,1415,1417,1419,1421,1423,1425,1427],{"class":468,"line":895},[466,1408,761],{"class":472},[466,1410,662],{"class":476},[466,1412,864],{"class":472},[466,1414,867],{"class":480},[466,1416,487],{"class":472},[466,1418,490],{"class":472},[466,1420,874],{"class":472},[466,1422,877],{"class":512},[466,1424,880],{"class":472},[466,1426,490],{"class":472},[466,1428,499],{"class":472},[466,1430,1431,1433],{"class":468,"line":910},[466,1432,784],{"class":472},[466,1434,892],{"class":476},[466,1436,1437,1439,1441,1443,1446],{"class":468,"line":925},[466,1438,898],{"class":480},[466,1440,487],{"class":472},[466,1442,490],{"class":472},[466,1444,1445],{"class":493},"w-[88px] items-center justify-center bg-error-600",[466,1447,689],{"class":472},[466,1449,1450,1452,1454,1456,1458],{"class":468,"line":940},[466,1451,913],{"class":480},[466,1453,487],{"class":472},[466,1455,490],{"class":472},[466,1457,920],{"class":493},[466,1459,689],{"class":472},[466,1461,1462,1464,1466,1468,1470],{"class":468,"line":955},[466,1463,928],{"class":480},[466,1465,487],{"class":472},[466,1467,490],{"class":472},[466,1469,935],{"class":493},[466,1471,689],{"class":472},[466,1473,1474,1476,1478,1480,1483],{"class":468,"line":970},[466,1475,943],{"class":480},[466,1477,487],{"class":472},[466,1479,490],{"class":472},[466,1481,1482],{"class":493},"Delete draft message",[466,1484,689],{"class":472},[466,1486,1487,1489,1491,1493,1496],{"class":468,"line":976},[466,1488,958],{"class":480},[466,1490,487],{"class":472},[466,1492,490],{"class":472},[466,1494,1495],{"class":493},"remove(); close()",[466,1497,689],{"class":472},[466,1499,1500],{"class":468,"line":1006},[466,1501,973],{"class":472},[466,1503,1504,1506,1508,1510,1512,1514,1516,1518,1520,1523,1525,1527],{"class":468,"line":1016},[466,1505,979],{"class":472},[466,1507,787],{"class":476},[466,1509,767],{"class":480},[466,1511,487],{"class":472},[466,1513,490],{"class":472},[466,1515,990],{"class":493},[466,1517,490],{"class":472},[466,1519,801],{"class":472},[466,1521,1522],{"class":512},"Delete",[466,1524,645],{"class":472},[466,1526,787],{"class":476},[466,1528,499],{"class":472},[466,1530,1531,1533,1535],{"class":468,"line":1025},[466,1532,1009],{"class":472},[466,1534,764],{"class":476},[466,1536,499],{"class":472},[466,1538,1539,1541,1543],{"class":468,"line":1035},[466,1540,845],{"class":472},[466,1542,662],{"class":476},[466,1544,499],{"class":472},[466,1546,1548,1550,1552],{"class":468,"line":1547},39,[466,1549,1028],{"class":472},[466,1551,422],{"class":476},[466,1553,499],{"class":472},[466,1555,1557,1559,1561],{"class":468,"line":1556},40,[466,1558,645],{"class":472},[466,1560,662],{"class":476},[466,1562,499],{"class":472},[1052,1564,1566],{"id":1565},"multiple-actions","Multiple actions",[417,1568,1569,1570,427],{},"The action panel can contain more than one control as long as their combined width matches ",[420,1571,454],{},[457,1573,1575],{"className":459,"code":1574,"language":461,"meta":462,"style":462},"\u003CVySwipeAction\n  v-model:open=\"open\"\n  :row-width=\"360\"\n  :action-width=\"176\"\n>\n  \u003Cview class=\"h-16 px-4 justify-center bg-white\">\n    \u003Ctext>Conversation\u003C\u002Ftext>\n  \u003C\u002Fview>\n\n  \u003Ctemplate #actions=\"{ close }\">\n    \u003Cview\n      class=\"w-[88px] items-center justify-center bg-neutral-200\"\n      accessibility-element=\"true\"\n      accessibility-traits=\"button\"\n      accessibility-label=\"Mark conversation unread\"\n      @tap=\"markUnread(); close()\"\n    >\n      \u003Ctext>Unread\u003C\u002Ftext>\n    \u003C\u002Fview>\n    \u003Cview\n      class=\"w-[88px] items-center justify-center bg-error-600\"\n      accessibility-element=\"true\"\n      accessibility-traits=\"button\"\n      accessibility-label=\"Delete conversation\"\n      @tap=\"remove(); close()\"\n    >\n      \u003Ctext class=\"text-white\">Delete\u003C\u002Ftext>\n    \u003C\u002Fview>\n  \u003C\u002Ftemplate>\n\u003C\u002FVySwipeAction>\n",[420,1576,1577,1583,1600,1617,1633,1637,1642,1647,1652,1656,1661,1666,1671,1676,1681,1686,1691,1696,1701,1706,1710,1715,1719,1723,1728,1733,1737,1742,1746,1751],{"__ignoreMap":462},[466,1578,1579,1581],{"class":468,"line":469},[466,1580,473],{"class":472},[466,1582,673],{"class":476},[466,1584,1585,1588,1590,1592,1594,1596,1598],{"class":468,"line":502},[466,1586,1587],{"class":480},"  v-model",[466,1589,1312],{"class":472},[466,1591,702],{"class":480},[466,1593,487],{"class":472},[466,1595,490],{"class":472},[466,1597,702],{"class":512},[466,1599,689],{"class":472},[466,1601,1602,1605,1608,1610,1612,1615],{"class":468,"line":530},[466,1603,1604],{"class":472},"  :",[466,1606,1607],{"class":480},"row-width",[466,1609,487],{"class":472},[466,1611,490],{"class":472},[466,1613,717],{"class":1614},"sbssI",[466,1616,689],{"class":472},[466,1618,1619,1621,1624,1626,1628,1631],{"class":468,"line":550},[466,1620,1604],{"class":472},[466,1622,1623],{"class":480},"action-width",[466,1625,487],{"class":472},[466,1627,490],{"class":472},[466,1629,1630],{"class":1614},"176",[466,1632,689],{"class":472},[466,1634,1635],{"class":468,"line":557},[466,1636,499],{"class":472},[466,1638,1639],{"class":468,"line":581},[466,1640,1641],{"class":512},"  \u003Cview class=\"h-16 px-4 justify-center bg-white\">\n",[466,1643,1644],{"class":468,"line":599},[466,1645,1646],{"class":512},"    \u003Ctext>Conversation\u003C\u002Ftext>\n",[466,1648,1649],{"class":468,"line":604},[466,1650,1651],{"class":512},"  \u003C\u002Fview>\n",[466,1653,1654],{"class":468,"line":619},[466,1655,554],{"emptyLinePlaceholder":553},[466,1657,1658],{"class":468,"line":636},[466,1659,1660],{"class":512},"  \u003Ctemplate #actions=\"{ close }\">\n",[466,1662,1663],{"class":468,"line":642},[466,1664,1665],{"class":512},"    \u003Cview\n",[466,1667,1668],{"class":468,"line":652},[466,1669,1670],{"class":512},"      class=\"w-[88px] items-center justify-center bg-neutral-200\"\n",[466,1672,1673],{"class":468,"line":657},[466,1674,1675],{"class":512},"      accessibility-element=\"true\"\n",[466,1677,1678],{"class":468,"line":667},[466,1679,1680],{"class":512},"      accessibility-traits=\"button\"\n",[466,1682,1683],{"class":468,"line":676},[466,1684,1685],{"class":512},"      accessibility-label=\"Mark conversation unread\"\n",[466,1687,1688],{"class":468,"line":692},[466,1689,1690],{"class":512},"      @tap=\"markUnread(); close()\"\n",[466,1692,1693],{"class":468,"line":707},[466,1694,1695],{"class":512},"    >\n",[466,1697,1698],{"class":468,"line":722},[466,1699,1700],{"class":512},"      \u003Ctext>Unread\u003C\u002Ftext>\n",[466,1702,1703],{"class":468,"line":737},[466,1704,1705],{"class":512},"    \u003C\u002Fview>\n",[466,1707,1708],{"class":468,"line":752},[466,1709,1665],{"class":512},[466,1711,1712],{"class":468,"line":758},[466,1713,1714],{"class":512},"      class=\"w-[88px] items-center justify-center bg-error-600\"\n",[466,1716,1717],{"class":468,"line":781},[466,1718,1675],{"class":512},[466,1720,1721],{"class":468,"line":813},[466,1722,1680],{"class":512},[466,1724,1725],{"class":468,"line":842},[466,1726,1727],{"class":512},"      accessibility-label=\"Delete conversation\"\n",[466,1729,1730],{"class":468,"line":852},[466,1731,1732],{"class":512},"      @tap=\"remove(); close()\"\n",[466,1734,1735],{"class":468,"line":857},[466,1736,1695],{"class":512},[466,1738,1739],{"class":468,"line":887},[466,1740,1741],{"class":512},"      \u003Ctext class=\"text-white\">Delete\u003C\u002Ftext>\n",[466,1743,1744],{"class":468,"line":895},[466,1745,1705],{"class":512},[466,1747,1748],{"class":468,"line":910},[466,1749,1750],{"class":512},"  \u003C\u002Ftemplate>\n",[466,1752,1753,1755,1757],{"class":468,"line":925},[466,1754,645],{"class":472},[466,1756,422],{"class":476},[466,1758,499],{"class":472},[1052,1760,1762],{"id":1761},"default-open-and-disabled","Default open and disabled",[417,1764,1765,1766,1769,1770,1773],{},"Use ",[420,1767,1768],{},"defaultOpen"," for uncontrolled initial state. ",[420,1771,1772],{},"disabled"," prevents drag interaction.",[457,1775,1777],{"className":459,"code":1776,"language":461,"meta":462,"style":462},"\u003CVySwipeAction\n  :row-width=\"320\"\n  :action-width=\"88\"\n  default-open\n  disabled\n>\n  \u003Cview class=\"h-16 px-4 justify-center bg-white\">\n    \u003Ctext>Locked row\u003C\u002Ftext>\n  \u003C\u002Fview>\n  \u003Ctemplate #actions>\n    \u003Cview class=\"w-[88px] items-center justify-center bg-neutral-200\">\n      \u003Ctext>Locked\u003C\u002Ftext>\n    \u003C\u002Fview>\n  \u003C\u002Ftemplate>\n\u003C\u002FVySwipeAction>\n",[420,1778,1779,1785,1799,1813,1818,1823,1827,1831,1836,1840,1845,1850,1855,1859,1863],{"__ignoreMap":462},[466,1780,1781,1783],{"class":468,"line":469},[466,1782,473],{"class":472},[466,1784,673],{"class":476},[466,1786,1787,1789,1791,1793,1795,1797],{"class":468,"line":502},[466,1788,1604],{"class":472},[466,1790,1607],{"class":480},[466,1792,487],{"class":472},[466,1794,490],{"class":472},[466,1796,1257],{"class":1614},[466,1798,689],{"class":472},[466,1800,1801,1803,1805,1807,1809,1811],{"class":468,"line":530},[466,1802,1604],{"class":472},[466,1804,1623],{"class":480},[466,1806,487],{"class":472},[466,1808,490],{"class":472},[466,1810,1270],{"class":1614},[466,1812,689],{"class":472},[466,1814,1815],{"class":468,"line":550},[466,1816,1817],{"class":480},"  default-open\n",[466,1819,1820],{"class":468,"line":557},[466,1821,1822],{"class":480},"  disabled\n",[466,1824,1825],{"class":468,"line":581},[466,1826,499],{"class":472},[466,1828,1829],{"class":468,"line":599},[466,1830,1641],{"class":512},[466,1832,1833],{"class":468,"line":604},[466,1834,1835],{"class":512},"    \u003Ctext>Locked row\u003C\u002Ftext>\n",[466,1837,1838],{"class":468,"line":619},[466,1839,1651],{"class":512},[466,1841,1842],{"class":468,"line":636},[466,1843,1844],{"class":512},"  \u003Ctemplate #actions>\n",[466,1846,1847],{"class":468,"line":642},[466,1848,1849],{"class":512},"    \u003Cview class=\"w-[88px] items-center justify-center bg-neutral-200\">\n",[466,1851,1852],{"class":468,"line":652},[466,1853,1854],{"class":512},"      \u003Ctext>Locked\u003C\u002Ftext>\n",[466,1856,1857],{"class":468,"line":657},[466,1858,1705],{"class":512},[466,1860,1861],{"class":468,"line":667},[466,1862,1750],{"class":512},[466,1864,1865,1867,1869],{"class":468,"line":676},[466,1866,645],{"class":472},[466,1868,422],{"class":476},[466,1870,499],{"class":472},[1052,1872,1874],{"id":1873},"custom-styles","Custom styles",[417,1876,1765,1877,1880,1881,1884],{},[420,1878,1879],{},"class"," for the root or ",[420,1882,1883],{},"ui"," for the foreground and action panel wrappers.",[457,1886,1888],{"className":459,"code":1887,"language":461,"meta":462,"style":462},"\u003CVySwipeAction\n  v-model:open=\"open\"\n  :row-width=\"360\"\n  :action-width=\"96\"\n  class=\"rounded-xl\"\n  :ui=\"{\n    content: 'bg-neutral-50',\n    actions: 'bg-error-50',\n  }\"\n>\n  \u003Cview class=\"h-16 px-4 justify-center\">\n    \u003Ctext>Styled row\u003C\u002Ftext>\n  \u003C\u002Fview>\n  \u003Ctemplate #actions=\"{ close }\">\n    \u003Cview class=\"w-24 items-center justify-center\" @tap=\"close\">\n      \u003Ctext class=\"text-error-700\">Close\u003C\u002Ftext>\n    \u003C\u002Fview>\n  \u003C\u002Ftemplate>\n\u003C\u002FVySwipeAction>\n",[420,1889,1890,1896,1912,1926,1940,1954,1967,1985,2001,2008,2012,2017,2022,2026,2030,2035,2040,2044,2048],{"__ignoreMap":462},[466,1891,1892,1894],{"class":468,"line":469},[466,1893,473],{"class":472},[466,1895,673],{"class":476},[466,1897,1898,1900,1902,1904,1906,1908,1910],{"class":468,"line":502},[466,1899,1587],{"class":480},[466,1901,1312],{"class":472},[466,1903,702],{"class":480},[466,1905,487],{"class":472},[466,1907,490],{"class":472},[466,1909,702],{"class":512},[466,1911,689],{"class":472},[466,1913,1914,1916,1918,1920,1922,1924],{"class":468,"line":530},[466,1915,1604],{"class":472},[466,1917,1607],{"class":480},[466,1919,487],{"class":472},[466,1921,490],{"class":472},[466,1923,717],{"class":1614},[466,1925,689],{"class":472},[466,1927,1928,1930,1932,1934,1936,1938],{"class":468,"line":550},[466,1929,1604],{"class":472},[466,1931,1623],{"class":480},[466,1933,487],{"class":472},[466,1935,490],{"class":472},[466,1937,732],{"class":1614},[466,1939,689],{"class":472},[466,1941,1942,1945,1947,1949,1952],{"class":468,"line":557},[466,1943,1944],{"class":480},"  class",[466,1946,487],{"class":472},[466,1948,490],{"class":472},[466,1950,1951],{"class":493},"rounded-xl",[466,1953,689],{"class":472},[466,1955,1956,1958,1960,1962,1964],{"class":468,"line":581},[466,1957,1604],{"class":472},[466,1959,1883],{"class":480},[466,1961,487],{"class":472},[466,1963,490],{"class":472},[466,1965,1966],{"class":472},"{\n",[466,1968,1969,1972,1974,1976,1979,1982],{"class":468,"line":599},[466,1970,1971],{"class":476},"    content",[466,1973,1312],{"class":472},[466,1975,522],{"class":472},[466,1977,1978],{"class":493},"bg-neutral-50",[466,1980,1981],{"class":472},"'",[466,1983,1984],{"class":472},",\n",[466,1986,1987,1990,1992,1994,1997,1999],{"class":468,"line":604},[466,1988,1989],{"class":476},"    actions",[466,1991,1312],{"class":472},[466,1993,522],{"class":472},[466,1995,1996],{"class":493},"bg-error-50",[466,1998,1981],{"class":472},[466,2000,1984],{"class":472},[466,2002,2003,2006],{"class":468,"line":619},[466,2004,2005],{"class":472},"  }",[466,2007,689],{"class":472},[466,2009,2010],{"class":468,"line":636},[466,2011,499],{"class":472},[466,2013,2014],{"class":468,"line":642},[466,2015,2016],{"class":512},"  \u003Cview class=\"h-16 px-4 justify-center\">\n",[466,2018,2019],{"class":468,"line":652},[466,2020,2021],{"class":512},"    \u003Ctext>Styled row\u003C\u002Ftext>\n",[466,2023,2024],{"class":468,"line":657},[466,2025,1651],{"class":512},[466,2027,2028],{"class":468,"line":667},[466,2029,1660],{"class":512},[466,2031,2032],{"class":468,"line":676},[466,2033,2034],{"class":512},"    \u003Cview class=\"w-24 items-center justify-center\" @tap=\"close\">\n",[466,2036,2037],{"class":468,"line":692},[466,2038,2039],{"class":512},"      \u003Ctext class=\"text-error-700\">Close\u003C\u002Ftext>\n",[466,2041,2042],{"class":468,"line":707},[466,2043,1705],{"class":512},[466,2045,2046],{"class":468,"line":722},[466,2047,1750],{"class":512},[466,2049,2050,2052,2054],{"class":468,"line":737},[466,2051,645],{"class":472},[466,2053,422],{"class":476},[466,2055,499],{"class":472},[412,2057,2059],{"id":2058},"features-and-behavior","Features and behavior",[2061,2062,2063,2073,2084,2093,2108,2114,2119],"ul",{},[2064,2065,2066,2067,2069,2070,2072],"li",{},"Bind ",[420,2068,1065],{}," for controlled open state, or use ",[420,2071,1768],{}," for an uncontrolled initial state.",[2064,2074,2075,2076,2079,2080,2083],{},"The foreground row translates from ",[420,2077,2078],{},"0"," when closed to ",[420,2081,2082],{},"-actionWidth"," when open.",[2064,2085,2086,2087,451,2089,2092],{},"During a drag, translation is clamped between ",[420,2088,2078],{},[420,2090,2091],{},"-rowWidth",", allowing a full-swipe commit beyond the visible action panel.",[2064,2094,2095,2096,451,2098,2100,2101,2103,2104,2107],{},"The ",[420,2097,1300],{},[420,2099,867],{}," slots both receive the resolved ",[420,2102,702],{}," state and a ",[420,2105,2106],{},"close()"," function.",[2064,2109,2110,2111,2113],{},"External changes to ",[420,2112,702],{}," animate the row to its open or closed position.",[2064,2115,2116,2118],{},[420,2117,1772],{}," ignores touch start, so the current state remains unchanged.",[2064,2120,2121],{},"Vertical intent is yielded to a surrounding list after the gesture direction is resolved.",[1052,2123,2125],{"id":2124},"gesture-behavior","Gesture behavior",[2127,2128,2129,2145],"table",{},[2130,2131,2132],"thead",{},[2133,2134,2135,2139,2142],"tr",{},[2136,2137,2138],"th",{},"Release condition",[2136,2140,2141],{},"Default",[2136,2143,2144],{},"Result",[2146,2147,2148,2165,2179,2191,2205,2220],"tbody",{},[2133,2149,2150,2157,2162],{},[2151,2152,2153,2154],"td",{},"Drag past ",[420,2155,2156],{},"threshold × actionWidth",[2151,2158,2159],{},[420,2160,2161],{},"0.5 × actionWidth",[2151,2163,2164],{},"Snaps the row open.",[2133,2166,2167,2173,2176],{},[2151,2168,2169,2170],{},"Leftward velocity at least ",[420,2171,2172],{},"400px\u002Fs",[2151,2174,2175],{},"Core default",[2151,2177,2178],{},"Snaps open even before the position threshold.",[2133,2180,2181,2186,2188],{},[2151,2182,2183,2184],{},"Rightward velocity at least ",[420,2185,2172],{},[2151,2187,2175],{},[2151,2189,2190],{},"Closes even when the row is past the open threshold.",[2133,2192,2193,2198,2200],{},[2151,2194,2153,2195],{},[420,2196,2197],{},"0.5 × rowWidth",[2151,2199,2175],{},[2151,2201,2202,2203,427],{},"Animates through the row and emits ",[420,2204,426],{},[2133,2206,2207,2212,2214],{},[2151,2208,2169,2209],{},[420,2210,2211],{},"1200px\u002Fs",[2151,2213,2175],{},[2151,2215,2216,2217,2219],{},"Emits ",[420,2218,426],{}," regardless of position.",[2133,2221,2222,2225,2230],{},[2151,2223,2224],{},"Release animation",[2151,2226,2227],{},[420,2228,2229],{},"240ms",[2151,2231,2232],{},"Animates to closed, open, or committed position.",[417,2234,2235,2236,2239,2240,2243],{},"The gesture stays undecided for the first ",[420,2237,2238],{},"8px",". It then claims drags within the horizontal ",[420,2241,2242],{},"45°"," cone and yields predominantly vertical drags for the rest of that touch.",[417,2245,2246,2247,2250,2251,2253,2254,2257,2258,2257,2261,2264,2265,2268],{},"Only the open ",[420,2248,2249],{},"threshold"," is exposed by ",[420,2252,422],{},". The core primitive also has ",[420,2255,2256],{},"commitThreshold",", ",[420,2259,2260],{},"commitVelocity",[420,2262,2263],{},"velocityThreshold",", and ",[420,2266,2267],{},"duration"," props, but the current kit wrapper does not forward them.",[436,2270,2271],{},[417,2272,2273,2274,2277],{},"The action panel is physically anchored to the trailing right edge and opens with a leftward swipe. ",[420,2275,2276],{},"side=\"left\""," currently changes action alignment styling only; it does not move the panel or reverse the gesture.",[412,2279,2281],{"id":2280},"props","Props",[2127,2283,2284,2299],{},[2130,2285,2286],{},[2133,2287,2288,2291,2294,2296],{},[2136,2289,2290],{},"Prop",[2136,2292,2293],{},"Type",[2136,2295,2141],{},[2136,2297,2298],{},"Description",[2146,2300,2301,2318,2333,2354,2371,2388,2410,2430,2448],{},[2133,2302,2303,2307,2312,2315],{},[2151,2304,2305],{},[420,2306,454],{},[2151,2308,2309],{},[420,2310,2311],{},"number",[2151,2313,2314],{},"Required",[2151,2316,2317],{},"Revealed action-panel width in pixels and the basis for the open threshold.",[2133,2319,2320,2324,2328,2330],{},[2151,2321,2322],{},[420,2323,450],{},[2151,2325,2326],{},[420,2327,2311],{},[2151,2329,2314],{},[2151,2331,2332],{},"Full row width in pixels and the basis for the commit threshold.",[2133,2334,2335,2339,2344,2349],{},[2151,2336,2337],{},[420,2338,702],{},[2151,2340,2341],{},[420,2342,2343],{},"boolean",[2151,2345,2346],{},[420,2347,2348],{},"undefined",[2151,2350,2351,2352,427],{},"Controlled open state used by ",[420,2353,1065],{},[2133,2355,2356,2360,2364,2368],{},[2151,2357,2358],{},[420,2359,1768],{},[2151,2361,2362],{},[420,2363,2343],{},[2151,2365,2366],{},[420,2367,575],{},[2151,2369,2370],{},"Initial open state when uncontrolled.",[2133,2372,2373,2377,2381,2385],{},[2151,2374,2375],{},[420,2376,1772],{},[2151,2378,2379],{},[420,2380,2343],{},[2151,2382,2383],{},[420,2384,575],{},[2151,2386,2387],{},"Disables drag interaction.",[2133,2389,2390,2394,2398,2404],{},[2151,2391,2392],{},[420,2393,2249],{},[2151,2395,2396],{},[420,2397,2311],{},[2151,2399,2400,2403],{},[420,2401,2402],{},"0.5"," in core",[2151,2405,2406,2407,2409],{},"Fraction of ",[420,2408,454],{}," required to snap open without a velocity override.",[2133,2411,2412,2417,2422,2427],{},[2151,2413,2414],{},[420,2415,2416],{},"side",[2151,2418,2419],{},[420,2420,2421],{},"'left' | 'right'",[2151,2423,2424],{},[420,2425,2426],{},"'right'",[2151,2428,2429],{},"Action alignment theme variant; the physical panel remains on the right.",[2133,2431,2432,2436,2441,2445],{},[2151,2433,2434],{},[420,2435,1879],{},[2151,2437,2438],{},[420,2439,2440],{},"any",[2151,2442,2443],{},[420,2444,2348],{},[2151,2446,2447],{},"Classes merged onto the root slot.",[2133,2449,2450,2454,2459,2463],{},[2151,2451,2452],{},[420,2453,1883],{},[2151,2455,2456],{},[420,2457,2458],{},"Partial\u003CRecord\u003CSwipeActionSlot, any>>",[2151,2460,2461],{},[420,2462,2348],{},[2151,2464,2465],{},"Per-instance theme slot overrides.",[417,2467,2468,2469,2471,2472,451,2474,2477],{},"Keep ",[420,2470,2249],{}," between ",[420,2473,2078],{},[420,2475,2476],{},"1",". Widths must match the rendered layout; stale or approximate values produce incorrect snap and commit points.",[412,2479,2481],{"id":2480},"emits","Emits",[2127,2483,2484,2496],{},[2130,2485,2486],{},[2133,2487,2488,2491,2494],{},[2136,2489,2490],{},"Event",[2136,2492,2493],{},"Payload",[2136,2495,2298],{},[2146,2497,2498,2512],{},[2133,2499,2500,2505,2509],{},[2151,2501,2502],{},[420,2503,2504],{},"update:open",[2151,2506,2507],{},[420,2508,2343],{},[2151,2510,2511],{},"The row snapped open, closed, or was closed through the slot helper.",[2133,2513,2514,2518,2521],{},[2151,2515,2516],{},[420,2517,426],{},[2151,2519,2520],{},"none",[2151,2522,2523],{},"A release crossed the core full-swipe position or velocity threshold.",[417,2525,2526,2528],{},[420,2527,426],{}," describes the gesture; it does not delete, archive, or otherwise mutate application data for you.",[412,2530,2532],{"id":2531},"slots","Slots",[2127,2534,2535,2546],{},[2130,2536,2537],{},[2133,2538,2539,2542,2544],{},[2136,2540,2541],{},"Slot",[2136,2543,2281],{},[2136,2545,2298],{},[2146,2547,2548,2562],{},[2133,2549,2550,2554,2559],{},[2151,2551,2552],{},[420,2553,1300],{},[2151,2555,2556],{},[420,2557,2558],{},"{ open: boolean, close: () => void }",[2151,2560,2561],{},"Foreground row content that moves with the gesture.",[2133,2563,2564,2568,2572],{},[2151,2565,2566],{},[420,2567,867],{},[2151,2569,2570],{},[420,2571,2558],{},[2151,2573,2574],{},"Trailing action-panel content revealed beneath the row.",[412,2576,2578],{"id":2577},"styling-and-theming","Styling and theming",[417,2580,2581,2582,2585,2586,427],{},"Override globally through ",[420,2583,2584],{},"appConfig.ui.swipeAction"," or locally with ",[420,2587,1883],{},[2127,2589,2590,2600],{},[2130,2591,2592],{},[2133,2593,2594,2597],{},[2136,2595,2596],{},"UI slot",[2136,2598,2599],{},"Purpose",[2146,2601,2602,2612,2621],{},[2133,2603,2604,2609],{},[2151,2605,2606],{},[420,2607,2608],{},"root",[2151,2610,2611],{},"Relative clipping container around the primitive.",[2133,2613,2614,2618],{},[2151,2615,2616],{},[420,2617,867],{},[2151,2619,2620],{},"Flex wrapper inside the trailing action panel.",[2133,2622,2623,2628],{},[2151,2624,2625],{},[420,2626,2627],{},"content",[2151,2629,2630],{},"Flex wrapper around the foreground row content.",[417,2632,2095,2633,2635,2636,2639,2640,2643,2644,2646,2647,451,2650,2653,2654,2658],{},[420,2634,2416],{}," variant sets ",[420,2637,2638],{},"justify-start"," or ",[420,2641,2642],{},"justify-end"," on ",[420,2645,867],{},". The default theme uses the ",[420,2648,2649],{},"bg-default",[420,2651,2652],{},"bg-elevated"," surface tokens for the foreground and action wrapper, so it adapts automatically under dark mode (see ",[2655,2656,2657],"a",{"href":319},"Theming → Dark Mode",").",[412,2660,328],{"id":2661},"accessibility",[417,2663,2664,2666,2667,2669],{},[420,2665,422],{}," does not currently add native button, adjustable, group, expanded-state, or gesture instructions to the row. Swipe gestures also have no direct keyboard or switch-control equivalent. Every action in the ",[420,2668,867],{}," slot should therefore be an independently labeled native control, and any destructive full-swipe behavior should have a visible, non-gesture alternative.",[417,2671,2672,2673,2257,2676,2264,2679,2682],{},"The examples add Lynx ",[420,2674,2675],{},"accessibility-element",[420,2677,2678],{},"accessibility-traits",[420,2680,2681],{},"accessibility-label"," attributes to tappable action views. Also expose the same operation elsewhere when a row can be committed by swiping, and consider confirmation or undo for destructive actions.",[412,2684,2686],{"id":2685},"platform-notes","Platform notes",[2061,2688,2689,2692,2695,2703,2706],{},[2064,2690,2691],{},"Touch tracking, axis locking, velocity calculation, clamping, and release animation run on the Lynx main thread.",[2064,2693,2694],{},"The component is designed for rows inside vertical native lists; predominantly vertical gestures are released without moving or snapping the row.",[2064,2696,2697,2698,451,2700,2702],{},"There is no automatic measurement. Recalculate and pass ",[420,2699,450],{},[420,2701,454],{}," when layout width changes.",[2064,2704,2705],{},"Only a trailing right-edge panel and leftward reveal gesture are implemented today. RTL and leading-edge reveal are not exposed.",[2064,2707,2708],{},"A full-swipe commit should update or remove the affected row promptly so the completed translation does not leave stale content on screen.",[412,2710,2712],{"id":2711},"related-components","Related components",[2061,2714,2715,2722,2730],{},[2064,2716,2717,2721],{},[2655,2718,2719],{"href":268},[420,2720,267],{}," for paging between full content panels.",[2064,2723,2724,2729],{},[2655,2725,2726],{"href":67},[420,2727,2728],{},"ActionSheet"," for presenting a temporary list of actions.",[2064,2731,2732,2735],{},[420,2733,2734],{},"DropdownMenu"," for actions opened by an explicit trigger.",[2737,2738,2739],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":462,"searchDepth":469,"depth":502,"links":2741},[2742,2743,2749,2752,2753,2754,2755,2756,2757,2758],{"id":414,"depth":502,"text":415},{"id":443,"depth":502,"text":444,"children":2744},[2745,2746,2747,2748],{"id":1054,"depth":530,"text":1055},{"id":1565,"depth":530,"text":1566},{"id":1761,"depth":530,"text":1762},{"id":1873,"depth":530,"text":1874},{"id":2058,"depth":502,"text":2059,"children":2750},[2751],{"id":2124,"depth":530,"text":2125},{"id":2280,"depth":502,"text":2281},{"id":2480,"depth":502,"text":2481},{"id":2531,"depth":502,"text":2532},{"id":2577,"depth":502,"text":2578},{"id":2661,"depth":502,"text":328},{"id":2685,"depth":502,"text":2686},{"id":2711,"depth":502,"text":2712},"Reveal trailing row actions or commit an action with a full swipe.","md",[2762],{"label":2763,"icon":2764,"to":2765,"target":2766},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002FKealanAU\u002Fvyui\u002Fblob\u002Fmain\u002Fpackages\u002Fkit\u002Fsrc\u002Fcomponents\u002FSwipeAction.vue","_blank",{},{"icon":265},{"title":262,"description":2759},"pjnaZH1p4i5gJung08hSK0DSaNkc5Ab1xyjT9KlGZcs",[2772,2774],{"title":257,"path":258,"stem":259,"description":2773,"icon":-1,"children":-1,"navigation":-1},"Show progress through an ordered, optionally linear sequence of steps.",{"title":267,"path":268,"stem":269,"description":2775,"icon":-1,"children":-1,"navigation":-1},"Present swipeable, snapping content as a paged carousel.",1783534420328]