tuix-webcomponents 0.0.32 → 0.0.34

package/dist/src/index.d.ts

@@ -17,7 +17,7 @@ export { TuixCheckbox } from './tuix-checkbox/TuixCheckbox.js';
 export { TuixRadioButton } from './tuix-radio-button/TuixRadioButton.js';
 export { TuixToggleButton } from './tuix-toggle-button/TuixToggleButton.js';
 export { TuixTable } from './tuix-table/TuixTable.js';
-export type { IDataTableHeader, PaginationEventDetail, ThreeDotsLoaderConfig, TuixPaginationEvent, TuixTableElement, } from './tuix-table/interfaces/tuix-table.interface.js';
+export type { IDataTableHeader, PaginationEventDetail, SortDirection, SortEventDetail, ThreeDotsLoaderConfig, TuixPaginationEvent, TuixSortEvent, TuixTableElement, } from './tuix-table/interfaces/tuix-table.interface.js';
 export { TuixToast } from './tuix-toast/TuixToast.js';
 export { TuixModal } from './tuix-modal/TuixModal.js';
 export { ToastType } from './tuix-toast/enums/tuix-toast.enums.js';

package/dist/src/react/index.d.ts

@@ -1,6 +1,6 @@
 import { type EventName } from '@lit/react';
 import { TuixText as WrappedTuixText, TuixIcon as WrappedTuixIcon, TuixButton as WrappedTuixButton, TuixPaper as WrappedTuixPaper, TuixIconButton as WrappedTuixIconButton, TuixLink as WrappedTuixLink, TuixInput as WrappedTuixInput, TuixDropdown as WrappedTuixDropdown, TuixCheckbox as WrappedTuixCheckbox, TuixRadioButton as WrappedTuixRadioButton, TuixToggleButton as WrappedTuixToggleButton, TuixTable as WrappedTuixTable, TuixToast as WrappedTuixToast, TuixModal as WrappedTuixModal } from '../index.js';
