@nova-design-system/nova-webcomponents 3.15.0 → 3.16.0

package/dist/cjs/nv-table.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"nv-table.entry.cjs.js","mappings":"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","names":["deepCopyElement","h","excludedProps","Host"],"sources":["src/components/nv-table/nv-table.scss?tag=nv-table","src/components/nv-table/nv-table.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: block;\n}\n\nnv-table {\n  @include root-styles();\n\n  .hidden {\n    display: none;\n  }\n\n  table {\n    border-collapse: collapse;\n    border-color: inherit;\n    text-indent: 0;\n    width: 100%;\n  }\n  th {\n    text-align: left;\n    border-bottom: 1px solid var(--components-datagrid-header-border);\n    height: var(--spacing-12);\n    padding: var(--spacing-3) var(--spacing-4);\n    font-size: var(--font-size-md);\n    font-weight: 700;\n    color: var(--components-datagrid-header-text);\n  }\n  td {\n    border-bottom: 1px solid var(--components-datagrid-body-border);\n    height: var(--spacing-12);\n    max-height: var(--spacing-14);\n    padding: var(--spacing-2) var(--spacing-4);\n    font-size: var(--font-size-md);\n    font-weight: 400;\n    color: var(--components-datagrid-body-text);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n  tbody > tr:hover {\n    background: var(--color-interaction-container-neutral-background-hover);\n  }\n}\n\n// https://tailwindcss.com/docs/table-layout","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n  Component,\n  Host,\n  Prop,\n  State,\n  h,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { ColumnConfig } from '../../interfaces/ColumnConfig';\nimport { deepCopyElement, excludedProps } from '../../utils/dom.utils';\n\n/**\n * Helper interface to define the table structure\n */\ninterface Table {\n  /**\n   * Configuration of the columns of the table\n   */\n  columns: ColumnConfig[];\n\n  /**\n   * Data to be displayed in the table\n   */\n  data: any[];\n}\n\n/**\n * @slot default - Slot for the composed table columns\n * @slot before - Use this slot to insert HTML before the table.\n * @slot after - Use this slot to insert HTML after the table.\n *\n * @deprecated [EXPERIMENTAL]\n * @experimental - This component is used as a base for the nv-datagrid component. Do not use it directly.\n */\n@Component({\n  tag: 'nv-table',\n  styleUrl: 'nv-table.scss',\n  shadow: false,\n})\nexport class NvTable {\n  @Element() el: HTMLNvTableElement;\n\n  private readonly templateCache = new Map<string, Element>();\n  private readonly headerTemplateCache = new Map<string, Element>();\n\n  /****************************************************************************/\n  //#region STATES\n\n  @State()\n  parsedColumns: ColumnConfig[] = [];\n\n  @State()\n  parsedData: any[] = [];\n\n  @State()\n  private table: Table = null;\n\n  //#endregion STATES\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Data to be displayed in the table\n   */\n  @Prop({ reflect: true })\n  readonly data: any[] = [];\n\n  /**\n   * Configuration of the columns of the table\n   */\n  @Prop({ reflect: true })\n  readonly columnsConfig: ColumnConfig[] = [];\n\n  /**\n   * Data to be displayed in the table\n   */\n  @Prop({ reflect: true })\n  readonly dataJson?: string;\n\n  /**\n   * Configuration of the columns of the table\n   */\n  @Prop({ reflect: true })\n  readonly columnsConfigJson?: string;\n\n  /**\n   * Fallback value to be displayed when data is not available\n   */\n  @Prop({ reflect: true })\n  readonly fallbackValue: string = 'N/A';\n\n  /**\n   * Message to be displayed when no data is available\n   */\n  @Prop({ reflect: true })\n  readonly noDataMessage: string = 'No data available';\n\n  /**\n   * The message to display when there are no columns or data available.\n   * @default 'No data or columns available to display.'\n   */\n  @Prop({ reflect: true })\n  readonly noColumnsNoDataMessage: string =\n    'No data or columns available to display.';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Caches templates for cells and headers upfront to improve performance.\n   */\n  private cacheTemplates() {\n    const columns = Array.from(this.el.querySelectorAll('nv-tablecolumn'));\n\n    columns.forEach((col: HTMLNvTablecolumnElement) => {\n      const key = col.name;\n      const cellSlot = col.querySelector('[slot=\"cell\"]');\n\n      if (cellSlot) {\n        const element = deepCopyElement(cellSlot as HTMLElement);\n        this.templateCache.set(key, element);\n      }\n\n      const headerSlot = col.querySelector('[slot=\"header\"]');\n\n      if (headerSlot) {\n        const element = deepCopyElement(headerSlot as HTMLElement);\n        this.headerTemplateCache.set(key, element);\n      } else {\n        const header = col.header;\n\n        if (header) {\n          const headerDiv = document.createElement('div');\n          headerDiv.textContent = header;\n          this.headerTemplateCache.set(key, headerDiv);\n        }\n      }\n    });\n  }\n\n  private parseDataAndColumns() {\n    if (this.dataJson) {\n      this.parseJsonData(this.dataJson);\n    } else if (this.data && this.data.length > 0) {\n      this.parseDataArray(this.data, this.parsedData);\n    }\n\n    if (this.columnsConfigJson) {\n      this.parseJsonColumns(this.columnsConfigJson, this.parsedColumns);\n    } else if (this.columnsConfig && this.columnsConfig.length > 0) {\n      this.parseColumnsArray(this.columnsConfig, this.parsedColumns);\n    } else if (this.headerTemplateCache.size > 0) {\n      const headerKeys = Array.from(this.headerTemplateCache.keys());\n      const arrayColumnsConfig = headerKeys.map<ColumnConfig>(key => ({\n        ...{}, // Ensure no prototype inheritance\n        name: key,\n        header: key ? key.charAt(0).toUpperCase() + key.slice(1) : '',\n      }));\n\n      this.parseColumnsArray(arrayColumnsConfig, this.parsedColumns);\n    } else if (this.parsedData.length > 0) {\n      const firstRow = this.parsedData[0];\n      const arrayColumnsConfig = Object.keys(firstRow).map<ColumnConfig>(\n        key => ({\n          name: key,\n          header: key.charAt(0).toUpperCase() + key.slice(1),\n        }),\n      );\n\n      this.parseColumnsArray(arrayColumnsConfig, this.parsedColumns);\n    }\n  }\n\n  private deepEqual(a: any, b: any): boolean {\n    return JSON.stringify(a) === JSON.stringify(b);\n  }\n\n  /**\n   * Parses the data array and sets the state accordingly\n   * @param {any[]} newValue - New value of the data array\n   * @param {any[]} oldValue - Old value of the data array\n   * @returns {void}\n   */\n  private parseDataArray(newValue: any[], oldValue: any[]) {\n    // Ensure both are arrays for proper comparison\n    const safeNewValue = Array.isArray(newValue) ? newValue : [];\n    const safeOldValue = Array.isArray(oldValue) ? oldValue : [];\n\n    if (this.deepEqual(safeNewValue, safeOldValue)) {\n      return; // Deep comparison\n    }\n\n    this.parsedData = Array.isArray(newValue) ? newValue : [];\n  }\n\n  /**\n   * Parses the columns array and sets the state accordingly\n   * @param {ColumnConfig[]} newValue - New value of the columns array\n   * @param {ColumnConfig[]} oldValue - Old value of the columns array\n   * @returns {void}\n   */\n  private parseColumnsArray(\n    newValue: ColumnConfig[] | null | undefined,\n    oldValue: ColumnConfig[] | null | undefined,\n  ) {\n    // Ensure both are arrays for proper comparison\n    const safeNewValue = Array.isArray(newValue) ? newValue : [];\n    const safeOldValue = Array.isArray(oldValue) ? oldValue : [];\n\n    // Use a proper deep comparison function (e.g., Lodash's isEqual)\n    if (this.deepEqual(safeNewValue, safeOldValue)) {\n      return;\n    }\n\n    // Assign only after confirming changes\n    this.parsedColumns = safeNewValue;\n  }\n\n  private initializeTable() {\n    // Clear the previous table instance (if any)\n    this.table = null;\n\n    if (this.parsedColumns.length > 0) {\n      this.table = {\n        columns: this.parsedColumns,\n        data: this.getTableData(),\n      };\n    } else {\n      this.table = null;\n    }\n  }\n\n  private getTableData(): any[] {\n    if (\n      this.parsedData &&\n      Array.isArray(this.parsedData) &&\n      this.parsedData.length > 0\n    ) {\n      return [...this.parsedData];\n    } else {\n      return [];\n    }\n  }\n\n  // Helper function to get nested property value\n  private replaceKeyWithValue(obj: any, path: string) {\n    return (\n      path\n        .split('.')\n        .reduce(\n          (acc, key) => (acc && acc[key] !== undefined ? acc[key] : undefined),\n          obj,\n        ) ?? this.fallbackValue\n    );\n  }\n\n  private renderTemplate(template: Element | undefined, row: any) {\n    if (!template) {\n      return null;\n    }\n\n    // Handle <template> elements correctly\n    const templateContent =\n      template instanceof HTMLTemplateElement ? template.content : template;\n    const element = deepCopyElement(templateContent as HTMLElement);\n\n    // Replace placeholders in text content, attributes, and properties\n    element.querySelectorAll('*').forEach(el => {\n      // Replace placeholders in text content\n      this.replacePlaceholdersTextContent(el, row);\n\n      // Replace placeholders in attributes\n      this.replacePlaceholdersAttributes(el, row);\n\n      // Replace placeholders in properties\n      this.replacePlaceholdersProperties(el, row);\n    });\n\n    // Handle `data-bind-event`\n    element.querySelectorAll('[data-bind-event]').forEach(el => {\n      const bindEvent = el.getAttribute('data-bind-event') || '';\n      const splitted = bindEvent.split(':');\n\n      if (!bindEvent.includes(':') || splitted.length < 2) {\n        console.warn('Invalid data-bind-event format:', bindEvent);\n        return;\n      }\n\n      const eventType = splitted[0];\n      const keyAction = splitted[1];\n      const details = splitted.length > 2 ? splitted[2] : null;\n\n      el.addEventListener(eventType, () => {\n        const keys = details?.split(',') ?? [];\n\n        // Convert keys into a single object instead of an array of objects\n        const keyValue = keys.reduce((acc, key) => {\n          acc[key] = row?.[key];\n          return acc;\n        }, {} as Record<string, any>);\n\n        const action = { keyAction, details: keyValue };\n\n        this.action.emit(action);\n      });\n    });\n\n    // Ensure Web Components are properly connected\n    setTimeout(() => {\n      element.querySelectorAll('*').forEach(child => {\n        if (typeof (child as any).connectedCallback === 'function') {\n          (child as any).connectedCallback();\n        }\n      });\n    }, 0);\n\n    return (\n      <div\n        ref={el => {\n          if (el) {\n            el.innerHTML = ''; // Remove existing content\n            el.appendChild(element); // Append new element\n          }\n        }}\n      ></div>\n    );\n  }\n\n  private replacePlaceholdersTextContent(element: Element, row: any) {\n    // ✅ Replace placeholders in text content\n    element.childNodes.forEach(node => {\n      if (node.nodeType === Node.TEXT_NODE) {\n        node.textContent = node.textContent.replace(/__([\\w.]+)__/g, (_, key) =>\n          this.replaceKeyWithValue(row, key),\n        );\n      }\n    });\n  }\n\n  private replacePlaceholdersAttributes(element: Element, row: any) {\n    // ✅ Replace placeholders in attributes\n    Array.from(element.attributes).forEach(attr => {\n      if (attr.value.includes('__')) {\n        attr.value = attr.value.replace(/__([\\w.]+)__/g, (_, key) =>\n          this.replaceKeyWithValue(row, key),\n        );\n      }\n    });\n  }\n\n  private replacePlaceholdersProperties(element: Element, row: any) {\n    // ✅ Dynamically extract relevant properties\n    const properties = new Set<string>();\n\n    // Collect only own enumerable properties\n    Object.keys(element).forEach(key => properties.add(key));\n\n    // Collect inherited properties from prototypes (HTMLElement -> Element -> Node)\n    let proto = Object.getPrototypeOf(element);\n    while (proto && proto !== HTMLElement.prototype) {\n      Object.keys(proto).forEach(key => properties.add(key));\n      proto = Object.getPrototypeOf(proto);\n    }\n\n    // ✅ Filter and copy only non-function properties and exclude irrelevant ones\n    properties.forEach(prop => {\n      if (\n        typeof (element as any)[prop] !== 'function' && // Ignore methods\n        !prop.startsWith('on') && // Ignore event listeners (onclick, oninput, etc.)\n        !excludedProps.has(prop) // 🚨 Prevent text duplication and irrelevant props\n      ) {\n        try {\n          const value = element[prop];\n\n          // ✅ Replace placeholders only if the value is a string\n          if (typeof value === 'string' && value.includes('__')) {\n            element[prop] = value.replace(/__([\\w.]+)__/g, (_, key: string) =>\n              this.replaceKeyWithValue(row, key),\n            ) as any; // ✅ TypeScript safe\n          }\n        } catch (error) {\n          console.warn(`Could not assign property ${prop}:`, error.message);\n        }\n      }\n    });\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('columnsConfig')\n  parseColumns(newValue: ColumnConfig[], oldValue: ColumnConfig[]) {\n    this.parseColumnsArray(newValue, oldValue);\n  }\n\n  @Watch('columnsConfigJson')\n  parseJsonColumns(newValue: string | undefined, oldValue: ColumnConfig[]) {\n    try {\n      const newItems = newValue ? JSON.parse(newValue) : [];\n\n      this.parseColumnsArray(newItems, oldValue);\n    } catch (e) {\n      console.error('Invalid JSON format for columnsConfigJson:', e.message);\n      this.parsedColumns = [];\n    }\n  }\n\n  @Watch('data')\n  parseData(newValue: any[], oldValue: any[]) {\n    this.parseDataArray(newValue, oldValue);\n  }\n\n  @Watch('dataJson')\n  parseJsonData(newValue: string | undefined) {\n    try {\n      const newItems = newValue ? JSON.parse(newValue) : [];\n\n      this.parseDataArray(newItems, this.parsedData);\n    } catch (e) {\n      console.error('Invalid JSON format for dataJson:', e.message);\n      this.parsedData = [];\n    }\n  }\n\n  @Watch('parsedColumns')\n  @Watch('parsedData')\n  handleParsedChange() {\n    this.initializeTable();\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.cacheTemplates();\n\n    this.parseDataAndColumns();\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  @Event()\n  action: EventEmitter<{\n    /**\n     * Key action to be performed\n     */\n    keyAction: string;\n\n    /**\n     * Details of the action to be performed\n     */\n    details: any;\n  }>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    const headerGroups =\n      !this.table || this.table === undefined || this.parsedColumns.length === 0\n        ? []\n        : this.table.columns;\n\n    const rows =\n      !this.table || this.table === undefined || this.parsedData.length === 0\n        ? []\n        : this.table.data;\n\n    return (\n      <Host>\n        <div class=\"hidden\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"before\"></slot>\n\n        {this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (\n          <div class=\"no-data\">{this.noColumnsNoDataMessage}</div>\n        ) : (\n          <table class=\"table\">\n            {this.parsedColumns.length > 0 && headerGroups.length > 0 && (\n              <thead class=\"table-header\">\n                <tr>\n                  {headerGroups &&\n                    headerGroups.map(col => {\n                      return (\n                        <th key={col.name}>\n                          {this.renderTemplate(\n                            this.headerTemplateCache.get(col.name),\n                            {},\n                          ) || col.header}\n                        </th>\n                      );\n                    })}\n                </tr>\n              </thead>\n            )}\n            <tbody class=\"table-body\">\n              {!rows || rows.length === 0 ? (\n                <tr>\n                  <td colSpan={headerGroups.length || 12} class=\"no-data\">\n                    {this.noDataMessage}\n                  </td>\n                </tr>\n              ) : (\n                rows.map(row => (\n                  <tr key={JSON.stringify(row)}>\n                    {headerGroups.map(col => (\n                      <td>\n                        {this.renderTemplate(\n                          this.templateCache.get(col.name),\n                          row,\n                        ) ||\n                          (row[col.name] ?? this.fallbackValue)}\n                      </td>\n                    ))}\n                  </tr>\n                ))\n              )}\n            </tbody>\n          </table>\n        )}\n\n        <slot name=\"after\"></slot>\n      </Host>\n    );\n  }\n  // #endregion RENDER\n}\n"],"version":3}
+{"file":"nv-table.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/nv-table/nv-table.utils.ts","src/components/nv-table/styles/nv-table.scss?tag=nv-table","src/components/nv-table/nv-table.tsx"],"sourcesContent":["/**\n * Table utility functions and constants for nv-table component\n *\n * This module contains pure utility functions for table column resizing logic,\n * pointer event handling calculations, and related helper functions.\n */\n\n/**\n * Constants for table column resizing behavior\n */\nexport const TABLE_CONSTANTS = Object.freeze({\n  /** Handle width for fine pointers (mouse) in pixels */\n  HANDLE_W: 12,\n  /** Handle width for coarse pointers (touch) in pixels */\n  HANDLE_W_TOUCH: 24,\n  /** Minimum column width in pixels */\n  MIN_W: 40,\n} as const);\n\n/**\n * Determines the appropriate handle width based on the current pointer type\n * @returns {number} Handle width in pixels (10px for fine pointers, 24px for coarse/touch)\n */\nexport function getHandleWidthForCurrentPointer(): number {\n  // Match the CSS media query: wider handle on coarse pointers (touch)\n  return matchMedia('(pointer: coarse)').matches\n    ? TABLE_CONSTANTS.HANDLE_W_TOUCH\n    : TABLE_CONSTANTS.HANDLE_W;\n}\n\n/**\n * Calculates the pointer's horizontal offset within a table cell\n * @param {PointerEvent} event - The pointer event\n * @param {HTMLTableCellElement} cell - The table cell element\n * @returns {number} The horizontal offset from the left edge of the cell\n */\nexport function getPointerOffsetInCell(\n  event: PointerEvent,\n  cell: HTMLTableCellElement,\n): number {\n  const rect = cell.getBoundingClientRect();\n  return event.clientX - rect.left;\n}\n\n/**\n * Determines if the pointer is within the resize handle area of a table cell\n * @param {number} offsetX - Horizontal offset within the cell\n * @param {number} cellWidth - Total width of the cell\n * @param {number} handleWidth - Width of the resize handle area\n * @returns {boolean} True if the pointer is in the resize handle area\n */\nexport function isInResizeHandle(\n  offsetX: number,\n  cellWidth: number,\n  handleWidth: number,\n): boolean {\n  return offsetX >= cellWidth - handleWidth;\n}\n\n/**\n * Calculates the new column width based on resize delta and constraints\n * @param {number} startWidth - Original width of the column\n * @param {number} delta - Change in pixels from the start position\n * @param {number} minWidth - Minimum allowed width for the column\n * @returns {number} The calculated new width, constrained by minimum\n */\nexport function calculateNewWidth(\n  startWidth: number,\n  delta: number,\n  minWidth: number = TABLE_CONSTANTS.MIN_W,\n): number {\n  return Math.max(minWidth, startWidth + delta);\n}\n\n/**\n * Validates that a table cell element is suitable for resizing\n * @param {HTMLElement | null} element - The element to check\n * @returns {element is HTMLTableCellElement} Type guard for table cell elements\n */\nexport function isValidTableCell(\n  element: HTMLElement | null,\n): element is HTMLTableCellElement {\n  return element?.tagName === 'TH' || element?.tagName === 'TD';\n}\n\n/**\n * Finds the closest table cell element from an event target\n * @param {EventTarget | null} target - The event target\n * @returns {HTMLTableCellElement | null} The closest table cell or null\n */\nexport function getClosestTableCell(\n  target: EventTarget | null,\n): HTMLTableCellElement | null {\n  if (!(target instanceof HTMLElement)) return null;\n\n  const cell = target.closest('th, td') as HTMLTableCellElement | null;\n  return isValidTableCell(cell) ? cell : null;\n}\n\n/**\n * Sets up pointer capture for consistent drag behavior across browsers\n * @param {HTMLTableCellElement} cell - The table cell element\n * @param {number} pointerId - The pointer ID from the pointer event\n * @returns {boolean} True if capture was successfully set\n */\nexport function setPointerCapture(\n  cell: HTMLTableCellElement,\n  pointerId: number,\n): boolean {\n  try {\n    cell.setPointerCapture?.(pointerId);\n    return true;\n  } catch {\n    return false;\n  }\n}\n\n/**\n * Releases pointer capture\n * @param {HTMLTableCellElement} cell - The table cell element\n * @param {number} pointerId - The pointer ID from the pointer event\n * @returns {boolean} True if release was successful\n */\nexport function releasePointerCapture(\n  cell: HTMLTableCellElement,\n  pointerId: number,\n): boolean {\n  try {\n    cell.releasePointerCapture?.(pointerId);\n    return true;\n  } catch {\n    return false;\n  }\n}\n\n/**\n * Prevents text selection during drag operations\n * @param {boolean} prevent - Whether to prevent selection\n */\nexport function setUserSelectPrevention(prevent: boolean): void {\n  document.body.style.userSelect = prevent ? 'none' : '';\n}\n\n/**\n * Gets the current width of a table cell element\n * @param {HTMLTableCellElement} cell - The table cell element\n * @returns {number} The current width in pixels\n */\nexport function getCellWidth(cell: HTMLTableCellElement): number {\n  return cell.offsetWidth;\n}\n\n/**\n * Applies a width to a table cell element\n * @param {HTMLTableCellElement} cell - The table cell element\n * @param {number} width - The width to apply in pixels\n */\nexport function setCellWidth(cell: HTMLTableCellElement, width: number): void {\n  cell.style.width = `${width}px`;\n}\n\n/**\n * Calculates the delta (change) in horizontal position between two pointer events\n * @param {number} currentX - Current clientX position\n * @param {number} startX - Starting clientX position\n * @returns {number} The horizontal delta\n */\nexport function calculatePointerDelta(\n  currentX: number,\n  startX: number,\n): number {\n  return currentX - startX;\n}\n\n/**\n * Interface for resize operation state\n */\nexport interface ResizeState {\n  /** The table cell being resized */\n  resizingCell: HTMLTableCellElement;\n  /** The pointer ID for this resize operation */\n  pointerId: number;\n  /** Starting X coordinate */\n  startX: number;\n  /** Starting width of the cell */\n  startWidth: number;\n}\n\n/**\n * Creates a new resize state object\n * @param {HTMLTableCellElement} cell - The cell being resized\n * @param {PointerEvent} event - The initiating pointer event\n * @returns {ResizeState} A new resize state object\n */\nexport function createResizeState(\n  cell: HTMLTableCellElement,\n  event: PointerEvent,\n): ResizeState {\n  return {\n    resizingCell: cell,\n    pointerId: event.pointerId,\n    startX: event.clientX,\n    startWidth: getCellWidth(cell),\n  };\n}\n\n/**\n * Validates that a resize state is active and matches the given pointer event\n * @param {ResizeState | null} state - The current resize state\n * @param {PointerEvent} event - The pointer event to validate against\n * @returns {boolean} True if the state is valid for this event\n */\nexport function isValidResizeState(\n  state: ResizeState | null,\n  event: PointerEvent,\n): boolean {\n  return state !== null && state.pointerId === event.pointerId;\n}\n\n/**\n * Updates the width of a cell during a resize operation\n * @param {ResizeState} state - The current resize state\n * @param {PointerEvent} event - The current pointer event\n * @param {number} minWidth - Minimum width constraint\n */\nexport function updateCellWidthFromResize(\n  state: ResizeState,\n  event: PointerEvent,\n  minWidth: number = TABLE_CONSTANTS.MIN_W,\n): void {\n  const delta = calculatePointerDelta(event.clientX, state.startX);\n  const newWidth = calculateNewWidth(state.startWidth, delta, minWidth);\n  setCellWidth(state.resizingCell, newWidth);\n}\n","@use \"./mixins\" as *;\n\nnv-table {\n  table {\n    @include table-styles();\n  }\n\n  [data-sticky-left] {\n    @include sticky-styles('left');\n  }\n\n  [data-sticky-right] {\n    @include sticky-styles('right');\n  }\n\n  [data-sticky-top] {\n    th {\n      @include sticky-styles('top');\n    }\n  }\n}\n","/* eslint-disable @stencil-community/prefer-vdom-listener */\n\n// Useful link for styling help ->\n// https://css-tricks.com/complete-guide-table-element/\n\nimport { Component, Host, h, Listen, Element } from '@stencil/core';\nimport {\n  TABLE_CONSTANTS,\n  ResizeState,\n  getHandleWidthForCurrentPointer,\n  getClosestTableCell,\n  getPointerOffsetInCell,\n  isInResizeHandle,\n  createResizeState,\n  isValidResizeState,\n  updateCellWidthFromResize,\n  setPointerCapture,\n  releasePointerCapture,\n  setUserSelectPrevention,\n  getCellWidth,\n} from './nv-table.utils';\n\n/**\n * @slot default - Child content of the component.\n */\n@Component({\n  tag: 'nv-table',\n  styleUrl: 'styles/nv-table.scss',\n  shadow: false,\n})\nexport class NvTable {\n  @Element() host!: HTMLNvTableElement;\n\n  private resizeState: ResizeState | null = null;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LISTENERS\n\n  @Listen('pointerdown')\n  onPointerDown(ev: PointerEvent) {\n    const th = getClosestTableCell(ev.target);\n    if (!th) return;\n\n    // Skip resize if the cell has data-no-resize attribute\n    if (th.hasAttribute('data-no-resize')) return;\n\n    const offsetX = getPointerOffsetInCell(ev, th);\n    const handleWidth = getHandleWidthForCurrentPointer();\n    const cellWidth = getCellWidth(th);\n\n    // Start only if we're in the resize handle area\n    if (!isInResizeHandle(offsetX, cellWidth, handleWidth)) return;\n\n    this.resizeState = createResizeState(th, ev);\n\n    // Capture so move/up still fire even if the finger leaves the th\n    setPointerCapture(th, ev.pointerId);\n\n    // Prevent scrolling/selection during drag\n    setUserSelectPrevention(true);\n  }\n\n  @Listen('pointermove', { target: 'window' })\n  onPointerMove(ev: PointerEvent) {\n    if (!isValidResizeState(this.resizeState, ev)) return;\n\n    updateCellWidthFromResize(this.resizeState!, ev, TABLE_CONSTANTS.MIN_W);\n  }\n\n  @Listen('pointerup', { target: 'window' })\n  @Listen('pointercancel', { target: 'window' })\n  onPointerUp(ev: PointerEvent) {\n    if (!isValidResizeState(this.resizeState, ev)) return;\n\n    releasePointerCapture(\n      this.resizeState!.resizingCell,\n      this.resizeState!.pointerId,\n    );\n    this.resizeState = null;\n    setUserSelectPrevention(false);\n  }\n\n  //#endregion LISTENERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n\n  // #endregion RENDER\n}\n"],"version":3}

