[{"data":1,"prerenderedAt":2001},["ShallowReactive",2],{"\u002Fnext\u002Fdodock\u002Fdeveloppeurs\u002Fcomposants-ui\u002Fcomposer":3,"section:\u002Fnext\u002Fdodock\u002Fdeveloppeurs\u002Fcomposants-ui\u002Fcomposer":2000},{"id":4,"title":5,"body":6,"description":1982,"extension":1983,"meta":1984,"navigation":397,"path":1996,"seo":1997,"stem":1998,"__hash__":1999},"docs\u002F2.next\u002F3.dodock\u002F10.developpeurs\u002F03.composants-ui\u002Fcomposer.md","Composer",{"type":7,"value":8,"toc":1967},"minimark",[9,13,17,70,81,86,97,176,183,187,1222,1229,1233,1402,1408,1486,1514,1519,1522,1531,1535,1543,1549,1569,1663,1667,1718,1725,1729,1736,1791,1797,1801,1879,1963],[10,11,5],"h1",{"id":12},"composer",[14,15,16],"p",{},"Le Composer est un éditeur de message pour les applications Vue construites sur Dodock. Il existe en deux composants qui partagent le même éditeur :",[18,19,20,36],"table",{},[21,22,23],"thead",{},[24,25,26,30,33],"tr",{},[27,28,29],"th",{},"Composant",[27,31,32],{},"Usage",[27,34,35],{},"En-tête",[37,38,39,54],"tbody",{},[24,40,41,48,51],{},[42,43,44],"td",{},[45,46,47],"code",{},"EmailComposer",[42,49,50],{},"Rédiger un email",[42,52,53],{},"Lignes « De », « À », « Cc », « Cci », « Objet », puis réponse citée",[24,55,56,61,64],{},[42,57,58],{},[45,59,60],{},"CommentComposer",[42,62,63],{},"Rédiger un commentaire interne",[42,65,66,67],{},"Aucun en-tête. Mentions ",[45,68,69],{},"@",[14,71,72,73,76,77,80],{},"Le Composer n'envoie rien lui-même. Au clic sur le bouton d'envoi, ou avec Ctrl+Entrée (⌘+Entrée sur Mac), il émet l'événement ",[45,74,75],{},"submit"," avec le contenu. Votre application fait l'envoi, puis appelle ",[45,78,79],{},"reset()",".",[82,83,85],"h2",{"id":84},"importer-le-composant","Importer le composant",[14,87,88,89,92,93,96],{},"Les deux composants sont exportés par le paquet ",[45,90,91],{},"@framework\u002Fui"," (dossier ",[45,94,95],{},"ui\u002F"," de Dodock) :",[98,99,104],"pre",{"className":100,"code":101,"language":102,"meta":103,"style":103},"language-js shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { EmailComposer, CommentComposer } from \"@framework\u002Fui\";\n\u002F\u002F ou, depuis le sous-chemin du composant :\nimport { EmailComposer } from \"@framework\u002Fui\u002Fcomponents\u002FComposer\";\n","js","",[45,105,106,147,154],{"__ignoreMap":103},[107,108,111,115,119,123,126,129,132,135,138,141,144],"span",{"class":109,"line":110},"line",1,[107,112,114],{"class":113},"s7zQu","import",[107,116,118],{"class":117},"sMK4o"," {",[107,120,122],{"class":121},"sTEyZ"," EmailComposer",[107,124,125],{"class":117},",",[107,127,128],{"class":121}," CommentComposer",[107,130,131],{"class":117}," }",[107,133,134],{"class":113}," from",[107,136,137],{"class":117}," \"",[107,139,91],{"class":140},"sfazB",[107,142,143],{"class":117},"\"",[107,145,146],{"class":117},";\n",[107,148,150],{"class":109,"line":149},2,[107,151,153],{"class":152},"sHwdD","\u002F\u002F ou, depuis le sous-chemin du composant :\n",[107,155,157,159,161,163,165,167,169,172,174],{"class":109,"line":156},3,[107,158,114],{"class":113},[107,160,118],{"class":117},[107,162,122],{"class":121},[107,164,131],{"class":117},[107,166,134],{"class":113},[107,168,137],{"class":117},[107,170,171],{"class":140},"@framework\u002Fui\u002Fcomponents\u002FComposer",[107,173,143],{"class":117},[107,175,146],{"class":117},[14,177,178,179,182],{},"Pour une fenêtre de réponse flottante, placez le composant dans ",[45,180,181],{},"FloatingWindow"," de frappe-ui.",[82,184,186],{"id":185},"répondre-à-un-email","Répondre à un email",[98,188,192],{"className":189,"code":190,"language":191,"meta":103,"style":103},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n    \u003CEmailComposer\n        ref=\"composer\"\n        v-model=\"body\"\n        v-model:to=\"to\"\n        v-model:cc=\"cc\"\n        v-model:quoted=\"quoted\"\n        show-subject\n        v-model:subject=\"subject\"\n        :search-recipients=\"searchContacts\"\n        :submitting=\"sending\"\n        @submit=\"onSend\"\n    \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { ref } from \"vue\";\nimport { call } from \"frappe-ui\";\nimport { EmailComposer } from \"@framework\u002Fui\";\n\nconst composer = ref(null);\nconst body = ref(\"\");\nconst to = ref([{ email: \"camille.martin@example.com\", label: \"Camille Martin\" }]);\nconst cc = ref([]);\nconst subject = ref(\"Re: Commande SAL-ORD-2026-00142\");\nconst quoted = ref(\"\u003Cp>Bonjour, pouvez-vous confirmer la date de livraison ?\u003C\u002Fp>\");\nconst sending = ref(false);\n\nasync function searchContacts(query) {\n    const contacts = await call(\"frappe.client.get_list\", {\n        doctype: \"Contact\",\n        fields: [\"full_name\", \"email_id\"],\n        filters: [[\"email_id\", \"like\", `%${query}%`]],\n        limit_page_length: 10,\n    });\n    return contacts.map((c) => ({ email: c.email_id, label: c.full_name }));\n}\n\nasync function onSend(payload) {\n    sending.value = true;\n    try {\n        await call(\"frappe.core.doctype.communication.email.make\", {\n            recipients: payload.to.map((r) => r.email).join(\", \"),\n            cc: payload.cc.map((r) => r.email).join(\", \"),\n            subject: payload.subject,\n            content: payload.body,\n            send_email: 1,\n        });\n        composer.value.reset();\n    } finally {\n        sending.value = false;\n    }\n}\n\u003C\u002Fscript>\n","vue",[45,193,194,206,214,230,245,264,282,300,306,324,342,359,376,382,392,399,412,434,457,478,483,508,529,580,597,622,647,669,674,697,727,745,777,829,843,853,913,919,924,943,961,969,990,1048,1100,1116,1132,1145,1155,1175,1185,1202,1208,1213],{"__ignoreMap":103},[107,195,196,199,203],{"class":109,"line":110},[107,197,198],{"class":117},"\u003C",[107,200,202],{"class":201},"swJcz","template",[107,204,205],{"class":117},">\n",[107,207,208,211],{"class":109,"line":149},[107,209,210],{"class":117},"    \u003C",[107,212,213],{"class":201},"EmailComposer\n",[107,215,216,220,223,225,227],{"class":109,"line":156},[107,217,219],{"class":218},"spNyl","        ref",[107,221,222],{"class":117},"=",[107,224,143],{"class":117},[107,226,12],{"class":140},[107,228,229],{"class":117},"\"\n",[107,231,233,236,238,240,243],{"class":109,"line":232},4,[107,234,235],{"class":218},"        v-model",[107,237,222],{"class":117},[107,239,143],{"class":117},[107,241,242],{"class":121},"body",[107,244,229],{"class":117},[107,246,248,250,253,256,258,260,262],{"class":109,"line":247},5,[107,249,235],{"class":218},[107,251,252],{"class":117},":",[107,254,255],{"class":218},"to",[107,257,222],{"class":117},[107,259,143],{"class":117},[107,261,255],{"class":121},[107,263,229],{"class":117},[107,265,267,269,271,274,276,278,280],{"class":109,"line":266},6,[107,268,235],{"class":218},[107,270,252],{"class":117},[107,272,273],{"class":218},"cc",[107,275,222],{"class":117},[107,277,143],{"class":117},[107,279,273],{"class":121},[107,281,229],{"class":117},[107,283,285,287,289,292,294,296,298],{"class":109,"line":284},7,[107,286,235],{"class":218},[107,288,252],{"class":117},[107,290,291],{"class":218},"quoted",[107,293,222],{"class":117},[107,295,143],{"class":117},[107,297,291],{"class":121},[107,299,229],{"class":117},[107,301,303],{"class":109,"line":302},8,[107,304,305],{"class":218},"        show-subject\n",[107,307,309,311,313,316,318,320,322],{"class":109,"line":308},9,[107,310,235],{"class":218},[107,312,252],{"class":117},[107,314,315],{"class":218},"subject",[107,317,222],{"class":117},[107,319,143],{"class":117},[107,321,315],{"class":121},[107,323,229],{"class":117},[107,325,327,330,333,335,337,340],{"class":109,"line":326},10,[107,328,329],{"class":117},"        :",[107,331,332],{"class":218},"search-recipients",[107,334,222],{"class":117},[107,336,143],{"class":117},[107,338,339],{"class":121},"searchContacts",[107,341,229],{"class":117},[107,343,345,347,350,352,354,357],{"class":109,"line":344},11,[107,346,329],{"class":117},[107,348,349],{"class":218},"submitting",[107,351,222],{"class":117},[107,353,143],{"class":117},[107,355,356],{"class":121},"sending",[107,358,229],{"class":117},[107,360,362,365,367,369,371,374],{"class":109,"line":361},12,[107,363,364],{"class":117},"        @",[107,366,75],{"class":218},[107,368,222],{"class":117},[107,370,143],{"class":117},[107,372,373],{"class":121},"onSend",[107,375,229],{"class":117},[107,377,379],{"class":109,"line":378},13,[107,380,381],{"class":117},"    \u002F>\n",[107,383,385,388,390],{"class":109,"line":384},14,[107,386,387],{"class":117},"\u003C\u002F",[107,389,202],{"class":201},[107,391,205],{"class":117},[107,393,395],{"class":109,"line":394},15,[107,396,398],{"emptyLinePlaceholder":397},true,"\n",[107,400,402,404,407,410],{"class":109,"line":401},16,[107,403,198],{"class":117},[107,405,406],{"class":201},"script",[107,408,409],{"class":218}," setup",[107,411,205],{"class":117},[107,413,415,417,419,422,424,426,428,430,432],{"class":109,"line":414},17,[107,416,114],{"class":113},[107,418,118],{"class":117},[107,420,421],{"class":121}," ref",[107,423,131],{"class":117},[107,425,134],{"class":113},[107,427,137],{"class":117},[107,429,191],{"class":140},[107,431,143],{"class":117},[107,433,146],{"class":117},[107,435,437,439,441,444,446,448,450,453,455],{"class":109,"line":436},18,[107,438,114],{"class":113},[107,440,118],{"class":117},[107,442,443],{"class":121}," call",[107,445,131],{"class":117},[107,447,134],{"class":113},[107,449,137],{"class":117},[107,451,452],{"class":140},"frappe-ui",[107,454,143],{"class":117},[107,456,146],{"class":117},[107,458,460,462,464,466,468,470,472,474,476],{"class":109,"line":459},19,[107,461,114],{"class":113},[107,463,118],{"class":117},[107,465,122],{"class":121},[107,467,131],{"class":117},[107,469,134],{"class":113},[107,471,137],{"class":117},[107,473,91],{"class":140},[107,475,143],{"class":117},[107,477,146],{"class":117},[107,479,481],{"class":109,"line":480},20,[107,482,398],{"emptyLinePlaceholder":397},[107,484,486,489,492,494,497,500,503,506],{"class":109,"line":485},21,[107,487,488],{"class":218},"const",[107,490,491],{"class":121}," composer ",[107,493,222],{"class":117},[107,495,421],{"class":496},"s2Zo4",[107,498,499],{"class":121},"(",[107,501,502],{"class":117},"null",[107,504,505],{"class":121},")",[107,507,146],{"class":117},[107,509,511,513,516,518,520,522,525,527],{"class":109,"line":510},22,[107,512,488],{"class":218},[107,514,515],{"class":121}," body ",[107,517,222],{"class":117},[107,519,421],{"class":496},[107,521,499],{"class":121},[107,523,524],{"class":117},"\"\"",[107,526,505],{"class":121},[107,528,146],{"class":117},[107,530,532,534,537,539,541,544,547,550,552,554,557,559,561,564,566,568,571,573,575,578],{"class":109,"line":531},23,[107,533,488],{"class":218},[107,535,536],{"class":121}," to ",[107,538,222],{"class":117},[107,540,421],{"class":496},[107,542,543],{"class":121},"([",[107,545,546],{"class":117},"{",[107,548,549],{"class":201}," email",[107,551,252],{"class":117},[107,553,137],{"class":117},[107,555,556],{"class":140},"camille.martin@example.com",[107,558,143],{"class":117},[107,560,125],{"class":117},[107,562,563],{"class":201}," label",[107,565,252],{"class":117},[107,567,137],{"class":117},[107,569,570],{"class":140},"Camille Martin",[107,572,143],{"class":117},[107,574,131],{"class":117},[107,576,577],{"class":121},"])",[107,579,146],{"class":117},[107,581,583,585,588,590,592,595],{"class":109,"line":582},24,[107,584,488],{"class":218},[107,586,587],{"class":121}," cc ",[107,589,222],{"class":117},[107,591,421],{"class":496},[107,593,594],{"class":121},"([])",[107,596,146],{"class":117},[107,598,600,602,605,607,609,611,613,616,618,620],{"class":109,"line":599},25,[107,601,488],{"class":218},[107,603,604],{"class":121}," subject ",[107,606,222],{"class":117},[107,608,421],{"class":496},[107,610,499],{"class":121},[107,612,143],{"class":117},[107,614,615],{"class":140},"Re: Commande SAL-ORD-2026-00142",[107,617,143],{"class":117},[107,619,505],{"class":121},[107,621,146],{"class":117},[107,623,625,627,630,632,634,636,638,641,643,645],{"class":109,"line":624},26,[107,626,488],{"class":218},[107,628,629],{"class":121}," quoted ",[107,631,222],{"class":117},[107,633,421],{"class":496},[107,635,499],{"class":121},[107,637,143],{"class":117},[107,639,640],{"class":140},"\u003Cp>Bonjour, pouvez-vous confirmer la date de livraison ?\u003C\u002Fp>",[107,642,143],{"class":117},[107,644,505],{"class":121},[107,646,146],{"class":117},[107,648,650,652,655,657,659,661,665,667],{"class":109,"line":649},27,[107,651,488],{"class":218},[107,653,654],{"class":121}," sending ",[107,656,222],{"class":117},[107,658,421],{"class":496},[107,660,499],{"class":121},[107,662,664],{"class":663},"sfNiH","false",[107,666,505],{"class":121},[107,668,146],{"class":117},[107,670,672],{"class":109,"line":671},28,[107,673,398],{"emptyLinePlaceholder":397},[107,675,677,680,683,686,688,692,694],{"class":109,"line":676},29,[107,678,679],{"class":218},"async",[107,681,682],{"class":218}," function",[107,684,685],{"class":496}," searchContacts",[107,687,499],{"class":117},[107,689,691],{"class":690},"sHdIc","query",[107,693,505],{"class":117},[107,695,696],{"class":117}," {\n",[107,698,700,703,706,709,712,714,716,718,721,723,725],{"class":109,"line":699},30,[107,701,702],{"class":218},"    const",[107,704,705],{"class":121}," contacts",[107,707,708],{"class":117}," =",[107,710,711],{"class":113}," await",[107,713,443],{"class":496},[107,715,499],{"class":201},[107,717,143],{"class":117},[107,719,720],{"class":140},"frappe.client.get_list",[107,722,143],{"class":117},[107,724,125],{"class":117},[107,726,696],{"class":117},[107,728,730,733,735,737,740,742],{"class":109,"line":729},31,[107,731,732],{"class":201},"        doctype",[107,734,252],{"class":117},[107,736,137],{"class":117},[107,738,739],{"class":140},"Contact",[107,741,143],{"class":117},[107,743,744],{"class":117},",\n",[107,746,748,751,753,756,758,761,763,765,767,770,772,775],{"class":109,"line":747},32,[107,749,750],{"class":201},"        fields",[107,752,252],{"class":117},[107,754,755],{"class":201}," [",[107,757,143],{"class":117},[107,759,760],{"class":140},"full_name",[107,762,143],{"class":117},[107,764,125],{"class":117},[107,766,137],{"class":117},[107,768,769],{"class":140},"email_id",[107,771,143],{"class":117},[107,773,774],{"class":201},"]",[107,776,744],{"class":117},[107,778,780,783,785,788,790,792,794,796,798,801,803,805,808,811,814,816,819,821,824,827],{"class":109,"line":779},33,[107,781,782],{"class":201},"        filters",[107,784,252],{"class":117},[107,786,787],{"class":201}," [[",[107,789,143],{"class":117},[107,791,769],{"class":140},[107,793,143],{"class":117},[107,795,125],{"class":117},[107,797,137],{"class":117},[107,799,800],{"class":140},"like",[107,802,143],{"class":117},[107,804,125],{"class":117},[107,806,807],{"class":117}," `",[107,809,810],{"class":140},"%",[107,812,813],{"class":117},"${",[107,815,691],{"class":121},[107,817,818],{"class":117},"}",[107,820,810],{"class":140},[107,822,823],{"class":117},"`",[107,825,826],{"class":201},"]]",[107,828,744],{"class":117},[107,830,832,835,837,841],{"class":109,"line":831},34,[107,833,834],{"class":201},"        limit_page_length",[107,836,252],{"class":117},[107,838,840],{"class":839},"sbssI"," 10",[107,842,744],{"class":117},[107,844,846,849,851],{"class":109,"line":845},35,[107,847,848],{"class":117},"    }",[107,850,505],{"class":201},[107,852,146],{"class":117},[107,854,856,859,861,863,866,868,870,873,875,878,881,883,885,887,890,892,894,896,898,900,902,904,906,908,911],{"class":109,"line":855},36,[107,857,858],{"class":113},"    return",[107,860,705],{"class":121},[107,862,80],{"class":117},[107,864,865],{"class":496},"map",[107,867,499],{"class":201},[107,869,499],{"class":117},[107,871,872],{"class":690},"c",[107,874,505],{"class":117},[107,876,877],{"class":218}," =>",[107,879,880],{"class":201}," (",[107,882,546],{"class":117},[107,884,549],{"class":201},[107,886,252],{"class":117},[107,888,889],{"class":121}," c",[107,891,80],{"class":117},[107,893,769],{"class":121},[107,895,125],{"class":117},[107,897,563],{"class":201},[107,899,252],{"class":117},[107,901,889],{"class":121},[107,903,80],{"class":117},[107,905,760],{"class":121},[107,907,131],{"class":117},[107,909,910],{"class":201},"))",[107,912,146],{"class":117},[107,914,916],{"class":109,"line":915},37,[107,917,918],{"class":117},"}\n",[107,920,922],{"class":109,"line":921},38,[107,923,398],{"emptyLinePlaceholder":397},[107,925,927,929,931,934,936,939,941],{"class":109,"line":926},39,[107,928,679],{"class":218},[107,930,682],{"class":218},[107,932,933],{"class":496}," onSend",[107,935,499],{"class":117},[107,937,938],{"class":690},"payload",[107,940,505],{"class":117},[107,942,696],{"class":117},[107,944,946,949,951,954,956,959],{"class":109,"line":945},40,[107,947,948],{"class":121},"    sending",[107,950,80],{"class":117},[107,952,953],{"class":121},"value",[107,955,708],{"class":117},[107,957,958],{"class":663}," true",[107,960,146],{"class":117},[107,962,964,967],{"class":109,"line":963},41,[107,965,966],{"class":113},"    try",[107,968,696],{"class":117},[107,970,972,975,977,979,981,984,986,988],{"class":109,"line":971},42,[107,973,974],{"class":113},"        await",[107,976,443],{"class":496},[107,978,499],{"class":201},[107,980,143],{"class":117},[107,982,983],{"class":140},"frappe.core.doctype.communication.email.make",[107,985,143],{"class":117},[107,987,125],{"class":117},[107,989,696],{"class":117},[107,991,993,996,998,1001,1003,1005,1007,1009,1011,1013,1016,1018,1020,1023,1025,1028,1030,1032,1035,1037,1039,1042,1044,1046],{"class":109,"line":992},43,[107,994,995],{"class":201},"            recipients",[107,997,252],{"class":117},[107,999,1000],{"class":121}," payload",[107,1002,80],{"class":117},[107,1004,255],{"class":121},[107,1006,80],{"class":117},[107,1008,865],{"class":496},[107,1010,499],{"class":201},[107,1012,499],{"class":117},[107,1014,1015],{"class":690},"r",[107,1017,505],{"class":117},[107,1019,877],{"class":218},[107,1021,1022],{"class":121}," r",[107,1024,80],{"class":117},[107,1026,1027],{"class":121},"email",[107,1029,505],{"class":201},[107,1031,80],{"class":117},[107,1033,1034],{"class":496},"join",[107,1036,499],{"class":201},[107,1038,143],{"class":117},[107,1040,1041],{"class":140},", ",[107,1043,143],{"class":117},[107,1045,505],{"class":201},[107,1047,744],{"class":117},[107,1049,1051,1054,1056,1058,1060,1062,1064,1066,1068,1070,1072,1074,1076,1078,1080,1082,1084,1086,1088,1090,1092,1094,1096,1098],{"class":109,"line":1050},44,[107,1052,1053],{"class":201},"            cc",[107,1055,252],{"class":117},[107,1057,1000],{"class":121},[107,1059,80],{"class":117},[107,1061,273],{"class":121},[107,1063,80],{"class":117},[107,1065,865],{"class":496},[107,1067,499],{"class":201},[107,1069,499],{"class":117},[107,1071,1015],{"class":690},[107,1073,505],{"class":117},[107,1075,877],{"class":218},[107,1077,1022],{"class":121},[107,1079,80],{"class":117},[107,1081,1027],{"class":121},[107,1083,505],{"class":201},[107,1085,80],{"class":117},[107,1087,1034],{"class":496},[107,1089,499],{"class":201},[107,1091,143],{"class":117},[107,1093,1041],{"class":140},[107,1095,143],{"class":117},[107,1097,505],{"class":201},[107,1099,744],{"class":117},[107,1101,1103,1106,1108,1110,1112,1114],{"class":109,"line":1102},45,[107,1104,1105],{"class":201},"            subject",[107,1107,252],{"class":117},[107,1109,1000],{"class":121},[107,1111,80],{"class":117},[107,1113,315],{"class":121},[107,1115,744],{"class":117},[107,1117,1119,1122,1124,1126,1128,1130],{"class":109,"line":1118},46,[107,1120,1121],{"class":201},"            content",[107,1123,252],{"class":117},[107,1125,1000],{"class":121},[107,1127,80],{"class":117},[107,1129,242],{"class":121},[107,1131,744],{"class":117},[107,1133,1135,1138,1140,1143],{"class":109,"line":1134},47,[107,1136,1137],{"class":201},"            send_email",[107,1139,252],{"class":117},[107,1141,1142],{"class":839}," 1",[107,1144,744],{"class":117},[107,1146,1148,1151,1153],{"class":109,"line":1147},48,[107,1149,1150],{"class":117},"        }",[107,1152,505],{"class":201},[107,1154,146],{"class":117},[107,1156,1158,1161,1163,1165,1167,1170,1173],{"class":109,"line":1157},49,[107,1159,1160],{"class":121},"        composer",[107,1162,80],{"class":117},[107,1164,953],{"class":121},[107,1166,80],{"class":117},[107,1168,1169],{"class":496},"reset",[107,1171,1172],{"class":201},"()",[107,1174,146],{"class":117},[107,1176,1178,1180,1183],{"class":109,"line":1177},50,[107,1179,848],{"class":117},[107,1181,1182],{"class":113}," finally",[107,1184,696],{"class":117},[107,1186,1188,1191,1193,1195,1197,1200],{"class":109,"line":1187},51,[107,1189,1190],{"class":121},"        sending",[107,1192,80],{"class":117},[107,1194,953],{"class":121},[107,1196,708],{"class":117},[107,1198,1199],{"class":663}," false",[107,1201,146],{"class":117},[107,1203,1205],{"class":109,"line":1204},52,[107,1206,1207],{"class":117},"    }\n",[107,1209,1211],{"class":109,"line":1210},53,[107,1212,918],{"class":117},[107,1214,1216,1218,1220],{"class":109,"line":1215},54,[107,1217,387],{"class":117},[107,1219,406],{"class":201},[107,1221,205],{"class":117},[14,1223,1224,1225,1228],{},"Exemple fictif. Les noms et adresses sont inventés. ",[45,1226,1227],{},"searchRecipients"," est appelée à chaque frappe, et une fois avec une chaîne vide à l'ouverture.",[82,1230,1232],{"id":1231},"propriétés-communes","Propriétés communes",[18,1234,1235,1251],{},[21,1236,1237],{},[24,1238,1239,1242,1245,1248],{},[27,1240,1241],{},"Propriété",[27,1243,1244],{},"Type",[27,1246,1247],{},"Défaut",[27,1249,1250],{},"Rôle",[37,1252,1253,1273,1292,1310,1328,1352,1385],{},[24,1254,1255,1260,1265,1270],{},[42,1256,1257],{},[45,1258,1259],{},"placeholder",[42,1261,1262],{},[45,1263,1264],{},"string",[42,1266,1267,1268,505],{},"— (« This message is only visible to your team. » pour ",[45,1269,60],{},[42,1271,1272],{},"Texte affiché dans le corps vide.",[24,1274,1275,1280,1284,1289],{},[42,1276,1277],{},[45,1278,1279],{},"submitLabel",[42,1281,1282],{},[45,1283,1264],{},[42,1285,1286,1287,505],{},"— (« Comment » pour ",[45,1288,60],{},[42,1290,1291],{},"Libellé du bouton d'envoi.",[24,1293,1294,1298,1303,1307],{},[42,1295,1296],{},[45,1297,349],{},[42,1299,1300],{},[45,1301,1302],{},"boolean",[42,1304,1305],{},[45,1306,664],{},[42,1308,1309],{},"L'application est en train d'envoyer. Le bouton affiche un indicateur et ignore les clics.",[24,1311,1312,1317,1322,1325],{},[42,1313,1314],{},[45,1315,1316],{},"uploadFunction",[42,1318,1319],{},[45,1320,1321],{},"(file: File) => Promise",[42,1323,1324],{},"—",[42,1326,1327],{},"Envoi des images insérées dans le corps.",[24,1329,1330,1335,1340,1345],{},[42,1331,1332],{},[45,1333,1334],{},"maxAttachments",[42,1336,1337],{},[45,1338,1339],{},"number",[42,1341,1342],{},[45,1343,1344],{},"10",[42,1346,1347,1348,1351],{},"Nombre maximum de pièces jointes. Au-delà, le bouton de pièce jointe est désactivé et une notification ",[45,1349,1350],{},"Attachment limit reached (10)."," s'affiche.",[24,1353,1354,1359,1364,1370],{},[42,1355,1356],{},[45,1357,1358],{},"allowedFileTypes",[42,1360,1361],{},[45,1362,1363],{},"string[]",[42,1365,1366,1369],{},[45,1367,1368],{},"[]"," (tous)",[42,1371,1372,1373,1376,1377,1380,1381,1384],{},"Types acceptés, en extensions (",[45,1374,1375],{},"\".pdf\"",") ou en types MIME (",[45,1378,1379],{},"\"image\u002F*\"","). Un fichier refusé est ignoré et une notification s'affiche : ",[45,1382,1383],{},"\"\u003Cnom>\" was skipped — file type not allowed."," Le serveur revérifie le type.",[24,1386,1387,1392,1397,1399],{},[42,1388,1389],{},[45,1390,1391],{},"extensions",[42,1393,1394],{},[45,1395,1396],{},"Extension[]",[42,1398,1324],{},[42,1400,1401],{},"Extensions Tiptap ajoutées après les extensions standard. Lues une seule fois, au montage.",[82,1403,1405,1406],{"id":1404},"propriétés-demailcomposer","Propriétés d'",[45,1407,47],{},[18,1409,1410,1420],{},[21,1411,1412],{},[24,1413,1414,1416,1418],{},[27,1415,1241],{},[27,1417,1247],{},[27,1419,1250],{},[37,1421,1422,1443,1460,1475],{},[24,1423,1424,1435,1440],{},[42,1425,1426,1041,1429,1041,1432],{},[45,1427,1428],{},"showTo",[45,1430,1431],{},"showCc",[45,1433,1434],{},"showBcc",[42,1436,1437],{},[45,1438,1439],{},"true",[42,1441,1442],{},"Affichent les lignes « À », « Cc » et « Cci ».",[24,1444,1445,1453,1457],{},[42,1446,1447,1041,1450],{},[45,1448,1449],{},"showFrom",[45,1451,1452],{},"showSubject",[42,1454,1455],{},[45,1456,664],{},[42,1458,1459],{},"Affichent les lignes « De » et « Objet ».",[24,1461,1462,1467,1469],{},[42,1463,1464],{},[45,1465,1466],{},"senders",[42,1468,1324],{},[42,1470,1471,1472,80],{},"Identités proposées dans la ligne « De » : tableau de ",[45,1473,1474],{},"{ email, label }",[24,1476,1477,1481,1483],{},[42,1478,1479],{},[45,1480,1227],{},[42,1482,1324],{},[42,1484,1485],{},"Fonction de recherche des destinataires. Sans elle, le champ accepte seulement des adresses saisies.",[14,1487,1488,1489,1492,1493,1495,1496,1041,1499,1041,1501,1041,1503,1041,1506,1041,1508,1510,1511,80],{},"Modèles ",[45,1490,1491],{},"v-model"," : ",[45,1494,242],{}," (modèle par défaut), ",[45,1497,1498],{},"from",[45,1500,255],{},[45,1502,273],{},[45,1504,1505],{},"bcc",[45,1507,315],{},[45,1509,291],{},". Un destinataire est un objet ",[45,1512,1513],{},"{ email, label?, image? }",[1515,1516,1518],"h3",{"id":1517},"destinataires","Destinataires",[14,1520,1521],{},"Chaque destinataire s'affiche en jeton, avec son avatar. Les lignes « Cc » et « Cci » s'ouvrent avec leur bouton. Fermer une ligne vide ses destinataires, pour qu'aucun ne soit envoyé sans être visible.",[14,1523,1524,1525,1527,1528,1530],{},"Glissez un jeton vers une autre ligne pour déplacer le destinataire, par exemple de « À » à « Cc ». Pendant le glissement, les lignes « Cc » et « Cci » s'ouvrent si ",[45,1526,1431],{}," et ",[45,1529,1434],{}," sont actifs.",[1515,1532,1534],{"id":1533},"réponse-citée","Réponse citée",[14,1536,1537,1538,1540,1541,80],{},"Le texte de ",[45,1539,291],{}," s'affiche sous le corps, dans un bloc repliable « ••• ». Le bloc reste hors de l'éditeur pour garder le HTML d'origine (tableaux, styles). À l'envoi, le Composer ajoute ce bloc à la fin de ",[45,1542,242],{},[82,1544,1546,1547],{"id":1545},"propriétés-de-commentcomposer","Propriétés de ",[45,1548,60],{},[14,1550,1551,1553,1554,1557,1558,1561,1562,1565,1566,1568],{},[45,1552,60],{}," accepte les propriétés communes, plus ",[45,1555,1556],{},"mentions"," : tableau de ",[45,1559,1560],{},"{ label, value }",". ",[45,1563,1564],{},"label"," est affiché dans la liste, ",[45,1567,953],{}," est inséré dans le texte.",[98,1570,1572],{"className":189,"code":1571,"language":191,"meta":103,"style":103},"\u003CCommentComposer\n    v-model=\"comment\"\n    :mentions=\"[{ label: 'Camille Martin', value: 'camille.martin@example.com' }]\"\n    @submit=\"onComment\"\n\u002F>\n",[45,1573,1574,1581,1595,1642,1658],{"__ignoreMap":103},[107,1575,1576,1578],{"class":109,"line":110},[107,1577,198],{"class":117},[107,1579,1580],{"class":201},"CommentComposer\n",[107,1582,1583,1586,1588,1590,1593],{"class":109,"line":149},[107,1584,1585],{"class":218},"    v-model",[107,1587,222],{"class":117},[107,1589,143],{"class":117},[107,1591,1592],{"class":121},"comment",[107,1594,229],{"class":117},[107,1596,1597,1600,1602,1604,1606,1609,1611,1613,1615,1618,1620,1623,1625,1628,1630,1632,1634,1636,1638,1640],{"class":109,"line":156},[107,1598,1599],{"class":117},"    :",[107,1601,1556],{"class":218},[107,1603,222],{"class":117},[107,1605,143],{"class":117},[107,1607,1608],{"class":121},"[",[107,1610,546],{"class":117},[107,1612,563],{"class":201},[107,1614,252],{"class":117},[107,1616,1617],{"class":117}," '",[107,1619,570],{"class":140},[107,1621,1622],{"class":117},"'",[107,1624,125],{"class":117},[107,1626,1627],{"class":201}," value",[107,1629,252],{"class":117},[107,1631,1617],{"class":117},[107,1633,556],{"class":140},[107,1635,1622],{"class":117},[107,1637,131],{"class":117},[107,1639,774],{"class":121},[107,1641,229],{"class":117},[107,1643,1644,1647,1649,1651,1653,1656],{"class":109,"line":232},[107,1645,1646],{"class":117},"    @",[107,1648,75],{"class":218},[107,1650,222],{"class":117},[107,1652,143],{"class":117},[107,1654,1655],{"class":121},"onComment",[107,1657,229],{"class":117},[107,1659,1660],{"class":109,"line":247},[107,1661,1662],{"class":121},"\u002F>\n",[82,1664,1666],{"id":1665},"événements","Événements",[18,1668,1669,1682],{},[21,1670,1671],{},[24,1672,1673,1676,1679],{},[27,1674,1675],{},"Événement",[27,1677,1678],{},"Contenu",[27,1680,1681],{},"Quand",[37,1683,1684,1705],{},[24,1685,1686,1690,1702],{},[42,1687,1688],{},[45,1689,75],{},[42,1691,1692,1492,1694,1561,1697,1492,1699,80],{},[45,1693,47],{},[45,1695,1696],{},"{ from, subject, to, cc, bcc, body, attachments }",[45,1698,60],{},[45,1700,1701],{},"{ body, attachments }",[42,1703,1704],{},"Clic sur le bouton d'envoi ou Ctrl+Entrée. Le Composer ne valide pas les champs.",[24,1706,1707,1712,1715],{},[42,1708,1709],{},[45,1710,1711],{},"remove-attachment",[42,1713,1714],{},"Le fichier retiré",[42,1716,1717],{},"L'utilisateur retire une pièce jointe. Supprimez alors le fichier sur le serveur si besoin.",[14,1719,1720,1721,1724],{},"Une pièce jointe est un objet ",[45,1722,1723],{},"{ name, file_name, file_url, file_type, file_size }",", comme le renvoie l'envoi de fichier.",[82,1726,1728],{"id":1727},"méthodes","Méthodes",[14,1730,1731,1732,1735],{},"Accédez aux méthodes avec une référence de modèle (",[45,1733,1734],{},"ref",") :",[18,1737,1738,1747],{},[21,1739,1740],{},[24,1741,1742,1745],{},[27,1743,1744],{},"Méthode",[27,1746,1250],{},[37,1748,1749,1761,1771,1781],{},[24,1750,1751,1755],{},[42,1752,1753],{},[45,1754,79],{},[42,1756,1757,1758,1760],{},"Vide le corps, les pièces jointes et la réponse citée. ",[45,1759,47],{}," vide aussi les destinataires et l'objet, mais garde l'expéditeur.",[24,1762,1763,1768],{},[42,1764,1765],{},[45,1766,1767],{},"focus()",[42,1769,1770],{},"Place le curseur dans le corps.",[24,1772,1773,1778],{},[42,1774,1775],{},[45,1776,1777],{},"submit()",[42,1779,1780],{},"Déclenche l'envoi, comme le bouton.",[24,1782,1783,1788],{},[42,1784,1785],{},[45,1786,1787],{},"editor",[42,1789,1790],{},"Instance de l'éditeur Tiptap.",[14,1792,1793,1794,1796],{},"La touche Échap appelle aussi ",[45,1795,79],{},", sauf si une liste ouverte (mentions) l'a déjà utilisée.",[82,1798,1800],{"id":1799},"emplacements-slots","Emplacements (slots)",[18,1802,1803,1814],{},[21,1804,1805],{},[24,1806,1807,1810,1812],{},[27,1808,1809],{},"Emplacement",[27,1811,29],{},[27,1813,1250],{},[37,1815,1816,1830,1850,1867],{},[24,1817,1818,1823,1827],{},[42,1819,1820],{},[45,1821,1822],{},"header",[42,1824,1825],{},[45,1826,47],{},[42,1828,1829],{},"Remplace les lignes d'en-tête. Un modèle vide n'affiche aucun en-tête.",[24,1831,1832,1837,1840],{},[42,1833,1834],{},[45,1835,1836],{},"actions",[42,1838,1839],{},"les deux",[42,1841,1842,1843,1527,1846,1849],{},"Actions supplémentaires à côté du bouton de pièce jointe. Reçoit ",[45,1844,1845],{},"addAttachment(file)",[45,1847,1848],{},"setUploading(value)"," pour un envoi de fichier personnalisé.",[24,1851,1852,1857,1859],{},[42,1853,1854],{},[45,1855,1856],{},"attachments",[42,1858,1839],{},[42,1860,1861,1862,1527,1864,80],{},"Remplace l'affichage des pièces jointes. Reçoit ",[45,1863,1856],{},[45,1865,1866],{},"remove(file)",[24,1868,1869,1874,1876],{},[42,1870,1871],{},[45,1872,1873],{},"footer",[42,1875,1839],{},[42,1877,1878],{},"Contenu fixé entre le corps et la barre d'outils : avertissement, réponses enregistrées…",[98,1880,1882],{"className":189,"code":1881,"language":191,"meta":103,"style":103},"\u003CEmailComposer ref=\"composer\" v-model=\"body\" v-model:to=\"to\" @submit=\"onSend\">\n    \u003Ctemplate #header>\n        \u003Cdiv class=\"px-2.5 pb-1 text-p-sm text-ink-gray-5\">Réponse à Camille Martin\u003C\u002Fdiv>\n    \u003C\u002Ftemplate>\n\u003C\u002FEmailComposer>\n",[45,1883,1884,1940,1945,1950,1955],{"__ignoreMap":103},[107,1885,1886,1888,1890,1892,1894,1896,1898,1900,1903,1905,1907,1909,1911,1913,1915,1917,1919,1921,1923,1925,1928,1930,1932,1934,1936,1938],{"class":109,"line":110},[107,1887,198],{"class":117},[107,1889,47],{"class":201},[107,1891,421],{"class":218},[107,1893,222],{"class":117},[107,1895,143],{"class":117},[107,1897,12],{"class":140},[107,1899,143],{"class":117},[107,1901,1902],{"class":218}," v-model",[107,1904,222],{"class":117},[107,1906,143],{"class":117},[107,1908,242],{"class":121},[107,1910,143],{"class":117},[107,1912,1902],{"class":218},[107,1914,252],{"class":117},[107,1916,255],{"class":218},[107,1918,222],{"class":117},[107,1920,143],{"class":117},[107,1922,255],{"class":121},[107,1924,143],{"class":117},[107,1926,1927],{"class":117}," @",[107,1929,75],{"class":218},[107,1931,222],{"class":117},[107,1933,143],{"class":117},[107,1935,373],{"class":121},[107,1937,143],{"class":117},[107,1939,205],{"class":117},[107,1941,1942],{"class":109,"line":149},[107,1943,1944],{"class":121},"    \u003Ctemplate #header>\n",[107,1946,1947],{"class":109,"line":156},[107,1948,1949],{"class":121},"        \u003Cdiv class=\"px-2.5 pb-1 text-p-sm text-ink-gray-5\">Réponse à Camille Martin\u003C\u002Fdiv>\n",[107,1951,1952],{"class":109,"line":232},[107,1953,1954],{"class":121},"    \u003C\u002Ftemplate>\n",[107,1956,1957,1959,1961],{"class":109,"line":247},[107,1958,387],{"class":117},[107,1960,47],{"class":201},[107,1962,205],{"class":117},[1964,1965,1966],"style",{},"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 .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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 .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 .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 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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":103,"searchDepth":110,"depth":149,"links":1968},[1969,1970,1971,1972,1977,1979,1980,1981],{"id":84,"depth":149,"text":85},{"id":185,"depth":149,"text":186},{"id":1231,"depth":149,"text":1232},{"id":1404,"depth":149,"text":1973,"children":1974},"Propriétés d'EmailComposer",[1975,1976],{"id":1517,"depth":156,"text":1518},{"id":1533,"depth":156,"text":1534},{"id":1545,"depth":149,"text":1978},"Propriétés de CommentComposer",{"id":1665,"depth":149,"text":1666},{"id":1727,"depth":149,"text":1728},{"id":1799,"depth":149,"text":1800},"Référence des composants Vue EmailComposer et CommentComposer de @framework\u002Fui pour rédiger un email ou un commentaire dans une application Dodock.","md",{"icon":1985,"reviewed":397,"last_verified":1986,"sources":1987},"i-mdi-email-edit-outline","2026-11-04",[1988,1989,1990,1991,1992,1993,1994,1995],"dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002Findex.ts","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002Ftypes.ts","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002FEmailComposer\u002FEmailComposer.vue","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002FCommentComposer\u002FCommentComposer.vue","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002FComposerEditor.vue","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002FEmailComposer\u002FHeaderFields.vue","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002FEmailComposer\u002FRecipientSelect.vue","dodock@develop:ui\u002Fsrc\u002Fcomponents\u002FComposer\u002Fstories\u002FQuickReply.vue","\u002Fnext\u002Fdodock\u002Fdeveloppeurs\u002Fcomposants-ui\u002Fcomposer",{"title":5,"description":1982},"2.next\u002F3.dodock\u002F10.developpeurs\u002F03.composants-ui\u002Fcomposer","lCmvxIjxjGzx-6AH5yZWbhecj0x0nNyoptKBAcvwru0",{},1793871738041]