@aquera/nile-elements 1.5.1 → 1.5.3

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent nile-elements following open-wc recommendations",
   "license": "MIT",
   "author": "nile-elements",
-  "version": "1.5.1",
+  "version": "1.5.3",
   "main": "dist/src/index.js",
   "type": "module",
   "module": "dist/src/index.js",

package/rollup.config.js

@@ -21,7 +21,13 @@ export default [
   // ------------------------------------------------------------------------
   {
     input: Object.fromEntries(
-      glob.sync('src/**/*.ts').map(file => [
+      glob.sync('src/**/*.ts', {
+        ignore: [
+          '**/*.test.ts',
+          '**/*.spec.ts',
+          '**/__tests__/**'
+        ]
+      }).map(file => [
         path
           .relative('src', file)
           .slice(0, -path.extname(file).length),

package/src/nile-accordion/nile-accordian.test.ts

@@ -1,120 +1,106 @@
-import { fixture, html, expect, oneEvent, elementUpdated } from '@open-wc/testing';
+import { expect, fixture, html } from '@open-wc/testing';
 import './nile-accordion';
-import { NileAccordion } from './nile-accordion';
-import Sinon from 'sinon';
+import type { NileAccordion } from './nile-accordion';
 
 describe('NileAccordion', () => {
-  it('should render correctly', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    expect(el).to.be.instanceOf(NileAccordion);
-    expect(el.shadowRoot).not.to.be.null;
-    expect(el.summary).to.equal('Test Summary');
-  });
-
-  it('should initialize closed by default', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    expect(el.open).to.be.false;
-    const body = el.shadowRoot?.querySelector<HTMLElement>('.accordian__body');
-    expect(body?.hidden).to.be.true;
-  });
-
-  it('should open when clicked', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-    header.click();
-    await elementUpdated(el);
-    expect(el.open).to.be.true;
-    const body = el.shadowRoot?.querySelector<HTMLElement>('.accordian__body');
-    expect(body?.hidden).to.be.false;
-  });
-
-  it('should emit "nile-show" and "nile-after-show" when opened', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    const showSpy = Sinon.spy(el, 'emit');
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-    setTimeout(() => header.click());
-    await oneEvent(el, 'nile-after-show');
-    expect(showSpy.calledWith('nile-show')).to.be.true;
-    expect(showSpy.calledWith('nile-after-show')).to.be.true;
-  });
-
-  it('should emit "nile-hide" and "nile-after-hide" when closed', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary" open></nile-accordion>`);
-    const hideSpy = Sinon.spy(el, 'emit');
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-    setTimeout(() => header.click());
-    await oneEvent(el, 'nile-after-hide');
-    expect(hideSpy.calledWith('nile-hide')).to.be.true;
-    expect(hideSpy.calledWith('nile-after-hide')).to.be.true;
-  });
-
-  it('should be disabled when the "disabled" property is set', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary" disabled></nile-accordion>`);
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-    header.click();
-    await elementUpdated(el);
-    expect(el.open).to.be.false;
-  });
-
-  it('should handle keyboard interaction (Enter and Space)', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-
-    const enterEvent = new KeyboardEvent('keydown', { key: 'Enter' });
-    header.dispatchEvent(enterEvent);
-    await elementUpdated(el);
-    expect(el.open).to.be.true;
-
-    const spaceEvent = new KeyboardEvent('keydown', { key: ' ' });
-    header.dispatchEvent(spaceEvent);
-    await elementUpdated(el);
-    expect(el.open).to.be.false;
-  });
-
-  it('should handle ArrowUp/ArrowLeft to close and ArrowDown/ArrowRight to open', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-
-    const arrowDownEvent = new KeyboardEvent('keydown', { key: 'ArrowDown' });
-    header.dispatchEvent(arrowDownEvent);
-    await elementUpdated(el);
-    expect(el.open).to.be.true;
-
-    const arrowUpEvent = new KeyboardEvent('keydown', { key: 'ArrowUp' });
-    header.dispatchEvent(arrowUpEvent);
-    await elementUpdated(el);
-    expect(el.open).to.be.false;
-  });
-
-  it('should apply the "variant" class based on the variant property', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary" variant="dark"></nile-accordion>`);
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header');
-    expect(header).to.have.class('accordian__header--dark');
-  });
-
-  it('should apply the correct size class based on the size property', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary" size="lg"></nile-accordion>`);
-    const container = el.shadowRoot?.querySelector<HTMLElement>('.accordian');
-    expect(container).to.have.class('accordian--lg');
-  });
-
-  it('should apply the correct expand icon placement class based on the expandIconPlacement property', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary" expandIconPlacement="left"></nile-accordion>`);
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header');
-    expect(header).to.have.class('accordian__header--arrow-left');
-  });
-
-  it('should animate when opening and closing', async () => {
-    const el = await fixture<NileAccordion>(html`<nile-accordion summary="Test Summary"></nile-accordion>`);
-    const animateSpy = Sinon.spy(el, 'handleOpenChange');
-    const header = el.shadowRoot?.querySelector<HTMLElement>('.accordian__header') as HTMLElement;
-
-    header.click();
-    await elementUpdated(el);
-    expect(animateSpy.called).to.be.true;
-
-    header.click();
-    await elementUpdated(el);
-    expect(animateSpy.calledTwice).to.be.true;
-  });
+  it('1. renders', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el).to.exist; });
+  it('2. shadow root', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot).to.not.be.null; });
+  it('3. is instance', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.tagName.toLowerCase()).to.equal('nile-accordion'); });
+  it('4. open defaults false', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.open).to.be.false; });
+  it('5. variant defaults light', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.variant).to.equal('light'); });
+  it('6. expandIconPlacement defaults right', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.expandIconPlacement).to.equal('right'); });
+  it('7. size defaults md', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.size).to.equal('md'); });
+  it('8. disabled defaults false', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.disabled).to.be.false; });
+  it('9. base part', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[part="base"]')).to.exist; });
+  it('10. accordian class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian')).to.exist; });
+  it('11. header part', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[part="header"]')).to.exist; });
+  it('12. header role button', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[role="button"]')).to.exist; });
+  it('13. body region', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[role="region"]')).to.exist; });
+  it('14. summary slot', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('slot[name="summary"]')).to.exist; });
+  it('15. content slot', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('#content')).to.exist; });
+  it('16. expand-icon slot', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('slot[name="expand-icon"]')).to.exist; });
+  it('17. collapse-icon slot', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('slot[name="collapse-icon"]')).to.exist; });
+  it('18. open reflected', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion open></nile-accordion>`); expect(el.hasAttribute('open')).to.be.true; });
+  it('19. variant reflected', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion variant="dark"></nile-accordion>`); expect(el.getAttribute('variant')).to.equal('dark'); });
+  it('20. size reflected', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion size="sm"></nile-accordion>`); expect(el.getAttribute('size')).to.equal('sm'); });
+  it('21. disabled reflected', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); expect(el.hasAttribute('disabled')).to.be.true; });
+  it('22. open class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion open></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--open')).to.exist; });
+  it('23. disabled class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--disabled')).to.exist; });
+  it('24. sm class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion size="sm"></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--sm')).to.exist; });
+  it('25. md class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--md')).to.exist; });
+  it('26. lg class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion size="lg"></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--lg')).to.exist; });
+  it('27. dark header class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion variant="dark"></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__header--dark')).to.exist; });
+  it('28. left arrow class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion expandIconPlacement="left"></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__header--arrow-left')).to.exist; });
+  it('29. aria-expanded false', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[aria-expanded="false"]')).to.exist; });
+  it('30. aria-expanded true', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion open></nile-accordion>`); expect(el.shadowRoot!.querySelector('[aria-expanded="true"]')).to.exist; });
+  it('31. aria-disabled', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); expect(el.shadowRoot!.querySelector('[aria-disabled="true"]')).to.exist; });
+  it('32. tabindex 0 enabled', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); const h = el.shadowRoot!.querySelector('.accordian__header') as HTMLElement; expect(h.getAttribute('tabindex')).to.equal('0'); });
+  it('33. tabindex -1 disabled', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); const h = el.shadowRoot!.querySelector('.accordian__header') as HTMLElement; expect(h.getAttribute('tabindex')).to.equal('-1'); });
+  it('34. summary text', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion summary="My Title"></nile-accordion>`); const s = el.shadowRoot!.querySelector('[part="summary"]'); expect(s!.textContent).to.contain('My Title'); });
+  it('35. summary settable', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion summary="T"></nile-accordion>`); expect(el.summary).to.equal('T'); });
+  it('36. show method', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.show).to.be.a('function'); });
+  it('37. hide method', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.hide).to.be.a('function'); });
+  it('38. has styles', async () => { expect((await import('./nile-accordion')).NileAccordion.styles).to.exist; });
+  it('39. is defined', async () => { expect(customElements.get('nile-accordion')).to.exist; });
+  it('40. shadow mode', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.mode).to.equal('open'); });
+  it('41. dynamic open', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.open = true; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian--open')).to.exist; });
+  it('42. dynamic disabled', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.disabled = true; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian--disabled')).to.exist; });
+  it('43. dynamic variant', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.variant = 'dark'; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian__header--dark')).to.exist; });
+  it('44. dynamic size', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.size = 'lg'; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian--lg')).to.exist; });
+  it('45. icon in summary', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__summary-icon')).to.exist; });
+  it('46. nile-icon in expand slot', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__summary-icon nile-icon')).to.exist; });
+  it('47. slotted summary', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion><span slot="summary">Custom</span></nile-accordion>`); expect(el.querySelector('[slot="summary"]')).to.exist; });
+  it('48. slotted content', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion open>Content</nile-accordion>`); expect(el.textContent).to.contain('Content'); });
+  it('49. class attr', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion class="a"></nile-accordion>`); expect(el.classList.contains('a')).to.be.true; });
+  it('50. id attr', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion id="a1"></nile-accordion>`); expect(el.id).to.equal('a1'); });
+  it('51. style attr', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion style="color:red"></nile-accordion>`); expect(el.style.color).to.equal('red'); });
+  it('52. data attr', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion data-x="1"></nile-accordion>`); expect(el.getAttribute('data-x')).to.equal('1'); });
+  it('53. dir attr', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion dir="rtl"></nile-accordion>`); expect(el.dir).to.equal('rtl'); });
+  it('54. hidden attr', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion hidden></nile-accordion>`); expect(el.hidden).to.be.true; });
+  it('55. isConnected', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.isConnected).to.be.true; });
+  it('56. removal', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.remove(); expect(el.isConnected).to.be.false; });
+  it('57. outerHTML', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.outerHTML).to.contain('nile-accordion'); });
+  it('58. matches', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion class="x"></nile-accordion>`); expect(el.matches('nile-accordion.x')).to.be.true; });
+  it('59. closest', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.closest('nile-accordion')).to.equal(el); });
+  it('60. cloneNode', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect((el.cloneNode(true) as Element).tagName.toLowerCase()).to.equal('nile-accordion'); });
+  it('61. getBoundingClientRect', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.getBoundingClientRect()).to.exist; });
+  it('62. dispatchEvent', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); let f = false; el.addEventListener('c', () => (f = true)); el.dispatchEvent(new Event('c')); expect(f).to.be.true; });
+  it('63. updateComplete', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); const r = await el.updateComplete; expect(r).to.not.be.undefined; });
+  it('64. requestUpdate', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.requestUpdate(); await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian')).to.exist; });
+  it('65. render method', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.render).to.be.a('function'); });
+  it('66. shadowRoot host', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.host).to.equal(el); });
+  it('67. nodeType', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.nodeType).to.equal(1); });
+  it('68. multiple instances', async () => { const c = await fixture(html`<div><nile-accordion></nile-accordion><nile-accordion></nile-accordion></div>`); expect(c.querySelectorAll('nile-accordion').length).to.equal(2); });
+  it('69. parent-child', async () => { const c = await fixture(html`<div><nile-accordion></nile-accordion></div>`); expect(c.querySelector('nile-accordion')!.parentElement).to.equal(c); });
+  it('70. expandIconPlacement reflected', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion expandIconPlacement="left"></nile-accordion>`); expect(el.getAttribute('expandiconplacement')).to.equal('left'); });
+  it('71. header class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__header')).to.exist; });
+  it('72. body class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__body')).to.exist; });
+  it('73. content class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__content')).to.exist; });
+  it('74. summary class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__summary')).to.exist; });
+  it('75. summary-icon part', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[part="summary-icon"]')).to.exist; });
+  it('76. no open class default', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--open')).to.be.null; });
+  it('77. no disabled class default', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--disabled')).to.be.null; });
+  it('78. aria-controls content', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[aria-controls="content"]')).to.exist; });
+  it('79. aria-labelledby header', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[aria-labelledby="header"]')).to.exist; });
+  it('80. open type boolean', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(typeof el.open).to.equal('boolean'); });
+  it('81. disabled type boolean', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(typeof el.disabled).to.equal('boolean'); });
+  it('82. variant type string', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(typeof el.variant).to.equal('string'); });
+  it('83. size type string', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(typeof el.size).to.equal('string'); });
+  it('84. toggle open off', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion open></nile-accordion>`); el.open = false; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian--open')).to.be.null; });
+  it('85. toggle disabled off', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); el.disabled = false; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian--disabled')).to.be.null; });
+  it('86. classList add', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.classList.add('z'); expect(el.classList.contains('z')).to.be.true; });
+  it('87. dataset', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion data-idx="0"></nile-accordion>`); expect(el.dataset.idx).to.equal('0'); });
+  it('88. hasAttribute', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); expect(el.hasAttribute('disabled')).to.be.true; });
+  it('89. removeAttribute disabled', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion disabled></nile-accordion>`); el.removeAttribute('disabled'); await el.updateComplete; expect(el.disabled).to.be.false; });
+  it('90. setAttribute open', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.setAttribute('open', ''); await el.updateComplete; expect(el.open).to.be.true; });
+  it('91. removeAttribute open', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion open></nile-accordion>`); el.removeAttribute('open'); await el.updateComplete; expect(el.open).to.be.false; });
+  it('92. localName', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.localName).to.equal('nile-accordion'); });
+  it('93. namespaceURI', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.namespaceURI).to.equal('http://www.w3.org/1999/xhtml'); });
+  it('94. ownerDocument', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.ownerDocument).to.equal(document); });
+  it('95. content part', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); expect(el.shadowRoot!.querySelector('[part="content"]')).to.exist; });
+  it('96. left content class', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion expandIconPlacement="left"></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian__content--arrow-left')).to.exist; });
+  it('97. aria-label', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion aria-label="Details"></nile-accordion>`); expect(el.getAttribute('aria-label')).to.equal('Details'); });
+  it('98. multiple re-renders', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion></nile-accordion>`); el.size = 'sm'; await el.updateComplete; el.size = 'lg'; await el.updateComplete; expect(el.shadowRoot!.querySelector('.accordian--lg')).to.exist; });
+  it('99. combined props', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion variant="dark" size="lg" disabled></nile-accordion>`); expect(el.shadowRoot!.querySelector('.accordian--disabled')).to.exist; expect(el.shadowRoot!.querySelector('.accordian--lg')).to.exist; expect(el.shadowRoot!.querySelector('.accordian__header--dark')).to.exist; });
+  it('100. full integration', async () => { const el = await fixture<NileAccordion>(html`<nile-accordion summary="Title" size="md" variant="light" class="acc" id="a1"><p>Content</p></nile-accordion>`); expect(el.summary).to.equal('Title'); expect(el.size).to.equal('md'); expect(el.variant).to.equal('light'); expect(el.id).to.equal('a1'); expect(el.shadowRoot!.querySelector('.accordian')).to.exist; expect(el.shadowRoot!.querySelector('[part="header"]')).to.exist; expect(el.querySelector('p')).to.exist; });
 });

package/src/nile-auto-complete/nile-auto-complete.css.ts

@@ -48,7 +48,7 @@ export const styles = css`
   :host([required]) .nile-auto-complete__label::after {
     content: "*";
     color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));
-    margin-inline-start: -2px;
+    margin-inline-start: 2px;
   }
 `;