package/dist/cjs/nv-toggle.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c56424e5.js');
+const index = require('./index-93d3b2f8.js');
 const clsx = require('./clsx-fc789adc.js');
 const v4 = require('./v4-7014b8b0.js');
 
-const nvToggleCss = "nv-toggle{display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-toggle:not([disabled],[readonly]) input,nv-toggle:not([disabled],[readonly]) label{cursor:pointer}nv-toggle.label-placement-before{flex-direction:row-reverse}nv-toggle[disabled]{opacity:0.5}nv-toggle label{align-self:stretch;color:var(--components-form-text-label-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-toggle label.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-toggle .input-container{position:relative;color:var(--components-form-shape-foreground-default)}nv-toggle .input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--components-form-shape-foreground-disabled)}nv-toggle .input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-toggle-width);height:var(--form-toggle-height);flex-direction:column;align-items:flex-start;border-radius:var(--form-toggle-radius);border-width:var(--form-toggle-border-width);border-style:solid;border-color:var(--components-toggle-border-default);background:var(--components-toggle-background-default)}nv-toggle .input-container input[type=checkbox]::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:25%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:hover{border-color:var(--components-toggle-border-hover)}nv-toggle .input-container input[type=checkbox]:hover::after{background-color:var(--components-toggle-shape-hover)}nv-toggle .input-container input[type=checkbox]:focus{border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:focus::after{background-color:var(--components-toggle-shape-default)}nv-toggle .input-container input[type=checkbox]:focus,nv-toggle .input-container input[type=checkbox]:focus-within{outline:none}nv-toggle .input-container input[type=checkbox]:focus-visible,nv-toggle .input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-toggle .input-container input[type=checkbox]:checked{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:checked::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default-checked);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:75%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:checked:focus{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]){box-shadow:unset;background:var(--components-toggle-background-disabled);border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked{background:var(--components-toggle-background-disabled-checked);border-color:var(--components-toggle-border-disabled-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked::after{background-color:var(--components-toggle-shape-disabled-checked)}nv-toggle .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:450;line-height:var(--form-description-line-height)}nv-toggle .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}";
+const nvToggleCss = "nv-toggle{display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-toggle:not([disabled],[readonly]) input,nv-toggle:not([disabled],[readonly]) label{cursor:pointer}nv-toggle.label-placement-before{flex-direction:row-reverse}nv-toggle[disabled]{opacity:0.5}nv-toggle label{align-self:stretch;color:var(--components-form-text-label-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-label-line-height)}nv-toggle label.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-toggle .input-container{position:relative;color:var(--components-form-shape-foreground-default)}nv-toggle .input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--components-form-shape-foreground-disabled)}nv-toggle .input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-toggle-width);height:var(--form-toggle-height);flex-direction:column;align-items:flex-start;border-radius:var(--form-toggle-radius);border-width:var(--form-toggle-border-width);border-style:solid;border-color:var(--components-toggle-border-default);background:var(--components-toggle-background-default)}nv-toggle .input-container input[type=checkbox]::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:25%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:hover{border-color:var(--components-toggle-border-hover)}nv-toggle .input-container input[type=checkbox]:hover::after{background-color:var(--components-toggle-shape-hover)}nv-toggle .input-container input[type=checkbox]:focus{border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:focus::after{background-color:var(--components-toggle-shape-default)}nv-toggle .input-container input[type=checkbox]:focus,nv-toggle .input-container input[type=checkbox]:focus-within{outline:none}nv-toggle .input-container input[type=checkbox]:focus-visible,nv-toggle .input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-toggle .input-container input[type=checkbox]:checked{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:checked::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default-checked);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:75%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:checked:focus{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]){box-shadow:unset;background:var(--components-toggle-background-disabled);border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked{background:var(--components-toggle-background-disabled-checked);border-color:var(--components-toggle-border-disabled-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked::after{background-color:var(--components-toggle-shape-disabled-checked)}nv-toggle .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:450;line-height:var(--form-description-line-height)}nv-toggle .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}";
 const NvToggleStyle0 = nvToggleCss;
 
 const NvToggle = class {
@@ -66,8 +66,8 @@ const NvToggle = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '0f440b59ac0c32d9abe9577668d7045081819b49', class: clsx.clsx(this.labelPlacement === 'before' && 'label-placement-before') }, index.h("div", { key: '4289435e34eb31a8e59e00cefcba2e17e98bd03a', class: "input-container" }, index.h("input", { key: '1b7d05f77fd32cece9eed2e6cf79c7e2e707f64c', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), index.h("div", { key: '6d78d7e80eb790bbead21bba6108329f9ded3746', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '524a2c2542a45945bddb688c5dff6c9426d58570', htmlFor: this.inputId, class: clsx.clsx(this.hideLabel && 'visually-hidden') }, index.h("slot", { key: '59eda4b826602062620e7167acf3c8de0f77ebef', name: "label" }, this.label))), (this.description ||
-            this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '6e8412879ed60fc6806464432348bd52483e3567', class: "description" }, index.h("slot", { key: '85a876130569a5a4051e271eaf1cf49593a014a6', name: "description" }, this.description))))));
+        return (index.h(index.Host, { key: '65222149af4edb9f8fd2da7efe9a01e15dec4722', class: clsx.clsx(this.labelPlacement === 'before' && 'label-placement-before') }, index.h("div", { key: '7edd5587281b5610269f1ac09826ce379abfae24', class: "input-container" }, index.h("input", { key: '30d3db3cbdc263259a5ba1bf8e637225c4db3b4a', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), index.h("div", { key: 'a8a6d3c2774560b7d43cda75882d90cc564f4c54', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: 'fe980a07df4901081fda42df758236da0b8a11d0', htmlFor: this.inputId, class: clsx.clsx(this.hideLabel && 'visually-hidden') }, index.h("slot", { key: '723cec5914c6c0bed7e14e61e2f64e83c8e8b7b8', name: "label" }, this.label))), (this.description ||
+            this.el.querySelector('[slot="description"]')) && (index.h("div", { key: 'f811065ed06f0816d8f0f1f65d4c659cbde3f683', class: "description" }, index.h("slot", { key: '541946e3f33a315bf667999c30a44fd93fc5f07f', name: "description" }, this.description))))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/nv-toggle.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"nv-toggle.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,WAAW,GAAG,siIAAsiI,CAAC;AAC3jI,uBAAe,WAAW;;MCyBb,QAAQ;IANrB;;;;;;;;;;;QAmBW,YAAO,GAAWA,KAAM,EAAE,CAAC;;;;;QAgC3B,cAAS,GAAY,KAAK,CAAC;;QAWpC,YAAO,GAAY,KAAK,CAAC;;QAIhB,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,aAAQ,GAAY,KAAK,CAAC;KA2FpC;;;;;;;;IArEC,gBAAgB,CAAC,OAAgB;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACnC;;;;;;IAQD,YAAY,CAAC,KAAY;QACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAEhD,IAAI,MAAM,CAAC,IAAI,KAAK,UAAU,IAAI,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC,OAAO,EAAE;YAC5D,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;gBAClC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;SAC/B;KACF;;;;IAMD,MAAM;QACJ,QACEC,QAACC,UAAI,qDACH,KAAK,EAAEC,SAAI,CACT,IAAI,CAAC,cAAc,KAAK,QAAQ,IAAI,wBAAwB,CAC7D,IAEDF,kEAAK,KAAK,EAAC,iBAAiB,IAC1BA,oEACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,OAAO,EAChB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,EAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACvB,CACE,EAENA,kEAAK,KAAK,EAAC,gBAAgB,IACxB,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,MACrDA,oEACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAEE,SAAI,CAAC,IAAI,CAAC,SAAS,IAAI,iBAAiB,CAAC,IAEhDF,mEAAM,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACT,EAEA,CAAC,IAAI,CAAC,WAAW;YAChB,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,sBAAsB,CAAC,MAC7CA,kEAAK,KAAK,EAAC,aAAa,IACtBA,mEAAM,IAAI,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;","names":["uuidv4","h","Host","clsx"],"sources":["src/components/nv-toggle/nv-toggle.scss?tag=nv-toggle","src/components/nv-toggle/nv-toggle.tsx"],"sourcesContent":["@use \"../../styles/utils\" as utils;\n@import \"../../styles/focus-ring\";\n\n@mixin root-styles() {\n  display: inline-flex;\n  align-items: flex-start;\n  gap: var(--form-gap-x);\n  position: relative;\n\n  &:not([disabled], [readonly]) {\n    input,\n    label {\n      cursor: pointer;\n    }\n  }\n}\n\n@mixin label-before-styles() {\n  flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-label-default);\n  font-family: \"TT Norms Pro\", sans-serif;\n  font-size: var(--form-label-font-size);\n  font-style: normal;\n  font-weight: 500;\n  line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-description-default);\n  font-family: \"TT Norms Pro\", sans-serif;\n  font-size: var(--form-description-font-size);\n  font-style: normal;\n  font-weight: 450;\n  line-height: var(--form-description-line-height);\n}\n\n@mixin text-container-styles() {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex: 1 0 0;\n}\n\n@mixin input-container-styles() {\n  position: relative;\n  color: var(--components-form-shape-foreground-default);\n\n  &:has(input[type=\"checkbox\"]:disabled:not([readonly])) {\n    color: var(--components-form-shape-foreground-disabled);\n  }\n}\n\n@mixin input-styles() {\n  appearance: none;\n  position: relative;\n  display: flex;\n  width: var(--form-toggle-width);\n  height: var(--form-toggle-height);\n  flex-direction: column;\n  align-items: flex-start;\n  border-radius: var(--form-toggle-radius);\n  border-width: var(--form-toggle-border-width);\n  border-style: solid;\n  border-color: var(--components-toggle-border-default);\n  background: var(--components-toggle-background-default);\n\n  &::after {\n    content: '';\n    display: block;\n    width: var(--form-toggle-switch-dot-default);\n    height: var(--form-toggle-switch-dot-default);\n    background-color: var(--components-toggle-shape-default);\n    border-radius: var(--radius-rounded-full);\n    position: absolute;\n    top: 50%;\n    left: 25%;\n    transform: translate(-50%, -50%);\n  }\n\n  &:hover {\n    border-color: var(--components-toggle-border-hover);  \n    \n    &::after {\n      background-color: var(--components-toggle-shape-hover);\n    }\n  }\n\n  &:focus {\n    border-color: var(--components-toggle-border-default);\n\n    &::after {\n      background-color: var(--components-toggle-shape-default);\n    }\n  }\n\n  @include focus-ring();\n\n  &:checked {\n    background: var(--components-toggle-background-default-checked);\n    border-color: var(--components-toggle-border-default-checked);\n\n    &::after {\n      content: '';\n      display: block;\n      width: var(--form-toggle-switch-dot-default);\n      height: var(--form-toggle-switch-dot-default);\n      background-color: var(--components-toggle-shape-default-checked);\n      border-radius: var(--radius-rounded-full);\n      position: absolute;\n      top: 50%;\n      left: 75%;\n      transform: translate(-50%, -50%);\n    }\n\n    &:focus {\n      background: var(--components-toggle-background-default-checked);\n      border-color: var(--components-toggle-border-default-checked);\n    }\n  }\n\n  &:disabled:not([readonly]) {\n    box-shadow: unset;\n    background: var(--components-toggle-background-disabled);\n    border-color: var(--components-toggle-border-default);\n\n    &:checked {\n      background: var(--components-toggle-background-disabled-checked);\n      border-color: var(--components-toggle-border-disabled-checked);\n      &::after {\n        background-color: var(--components-toggle-shape-disabled-checked);\n      }\n    }\n  }\n}\n\nnv-toggle {\n  @include root-styles();\n\n  &.label-placement-before {\n    @include label-before-styles();\n  }\n\n  &[disabled] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    // opacity: var(--components-form-opacity-disabled); Error: Invalid value for --components-form-opacity-disabled (expected a <number> but got \"50px\")\n    opacity: 0.5;\n  }\n  label {\n    @include label-styles();\n\n    &.visually-hidden {\n      @include utils.visually-hidden();\n    }\n  }\n\n  .input-container {\n    @include input-container-styles();\n\n    input[type=\"checkbox\"] {\n      @include input-styles();\n    }\n  }\n\n  .description {\n    @include description-styles();\n  }\n\n  .text-container {\n    @include text-container-styles();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\n\n/**\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n */\n@Component({\n  tag: 'nv-toggle',\n  styleUrl: 'nv-toggle.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvToggle {\n  @Element() el!: HTMLNvToggleElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the toggle input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the toggle input, representing the value sent on\n   * form submission when the toggle is checked.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /** The label displayed next to the toggle.*/\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the toggle, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true })\n  readonly labelPlacement: `${LabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * toggle.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /** Indicates whether the toggle is checked or not. */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /** Disables the toggle, preventing user interaction. */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the toggle to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  /**\n   * Listens for the change event on the toggle input element and updates the checked state.\n   * the checked state of the host elements.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly}\n          />\n        </div>\n\n        <div class=\"text-container\">\n          {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n            <label\n              htmlFor={this.inputId}\n              class={clsx(this.hideLabel && 'visually-hidden')}\n            >\n              <slot name=\"label\">{this.label}</slot>\n            </label>\n          )}\n\n          {(this.description ||\n            this.el.querySelector('[slot=\"description\"]')) && (\n            <div class=\"description\">\n              <slot name=\"description\">{this.description}</slot>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"nv-toggle.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,WAAW,GAAG,mpIAAmpI,CAAC;AACxqI,uBAAe,WAAW;;MCyBb,QAAQ;IANrB;;;;;;;;;;;QAmBW,YAAO,GAAWA,KAAM,EAAE,CAAC;;;;;QAgC3B,cAAS,GAAY,KAAK,CAAC;;QAWpC,YAAO,GAAY,KAAK,CAAC;;QAIhB,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,aAAQ,GAAY,KAAK,CAAC;KA2FpC;;;;;;;;IArEC,gBAAgB,CAAC,OAAgB;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACnC;;;;;;IAQD,YAAY,CAAC,KAAY;QACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAEhD,IAAI,MAAM,CAAC,IAAI,KAAK,UAAU,IAAI,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC,OAAO,EAAE;YAC5D,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;gBAClC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;SAC/B;KACF;;;;IAMD,MAAM;QACJ,QACEC,QAACC,UAAI,qDACH,KAAK,EAAEC,SAAI,CACT,IAAI,CAAC,cAAc,KAAK,QAAQ,IAAI,wBAAwB,CAC7D,IAEDF,kEAAK,KAAK,EAAC,iBAAiB,IAC1BA,oEACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,OAAO,EAChB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,EAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACvB,CACE,EAENA,kEAAK,KAAK,EAAC,gBAAgB,IACxB,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,MACrDA,oEACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAEE,SAAI,CAAC,IAAI,CAAC,SAAS,IAAI,iBAAiB,CAAC,IAEhDF,mEAAM,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACT,EAEA,CAAC,IAAI,CAAC,WAAW;YAChB,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,sBAAsB,CAAC,MAC7CA,kEAAK,KAAK,EAAC,aAAa,IACtBA,mEAAM,IAAI,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;","names":["uuidv4","h","Host","clsx"],"sources":["src/components/nv-toggle/nv-toggle.scss?tag=nv-toggle","src/components/nv-toggle/nv-toggle.tsx"],"sourcesContent":["@use \"../../styles/utils\" as utils;\n@import \"../../styles/focus-ring\";\n\n@mixin root-styles() {\n  display: inline-flex;\n  align-items: flex-start;\n  gap: var(--form-gap-x);\n  position: relative;\n\n  &:not([disabled], [readonly]) {\n    input,\n    label {\n      cursor: pointer;\n    }\n  }\n}\n\n@mixin label-before-styles() {\n  flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-label-default);\n  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;\n  font-size: var(--form-label-font-size);\n  font-style: normal;\n  font-weight: var(--font-weight-medium-emphasis);\n  line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-description-default);\n  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;\n  font-size: var(--form-description-font-size);\n  font-style: normal;\n  font-weight: 450;\n  line-height: var(--form-description-line-height);\n}\n\n@mixin text-container-styles() {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex: 1 0 0;\n}\n\n@mixin input-container-styles() {\n  position: relative;\n  color: var(--components-form-shape-foreground-default);\n\n  &:has(input[type=\"checkbox\"]:disabled:not([readonly])) {\n    color: var(--components-form-shape-foreground-disabled);\n  }\n}\n\n@mixin input-styles() {\n  appearance: none;\n  position: relative;\n  display: flex;\n  width: var(--form-toggle-width);\n  height: var(--form-toggle-height);\n  flex-direction: column;\n  align-items: flex-start;\n  border-radius: var(--form-toggle-radius);\n  border-width: var(--form-toggle-border-width);\n  border-style: solid;\n  border-color: var(--components-toggle-border-default);\n  background: var(--components-toggle-background-default);\n\n  &::after {\n    content: '';\n    display: block;\n    width: var(--form-toggle-switch-dot-default);\n    height: var(--form-toggle-switch-dot-default);\n    background-color: var(--components-toggle-shape-default);\n    border-radius: var(--radius-rounded-full);\n    position: absolute;\n    top: 50%;\n    left: 25%;\n    transform: translate(-50%, -50%);\n  }\n\n  &:hover {\n    border-color: var(--components-toggle-border-hover);  \n    \n    &::after {\n      background-color: var(--components-toggle-shape-hover);\n    }\n  }\n\n  &:focus {\n    border-color: var(--components-toggle-border-default);\n\n    &::after {\n      background-color: var(--components-toggle-shape-default);\n    }\n  }\n\n  @include focus-ring();\n\n  &:checked {\n    background: var(--components-toggle-background-default-checked);\n    border-color: var(--components-toggle-border-default-checked);\n\n    &::after {\n      content: '';\n      display: block;\n      width: var(--form-toggle-switch-dot-default);\n      height: var(--form-toggle-switch-dot-default);\n      background-color: var(--components-toggle-shape-default-checked);\n      border-radius: var(--radius-rounded-full);\n      position: absolute;\n      top: 50%;\n      left: 75%;\n      transform: translate(-50%, -50%);\n    }\n\n    &:focus {\n      background: var(--components-toggle-background-default-checked);\n      border-color: var(--components-toggle-border-default-checked);\n    }\n  }\n\n  &:disabled:not([readonly]) {\n    box-shadow: unset;\n    background: var(--components-toggle-background-disabled);\n    border-color: var(--components-toggle-border-default);\n\n    &:checked {\n      background: var(--components-toggle-background-disabled-checked);\n      border-color: var(--components-toggle-border-disabled-checked);\n      &::after {\n        background-color: var(--components-toggle-shape-disabled-checked);\n      }\n    }\n  }\n}\n\nnv-toggle {\n  @include root-styles();\n\n  &.label-placement-before {\n    @include label-before-styles();\n  }\n\n  &[disabled] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    // opacity: var(--components-form-opacity-disabled); Error: Invalid value for --components-form-opacity-disabled (expected a <number> but got \"50px\")\n    opacity: 0.5;\n  }\n  label {\n    @include label-styles();\n\n    &.visually-hidden {\n      @include utils.visually-hidden();\n    }\n  }\n\n  .input-container {\n    @include input-container-styles();\n\n    input[type=\"checkbox\"] {\n      @include input-styles();\n    }\n  }\n\n  .description {\n    @include description-styles();\n  }\n\n  .text-container {\n    @include text-container-styles();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\n\n/**\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n */\n@Component({\n  tag: 'nv-toggle',\n  styleUrl: 'nv-toggle.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvToggle {\n  @Element() el!: HTMLNvToggleElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the toggle input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the toggle input, representing the value sent on\n   * form submission when the toggle is checked.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /** The label displayed next to the toggle.*/\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the toggle, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true })\n  readonly labelPlacement: `${LabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * toggle.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /** Indicates whether the toggle is checked or not. */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /** Disables the toggle, preventing user interaction. */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the toggle to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  /**\n   * Listens for the change event on the toggle input element and updates the checked state.\n   * the checked state of the host elements.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly}\n          />\n        </div>\n\n        <div class=\"text-container\">\n          {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n            <label\n              htmlFor={this.inputId}\n              class={clsx(this.hideLabel && 'visually-hidden')}\n            >\n              <slot name=\"label\">{this.label}</slot>\n            </label>\n          )}\n\n          {(this.description ||\n            this.el.querySelector('[slot=\"description\"]')) && (\n            <div class=\"description\">\n              <slot name=\"description\">{this.description}</slot>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/cjs/nv-togglebutton.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c56424e5.js');
+const index = require('./index-93d3b2f8.js');
 
 const nvTogglebuttonCss = "nv-togglebutton{display:inline-flex;justify-content:center;align-items:center}nv-togglebutton:focus-visible,nv-togglebutton:has(:focus-visible){z-index:1}nv-togglebutton[size=xs]{padding:var(--button-xs-padding-y) var(--button-xs-padding-x);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size);padding-top:calc(var(--togglegroup-xs-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-xs-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-xs-button-radius));border-width:0}nv-togglebutton[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-togglebutton[size=sm]{padding:var(--button-sm-padding-y) var(--button-sm-padding-x);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size);padding-top:calc(var(--togglegroup-sm-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-sm-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-sm-button-radius));border-width:0}nv-togglebutton[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-togglebutton[size=md]{padding:var(--button-md-padding-y) var(--button-md-padding-x);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size);padding-top:calc(var(--togglegroup-md-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-md-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-md-button-radius));border-width:0}nv-togglebutton[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-togglebutton[size=lg]{padding:var(--button-lg-padding-y) var(--button-lg-padding-x);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size);padding-top:calc(var(--togglegroup-lg-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-lg-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-lg-button-radius));border-width:0}nv-togglebutton[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-togglebutton[emphasis=high]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-togglebutton[emphasis=high]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-togglebutton[emphasis=high]:active{background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-togglebutton[emphasis=high]:focus,nv-togglebutton[emphasis=high]:focus-within{outline:none}nv-togglebutton[emphasis=high]:focus-visible,nv-togglebutton[emphasis=high]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-togglebutton[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=high][active]:not([active=false]){background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-togglebutton[emphasis=low]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-togglebutton[emphasis=low]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-togglebutton[emphasis=low]:focus,nv-togglebutton[emphasis=low]:focus-within{outline:none}nv-togglebutton[emphasis=low]:focus-visible,nv-togglebutton[emphasis=low]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-togglebutton[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=low][active]:not([active=false]),nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}";
 const NvTogglebuttonStyle0 = nvTogglebuttonCss;
@@ -48,7 +48,7 @@ const NvTogglebutton = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'b9e37fc1cb34272bca476c7b61db173ab2a9d238', role: "button", tabindex: "0", "aria-pressed": String(this.active), onClick: this.handleClick }, index.h("slot", { key: 'cf9cf3445fd93873def1f9fa9cbec46c35600025' })));
+        return (index.h(index.Host, { key: 'c4b698b1fb80f0dcca5d7a77bc20d22db1cbf538', role: "button", tabindex: "0", "aria-pressed": String(this.active), onClick: this.handleClick }, index.h("slot", { key: '605385f07f32b989685983cfd1a082525741fba4' })));
     }
 };
 NvTogglebutton.style = NvTogglebuttonStyle0;

