@lion/ui 0.22.0 → 0.23.0

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@lion/ui",
-  "version": "0.22.0",
+  "version": "0.23.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -308,7 +308,7 @@
         },
         {
           "name": "lion-combobox",
-          "description": "LionCombobox: implements the wai-aria combobox design pattern and integrates it as a Lion\nFormControl\n\n---\n\n\n### **Events:**\n - **model-value-changed**\n\n### **Methods:**\n - **matchCondition(option: _LionOption_, textboxValue: _string_)** - When the preconfigurable `match-mode` conditions are not sufficient,\none can define a custom matching function.\n- **parser(value: _string|string[]_): _*_** - Converts viewValue to modelValue\n\n\n\n\n### **Slots:**\n - **listbox** - The listbox element for the combobox, e.g. <lion-options>\n- **selection-display** - The selection display element for the combobox, e.g. <lion-selection-display>",
+          "description": "LionCombobox: implements the wai-aria combobox design pattern and integrates it as a Lion\nFormControl\n\n---\n\n\n### **Events:**\n - **model-value-changed**\n- **opened-changed**\n\n### **Methods:**\n - **close()** - Hides the overlay\n- **matchCondition(option: _LionOption_, textboxValue: _string_)** - When the preconfigurable `match-mode` conditions are not sufficient,\none can define a custom matching function.\n- **open()** - Shows the overlay\n- **parser(value: _string|string[]_): _*_** - Converts viewValue to modelValue\n- **repositionOverlay()** - Sometimes it's needed to recompute Popper position of an overlay, for instance when we have\nan opened combobox and the surrounding context changes (the space consumed by the textbox\nincreases vertically)\n- **toggle()** - Toggles the overlay\n\n\n\n\n\n\n\n### **Slots:**\n - **listbox** - The listbox element for the combobox, e.g. <lion-options>\n- **selection-display** - The selection display element for the combobox, e.g. <lion-selection-display>",
           "doc-url": "",
           "attributes": [
             {
@@ -338,6 +338,11 @@
             {
               "name": "__shouldAutocompleteNextUpdate",
               "value": { "type": "string" }
+            },
+            {
+              "name": "opened",
+              "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
           "slots": [
@@ -350,7 +355,10 @@
               "description": "The selection display element for the combobox, e.g. <lion-selection-display>"
             }
           ],
-          "events": [{ "name": "model-value-changed", "type": "CustomEvent" }],
+          "events": [
+            { "name": "model-value-changed", "type": "CustomEvent" },
+            { "name": "opened-changed", "type": "CustomEvent" }
+          ],
           "js": {
             "properties": [
               { "name": "allowCustomChoice", "type": "boolean" },
@@ -359,12 +367,22 @@
                 "description": "When \"list\", will filter listbox suggestions based on textbox value.\nWhen \"both\", an inline completion string will be added to the textbox as well.",
                 "type": "'none'|'list'|'inline'|'both'"
               },
+              {
+                "name": "config",
+                "description": "Configure the many options of the `OverlayController`",
+                "type": "Partial<OverlayConfig>"
+              },
               {
                 "name": "matchMode",
                 "description": "When typing in the textbox, will by default be set on 'begin',\nonly matching the beginning part in suggestion list.\n=> 'a' will match 'apple' from ['apple', 'pear', 'citrus'].\nWhen set to 'all', will match middle of the word as well\n=> 'a' will match 'apple' and 'pear'",
                 "type": "'begin'|'all'"
               },
               { "name": "modelValue" },
+              {
+                "name": "opened",
+                "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+                "type": "boolean"
+              },
               {
                 "name": "requireOptionMatch",
                 "description": "If set to false, the value is allowed to not match any of the options.\nWe set the default to true for backwards compatibility",
@@ -383,23 +401,43 @@
                 "description": "We define the value getter/setter below as also defined in LionField (via FormatMixin).\nSince FormatMixin is meant for Formgroups/ChoiceGroup it's not applied on Combobox;\nCombobox is somewhat of a hybrid between a ChoiceGroup and LionField, therefore we copy over\nsome of the LionField members to align with its interface.\n\nThe view value. Will be delegated to `._inputNode.value`"
               }
             ],
-            "events": [{ "name": "model-value-changed", "type": "CustomEvent" }]
+            "events": [
+              { "name": "model-value-changed", "type": "CustomEvent" },
+              { "name": "opened-changed", "type": "CustomEvent" }
+            ]
           }
         },
         {
           "name": "lion-dialog",
-          "description": "\n\n---\n",
+          "description": "\n\n---\n\n\n### **Events:**\n - **opened-changed**\n\n### **Methods:**\n - **close()** - Hides the overlay\n- **open()** - Shows the overlay\n- **repositionOverlay()** - Sometimes it's needed to recompute Popper position of an overlay, for instance when we have\nan opened combobox and the surrounding context changes (the space consumed by the textbox\nincreases vertically)\n- **toggle()** - Toggles the overlay\n\n\n",
           "doc-url": "",
           "attributes": [
             {
               "name": "is-alert-dialog",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "opened",
+              "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
-          "events": [],
+          "events": [{ "name": "opened-changed", "type": "CustomEvent" }],
           "js": {
-            "properties": [{ "name": "isAlertDialog", "type": "boolean" }],
-            "events": []
+            "properties": [
+              {
+                "name": "config",
+                "description": "Configure the many options of the `OverlayController`",
+                "type": "Partial<OverlayConfig>"
+              },
+              { "name": "isAlertDialog", "type": "boolean" },
+              {
+                "name": "opened",
+                "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+                "type": "boolean"
+              }
+            ],
+            "events": [{ "name": "opened-changed", "type": "CustomEvent" }]
           }
         },
         {
@@ -749,6 +787,10 @@
               "name": "currency",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
+            {
+              "name": "currency-label",
+              "value": { "type": "string", "default": "''" }
+            },
             { "name": "modelValue", "value": { "type": "string" } },
             {
               "name": "readonly",
@@ -773,6 +815,7 @@
                 "type": "CurrencyCode[]"
               },
               { "name": "currency", "type": "string | undefined" },
+              { "name": "currencyLabel", "type": "string" },
               { "name": "defaultValidators", "type": "array" },
               { "name": "deserializer" },
               { "name": "formatter" },
@@ -811,6 +854,10 @@
               "name": "currency",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
+            {
+              "name": "currency-label",
+              "value": { "type": "string", "default": "''" }
+            },
             { "name": "modelValue", "value": { "type": "string" } },
             {
               "name": "readonly",
@@ -830,6 +877,7 @@
           "js": {
             "properties": [
               { "name": "currency", "type": "string | undefined" },
+              { "name": "currencyLabel", "type": "string" },
               { "name": "formatter" },
               { "name": "locale", "type": "string | undefined" },
               { "name": "modelValue" },
@@ -886,7 +934,7 @@
         },
         {
           "name": "lion-input-datepicker",
-          "description": "\n\n---\n\n\n### **Events:**\n - **user-input-changed**\n\n### **Methods:**\n - **clear()** - Clears modelValue.\nInteraction states are not cleared (use resetInteractionState for this)\n- **reset()** - Resets modelValue to initial value.\nInteraction states are cleared\n\n\n\n\n\n\n\n",
+          "description": "\n\n---\n\n\n### **Events:**\n - **opened-changed**\n- **user-input-changed**\n\n### **Methods:**\n - **clear()** - Clears modelValue.\nInteraction states are not cleared (use resetInteractionState for this)\n- **close()** - Hides the overlay\n- **open()** - Shows the overlay\n- **repositionOverlay()** - Sometimes it's needed to recompute Popper position of an overlay, for instance when we have\nan opened combobox and the surrounding context changes (the space consumed by the textbox\nincreases vertically)\n- **reset()** - Resets modelValue to initial value.\nInteraction states are cleared\n- **toggle()** - Toggles the overlay\n\n\n\n\n\n\n\n\n\n\n",
           "doc-url": "",
           "attributes": [
             {
@@ -894,6 +942,11 @@
               "description": "The heading to be added on top of the calendar overlay.\nNaming chosen from an Application Developer perspective.\nFor a Subclasser 'calendarOverlayHeading' would be more appropriate.",
               "value": { "type": "string" }
             },
+            {
+              "name": "opened",
+              "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+              "value": { "type": "boolean", "default": "false" }
+            },
             { "name": "modelValue", "value": { "type": "string" } },
             {
               "name": "readonly",
@@ -909,7 +962,10 @@
               "value": { "type": "string", "default": "''" }
             }
           ],
-          "events": [{ "name": "user-input-changed", "type": "Event" }],
+          "events": [
+            { "name": "opened-changed", "type": "CustomEvent" },
+            { "name": "user-input-changed", "type": "Event" }
+          ],
           "js": {
             "properties": [
               {
@@ -917,8 +973,18 @@
                 "description": "The heading to be added on top of the calendar overlay.\nNaming chosen from an Application Developer perspective.\nFor a Subclasser 'calendarOverlayHeading' would be more appropriate.",
                 "type": "string"
               },
+              {
+                "name": "config",
+                "description": "Configure the many options of the `OverlayController`",
+                "type": "Partial<OverlayConfig>"
+              },
               { "name": "formatter" },
               { "name": "modelValue" },
+              {
+                "name": "opened",
+                "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+                "type": "boolean"
+              },
               { "name": "parser" },
               { "name": "placeholder", "type": "string" },
               {
@@ -929,7 +995,10 @@
               { "name": "slots" },
               { "name": "type", "type": "string" }
             ],
-            "events": [{ "name": "user-input-changed", "type": "Event" }]
+            "events": [
+              { "name": "opened-changed", "type": "CustomEvent" },
+              { "name": "user-input-changed", "type": "Event" }
+            ]
           }
         },
         {
@@ -1526,6 +1595,86 @@
             "events": []
           }
         },
+        {
+          "name": "lion-menu",
+          "description": "LionMenu is a list of choices. Whether it opens as an overlay or as a regular\ncollapsible (disclosure) is configurable via `openable-mode`.\n\nN.B. the actual switching will be delegated to the disclosure system (see the\nvisibility-toggle controller); for now `disclosure` is the default.\n\n---\n\n\n### **Methods:**\n - **setCheckedIndex(index: _number_)** - Allows groups within one level. In case we deal with menuitemcheckbox,\nwe treat it as multiple choice group",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "openable-mode",
+              "description": "Terminology aligned with https://open-ui.org/components/openable.explainer/",
+              "value": {
+                "type": "'disclosure'|'overlay'",
+                "default": "'disclosure'"
+              }
+            },
+            {
+              "name": "bar",
+              "description": "Enable bar to use [role=\"menubar\"] and horizontal navigation",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "bar",
+                "description": "Enable bar to use [role=\"menubar\"] and horizontal navigation",
+                "type": "boolean"
+              },
+              { "name": "behaveAsAccordion", "type": "boolean" },
+              { "name": "invokerInteraction", "type": "string" },
+              {
+                "name": "openableMode",
+                "description": "Terminology aligned with https://open-ui.org/components/openable.explainer/",
+                "type": "'disclosure'|'overlay'"
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": "lion-item",
+          "description": "Lightweight component supporting InteractiveListItemRole as a type.\n\nSupports:\n- 1. menu item\n<lion-item> Item label </lion-item>\n- 2. sub menu\n<lion-item>\n  <button slot=\"invoker\"> Item label </button>\n  <lion-menu slot=\"subitems\"> ... </lion-menu>\n</lion-item>\n\nSets the role property on the right element. For case 1, this would be the item itself,\nfor case 2 it would be the [slot=invoker].\n\n---\n",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "type",
+              "value": {
+                "type": "InteractiveListItemRole |''",
+                "default": "''"
+              }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "type", "type": "InteractiveListItemRole |''" }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": "lion-menuitem",
+          "description": "\n\n---\n",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "type",
+              "value": {
+                "type": "InteractiveListItemRole |''",
+                "default": "''"
+              }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "type", "type": "InteractiveListItemRole |''" }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "lion-pagination",
           "description": "`LionPagination` is a class for custom Pagination element (`<lion-pagination>` web component).\n\n---\n\n\n### **Methods:**\n - **first()** - Go to first page\n- **goto(pageNumber: _number_)** - Go to the specific page\n- **last()** - Go to the last page\n- **next()** - Go next in pagination\n- **previous()** - Go back in pagination\n\n\n\n",
@@ -1620,7 +1769,7 @@
         },
         {
           "name": "lion-field-with-select",
-          "description": "LionSelectRich: wraps the <lion-listbox> element\n\n---\n\n\n### **Events:**\n - **blur**\n\n### **Methods:**\n \n\n",
+          "description": "LionSelectRich: wraps the <lion-listbox> element\n\n---\n\n\n### **Events:**\n - **blur**\n- **opened-changed**\n\n### **Methods:**\n - **close()** - Hides the overlay\n- **open()** - Shows the overlay\n- **repositionOverlay()** - Sometimes it's needed to recompute Popper position of an overlay, for instance when we have\nan opened combobox and the surrounding context changes (the space consumed by the textbox\nincreases vertically)\n- **toggle()** - Toggles the overlay\n\n\n\n\n\n",
           "doc-url": "",
           "attributes": [
             {
@@ -1639,11 +1788,24 @@
             {
               "name": "single-option",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "opened",
+              "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
-          "events": [{ "name": "blur", "type": "Event" }],
+          "events": [
+            { "name": "blur", "type": "Event" },
+            { "name": "opened-changed", "type": "CustomEvent" }
+          ],
           "js": {
             "properties": [
+              {
+                "name": "config",
+                "description": "Configure the many options of the `OverlayController`",
+                "type": "Partial<OverlayConfig>"
+              },
               {
                 "name": "interactionMode",
                 "description": "Aligns behavior for 'selectionFollowFocus' and 'navigateWithinInvoker' with\nplatform. When 'auto' (default), platform is automatically detected",
@@ -1654,10 +1816,18 @@
                 "description": "When invoker has focus, up and down arrow keys changes active state of listbox,\nwithout opening overlay.",
                 "type": "Boolean"
               },
+              {
+                "name": "opened",
+                "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+                "type": "boolean"
+              },
               { "name": "singleOption", "type": "boolean" },
               { "name": "slots", "type": "SlotsMap" }
             ],
-            "events": [{ "name": "blur", "type": "Event" }]
+            "events": [
+              { "name": "blur", "type": "Event" },
+              { "name": "opened-changed", "type": "CustomEvent" }
+            ]
           }
         },
         {
@@ -1951,7 +2121,7 @@
         },
         {
           "name": "lion-tooltip",
-          "description": "\n\n---\n",
+          "description": "\n\n---\n\n\n### **Events:**\n - **opened-changed**\n\n### **Methods:**\n - **close()** - Hides the overlay\n- **open()** - Shows the overlay\n- **repositionOverlay()** - Sometimes it's needed to recompute Popper position of an overlay, for instance when we have\nan opened combobox and the surrounding context changes (the space consumed by the textbox\nincreases vertically)\n- **toggle()** - Toggles the overlay\n\n\n",
           "doc-url": "",
           "attributes": [
             {
@@ -1961,11 +2131,21 @@
                 "type": "'label'|'description'",
                 "default": "'description'"
               }
+            },
+            {
+              "name": "opened",
+              "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
-          "events": [],
+          "events": [{ "name": "opened-changed", "type": "CustomEvent" }],
           "js": {
             "properties": [
+              {
+                "name": "config",
+                "description": "Configure the many options of the `OverlayController`",
+                "type": "Partial<OverlayConfig>"
+              },
               {
                 "name": "hasArrow",
                 "description": "Whether an arrow should be displayed",
@@ -1975,9 +2155,14 @@
                 "name": "invokerRelation",
                 "description": "Decides whether the tooltip invoker text should be considered a description\n(sets aria-describedby) or a label (sets aria-labelledby).",
                 "type": "'label'|'description'"
+              },
+              {
+                "name": "opened",
+                "description": "If you add the opened attribute a dialog will be opened on page load. The invoker can be left out\nin case the user does not need to be able to reopen the dialog.",
+                "type": "boolean"
               }
             ],
-            "events": []
+            "events": [{ "name": "opened-changed", "type": "CustomEvent" }]
           }
         },
         {