[{"data":1,"prerenderedAt":1490},["ShallowReactive",2],{"navigation-landing-en":3,"navigation-nuxt-auto-en":180,"navigation-nuxt-protokit-en":338,"/docs/nuxt-protokit/components/proto-crud-modal-en":444,"/docs/nuxt-protokit/components/proto-crud-modal-surround-en":1485},[4,8,13,28,41,51,64,77,94,110,134,150,157,172],{"title":5,"path":6,"stem":7},"Overview","/docs/landing","0.docs/1.landing/001.index",{"title":9,"path":10,"stem":11,"badge":12},"Built-in Features","/docs/landing/built-in-features","0.docs/1.landing/002.built-in-features","New",{"title":14,"path":15,"stem":16,"children":17,"icon":27},"Content Foundation","/docs/landing/content","0.docs/1.landing/02.content/1.index",[18,19,23],{"title":5,"path":15,"stem":16},{"title":20,"path":21,"stem":22},"Details","/docs/landing/content/details","0.docs/1.landing/02.content/2.details",{"title":24,"path":25,"stem":26},"Technical","/docs/landing/content/technical","0.docs/1.landing/02.content/4.technical","i-heroicons-document-text",{"title":29,"path":30,"stem":31,"children":32,"icon":40},"Regional Content","/docs/landing/regional","0.docs/1.landing/03.regional/1.index",[33,34,37],{"title":5,"path":30,"stem":31},{"title":20,"path":35,"stem":36},"/docs/landing/regional/details","0.docs/1.landing/03.regional/2.details",{"title":24,"path":38,"stem":39},"/docs/landing/regional/technical","0.docs/1.landing/03.regional/4.technical","i-heroicons-globe-alt",{"title":42,"path":43,"stem":44,"children":45,"icon":50},"Multi-language","/docs/landing/multilang","0.docs/1.landing/04.multilang/1.index",[46,47],{"title":5,"path":43,"stem":44},{"title":20,"path":48,"stem":49},"/docs/landing/multilang/details","0.docs/1.landing/04.multilang/2.details","i-heroicons-language",{"title":52,"path":53,"stem":54,"children":55,"icon":63},"Blog","/docs/landing/blog","0.docs/1.landing/05.blog/1.index",[56,57,60],{"title":5,"path":53,"stem":54},{"title":20,"path":58,"stem":59},"/docs/landing/blog/details","0.docs/1.landing/05.blog/2.details",{"title":24,"path":61,"stem":62},"/docs/landing/blog/technical","0.docs/1.landing/05.blog/4.technical","i-heroicons-pencil-square",{"title":65,"path":66,"stem":67,"children":68,"icon":76},"Documentation","/docs/landing/docs","0.docs/1.landing/06.docs/1.index",[69,70,73],{"title":5,"path":66,"stem":67},{"title":20,"path":71,"stem":72},"/docs/landing/docs/details","0.docs/1.landing/06.docs/2.details",{"title":24,"path":74,"stem":75},"/docs/landing/docs/technical","0.docs/1.landing/06.docs/4.technical","i-heroicons-book-open",{"title":78,"path":79,"stem":80,"children":81,"icon":93},"Forms","/docs/landing/forms","0.docs/1.landing/07.forms/1.index",[82,83,86,90],{"title":5,"path":79,"stem":80},{"title":20,"path":84,"stem":85},"/docs/landing/forms/details","0.docs/1.landing/07.forms/2.details",{"title":87,"path":88,"stem":89},"Admin","/docs/landing/forms/admin","0.docs/1.landing/07.forms/3.admin",{"title":24,"path":91,"stem":92},"/docs/landing/forms/technical","0.docs/1.landing/07.forms/4.technical","i-heroicons-clipboard-document-list",{"title":95,"path":96,"stem":97,"children":98,"icon":109},"Email","/docs/landing/email","0.docs/1.landing/08.email/1.index",[99,100,103,106],{"title":5,"path":96,"stem":97},{"title":20,"path":101,"stem":102},"/docs/landing/email/details","0.docs/1.landing/08.email/2.details",{"title":87,"path":104,"stem":105},"/docs/landing/email/admin","0.docs/1.landing/08.email/3.admin",{"title":24,"path":107,"stem":108},"/docs/landing/email/technical","0.docs/1.landing/08.email/4.technical","i-heroicons-envelope",{"title":111,"path":112,"stem":113,"children":114,"icon":133},"Feedback Platform","/docs/landing/feedback","0.docs/1.landing/09.feedback/1.index",[115,116,119,122,125,129],{"title":5,"path":112,"stem":113},{"title":20,"path":117,"stem":118},"/docs/landing/feedback/details","0.docs/1.landing/09.feedback/2.details",{"title":87,"path":120,"stem":121},"/docs/landing/feedback/admin","0.docs/1.landing/09.feedback/3.admin",{"title":24,"path":123,"stem":124},"/docs/landing/feedback/technical","0.docs/1.landing/09.feedback/4.technical",{"title":126,"path":127,"stem":128},"Compare vs SaaS","/docs/landing/feedback/compare","0.docs/1.landing/09.feedback/5.compare",{"title":130,"path":131,"stem":132},"FAQ","/docs/landing/feedback/faq","0.docs/1.landing/09.feedback/6.faq","i-heroicons-chat-bubble-left-right",{"title":135,"path":136,"stem":137,"children":138,"icon":149},"Storage","/docs/landing/storage","0.docs/1.landing/10.storage/1.index",[139,140,143,146],{"title":5,"path":136,"stem":137},{"title":20,"path":141,"stem":142},"/docs/landing/storage/details","0.docs/1.landing/10.storage/2.details",{"title":87,"path":144,"stem":145},"/docs/landing/storage/admin","0.docs/1.landing/10.storage/3.admin",{"title":24,"path":147,"stem":148},"/docs/landing/storage/technical","0.docs/1.landing/10.storage/4.technical","i-heroicons-circle-stack",{"title":151,"path":152,"stem":153,"children":154,"icon":156},"Offline First","/docs/landing/offline-first","0.docs/1.landing/11.offline-first/1.index",[155],{"title":151,"path":152,"stem":153},"i-heroicons-users",{"title":158,"path":159,"stem":160,"children":161,"icon":156},"Yjs Sync","/docs/landing/yjs-sync","0.docs/1.landing/12.yjs-sync/1.index",[162,163,166,169],{"title":5,"path":159,"stem":160},{"title":20,"path":164,"stem":165},"/docs/landing/yjs-sync/details","0.docs/1.landing/12.yjs-sync/2.details",{"title":87,"path":167,"stem":168},"/docs/landing/yjs-sync/admin","0.docs/1.landing/12.yjs-sync/3.admin",{"title":24,"path":170,"stem":171},"/docs/landing/yjs-sync/technical","0.docs/1.landing/12.yjs-sync/4.technical",{"title":173,"path":174,"stem":175,"children":176,"badge":178,"icon":179},"Newsletter","/docs/landing/newsletter","0.docs/1.landing/13.newsletter/index",[177],{"title":173,"path":174,"stem":175,"badge":178},"Coming Soon","i-lucide-send",[181,184,202,298],{"title":5,"path":182,"stem":183},"/docs/nuxt-auto","0.docs/3.nuxt-auto/index",{"title":185,"path":186,"stem":187,"children":188,"page":201},"Getting Started","/docs/nuxt-auto/getting-started","0.docs/3.nuxt-auto/1.getting-started",[189,193,197],{"title":190,"path":191,"stem":192},"Introduction","/docs/nuxt-auto/getting-started/introduction","0.docs/3.nuxt-auto/1.getting-started/1.introduction",{"title":194,"path":195,"stem":196},"Installation","/docs/nuxt-auto/getting-started/installation","0.docs/3.nuxt-auto/1.getting-started/2.installation",{"title":198,"path":199,"stem":200},"Quick Start","/docs/nuxt-auto/getting-started/quick-start","0.docs/3.nuxt-auto/1.getting-started/3.quick-start",false,{"title":203,"path":204,"stem":205,"children":206,"page":201},"Auto API","/docs/nuxt-auto/auto-api","0.docs/3.nuxt-auto/2.auto-api",[207,210,214,218,222,226,230,234,238,242,246,250,254,258,262,266,270,274,278,282,286,290,294],{"title":185,"path":208,"stem":209},"/docs/nuxt-auto/auto-api/getting-started","0.docs/3.nuxt-auto/2.auto-api/1.getting-started",{"title":211,"path":212,"stem":213},"Aggregations","/docs/nuxt-auto/auto-api/aggregations","0.docs/3.nuxt-auto/2.auto-api/10.aggregations",{"title":215,"path":216,"stem":217},"Lifecycle Hooks","/docs/nuxt-auto/auto-api/lifecycle-hooks","0.docs/3.nuxt-auto/2.auto-api/11.lifecycle-hooks",{"title":219,"path":220,"stem":221},"Many-to-Many (M2M) Relationships","/docs/nuxt-auto/auto-api/m2m-relationships","0.docs/3.nuxt-auto/2.auto-api/12.m2m-relationships",{"title":223,"path":224,"stem":225},"Plugin System","/docs/nuxt-auto/auto-api/plugin-system","0.docs/3.nuxt-auto/2.auto-api/13.plugin-system",{"title":227,"path":228,"stem":229},"Database Adapters","/docs/nuxt-auto/auto-api/database-adapters","0.docs/3.nuxt-auto/2.auto-api/14.database-adapters",{"title":231,"path":232,"stem":233},"Custom Endpoints","/docs/nuxt-auto/auto-api/custom-endpoints","0.docs/3.nuxt-auto/2.auto-api/15.custom-endpoints",{"title":235,"path":236,"stem":237},"Multi-Tenancy","/docs/nuxt-auto/auto-api/multi-tenancy","0.docs/3.nuxt-auto/2.auto-api/16.multi-tenancy",{"title":239,"path":240,"stem":241},"Validation","/docs/nuxt-auto/auto-api/validation","0.docs/3.nuxt-auto/2.auto-api/2.validation",{"title":243,"path":244,"stem":245},"Rate Limiting","/docs/nuxt-auto/auto-api/rate-limiting","0.docs/3.nuxt-auto/2.auto-api/20.rate-limiting",{"title":247,"path":248,"stem":249},"Request Metadata Plugin","/docs/nuxt-auto/auto-api/request-metadata","0.docs/3.nuxt-auto/2.auto-api/21.request-metadata",{"title":251,"path":252,"stem":253},"Plugin Catalog","/docs/nuxt-auto/auto-api/plugin-catalog","0.docs/3.nuxt-auto/2.auto-api/22.plugin-catalog",{"title":255,"path":256,"stem":257},"Handler Overrides","/docs/nuxt-auto/auto-api/handler-overrides","0.docs/3.nuxt-auto/2.auto-api/3.handler-overrides",{"title":259,"path":260,"stem":261},"Cloudflare D1","/docs/nuxt-auto/auto-api/cloudflare-d1","0.docs/3.nuxt-auto/2.auto-api/30.cloudflare-d1",{"title":263,"path":264,"stem":265},"SQLite to D1 Migration","/docs/nuxt-auto/auto-api/migration-sqlite-d1","0.docs/3.nuxt-auto/2.auto-api/31.migration-sqlite-d1",{"title":267,"path":268,"stem":269},"Frontend Composables","/docs/nuxt-auto/auto-api/frontend-composables","0.docs/3.nuxt-auto/2.auto-api/32.frontend-composables",{"title":271,"path":272,"stem":273},"Testing","/docs/nuxt-auto/auto-api/testing","0.docs/3.nuxt-auto/2.auto-api/33.testing",{"title":275,"path":276,"stem":277},"Pagination","/docs/nuxt-auto/auto-api/pagination","0.docs/3.nuxt-auto/2.auto-api/4.pagination",{"title":279,"path":280,"stem":281},"Soft Deletes","/docs/nuxt-auto/auto-api/soft-deletes","0.docs/3.nuxt-auto/2.auto-api/5.soft-deletes",{"title":283,"path":284,"stem":285},"Authentication & Authorization","/docs/nuxt-auto/auto-api/authentication-authorization","0.docs/3.nuxt-auto/2.auto-api/6.authentication-authorization",{"title":287,"path":288,"stem":289},"Better-Auth Integration","/docs/nuxt-auto/auto-api/better-auth","0.docs/3.nuxt-auto/2.auto-api/7.better-auth",{"title":291,"path":292,"stem":293},"Nested Relations","/docs/nuxt-auto/auto-api/nested-relationships","0.docs/3.nuxt-auto/2.auto-api/8.nested-relationships",{"title":295,"path":296,"stem":297},"Bulk Operations","/docs/nuxt-auto/auto-api/bulk-operations","0.docs/3.nuxt-auto/2.auto-api/9.bulk-operations",{"title":299,"path":300,"stem":301,"children":302,"page":201},"Auto Admin","/docs/nuxt-auto/auto-admin","0.docs/3.nuxt-auto/3.auto-admin",[303,306,310,314,318,322,326,330,334],{"title":185,"path":304,"stem":305},"/docs/nuxt-auto/auto-admin/getting-started","0.docs/3.nuxt-auto/3.auto-admin/1.getting-started",{"title":307,"path":308,"stem":309},"Configuration & Theming","/docs/nuxt-auto/auto-admin/configuration-theming","0.docs/3.nuxt-auto/3.auto-admin/2.configuration-theming",{"title":311,"path":312,"stem":313},"Resource Configuration","/docs/nuxt-auto/auto-admin/resource-configuration","0.docs/3.nuxt-auto/3.auto-admin/3.resource-configuration",{"title":315,"path":316,"stem":317},"Form Fields & Widgets","/docs/nuxt-auto/auto-admin/form-fields-widgets","0.docs/3.nuxt-auto/3.auto-admin/4.form-fields-widgets",{"title":319,"path":320,"stem":321},"Permissions","/docs/nuxt-auto/auto-admin/permissions","0.docs/3.nuxt-auto/3.auto-admin/5.permissions",{"title":323,"path":324,"stem":325},"Custom Pages","/docs/nuxt-auto/auto-admin/custom-pages","0.docs/3.nuxt-auto/3.auto-admin/6.custom-pages",{"title":327,"path":328,"stem":329},"M2M Relationships","/docs/nuxt-auto/auto-admin/m2m-relationships","0.docs/3.nuxt-auto/3.auto-admin/7.m2m-relationships",{"title":331,"path":332,"stem":333},"Custom Actions","/docs/nuxt-auto/auto-admin/custom-actions","0.docs/3.nuxt-auto/3.auto-admin/8.custom-actions",{"title":335,"path":336,"stem":337},"Composables","/docs/nuxt-auto/auto-admin/composables","0.docs/3.nuxt-auto/3.auto-admin/9.composables",[339,342,355,382,400,415,425],{"title":5,"path":340,"stem":341},"/docs/nuxt-protokit","0.docs/4.nuxt-protokit/index",{"title":185,"path":343,"stem":344,"children":345,"icon":354},"/docs/nuxt-protokit/getting-started","0.docs/4.nuxt-protokit/1.getting-started/1.index",[346,347,351],{"title":190,"path":343,"stem":344},{"title":348,"path":349,"stem":350},"Core Concepts","/docs/nuxt-protokit/getting-started/concepts","0.docs/4.nuxt-protokit/1.getting-started/2.concepts",{"title":198,"path":352,"stem":353},"/docs/nuxt-protokit/getting-started/quick-start","0.docs/4.nuxt-protokit/1.getting-started/3.quick-start","i-lucide-rocket",{"title":356,"path":357,"stem":358,"children":359,"icon":381},"Schemas","/docs/nuxt-protokit/schemas","0.docs/4.nuxt-protokit/2.schemas/1.index",[360,361,365,369,373,377],{"title":5,"path":357,"stem":358},{"title":362,"path":363,"stem":364},"Field Types","/docs/nuxt-protokit/schemas/fields","0.docs/4.nuxt-protokit/2.schemas/2.fields",{"title":366,"path":367,"stem":368},"Collections","/docs/nuxt-protokit/schemas/collections","0.docs/4.nuxt-protokit/2.schemas/3.collections",{"title":370,"path":371,"stem":372},"Derived & Computed","/docs/nuxt-protokit/schemas/derived-computed","0.docs/4.nuxt-protokit/2.schemas/4.derived-computed",{"title":374,"path":375,"stem":376},"Connections","/docs/nuxt-protokit/schemas/connections","0.docs/4.nuxt-protokit/2.schemas/5.connections",{"title":378,"path":379,"stem":380},"Visualizations & Layouts","/docs/nuxt-protokit/schemas/visualizations","0.docs/4.nuxt-protokit/2.schemas/6.visualizations","i-lucide-file-code",{"title":335,"path":383,"stem":384,"children":385,"icon":399},"/docs/nuxt-protokit/composables","0.docs/4.nuxt-protokit/3.composables/1.index",[386,387,391,395],{"title":5,"path":383,"stem":384},{"title":388,"path":389,"stem":390},"usePrototype","/docs/nuxt-protokit/composables/use-prototype","0.docs/4.nuxt-protokit/3.composables/2.use-prototype",{"title":392,"path":393,"stem":394},"useProtoDoc","/docs/nuxt-protokit/composables/use-proto-doc","0.docs/4.nuxt-protokit/3.composables/3.use-proto-doc",{"title":396,"path":397,"stem":398},"useProtoCollection","/docs/nuxt-protokit/composables/use-proto-collection","0.docs/4.nuxt-protokit/3.composables/4.use-proto-collection","i-lucide-layers",{"title":401,"path":402,"stem":403,"children":404,"icon":414},"Components","/docs/nuxt-protokit/components","0.docs/4.nuxt-protokit/4.components/1.index",[405,406,410],{"title":5,"path":402,"stem":403},{"title":407,"path":408,"stem":409},"ProtoTool","/docs/nuxt-protokit/components/proto-tool","0.docs/4.nuxt-protokit/4.components/2.proto-tool",{"title":411,"path":412,"stem":413},"ProtoCrudModal","/docs/nuxt-protokit/components/proto-crud-modal","0.docs/4.nuxt-protokit/4.components/3.proto-crud-modal","i-lucide-puzzle",{"title":151,"path":416,"stem":417,"children":418,"icon":424},"/docs/nuxt-protokit/offline-first","0.docs/4.nuxt-protokit/5.offline-first/1.index",[419,420],{"title":151,"path":416,"stem":417},{"title":421,"path":422,"stem":423},"Corruption Recovery","/docs/nuxt-protokit/offline-first/corruption-recovery","0.docs/4.nuxt-protokit/5.offline-first/2.corruption-recovery","i-lucide-wifi-off",{"title":426,"icon":427,"path":428,"stem":429,"children":430},"Advanced","i-lucide-graduation-cap","/docs/nuxt-protokit/advanced","0.docs/4.nuxt-protokit/6.advanced/1.index",[431,432,436,440],{"title":5,"path":428,"stem":429},{"title":433,"path":434,"stem":435},"Multi-Tool Apps","/docs/nuxt-protokit/advanced/building-a-toolkit","0.docs/4.nuxt-protokit/6.advanced/1.building-a-toolkit",{"title":437,"path":438,"stem":439},"Schema Patterns","/docs/nuxt-protokit/advanced/custom-schema-patterns","0.docs/4.nuxt-protokit/6.advanced/2.custom-schema-patterns",{"title":441,"path":442,"stem":443},"Custom Fields & Viz","/docs/nuxt-protokit/advanced/extensibility","0.docs/4.nuxt-protokit/6.advanced/3.extensibility",{"page":445,"fallbackPage":1480},{"id":446,"title":411,"body":447,"description":1479,"extension":904,"links":1480,"meta":1481,"navigation":1482,"ogImage":1480,"path":412,"seo":1483,"stem":413,"__hash__":1484},"nuxt_protokit/0.docs/4.nuxt-protokit/4.components/3.proto-crud-modal.md",{"type":448,"value":449,"toc":1470},"minimark",[450,457,461,495,500,521,647,651,768,772,816,820,823,836,839,850,856,864,875,879,936,940,1043,1049,1054,1249,1255,1466],[451,452,454],"h1",{"id":453},"protocrudmodal",[455,456,411],"code",{},[458,459,460],"p",{},"A modal editor for a single collection item. Features:",[462,463,464,472,475,486,489],"ul",{},[465,466,467,468,471],"li",{},"Auto-save draft on every change (to ",[455,469,470],{},"Y.Map 'draft:{draftKey}'"," in the document)",[465,473,474],{},"Resume/discard draft banner on next open",[465,476,477,478,481,482,485],{},"2-column layout for wide modals (",[455,479,480],{},"modalSize"," ≥ ",[455,483,484],{},"'lg'",")",[465,487,488],{},"Save/Cancel footer with keyboard shortcut support",[465,490,491,492],{},"Works with all field types including ",[455,493,494],{},"linked-responses",[496,497,499],"h2",{"id":498},"when-to-use-it","When to use it",[458,501,502,503,506,507,510,511,514,515,517,518,520],{},"Set ",[455,504,505],{},"editMode: 'modal'"," on a ",[455,508,509],{},"CollectionSchema"," to have ",[455,512,513],{},"ProtoCrudList"," automatically open ",[455,516,411],{}," when a user clicks an item. You rarely need to instantiate ",[455,519,411],{}," directly.",[522,523,528],"pre",{"className":524,"code":525,"language":526,"meta":527,"style":527},"language-typescript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","collections: {\n  interviews: {\n    label: 'Interviews',\n    fields: { … },\n    editMode:  'modal',   // triggers ProtoCrudModal\n    modalSize: '3xl',\n  }\n}\n","typescript","",[455,529,530,546,556,577,595,618,635,641],{"__ignoreMap":527},[531,532,535,539,543],"span",{"class":533,"line":534},"line",1,[531,536,538],{"class":537},"sBMFI","collections",[531,540,542],{"class":541},"sMK4o",":",[531,544,545],{"class":541}," {\n",[531,547,549,552,554],{"class":533,"line":548},2,[531,550,551],{"class":537},"  interviews",[531,553,542],{"class":541},[531,555,545],{"class":541},[531,557,559,562,564,567,571,574],{"class":533,"line":558},3,[531,560,561],{"class":537},"    label",[531,563,542],{"class":541},[531,565,566],{"class":541}," '",[531,568,570],{"class":569},"sfazB","Interviews",[531,572,573],{"class":541},"'",[531,575,576],{"class":541},",\n",[531,578,580,583,585,588,592],{"class":533,"line":579},4,[531,581,582],{"class":537},"    fields",[531,584,542],{"class":541},[531,586,587],{"class":541}," {",[531,589,591],{"class":590},"swJcz"," … ",[531,593,594],{"class":541},"},\n",[531,596,598,601,603,606,609,611,614],{"class":533,"line":597},5,[531,599,600],{"class":537},"    editMode",[531,602,542],{"class":541},[531,604,605],{"class":541},"  '",[531,607,608],{"class":569},"modal",[531,610,573],{"class":541},[531,612,613],{"class":541},",",[531,615,617],{"class":616},"sHwdD","   // triggers ProtoCrudModal\n",[531,619,621,624,626,628,631,633],{"class":533,"line":620},6,[531,622,623],{"class":537},"    modalSize",[531,625,542],{"class":541},[531,627,566],{"class":541},[531,629,630],{"class":569},"3xl",[531,632,573],{"class":541},[531,634,576],{"class":541},[531,636,638],{"class":533,"line":637},7,[531,639,640],{"class":541},"  }\n",[531,642,644],{"class":533,"line":643},8,[531,645,646],{"class":541},"}\n",[496,648,650],{"id":649},"props-when-using-directly","Props (when using directly)",[652,653,654,673],"table",{},[655,656,657],"thead",{},[658,659,660,664,667,670],"tr",{},[661,662,663],"th",{},"Prop",[661,665,666],{},"Type",[661,668,669],{},"Default",[661,671,672],{},"Description",[674,675,676,695,711,731,748],"tbody",{},[658,677,678,684,689,692],{},[679,680,681],"td",{},[455,682,683],{},"open",[679,685,686],{},[455,687,688],{},"boolean",[679,690,691],{},"required",[679,693,694],{},"Controls modal visibility",[658,696,697,702,706,708],{},[679,698,699],{},[455,700,701],{},"schema",[679,703,704],{},[455,705,509],{},[679,707,691],{},[679,709,710],{},"The collection schema",[658,712,713,718,723,728],{},[679,714,715],{},[455,716,717],{},"item",[679,719,720],{},[455,721,722],{},"CollectionItem | null",[679,724,725],{},[455,726,727],{},"null",[679,729,730],{},"Existing item to edit (null = new item)",[658,732,733,738,743,745],{},[679,734,735],{},[455,736,737],{},"doc",[679,739,740],{},[455,741,742],{},"Y.Doc",[679,744,691],{},[679,746,747],{},"The Y.js document (for draft persistence)",[658,749,750,755,760,765],{},[679,751,752],{},[455,753,754],{},"draftKey",[679,756,757],{},[455,758,759],{},"string",[679,761,762],{},[455,763,764],{},"'default'",[679,766,767],{},"Key suffix for the draft Y.Map entry",[496,769,771],{"id":770},"emits","Emits",[652,773,774,786],{},[655,775,776],{},[658,777,778,781,784],{},[661,779,780],{},"Event",[661,782,783],{},"Payload",[661,785,672],{},[674,787,788,803],{},[658,789,790,795,800],{},[679,791,792],{},[455,793,794],{},"save",[679,796,797],{},[455,798,799],{},"CollectionItem",[679,801,802],{},"Emitted with merged data when user clicks Save",[658,804,805,810,813],{},[679,806,807],{},[455,808,809],{},"cancel",[679,811,812],{},"—",[679,814,815],{},"Emitted when user cancels or closes",[496,817,819],{"id":818},"draft-persistence","Draft persistence",[458,821,822],{},"When a user edits a form in the modal and then closes it without saving (navigates away, switches tabs, closes the browser), the in-progress edits are stored as a draft.",[458,824,825,829,830,832,833,835],{},[826,827,828],"strong",{},"Storage location:"," ",[455,831,470],{}," inside the shared ",[455,834,742],{},".",[458,837,838],{},"Because drafts live in the Y.js document (backed by IndexedDB), they:",[462,840,841,844,847],{},[465,842,843],{},"Survive page refreshes and browser restarts",[465,845,846],{},"Persist even when offline",[465,848,849],{},"Sync to the server when connectivity is restored (so drafts survive across devices if the user has an account)",[458,851,852,855],{},[826,853,854],{},"Draft banner:"," On next open, if an unsaved draft exists for the item, a banner appears at the top of the modal:",[522,857,862],{"className":858,"code":860,"language":861},[859],"language-text","┌─────────────────────────────────────────────────────┐\n│ ℹ You have an unsaved draft from 3 hours ago.       │\n│                           [Resume]  [Discard]       │\n└─────────────────────────────────────────────────────┘\n","text",[455,863,860],{"__ignoreMap":527},[458,865,866,867,870,871,874],{},"Clicking ",[826,868,869],{},"Resume"," fills the form with the draft data. Clicking ",[826,872,873],{},"Discard"," clears the draft and fills the form with the saved item data (or empty for a new item).",[496,876,878],{"id":877},"layout-behavior","Layout behavior",[652,880,881,892],{},[655,882,883],{},[658,884,885,889],{},[661,886,887],{},[455,888,480],{},[661,890,891],{},"Layout",[674,893,894,911],{},[658,895,896,908],{},[679,897,898,901,902,901,905],{},[455,899,900],{},"sm",", ",[455,903,904],{},"md",[455,906,907],{},"lg",[679,909,910],{},"Single-column fields",[658,912,913,929],{},[679,914,915,901,918,901,921,901,923,901,926],{},[455,916,917],{},"xl",[455,919,920],{},"2xl",[455,922,630],{},[455,924,925],{},"4xl",[455,927,928],{},"5xl",[679,930,931,932,935],{},"Two-column fields (fields with ",[455,933,934],{},"colSpan: 2"," span both columns)",[496,937,939],{"id":938},"tailwind-max-width-mapping","Tailwind max-width mapping",[652,941,942,953],{},[655,943,944],{},[658,945,946,950],{},[661,947,948],{},[455,949,480],{},[661,951,952],{},"Max width",[674,954,955,966,977,988,999,1010,1021,1032],{},[658,956,957,961],{},[679,958,959],{},[455,960,900],{},[679,962,963],{},[455,964,965],{},"max-w-sm",[658,967,968,972],{},[679,969,970],{},[455,971,904],{},[679,973,974],{},[455,975,976],{},"max-w-md",[658,978,979,983],{},[679,980,981],{},[455,982,907],{},[679,984,985],{},[455,986,987],{},"max-w-lg",[658,989,990,994],{},[679,991,992],{},[455,993,917],{},[679,995,996],{},[455,997,998],{},"max-w-xl",[658,1000,1001,1005],{},[679,1002,1003],{},[455,1004,920],{},[679,1006,1007],{},[455,1008,1009],{},"max-w-2xl",[658,1011,1012,1016],{},[679,1013,1014],{},[455,1015,630],{},[679,1017,1018],{},[455,1019,1020],{},"max-w-3xl",[658,1022,1023,1027],{},[679,1024,1025],{},[455,1026,925],{},[679,1028,1029],{},[455,1030,1031],{},"max-w-4xl",[658,1033,1034,1038],{},[679,1035,1036],{},[455,1037,928],{},[679,1039,1040],{},[455,1041,1042],{},"max-w-5xl",[496,1044,1046],{"id":1045},"useprotodraft",[455,1047,1048],{},"useProtoDraft",[458,1050,1051,1052,542],{},"The draft composable, used internally by ",[455,1053,411],{},[522,1055,1057],{"className":524,"code":1056,"language":526,"meta":527,"style":527},"function useProtoDraft(\n  doc:      Y.Doc,\n  draftKey: string,\n): ProtoDraftState\n\ninterface ProtoDraftState {\n  draft:       Ref\u003CRecord\u003Cstring, any> | null>\n  hasDraft:    ComputedRef\u003Cboolean>\n  draftAge:    ComputedRef\u003Cstring | null>   // e.g. '3 hours ago'\n  saveDraft(data: Record\u003Cstring, any>): void\n  clearDraft(): void\n}\n",[455,1058,1059,1072,1090,1102,1110,1116,1126,1163,1179,1202,1233,1244],{"__ignoreMap":527},[531,1060,1061,1065,1069],{"class":533,"line":534},[531,1062,1064],{"class":1063},"spNyl","function",[531,1066,1068],{"class":1067},"s2Zo4"," useProtoDraft",[531,1070,1071],{"class":541},"(\n",[531,1073,1074,1078,1080,1083,1085,1088],{"class":533,"line":548},[531,1075,1077],{"class":1076},"sHdIc","  doc",[531,1079,542],{"class":541},[531,1081,1082],{"class":537},"      Y",[531,1084,835],{"class":541},[531,1086,1087],{"class":537},"Doc",[531,1089,576],{"class":541},[531,1091,1092,1095,1097,1100],{"class":533,"line":558},[531,1093,1094],{"class":1076},"  draftKey",[531,1096,542],{"class":541},[531,1098,1099],{"class":537}," string",[531,1101,576],{"class":541},[531,1103,1104,1107],{"class":533,"line":579},[531,1105,1106],{"class":541},"):",[531,1108,1109],{"class":537}," ProtoDraftState\n",[531,1111,1112],{"class":533,"line":597},[531,1113,1115],{"emptyLinePlaceholder":1114},true,"\n",[531,1117,1118,1121,1124],{"class":533,"line":620},[531,1119,1120],{"class":1063},"interface",[531,1122,1123],{"class":537}," ProtoDraftState",[531,1125,545],{"class":541},[531,1127,1128,1131,1133,1136,1139,1142,1144,1146,1148,1151,1154,1157,1160],{"class":533,"line":637},[531,1129,1130],{"class":590},"  draft",[531,1132,542],{"class":541},[531,1134,1135],{"class":537},"       Ref",[531,1137,1138],{"class":541},"\u003C",[531,1140,1141],{"class":537},"Record",[531,1143,1138],{"class":541},[531,1145,759],{"class":537},[531,1147,613],{"class":541},[531,1149,1150],{"class":537}," any",[531,1152,1153],{"class":541},">",[531,1155,1156],{"class":541}," |",[531,1158,1159],{"class":537}," null",[531,1161,1162],{"class":541},">\n",[531,1164,1165,1168,1170,1173,1175,1177],{"class":533,"line":643},[531,1166,1167],{"class":590},"  hasDraft",[531,1169,542],{"class":541},[531,1171,1172],{"class":537},"    ComputedRef",[531,1174,1138],{"class":541},[531,1176,688],{"class":537},[531,1178,1162],{"class":541},[531,1180,1182,1185,1187,1189,1191,1193,1195,1197,1199],{"class":533,"line":1181},9,[531,1183,1184],{"class":590},"  draftAge",[531,1186,542],{"class":541},[531,1188,1172],{"class":537},[531,1190,1138],{"class":541},[531,1192,759],{"class":537},[531,1194,1156],{"class":541},[531,1196,1159],{"class":537},[531,1198,1153],{"class":541},[531,1200,1201],{"class":616},"   // e.g. '3 hours ago'\n",[531,1203,1205,1208,1211,1214,1216,1219,1221,1223,1225,1227,1230],{"class":533,"line":1204},10,[531,1206,1207],{"class":590},"  saveDraft",[531,1209,1210],{"class":541},"(",[531,1212,1213],{"class":1076},"data",[531,1215,542],{"class":541},[531,1217,1218],{"class":537}," Record",[531,1220,1138],{"class":541},[531,1222,759],{"class":537},[531,1224,613],{"class":541},[531,1226,1150],{"class":537},[531,1228,1229],{"class":541},">):",[531,1231,1232],{"class":537}," void\n",[531,1234,1236,1239,1242],{"class":533,"line":1235},11,[531,1237,1238],{"class":590},"  clearDraft",[531,1240,1241],{"class":541},"():",[531,1243,1232],{"class":537},[531,1245,1247],{"class":533,"line":1246},12,[531,1248,646],{"class":541},[458,1250,1251,1252,1254],{},"You can use ",[455,1253,1048],{}," directly in your own custom modals:",[522,1256,1258],{"className":524,"code":1257,"language":526,"meta":527,"style":527},"const { doc } = useProtoDoc('my-tool')\nconst { draft, hasDraft, draftAge, saveDraft, clearDraft } =\n  useProtoDraft(doc, `interview-${itemId}`)\n\n// Auto-save as user types\nwatch(formData, (data) => saveDraft(data), { deep: true })\n\n// On open — check for existing draft\nonMounted(() => {\n  if (hasDraft.value) {\n    // Show resume/discard UI\n  }\n})\n",[455,1259,1260,1292,1326,1353,1357,1362,1405,1409,1414,1428,1450,1455,1459],{"__ignoreMap":527},[531,1261,1262,1265,1267,1271,1274,1277,1280,1282,1284,1287,1289],{"class":533,"line":534},[531,1263,1264],{"class":1063},"const",[531,1266,587],{"class":541},[531,1268,1270],{"class":1269},"sTEyZ"," doc ",[531,1272,1273],{"class":541},"}",[531,1275,1276],{"class":541}," =",[531,1278,1279],{"class":1067}," useProtoDoc",[531,1281,1210],{"class":1269},[531,1283,573],{"class":541},[531,1285,1286],{"class":569},"my-tool",[531,1288,573],{"class":541},[531,1290,1291],{"class":1269},")\n",[531,1293,1294,1296,1298,1301,1303,1306,1308,1311,1313,1316,1318,1321,1323],{"class":533,"line":548},[531,1295,1264],{"class":1063},[531,1297,587],{"class":541},[531,1299,1300],{"class":1269}," draft",[531,1302,613],{"class":541},[531,1304,1305],{"class":1269}," hasDraft",[531,1307,613],{"class":541},[531,1309,1310],{"class":1269}," draftAge",[531,1312,613],{"class":541},[531,1314,1315],{"class":1269}," saveDraft",[531,1317,613],{"class":541},[531,1319,1320],{"class":1269}," clearDraft ",[531,1322,1273],{"class":541},[531,1324,1325],{"class":541}," =\n",[531,1327,1328,1331,1334,1336,1339,1342,1345,1348,1351],{"class":533,"line":558},[531,1329,1330],{"class":1067},"  useProtoDraft",[531,1332,1333],{"class":1269},"(doc",[531,1335,613],{"class":541},[531,1337,1338],{"class":541}," `",[531,1340,1341],{"class":569},"interview-",[531,1343,1344],{"class":541},"${",[531,1346,1347],{"class":1269},"itemId",[531,1349,1350],{"class":541},"}`",[531,1352,1291],{"class":1269},[531,1354,1355],{"class":533,"line":579},[531,1356,1115],{"emptyLinePlaceholder":1114},[531,1358,1359],{"class":533,"line":597},[531,1360,1361],{"class":616},"// Auto-save as user types\n",[531,1363,1364,1367,1370,1372,1375,1377,1379,1382,1384,1387,1389,1391,1394,1396,1400,1403],{"class":533,"line":620},[531,1365,1366],{"class":1067},"watch",[531,1368,1369],{"class":1269},"(formData",[531,1371,613],{"class":541},[531,1373,1374],{"class":541}," (",[531,1376,1213],{"class":1076},[531,1378,485],{"class":541},[531,1380,1381],{"class":1063}," =>",[531,1383,1315],{"class":1067},[531,1385,1386],{"class":1269},"(data)",[531,1388,613],{"class":541},[531,1390,587],{"class":541},[531,1392,1393],{"class":590}," deep",[531,1395,542],{"class":541},[531,1397,1399],{"class":1398},"sfNiH"," true",[531,1401,1402],{"class":541}," }",[531,1404,1291],{"class":1269},[531,1406,1407],{"class":533,"line":637},[531,1408,1115],{"emptyLinePlaceholder":1114},[531,1410,1411],{"class":533,"line":643},[531,1412,1413],{"class":616},"// On open — check for existing draft\n",[531,1415,1416,1419,1421,1424,1426],{"class":533,"line":1181},[531,1417,1418],{"class":1067},"onMounted",[531,1420,1210],{"class":1269},[531,1422,1423],{"class":541},"()",[531,1425,1381],{"class":1063},[531,1427,545],{"class":541},[531,1429,1430,1434,1436,1439,1441,1444,1447],{"class":533,"line":1204},[531,1431,1433],{"class":1432},"s7zQu","  if",[531,1435,1374],{"class":590},[531,1437,1438],{"class":1269},"hasDraft",[531,1440,835],{"class":541},[531,1442,1443],{"class":1269},"value",[531,1445,1446],{"class":590},") ",[531,1448,1449],{"class":541},"{\n",[531,1451,1452],{"class":533,"line":1235},[531,1453,1454],{"class":616},"    // Show resume/discard UI\n",[531,1456,1457],{"class":533,"line":1246},[531,1458,640],{"class":541},[531,1460,1462,1464],{"class":533,"line":1461},13,[531,1463,1273],{"class":541},[531,1465,1291],{"class":1269},[1467,1468,1469],"style",{},"html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}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 .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--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 .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}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}",{"title":527,"searchDepth":548,"depth":548,"links":1471},[1472,1473,1474,1475,1476,1477,1478],{"id":498,"depth":548,"text":499},{"id":649,"depth":548,"text":650},{"id":770,"depth":548,"text":771},{"id":818,"depth":548,"text":819},{"id":877,"depth":548,"text":878},{"id":938,"depth":548,"text":939},{"id":1045,"depth":548,"text":1048},"Modal editor for a single collection item with automatic draft persistence — unsaved changes survive tab switches and browser refreshes.",null,{},{"title":411},{"title":411,"description":1479},"EJWPpGDRGXc3IBJJYUZdQP5aan4s6YXgoyD2Ml97tGk",[1486,1488],{"title":407,"path":408,"stem":409,"description":1487,"children":-1},"The top-level tool rendering component. Accepts a schema and an optional doc-key, renders the full tool UI, and handles all Y.js plumbing internally.",{"title":151,"path":416,"stem":417,"description":1489,"children":-1},"How protokit works completely offline using Y.js CRDTs and IndexedDB, with automatic conflict-free sync when connectivity is restored.",1772977477603]