All Downloads are FREE. Search and download functionalities are using the official Maven repository.

package.web-types.lit.json Maven / Gradle / Ivy

{
  "$schema": "https://json.schemastore.org/web-types",
  "name": "@vaadin/integer-field",
  "version": "24.4.10",
  "description-markup": "markdown",
  "framework": "lit",
  "framework-config": {
    "enable-when": {
      "node-packages": [
        "lit"
      ]
    }
  },
  "contributions": {
    "html": {
      "elements": [
        {
          "name": "vaadin-integer-field",
          "description": "`` is an input field web component that only accepts entering integer numbers.\n\n```html\n\n```\n\n### Styling\n\n`` provides the same set of shadow DOM parts and state attributes as ``.\nSee [``](https://cdn.vaadin.com/vaadin-web-components/24.4.10/#/elements/vaadin-text-field) for the styling documentation.\n\nIn addition to `` parts, the following parts are available for theming:\n\nPart name         | Description\n------------------|-------------------------\n`increase-button` | Increase (\"plus\") button\n`decrease-button` | Decrease (\"minus\") button\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n\n### Change events\n\nDepending on the nature of the value change that the user attempts to commit e.g. by pressing Enter,\nthe component can fire either a `change` event or an `unparsable-change` event:\n\nValue change             | Event\n:------------------------|:------------------\nempty => parsable        | change\nempty => unparsable      | unparsable-change\nparsable => empty        | change\nparsable => parsable     | change\nparsable => unparsable   | change\nunparsable => empty      | unparsable-change\nunparsable => parsable   | change\nunparsable => unparsable | -\n\nNote, there is currently no way to detect unparsable => unparsable changes because the browser\ndoesn't provide access to unparsable values of native [type=number] inputs.",
          "extension": true,
          "attributes": [
            {
              "name": "?disabled",
              "description": "If true, the user cannot interact with this element.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?autofocus",
              "description": "Specify that this control should have input focus when the page loads.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?invalid",
              "description": "Set to true when the field is invalid.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?required",
              "description": "Specifies that the user must fill in a value.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?clearButtonVisible",
              "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?autoselect",
              "description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?readonly",
              "description": "When present, it specifies that the field is read-only.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "?stepButtonsVisible",
              "description": "Set to true to show increase/decrease buttons.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".label",
              "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".errorMessage",
              "description": "Error to show when the field is invalid.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".helperText",
              "description": "String used for the helper text.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".accessibleName",
              "description": "String used to label the component to screen reader users.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".accessibleNameRef",
              "description": "Id of the element used as label of the component to screen reader users.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".value",
              "description": "The value of the field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".allowedCharPattern",
              "description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".name",
              "description": "The name of this field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".placeholder",
              "description": "A hint to the user of what can be entered in the field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".title",
              "description": "The text usually displayed in a tooltip popup when the mouse is over the field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".autocomplete",
              "description": "Whether the value of the control can be automatically completed by the browser.\nList of available options at:\nhttps://developer.mozilla.org/en/docs/Web/HTML/Element/input#attr-autocomplete",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".autocorrect",
              "description": "This is a property supported by Safari that is used to control whether\nautocorrection should be enabled when the user is entering/editing the text.\nPossible values are:\non: Enable autocorrection.\noff: Disable autocorrection.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".autocapitalize",
              "description": "This is a property supported by Safari and Chrome that is used to control whether\nautocapitalization should be enabled when the user is entering/editing the text.\nPossible values are:\ncharacters: Characters capitalization.\nwords: Words capitalization.\nsentences: Sentences capitalization.\nnone: No capitalization.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".min",
              "description": "The minimum value of the field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".max",
              "description": "The maximum value of the field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": ".step",
              "description": "Specifies the allowed number intervals of the field.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "@validated",
              "description": "Fired whenever the field is validated.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "@change",
              "description": "Fired when the user commits a value change.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "@input",
              "description": "Fired when the value is changed by the user: on every typing keystroke,\nand the value is cleared using the clear button.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "@invalid-changed",
              "description": "Fired when the `invalid` property changes.",
              "value": {
                "kind": "expression"
              }
            },
            {
              "name": "@value-changed",
              "description": "Fired when the `value` property changes.",
              "value": {
                "kind": "expression"
              }
            }
          ]
        }
      ]
    }
  }
}




© 2015 - 2024 Weber Informatics LLC | Privacy Policy