-import type { DetailValue, DetailValueCheckbox, PaginationEventDetail, TuixDropdownPlainOption } from '../index.js';
+import type { DetailValue, DetailValueCheckbox, PaginationEventDetail, SortEventDetail, TuixDropdownPlainOption } from '../index.js';
 export declare const TuixText: import("@lit/react").ReactWebComponent<WrappedTuixText, {}>;
 export declare const TuixIcon: import("@lit/react").ReactWebComponent<WrappedTuixIcon, {}>;
 export declare const TuixButton: import("@lit/react").ReactWebComponent<WrappedTuixButton, {
@@ -33,6 +33,7 @@ export declare const TuixTable: import("@lit/react").ReactWebComponent<WrappedTu
     onNextPage: EventName<CustomEvent<PaginationEventDetail>>;
     onPreviousPage: EventName<CustomEvent<PaginationEventDetail>>;
     onPageSizeChange: EventName<CustomEvent<PaginationEventDetail>>;
+    onSort: EventName<CustomEvent<SortEventDetail>>;
 }>;
 export declare const TuixToast: import("@lit/react").ReactWebComponent<WrappedTuixToast, {
     onClose: EventName<CustomEvent<undefined>>;

package/dist/src/react/index.js

@@ -94,6 +94,7 @@ export const TuixTable = createComponent({
         onNextPage: 'next-page',
         onPreviousPage: 'previous-page',
         onPageSizeChange: 'page-size-change',
+        onSort: 'sort',
     },
 });
 export const TuixToast = createComponent({

package/dist/src/tuix-button/TuixBaseButton.d.ts

@@ -1,6 +1,6 @@
 import { LitElement, type TemplateResult } from 'lit';
-import { MainVariant } from '../utils/mainVariant.enum.js';
-import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums.js';
+import { MainVariant } from '../utils/mainVariant.enum';
+import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';
 import '../tuix-icon/TuixIcon.js';
 export declare abstract class TuixBaseButton extends LitElement {
     variant: MainVariant;

package/dist/src/tuix-button/TuixBaseButton.js

@@ -1,8 +1,8 @@
 import { __decorate } from "tslib";
 import { LitElement, html } from 'lit';
-import { MainVariant } from '../utils/mainVariant.enum.js';
+import { MainVariant } from '../utils/mainVariant.enum';
 import { property, state } from 'lit/decorators.js';
-import { buttonTextColor } from './enums/tuix-button.enums.js';
+import { buttonTextColor } from './enums/tuix-button.enums';
 import '../tuix-icon/TuixIcon.js';
 export class TuixBaseButton extends LitElement {
     constructor() {

package/dist/src/tuix-button/TuixButton.d.ts

@@ -1,6 +1,6 @@
 import { type TemplateResult } from 'lit';
-import { IconName } from '../tuix-icon/enums/tuix-icon.enums.js';
-import { TuixBaseButton } from './TuixBaseButton.js';
+import { IconName } from '../tuix-icon/enums/tuix-icon.enums';
+import { TuixBaseButton } from './TuixBaseButton';
 export declare class TuixButton extends TuixBaseButton {
     static styles: import("lit").CSSResult[];
     full: boolean;

package/dist/src/tuix-button/TuixButton.js

@@ -1,10 +1,10 @@
 import { __decorate } from "tslib";
 import { css, html, nothing } from 'lit';
-import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums.js';
-import { buttonSizeStyles, buttonColorStyles, hostButtonStyles, } from './TuixButton.styles.js';
+import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';
+import { buttonSizeStyles, buttonColorStyles, hostButtonStyles, } from './TuixButton.styles';
 import { customElement, property } from 'lit/decorators.js';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
-import { TuixBaseButton } from './TuixBaseButton.js';
+import { ScreenSizes } from '../utils/screenSizes.enum';
+import { TuixBaseButton } from './TuixBaseButton';
 let TuixButton = class TuixButton extends TuixBaseButton {
     constructor() {
         super(...arguments);

package/dist/src/tuix-button/TuixButton.styles.js

@@ -1,10 +1,10 @@
 import { css, unsafeCSS } from 'lit';
-import { Palette } from '../utils/colors.js';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
-import { DarkPalette } from '../utils/darkColors.js';
-import { MainVariant } from '../utils/mainVariant.enum.js';
-import slottedClassName from '../utils/slottedClassName.js';
-import { TextSize } from '../tuix-text/enums/tuix-text.enums.js';
+import { Palette } from '../utils/colors';
+import { ScreenSizes } from '../utils/screenSizes.enum';
+import { DarkPalette } from '../utils/darkColors';
+import { MainVariant } from '../utils/mainVariant.enum';
+import slottedClassName from '../utils/slottedClassName';
+import { TextSize } from '../tuix-text/enums/tuix-text.enums';
 export const hostButtonStyles = css `
   :host {
     --t-button-primary-color: ${unsafeCSS(Palette.MAIN)};

package/dist/src/tuix-button/enums/tuix-button.enums.d.ts

@@ -1,2 +1,2 @@
-import { MainVariant } from '../../utils/mainVariant.enum.js';
+import { MainVariant } from '../../utils/mainVariant.enum';
 export declare const buttonTextColor: Record<MainVariant, string>;

package/dist/src/tuix-button/enums/tuix-button.enums.js

@@ -1,5 +1,5 @@
-import { Palette } from '../../utils/colors.js';
-import { MainVariant } from '../../utils/mainVariant.enum.js';
+import { Palette } from '../../utils/colors';
+import { MainVariant } from '../../utils/mainVariant.enum';
 export const buttonTextColor = {
     [MainVariant.PRIMARY]: Palette.WHITE,
     [MainVariant.SECONDARY]: Palette.MAIN,

package/dist/src/tuix-checkbox/TuixCheckbox.d.ts

@@ -1,7 +1,7 @@
 import { LitElement, type TemplateResult } from 'lit';
 import '../tuix-icon/TuixIcon.js';
 import '../tuix-text/TuixText.js';
-import { CheckboxLabelSide } from './enums/tuix-checkbox.enums.js';
+import { CheckboxLabelSide } from './enums/tuix-checkbox.enums';
 export declare class TuixCheckbox extends LitElement {
     static styles: import("lit").CSSResult[];
     checked: boolean;

package/dist/src/tuix-checkbox/TuixCheckbox.js

@@ -4,10 +4,10 @@ import { customElement, property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import '../tuix-icon/TuixIcon.js';
 import '../tuix-text/TuixText.js';
-import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums.js';
-import { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums.js';
-import { checkboxCheckmarkStyles, checkboxContainerStyles, checkboxLabelStyles, hostStyles, } from './TuixCheckbox.styles.js';
-import { CheckboxIconColorDark, CheckboxIconColorLight, CheckboxIconMode, CheckboxLabelSide, } from './enums/tuix-checkbox.enums.js';
+import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';
+import { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums';
+import { checkboxCheckmarkStyles, checkboxContainerStyles, checkboxLabelStyles, hostStyles, } from './TuixCheckbox.styles';
+import { CheckboxIconColorDark, CheckboxIconColorLight, CheckboxIconMode, CheckboxLabelSide, } from './enums/tuix-checkbox.enums';
 let TuixCheckbox = class TuixCheckbox extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/tuix-checkbox/TuixCheckbox.styles.js

@@ -1,7 +1,7 @@
 import { css, unsafeCSS } from 'lit';
-import { Palette } from '../utils/colors.js';
-import { DarkPalette } from '../utils/darkColors.js';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
+import { Palette } from '../utils/colors';
+import { DarkPalette } from '../utils/darkColors';
+import { ScreenSizes } from '../utils/screenSizes.enum';
 export const hostStyles = css `
   :host {
     --t-main-color-tuix: ${unsafeCSS(Palette.MAIN)};

package/dist/src/tuix-checkbox/enums/tuix-checkbox.enums.d.ts

@@ -1,5 +1,5 @@
-import { Palette } from '../../utils/colors.js';
-import { DarkPalette } from '../../utils/darkColors.js';
+import { Palette } from '../../utils/colors';
+import { DarkPalette } from '../../utils/darkColors';
 export declare enum CheckboxIconMode {
     DEFAULT = "default",
     DISABLED = "disabled",

package/dist/src/tuix-checkbox/enums/tuix-checkbox.enums.js

@@ -1,5 +1,5 @@
-import { Palette } from '../../utils/colors.js';
-import { DarkPalette } from '../../utils/darkColors.js';
+import { Palette } from '../../utils/colors';
+import { DarkPalette } from '../../utils/darkColors';
 export var CheckboxIconMode;
 (function (CheckboxIconMode) {
     CheckboxIconMode["DEFAULT"] = "default";

package/dist/src/tuix-checkbox/interfaces/tuix-checkbox.interface.d.ts

@@ -1,4 +1,4 @@
-import { type DetailValue } from '../../utils/interfaces/detail-value.interface.js';
+import { type DetailValue } from '../../utils/interfaces/detail-value.interface';
 export interface DetailValueCheckbox extends DetailValue<boolean> {
     label?: string;
 }

package/dist/src/tuix-dropdown/TuixDropdown.d.ts

@@ -1,8 +1,8 @@
 import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
 import '../tuix-input/TuixInput.js';
-import type { TuixDropdownExtendedOption, TuixDropdownOption } from './interfaces/tuix-dropdown.interface.js';
-import { DescriptionType } from '../tuix-input/enums/tuix-input.enums.js';
-import { DropdownType } from './enums/tuix-dropdown.enums.js';
+import type { TuixDropdownExtendedOption, TuixDropdownOption } from './interfaces/tuix-dropdown.interface';
+import { DescriptionType } from '../tuix-input/enums/tuix-input.enums';
+import { DropdownType } from './enums/tuix-dropdown.enums';
 export declare class TuixDropdown extends LitElement {
     static styles: import("lit").CSSResult[];
     value?: TuixDropdownOption;

package/dist/src/tuix-dropdown/TuixDropdown.js

@@ -3,10 +3,10 @@ import { LitElement, html, } from 'lit';
 import { customElement, property, query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import '../tuix-input/TuixInput.js';
-import { IconName } from '../tuix-icon/enums/tuix-icon.enums.js';
-import { dropdownHostStyles, dropdownMainContainerStyles, dropdownOptionStyles, } from './TuixDropdown.styles.js';
-import { DescriptionType } from '../tuix-input/enums/tuix-input.enums.js';
-import { DropdownType } from './enums/tuix-dropdown.enums.js';
+import { IconName } from '../tuix-icon/enums/tuix-icon.enums';
+import { dropdownHostStyles, dropdownMainContainerStyles, dropdownOptionStyles, } from './TuixDropdown.styles';
+import { DescriptionType } from '../tuix-input/enums/tuix-input.enums';
+import { DropdownType } from './enums/tuix-dropdown.enums';
 let TuixDropdown = class TuixDropdown extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/tuix-dropdown/TuixDropdown.styles.js

@@ -1,8 +1,8 @@
 import { css, unsafeCSS } from 'lit';
-import { hostStyles } from '../tuix-input/TuixInput.styles.js';
-import { Palette } from '../utils/colors.js';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
-import { DarkPalette } from '../utils/darkColors.js';
+import { hostStyles } from '../tuix-input/TuixInput.styles';
+import { Palette } from '../utils/colors';
+import { ScreenSizes } from '../utils/screenSizes.enum';
+import { DarkPalette } from '../utils/darkColors';
 export const dropdownHostStyles = css `
   ${hostStyles}
   :host {

package/dist/src/tuix-dropdown/interfaces/tuix-dropdown.interface.d.ts

@@ -1,5 +1,5 @@
-import { type CustomEventTuixInput } from '../../tuix-input/interfaces/tuix-input.interface.js';
-import { type DetailValue } from '../../utils/interfaces/detail-value.interface.js';
+import { type CustomEventTuixInput } from '../../tuix-input/interfaces/tuix-input.interface';
+import { type DetailValue } from '../../utils/interfaces/detail-value.interface';
 export type TuixDropdownPlainOption = string | number | boolean;
 export interface TuixDropdownObjectOption {
     name: string;

package/dist/src/tuix-icon/TuixIcon.d.ts

@@ -1,6 +1,6 @@
 import { LitElement, TemplateResult } from 'lit';
-import { IconName, IconSizeVariant } from './enums/tuix-icon.enums.js';
-import { TextVariant } from '../tuix-text/enums/tuix-text.enums.js';
+import { IconName, IconSizeVariant } from './enums/tuix-icon.enums';
+import { TextVariant } from '../tuix-text/enums/tuix-text.enums';
 export declare class TuixIcon extends LitElement {
     static styles: import("lit").CSSResult;
     name: IconName;

package/dist/src/tuix-icon/TuixIcon.icons.d.ts

@@ -1,5 +1,5 @@
 import { html } from 'lit';
-import { IconName } from './enums/tuix-icon.enums.js';
+import { IconName } from './enums/tuix-icon.enums';
 export declare const iconTemplate: (name?: IconName, color?: string, fill?: string) => ReturnType<typeof html>;
 type IconContentMapType = Record<IconName, string>;
 export declare const iconContentMap: IconContentMapType;

package/dist/src/tuix-icon/TuixIcon.icons.js

@@ -1,7 +1,7 @@
 import { html } from 'lit';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
-import { Palette } from '../utils/colors.js';
-import { IconName } from './enums/tuix-icon.enums.js';
+import { Palette } from '../utils/colors';
+import { IconName } from './enums/tuix-icon.enums';
 export const iconTemplate = (name, color = Palette.BLACK, fill) => {
     const iconName = name || IconName.ARROW_DOWN;
     const iconContent = iconContentMap[iconName];
@@ -410,5 +410,16 @@ export const iconContentMap = {
   <path d="M17 20a3 3 0 1 0 0-6 3 3 0 0 0 0 6M7 21a3 3 0 1 0 0-6 3 3 0 0 0 0 6M21 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0M10.5 10.5l4 4" stroke="#121212" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
   <rect width="8" height="8" x="3" y="3" rx="2" stroke="#121212" stroke-width="2"/>
   <path d="M7 12v3M12 7h3" stroke="#121212" stroke-width="2" stroke-linecap="round"/>
+  </svg>`,
+    [IconName.PLAY_OUTLINE]: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M5 3L19 12L5 21V3Z" stroke="#121212" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+  </svg>`,
+    [IconName.REFRESH]: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M23 4V10H17" stroke="#121212" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M1 20V14H7" stroke="#121212" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M3.506 8.998C4.013 7.564 4.875 6.283 6.012 5.273C7.148 4.263 8.522 3.557 10.004 3.222C11.487 2.886 13.031 2.932 14.491 3.354C15.952 3.777 17.281 4.562 18.356 5.638L23 10M1 14L5.636 18.358C6.711 19.433 8.04 20.218 9.501 20.641C10.961 21.063 12.505 21.109 13.988 20.773C15.471 20.438 16.844 19.732 17.981 18.722C19.117 17.712 19.979 16.431 20.486 14.998" stroke="#121212" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+  </svg>`,
+    [IconName.SHIELD]: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12 22C12 22 20 18 20 12V5L12 2L4 5V12C4 18 12 22 12 22Z" stroke="#121212" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
   </svg>`,
 };

package/dist/src/tuix-icon/TuixIcon.js

@@ -2,10 +2,10 @@ import { __decorate } from "tslib";
 import { LitElement, css, html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
-import { IconName, IconSizeVariant, iconSize } from './enums/tuix-icon.enums.js';
-import { iconTemplate } from './TuixIcon.icons.js';
-import { Palette } from '../utils/colors.js';
-import { TextVariant, colorText, colorTextDark, } from '../tuix-text/enums/tuix-text.enums.js';
+import { IconName, IconSizeVariant, iconSize } from './enums/tuix-icon.enums';
+import { iconTemplate } from './TuixIcon.icons';
+import { Palette } from '../utils/colors';
+import { TextVariant, colorText, colorTextDark, } from '../tuix-text/enums/tuix-text.enums';
 let TuixIcon = class TuixIcon extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/tuix-icon/enums/tuix-icon.enums.d.ts

@@ -90,5 +90,8 @@ export declare enum IconName {
     FILE_TEXT = "file-text",
     HIGHLIGHT = "highlight",
     MCP_LOGO = "mcp-logo",
-    ENDPOINTS = "endpoints"
+    ENDPOINTS = "endpoints",
+    PLAY_OUTLINE = "play-outline",
+    REFRESH = "refresh",
+    SHIELD = "shield"
 }

package/dist/src/tuix-icon/enums/tuix-icon.enums.js

@@ -98,4 +98,7 @@ export var IconName;
     IconName["HIGHLIGHT"] = "highlight";
     IconName["MCP_LOGO"] = "mcp-logo";
     IconName["ENDPOINTS"] = "endpoints";
+    IconName["PLAY_OUTLINE"] = "play-outline";
+    IconName["REFRESH"] = "refresh";
+    IconName["SHIELD"] = "shield";
 })(IconName || (IconName = {}));

package/dist/src/tuix-icon-button/TuixIconButton.d.ts

@@ -1,6 +1,6 @@
 import { type TemplateResult } from 'lit';
-import { IconName } from '../tuix-icon/enums/tuix-icon.enums.js';
-import { TuixBaseButton } from '../tuix-button/TuixBaseButton.js';
+import { IconName } from '../tuix-icon/enums/tuix-icon.enums';
+import { TuixBaseButton } from '../tuix-button/TuixBaseButton';
 export declare class TuixIconButton extends TuixBaseButton {
     static styles: import("lit").CSSResult[];
     icon: IconName;

package/dist/src/tuix-icon-button/TuixIconButton.js

@@ -1,10 +1,10 @@
 import { __decorate } from "tslib";
 import { css, html } from 'lit';
-import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums.js';
+import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';
 import { customElement, property } from 'lit/decorators.js';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
-import { buttonColorStyles, hostButtonStyles, } from '../tuix-button/TuixButton.styles.js';
-import { TuixBaseButton } from '../tuix-button/TuixBaseButton.js';
+import { ScreenSizes } from '../utils/screenSizes.enum';
+import { buttonColorStyles, hostButtonStyles, } from '../tuix-button/TuixButton.styles';
+import { TuixBaseButton } from '../tuix-button/TuixBaseButton';
 let TuixIconButton = class TuixIconButton extends TuixBaseButton {
     constructor() {
         super(...arguments);

package/dist/src/tuix-input/TuixInput.d.ts

@@ -1,6 +1,6 @@
 import { LitElement, type TemplateResult, CSSResult, type PropertyValueMap } from 'lit';
 import '../tuix-icon/TuixIcon.js';
-import { IconName } from '../tuix-icon/enums/tuix-icon.enums.js';
+import { IconName } from '../tuix-icon/enums/tuix-icon.enums';
 import { DescriptionType, InputType } from './enums/tuix-input.enums.js';
 export declare class TuixInput extends LitElement {
     _inputId: string;

package/dist/src/tuix-input/TuixInput.js

@@ -3,7 +3,7 @@ import { LitElement, html, nothing, } from 'lit';
 import { customElement, property, query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import '../tuix-icon/TuixIcon.js';
-import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums.js';
+import { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';
 import { Palette } from '../utils/colors.js';
 import { DarkPalette } from '../utils/darkColors.js';
 import { hostStyles, inputColorStyles, inputComponentStyles, inputDescriptionStyles, inputFontStyles, inputIconStyles, inputSearchStyles, inputTitleStyles, } from './TuixInput.styles.js';

package/dist/src/tuix-input/TuixInput.styles.js

@@ -1,8 +1,8 @@
 import { css, unsafeCSS } from 'lit';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
-import { Palette } from '../utils/colors.js';
-import { DarkPalette } from '../utils/darkColors.js';
-import { hexToRgb } from '../utils/hex-rgb.js';
+import { ScreenSizes } from '../utils/screenSizes.enum';
+import { Palette } from '../utils/colors';
+import { DarkPalette } from '../utils/darkColors';
+import { hexToRgb } from '../utils/hex-rgb';
 const inputVars = {
     gapX: '10px',
     iconDesktopSize: '1.5rem',

package/dist/src/tuix-input/enums/tuix-input.enums.d.ts

@@ -1,6 +1,6 @@
-import { IconName } from '../../tuix-icon/enums/tuix-icon.enums.js';
-import { Palette } from '../../utils/colors.js';
-import { DarkPalette } from '../../utils/darkColors.js';
+import { IconName } from '../../tuix-icon/enums/tuix-icon.enums';
+import { Palette } from '../../utils/colors';
+import { DarkPalette } from '../../utils/darkColors';
 export declare enum InputType {
     TEXT = "text",
     SEARCH = "search",

package/dist/src/tuix-input/enums/tuix-input.enums.js

@@ -1,6 +1,6 @@
-import { IconName } from '../../tuix-icon/enums/tuix-icon.enums.js';
-import { Palette } from '../../utils/colors.js';
-import { DarkPalette } from '../../utils/darkColors.js';
+import { IconName } from '../../tuix-icon/enums/tuix-icon.enums';
+import { Palette } from '../../utils/colors';
+import { DarkPalette } from '../../utils/darkColors';
 export var InputType;
 (function (InputType) {
     InputType["TEXT"] = "text";

package/dist/src/tuix-input/interfaces/tuix-input.interface.d.ts

@@ -1,8 +1,8 @@
-import { IconName } from '../../tuix-icon/enums/tuix-icon.enums.js';
-import { type DetailValue } from '../../utils/interfaces/detail-value.interface.js';
-import { InputIconLocation } from '../enums/tuix-input.enums.js';
-import { DarkPalette } from '../../utils/darkColors.js';
-import { Palette } from '../../utils/colors.js';
+import { IconName } from '../../tuix-icon/enums/tuix-icon.enums';
+import { type DetailValue } from '../../utils/interfaces/detail-value.interface';
+import { InputIconLocation } from '../enums/tuix-input.enums';
+import { DarkPalette } from '../../utils/darkColors';
+import { Palette } from '../../utils/colors';
 export declare const InputState: {
     INACTIVE: string;
     ACTIVE: string;

package/dist/src/tuix-link/TuixLink.d.ts

@@ -1,6 +1,6 @@
 import { LitElement, type TemplateResult } from 'lit';
-import { MainVariant } from '../utils/mainVariant.enum.js';
-import { LinkTarget } from './enums/linkTarget.enum.js';
+import { MainVariant } from '../utils/mainVariant.enum';
+import { LinkTarget } from './enums/linkTarget.enum';
 export declare class TuixLink extends LitElement {
     static styles: import("lit").CSSResult[];
     href?: string;

package/dist/src/tuix-link/TuixLink.js

@@ -1,11 +1,11 @@
 import { __decorate } from "tslib";
 import { html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { MainVariant } from '../utils/mainVariant.enum.js';
-import { LinkTarget } from './enums/linkTarget.enum.js';
+import { MainVariant } from '../utils/mainVariant.enum';
+import { LinkTarget } from './enums/linkTarget.enum';
 import { classMap } from 'lit/directives/class-map.js';
-import { linkStyles } from './TuixLink.styles.js';
-import { linkFontStyles } from '../tuix-text/TuixText.styles.js';
+import { linkStyles } from './TuixLink.styles';
+import { linkFontStyles } from '../tuix-text/TuixText.styles';
 let TuixLink = class TuixLink extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/tuix-link/TuixLink.styles.js

@@ -1,7 +1,7 @@
 import { css, unsafeCSS } from 'lit';
-import { MainVariant } from '../utils/mainVariant.enum.js';
-import { Palette } from '../utils/colors.js';
-import { DarkPalette } from '../utils/darkColors.js';
+import { MainVariant } from '../utils/mainVariant.enum';
+import { Palette } from '../utils/colors';
+import { DarkPalette } from '../utils/darkColors';
 export const LINK_TEXT_COLOR_VAR_NAME = '--t-link-text-color';
 export const linkStyles = css `
   ${unsafeCSS(`

package/dist/src/tuix-modal/TuixModal.styles.js

@@ -1,6 +1,6 @@
 import { css, unsafeCSS } from 'lit';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
-import { Palette } from '../utils/colors.js';
+import { ScreenSizes } from '../utils/screenSizes.enum';
+import { Palette } from '../utils/colors';
 export const commonModalStyles = css `
   :host {
     display: none;

package/dist/src/tuix-paper/TuixPaper.d.ts

@@ -1,5 +1,5 @@
 import { LitElement, type TemplateResult } from 'lit';
-import { BorderRadiusPaper, PaperElevation } from './enums/tuix-paper.enum.js';
+import { BorderRadiusPaper, PaperElevation } from './enums/tuix-paper.enum';
 export declare class TuixPaper extends LitElement {
     static styles: import("lit").CSSResult[];
     elevation: PaperElevation;

package/dist/src/tuix-paper/TuixPaper.js

@@ -1,10 +1,10 @@
 import { __decorate } from "tslib";
 import { LitElement, html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { BorderRadiusPaper, PaperElevation } from './enums/tuix-paper.enum.js';
+import { BorderRadiusPaper, PaperElevation } from './enums/tuix-paper.enum';
 import { classMap } from 'lit/directives/class-map.js';
 import { styleMap } from 'lit/directives/style-map.js';
-import { paperStyles } from './TuixPaper.styles.js';
+import { paperStyles } from './TuixPaper.styles';
 let TuixPaper = class TuixPaper extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/tuix-paper/TuixPaper.styles.js

@@ -1,6 +1,6 @@
 import { css, unsafeCSS } from 'lit';
-import { PaperElevation } from './enums/tuix-paper.enum.js';
-import { Palette } from '../utils/colors.js';
+import { PaperElevation } from './enums/tuix-paper.enum';
+import { Palette } from '../utils/colors';
 const calculatedStyles = Object.values(PaperElevation)
     .slice(1, -1)
     .map((variant, index) => `

package/dist/src/tuix-radio-button/TuixRadioButton.d.ts

@@ -1,7 +1,7 @@
 import { LitElement } from 'lit';
 import '../tuix-text/TuixText.js';
-import { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums.js';
-import type { TuixRadioButtonOption } from './interfaces/tuix-radio-button.interface.js';
+import { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums';
+import type { TuixRadioButtonOption } from './interfaces/tuix-radio-button.interface';
 export declare class TuixRadioButton extends LitElement {
     static styles: import("lit").CSSResult[];
     disabled: boolean;

package/dist/src/tuix-radio-button/TuixRadioButton.js

@@ -3,9 +3,9 @@ import { LitElement, html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import '../tuix-text/TuixText.js';
-import { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums.js';
-import { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums.js';
-import { radioButtonContainerStyles, radioButtonInnerStyles, radioButtonLabelStyles, radioButtonStyles, radioHostStyles, } from './TuixRadioButton.styles.js';
+import { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums';
+import { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums';
+import { radioButtonContainerStyles, radioButtonInnerStyles, radioButtonLabelStyles, radioButtonStyles, radioHostStyles, } from './TuixRadioButton.styles';
 let TuixRadioButton = class TuixRadioButton extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/tuix-radio-button/TuixRadioButton.styles.js

@@ -1,7 +1,7 @@
 import { css, unsafeCSS } from 'lit';
-import { hostStyles } from '../tuix-checkbox/TuixCheckbox.styles.js';
-import { Palette } from '../utils/colors.js';
-import { ScreenSizes } from '../utils/screenSizes.enum.js';
+import { hostStyles } from '../tuix-checkbox/TuixCheckbox.styles';
+import { Palette } from '../utils/colors';
+import { ScreenSizes } from '../utils/screenSizes.enum';
 export const radioHostStyles = css `
   ${hostStyles}
   :host {

package/dist/src/tuix-radio-button/interfaces/tuix-radio-button.interface.d.ts

@@ -1,3 +1,3 @@
-import { type DetailValue } from '../../utils/interfaces/detail-value.interface.js';
+import { type DetailValue } from '../../utils/interfaces/detail-value.interface';
 export type TuixRadioButtonOption = string | number;
 export type CustomEventTuixRadioButton<T extends TuixRadioButtonOption = TuixRadioButtonOption> = CustomEvent<DetailValue<T>>;

package/dist/src/tuix-table/TuixTable.d.ts

@@ -1,9 +1,10 @@
 import { LitElement } from 'lit';
 import '../tuix-icon/TuixIcon.js';
 import '../tuix-text/TuixText.js';
-import type { IDataTableHeader, ThreeDotsLoaderConfig } from './interfaces/tuix-table.interface.js';
+import type { IDataTableHeader, SortDirection, ThreeDotsLoaderConfig } from './interfaces/tuix-table.interface.js';
 export declare class TuixTable extends LitElement {
     static styles: import("lit").CSSResult[];
+    dark: boolean;
     paginated: boolean;
     disableMobileTable: boolean;
     showMobileTableInTablet: boolean;
@@ -15,6 +16,8 @@ export declare class TuixTable extends LitElement {
     currentPage?: number;
     currentSize?: number;
     isLoadingData: boolean;
+    sortBy?: string;
+    sortDirection: SortDirection;
     private _isTabletView;
     private _isMobileView;
     private _headerPercents;
@@ -32,9 +35,13 @@ export declare class TuixTable extends LitElement {
     private _nextPage;
     private _prevPage;
     private _setPageSize;
+    private _sort;
     private _computeHeaderPercents;
-    private _cellStyleString;
+    private _cellBackgroundColor;
     private _textVariantColor;
+    private _renderSortIcons;
+    private _ariaSort;
+    private _onHeaderKeyDown;
     private _renderHeaderCells;
     private _renderCell;
     private _renderRows;
@@ -43,6 +50,7 @@ export declare class TuixTable extends LitElement {
     private _renderSpinner;
     private _renderPagination;
     private _renderTable;
+    private _renderCard;
     private _renderCards;
     render(): import("lit-html").TemplateResult<1>;
 }