@ionic/vue 8.5.9 → 8.6.0

package/dist/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "http://json.schemastore.org/web-types",
   "framework": "vue",
   "name": "@ionic/vue",
-  "version": "8.5.9",
+  "version": "8.6.0",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -229,7 +229,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the action sheet is presented.",
               "required": false,
               "value": {
@@ -247,7 +247,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the action sheet.",
               "required": false,
               "value": {
@@ -276,7 +276,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the action sheet is dismissed.",
               "required": false,
               "value": {
@@ -455,7 +455,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the alert is presented.",
               "required": false,
               "value": {
@@ -473,7 +473,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the alert.",
               "required": false,
               "value": {
@@ -512,7 +512,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the alert is dismissed.",
               "required": false,
               "value": {
@@ -719,7 +719,7 @@
               }
             },
             {
-              "name": "routerAnimation",
+              "name": "router-animation",
               "description": "When using a router, it specifies the transition animation when navigating to\nanother page.",
               "required": false,
               "value": {
@@ -910,7 +910,7 @@
               }
             },
             {
-              "name": "routerAnimation",
+              "name": "router-animation",
               "description": "When using a router, it specifies the transition animation when navigating to\nanother page using `href`.",
               "required": false,
               "value": {
@@ -1144,7 +1144,7 @@
               }
             },
             {
-              "name": "routerAnimation",
+              "name": "router-animation",
               "description": "When using a router, it specifies the transition animation when navigating to\nanother page using `href`.",
               "required": false,
               "value": {
@@ -1349,7 +1349,7 @@
               }
             },
             {
-              "name": "routerAnimation",
+              "name": "router-animation",
               "description": "When using a router, it specifies the transition animation when navigating to\nanother page using `href`.",
               "required": false,
               "value": {
@@ -2168,7 +2168,7 @@
               }
             },
             {
-              "name": "formatOptions",
+              "name": "format-options",
               "description": "Formatting options for dates and times.\nShould include a 'date' and/or 'time' object, each of which is of type [Intl.DateTimeFormatOptions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#options).",
               "required": false,
               "value": {
@@ -2177,7 +2177,7 @@
               }
             },
             {
-              "name": "highlightedDates",
+              "name": "highlighted-dates",
               "description": "Used to apply custom text and background colors to specific dates.\n\nCan be either an array of objects containing ISO strings and colors,\nor a callback that receives an ISO string and returns the colors.\n\nOnly applies to the `date`, `date-time`, and `time-date` presentations,\nwith `preferWheel=\"false\"`.",
               "required": false,
               "value": {
@@ -2204,7 +2204,7 @@
               }
             },
             {
-              "name": "isDateEnabled",
+              "name": "is-date-enabled",
               "description": "Returns if an individual date (calendar day) is enabled or disabled.\n\nIf `true`, the day will be enabled/interactive.\nIf `false`, the day will be disabled/non-interactive.\n\nThe function accepts an ISO 8601 date string of a given day.\nBy default, all days are enabled. Developers can use this function\nto write custom logic to disable certain days.\n\nThe function is called for each rendered calendar day, for the previous, current and next month.\nCustom implementations should be optimized for performance to avoid jank.",
               "required": false,
               "value": {
@@ -2317,6 +2317,16 @@
                 "type": "boolean"
               }
             },
+            {
+              "name": "show-adjacent-days",
+              "description": "If `true`, the datetime calendar displays a six-week (42-day) layout,\nincluding days from the previous and next months to fill the grid.\nThese adjacent days are selectable unless disabled.",
+              "required": false,
+              "default": "false",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
             {
               "name": "show-clear-button",
               "description": "If `true`, a \"Clear\" button will be rendered alongside\nthe default \"Cancel\" and \"OK\" buttons at the bottom of the `ion-datetime`\ncomponent. Developers can also use the `button` slot\nif they want to customize these buttons. If custom\nbuttons are set in the `button` slot then the\ndefault buttons will not be rendered.",
@@ -2368,7 +2378,7 @@
               }
             },
             {
-              "name": "titleSelectedDatesFormatter",
+              "name": "title-selected-dates-formatter",
               "description": "A callback used to format the header text that shows how many\ndates are selected. Only used if there are 0 or more than 1\nselected (i.e. unused for exactly 1). By default, the header\ntext is set to \"numberOfDates days\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
               "required": false,
               "value": {
@@ -2648,7 +2658,7 @@
               }
             },
             {
-              "name": "routerAnimation",
+              "name": "router-animation",
               "description": "When using a router, it specifies the transition animation when navigating to\nanother page using `href`.",
               "required": false,
               "value": {
@@ -3121,7 +3131,7 @@
               }
             },
             {
-              "name": "counterFormatter",
+              "name": "counter-formatter",
               "description": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
               "required": false,
               "value": {
@@ -3420,6 +3430,196 @@
             }
           ]
         },
+        {
+          "name": "IonInputOtp",
+          "doc-url": "https://ionicframework.com/docs/api/input-otp",
+          "description": "",
+          "source": {
+            "module": "@ionic/core/src/components/input-otp/input-otp.d.ts",
+            "symbol": "InputOtp"
+          },
+          "attributes": [
+            {
+              "name": "autocapitalize",
+              "description": "Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.\nAvailable options: `\"off\"`, `\"none\"`, `\"on\"`, `\"sentences\"`, `\"words\"`, `\"characters\"`.",
+              "required": false,
+              "default": "'off'",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "color",
+              "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "\"danger\" | \"dark\" | \"light\" | \"medium\" | \"primary\" | \"secondary\" | \"success\" | \"tertiary\" | \"warning\" | string & Record<never, never> | undefined"
+              }
+            },
+            {
+              "name": "disabled",
+              "description": "If `true`, the user cannot interact with the input.",
+              "required": false,
+              "default": "false",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "fill",
+              "description": "The fill for the input boxes. If `\"solid\"` the input boxes will have a background. If\n`\"outline\"` the input boxes will be transparent with a border.",
+              "required": false,
+              "default": "'outline'",
+              "value": {
+                "kind": "expression",
+                "type": "\"outline\" | \"solid\" | undefined"
+              }
+            },
+            {
+              "name": "inputmode",
+              "description": "A hint to the browser for which keyboard to display.\nPossible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n`\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.\n\nFor numbers (type=\"number\"): \"numeric\"\nFor text (type=\"text\"): \"text\"",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "\"decimal\" | \"email\" | \"none\" | \"numeric\" | \"search\" | \"tel\" | \"text\" | \"url\" | undefined"
+              }
+            },
+            {
+              "name": "length",
+              "description": "The number of input boxes to display.",
+              "required": false,
+              "default": "4",
+              "value": {
+                "kind": "expression",
+                "type": "number"
+              }
+            },
+            {
+              "name": "pattern",
+              "description": "A regex pattern string for allowed characters. Defaults based on type.\n\nFor numbers (`type=\"number\"`): `\"[\\p{N}]\"`\nFor text (`type=\"text\"`): `\"[\\p{L}\\p{N}]\"`",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "string | undefined"
+              }
+            },
+            {
+              "name": "readonly",
+              "description": "If `true`, the user cannot modify the value.",
+              "required": false,
+              "default": "false",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "separators",
+              "description": "Where separators should be shown between input boxes.\nCan be a comma-separated string or an array of numbers.\n\nFor example:\n`\"3\"` will show a separator after the 3rd input box.\n`[1,4]` will show a separator after the 1st and 4th input boxes.\n`\"all\"` will show a separator between every input box.",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "number[] | string | undefined"
+              }
+            },
+            {
+              "name": "shape",
+              "description": "The shape of the input boxes.\nIf \"round\" they will have an increased border radius.\nIf \"rectangular\" they will have no border radius.\nIf \"soft\" they will have a soft border radius.",
+              "required": false,
+              "default": "'round'",
+              "value": {
+                "kind": "expression",
+                "type": "\"rectangular\" | \"round\" | \"soft\""
+              }
+            },
+            {
+              "name": "size",
+              "description": "The size of the input boxes.",
+              "required": false,
+              "default": "'medium'",
+              "value": {
+                "kind": "expression",
+                "type": "\"large\" | \"medium\" | \"small\""
+              }
+            },
+            {
+              "name": "type",
+              "description": "The type of input allowed in the input boxes.",
+              "required": false,
+              "default": "'number'",
+              "value": {
+                "kind": "expression",
+                "type": "\"number\" | \"text\""
+              }
+            },
+            {
+              "name": "value",
+              "description": "The value of the input group.",
+              "required": false,
+              "default": "''",
+              "value": {
+                "kind": "expression",
+                "type": "null | number | string | undefined"
+              }
+            }
+          ],
+          "slots": [],
+          "events": [
+            {
+              "name": "ionBlur",
+              "description": "Emitted when the input group loses focus.",
+              "arguments": [
+                {
+                  "name": "detail",
+                  "type": "FocusEvent"
+                }
+              ]
+            },
+            {
+              "name": "ionChange",
+              "description": "The `ionChange` event is fired when the user modifies the input's value.\nUnlike the `ionInput` event, the `ionChange` event is only fired when changes\nare committed, not as the user types.\n\nThe `ionChange` event fires when the `<ion-input-otp>` component loses\nfocus after its value has changed.\n\nThis event will not emit when programmatically setting the `value` property.",
+              "arguments": [
+                {
+                  "name": "detail",
+                  "type": "InputOtpChangeEventDetail"
+                }
+              ]
+            },
+            {
+              "name": "ionComplete",
+              "description": "Emitted when all input boxes have been filled with valid values.",
+              "arguments": [
+                {
+                  "name": "detail",
+                  "type": "InputOtpCompleteEventDetail"
+                }
+              ]
+            },
+            {
+              "name": "ionFocus",
+              "description": "Emitted when the input group has focus.",
+              "arguments": [
+                {
+                  "name": "detail",
+                  "type": "FocusEvent"
+                }
+              ]
+            },
+            {
+              "name": "ionInput",
+              "description": "The `ionInput` event is fired each time the user modifies the input's value.\nUnlike the `ionChange` event, the `ionInput` event is fired for each alteration\nto the input's value. This typically happens for each keystroke as the user types.\n\nFor elements that accept text input (`type=text`, `type=tel`, etc.), the interface\nis [`InputEvent`](https://developer.mozilla.org/en-US/docs/Web/API/InputEvent); for others,\nthe interface is [`Event`](https://developer.mozilla.org/en-US/docs/Web/API/Event). If\nthe input is cleared on edit, the type is `null`.",
+              "arguments": [
+                {
+                  "name": "detail",
+                  "type": "InputOtpInputEventDetail"
+                }
+              ]
+            }
+          ]
+        },
         {
           "name": "IonInputPasswordToggle",
           "doc-url": "https://ionicframework.com/docs/api/input-password-toggle",
@@ -3572,7 +3772,7 @@
               }
             },
             {
-              "name": "routerAnimation",
+              "name": "router-animation",
               "description": "When using a router, it specifies the transition animation when navigating to\nanother page using `href`.",
               "required": false,
               "value": {
@@ -4052,7 +4252,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the loading indicator is presented.",
               "required": false,
               "value": {
@@ -4061,7 +4261,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the loader.",
               "required": false,
               "value": {
@@ -4090,7 +4290,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the loading indicator is dismissed.",
               "required": false,
               "value": {
@@ -4526,7 +4726,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the modal is presented.",
               "required": false,
               "value": {
@@ -4574,7 +4774,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the modal.",
               "required": false,
               "value": {
@@ -4622,7 +4822,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the modal is dismissed.",
               "required": false,
               "value": {
@@ -4640,7 +4840,7 @@
               }
             },
             {
-              "name": "presentingElement",
+              "name": "presenting-element",
               "description": "The element that presented the modal. This is used for card presentation effects\nand for stacking multiple modals on top of each other. Only applies in iOS mode.",
               "required": false,
               "value": {
@@ -5002,7 +5202,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the picker is presented.",
               "required": false,
               "value": {
@@ -5011,7 +5211,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the picker.",
               "required": false,
               "value": {
@@ -5040,7 +5240,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the picker is dismissed.",
               "required": false,
               "value": {
@@ -5219,7 +5419,7 @@
               }
             },
             {
-              "name": "componentProps",
+              "name": "component-props",
               "description": "The data to pass to the popover component.\nYou only need to use this if you are not using\na JavaScript framework. Otherwise, you can just\nset the props directly on your component.",
               "required": false,
               "value": {
@@ -5238,7 +5438,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the popover is presented.",
               "required": false,
               "value": {
@@ -5266,7 +5466,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the popover.",
               "required": false,
               "value": {
@@ -5305,7 +5505,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the popover is dismissed.",
               "required": false,
               "value": {
@@ -5871,7 +6071,7 @@
               }
             },
             {
-              "name": "pinFormatter",
+              "name": "pin-formatter",
               "description": "A callback used to format the pin text.\nBy default the pin text is set to `Math.round(value)`.\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
               "required": false,
               "default": "(value: number): number => Math.round(value)",
@@ -6239,7 +6439,7 @@
           },
           "attributes": [
             {
-              "name": "beforeEnter",
+              "name": "before-enter",
               "description": "A navigation hook that is fired when the route tries to enter.\nReturning `true` allows the navigation to proceed, while returning\n`false` causes it to be cancelled. Returning a `NavigationHookOptions`\nobject causes the router to redirect to the path specified.",
               "required": false,
               "value": {
@@ -6248,7 +6448,7 @@
               }
             },
             {
-              "name": "beforeLeave",
+              "name": "before-leave",
               "description": "A navigation hook that is fired when the route tries to leave.\nReturning `true` allows the navigation to proceed, while returning\n`false` causes it to be cancelled. Returning a `NavigationHookOptions`\nobject causes the router to redirect to the path specified.",
               "required": false,
               "value": {
@@ -6266,7 +6466,7 @@
               }
             },
             {
-              "name": "componentProps",
+              "name": "component-props",
               "description": "A key value `{ 'red': true, 'blue': 'white'}` containing props that should be passed\nto the defined component when rendered.",
               "required": false,
               "value": {
@@ -7638,7 +7838,7 @@
               }
             },
             {
-              "name": "counterFormatter",
+              "name": "counter-formatter",
               "description": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
               "required": false,
               "value": {
@@ -8000,7 +8200,7 @@
               }
             },
             {
-              "name": "enterAnimation",
+              "name": "enter-animation",
               "description": "Animation to use when the toast is presented.",
               "required": false,
               "value": {
@@ -8018,7 +8218,7 @@
               }
             },
             {
-              "name": "htmlAttributes",
+              "name": "html-attributes",
               "description": "Additional attributes to pass to the toast.",
               "required": false,
               "value": {
@@ -8066,7 +8266,7 @@
               }
             },
             {
-              "name": "leaveAnimation",
+              "name": "leave-animation",
               "description": "Animation to use when the toast is dismissed.",
               "required": false,
               "value": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue",
-  "version": "8.5.9",
+  "version": "8.6.0",
   "description": "Vue specific wrapper for @ionic/core",
   "scripts": {
     "eslint": "eslint src",
@@ -67,7 +67,7 @@
     "vue-router": "^4.0.16"
   },
   "dependencies": {
-    "@ionic/core": "8.5.9",
+    "@ionic/core": "8.6.0",
     "@stencil/vue-output-target": "0.10.7",
     "ionicons": "^7.0.0"
   },