@pine-ds/core 0.0.2-rc.0 → 0.0.4-rc.0

package/dist/types/components.d.ts

@@ -5,7 +5,11 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
+import { BoxColumnType, BoxTShirtSizeType } from "./utils/types";
+import { CheckboxChangeEventDetail } from "./components/pds-checkbox/checkbox-interface";
 import { TextareaChangeEventDetail } from "./components/pds-textarea/textarea-interface";
+export { BoxColumnType, BoxTShirtSizeType } from "./utils/types";
+export { CheckboxChangeEventDetail } from "./components/pds-checkbox/checkbox-interface";
 export { TextareaChangeEventDetail } from "./components/pds-textarea/textarea-interface";
 export namespace Components {
     interface PdsAvatar {
@@ -49,6 +53,129 @@ export namespace Components {
          */
         "variant"?: 'customer' | 'admin';
     }
+    interface PdsBox {
+        /**
+          * Defines the vertical alignment of the box items.
+          * @defaultValue start
+         */
+        "alignItems"?: `start` | `center` | `end` | `baseline` | `stretch`;
+        /**
+          * If `true`, the box will be sized to fit its contents.
+         */
+        "auto"?: boolean;
+        /**
+          * Defines the background-color of the box.
+         */
+        "backgroundColor"?: string;
+        /**
+          * If `true`, the box will have a border.
+         */
+        "border"?: boolean;
+        /**
+          * Defines the border color of the box.
+         */
+        "borderColor"?: string;
+        /**
+          * Defines how rounded the box corners are.
+          * @defaultValue none
+         */
+        "borderRadius"?: `none` | `xs`| `sm` | `md` | `lg` | `circle`;
+        /**
+          * Defines the orientation of the box items.
+          * @defaultValue row
+         */
+        "direction"?: `row` | `column`;
+        /**
+          * Defines the display style of the box.
+          * @defaultValue flex
+         */
+        "display"?: `flex` | `inline-flex` | `block` | `inline-block`;
+        /**
+          * If `true`, sets the box `max-width` to `100%`.
+         */
+        "fit"?: boolean;
+        /**
+          * Defines how a box will grow or shrink to fit the space available in its container.
+          * @defaultValue none
+         */
+        "flex"?: `none` | `grow` | `shrink`;
+        /**
+          * Defines the spacing between the box items.
+          * @defaultValue none
+         */
+        "gap"?: BoxTShirtSizeType;
+        /**
+          * Defines the horizontal alignment of the box items.
+          * @defaultValue start
+         */
+        "justifyContent"?: `start` | `center` | `end` | `space-between` | `space-around`;
+        /**
+          * The minimum height of the row. Used in conjunction with alignment props
+         */
+        "minHeight"?: string;
+        /**
+          * The minimum width of the row. Used in conjunction with alignment props
+         */
+        "minWidth"?: string;
+        /**
+          * Move columns to the end direction of the row for all screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offset"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `LG` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetLg"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `MD` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetMd"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `SM` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetSm"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `XL` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetXl"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `XS` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetXs"?: BoxColumnType;
+        /**
+          * Defines the spacing between the box items.
+          * @defaultValue none
+         */
+        "padding"?: BoxTShirtSizeType;
+        /**
+          * Defines the box shadow.
+          * @defaultValue none
+         */
+        "shadow"?: BoxTShirtSizeType;
+        /**
+          * Size of the column for all screen sizes that are not explicitly set.
+         */
+        "size"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `LG` breakpoint, this will take the number of columns specified.
+         */
+        "sizeLg"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `MD` breakpoint, this will take the number of columns specified.
+         */
+        "sizeMd"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `SM` breakpoint, this will take the number of columns specified.
+         */
+        "sizeSm"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `XL` breakpoint, this will take the number of columns specified.
+         */
+        "sizeXl"?: BoxColumnType;
+        /**
+          * At screen sizes less than the `XS` breakpoint, this will take the number of columns specified.
+         */
+        "sizeXs"?: BoxColumnType;
+    }
     interface PdsButton {
         /**
           * A unique identifier used for the underlying component `id` attribute.
@@ -114,6 +241,10 @@ export namespace Components {
           * String used for label text next to checkbox.
          */
         "label": string;
+        /**
+          * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.
+         */
+        "labelHidden": boolean;
         /**
           * String used for checkbox `name` attribute.
          */
@@ -382,6 +513,38 @@ export namespace Components {
          */
         "value": string;
     }
+    interface PdsRow {
+        /**
+          * Defines the vertical alignment of the row items.
+          * @defaultValue start
+         */
+        "alignItems"?: `start` | `center` | `end` | `baseline` | `stretch`;
+        /**
+          * If `true`, the row will have a border.
+         */
+        "border"?: boolean;
+        /**
+          * Defines the spacing between the row items.
+         */
+        "colGap"?: BoxTShirtSizeType | null;
+        /**
+          * A unique identifier used for the underlying component `id` attribute.
+         */
+        "componentId": string;
+        /**
+          * Defines the horizontal alignment of the row items.
+          * @defaultValue start
+         */
+        "justifyContent"?: `start` | `center` | `end` | `space-between` | `space-around`;
+        /**
+          * The minimum height of the row. Used in conjunction with alignment props
+         */
+        "minHeight"?: string;
+        /**
+          * If `true`, the row items will not wrap to the next line if horizontal space is not available.
+         */
+        "noWrap"?: boolean;
+    }
     interface PdsSortable {
         /**
           * Determines whether `sortable` should have a border.
@@ -474,6 +637,46 @@ export namespace Components {
         "selected": boolean;
         "variant": string;
     }
+    interface PdsTable {
+        /**
+          * Determines if table displays compact which reduces the spacing of table cells.
+         */
+        "compact": boolean;
+        /**
+          * A unique identifier used for the table `id` attribute.
+         */
+        "componentId": string;
+        /**
+          * Determines if table displays fixed column which fixes the first column of the table.
+         */
+        "fixedColumn": boolean;
+        /**
+          * Enables the table to be responsive by horizontally scrolling on smaller screens.
+         */
+        "responsive": boolean;
+        /**
+          * Determines if table displays checkboxes for selectable rows.
+         */
+        "selectable": boolean;
+    }
+    interface PdsTableBody {
+    }
+    interface PdsTableCell {
+        /**
+          * Truncates content to a max width of 100px and adds an ellipsis.
+         */
+        "truncate": boolean;
+    }
+    interface PdsTableHead {
+    }
+    interface PdsTableHeadCell {
+        /**
+          * Determines whether the table column is sortable when set to `true`.
+         */
+        "sortable": boolean;
+    }
+    interface PdsTableRow {
+    }
     interface PdsTabpanel {
         /**
           * Sets the related tab name, this name must match a `pds-tab`'s tab name property
@@ -638,6 +841,14 @@ export interface PdsTabCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPdsTabElement;
 }
+export interface PdsTableHeadCellCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPdsTableHeadCellElement;
+}
+export interface PdsTableRowCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPdsTableRowElement;
+}
 export interface PdsTextareaCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPdsTextareaElement;
@@ -653,6 +864,12 @@ declare global {
         prototype: HTMLPdsAvatarElement;
         new (): HTMLPdsAvatarElement;
     };
+    interface HTMLPdsBoxElement extends Components.PdsBox, HTMLStencilElement {
+    }
+    var HTMLPdsBoxElement: {
+        prototype: HTMLPdsBoxElement;
+        new (): HTMLPdsBoxElement;
+    };
     interface HTMLPdsButtonElement extends Components.PdsButton, HTMLStencilElement {
     }
     var HTMLPdsButtonElement: {
@@ -660,7 +877,7 @@ declare global {
         new (): HTMLPdsButtonElement;
     };
     interface HTMLPdsCheckboxElementEventMap {
-        "pdsCheckboxChange": boolean;
+        "pdsCheckboxChange": CheckboxChangeEventDetail;
     }
     interface HTMLPdsCheckboxElement extends Components.PdsCheckbox, HTMLStencilElement {
         addEventListener<K extends keyof HTMLPdsCheckboxElementEventMap>(type: K, listener: (this: HTMLPdsCheckboxElement, ev: PdsCheckboxCustomEvent<HTMLPdsCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -768,6 +985,12 @@ declare global {
         prototype: HTMLPdsRadioElement;
         new (): HTMLPdsRadioElement;
     };
+    interface HTMLPdsRowElement extends Components.PdsRow, HTMLStencilElement {
+    }
+    var HTMLPdsRowElement: {
+        prototype: HTMLPdsRowElement;
+        new (): HTMLPdsRowElement;
+    };
     interface HTMLPdsSortableElementEventMap {
         "pdsSortableItemMoved": any;
     }
@@ -825,6 +1048,64 @@ declare global {
         prototype: HTMLPdsTabElement;
         new (): HTMLPdsTabElement;
     };
+    interface HTMLPdsTableElement extends Components.PdsTable, HTMLStencilElement {
+    }
+    var HTMLPdsTableElement: {
+        prototype: HTMLPdsTableElement;
+        new (): HTMLPdsTableElement;
+    };
+    interface HTMLPdsTableBodyElement extends Components.PdsTableBody, HTMLStencilElement {
+    }
+    var HTMLPdsTableBodyElement: {
+        prototype: HTMLPdsTableBodyElement;
+        new (): HTMLPdsTableBodyElement;
+    };
+    interface HTMLPdsTableCellElement extends Components.PdsTableCell, HTMLStencilElement {
+    }
+    var HTMLPdsTableCellElement: {
+        prototype: HTMLPdsTableCellElement;
+        new (): HTMLPdsTableCellElement;
+    };
+    interface HTMLPdsTableHeadElement extends Components.PdsTableHead, HTMLStencilElement {
+    }
+    var HTMLPdsTableHeadElement: {
+        prototype: HTMLPdsTableHeadElement;
+        new (): HTMLPdsTableHeadElement;
+    };
+    interface HTMLPdsTableHeadCellElementEventMap {
+        "pdsTableSort": { column: string; direction: string };
+    }
+    interface HTMLPdsTableHeadCellElement extends Components.PdsTableHeadCell, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPdsTableHeadCellElementEventMap>(type: K, listener: (this: HTMLPdsTableHeadCellElement, ev: PdsTableHeadCellCustomEvent<HTMLPdsTableHeadCellElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPdsTableHeadCellElementEventMap>(type: K, listener: (this: HTMLPdsTableHeadCellElement, ev: PdsTableHeadCellCustomEvent<HTMLPdsTableHeadCellElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLPdsTableHeadCellElement: {
+        prototype: HTMLPdsTableHeadCellElement;
+        new (): HTMLPdsTableHeadCellElement;
+    };
+    interface HTMLPdsTableRowElementEventMap {
+        "pdsTableRowSelected": { rowIndex: number; isSelected: boolean; };
+    }
+    interface HTMLPdsTableRowElement extends Components.PdsTableRow, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPdsTableRowElementEventMap>(type: K, listener: (this: HTMLPdsTableRowElement, ev: PdsTableRowCustomEvent<HTMLPdsTableRowElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPdsTableRowElementEventMap>(type: K, listener: (this: HTMLPdsTableRowElement, ev: PdsTableRowCustomEvent<HTMLPdsTableRowElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLPdsTableRowElement: {
+        prototype: HTMLPdsTableRowElement;
+        new (): HTMLPdsTableRowElement;
+    };
     interface HTMLPdsTabpanelElement extends Components.PdsTabpanel, HTMLStencilElement {
     }
     var HTMLPdsTabpanelElement: {
@@ -874,6 +1155,7 @@ declare global {
     };
     interface HTMLElementTagNameMap {
         "pds-avatar": HTMLPdsAvatarElement;
+        "pds-box": HTMLPdsBoxElement;
         "pds-button": HTMLPdsButtonElement;
         "pds-checkbox": HTMLPdsCheckboxElement;
         "pds-chip": HTMLPdsChipElement;
@@ -884,10 +1166,17 @@ declare global {
         "pds-link": HTMLPdsLinkElement;
         "pds-progress": HTMLPdsProgressElement;
         "pds-radio": HTMLPdsRadioElement;
+        "pds-row": HTMLPdsRowElement;
         "pds-sortable": HTMLPdsSortableElement;
         "pds-sortable-item": HTMLPdsSortableItemElement;
         "pds-switch": HTMLPdsSwitchElement;
         "pds-tab": HTMLPdsTabElement;
+        "pds-table": HTMLPdsTableElement;
+        "pds-table-body": HTMLPdsTableBodyElement;
+        "pds-table-cell": HTMLPdsTableCellElement;
+        "pds-table-head": HTMLPdsTableHeadElement;
+        "pds-table-head-cell": HTMLPdsTableHeadCellElement;
+        "pds-table-row": HTMLPdsTableRowElement;
         "pds-tabpanel": HTMLPdsTabpanelElement;
         "pds-tabs": HTMLPdsTabsElement;
         "pds-textarea": HTMLPdsTextareaElement;
@@ -936,6 +1225,129 @@ declare namespace LocalJSX {
          */
         "variant"?: 'customer' | 'admin';
     }
+    interface PdsBox {
+        /**
+          * Defines the vertical alignment of the box items.
+          * @defaultValue start
+         */
+        "alignItems"?: `start` | `center` | `end` | `baseline` | `stretch`;
+        /**
+          * If `true`, the box will be sized to fit its contents.
+         */
+        "auto"?: boolean;
+        /**
+          * Defines the background-color of the box.
+         */
+        "backgroundColor"?: string;
+        /**
+          * If `true`, the box will have a border.
+         */
+        "border"?: boolean;
+        /**
+          * Defines the border color of the box.
+         */
+        "borderColor"?: string;
+        /**
+          * Defines how rounded the box corners are.
+          * @defaultValue none
+         */
+        "borderRadius"?: `none` | `xs`| `sm` | `md` | `lg` | `circle`;
+        /**
+          * Defines the orientation of the box items.
+          * @defaultValue row
+         */
+        "direction"?: `row` | `column`;
+        /**
+          * Defines the display style of the box.
+          * @defaultValue flex
+         */
+        "display"?: `flex` | `inline-flex` | `block` | `inline-block`;
+        /**
+          * If `true`, sets the box `max-width` to `100%`.
+         */
+        "fit"?: boolean;
+        /**
+          * Defines how a box will grow or shrink to fit the space available in its container.
+          * @defaultValue none
+         */
+        "flex"?: `none` | `grow` | `shrink`;
+        /**
+          * Defines the spacing between the box items.
+          * @defaultValue none
+         */
+        "gap"?: BoxTShirtSizeType;
+        /**
+          * Defines the horizontal alignment of the box items.
+          * @defaultValue start
+         */
+        "justifyContent"?: `start` | `center` | `end` | `space-between` | `space-around`;
+        /**
+          * The minimum height of the row. Used in conjunction with alignment props
+         */
+        "minHeight"?: string;
+        /**
+          * The minimum width of the row. Used in conjunction with alignment props
+         */
+        "minWidth"?: string;
+        /**
+          * Move columns to the end direction of the row for all screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offset"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `LG` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetLg"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `MD` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetMd"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `SM` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetSm"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `XL` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetXl"?: BoxColumnType;
+        /**
+          * Move columns to the end direction of the row for `XS` screen sizes. Increases the starting margin of a column by specified number of columns.
+         */
+        "offsetXs"?: BoxColumnType;
+        /**
+          * Defines the spacing between the box items.
+          * @defaultValue none
+         */
+        "padding"?: BoxTShirtSizeType;
+        /**
+          * Defines the box shadow.
+          * @defaultValue none
+         */
+        "shadow"?: BoxTShirtSizeType;
+        /**
+          * Size of the column for all screen sizes that are not explicitly set.
+         */
+        "size"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `LG` breakpoint, this will take the number of columns specified.
+         */
+        "sizeLg"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `MD` breakpoint, this will take the number of columns specified.
+         */
+        "sizeMd"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `SM` breakpoint, this will take the number of columns specified.
+         */
+        "sizeSm"?: BoxColumnType;
+        /**
+          * At screen sizes greater than the `XL` breakpoint, this will take the number of columns specified.
+         */
+        "sizeXl"?: BoxColumnType;
+        /**
+          * At screen sizes less than the `XS` breakpoint, this will take the number of columns specified.
+         */
+        "sizeXs"?: BoxColumnType;
+    }
     interface PdsButton {
         /**
           * A unique identifier used for the underlying component `id` attribute.
@@ -1001,14 +1413,18 @@ declare namespace LocalJSX {
           * String used for label text next to checkbox.
          */
         "label"?: string;
+        /**
+          * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.
+         */
+        "labelHidden"?: boolean;
         /**
           * String used for checkbox `name` attribute.
          */
         "name"?: string;
         /**
-          * Emits a boolean indicating whether the checkbox is currently checked or unchecked.
+          * Event emitted that contains the `value` and `checked`.
          */
-        "onPdsCheckboxChange"?: (event: PdsCheckboxCustomEvent<boolean>) => void;
+        "onPdsCheckboxChange"?: (event: PdsCheckboxCustomEvent<CheckboxChangeEventDetail>) => void;
         /**
           * It determines whether or not the checkbox is required.
          */
@@ -1289,6 +1705,38 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface PdsRow {
+        /**
+          * Defines the vertical alignment of the row items.
+          * @defaultValue start
+         */
+        "alignItems"?: `start` | `center` | `end` | `baseline` | `stretch`;
+        /**
+          * If `true`, the row will have a border.
+         */
+        "border"?: boolean;
+        /**
+          * Defines the spacing between the row items.
+         */
+        "colGap"?: BoxTShirtSizeType | null;
+        /**
+          * A unique identifier used for the underlying component `id` attribute.
+         */
+        "componentId"?: string;
+        /**
+          * Defines the horizontal alignment of the row items.
+          * @defaultValue start
+         */
+        "justifyContent"?: `start` | `center` | `end` | `space-between` | `space-around`;
+        /**
+          * The minimum height of the row. Used in conjunction with alignment props
+         */
+        "minHeight"?: string;
+        /**
+          * If `true`, the row items will not wrap to the next line if horizontal space is not available.
+         */
+        "noWrap"?: boolean;
+    }
     interface PdsSortable {
         /**
           * Determines whether `sortable` should have a border.
@@ -1385,6 +1833,54 @@ declare namespace LocalJSX {
          */
         "name": string;
     }
+    interface PdsTable {
+        /**
+          * Determines if table displays compact which reduces the spacing of table cells.
+         */
+        "compact"?: boolean;
+        /**
+          * A unique identifier used for the table `id` attribute.
+         */
+        "componentId": string;
+        /**
+          * Determines if table displays fixed column which fixes the first column of the table.
+         */
+        "fixedColumn"?: boolean;
+        /**
+          * Enables the table to be responsive by horizontally scrolling on smaller screens.
+         */
+        "responsive"?: boolean;
+        /**
+          * Determines if table displays checkboxes for selectable rows.
+         */
+        "selectable"?: boolean;
+    }
+    interface PdsTableBody {
+    }
+    interface PdsTableCell {
+        /**
+          * Truncates content to a max width of 100px and adds an ellipsis.
+         */
+        "truncate"?: boolean;
+    }
+    interface PdsTableHead {
+    }
+    interface PdsTableHeadCell {
+        /**
+          * Event emitted to signal that a table column header has been sorted, providing information about the sorted column's name and sorting direction.
+         */
+        "onPdsTableSort"?: (event: PdsTableHeadCellCustomEvent<{ column: string; direction: string }>) => void;
+        /**
+          * Determines whether the table column is sortable when set to `true`.
+         */
+        "sortable"?: boolean;
+    }
+    interface PdsTableRow {
+        /**
+          * Event that is emitted when the checkbox is clicked, carrying the selected value.
+         */
+        "onPdsTableRowSelected"?: (event: PdsTableRowCustomEvent<{ rowIndex: number; isSelected: boolean; }>) => void;
+    }
     interface PdsTabpanel {
         /**
           * Sets the related tab name, this name must match a `pds-tab`'s tab name property
@@ -1518,6 +2014,7 @@ declare namespace LocalJSX {
     }
     interface IntrinsicElements {
         "pds-avatar": PdsAvatar;
+        "pds-box": PdsBox;
         "pds-button": PdsButton;
         "pds-checkbox": PdsCheckbox;
         "pds-chip": PdsChip;
@@ -1528,10 +2025,17 @@ declare namespace LocalJSX {
         "pds-link": PdsLink;
         "pds-progress": PdsProgress;
         "pds-radio": PdsRadio;
+        "pds-row": PdsRow;
         "pds-sortable": PdsSortable;
         "pds-sortable-item": PdsSortableItem;
         "pds-switch": PdsSwitch;
         "pds-tab": PdsTab;
+        "pds-table": PdsTable;
+        "pds-table-body": PdsTableBody;
+        "pds-table-cell": PdsTableCell;
+        "pds-table-head": PdsTableHead;
+        "pds-table-head-cell": PdsTableHeadCell;
+        "pds-table-row": PdsTableRow;
         "pds-tabpanel": PdsTabpanel;
         "pds-tabs": PdsTabs;
         "pds-textarea": PdsTextarea;
@@ -1543,6 +2047,7 @@ declare module "@stencil/core" {
     export namespace JSX {
         interface IntrinsicElements {
             "pds-avatar": LocalJSX.PdsAvatar & JSXBase.HTMLAttributes<HTMLPdsAvatarElement>;
+            "pds-box": LocalJSX.PdsBox & JSXBase.HTMLAttributes<HTMLPdsBoxElement>;
             "pds-button": LocalJSX.PdsButton & JSXBase.HTMLAttributes<HTMLPdsButtonElement>;
             "pds-checkbox": LocalJSX.PdsCheckbox & JSXBase.HTMLAttributes<HTMLPdsCheckboxElement>;
             "pds-chip": LocalJSX.PdsChip & JSXBase.HTMLAttributes<HTMLPdsChipElement>;
@@ -1553,10 +2058,17 @@ declare module "@stencil/core" {
             "pds-link": LocalJSX.PdsLink & JSXBase.HTMLAttributes<HTMLPdsLinkElement>;
             "pds-progress": LocalJSX.PdsProgress & JSXBase.HTMLAttributes<HTMLPdsProgressElement>;
             "pds-radio": LocalJSX.PdsRadio & JSXBase.HTMLAttributes<HTMLPdsRadioElement>;
+            "pds-row": LocalJSX.PdsRow & JSXBase.HTMLAttributes<HTMLPdsRowElement>;
             "pds-sortable": LocalJSX.PdsSortable & JSXBase.HTMLAttributes<HTMLPdsSortableElement>;
             "pds-sortable-item": LocalJSX.PdsSortableItem & JSXBase.HTMLAttributes<HTMLPdsSortableItemElement>;
             "pds-switch": LocalJSX.PdsSwitch & JSXBase.HTMLAttributes<HTMLPdsSwitchElement>;
             "pds-tab": LocalJSX.PdsTab & JSXBase.HTMLAttributes<HTMLPdsTabElement>;
+            "pds-table": LocalJSX.PdsTable & JSXBase.HTMLAttributes<HTMLPdsTableElement>;
+            "pds-table-body": LocalJSX.PdsTableBody & JSXBase.HTMLAttributes<HTMLPdsTableBodyElement>;
+            "pds-table-cell": LocalJSX.PdsTableCell & JSXBase.HTMLAttributes<HTMLPdsTableCellElement>;
+            "pds-table-head": LocalJSX.PdsTableHead & JSXBase.HTMLAttributes<HTMLPdsTableHeadElement>;
+            "pds-table-head-cell": LocalJSX.PdsTableHeadCell & JSXBase.HTMLAttributes<HTMLPdsTableHeadCellElement>;
+            "pds-table-row": LocalJSX.PdsTableRow & JSXBase.HTMLAttributes<HTMLPdsTableRowElement>;
             "pds-tabpanel": LocalJSX.PdsTabpanel & JSXBase.HTMLAttributes<HTMLPdsTabpanelElement>;
             "pds-tabs": LocalJSX.PdsTabs & JSXBase.HTMLAttributes<HTMLPdsTabsElement>;
             "pds-textarea": LocalJSX.PdsTextarea & JSXBase.HTMLAttributes<HTMLPdsTextareaElement>;

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

@@ -1 +1,3 @@
 export type TooltipPlacementType = 'top-start' | 'top' | 'top-end' | 'left-start' | 'left' | 'left-end' | 'right-start' | 'right' | 'right-end' | 'bottom-start' | 'bottom' | 'bottom-end';
+export type BoxColumnType = '0' | '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';
+export type BoxTShirtSizeType = 'none' | 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';