https://github.com/advanced-rest-client/api-property-form-item

⛔️ DEPRECATED This component is being deprecated. Use `api-request` instead.
https://github.com/advanced-rest-client/api-property-form-item

deprecated obsolete

Last synced: 9 days ago
JSON representation

⛔️ DEPRECATED This component is being deprecated. Use `api-request` instead.

• Host: GitHub
• URL: https://github.com/advanced-rest-client/api-property-form-item
• Owner: advanced-rest-client
• License: other
• Created: 2018-03-08T06:22:56.000Z (almost 7 years ago)
• Default Branch: stage
• Last Pushed: 2023-01-07T08:43:51.000Z (about 2 years ago)
• Last Synced: 2024-12-21T00:28:03.469Z (about 1 month ago)
• Topics: deprecated, obsolete
• Language: JavaScript
• Homepage:
• Size: 1000 KB
• Stars: 1
• Watchers: 4
• Forks: 0
• Open Issues: 16
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
[![Published on NPM](https://img.shields.io/npm/v/@api-components/api-property-form-item.svg)](https://www.npmjs.com/package/@api-components/api-property-form-item)

[![Build Status](https://travis-ci.org/advanced-rest-client/api-property-form-item.svg?branch=stage)](https://travis-ci.org/advanced-rest-client/api-property-form-item)

## <api-property-form-item>

An input to use with forms to render inputs based in ARC view-model

```html

```

## Deprecation notice

This element is moved to `api-forms` repository and `@api-components/api-forms` package. This element will be deprecated and archived once the migration finish.

## Usage

### Installation

```sh

npm install --save @api-components/api-property-form-item

```

### In an html file

```html

  

    

      import '@api-components/api-property-form-item/api-property-form-item.js';

    

  

  

    

    

    {

      document.querySelector('api-property-form-item').model = {

        schema: {

          inputLabel: 'Enter number value',

          inputType: 'number',

          minimum: 1,

          maximum: 100

        }

      };

    }

    

  

```

### In a LitElement

```js

import { LitElement, html } from 'lit-element';

import '@api-components/api-property-form-item/api-property-form-item.js';

class SampleElement extends PolymerElement {

  render() {

    return html`

    

    `;

  }

  _handleHande(e) {

    this.inputValue = e.target.value;

  }

}

customElements.define('sample-element', SampleElement);

```

### Base styles

The element provides 3 basic styling options:

-   Filled - Material design filled style, default style

-   Outlined - Material design outlined style, use `outlined` property

-   Legacy - Anypoint style, use `legacy` property

```html

```

## Running the demo locally

```sh

npm start

```

## Running the tests

```sh

npm test

```

## API components

This components is a part of [API components ecosystem](https://elements.advancedrestclient.com/)