package/dist/cjs/nv-togglebuttongroup.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c56424e5.js');
+const index = require('./index-93d3b2f8.js');
 
 const nvTogglebuttongroupCss = "nv-togglebuttongroup{display:flex;gap:var(--togglegroup-lg-gap);border-radius:var(--togglegroup-lg-radius);width:fit-content;padding:var(--togglegroup-lg-gap)}nv-togglebuttongroup[emphasis=high]{border:1px solid var(--components-togglegroup-high-border)}nv-togglebuttongroup[emphasis=low]{border:1px solid var(--components-togglegroup-low-border)}nv-togglebuttongroup[size=xs]{padding:calc(var(--togglegroup-xs-padding) - 1px);gap:var(--togglegroup-xs-gap);border-radius:var(--togglegroup-xs-radius)}nv-togglebuttongroup[size=sm]{padding:calc(var(--togglegroup-sm-padding) - 1px);gap:var(--togglegroup-sm-gap);border-radius:var(--togglegroup-sm-radius)}nv-togglebuttongroup[size=md]{padding:calc(var(--togglegroup-md-padding) - 1px);gap:var(--togglegroup-md-gap);border-radius:var(--togglegroup-md-radius)}nv-togglebuttongroup[size=lg]{padding:calc(var(--togglegroup-lg-padding) - 1px);gap:var(--togglegroup-lg-gap);border-radius:var(--togglegroup-lg-radius)}";
 const NvTogglebuttongroupStyle0 = nvTogglebuttongroupCss;
