eslint-plugin-lit/docs/rules/attribute-names.md

lit-html support for ESLint

# Enforces attribute naming conventions

Attributes are always treated lowercase, but it is common to have camelCase
property names. In these situations, an explicit lowercase attribute should
be supplied.

Further, camelCase names should ideally be exposed as kebab-case attributes.

## Rule Details

This rule enforces that all lit properties have equivalent lower case attributes
exposed.

The following patterns are considered warnings:

```ts
// Using decorators:

@property() camelCaseName: string;

// Using a getter:

static get properties() {
  return {
    camelCaseName2: {type: String}
  };
}
```

The following patterns are not warnings:

```ts
@property({attribute: 'camel-case-name'})
camelCaseName: string;

@property({attribute: 'camel-case-other-name'})
camelCaseName: string;

@property()
lower: string;
```

## Options

### `convention`

You can specify a `convention` to enforce a particular naming convention
on element attributes.

The available values are:

- `none` (default, no convention is enforced)
- `kebab`
- `snake`

For example for a property named `camelCaseProp`, expected attribute names are:

| Convention | Attribute            |
|------------|----------------------|
| none       | any lower case value |
| kebab      | camel-case-prop      |
| snake      | camel_case_prop      |

The following patterns are considered warnings with `{"convention": "kebab"}`
specified:

```ts
// Should have an attribute set to `camel-case-name`
@property() camelCaseName: string;

// Attribute should match the property name when a convention is set
@property({attribute: 'camel-case-other-name'})
camelCaseName: string;
```

The following patterns are not warnings with `{"convention": "kebab"}`
specified:

```ts
@property({attribute: 'camel-case-name'})
camelCaseName: string;

@property({attribute: false})
camelCaseName: string;

@property()
lower: string;
```

## When Not To Use It

If you prefer other naming conventions for attributes, this rule should not
be used.