diff --git a/.changeset/early-houses-punch.md b/.changeset/early-houses-punch.md new file mode 100644 index 000000000..825f267b9 --- /dev/null +++ b/.changeset/early-houses-punch.md @@ -0,0 +1,5 @@ +--- +'@lion/radio-group': minor +--- + +Added types for the radio-group package. diff --git a/.changeset/shaggy-dolls-trade.md b/.changeset/shaggy-dolls-trade.md new file mode 100644 index 000000000..253797d73 --- /dev/null +++ b/.changeset/shaggy-dolls-trade.md @@ -0,0 +1,5 @@ +--- +'@lion/checkbox-group': minor +--- + +Added types for checkbox-group package. diff --git a/.eslintrc.js b/.eslintrc.js index 0f1fa834e..d5293664f 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,6 +1,12 @@ module.exports = { extends: ['@open-wc/eslint-config', 'eslint-config-prettier'].map(require.resolve), overrides: [ + { + files: ['**/*.js'], + rules: { + 'wc/guard-super-call': 'off', // types will prevent you from calling the super if it's not in the base class, making the guard unnecessary + }, + }, { files: [ '**/test-suites/**/*.js', diff --git a/packages/checkbox-group/src/LionCheckbox.js b/packages/checkbox-group/src/LionCheckbox.js index 002c52b9b..0487e9234 100644 --- a/packages/checkbox-group/src/LionCheckbox.js +++ b/packages/checkbox-group/src/LionCheckbox.js @@ -3,7 +3,7 @@ import { ChoiceInputMixin } from '@lion/form-core'; export class LionCheckbox extends ChoiceInputMixin(LionInput) { connectedCallback() { - if (super.connectedCallback) super.connectedCallback(); + super.connectedCallback(); this.type = 'checkbox'; } } diff --git a/packages/checkbox-group/src/LionCheckboxGroup.js b/packages/checkbox-group/src/LionCheckboxGroup.js index 682f7988c..c41919f96 100644 --- a/packages/checkbox-group/src/LionCheckboxGroup.js +++ b/packages/checkbox-group/src/LionCheckboxGroup.js @@ -3,15 +3,15 @@ import { ChoiceGroupMixin, FormGroupMixin } from '@lion/form-core'; /** * A wrapper around multiple checkboxes - * - * @extends {LionFieldset} */ +// @ts-expect-error https://github.com/microsoft/TypeScript/issues/40110 export class LionCheckboxGroup extends ChoiceGroupMixin(FormGroupMixin(LitElement)) { constructor() { super(); this.multipleChoice = true; } + /** @param {import('lit-element').PropertyValues } changedProperties */ updated(changedProperties) { super.updated(changedProperties); if (changedProperties.has('name') && !String(this.name).match(/\[\]$/)) { diff --git a/packages/checkbox-group/test/lion-checkbox-group.test.js b/packages/checkbox-group/test/lion-checkbox-group.test.js index 515c4a973..dddbe47d7 100644 --- a/packages/checkbox-group/test/lion-checkbox-group.test.js +++ b/packages/checkbox-group/test/lion-checkbox-group.test.js @@ -1,8 +1,15 @@ import { localizeTearDown } from '@lion/localize/test-helpers.js'; -import { expect, fixture, html } from '@open-wc/testing'; +import { expect, fixture as _fixture, html } from '@open-wc/testing'; import '../lion-checkbox-group.js'; import '../lion-checkbox.js'; +/** + * @typedef {import('../src/LionCheckboxGroup').LionCheckboxGroup} LionCheckboxGroup + * @typedef {import('lit-html').TemplateResult} TemplateResult + */ + +const fixture = /** @type {(arg: TemplateResult) => Promise} */ (_fixture); + beforeEach(() => { localizeTearDown(); }); diff --git a/packages/radio-group/src/LionRadio.js b/packages/radio-group/src/LionRadio.js index 2e33b5106..0d340701f 100644 --- a/packages/radio-group/src/LionRadio.js +++ b/packages/radio-group/src/LionRadio.js @@ -19,11 +19,10 @@ import { LionInput } from '@lion/input'; * * * @customElement lion-radio - * @extends {LionInput} */ export class LionRadio extends ChoiceInputMixin(LionInput) { connectedCallback() { - if (super.connectedCallback) super.connectedCallback(); + super.connectedCallback(); this.type = 'radio'; } } diff --git a/packages/radio-group/src/LionRadioGroup.js b/packages/radio-group/src/LionRadioGroup.js index 41b229d67..db61cbd14 100644 --- a/packages/radio-group/src/LionRadioGroup.js +++ b/packages/radio-group/src/LionRadioGroup.js @@ -3,12 +3,10 @@ import { ChoiceGroupMixin, FormGroupMixin } from '@lion/form-core'; /** * A wrapper around multiple radios. - * - * @extends {LionFieldset} */ +// @ts-expect-error https://github.com/microsoft/TypeScript/issues/40110 export class LionRadioGroup extends ChoiceGroupMixin(FormGroupMixin(LitElement)) { connectedCallback() { - // eslint-disable-next-line wc/guard-super-call super.connectedCallback(); this.setAttribute('role', 'radiogroup'); } diff --git a/packages/radio-group/test/lion-radio-group.test.js b/packages/radio-group/test/lion-radio-group.test.js index 70059c2c2..edeb85b11 100644 --- a/packages/radio-group/test/lion-radio-group.test.js +++ b/packages/radio-group/test/lion-radio-group.test.js @@ -1,8 +1,15 @@ -import { expect, fixture, html } from '@open-wc/testing'; +import { expect, fixture as _fixture, html } from '@open-wc/testing'; import '../lion-radio-group.js'; import '../lion-radio.js'; +/** + * @typedef {import('../src/LionRadioGroup').LionRadioGroup} LionRadioGroup + * @typedef {import('../src/LionRadio').LionRadio} LionRadio + * @typedef {import('lit-html').TemplateResult} TemplateResult + */ +const fixture = /** @type {(arg: TemplateResult) => Promise} */ (_fixture); + describe('', () => { it('should have role = radiogroup', async () => { const el = await fixture(html` @@ -24,7 +31,7 @@ describe('', () => { el.children[1].focus(); expect(el.touched).to.equal(false, 'initially, touched state is false'); - el.children[1].checked = true; + /** @type {LionRadio} */ (el.children[1]).checked = true; expect(el.touched, `focused via a mouse click, group should be touched`).to.be.true; }); diff --git a/tsconfig.json b/tsconfig.json index a6837781c..eeaeb5502 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -16,17 +16,19 @@ }, "include": [ "packages/accordion/**/*.js", - "packages/core/**/*.js", - "packages/tabs/**/*.js", - "packages/singleton-manager/**/*.js", - "packages/localize/**/*.js", - "packages/form-core/**/*.js", - "packages/overlays/**/*.js", - "packages/tooltip/**/*.js", "packages/button/src/**/*.js", - "packages/listbox/src/*.js", + "packages/checkbox-group/**/*.js", + "packages/core/**/*.js", + "packages/form-core/**/*.js", "packages/input/**/*.js", - "packages/input-amount/**/*.js" + "packages/input-amount/**/*.js", + "packages/listbox/src/*.js", + "packages/localize/**/*.js", + "packages/overlays/**/*.js", + "packages/radio-group/**/*.js", + "packages/singleton-manager/**/*.js", + "packages/tabs/**/*.js", + "packages/tooltip/**/*.js" ], "exclude": [ "node_modules",