@@ -156,7 +156,7 @@ const NvTogglebuttongroup = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'edb5b3bb7651b482cd02625038e36cdb35743453' }, index.h("slot", { key: '2b0bc4891b885ecf7febdce7062fc02b120ec939' })));
+        return (index.h(index.Host, { key: 'ab91ff1817e3388508ed1da7a9ed57a79cf8c4bc' }, index.h("slot", { key: '4a3280db78c1f0cd120a0cb32d95eabaf69995a6' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/nv-togglebuttongroup.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"nv-togglebuttongroup.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/nv-togglebuttongroup/styles/nv-togglebuttongroup.scss?tag=nv-togglebuttongroup","src/components/nv-togglebuttongroup/nv-togglebuttongroup.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\nnv-togglebuttongroup {\n  @include root-styles();\n\n  &[emphasis=\"high\"] {\n    @include high-emphasis-styles();\n  }\n  &[emphasis=\"low\"] {\n    @include low-emphasis-styles();\n  }\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n      @include size-styles($size);\n      \n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Listen,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { ToggleButtonEmphasis, ToggleButtonSize } from '../../utils/constants';\n\n/**\n * @deprecated [EXPERIMENTAL]\n * @experimental This component is still in development and subject to change in future releases.\n * @slot default - Child content of the component, pass the nv-togglebutton components here.\n */\n@Component({\n  tag: 'nv-togglebuttongroup',\n  styleUrl: 'styles/nv-togglebuttongroup.scss',\n  shadow: false,\n})\nexport class NvTogglebuttongroup {\n  @Element() el!: HTMLNvTogglebuttongroupElement;\n  private mutationObserver: MutationObserver;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * The active toggle buttons in the group. Is an array of one string when in\n   * exclusive mode, and an array of strings when in non-exclusive mode.\n   */\n  @Prop({ reflect: false, mutable: true })\n  value: string[];\n\n  /**\n   * Activates single-selection mode so only one button can be active at a time.\n   */\n  @Prop({ reflect: true })\n  readonly exclusive: boolean = false;\n\n  /**\n   * Ensures at least one toggle stays selected at all times.\n   */\n  @Prop({ reflect: true })\n  readonly enforceValue: boolean = false;\n\n  /**\n   * Make it more or less visually prominent to users.\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ToggleButtonEmphasis}` = 'high';\n\n  /**\n   * Determines how large or small the togglebutton appears, allowing for\n   * customization of the togglebutton's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ToggleButtonSize}` = 'md';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Sets the active state of all toggle buttons depending on the value of the\n   * group.\n   */\n  private setActiveToggleButtons = () => {\n    this.el.querySelectorAll('nv-togglebutton').forEach(toggleButtonEl => {\n      const btn = NvTogglebuttongroup.asToggleButton(toggleButtonEl);\n      if (!btn) return;\n      btn.active = (this.value ?? []).includes(btn.value);\n    });\n  };\n\n  /**\n   * Sets the emphasis of all toggle buttons to the same value.\n   */\n  private setEmphasisToggleButtons = () => {\n    this.el.querySelectorAll('nv-togglebutton').forEach(toggleButtonEl => {\n      const btn = NvTogglebuttongroup.asToggleButton(toggleButtonEl);\n      if (!btn) return;\n      btn.emphasis = this.emphasis;\n    });\n  };\n\n  /**\n   * Sets the size of all toggle buttons to the same value.\n   */\n  private setSizeToggleButtons = () => {\n    this.el.querySelectorAll('nv-togglebutton').forEach(toggleButtonEl => {\n      const btn = NvTogglebuttongroup.asToggleButton(toggleButtonEl);\n      if (!btn) return;\n      btn.size = this.size;\n    });\n  };\n\n  /**\n   * Sets up the MutationObserver to watch for changes in child elements\n   */\n  private setupMutationObserver = (): void => {\n    this.mutationObserver = new MutationObserver(mutations => {\n      mutations.forEach(mutation => {\n        if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {\n          this.setEmphasisToggleButtons();\n          this.setSizeToggleButtons();\n        }\n      });\n    });\n\n    this.mutationObserver.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  };\n\n  /**\n   * Narrow Type used locally to interact with nv-togglebutton child elements.\n   * @param {Element} element - The element to check.\n   * @returns {(HTMLElement & {\n   *   active: boolean;\n   *   value: string;\n   *   emphasis: `${ToggleButtonEmphasis}`;\n   *   size: `${ToggleButtonSize}`;\n   * }) | null} The element as a toggle button, or null if it is not a toggle button.\n   */\n  private static asToggleButton(element: Element):\n    | (HTMLElement & {\n        /**\n         * Whether the button is active or not. Will not toggle automatically but\n         * needs to be controlled externally.\n         */\n        active: boolean;\n        /**\n         * The value to associated with the button when selected in a\n         * Togglebuttongroup.\n         */\n        value: string;\n        /**\n         * Make it more or less visually prominent to users.\n         */\n        emphasis: `${ToggleButtonEmphasis}`;\n        /**\n         * Determines how large or small the togglebutton appears, allowing for\n         * customization of the togglebutton's dimensions to fit different design\n         * specifications and user needs.\n         */\n        size: `${ToggleButtonSize}`;\n      })\n    | null {\n    return element instanceof HTMLElement\n      ? (element as unknown as HTMLElement & {\n          /**\n           * Whether the button is active or not. Will not toggle automatically but\n           * needs to be controlled externally.\n           */\n          active: boolean;\n          /**\n           * The value to associated with the button when selected in a\n           * Togglebuttongroup.\n           */\n          value: string;\n          /**\n           * Make it more or less visually prominent to users.\n           */\n          emphasis: `${ToggleButtonEmphasis}`;\n          /**\n           * Determines how large or small the togglebutton appears, allowing for\n           * customization of the togglebutton's dimensions to fit different design\n           * specifications and user needs.\n           */\n          size: `${ToggleButtonSize}`;\n        })\n      : null;\n  }\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('value')\n  onValueChanged(newValue: typeof this.value) {\n    this.setActiveToggleButtons();\n    this.valueChanged.emit(newValue);\n  }\n\n  @Watch('emphasis')\n  onEmphasisChanged() {\n    this.setEmphasisToggleButtons();\n  }\n\n  @Watch('size')\n  onSizeChanged() {\n    this.setSizeToggleButtons();\n  }\n\n  @Listen('toggled')\n  onToggled(event: CustomEvent<HTMLNvTogglebuttonElementEventMap['toggled']>) {\n    const valueSet = new Set(this.value);\n\n    if (this.exclusive && this.enforceValue) {\n      this.value = [event.detail.value];\n      return;\n    }\n\n    if (this.exclusive) {\n      if (valueSet.has(event.detail.value)) {\n        this.value = [];\n      } else {\n        this.value = [event.detail.value];\n      }\n      return;\n    }\n\n    toggle: if (event.detail.active) {\n      if (this.enforceValue && valueSet.size === 1) break toggle;\n      valueSet.delete(event.detail.value);\n    } else {\n      valueSet.add(event.detail.value);\n    }\n    this.value = [...valueSet];\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.setActiveToggleButtons();\n    this.setEmphasisToggleButtons();\n    this.setSizeToggleButtons();\n    this.setupMutationObserver();\n  }\n\n  disconnectedCallback() {\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the selected toggle buttons change.\n   * @bind value\n   */\n  @Event()\n  valueChanged: EventEmitter<string[]>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n\n  // #endregion RENDER\n}\n"],"version":3}
+{"file":"nv-togglebuttongroup.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/nv-togglebuttongroup/styles/nv-togglebuttongroup.scss?tag=nv-togglebuttongroup","src/components/nv-togglebuttongroup/nv-togglebuttongroup.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\nnv-togglebuttongroup {\n  @include root-styles();\n\n  &[emphasis=\"high\"] {\n    @include high-emphasis-styles();\n  }\n  &[emphasis=\"low\"] {\n    @include low-emphasis-styles();\n  }\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n      @include size-styles($size);\n      \n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Listen,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { ToggleButtonEmphasis, ToggleButtonSize } from '../../utils/constants';\n\n/**\n * @slot default - Child content of the component, pass the nv-togglebutton components here.\n */\n@Component({\n  tag: 'nv-togglebuttongroup',\n  styleUrl: 'styles/nv-togglebuttongroup.scss',\n  shadow: false,\n})\nexport class NvTogglebuttongroup {\n  @Element() el!: HTMLNvTogglebuttongroupElement;\n  private mutationObserver: MutationObserver;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * The active toggle buttons in the group. Is an array of one string when in\n   * exclusive mode, and an array of strings when in non-exclusive mode.\n   */\n  @Prop({ reflect: false, mutable: true })\n  value: string[];\n\n  /**\n   * Activates single-selection mode so only one button can be active at a time.\n   */\n  @Prop({ reflect: true })\n  readonly exclusive: boolean = false;\n\n  /**\n   * Ensures at least one toggle stays selected at all times.\n   */\n  @Prop({ reflect: true })\n  readonly enforceValue: boolean = false;\n\n  /**\n   * Make it more or less visually prominent to users.\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ToggleButtonEmphasis}` = 'high';\n\n  /**\n   * Determines how large or small the togglebutton appears, allowing for\n   * customization of the togglebutton's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ToggleButtonSize}` = 'md';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Sets the active state of all toggle buttons depending on the value of the\n   * group.\n   */\n  private setActiveToggleButtons = () => {\n    this.el.querySelectorAll('nv-togglebutton').forEach(toggleButtonEl => {\n      const btn = NvTogglebuttongroup.asToggleButton(toggleButtonEl);\n      if (!btn) return;\n      btn.active = (this.value ?? []).includes(btn.value);\n    });\n  };\n\n  /**\n   * Sets the emphasis of all toggle buttons to the same value.\n   */\n  private setEmphasisToggleButtons = () => {\n    this.el.querySelectorAll('nv-togglebutton').forEach(toggleButtonEl => {\n      const btn = NvTogglebuttongroup.asToggleButton(toggleButtonEl);\n      if (!btn) return;\n      btn.emphasis = this.emphasis;\n    });\n  };\n\n  /**\n   * Sets the size of all toggle buttons to the same value.\n   */\n  private setSizeToggleButtons = () => {\n    this.el.querySelectorAll('nv-togglebutton').forEach(toggleButtonEl => {\n      const btn = NvTogglebuttongroup.asToggleButton(toggleButtonEl);\n      if (!btn) return;\n      btn.size = this.size;\n    });\n  };\n\n  /**\n   * Sets up the MutationObserver to watch for changes in child elements\n   */\n  private setupMutationObserver = (): void => {\n    this.mutationObserver = new MutationObserver(mutations => {\n      mutations.forEach(mutation => {\n        if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {\n          this.setEmphasisToggleButtons();\n          this.setSizeToggleButtons();\n        }\n      });\n    });\n\n    this.mutationObserver.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  };\n\n  /**\n   * Narrow Type used locally to interact with nv-togglebutton child elements.\n   * @param {Element} element - The element to check.\n   * @returns {(HTMLElement & {\n   *   active: boolean;\n   *   value: string;\n   *   emphasis: `${ToggleButtonEmphasis}`;\n   *   size: `${ToggleButtonSize}`;\n   * }) | null} The element as a toggle button, or null if it is not a toggle button.\n   */\n  private static asToggleButton(element: Element):\n    | (HTMLElement & {\n        /**\n         * Whether the button is active or not. Will not toggle automatically but\n         * needs to be controlled externally.\n         */\n        active: boolean;\n        /**\n         * The value to associated with the button when selected in a\n         * Togglebuttongroup.\n         */\n        value: string;\n        /**\n         * Make it more or less visually prominent to users.\n         */\n        emphasis: `${ToggleButtonEmphasis}`;\n        /**\n         * Determines how large or small the togglebutton appears, allowing for\n         * customization of the togglebutton's dimensions to fit different design\n         * specifications and user needs.\n         */\n        size: `${ToggleButtonSize}`;\n      })\n    | null {\n    return element instanceof HTMLElement\n      ? (element as unknown as HTMLElement & {\n          /**\n           * Whether the button is active or not. Will not toggle automatically but\n           * needs to be controlled externally.\n           */\n          active: boolean;\n          /**\n           * The value to associated with the button when selected in a\n           * Togglebuttongroup.\n           */\n          value: string;\n          /**\n           * Make it more or less visually prominent to users.\n           */\n          emphasis: `${ToggleButtonEmphasis}`;\n          /**\n           * Determines how large or small the togglebutton appears, allowing for\n           * customization of the togglebutton's dimensions to fit different design\n           * specifications and user needs.\n           */\n          size: `${ToggleButtonSize}`;\n        })\n      : null;\n  }\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('value')\n  onValueChanged(newValue: typeof this.value) {\n    this.setActiveToggleButtons();\n    this.valueChanged.emit(newValue);\n  }\n\n  @Watch('emphasis')\n  onEmphasisChanged() {\n    this.setEmphasisToggleButtons();\n  }\n\n  @Watch('size')\n  onSizeChanged() {\n    this.setSizeToggleButtons();\n  }\n\n  @Listen('toggled')\n  onToggled(event: CustomEvent<HTMLNvTogglebuttonElementEventMap['toggled']>) {\n    const valueSet = new Set(this.value);\n\n    if (this.exclusive && this.enforceValue) {\n      this.value = [event.detail.value];\n      return;\n    }\n\n    if (this.exclusive) {\n      if (valueSet.has(event.detail.value)) {\n        this.value = [];\n      } else {\n        this.value = [event.detail.value];\n      }\n      return;\n    }\n\n    toggle: if (event.detail.active) {\n      if (this.enforceValue && valueSet.size === 1) break toggle;\n      valueSet.delete(event.detail.value);\n    } else {\n      valueSet.add(event.detail.value);\n    }\n    this.value = [...valueSet];\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.setActiveToggleButtons();\n    this.setEmphasisToggleButtons();\n    this.setSizeToggleButtons();\n    this.setupMutationObserver();\n  }\n\n  disconnectedCallback() {\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the selected toggle buttons change.\n   * @bind value\n   */\n  @Event()\n  valueChanged: EventEmitter<string[]>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n\n  // #endregion RENDER\n}\n"],"version":3}

package/dist/cjs/nv-tooltip.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c56424e5.js');
+const index = require('./index-93d3b2f8.js');
 
 const nvTooltipCss = "nv-tooltip{display:inline-block;position:relative;user-select:none}nv-tooltip:has([fluid]:not([fluid=false])){display:block}nv-tooltip nv-popover>[data-scope=popover]{background:var(--components-tooltip-background);color:var(--components-tooltip-text);font-weight:var(--font-weight-medium-emphasis);padding:var(--tooltip-padding-y) var(--tooltip-padding-x);font-size:var(--tooltip-font-size);border-radius:var(--tooltip-radius);border:none;box-shadow:0px var(--shadow-y-axis-lg-1) var(--shadow-blur-lg-1) var(--shadow-spread-lg-1) var(--shadow-color-opacity-1), 0px var(--shadow-y-axis-lg-2) var(--shadow-blur-lg-2) var(--shadow-spread-lg-2) var(--shadow-color-opacity-2)}nv-tooltip nv-popover>[data-scope=popover] [data-scope=arrow]{background:var(--components-tooltip-background);box-shadow:none;border:none}";
 const NvTooltipStyle0 = nvTooltipCss;
@@ -46,7 +46,7 @@ const NvTooltip = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '5d5facbf2a0487bda4fbae49913a2cb4f69dcf5a' }, index.h("slot", { key: '91080d347f3473879109f7b0b59b159f5bb5979b' }), index.h("nv-popover", { key: '876e5e2487d1b2b5182e42909a6edeab5b3e9db2', triggerMode: "hover", hasArrow: true, placement: this.placement, strategy: this.strategy, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, index.h("p", { key: 'e30ce16ed27e41dee7359fb44ccba7a780e72d37', slot: "content" }, this.message), index.h("slot", { key: '395c75d7f45bab9aaebf979bd75087058b979350', name: "content" }))));
+        return (index.h(index.Host, { key: 'c2fdcd47be909554e31a3a7d77cd94dcb07c0d6e' }, index.h("slot", { key: '2305f6b7175d0ba84819351f60f2a4d76d117df9' }), index.h("nv-popover", { key: 'e388730b5858671d08981c6bbf72588a5084edbf', triggerMode: "hover", hasArrow: true, placement: this.placement, strategy: this.strategy, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, index.h("p", { key: '73f548a1c822f7c6d5a97bb4ef8da0d335cf049e', slot: "content" }, this.message), index.h("slot", { key: 'abb7a2dfa6a327122732802a867c5d4057fd1616', name: "content" }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/collection/collection-manifest.json

@@ -42,7 +42,6 @@
     "components/nv-row/nv-row.js",
     "components/nv-stack/nv-stack.js",
     "components/nv-table/nv-table.js",
-    "components/nv-tablecolumn/nv-tablecolumn.js",
     "components/nv-toggle/nv-toggle.js",
     "components/nv-togglebutton/nv-togglebutton.js",
     "components/nv-togglebuttongroup/nv-togglebuttongroup.js",

package/dist/collection/components/nv-accordion/nv-accordion.js

@@ -50,7 +50,7 @@ export class NvAccordion {
         const item = items[index];
         if (!item || item.disabled) {
             console.warn('[toggleItem] Item not found or disabled:', index);
-            this.openChanged.emit({ openIndexes: [...(this.openIndexes || [])] });
+            this.openIndexesChanged.emit([...(this.openIndexes || [])]);
             return;
         }
         let openIndexes = [...(this.openIndexes || [])];
@@ -78,7 +78,7 @@ export class NvAccordion {
         this.openIndexes = [...openIndexes];
         this.updateChildrenState();
         this.updatingFromInternal = false;
-        this.openChanged.emit({ openIndexes: [...openIndexes] });
+        this.openIndexesChanged.emit([...openIndexes]);
     }
     /**
      * Updates the open state of child elements based on openIndexes
@@ -145,7 +145,7 @@ export class NvAccordion {
                 this.updatingFromInternal = true;
                 this.openIndexes = [...childOpenIndexes];
                 this.updatingFromInternal = false;
-                this.openChanged.emit({ openIndexes: [...this.openIndexes] });
+                this.openIndexesChanged.emit([...this.openIndexes]);
             }
         }
         // Ensure children are in sync with current openIndexes state
@@ -156,7 +156,7 @@ export class NvAccordion {
     //#region RENDER
     render() {
         var _a;
-        return (h(Host, { key: 'b5c36f19bcbd0d06e9d924ae6f9630b8b6cae05a', role: "list", class: "nv-accordion" }, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) ? (this.data.map((item, i) => {
+        return (h(Host, { key: 'b7fa476c7830d6c5715ce53e42ad37253942e0e1', role: "list", class: "nv-accordion" }, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) ? (this.data.map((item, i) => {
             var _a;
             return (h("nv-accordion-item", { key: (_a = item.id) !== null && _a !== void 0 ? _a : i, itemTitle: item.title, disabled: item.disabled, open: (this.openIndexes || []).includes(i), mode: this.mode }, item.subtitle ? (h("div", { slot: "header" }, h("div", { class: "nv-accordion-item__header-content" }, h("span", { class: "nv-accordion-item__title" }, item.title), h("span", { class: "nv-accordion-item__subtitle" }, item.subtitle)))) : null, h("div", { slot: "content" }, item.content), item.footer && h("div", { slot: "footer" }, item.footer)));
         })) : (h("slot", null))));
@@ -239,18 +239,21 @@ export class NvAccordion {
     }
     static get events() {
         return [{
-                "method": "openChanged",
-                "name": "openChanged",
+                "method": "openIndexesChanged",
+                "name": "openIndexesChanged",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
-                    "tags": [],
+                    "tags": [{
+                            "name": "bind",
+                            "text": "openIndexes"
+                        }],
                     "text": "Event emitted when an item's open state changes"
                 },
                 "complexType": {
-                    "original": "{\n    /** Index of open items */\n    openIndexes: number[];\n  }",
-                    "resolved": "{ openIndexes: number[]; }",
+                    "original": "number[]",
+                    "resolved": "number[]",
                     "references": {}
                 }
             }];

package/dist/collection/components/nv-accordion/nv-accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-accordion.js","sourceRoot":"","sources":["../../../src/components/nv-accordion/nv-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Method,\n  Listen,\n  Element,\n  forceUpdate,\n  Watch,\n} from '@stencil/core';\n\n/**\n * @slot default - Slot for custom content (optional, ignored if data is provided)\n */\n@Component({\n  tag: 'nv-accordion',\n  styleUrl: 'styles/nv-accordion.scss',\n  shadow: false,\n})\nexport class NvAccordion {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Data to display as a list of items (title, subtitle, content).\n   */\n  @Prop({ reflect: false })\n  readonly data: {\n    /** Unique identifier of the item */\n    id: string;\n    /** Item title */\n    title: string;\n    /** Optional subtitle */\n    subtitle?: string;\n    /** Main content */\n    content: string;\n    /** Optional footer */\n    footer?: string;\n    /** Disabled state */\n    disabled?: boolean;\n  }[] = [];\n\n  /**\n   * Expansion mode: 'accordion' (single open) or 'multi' (multiple open)\n   */\n  @Prop({ reflect: true })\n  readonly mode: 'accordion' | 'multi' = 'accordion';\n\n  /**\n   * Index of open items (external control possible)\n   */\n  @Prop({ reflect: false, mutable: true })\n  openIndexes?: number[] = [];\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region STATE\n\n  @State()\n  private updatingFromInternal: boolean = false;\n\n  /**\n   * Reference to host element to access children\n   */\n  @Element() el!: HTMLNvAccordionElement;\n\n  //#endregion STATE\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted when an item's open state changes\n   */\n  @Event()\n  openChanged: EventEmitter<{\n    /** Index of open items */\n    openIndexes: number[];\n  }>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Opens an item by its index (Public API)\n   * @param {number} index Index of the item to open\n   */\n  @Method()\n  async open(index: number) {\n    this.toggleItem(index, true);\n  }\n\n  /**\n   * Closes an item by its index (Public API)\n   * @param {number} index Index of the item to close\n   */\n  @Method()\n  async close(index: number) {\n    this.toggleItem(index, false);\n  }\n\n  /**\n   * Toggles an item's state (internal)\n   * @param {number} index Item index\n   * @param {boolean} [forceOpen] Force open (true) or close (false)\n   */\n  private toggleItem(index: number, forceOpen?: boolean) {\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n    const item = items[index];\n\n    if (!item || item.disabled) {\n      console.warn('[toggleItem] Item not found or disabled:', index);\n      this.openChanged.emit({ openIndexes: [...(this.openIndexes || [])] });\n      return;\n    }\n\n    let openIndexes = [...(this.openIndexes || [])];\n    const isOpen = openIndexes.includes(index);\n\n    if (this.mode === 'accordion') {\n      openIndexes =\n        forceOpen === false || (forceOpen === undefined && isOpen)\n          ? []\n          : [index];\n    } else {\n      if (forceOpen === false) {\n        openIndexes = openIndexes.filter(i => i !== index);\n      } else if (forceOpen === true && !isOpen) {\n        openIndexes.push(index);\n      } else if (forceOpen === undefined) {\n        openIndexes = isOpen\n          ? openIndexes.filter(i => i !== index)\n          : [...openIndexes, index];\n      }\n    }\n\n    this.updatingFromInternal = true;\n    this.openIndexes = [...openIndexes];\n    this.updateChildrenState();\n    this.updatingFromInternal = false;\n\n    this.openChanged.emit({ openIndexes: [...openIndexes] });\n  }\n\n  /**\n   * Updates the open state of child elements based on openIndexes\n   */\n  private async updateChildrenState() {\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n\n    items.forEach((item, i) => {\n      const shouldBeOpen = (this.openIndexes || []).includes(i);\n      item.open = shouldBeOpen;\n      item.mode = this.mode;\n      item.setAttribute('aria-expanded', shouldBeOpen ? 'true' : 'false');\n      forceUpdate(item);\n    });\n  }\n\n  /**\n   * Listens to itemToggle events from nv-accordion-item elements\n   * @param {CustomEvent<boolean>} event Event emitted by nv-accordion-item\n   */\n  @Listen('itemToggle')\n  onItemToggle(event: CustomEvent<boolean>) {\n    if (this.updatingFromInternal) {\n      return;\n    }\n\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n    const targetItem = event.target as HTMLNvAccordionItemElement;\n    const index = items.indexOf(targetItem);\n\n    if (index !== -1) {\n      this.toggleItem(index, event.detail);\n    } else {\n      console.warn('[onItemToggle] Target item not found in items list');\n    }\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('openIndexes')\n  onOpenIndexesChange(\n    newValue: number[] | undefined,\n    oldValue: number[] | undefined,\n  ) {\n    if (\n      !this.updatingFromInternal &&\n      newValue !== undefined &&\n      newValue !== oldValue\n    ) {\n      this.updateChildrenState();\n    }\n  }\n\n  @Watch('mode')\n  onModeChange() {\n    this.updateChildrenState();\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (this.openIndexes === undefined) {\n      this.openIndexes = [];\n    }\n  }\n\n  async componentDidLoad() {\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n\n    // Only initialize openIndexes from child items if no data is provided and openIndexes is not explicitly set\n    if (\n      !this.data?.length &&\n      (!this.openIndexes || this.openIndexes.length === 0)\n    ) {\n      const childOpenIndexes = items\n        .map((item, i) => (item.hasAttribute('open') || item.open ? i : -1))\n        .filter(i => i !== -1);\n\n      if (childOpenIndexes.length > 0) {\n        this.updatingFromInternal = true;\n        this.openIndexes = [...childOpenIndexes];\n        this.updatingFromInternal = false;\n\n        this.openChanged.emit({ openIndexes: [...this.openIndexes] });\n      }\n    }\n\n    // Ensure children are in sync with current openIndexes state\n    await this.updateChildrenState();\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host role=\"list\" class=\"nv-accordion\">\n        {this.data?.length ? (\n          this.data.map((item, i) => (\n            <nv-accordion-item\n              key={item.id ?? i}\n              itemTitle={item.title}\n              disabled={item.disabled}\n              open={(this.openIndexes || []).includes(i)}\n              mode={this.mode}\n            >\n              {item.subtitle ? (\n                <div slot=\"header\">\n                  <div class=\"nv-accordion-item__header-content\">\n                    <span class=\"nv-accordion-item__title\">{item.title}</span>\n                    <span class=\"nv-accordion-item__subtitle\">\n                      {item.subtitle}\n                    </span>\n                  </div>\n                </div>\n              ) : null}\n              <div slot=\"content\">{item.content}</div>\n              {item.footer && <div slot=\"footer\">{item.footer}</div>}\n            </nv-accordion-item>\n          ))\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n\n  // #endregion RENDER\n}\n"]}
+{"version":3,"file":"nv-accordion.js","sourceRoot":"","sources":["../../../src/components/nv-accordion/nv-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Method,\n  Listen,\n  Element,\n  forceUpdate,\n  Watch,\n} from '@stencil/core';\n\n/**\n * @slot default - Slot for custom content (optional, ignored if data is provided)\n */\n@Component({\n  tag: 'nv-accordion',\n  styleUrl: 'styles/nv-accordion.scss',\n  shadow: false,\n})\nexport class NvAccordion {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Data to display as a list of items (title, subtitle, content).\n   */\n  @Prop({ reflect: false })\n  readonly data: {\n    /** Unique identifier of the item */\n    id: string;\n    /** Item title */\n    title: string;\n    /** Optional subtitle */\n    subtitle?: string;\n    /** Main content */\n    content: string;\n    /** Optional footer */\n    footer?: string;\n    /** Disabled state */\n    disabled?: boolean;\n  }[] = [];\n\n  /**\n   * Expansion mode: 'accordion' (single open) or 'multi' (multiple open)\n   */\n  @Prop({ reflect: true })\n  readonly mode: 'accordion' | 'multi' = 'accordion';\n\n  /**\n   * Index of open items (external control possible)\n   */\n  @Prop({ reflect: false, mutable: true })\n  openIndexes?: number[] = [];\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region STATE\n\n  @State()\n  private updatingFromInternal: boolean = false;\n\n  /**\n   * Reference to host element to access children\n   */\n  @Element() el!: HTMLNvAccordionElement;\n\n  //#endregion STATE\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted when an item's open state changes\n   * @bind openIndexes\n   */\n  @Event()\n  openIndexesChanged: EventEmitter<number[]>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Opens an item by its index (Public API)\n   * @param {number} index Index of the item to open\n   */\n  @Method()\n  async open(index: number) {\n    this.toggleItem(index, true);\n  }\n\n  /**\n   * Closes an item by its index (Public API)\n   * @param {number} index Index of the item to close\n   */\n  @Method()\n  async close(index: number) {\n    this.toggleItem(index, false);\n  }\n\n  /**\n   * Toggles an item's state (internal)\n   * @param {number} index Item index\n   * @param {boolean} [forceOpen] Force open (true) or close (false)\n   */\n  private toggleItem(index: number, forceOpen?: boolean) {\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n    const item = items[index];\n\n    if (!item || item.disabled) {\n      console.warn('[toggleItem] Item not found or disabled:', index);\n      this.openIndexesChanged.emit([...(this.openIndexes || [])]);\n      return;\n    }\n\n    let openIndexes = [...(this.openIndexes || [])];\n    const isOpen = openIndexes.includes(index);\n\n    if (this.mode === 'accordion') {\n      openIndexes =\n        forceOpen === false || (forceOpen === undefined && isOpen)\n          ? []\n          : [index];\n    } else {\n      if (forceOpen === false) {\n        openIndexes = openIndexes.filter(i => i !== index);\n      } else if (forceOpen === true && !isOpen) {\n        openIndexes.push(index);\n      } else if (forceOpen === undefined) {\n        openIndexes = isOpen\n          ? openIndexes.filter(i => i !== index)\n          : [...openIndexes, index];\n      }\n    }\n\n    this.updatingFromInternal = true;\n    this.openIndexes = [...openIndexes];\n    this.updateChildrenState();\n    this.updatingFromInternal = false;\n\n    this.openIndexesChanged.emit([...openIndexes]);\n  }\n\n  /**\n   * Updates the open state of child elements based on openIndexes\n   */\n  private async updateChildrenState() {\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n\n    items.forEach((item, i) => {\n      const shouldBeOpen = (this.openIndexes || []).includes(i);\n      item.open = shouldBeOpen;\n      item.mode = this.mode;\n      item.setAttribute('aria-expanded', shouldBeOpen ? 'true' : 'false');\n      forceUpdate(item);\n    });\n  }\n\n  /**\n   * Listens to itemToggle events from nv-accordion-item elements\n   * @param {CustomEvent<boolean>} event Event emitted by nv-accordion-item\n   */\n  @Listen('itemToggle')\n  onItemToggle(event: CustomEvent<boolean>) {\n    if (this.updatingFromInternal) {\n      return;\n    }\n\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n    const targetItem = event.target as HTMLNvAccordionItemElement;\n    const index = items.indexOf(targetItem);\n\n    if (index !== -1) {\n      this.toggleItem(index, event.detail);\n    } else {\n      console.warn('[onItemToggle] Target item not found in items list');\n    }\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('openIndexes')\n  onOpenIndexesChange(\n    newValue: number[] | undefined,\n    oldValue: number[] | undefined,\n  ) {\n    if (\n      !this.updatingFromInternal &&\n      newValue !== undefined &&\n      newValue !== oldValue\n    ) {\n      this.updateChildrenState();\n    }\n  }\n\n  @Watch('mode')\n  onModeChange() {\n    this.updateChildrenState();\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (this.openIndexes === undefined) {\n      this.openIndexes = [];\n    }\n  }\n\n  async componentDidLoad() {\n    const items = Array.from(\n      this.el.querySelectorAll('nv-accordion-item'),\n    ) as HTMLNvAccordionItemElement[];\n\n    // Only initialize openIndexes from child items if no data is provided and openIndexes is not explicitly set\n    if (\n      !this.data?.length &&\n      (!this.openIndexes || this.openIndexes.length === 0)\n    ) {\n      const childOpenIndexes = items\n        .map((item, i) => (item.hasAttribute('open') || item.open ? i : -1))\n        .filter(i => i !== -1);\n\n      if (childOpenIndexes.length > 0) {\n        this.updatingFromInternal = true;\n        this.openIndexes = [...childOpenIndexes];\n        this.updatingFromInternal = false;\n\n        this.openIndexesChanged.emit([...this.openIndexes]);\n      }\n    }\n\n    // Ensure children are in sync with current openIndexes state\n    await this.updateChildrenState();\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host role=\"list\" class=\"nv-accordion\">\n        {this.data?.length ? (\n          this.data.map((item, i) => (\n            <nv-accordion-item\n              key={item.id ?? i}\n              itemTitle={item.title}\n              disabled={item.disabled}\n              open={(this.openIndexes || []).includes(i)}\n              mode={this.mode}\n            >\n              {item.subtitle ? (\n                <div slot=\"header\">\n                  <div class=\"nv-accordion-item__header-content\">\n                    <span class=\"nv-accordion-item__title\">{item.title}</span>\n                    <span class=\"nv-accordion-item__subtitle\">\n                      {item.subtitle}\n                    </span>\n                  </div>\n                </div>\n              ) : null}\n              <div slot=\"content\">{item.content}</div>\n              {item.footer && <div slot=\"footer\">{item.footer}</div>}\n            </nv-accordion-item>\n          ))\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n\n  // #endregion RENDER\n}\n"]}

package/dist/collection/components/nv-accordion-item/nv-accordion-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-accordion-item.js","sourceRoot":"","sources":["../../../src/components/nv-accordion-item/nv-accordion-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Method,\n  State,\n  Element,\n  Watch,\n} from '@stencil/core';\nimport { useCollapse } from '../../animations';\n\n/**\n * Accordion item element for nv-accordion.\n *\n * @slot header - Custom header (replaces itemTitle/subtitle)\n * @slot content - Main content (expandable area)\n */\n@Component({\n  tag: 'nv-accordion-item',\n  styleUrl: 'styles/nv-accordion-item.scss',\n  shadow: false,\n})\nexport class NvAccordionItem {\n  @Element() el!: HTMLNvAccordionItemElement;\n  private contentRef?: HTMLDivElement;\n  private mutationObserver?: MutationObserver;\n  private isToggling: boolean = false;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Item title (displayed if header slot is absent)\n   */\n  @Prop({ reflect: true })\n  readonly itemTitle?: string;\n\n  /**\n   * Item subtitle (displayed if header slot is absent)\n   */\n  @Prop({ reflect: true })\n  readonly subtitle?: string;\n\n  /**\n   * Open or closed\n   */\n  @Prop({ reflect: true, mutable: true })\n  open: boolean = false;\n\n  /**\n   * Disables the item\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Maximum content height (in px, optional). If not defined, auto height.\n   */\n  @Prop({ reflect: true })\n  readonly maxContentHeight?: number;\n\n  /**\n   * Parent expansion mode (accordion or multi)\n   */\n  @Prop({ reflect: true })\n  readonly mode?: 'accordion' | 'multi' = 'accordion';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted on toggle (header click or programmatic change)\n   */\n  @Event()\n  itemToggle: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region STATE\n\n  /**\n   * Internal state for open/close rendering\n   */\n  @State()\n  currentOpenState: boolean = false;\n\n  /**\n   * Controls if the panel has been initialized for animations\n   */\n  @State()\n  isInitialized: boolean = false;\n\n  /**\n   * Animation in progress\n   */\n  @State()\n  isAnimating: boolean = false;\n\n  //#endregion STATE\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('open')\n  async onOpenChanged(newValue: boolean, oldValue: boolean) {\n    if (this.disabled) {\n      console.warn('[onOpenChanged] Item is disabled, forcing closed state');\n      this.currentOpenState = false;\n      this.open = false;\n      return;\n    }\n\n    this.currentOpenState = newValue;\n\n    const isInitialRender = oldValue === undefined;\n    if (!isInitialRender) {\n      if (newValue === false && !this.isToggling) {\n        this.itemToggle.emit(newValue);\n      } else if (newValue && !this.isToggling) {\n        this.itemToggle.emit(newValue);\n      }\n      await this.updateVisibility(newValue);\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region ANIMATIONS\n\n  /**\n   * Updates the visibility state with Nova animation system\n   * @param {boolean} open - Whether the accordion item should be open\n   */\n  private async updateVisibility(open: boolean) {\n    if (!this.contentRef) {\n      console.error('[updateVisibility] No contentRef available');\n      return;\n    }\n\n    this.isAnimating = true;\n\n    const { collapse, expand } = useCollapse(this.contentRef, {\n      duration: 200,\n    });\n\n    if (open) {\n      await expand();\n    } else {\n      await collapse();\n    }\n\n    this.isAnimating = false;\n  }\n\n  //#endregion ANIMATIONS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.currentOpenState = this.open;\n  }\n\n  componentDidLoad() {\n    if (this.contentRef) {\n      setTimeout(() => {\n        const { setExpanded, setCollapsed } = useCollapse(this.contentRef!, {\n          duration: 200,\n        });\n\n        if (this.open) {\n          setExpanded();\n          this.currentOpenState = true;\n        } else {\n          setCollapsed();\n          this.currentOpenState = false;\n        }\n        this.isInitialized = true;\n      }, 0);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Toggle open/close (Public API)\n   */\n  @Method()\n  async toggle() {\n    if (!this.disabled && !this.isAnimating) {\n      this.isToggling = true;\n      const newOpen = !this.open;\n\n      this.open = newOpen;\n      this.itemToggle.emit(newOpen);\n\n      this.isToggling = false;\n    } else {\n      console.warn('[toggle] Ignored toggle (disabled or animating)');\n    }\n  }\n\n  /**\n   * Handler for header click\n   */\n  private handleHeaderClick = () => {\n    this.toggle();\n  };\n\n  /**\n   * Handler for iconbutton click\n   * @param {Event} e - Click event\n   */\n  private handleIconClick = (e: Event) => {\n    e.stopPropagation();\n    this.toggle();\n  };\n\n  /**\n   * Handler for keyboard events on iconbutton\n   * @param {KeyboardEvent} e - Keyboard event\n   */\n  private handleHeaderKeyDown = (e: KeyboardEvent) => {\n    if (this.disabled) {\n      console.warn('[handleHeaderKeyDown] Ignored (disabled)');\n      return;\n    }\n\n    switch (e.key) {\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        this.toggle();\n        break;\n      case 'ArrowDown':\n        e.preventDefault();\n        if (!this.open) {\n          this.isToggling = true;\n          this.open = true;\n          this.itemToggle.emit(true);\n          this.isToggling = false;\n        }\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        if (this.open) {\n          this.isToggling = true;\n          this.open = false;\n          this.itemToggle.emit(false);\n          this.isToggling = false;\n        }\n        break;\n    }\n  };\n\n  /**\n   * Get the chevron icon name based on open state\n   * @returns {string} The icon name to display in the chevron button\n   */\n  private get chevronIconName(): string {\n    const name = this.open ? 'chevron-top' : 'chevron-down';\n    return name;\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={{\n          'nv-accordion-item': true,\n          'is-open': this.currentOpenState,\n          'is-disabled': this.disabled,\n          'is-animating': this.isAnimating,\n        }}\n        role=\"listitem\"\n        aria-expanded={this.currentOpenState ? 'true' : 'false'}\n        aria-disabled={this.disabled ? 'true' : 'false'}\n      >\n        <div\n          class=\"nv-accordion-item__header\"\n          onClick={this.handleHeaderClick}\n          aria-controls=\"content\"\n        >\n          <slot name=\"header\">\n            <div class=\"nv-accordion-item__header-content\">\n              {this.itemTitle && (\n                <span class=\"nv-accordion-item__title\">{this.itemTitle}</span>\n              )}\n              {this.subtitle && (\n                <span class=\"nv-accordion-item__subtitle\">{this.subtitle}</span>\n              )}\n            </div>\n          </slot>\n          <nv-iconbutton\n            emphasis=\"low\"\n            size=\"sm\"\n            shape=\"square\"\n            name={this.chevronIconName}\n            tabindex={this.disabled ? -1 : 0}\n            onClick={this.handleIconClick}\n            onKeyDown={this.handleHeaderKeyDown}\n            aria-controls=\"content\"\n            aria-label={\n              this.currentOpenState ? 'Close the section' : 'Open the section'\n            }\n          ></nv-iconbutton>\n        </div>\n\n        <div\n          id=\"content\"\n          class=\"nv-accordion-item__content\"\n          ref={el => (this.contentRef = el as HTMLDivElement)}\n        >\n          <div class=\"nv-accordion-item__content-inner\">\n            <slot name=\"content\" />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  // #endregion RENDER\n}\n"]}
+{"version":3,"file":"nv-accordion-item.js","sourceRoot":"","sources":["../../../src/components/nv-accordion-item/nv-accordion-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Method,\n  State,\n  Element,\n  Watch,\n} from '@stencil/core';\nimport { useCollapse } from '../../animations';\n\n/**\n * Accordion item element for nv-accordion.\n *\n * @slot header - Custom header (replaces itemTitle/subtitle)\n * @slot content - Main content (expandable area)\n */\n@Component({\n  tag: 'nv-accordion-item',\n  styleUrl: 'styles/nv-accordion-item.scss',\n  shadow: false,\n})\nexport class NvAccordionItem {\n  @Element() el!: HTMLNvAccordionItemElement;\n  private contentRef?: HTMLDivElement;\n  private mutationObserver?: MutationObserver;\n  private isToggling: boolean = false;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Item title (displayed if header slot is absent)\n   */\n  @Prop({ reflect: true })\n  readonly itemTitle?: string;\n\n  /**\n   * Item subtitle (displayed if header slot is absent)\n   */\n  @Prop({ reflect: true })\n  readonly subtitle?: string;\n\n  /**\n   * Open or closed\n   */\n  @Prop({ reflect: true, mutable: true })\n  open: boolean = false;\n\n  /**\n   * Disables the item\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Maximum content height (in px, optional). If not defined, auto height.\n   */\n  @Prop({ reflect: true })\n  readonly maxContentHeight?: number;\n\n  /**\n   * Parent expansion mode (accordion or multi)\n   */\n  @Prop({ reflect: true })\n  readonly mode?: 'accordion' | 'multi' = 'accordion';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted on toggle (header click or programmatic change)\n   */\n  @Event()\n  itemToggle: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region STATE\n\n  /**\n   * Internal state for open/close rendering\n   */\n  @State()\n  currentOpenState: boolean = false;\n\n  /**\n   * Controls if the panel has been initialized for animations\n   */\n  @State()\n  isInitialized: boolean = false;\n\n  /**\n   * Animation in progress\n   */\n  @State()\n  isAnimating: boolean = false;\n\n  //#endregion STATE\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('open')\n  async onOpenChanged(newValue: boolean, oldValue: boolean) {\n    if (this.disabled) {\n      console.warn('[onOpenChanged] Item is disabled, forcing closed state');\n      this.currentOpenState = false;\n      this.open = false;\n      return;\n    }\n\n    this.currentOpenState = newValue;\n\n    const isInitialRender = oldValue === undefined;\n    if (!isInitialRender) {\n      if (newValue === false && !this.isToggling) {\n        this.itemToggle.emit(newValue);\n      } else if (newValue && !this.isToggling) {\n        this.itemToggle.emit(newValue);\n      }\n      await this.updateVisibility(newValue);\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region ANIMATIONS\n\n  /**\n   * Updates the visibility state with Nova animation system\n   * @param {boolean} open - Whether the accordion item should be open\n   */\n  private async updateVisibility(open: boolean) {\n    if (!this.contentRef) {\n      console.error('[updateVisibility] No contentRef available');\n      return;\n    }\n\n    this.isAnimating = true;\n\n    const { collapse, expand } = useCollapse(this.contentRef, {\n      duration: 200,\n    });\n\n    if (open) {\n      await expand();\n    } else {\n      await collapse();\n    }\n\n    this.isAnimating = false;\n  }\n\n  //#endregion ANIMATIONS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.currentOpenState = this.open;\n  }\n\n  componentDidLoad() {\n    if (this.contentRef) {\n      setTimeout(() => {\n        const { setExpanded, setCollapsed } = useCollapse(this.contentRef!, {\n          duration: 200,\n        });\n\n        if (this.open) {\n          setExpanded();\n          this.currentOpenState = true;\n        } else {\n          setCollapsed();\n          this.currentOpenState = false;\n        }\n        this.isInitialized = true;\n      }, 0);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Toggle open/close (Public API)\n   */\n  @Method()\n  async toggle() {\n    if (!this.disabled && !this.isAnimating) {\n      this.isToggling = true;\n      const newOpen = !this.open;\n\n      this.open = newOpen;\n      this.itemToggle.emit(newOpen);\n\n      this.isToggling = false;\n    } else {\n      console.warn('[toggle] Ignored toggle (disabled or animating)');\n    }\n  }\n\n  /**\n   * Handler for header click\n   */\n  private handleHeaderClick = () => {\n    this.toggle();\n  };\n\n  /**\n   * Handler for iconbutton click\n   * @param {Event} e - Click event\n   */\n  private handleIconClick = (e: Event) => {\n    e.stopPropagation();\n    this.toggle();\n  };\n\n  /**\n   * Handler for keyboard events on iconbutton\n   * @param {KeyboardEvent} e - Keyboard event\n   */\n  private handleHeaderKeyDown = (e: KeyboardEvent) => {\n    if (this.disabled) {\n      console.warn('[handleHeaderKeyDown] Ignored (disabled)');\n      return;\n    }\n\n    switch (e.key) {\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        this.toggle();\n        break;\n      case 'ArrowDown':\n        e.preventDefault();\n        if (!this.open) {\n          this.isToggling = true;\n          this.open = true;\n          this.itemToggle.emit(true);\n          this.isToggling = false;\n        }\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        if (this.open) {\n          this.isToggling = true;\n          this.open = false;\n          this.itemToggle.emit(false);\n          this.isToggling = false;\n        }\n        break;\n    }\n  };\n\n  /**\n   * Get the chevron icon name based on open state\n   * @returns {string} The icon name to display in the chevron button\n   */\n  private get chevronIconName(): string {\n    const name = this.open ? 'chevron-top' : 'chevron-down';\n    return name;\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={{\n          'nv-accordion-item': true,\n          'is-open': this.currentOpenState,\n          'is-disabled': this.disabled,\n          'is-animating': this.isAnimating,\n        }}\n        role=\"listitem\"\n        aria-expanded={this.currentOpenState ? 'true' : 'false'}\n        aria-disabled={this.disabled ? 'true' : 'false'}\n      >\n        <div\n          class=\"nv-accordion-item__header\"\n          onClick={this.handleHeaderClick}\n          aria-controls=\"content\"\n        >\n          <slot name=\"header\">\n            <div class=\"nv-accordion-item__header-content\">\n              {this.itemTitle && (\n                <span class=\"nv-accordion-item__title\">{this.itemTitle}</span>\n              )}\n              {this.subtitle && (\n                <span class=\"nv-accordion-item__subtitle\">{this.subtitle}</span>\n              )}\n            </div>\n          </slot>\n          <nv-iconbutton\n            emphasis=\"low\"\n            size=\"sm\"\n            shape=\"square\"\n            name={this.chevronIconName}\n            tabindex={this.disabled ? -1 : 0}\n            onClick={this.handleIconClick}\n            onKeyDown={this.handleHeaderKeyDown}\n            aria-controls=\"content\"\n            aria-label={\n              this.currentOpenState ? 'Close the section' : 'Open the section'\n            }\n          ></nv-iconbutton>\n        </div>\n\n        <div\n          id=\"content\"\n          class=\"nv-accordion-item__content\"\n          ref={el => (this.contentRef = el as HTMLDivElement)}\n        >\n          <div class=\"nv-accordion-item__content-inner\">\n            <slot name=\"content\" />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"]}

package/dist/collection/components/nv-accordion-item/styles/nv-accordion-item.css

@@ -54,7 +54,7 @@ nv-accordion-item .nv-accordion-item__content .nv-accordion-item__content-inner
   /* text/md/medium */
   font-size: var(--font-size-md);
   font-style: normal;
-  font-weight: 500;
+  font-weight: var(--font-weight-medium-emphasis);
   line-height: var(--line-height-base); /* 150% */
 }
 nv-accordion-item.is-disabled {

package/dist/collection/components/nv-alert/nv-alert.css

@@ -6,7 +6,7 @@ nv-alert {
   position: relative;
   gap: var(--alert-gap-x);
   border-radius: var(--alert-radius);
-  font-family: "TT Norms Pro", "Montserrat", sans-serif;
+  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;
 }
 nv-alert > nv-icon {
   margin-left: var(--alert-icon-position-x);

package/dist/collection/components/nv-avatar/nv-avatar.css

@@ -7,7 +7,7 @@ nv-avatar {
   border-radius: var(--radius-rounded-full) !important;
   display: flex !important;
   flex-shrink: 0 !important;
-  font-family: "TT Norms Pro", sans-serif;
+  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;
   font-style: normal;
   font-weight: var(--font-weight-medium-emphasis);
   justify-content: center !important;