tuix-webcomponents 0.62.0 → 0.63.0

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);
@@ -13,6 +13,19 @@ let TuixIcon = class TuixIcon extends LitElement {
         this.size = IconSizeVariant.SMALL;
         this.dark = false;
     }
+    static { this.styles = css `
+    .icon-component {
+      width: 24px;
+      height: 24px;
+      display: block;
+    }
+
+    svg {
+      width: 100%;
+      height: 100%;
+      display: block;
+    }
+  `; }
     _getSelectedColor(color) {
         let selectedColor = color || this.color || TextVariant.PRIMARY;
         if (Object.values(TextVariant).includes(selectedColor)) {
@@ -33,8 +46,7 @@ let TuixIcon = class TuixIcon extends LitElement {
         return iconTemplate(this.name, this._getSelectedColor(), this._getSelectedFill());
     }
     render() {
-        var _a;
-        const selectedSize = (_a = iconSize[this.size]) !== null && _a !== void 0 ? _a : iconSize[IconSizeVariant.SMALL];
+        const selectedSize = iconSize[this.size] ?? iconSize[IconSizeVariant.SMALL];
         const dynamicStyles = {
             width: selectedSize,
             height: selectedSize,
@@ -46,19 +58,6 @@ let TuixIcon = class TuixIcon extends LitElement {
     `;
     }
 };
-TuixIcon.styles = css `
-    .icon-component {
-      width: 24px;
-      height: 24px;
-      display: block;
-    }
-
-    svg {
-      width: 100%;
-      height: 100%;
-      display: block;
-    }
-  `;
 __decorate([
     property({ type: IconName })
 ], TuixIcon.prototype, "name", void 0);
@@ -78,4 +77,3 @@ TuixIcon = __decorate([
     customElement('tuix-icon')
 ], TuixIcon);
 export { TuixIcon };
-//# sourceMappingURL=TuixIcon.js.map

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

@@ -67,4 +67,3 @@ export var IconName;
     IconName["ARCHIVE"] = "archive";
     IconName["ACCESS_TOKEN"] = "access-token";
 })(IconName || (IconName = {}));
-//# sourceMappingURL=tuix-icon.enums.js.map

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

@@ -1,6 +1,6 @@
-import { TemplateResult } from 'lit';
-import { IconName } from '../tuix-icon/enums/tuix-icon.enums.js';
-import { TuixBaseButton } from '../tuix-button/TuixBaseButton.js';
+import { type TemplateResult } from 'lit';
+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,26 +1,17 @@
 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);
         this.icon = IconName.ARROW_DOWN;
     }
-    _updateIconColor() {
-        if (!this.icon)
-            return;
-        this.iconColor = this._getTextColor();
-    }
-    _buttonContent() {
-        return html `${this._iconTemplate(this.icon, IconSizeVariant.MEDIUM)}`;
-    }
-};
-TuixIconButton.styles = [
-    css `
+    static { this.styles = [
+        css `
       .button {
         padding: 16px;
         border-radius: 4px;
@@ -39,9 +30,18 @@ TuixIconButton.styles = [
         }
       }
     `,
-    hostButtonStyles,
-    buttonColorStyles,
-];
+        hostButtonStyles,
+        buttonColorStyles,
+    ]; }
+    _updateIconColor() {
+        if (!this.icon)
+            return;
+        this.iconColor = this._getTextColor();
+    }
+    _buttonContent() {
+        return html `${this._iconTemplate(this.icon, IconSizeVariant.MEDIUM)}`;
+    }
+};
 __decorate([
     property({ type: IconName })
 ], TuixIconButton.prototype, "icon", void 0);
@@ -49,4 +49,3 @@ TuixIconButton = __decorate([
     customElement('tuix-icon-button')
 ], TuixIconButton);
 export { TuixIconButton };
-//# sourceMappingURL=TuixIconButton.js.map

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

@@ -1,6 +1,6 @@
-import { LitElement, TemplateResult, CSSResult, PropertyValueMap } from 'lit';
+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';
@@ -12,7 +12,6 @@ import { InputState, } from './interfaces/tuix-input.interface.js';
 import { v4 as uuidv4 } from 'uuid';
 let TuixInput = class TuixInput extends LitElement {
     constructor() {
-        var _a;
         super(...arguments);
         this._inputId = this._setIdInput();
         this.disabled = false;
@@ -25,7 +24,7 @@ let TuixInput = class TuixInput extends LitElement {
         this.readonly = false;
         this.autofocus = false;
         this._type = this.type;
-        this._letterCounter = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0;
+        this._letterCounter = this.value?.length || 0;
         this._previousType = this.type;
         this._previousValue = '';
         this._generalIconColorsLight = {
@@ -39,6 +38,16 @@ let TuixInput = class TuixInput extends LitElement {
             [InputState.DISABLED]: DarkPalette.PRIMARY_800,
         };
     }
+    static { this.styles = [
+        hostStyles,
+        inputComponentStyles,
+        inputFontStyles,
+        inputColorStyles,
+        inputTitleStyles,
+        inputIconStyles,
+        inputSearchStyles,
+        inputDescriptionStyles,
+    ]; }
     _handleInputBase(e, eventName) {
         this.dispatchEvent(new CustomEvent(eventName, {
             detail: {
@@ -92,9 +101,8 @@ let TuixInput = class TuixInput extends LitElement {
     </div>`;
     }
     _updateLetterCounter() {
-        var _a;
         if (this.maxlength != undefined && this.type === InputType.TEXT_AREA) {
-            this._letterCounter = Number((_a = this._inputElement.value) === null || _a === void 0 ? void 0 : _a.length);
+            this._letterCounter = Number(this._inputElement.value?.length);
         }
     }
     _getInputTextFeatureTemplate() {
@@ -244,7 +252,6 @@ let TuixInput = class TuixInput extends LitElement {
     </tuix-icon>`;
     }
     _getDescriptionTemplate() {
-        var _a;
         const isValidDescriptionType = this._hasValidDescriptionType();
         if (!isValidDescriptionType) {
             return html `<div></div>`;
@@ -259,7 +266,7 @@ let TuixInput = class TuixInput extends LitElement {
         return html `<div class="t-input-description">
       ${this._getIconDescriptionTemplate()}
       <span
-        >${(_a = this.description) !== null && _a !== void 0 ? _a : defaultDescription[this.descriptionType]}</span
+        >${this.description ?? defaultDescription[this.descriptionType]}</span
       >
     </div>`;
     }
@@ -312,16 +319,6 @@ let TuixInput = class TuixInput extends LitElement {
         }
     }
 };
-TuixInput.styles = [
-    hostStyles,
-    inputComponentStyles,
-    inputFontStyles,
-    inputColorStyles,
-    inputTitleStyles,
-    inputIconStyles,
-    inputSearchStyles,
-    inputDescriptionStyles,
-];
 __decorate([
     property({ type: Boolean, reflect: true })
 ], TuixInput.prototype, "disabled", void 0);
@@ -371,4 +368,3 @@ TuixInput = __decorate([
     customElement('tuix-input')
 ], TuixInput);
 export { TuixInput };
-//# sourceMappingURL=TuixInput.js.map

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',
@@ -293,4 +293,3 @@ export const inputDescriptionStyles = css `
     gap: 0.5rem;
   }
 `;
-//# sourceMappingURL=TuixInput.styles.js.map

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";
@@ -39,4 +39,3 @@ export const IconDescriptionColorDark = {
     [DescriptionType.SUCCESS]: DarkPalette.SUCCESS,
     [DescriptionType.LOADING]: DarkPalette.PRIMARY_300,
 };
-//# sourceMappingURL=tuix-input.enums.js.map

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

@@ -1,13 +1,14 @@
-import { IconName } from '../../tuix-icon/enums/tuix-icon.enums.js';
-import { 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';
-export declare enum InputState {
-    INACTIVE = "inactive",
-    ACTIVE = "active",
-    DISABLED = "disabled"
-}
+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;
+    DISABLED: string;
+};
+export type InputState = (typeof InputState)[keyof typeof InputState];
 export interface FormatIconSetParams {
     iconName: IconName;
     colorByState: Record<InputState, DarkPalette | Palette>;

package/dist/src/tuix-input/interfaces/tuix-input.interface.js

@@ -1,7 +1,5 @@
-export var InputState;
-(function (InputState) {
-    InputState["INACTIVE"] = "inactive";
-    InputState["ACTIVE"] = "active";
-    InputState["DISABLED"] = "disabled";
-})(InputState || (InputState = {}));
-//# sourceMappingURL=tuix-input.interface.js.map
+export const InputState = {
+    INACTIVE: 'inactive',
+    ACTIVE: 'active',
+    DISABLED: 'disabled',
+};

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

@@ -1,6 +1,6 @@
-import { LitElement, TemplateResult } from 'lit';
-import { MainVariant } from '../utils/mainVariant.enum.js';
-import { LinkTarget } from './enums/linkTarget.enum.js';
+import { LitElement, type TemplateResult } from 'lit';
+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);
@@ -14,6 +14,7 @@ let TuixLink = class TuixLink extends LitElement {
         this.disabled = false;
         this.dark = false;
     }
+    static { this.styles = [linkStyles, linkFontStyles]; }
     _getClassMap() {
         return {
             link: true,
@@ -49,7 +50,6 @@ let TuixLink = class TuixLink extends LitElement {
         }
     }
 };
-TuixLink.styles = [linkStyles, linkFontStyles];
 __decorate([
     property({ type: String })
 ], TuixLink.prototype, "href", void 0);
@@ -69,4 +69,3 @@ TuixLink = __decorate([
     customElement('tuix-link')
 ], TuixLink);
 export { TuixLink };
-//# sourceMappingURL=TuixLink.js.map

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(`
@@ -53,4 +53,3 @@ export const linkStyles = css `
   }  
 `)}
 `;
-//# sourceMappingURL=TuixLink.styles.js.map

package/dist/src/tuix-link/enums/linkTarget.enum.js

@@ -5,4 +5,3 @@ export var LinkTarget;
     LinkTarget["PARENT"] = "_parent";
     LinkTarget["TOP"] = "_top";
 })(LinkTarget || (LinkTarget = {}));
-//# sourceMappingURL=linkTarget.enum.js.map

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

@@ -12,6 +12,7 @@ let TuixModal = class TuixModal extends LitElement {
         this.dark = false;
         this.scrollable = false;
     }
+    static { this.styles = [commonModalStyles, mobileModalStyles]; }
     _onClose() {
         this.visible = false;
         this.dispatchEvent(new CustomEvent('on-close', { bubbles: true }));
@@ -47,7 +48,6 @@ let TuixModal = class TuixModal extends LitElement {
     `;
     }
 };
-TuixModal.styles = [commonModalStyles, mobileModalStyles];
 __decorate([
     property({ type: Boolean, reflect: true })
 ], TuixModal.prototype, "visible", void 0);
@@ -61,4 +61,3 @@ TuixModal = __decorate([
     customElement('tuix-modal')
 ], TuixModal);
 export { TuixModal };
-//# sourceMappingURL=TuixModal.js.map

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;
@@ -53,4 +53,3 @@ export const mobileModalStyles = css `
     }
   }
 `;
-//# sourceMappingURL=TuixModal.styles.js.map

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

@@ -1,5 +1,5 @@
-import { LitElement, TemplateResult } from 'lit';
-import { BorderRadiusPaper, PaperElevation } from './enums/tuix-paper.enum.js';
+import { LitElement, type TemplateResult } from 'lit';
+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);
@@ -12,6 +12,7 @@ let TuixPaper = class TuixPaper extends LitElement {
         this.borderRadius = BorderRadiusPaper.NONE;
         this.dark = false;
     }
+    static { this.styles = [paperStyles]; }
     _getOptionalClasses() {
         const variantClass = `variant_${this.elevation}`;
         const darkClass = `dark_${this.elevation}`;
@@ -30,7 +31,6 @@ let TuixPaper = class TuixPaper extends LitElement {
     </div>`;
     }
 };
-TuixPaper.styles = [paperStyles];
 __decorate([
     property({ type: PaperElevation })
 ], TuixPaper.prototype, "elevation", void 0);
@@ -44,4 +44,3 @@ TuixPaper = __decorate([
     customElement('tuix-paper')
 ], TuixPaper);
 export { TuixPaper };
-//# sourceMappingURL=TuixPaper.js.map

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) => `
@@ -28,4 +28,3 @@ export const paperStyles = css `
   }
 `)}
 `;
-//# sourceMappingURL=TuixPaper.styles.js.map

package/dist/src/tuix-paper/enums/tuix-paper.enum.js

@@ -13,4 +13,3 @@ export var BorderRadiusPaper;
     BorderRadiusPaper["MEDIUM"] = "10px";
     BorderRadiusPaper["STRONG"] = "20px";
 })(BorderRadiusPaper || (BorderRadiusPaper = {}));
-//# sourceMappingURL=tuix-paper.enum.js.map

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

@@ -1,6 +1,6 @@
 import { LitElement } from 'lit';
-import { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums.js';
-import { 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

@@ -2,9 +2,9 @@ import { __decorate } from "tslib";
 import { LitElement, html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.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);
@@ -15,6 +15,13 @@ let TuixRadioButton = class TuixRadioButton extends LitElement {
         this.labelSide = CheckboxLabelSide.RIGHT;
         this.selectedOption = null;
     }
+    static { this.styles = [
+        radioHostStyles,
+        radioButtonContainerStyles,
+        radioButtonStyles,
+        radioButtonInnerStyles,
+        radioButtonLabelStyles,
+    ]; }
     _onRadioButtonChange(event) {
         this.dispatchEvent(new CustomEvent('change', {
             detail: {
@@ -64,13 +71,6 @@ let TuixRadioButton = class TuixRadioButton extends LitElement {
         return html `${this.options.map((option, index) => this._formatTemplate(option, index))}`;
     }
 };
-TuixRadioButton.styles = [
-    radioHostStyles,
-    radioButtonContainerStyles,
-    radioButtonStyles,
-    radioButtonInnerStyles,
-    radioButtonLabelStyles,
-];
 __decorate([
     property({ type: Boolean, reflect: true })
 ], TuixRadioButton.prototype, "disabled", void 0);
@@ -93,4 +93,3 @@ TuixRadioButton = __decorate([
     customElement('tuix-radio-button')
 ], TuixRadioButton);
 export { TuixRadioButton };
-//# sourceMappingURL=TuixRadioButton.js.map

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 {
@@ -133,4 +133,3 @@ export const radioButtonLabelStyles = css `
     margin-left: 0;
   }
 `;
-//# sourceMappingURL=TuixRadioButton.styles.js.map

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

@@ -1,3 +1,3 @@
-import { 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-radio-button/interfaces/tuix-radio-button.interface.js

@@ -1,2 +1 @@
 export {};
-//# sourceMappingURL=tuix-radio-button.interface.js.map