@scania/tegel 1.0.0 → 1.0.3

package/dist/types/components/dropdown/dropdown.d.ts

@@ -33,22 +33,35 @@ export declare class TdsDropdown {
   /** Default value selected in the Dropdown. */
   defaultValue: string;
   open: boolean;
-  selection: Array<{
-    value: string;
-    label: string;
-  }>;
+  value: string[];
   filterResult: number;
   filterFocus: boolean;
   private dropdownList;
   private inputElement;
-  private children;
   /** Method that resets the Dropdown, marks all children as non-selected and resets the value to null. */
   reset(): Promise<void>;
-  /** Method for setting the value of the Dropdown. */
-  setValue(newValue: string, newValueLabel: string): Promise<{
+  /** Method for setting the value of the Dropdown.
+   *
+   * Single selection example:
+   *
+   * <code>
+   *  dropdown.setValue('option-1', 'Option 1');
+   * </code>
+   *
+   * Multiselect example:
+   *
+   * <code>
+   *  dropdown.setValue(['option-1', 'option-2']);
+   * </code>
+   */
+  setValue(value: string | string[], label?: string): Promise<{
     value: string;
     label: string;
   }[]>;
+  /**
+   * @internal
+   */
+  appendValue(value: string): Promise<void>;
   /** Method for removing a selected value in the Dropdown. */
   removeValue(oldValue: string): Promise<{
     value: string;
@@ -71,13 +84,18 @@ export declare class TdsDropdown {
   onKeyDown(event: KeyboardEvent): Promise<void>;
   handleOpenState(): void;
   componentDidLoad(): void;
-  setDefaultOption: () => void;
+  /** Method that resets the dropdown without emitting an event. */
+  private internalReset;
+  private setDefaultOption;
+  private selectChildrenAsSelectedBasedOnSelectionProp;
   private getChildren;
   getOpenDirection: () => "up" | "down";
+  private getSelectedChildren;
+  private getSelectedChildrenLabels;
   getValue: () => string;
   handleFilter: (event: any) => void;
-  handleFocus: (event: any) => void;
-  handleBlur: (event: any) => void;
-  handleChange: () => void;
+  private handleFocus;
+  private handleBlur;
+  private handleChange;
   render(): any;
 }

package/dist/types/components/icon/icon.d.ts

@@ -3,6 +3,8 @@ export declare class Icon {
   name: string;
   /** Pass a size of icon as a string, for example: 32px, 1rem, 4em... */
   size: string;
+  /** Override the default title for the svg. */
+  svgTitle: string;
   icons_object: string;
   arrayOfIcons: any[];
   componentWillLoad(): void;

package/dist/types/components/popover-canvas/popover-canvas.d.ts

@@ -1,5 +1,5 @@
 import type { Placement } from '@popperjs/core';
-import { Attributes } from '../../utils/utils';
+import { Attributes } from '../../types/Attributes';
 /**
  * @slot <default> - <b>Unnamed slot.</b> For the contents of the popover.
  */

package/dist/types/components/popover-menu/popover-menu.d.ts

@@ -1,5 +1,5 @@
 import type { Placement } from '@popperjs/core';
-import { Attributes } from '../../utils/utils';
+import { Attributes } from '../../types/Attributes';
 /**
  * @slot <default> - <b>Unnamed slot.</b> For the list of menu items.
  */

package/dist/types/components/slider/slider.d.ts

@@ -43,7 +43,6 @@ export declare class TdsSlider {
   private thumbGrabbed;
   private thumbLeft;
   private tickValues;
-  private readonlyState;
   private useControls;
   private useInput;
   private useSmall;
@@ -62,6 +61,7 @@ export declare class TdsSlider {
   handleTouchEnd(): void;
   handleMouseMove(event: any): void;
   handleTouchMove(event: any): void;
+  handleValueUpdate(newVal: any): void;
   updateSupposedValueSlot(localLeft: any): number;
   thumbCore(event: any): void;
   updateTrack(): void;

package/dist/types/components/table/table-component-filtering.stories.d.ts

@@ -51,13 +51,6 @@ declare const _default: {
         };
       };
     };
-    useDataProp: {
-      name: string;
-      description: string;
-      control: {
-        type: string;
-      };
-    };
     verticalDivider: {
       name: string;
       description: string;
@@ -126,7 +119,6 @@ declare const _default: {
     modeVariant: string;
     compactDesign: boolean;
     responsiveDesign: boolean;
-    useDataProp: boolean;
     verticalDivider: boolean;
     noMinWidth: boolean;
     column1Width: string;

package/dist/types/components/table/table-component-multiselect.stories.d.ts

@@ -119,7 +119,6 @@ declare const _default: {
     modeVariant: string;
     compactDesign: boolean;
     responsiveDesign: boolean;
-    multiselect: boolean;
     verticalDivider: boolean;
     noMinWidth: boolean;
     column1Width: string;

package/dist/types/components/text-field/text-field.d.ts

@@ -27,7 +27,7 @@ export declare class TdsTextField {
   size: 'sm' | 'md' | 'lg';
   /** Mode variant of the Text Field */
   modeVariant: 'primary' | 'secondary';
-  /** With setting */
+  /** Unset minimum width of 208px. */
   noMinWidth: boolean;
   /** Name property */
   name: string;

package/dist/types/components/tooltip/tooltip.d.ts

@@ -1,5 +1,5 @@
 import type { Placement } from '@popperjs/core';
-import { Attributes } from '../../utils/utils';
+import { Attributes } from '../../types/Attributes';
 /**
  * @slot <default> - <b>Unnamed slot.</b> For the tooltip contents.
  */

package/dist/types/components.d.ts

@@ -315,6 +315,7 @@ export namespace Components {
         "orientation": 'horizontal' | 'vertical';
     }
     interface TdsDropdown {
+        "appendValue": (value: string) => Promise<void>;
         /**
           * Method for closing the Dropdown.
          */
@@ -380,9 +381,9 @@ export namespace Components {
          */
         "reset": () => Promise<void>;
         /**
-          * Method for setting the value of the Dropdown.
+          * Method for setting the value of the Dropdown.  Single selection example:  <code> dropdown.setValue('option-1', 'Option 1'); </code>  Multiselect example:  <code> dropdown.setValue(['option-1', 'option-2']); </code>
          */
-        "setValue": (newValue: string, newValueLabel: string) => Promise<{ value: string; label: string; }[]>;
+        "setValue": (value: string | string[], label?: string) => Promise<{ value: string; label: string; }[]>;
         /**
           * The size of the Dropdown.
          */
@@ -559,6 +560,10 @@ export namespace Components {
           * Pass a size of icon as a string, for example: 32px, 1rem, 4em...
          */
         "size": string;
+        /**
+          * Override the default title for the svg.
+         */
+        "svgTitle": string;
     }
     interface TdsInlineTab {
         /**
@@ -1132,7 +1137,7 @@ export namespace Components {
          */
         "name": string;
         /**
-          * With setting
+          * Unset minimum width of 208px.
          */
         "noMinWidth": boolean;
         /**
@@ -2024,8 +2029,8 @@ declare namespace LocalJSX {
         /**
           * Fires when the Accordion Item is clicked, but before it is closed or opened.
          */
-        "onTdsToggle"?: (event: TdsAccordionItemCustomEvent<{
-    expanded: boolean;
+        "onTdsToggle"?: (event: TdsAccordionItemCustomEvent<{
+    expanded: boolean;
   }>) => void;
         /**
           * When true, 16px on right padding instead of 64px
@@ -2066,14 +2071,8 @@ declare namespace LocalJSX {
         /**
           * Sends a unique Banner identifier when the close button is pressed.
          */
-        "onTdsClose"?: (event: TdsBannerCustomEvent<{
-    bannerId: string;
-  }>) => void;
-        /**
-          * Sends the unique Banner identifier when the close button is pressed.
-         */
-        "onTdsShow"?: (event: TdsBannerCustomEvent<{
-    bannerId: string;
+        "onTdsClose"?: (event: TdsBannerCustomEvent<{
+    bannerId: string;
   }>) => void;
         /**
           * Subheader text.
@@ -2178,8 +2177,8 @@ declare namespace LocalJSX {
         /**
           * Sends unique Card identifier when the Card is clicked, if clickable=true
          */
-        "onTdsClick"?: (event: TdsCardCustomEvent<{
-    cardId: string;
+        "onTdsClick"?: (event: TdsCardCustomEvent<{
+    cardId: string;
   }>) => void;
         /**
           * Subheader text in the header
@@ -2210,10 +2209,10 @@ declare namespace LocalJSX {
         /**
           * Sends unique Checkbox identifier and checked status when it is checked/unchecked.
          */
-        "onTdsChange"?: (event: TdsCheckboxCustomEvent<{
-    checkboxId: string;
-    checked: boolean;
-    value?: string;
+        "onTdsChange"?: (event: TdsCheckboxCustomEvent<{
+    checkboxId: string;
+    checked: boolean;
+    value?: string;
   }>) => void;
         /**
           * Focus event for the Checkbox
@@ -2244,16 +2243,16 @@ declare namespace LocalJSX {
         /**
           * Sends unique Chip identifier and value when it is changed (checked/unchecked). Valid only for type checkbox and radio. If no ID is specified, a random one will be generated. To use this listener, don't use the randomized ID, use a specific one of your choosing.
          */
-        "onTdsChange"?: (event: TdsChipCustomEvent<{
-    chipId: string;
-    value: string;
-    checked?: boolean;
+        "onTdsChange"?: (event: TdsChipCustomEvent<{
+    chipId: string;
+    value: string;
+    checked?: boolean;
   }>) => void;
         /**
           * Sends unique Chip identifier when Chip is clicked. Valid only for type button. If no ID is specified, a random one will be generated. To use this listener, don't use the randomized ID, use a specific one of your choosing.
          */
-        "onTdsClick"?: (event: TdsChipCustomEvent<{
-    chipId: string;
+        "onTdsClick"?: (event: TdsChipCustomEvent<{
+    chipId: string;
   }>) => void;
         /**
           * Size of the Chip component
@@ -2398,9 +2397,9 @@ declare namespace LocalJSX {
         /**
           * Change event for the Dropdown.
          */
-        "onTdsChange"?: (event: TdsDropdownCustomEvent<{
-    name: string;
-    value: string;
+        "onTdsChange"?: (event: TdsDropdownCustomEvent<{
+    name: string;
+    value: string;
   }>) => void;
         /**
           * Focus event for the Dropdown.
@@ -2439,9 +2438,9 @@ declare namespace LocalJSX {
         /**
           * Click event for the Dropdown option.
          */
-        "onTdsSelect"?: (event: TdsDropdownOptionCustomEvent<{
-    selected: boolean;
-    value: string;
+        "onTdsSelect"?: (event: TdsDropdownOptionCustomEvent<{
+    selected: boolean;
+    value: string;
   }>) => void;
         /**
           * Value for the Dropdown option.
@@ -2466,8 +2465,8 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the selected Tab is changed.
          */
-        "onTdsChange"?: (event: TdsFolderTabsCustomEvent<{
-    selectedTabIndex: number;
+        "onTdsChange"?: (event: TdsFolderTabsCustomEvent<{
+    selectedTabIndex: number;
   }>) => void;
         /**
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
@@ -2508,10 +2507,10 @@ declare namespace LocalJSX {
         /**
           * Sends unique Table identifier, column key and sorting direction to the tds-table-body component, can also be listened to in order to implement custom-sorting logic.
          */
-        "onTdsSort"?: (event: TdsHeaderCellCustomEvent<{
-    tableId: string;
-    columnKey: string;
-    sortingDirection: 'asc' | 'desc';
+        "onTdsSort"?: (event: TdsHeaderCellCustomEvent<{
+    tableId: string;
+    columnKey: string;
+    sortingDirection: 'asc' | 'desc';
   }>) => void;
         /**
           * Enables sorting on that column
@@ -2613,6 +2612,10 @@ declare namespace LocalJSX {
           * Pass a size of icon as a string, for example: 32px, 1rem, 4em...
          */
         "size"?: string;
+        /**
+          * Override the default title for the svg.
+         */
+        "svgTitle"?: string;
     }
     interface TdsInlineTab {
         /**
@@ -2632,8 +2635,8 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the selected Tab is changed.
          */
-        "onTdsChange"?: (event: TdsInlineTabsCustomEvent<{
-    selectedTabIndex: number;
+        "onTdsChange"?: (event: TdsInlineTabsCustomEvent<{
+    selectedTabIndex: number;
   }>) => void;
         /**
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
@@ -2724,8 +2727,8 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the selected Tab is changed.
          */
-        "onTdsChange"?: (event: TdsNavigationTabsCustomEvent<{
-    selectedTabIndex: number;
+        "onTdsChange"?: (event: TdsNavigationTabsCustomEvent<{
+    selectedTabIndex: number;
   }>) => void;
         /**
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
@@ -2852,9 +2855,9 @@ declare namespace LocalJSX {
         /**
           * Sends unique Radio Button identifier and status when it is checked. If no ID is specified, a random one will be generated. To use this listener, don't use the randomized ID, use a specific one of your choosing.
          */
-        "onTdsChange"?: (event: TdsRadioButtonCustomEvent<{
-    radioId: string;
-    value: string;
+        "onTdsChange"?: (event: TdsRadioButtonCustomEvent<{
+    radioId: string;
+    value: string;
   }>) => void;
         /**
           * Unique Radio Button identifier.
@@ -2999,8 +3002,8 @@ declare namespace LocalJSX {
         /**
           * Sends the value of the slider when changed.
          */
-        "onTdsChange"?: (event: TdsSliderCustomEvent<{
-    value: string;
+        "onTdsChange"?: (event: TdsSliderCustomEvent<{
+    value: string;
   }>) => void;
         /**
           * Sets the read only state for the whole component
@@ -3122,10 +3125,10 @@ declare namespace LocalJSX {
         /**
           * Event emitted when a row is selected/deselected.
          */
-        "onTdsSelect"?: (event: TdsTableBodyRowCustomEvent<{
-    tableId: string;
-    checked: boolean;
-    selectedRows: any[];
+        "onTdsSelect"?: (event: TdsTableBodyRowCustomEvent<{
+    tableId: string;
+    checked: boolean;
+    selectedRows: any[];
   }>) => void;
         /**
           * Marks the row as selected, used for multiselect table.
@@ -3146,9 +3149,9 @@ declare namespace LocalJSX {
         /**
           * Event to send current page value to tds-table-body component, can also be listened to in order to implement custom pagination logic.
          */
-        "onTdsPagination"?: (event: TdsTableFooterCustomEvent<{
-    tableId: string;
-    paginationValue: number;
+        "onTdsPagination"?: (event: TdsTableFooterCustomEvent<{
+    tableId: string;
+    paginationValue: number;
   }>) => void;
         /**
           * Sets the number of pages.
@@ -3171,10 +3174,10 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the status of the select all checkbox changes.
          */
-        "onTdsSelectAll"?: (event: TdsTableHeaderCustomEvent<{
-    tableId: string;
-    checked: boolean;
-    selectedRows: any[];
+        "onTdsSelectAll"?: (event: TdsTableHeaderCustomEvent<{
+    tableId: string;
+    checked: boolean;
+    selectedRows: any[];
   }>) => void;
     }
     interface TdsTableToolbar {
@@ -3185,9 +3188,9 @@ declare namespace LocalJSX {
         /**
           * Used for sending users' input to the main parent tds-table the component, can also be listened to in order to implement custom sorting logic.
          */
-        "onTdsFilter"?: (event: TdsTableToolbarCustomEvent<{
-    tableId: string;
-    query: string;
+        "onTdsFilter"?: (event: TdsTableToolbarCustomEvent<{
+    tableId: string;
+    query: string;
   }>) => void;
         /**
           * Adds title to the Table
@@ -3228,7 +3231,7 @@ declare namespace LocalJSX {
          */
         "name"?: string;
         /**
-          * With setting
+          * Unset minimum width of 208px.
          */
         "noMinWidth"?: boolean;
         /**
@@ -3362,8 +3365,8 @@ declare namespace LocalJSX {
         /**
           * Sends unique Toast identifier when component is closed.
          */
-        "onTdsClose"?: (event: TdsToastCustomEvent<{
-    toastId: string;
+        "onTdsClose"?: (event: TdsToastCustomEvent<{
+    toastId: string;
   }>) => void;
         /**
           * Subheader text for the component.
@@ -3402,9 +3405,9 @@ declare namespace LocalJSX {
         /**
           * Sends unique Toggle identifier and status when it is toggled.
          */
-        "onTdsToggle"?: (event: TdsToggleCustomEvent<{
-    toggleId: string;
-    checked: boolean;
+        "onTdsToggle"?: (event: TdsToggleCustomEvent<{
+    toggleId: string;
+    checked: boolean;
   }>) => void;
         /**
           * Make the Toggle required

package/dist/types/global.d.ts

@@ -1,2 +1,2 @@
-declare module '*.md';
-declare module '*.png';
+declare module '*.md';
+declare module '*.png';

package/dist/types/stencil-public-runtime.d.ts

@@ -62,7 +62,7 @@ export interface PropOptions {
     /**
      * The name of the associated DOM attribute.
      * Stencil uses different heuristics to determine the default name of the attribute,
-     * but using this property, you can override the default behaviour.
+     * but using this property, you can override the default behavior.
      */
     attribute?: string | null;
     /**
@@ -128,7 +128,7 @@ export interface ListenOptions {
      * By default, Stencil uses several heuristics to determine if
      * it must attach a `passive` event listener or not.
      *
-     * Using the `passive` option can be used to change the default behaviour.
+     * Using the `passive` option can be used to change the default behavior.
      * Please see https://developers.google.com/web/updates/2016/06/passive-event-listeners for further information.
      */
     passive?: boolean;
@@ -471,7 +471,7 @@ export interface FunctionalUtilities {
     /**
      * Utility for reading the children of a functional component at runtime.
      * Since the Stencil runtime uses a different interface for children it is
-     * not recommendeded to read the children directly, and is preferable to use
+     * not recommended to read the children directly, and is preferable to use
      * this utility to, for instance, perform a side effect for each child.
      */
     forEach: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => void) => void;

package/dist/types/stories/formatHtmlPreview.d.ts

@@ -0,0 +1,2 @@
+declare const formatHtmlPreview: (htmlStr: any) => string;
+export default formatHtmlPreview;

package/dist/types/stories/foundations/color/color-semantic.stories.d.ts

@@ -10,4 +10,4 @@ declare const _default: {
   };
 };
 export default _default;
-export declare const Sematic: any;
+export declare const Semantic: any;

package/dist/types/types/Attributes.d.ts

@@ -0,0 +1,3 @@
+export type Attributes = {
+  [key: string]: any;
+};

package/dist/types/utils/appendHiddenInput.d.ts

@@ -0,0 +1,15 @@
+/** reference: https://github.com/ionic-team/ionic-framework/blob/main/core/src/utils/helpers.ts#L346
+ *
+ * Appends a hidden input element to allow the component
+ * work within and get picked up by a <form>.
+ * @param element The element on which the input with be appended.
+ * @param name Name of the input.
+ * @param value The value of the input.
+ * @param disabled Disables the input if true.
+ * @param additionalAttributes Additional attributes that should be passed to the input.
+ */
+declare const appendHiddenInput: (element: HTMLElement, name: string, value: string | undefined | null, disabled: boolean, additionalAttributes?: {
+  key: string;
+  value: string;
+}[]) => void;
+export default appendHiddenInput;

package/dist/types/utils/dfs.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Recursively finds the first matching element or child based on a provided condition.
+ *
+ * @param {ParentNode} parentNode - The starting element or shadow root to search from.
+ * @param {(el: HTMLElement) => boolean} searchPredicate - The condition to match the element, receives an HTMLElement and returns a boolean.
+ * @param {boolean} [pierceShadow=false] - Whether to pierce through shadow DOM boundaries.
+ * @returns {HTMLElement | null} - The first matching element or child, or null if none is found.
+ */
+declare function dfs(parentNode: ParentNode, searchPredicate: (el: HTMLElement) => boolean, pierceShadow?: boolean): HTMLElement | null;
+export default dfs;

package/dist/types/utils/findNextFocusableElement.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Find the next focusable element index in a list of focusable elements.
+ * @param items List of focusable elements, element with a attribute of disabled that is true will be skipped over.
+ * @param nextItemIndex The index in the list to start the search on.
+ */
+declare const findNextFocusableElement: (items: any[], nextItemIndex: number) => number;
+export default findNextFocusableElement;

package/dist/types/utils/findPreviousFocusableElement.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Find the previous focusable element index in a list of focusable elements.
+ *
+ * @param items List of focusable elements, element with a attribute of disabled that is true will be skipped over.
+ * @param nextItemIndex The index in the list to start the search on.
+ */
+declare const findPreviousFocusableElement: (items: any[], previousItemIndex: number) => number;
+export default findPreviousFocusableElement;

package/dist/types/utils/generateUniqueId.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Generates a reasonably unique string ID based on current time (minutes, seconds, milliseconds) and random numbers.
+ *
+ * This function combines the current time and random numbers to generate
+ * a unique string ID. The function assumes that it won't be called frequently
+ * enough to generate two identical IDs within a millisecond, or that the random
+ * number generator will produce the same value twice in quick succession.
+ *
+ * Note: The IDs generated by this function are not globally unique and their length may vary.
+ * For truly unique and fixed-length IDs, consider using a more robust method such as UUID.
+ *
+ * @returns {string} A unique string ID.
+ */
+declare function generateUniqueId(): string;
+export default generateUniqueId;

package/dist/types/utils/getNestedChildOfSiblingsMatching.d.ts

@@ -0,0 +1,2 @@
+declare function getNestedChildOfSiblingsMatching(element: HTMLElement, searchPredicate: (el: HTMLElement) => boolean, siblingTraversalFn: (el: HTMLElement) => HTMLElement | null): HTMLElement | null;
+export default getNestedChildOfSiblingsMatching;

package/dist/types/utils/getNextNestedChildOfSiblingsMatching.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Searches for a next sibling element that has a nested child element matching the provided search predicate.
+ * The search starts from the given element and proceeds to its next siblings, diving deep into each sibling's descendants.
+ *
+ * @param {HTMLElement} element - The starting element to begin the search from.
+ * @param {(el: HTMLElement) => boolean} searchPredicate - A predicate function that checks if an element matches the desired condition.
+ * @returns {HTMLElement | null} - The matching nested child element, or null if no matching element is found.
+ *
+ * @example
+ * // HTML structure:
+ * // <div>
+ * //   <h1>Heading 1</h1>
+ * //   <ul role="list">
+ * //     <li>Item 1</li>
+ * //   </ul>
+ * // </div>
+ * // <div>
+ * //   <h2>Heading 2</h2>
+ * //   <ul role="list">
+ * //     <li>Item 2</li>
+ * //   </ul>
+ * // </div>
+ *
+ * const searchPredicate = (el) => el.tagName.toLowerCase() === 'h2';
+ * const startingElement = document.querySelector('[role="list"]');
+ * const headingEl = getNextNestedChildOfSiblingsMatching(startingElement, searchPredicate);
+ * console.log(headingEl); // Logs the <h2>Heading 2</h2> element
+ */
+declare const getNextNestedChildOfSiblingsMatching: (element: HTMLElement, searchPredicate: (el: HTMLElement) => boolean) => HTMLElement;
+export default getNextNestedChildOfSiblingsMatching;

package/dist/types/utils/getNextSibling.d.ts

@@ -0,0 +1,2 @@
+declare const getNextSibling: (element: HTMLElement) => HTMLElement;
+export default getNextSibling;

package/dist/types/utils/getPreviousNestedChildOfSiblingsMatching.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Searches for a previous sibling element that has a nested child element matching the provided search predicate.
+ * The search starts from the given element and proceeds to its previous siblings, diving deep into each sibling's descendants.
+ *
+ * @param {HTMLElement} element - The starting element to begin the search from.
+ * @param {(el: HTMLElement) => boolean} searchPredicate - A predicate function that checks if an element matches the desired condition.
+ * @returns {HTMLElement | null} - The matching nested child element, or null if no matching element is found.
+ *
+ * @example
+ * // HTML structure:
+ * // <div>
+ * //   <h1>Heading 1</h1>
+ * //   <ul role="list">
+ * //     <li>Item 1</li>
+ * //   </ul>
+ * // </div>
+ * // <div>
+ * //   <h2>Heading 2</h2>
+ * //   <ul role="list">
+ * //     <li>Item 2</li>
+ * //   </ul>
+ * // </div>
+ *
+ * const searchPredicate = (el) => el.tagName.toLowerCase() === 'h2';
+ * const startingElement = document.querySelector('[role="list"]');
+ * const headingEl = getPreviousNestedChildOfSiblingsMatching(startingElement, searchPredicate);
+ * console.log(headingEl); // Logs the <h2>Heading 2</h2> element
+ */
+declare const getPreviousNestedChildOfSiblingsMatching: (element: HTMLElement, searchPredicate: (el: HTMLElement) => boolean) => HTMLElement;
+export default getPreviousNestedChildOfSiblingsMatching;

package/dist/types/utils/getPreviousSibling.d.ts

@@ -0,0 +1,2 @@
+declare const getPreviousSibling: (element: HTMLElement) => HTMLElement;
+export default getPreviousSibling;