@nysds/nys-accordion 1.12.0 → 1.13.1

package/dist/nys-accordion.js

@@ -8,8 +8,10 @@ var m = Object.defineProperty, c = (d, e, o, l) => {
 };
 let x = 0;
 const p = class p extends _ {
-  // Code NEED this, don't delete this. This is due to how the <nys-accordion> group is applying bordered to each individual <nys-accordionitem>
-  // Lifecycle Methods
+  /**
+   * Lifecycle methods
+   * --------------------------------------------------------------------------
+   */
   constructor() {
     super(), this.id = "", this.heading = "", this.expanded = !1, this.bordered = !1;
   }
@@ -25,7 +27,10 @@ const p = class p extends _ {
   updated(e) {
     e.has("expanded") && this._updateHeight();
   }
-  // Functions
+  /**
+   * Functions
+   * --------------------------------------------------------------------------
+   */
   _generateUniqueId() {
     return `nys-accordionitem-${Date.now()}-${x++}`;
   }
@@ -103,7 +108,10 @@ var b = Object.defineProperty, y = (d, e, o, l) => {
 };
 let w = 0;
 const h = class h extends _ {
-  // Lifecycle Methods
+  /**
+   * Lifecycle methods
+   * --------------------------------------------------------------------------
+   */
   constructor() {
     super(), this.id = "", this.singleSelect = !1, this.bordered = !1;
   }
@@ -113,11 +121,14 @@ const h = class h extends _ {
   updated(e) {
     e.has("bordered") && this._applyBordered();
   }
-  // Functions
+  /**
+   * Functions
+   * --------------------------------------------------------------------------
+   */
   _generateUniqueId() {
-    return `nys-accordionitem-${Date.now()}-${w++}`;
+    return `nys-accordion-${Date.now()}-${w++}`;
   }
-  _getAccordions() {
+  _getAccordionItems() {
     return (this.shadowRoot?.querySelector("slot")?.assignedElements() || []).filter(
       (l) => l.tagName.toLowerCase() === "nys-accordionitem"
     );
@@ -125,12 +136,12 @@ const h = class h extends _ {
   _onAccordionToggle(e) {
     if (!this.singleSelect) return;
     const o = e.detail.id;
-    e.detail.expanded && this._getAccordions().forEach((n) => {
+    e.detail.expanded && this._getAccordionItems().forEach((n) => {
       n.id !== o && n.expanded && (n.expanded = !1);
     });
   }
   _applyBordered() {
-    this._getAccordions().forEach((e) => {
+    this._getAccordionItems().forEach((e) => {
       e.bordered = this.bordered;
     });
   }

package/dist/nys-accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"nys-accordion.js","sources":["../src/nys-accordionitem.ts","../src/nys-accordion.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-accordion.scss?inline\";\n\nlet accordionItemIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysAccordionItem extends LitElement {\n  static styles = unsafeCSS(styles);\n\n  @property({ type: String, reflect: true }) id = \"\";\n  @property({ type: String }) heading = \"\";\n  @property({ type: Boolean, reflect: true }) expanded = false;\n  @property({ type: Boolean, reflect: true }) bordered = false; // Code NEED this, don't delete this. This is due to how the <nys-accordion> group is applying bordered to each individual <nys-accordionitem>\n\n  // Lifecycle Methods\n  constructor() {\n    super();\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    // Generate a unique ID if not provided\n    if (!this.id) {\n      this.id = this._generateUniqueId();\n    }\n  }\n\n  firstUpdated() {\n    const slot = this.shadowRoot?.querySelector(\"slot\");\n\n    /**\n     * When the accordion starts expanded but the slot is empty,\n     * _updateHeight runs too early and calculates height as 0.\n     * Listening for slotchange ensures we recalc after the slot’s\n     * content is rendered so the final height is correct.\n     */\n    if (this.expanded && slot) {\n      slot.addEventListener(\"slotchange\", () => {\n        this._updateHeight();\n      });\n    }\n  }\n\n  updated(changedProperties: Map<string, any>) {\n    if (changedProperties.has(\"expanded\")) {\n      this._updateHeight();\n    }\n  }\n\n  // Functions\n  private _generateUniqueId() {\n    return `nys-accordionitem-${Date.now()}-${accordionItemIdCounter++}`;\n  }\n\n  private _dispatchEvent() {\n    this.dispatchEvent(\n      new CustomEvent(\"nys-accordionitem-toggle\", {\n        detail: { id: this.id, heading: this.heading, expanded: this.expanded },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _handleExpand() {\n    this.expanded = !this.expanded;\n    this._updateHeight();\n    this._dispatchEvent();\n  }\n\n  private _handleKeydown(e: KeyboardEvent) {\n    if (e.key === \" \" || e.key === \"Enter\") {\n      e.preventDefault(); // prevent page scroll on space\n      this._handleExpand();\n    }\n  }\n\n  // Call this after first render and whenever expanded changes\n  @query(\".nys-accordionitem__content\") private _contentContainer!: HTMLElement;\n  private _updateHeight() {\n    if (!this._contentContainer) return;\n\n    if (this.expanded) {\n      // Slide down the content by setting a calculated max-height, depending on the panel's height on different screen sizes\n      const slotHeight = this._contentContainer.scrollHeight;\n      this._contentContainer.style.height = `${slotHeight}px`;\n    } else {\n      // Collapse\n      this._contentContainer.style.height = \"0\";\n      this._contentContainer.style.overflow = \"hidden\";\n    }\n  }\n\n  render() {\n    const contentId = `${this.id}-content`;\n\n    return html`\n    <div class=\"nys-accordionitem\">\n      <button\n        class=\"nys-accordionitem__heading\"\n        type=\"button\"\n        @click=${this._handleExpand}\n        @keydown=${this._handleKeydown}\n        aria-expanded=${this.expanded ? \"true\" : \"false\"}\n        aria-controls=${contentId}\n      >\n        <p class=\"nys-accordionitem__heading-title\">${this.heading}</p>\n        <nys-icon class=\"expand-icon\" name=\"chevron_down\" size=\"24\"></nys-icon>\n      </button>\n      </div>\n      <div id=${contentId} class=\"nys-accordionitem__content ${this.expanded ? \"expanded\" : \"collapsed\"}\" role=\"region\">\n        <div class=\"nys-accordionitem__content-slot-container\">\n          <div class=\"nys-accordionitem__content-slot-container-text\">\n            <slot></slot>\n          </div>\n        </div>\n      </div>\n    </div>`;\n  }\n}\n\nif (!customElements.get(\"nys-accordionitem\")) {\n  customElements.define(\"nys-accordionitem\", NysAccordionItem);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport \"./nys-accordionitem\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-accordion.scss?inline\";\n\nlet accordionIdCounter = 0; // Counter for generating unique IDs\n\n/**\n * The \"nys-accordion\" is the wrapper that groups individual accordion items within it.\n * The items within is called \"nys-accordionitem\"\n */\nexport class NysAccordion extends LitElement {\n  static styles = unsafeCSS(styles);\n\n  @property({ type: String, reflect: true }) id = \"\";\n  @property({ type: Boolean, reflect: true }) singleSelect = false;\n  @property({ type: Boolean, reflect: true }) bordered = false;\n\n  // Lifecycle Methods\n  constructor() {\n    super();\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    // Generate a unique ID if not provided\n    if (!this.id) {\n      this.id = this._generateUniqueId();\n    }\n  }\n\n  updated(changedProperties: Map<string, any>) {\n    if (changedProperties.has(\"bordered\")) {\n      this._applyBordered();\n    }\n  }\n\n  // Functions\n  private _generateUniqueId() {\n    return `nys-accordionitem-${Date.now()}-${accordionIdCounter++}`;\n  }\n\n  private _getAccordions() {\n    const slot = this.shadowRoot?.querySelector(\"slot\");\n    const assigned = slot?.assignedElements() || [];\n\n    return assigned.filter(\n      (el) => el.tagName.toLowerCase() === \"nys-accordionitem\",\n    );\n  }\n\n  private _onAccordionToggle(event: CustomEvent) {\n    if (!this.singleSelect) return;\n\n    const accordionId = event.detail.id;\n    const accordionIsExpanded = event.detail.expanded;\n\n    // All accordions that don't match the selected accordion's id is unexpanded.\n    // If id match, it is up to the individual accordion to handle the expand logic\n    if (accordionIsExpanded) {\n      this._getAccordions().forEach((accordion: any) => {\n        if (accordion.id !== accordionId && accordion.expanded) {\n          accordion.expanded = false;\n        }\n      });\n    }\n  }\n\n  private _applyBordered() {\n    this._getAccordions().forEach((accordion: any) => {\n      accordion.bordered = this.bordered;\n    });\n  }\n\n  render() {\n    return html`<div\n      class=\"nys-accordion\"\n      @nys-accordionitem-toggle=${this._onAccordionToggle}\n    >\n      <slot></slot>\n    </div>`;\n  }\n}\n\nif (!customElements.get(\"nys-accordion\")) {\n  customElements.define(\"nys-accordion\", NysAccordion);\n}\n"],"names":["accordionItemIdCounter","_NysAccordionItem","LitElement","slot","changedProperties","slotHeight","contentId","html","unsafeCSS","styles","NysAccordionItem","__decorateClass","property","query","accordionIdCounter","_NysAccordion","el","event","accordionId","accordion","NysAccordion"],"mappings":"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"}
+{"version":3,"file":"nys-accordion.js","sources":["../src/nys-accordionitem.ts","../src/nys-accordion.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-accordion.scss?inline\";\n\nlet accordionItemIdCounter = 0;\n\n/**\n * A collapsible content panel used within `nys-accordion`. Supports keyboard navigation and smooth animations.\n *\n * Place inside `nys-accordion`. Set `expanded` to open by default. The heading acts as a toggle button\n * accessible via click, Enter, or Space. Parent accordion controls `bordered` and `singleSelect` behavior.\n *\n * @summary Collapsible panel for use within nys-accordion with keyboard support.\n * @element nys-accordionitem\n *\n * @slot - Default slot for panel content shown when expanded.\n *\n * @fires nys-accordionitem-toggle - Fired when expanded state changes. Detail: `{id, heading, expanded}`.\n *\n * @example Expanded item\n * ```html\n * <nys-accordionitem heading=\"How do I apply?\" expanded>\n *   <p>Visit ny.gov and complete the online application.</p>\n * </nys-accordionitem>\n * ```\n */\n\nexport class NysAccordionItem extends LitElement {\n  static styles = unsafeCSS(styles);\n\n  /** Unique identifier. Auto-generated if not provided. */\n  @property({ type: String, reflect: true }) id = \"\";\n\n  /** Heading text displayed in the clickable toggle button. */\n  @property({ type: String }) heading = \"\";\n\n  /** Whether the content panel is visible. Toggle via click or keyboard. */\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /** Adds border styling. Set by parent `nys-accordion`, not directly. */\n  @property({ type: Boolean, reflect: true }) bordered = false;\n\n  /**\n   * Lifecycle methods\n   * --------------------------------------------------------------------------\n   */\n\n  constructor() {\n    super();\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    // Generate a unique ID if not provided\n    if (!this.id) {\n      this.id = this._generateUniqueId();\n    }\n  }\n\n  firstUpdated() {\n    const slot = this.shadowRoot?.querySelector(\"slot\");\n\n    /**\n     * When the accordion starts expanded, but the slot is empty\n     * the _updateHeight() runs too early and calculates height as 0.\n     * Listening for slotchange ensures we recalculate after the slot’s\n     * content is rendered so the final height is correct.\n     */\n    if (this.expanded && slot) {\n      slot.addEventListener(\"slotchange\", () => {\n        this._updateHeight();\n      });\n    }\n  }\n\n  updated(changedProperties: Map<string, any>) {\n    if (changedProperties.has(\"expanded\")) {\n      this._updateHeight();\n    }\n  }\n\n  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\n  private _generateUniqueId() {\n    return `nys-accordionitem-${Date.now()}-${accordionItemIdCounter++}`;\n  }\n\n  private _dispatchEvent() {\n    this.dispatchEvent(\n      new CustomEvent(\"nys-accordionitem-toggle\", {\n        detail: { id: this.id, heading: this.heading, expanded: this.expanded },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _handleExpand() {\n    this.expanded = !this.expanded;\n    this._updateHeight();\n    this._dispatchEvent();\n  }\n\n  private _handleKeydown(e: KeyboardEvent) {\n    if (e.key === \" \" || e.key === \"Enter\") {\n      e.preventDefault(); // prevent page scroll on space\n      this._handleExpand();\n    }\n  }\n\n  // Call this after first render and whenever expanded changes\n  @query(\".nys-accordionitem__content\") private _contentContainer!: HTMLElement;\n  private _updateHeight() {\n    if (!this._contentContainer) return;\n\n    if (this.expanded) {\n      // Slide down the content by setting a calculated max-height, depending on the panel's height on different screen sizes\n      const slotHeight = this._contentContainer.scrollHeight;\n      this._contentContainer.style.height = `${slotHeight}px`;\n    } else {\n      // Collapse\n      this._contentContainer.style.height = \"0\";\n      this._contentContainer.style.overflow = \"hidden\";\n    }\n  }\n\n  render() {\n    const contentId = `${this.id}-content`;\n\n    return html`\n    <div class=\"nys-accordionitem\">\n      <button\n        class=\"nys-accordionitem__heading\"\n        type=\"button\"\n        @click=${this._handleExpand}\n        @keydown=${this._handleKeydown}\n        aria-expanded=${this.expanded ? \"true\" : \"false\"}\n        aria-controls=${contentId}\n      >\n        <p class=\"nys-accordionitem__heading-title\">${this.heading}</p>\n        <nys-icon class=\"expand-icon\" name=\"chevron_down\" size=\"24\"></nys-icon>\n      </button>\n      </div>\n      <div id=${contentId} class=\"nys-accordionitem__content ${this.expanded ? \"expanded\" : \"collapsed\"}\" role=\"region\">\n        <div class=\"nys-accordionitem__content-slot-container\">\n          <div class=\"nys-accordionitem__content-slot-container-text\">\n            <slot></slot>\n          </div>\n        </div>\n      </div>\n    </div>`;\n  }\n}\n\nif (!customElements.get(\"nys-accordionitem\")) {\n  customElements.define(\"nys-accordionitem\", NysAccordionItem);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport \"./nys-accordionitem\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-accordion.scss?inline\";\n\nlet accordionIdCounter = 0;\n\n/**\n * A container for grouping `nys-accordionitem` components with coordinated expand/collapse behavior.\n *\n * Place `nys-accordionitem` elements as children. Set `singleSelect` to allow only one item open at a time.\n * The `bordered` style propagates to all children automatically.\n *\n * @summary Container for accordion items with optional single-select and bordered styling.\n * @element nys-accordion\n *\n * @slot - Default slot for `nys-accordionitem` elements.\n *\n * @example Basic accordion\n * ```html\n * <nys-accordion>\n *   <nys-accordionitem heading=\"Section 1\">Content for section 1</nys-accordionitem>\n *   <nys-accordionitem heading=\"Section 2\">Content for section 2</nys-accordionitem>\n * </nys-accordion>\n * ```\n *\n * @example Single-select accordion\n * ```html\n * <nys-accordion singleSelect bordered>\n *   <nys-accordionitem heading=\"FAQ 1\" expanded>Answer 1</nys-accordionitem>\n *   <nys-accordionitem heading=\"FAQ 2\">Answer 2</nys-accordionitem>\n * </nys-accordion>\n * ```\n */\n\nexport class NysAccordion extends LitElement {\n  static styles = unsafeCSS(styles);\n\n  /** Unique identifier. Auto-generated if not provided. */\n  @property({ type: String, reflect: true }) id = \"\";\n\n  /** Only one item can be expanded at a time. Expanding one collapses others. */\n  @property({ type: Boolean, reflect: true }) singleSelect = false;\n\n  /** Adds borders around each accordion item. Propagates to all children. */\n  @property({ type: Boolean, reflect: true }) bordered = false;\n\n  /**\n   * Lifecycle methods\n   * --------------------------------------------------------------------------\n   */\n\n  constructor() {\n    super();\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    // Generate a unique ID if not provided\n    if (!this.id) {\n      this.id = this._generateUniqueId();\n    }\n  }\n\n  updated(changedProperties: Map<string, any>) {\n    if (changedProperties.has(\"bordered\")) {\n      this._applyBordered();\n    }\n  }\n\n  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\n  private _generateUniqueId() {\n    return `nys-accordion-${Date.now()}-${accordionIdCounter++}`;\n  }\n\n  private _getAccordionItems() {\n    const slot = this.shadowRoot?.querySelector(\"slot\");\n    const assigned = slot?.assignedElements() || [];\n\n    return assigned.filter(\n      (el) => el.tagName.toLowerCase() === \"nys-accordionitem\",\n    );\n  }\n\n  private _onAccordionToggle(event: CustomEvent) {\n    if (!this.singleSelect) return;\n\n    const accordionId = event.detail.id;\n    const accordionIsExpanded = event.detail.expanded;\n\n    // All accordions that don't match the selected accordion's id is unexpanded.\n    // If id match, it is up to the individual accordion to handle the expand logic\n    if (accordionIsExpanded) {\n      this._getAccordionItems().forEach((accordion: any) => {\n        if (accordion.id !== accordionId && accordion.expanded) {\n          accordion.expanded = false;\n        }\n      });\n    }\n  }\n\n  private _applyBordered() {\n    this._getAccordionItems().forEach((accordion: any) => {\n      accordion.bordered = this.bordered;\n    });\n  }\n\n  render() {\n    return html`<div\n      class=\"nys-accordion\"\n      @nys-accordionitem-toggle=${this._onAccordionToggle}\n    >\n      <slot></slot>\n    </div>`;\n  }\n}\n\nif (!customElements.get(\"nys-accordion\")) {\n  customElements.define(\"nys-accordion\", NysAccordion);\n}\n"],"names":["accordionItemIdCounter","_NysAccordionItem","LitElement","slot","changedProperties","slotHeight","contentId","html","unsafeCSS","styles","NysAccordionItem","__decorateClass","property","query","accordionIdCounter","_NysAccordion","el","event","accordionId","accordion","NysAccordion"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nysds/nys-accordion",
-  "version": "1.12.0",
+  "version": "1.13.1",
   "description": "The Accordion component from the NYS Design System.",
   "module": "dist/nys-accordion.js",
   "types": "dist/index.d.ts",
@@ -23,7 +23,7 @@
     "lit-analyze": "lit-analyzer '**/*.ts'"
   },
   "dependencies": {
-    "@nysds/nys-icon": "^1.12.0"
+    "@nysds/nys-icon": "^1.13.1"
   },
   "devDependencies": {
     "lit": "^3.3.1",