{"id":4575,"date":"2022-12-12T17:56:38","date_gmt":"2022-12-12T22:56:38","guid":{"rendered":"https:\/\/ionic.io\/blog\/?p=4575"},"modified":"2022-12-13T10:18:54","modified_gmt":"2022-12-13T15:18:54","slug":"announcing-ionic-v6-4","status":"publish","type":"post","link":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4","title":{"rendered":"Announcing Ionic v6.4"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">We\u2019re excited to announce the release of Ionic 6.4, which contains improvements to <a href=\"https:\/\/ionicframework.com\/docs\/api\/modal\">modal<\/a><\/span><span style=\"font-weight: 400;\">, <a href=\"https:\/\/ionicframework.com\/docs\/api\/toast\">toast<\/a><\/span><span style=\"font-weight: 400;\">, and <a href=\"https:\/\/ionicframework.com\/docs\/api\/toggle\">toggle<\/a>.<\/span><\/p>\n<p><!--more--><\/p>\n<p><span style=\"font-weight: 400;\">Here\u2019s what\u2019s new in this release:<\/span><\/p>\n<h2>Modal canDismiss Improvements<\/h2>\n<p><span style=\"font-weight: 400;\">In <a href=\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-1\">Ionic 6.1<\/a><\/span><span style=\"font-weight: 400;\">, we added the <code class=\"language-xml\">canDismiss<\/code> property to <code class=\"language-xml\">ion-modal<\/code>. This property lets developers control precisely when users can leave a modal. In Ionic 6.4, we enhanced this feature by passing the \u201crole\u201d and \u201cdata\u201d information when providing a callback to <code class=\"language-xml\">canDismiss<\/code>. This can be used to make more informed decisions about when a modal should dismiss.<\/span><\/p>\n<pre><code class=\"language-typescript\">canDismiss(role: string, data: any) {\n\u00a0\u00a0\/\/ Disallow dismissing the modal via a swipe gesture\n\u00a0\u00a0return role !== \u2018gesture\u2019;\n}<\/code><\/pre>\n<h2>Toast Duration Configuration<\/h2>\n<p><span style=\"font-weight: 400;\">Toasts can now have the default <code class=\"language-xml\">duration<\/code> property customized globally using the new <code class=\"language-xml\">toastDuration<\/code> configuration.<\/span><\/p>\n<pre><code class=\"language-typescript\">IonicModule.forRoot({\n\u00a0\u00a0\/\/ All toasts will now dismiss after 5000ms.\n\u00a0\u00a0toastDuration: 5000\n});<\/code><\/pre>\n<p><span style=\"font-weight: 400;\">Thank you to <a href=\"https:\/\/github.com\/DwieDima\">@DwieDima <\/a><\/span><span style=\"font-weight: 400;\">for building this feature!<\/span><\/p>\n<h2>Toggle On\/Off Label Configuration<\/h2>\n<p><span style=\"font-weight: 400;\">In <a href=\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-2\">Ionic 6.2<\/a><\/span><span style=\"font-weight: 400;\">, we introduced the <code class=\"language-xml\">enableOnOffLabels<\/code> property to <code class=\"language-xml\">ion-toggle<\/code> to provide a better visual indication of state. In Ionic 6.4, we added the ability to customize this property on a global level using the new <code class=\"language-xml\">toggleOnOffLabels<\/code> configuration.<\/span><\/p>\n<pre><code class=\"language-typescript\">IonicModule.forRoot({\n\u00a0\u00a0\/\/ All toggles will have on\/off labels\n\u00a0\u00a0toggleOnOffLabels: true\n});<\/code><\/pre>\n<p><span style=\"font-weight: 400;\">Thank you to <a href=\"https:\/\/github.com\/EinfachHans\">@EinfachHans<\/a><\/span><span style=\"font-weight: 400;\">\u00a0for building this feature!<\/span><\/p>\n<h2>Thank You<\/h2>\n<p><span style=\"font-weight: 400;\">As we approach the end of 2022, we want to thank the entire Ionic community for making this an amazing year for the project. We have lots of exciting improvements in store for 2023!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">As always, we would love any feedback on our <a href=\"https:\/\/github.com\/ionic-team\/ionic-framework\">GitHub repo<\/a>.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>We\u2019re excited to announce the release of Ionic 6.4, which contains improvements to modal, toast, and toggle.<\/p>\n","protected":false},"author":72,"featured_media":4578,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"publish_to_discourse":"0","publish_post_category":"23","wpdc_auto_publish_overridden":"","wpdc_topic_tags":"","wpdc_pin_topic":"","wpdc_pin_until":"","discourse_post_id":"557010","discourse_permalink":"http:\/\/forum.ionicframework.com\/t\/announcing-ionic-v6-4\/229496","wpdc_publishing_response":"","wpdc_publishing_error":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[120],"tags":[23,241,98],"class_list":["post-4575","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-announcements","tag-framework","tag-ionic-6","tag-release"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.0 (Yoast SEO v23.0) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Announcing Ionic v6.4 - Ionic Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Announcing Ionic v6.4\" \/>\n<meta property=\"og:description\" content=\"We\u2019re excited to announce the release of Ionic 6.4, which contains improvements to modal, toast, and toggle.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\" \/>\n<meta property=\"og:site_name\" content=\"Ionic Blog\" \/>\n<meta property=\"article:published_time\" content=\"2022-12-12T22:56:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-12-13T15:18:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2240\" \/>\n\t<meta property=\"og:image:height\" content=\"1120\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Liam DeBeasi\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@LiamDeBeasi\" \/>\n<meta name=\"twitter:site\" content=\"@ionicframework\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Liam DeBeasi\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#article\",\"isPartOf\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\"},\"author\":{\"name\":\"Liam DeBeasi\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/d314e583cf08e7a28c51e8ffc3d621fa\"},\"headline\":\"Announcing Ionic v6.4\",\"datePublished\":\"2022-12-12T22:56:38+00:00\",\"dateModified\":\"2022-12-13T15:18:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\"},\"wordCount\":198,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/ionic.io\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png\",\"keywords\":[\"Framework\",\"Ionic 6\",\"release\"],\"articleSection\":[\"Announcements\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\",\"url\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\",\"name\":\"Announcing Ionic v6.4 - Ionic Blog\",\"isPartOf\":{\"@id\":\"https:\/\/ionic.io\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png\",\"datePublished\":\"2022-12-12T22:56:38+00:00\",\"dateModified\":\"2022-12-13T15:18:54+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png\",\"width\":2240,\"height\":1120},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/ionic.io\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Announcing Ionic v6.4\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/ionic.io\/blog\/#website\",\"url\":\"https:\/\/ionic.io\/blog\/\",\"name\":\"ionic.io\/blog\",\"description\":\"Build amazing native and progressive web apps with the web\",\"publisher\":{\"@id\":\"https:\/\/ionic.io\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/ionic.io\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/ionic.io\/blog\/#organization\",\"name\":\"Ionic\",\"url\":\"https:\/\/ionic.io\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png\",\"width\":1920,\"height\":854,\"caption\":\"Ionic\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/x.com\/ionicframework\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/d314e583cf08e7a28c51e8ffc3d621fa\",\"name\":\"Liam DeBeasi\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/01\/ZNK4lRAJ_400x400-150x150.jpg\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/01\/ZNK4lRAJ_400x400-150x150.jpg\",\"caption\":\"Liam DeBeasi\"},\"sameAs\":[\"https:\/\/x.com\/LiamDeBeasi\"],\"url\":\"https:\/\/ionic.io\/blog\/author\/liam\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Announcing Ionic v6.4 - Ionic Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4","og_locale":"en_US","og_type":"article","og_title":"Announcing Ionic v6.4","og_description":"We\u2019re excited to announce the release of Ionic 6.4, which contains improvements to modal, toast, and toggle.","og_url":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4","og_site_name":"Ionic Blog","article_published_time":"2022-12-12T22:56:38+00:00","article_modified_time":"2022-12-13T15:18:54+00:00","og_image":[{"width":2240,"height":1120,"url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png","type":"image\/png"}],"author":"Liam DeBeasi","twitter_card":"summary_large_image","twitter_creator":"@LiamDeBeasi","twitter_site":"@ionicframework","twitter_misc":{"Written by":"Liam DeBeasi","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#article","isPartOf":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4"},"author":{"name":"Liam DeBeasi","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/d314e583cf08e7a28c51e8ffc3d621fa"},"headline":"Announcing Ionic v6.4","datePublished":"2022-12-12T22:56:38+00:00","dateModified":"2022-12-13T15:18:54+00:00","mainEntityOfPage":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4"},"wordCount":198,"commentCount":0,"publisher":{"@id":"https:\/\/ionic.io\/blog\/#organization"},"image":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage"},"thumbnailUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png","keywords":["Framework","Ionic 6","release"],"articleSection":["Announcements"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#respond"]}]},{"@type":"WebPage","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4","url":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4","name":"Announcing Ionic v6.4 - Ionic Blog","isPartOf":{"@id":"https:\/\/ionic.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage"},"image":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage"},"thumbnailUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png","datePublished":"2022-12-12T22:56:38+00:00","dateModified":"2022-12-13T15:18:54+00:00","breadcrumb":{"@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ionic.io\/blog\/announcing-ionic-v6-4"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#primaryimage","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png","width":2240,"height":1120},{"@type":"BreadcrumbList","@id":"https:\/\/ionic.io\/blog\/announcing-ionic-v6-4#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ionic.io\/blog"},{"@type":"ListItem","position":2,"name":"Announcing Ionic v6.4"}]},{"@type":"WebSite","@id":"https:\/\/ionic.io\/blog\/#website","url":"https:\/\/ionic.io\/blog\/","name":"ionic.io\/blog","description":"Build amazing native and progressive web apps with the web","publisher":{"@id":"https:\/\/ionic.io\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ionic.io\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/ionic.io\/blog\/#organization","name":"Ionic","url":"https:\/\/ionic.io\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png","width":1920,"height":854,"caption":"Ionic"},"image":{"@id":"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/ionicframework"]},{"@type":"Person","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/d314e583cf08e7a28c51e8ffc3d621fa","name":"Liam DeBeasi","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/image\/","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/01\/ZNK4lRAJ_400x400-150x150.jpg","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/01\/ZNK4lRAJ_400x400-150x150.jpg","caption":"Liam DeBeasi"},"sameAs":["https:\/\/x.com\/LiamDeBeasi"],"url":"https:\/\/ionic.io\/blog\/author\/liam"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/12\/framework6-4-feature-image.png","_links":{"self":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4575","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/users\/72"}],"replies":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/comments?post=4575"}],"version-history":[{"count":1,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4575\/revisions"}],"predecessor-version":[{"id":5002,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4575\/revisions\/5002"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/media\/4578"}],"wp:attachment":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/media?parent=4575"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/categories?post=4575"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/tags?post=4575"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}