tuix-webcomponents 0.62.0 → 0.63.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/README.md +2 -2
  2. package/dist/src/index.d.ts +8 -8
  3. package/dist/src/index.js +0 -1
  4. package/dist/src/tuix-button/TuixBaseButton.d.ts +3 -3
  5. package/dist/src/tuix-button/TuixBaseButton.js +3 -5
  6. package/dist/src/tuix-button/TuixButton.d.ts +3 -3
  7. package/dist/src/tuix-button/TuixButton.js +27 -28
  8. package/dist/src/tuix-button/TuixButton.styles.js +6 -7
  9. package/dist/src/tuix-button/enums/tuix-button.enums.d.ts +1 -1
  10. package/dist/src/tuix-button/enums/tuix-button.enums.js +2 -3
  11. package/dist/src/tuix-button/interfaces/tuix-button.interface.js +0 -1
  12. package/dist/src/tuix-checkbox/TuixCheckbox.d.ts +2 -2
  13. package/dist/src/tuix-checkbox/TuixCheckbox.js +10 -11
  14. package/dist/src/tuix-checkbox/TuixCheckbox.styles.js +3 -4
  15. package/dist/src/tuix-checkbox/enums/tuix-checkbox.enums.d.ts +2 -2
  16. package/dist/src/tuix-checkbox/enums/tuix-checkbox.enums.js +2 -3
  17. package/dist/src/tuix-checkbox/interfaces/tuix-checkbox.interface.d.ts +1 -1
  18. package/dist/src/tuix-checkbox/interfaces/tuix-checkbox.interface.js +0 -1
  19. package/dist/src/tuix-dropdown/TuixDropdown.d.ts +4 -4
  20. package/dist/src/tuix-dropdown/TuixDropdown.js +26 -34
  21. package/dist/src/tuix-dropdown/TuixDropdown.styles.js +4 -5
  22. package/dist/src/tuix-dropdown/enums/tuix-dropdown.enums.js +0 -1
  23. package/dist/src/tuix-dropdown/interfaces/tuix-dropdown.interface.d.ts +2 -2
  24. package/dist/src/tuix-dropdown/interfaces/tuix-dropdown.interface.js +0 -1
  25. package/dist/src/tuix-icon/TuixIcon.d.ts +2 -2
  26. package/dist/src/tuix-icon/TuixIcon.icons.d.ts +3 -3
  27. package/dist/src/tuix-icon/TuixIcon.icons.js +2 -3
  28. package/dist/src/tuix-icon/TuixIcon.js +18 -20
  29. package/dist/src/tuix-icon/enums/tuix-icon.enums.js +0 -1
  30. package/dist/src/tuix-icon-button/TuixIconButton.d.ts +3 -3
  31. package/dist/src/tuix-icon-button/TuixIconButton.js +18 -19
  32. package/dist/src/tuix-input/TuixInput.d.ts +2 -2
  33. package/dist/src/tuix-input/TuixInput.js +14 -18
  34. package/dist/src/tuix-input/TuixInput.styles.js +4 -5
  35. package/dist/src/tuix-input/enums/tuix-input.enums.d.ts +3 -3
  36. package/dist/src/tuix-input/enums/tuix-input.enums.js +3 -4
  37. package/dist/src/tuix-input/interfaces/tuix-input.interface.d.ts +11 -10
  38. package/dist/src/tuix-input/interfaces/tuix-input.interface.js +5 -7
  39. package/dist/src/tuix-link/TuixLink.d.ts +3 -3
  40. package/dist/src/tuix-link/TuixLink.js +5 -6
  41. package/dist/src/tuix-link/TuixLink.styles.js +3 -4
  42. package/dist/src/tuix-link/enums/linkTarget.enum.js +0 -1
  43. package/dist/src/tuix-modal/TuixModal.js +1 -2
  44. package/dist/src/tuix-modal/TuixModal.styles.js +2 -3
  45. package/dist/src/tuix-paper/TuixPaper.d.ts +2 -2
  46. package/dist/src/tuix-paper/TuixPaper.js +3 -4
  47. package/dist/src/tuix-paper/TuixPaper.styles.js +2 -3
  48. package/dist/src/tuix-paper/enums/tuix-paper.enum.js +0 -1
  49. package/dist/src/tuix-radio-button/TuixRadioButton.d.ts +2 -2
  50. package/dist/src/tuix-radio-button/TuixRadioButton.js +10 -11
  51. package/dist/src/tuix-radio-button/TuixRadioButton.styles.js +3 -4
  52. package/dist/src/tuix-radio-button/interfaces/tuix-radio-button.interface.d.ts +1 -1
  53. package/dist/src/tuix-radio-button/interfaces/tuix-radio-button.interface.js +0 -1
  54. package/dist/src/tuix-table/TuixTable.js +12 -18
  55. package/dist/src/tuix-table/TuixTable.styles.js +1 -2
  56. package/dist/src/tuix-table/interfaces/tuix-table.interface.js +0 -1
  57. package/dist/src/tuix-text/TuixText.js +12 -13
  58. package/dist/src/tuix-text/TuixText.styles.js +3 -4
  59. package/dist/src/tuix-text/enums/tuix-text.enums.js +2 -3
  60. package/dist/src/tuix-toast/TuixToast.d.ts +2 -2
  61. package/dist/src/tuix-toast/TuixToast.js +1 -2
  62. package/dist/src/tuix-toast/TuixToast.styles.js +1 -2
  63. package/dist/src/tuix-toast/enums/tuix-toast.enums.d.ts +3 -3
  64. package/dist/src/tuix-toast/enums/tuix-toast.enums.js +3 -4
  65. package/dist/src/tuix-toggle-button/TuixToggleButton.d.ts +1 -1
  66. package/dist/src/tuix-toggle-button/TuixToggleButton.js +10 -11
  67. package/dist/src/tuix-toggle-button/TuixToggleButton.styles.js +4 -5
  68. package/dist/src/tuix-toggle-button/interfaces/tuix-toggle.interface.d.ts +1 -1
  69. package/dist/src/tuix-toggle-button/interfaces/tuix-toggle.interface.js +0 -1
  70. package/dist/src/utils/colors.js +0 -1
  71. package/dist/src/utils/darkColors.js +0 -1
  72. package/dist/src/utils/hex-rgb.js +0 -1
  73. package/dist/src/utils/interfaces/detail-value.interface.js +0 -1
  74. package/dist/src/utils/mainVariant.enum.js +0 -1
  75. package/dist/src/utils/screenSizes.enum.js +0 -1
  76. package/dist/src/utils/slottedClassName.js +0 -1
  77. package/dist/tsconfig.publish.tsbuildinfo +1 -1
  78. package/package.json +77 -53
  79. package/dist/assets/tuix-styles.css +0 -58
  80. package/dist/src/index.js.map +0 -1
  81. package/dist/src/tuix-button/TuixBaseButton.js.map +0 -1
  82. package/dist/src/tuix-button/TuixButton.js.map +0 -1
  83. package/dist/src/tuix-button/TuixButton.styles.js.map +0 -1
  84. package/dist/src/tuix-button/enums/tuix-button.enums.js.map +0 -1
  85. package/dist/src/tuix-button/interfaces/tuix-button.interface.js.map +0 -1
  86. package/dist/src/tuix-checkbox/TuixCheckbox.js.map +0 -1
  87. package/dist/src/tuix-checkbox/TuixCheckbox.styles.js.map +0 -1
  88. package/dist/src/tuix-checkbox/enums/tuix-checkbox.enums.js.map +0 -1
  89. package/dist/src/tuix-checkbox/interfaces/tuix-checkbox.interface.js.map +0 -1
  90. package/dist/src/tuix-dropdown/TuixDropdown.js.map +0 -1
  91. package/dist/src/tuix-dropdown/TuixDropdown.styles.js.map +0 -1
  92. package/dist/src/tuix-dropdown/enums/tuix-dropdown.enums.js.map +0 -1
  93. package/dist/src/tuix-dropdown/interfaces/tuix-dropdown.interface.js.map +0 -1
  94. package/dist/src/tuix-icon/TuixIcon.icons.js.map +0 -1
  95. package/dist/src/tuix-icon/TuixIcon.js.map +0 -1
  96. package/dist/src/tuix-icon/enums/tuix-icon.enums.js.map +0 -1
  97. package/dist/src/tuix-icon-button/TuixIconButton.js.map +0 -1
  98. package/dist/src/tuix-input/TuixInput.js.map +0 -1
  99. package/dist/src/tuix-input/TuixInput.styles.js.map +0 -1
  100. package/dist/src/tuix-input/enums/tuix-input.enums.js.map +0 -1
  101. package/dist/src/tuix-input/interfaces/tuix-input.interface.js.map +0 -1
  102. package/dist/src/tuix-link/TuixLink.js.map +0 -1
  103. package/dist/src/tuix-link/TuixLink.styles.js.map +0 -1
  104. package/dist/src/tuix-link/enums/linkTarget.enum.js.map +0 -1
  105. package/dist/src/tuix-modal/TuixModal.js.map +0 -1
  106. package/dist/src/tuix-modal/TuixModal.styles.js.map +0 -1
  107. package/dist/src/tuix-paper/TuixPaper.js.map +0 -1
  108. package/dist/src/tuix-paper/TuixPaper.styles.js.map +0 -1
  109. package/dist/src/tuix-paper/enums/tuix-paper.enum.js.map +0 -1
  110. package/dist/src/tuix-radio-button/TuixRadioButton.js.map +0 -1
  111. package/dist/src/tuix-radio-button/TuixRadioButton.styles.js.map +0 -1
  112. package/dist/src/tuix-radio-button/interfaces/tuix-radio-button.interface.js.map +0 -1
  113. package/dist/src/tuix-table/TuixTable.js.map +0 -1
  114. package/dist/src/tuix-table/TuixTable.styles.js.map +0 -1
  115. package/dist/src/tuix-table/interfaces/tuix-table.interface.js.map +0 -1
  116. package/dist/src/tuix-text/TuixText.js.map +0 -1
  117. package/dist/src/tuix-text/TuixText.styles.js.map +0 -1
  118. package/dist/src/tuix-text/enums/tuix-text.enums.js.map +0 -1
  119. package/dist/src/tuix-toast/TuixToast.js.map +0 -1
  120. package/dist/src/tuix-toast/TuixToast.styles.js.map +0 -1
  121. package/dist/src/tuix-toast/enums/tuix-toast.enums.js.map +0 -1
  122. package/dist/src/tuix-toggle-button/TuixToggleButton.js.map +0 -1
  123. package/dist/src/tuix-toggle-button/TuixToggleButton.styles.js.map +0 -1
  124. package/dist/src/tuix-toggle-button/interfaces/tuix-toggle.interface.js.map +0 -1
  125. package/dist/src/utils/colors.js.map +0 -1
  126. package/dist/src/utils/darkColors.js.map +0 -1
  127. package/dist/src/utils/hex-rgb.js.map +0 -1
  128. package/dist/src/utils/interfaces/detail-value.interface.js.map +0 -1
  129. package/dist/src/utils/mainVariant.enum.js.map +0 -1
  130. package/dist/src/utils/screenSizes.enum.js.map +0 -1
  131. package/dist/src/utils/slottedClassName.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixIconButton.js","sourceRoot":"","sources":["../../../src/tuix-icon-button/TuixIconButton.ts"],"names":[],"mappings":";AAAA,OAAO,EAAkB,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EACL,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAG/D,IAAa,cAAc,GAA3B,MAAa,cAAe,SAAQ,cAAc;IAAlD;;QA0BE,SAAI,GAAG,QAAQ,CAAC,UAAU,CAAC;IAU7B,CAAC;IARoB,gBAAgB;QACjC,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO;QACvB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;IACxC,CAAC;IAEkB,cAAc;QAC/B,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,MAAM,CAAC,EAAE,CAAC;IACxE,CAAC;;AAlCM,qBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;2CAOoC,WAAW,CAAC,MAAM;;;;;;2CAMlB,WAAW,CAAC,MAAM;;;;;KAKxD;IACD,gBAAgB;IAChB,iBAAiB;CAClB,AAtBY,CAsBX;AAGF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;4CACF;AA1BhB,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAoC1B;SApCY,cAAc","sourcesContent":["import { TemplateResult, css, html } from 'lit';\nimport { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\nimport {\n buttonColorStyles,\n hostButtonStyles,\n} from '../tuix-button/TuixButton.styles';\nimport { TuixBaseButton } from '../tuix-button/TuixBaseButton';\n\n@customElement('tuix-icon-button')\nexport class TuixIconButton extends TuixBaseButton {\n static styles = [\n css`\n .button {\n padding: 16px;\n border-radius: 4px;\n border: none;\n }\n\n @media only screen and (max-width: ${ScreenSizes.TABLET}px) {\n .button {\n padding: 12px;\n }\n }\n\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .button {\n padding: 8px;\n }\n }\n `,\n hostButtonStyles,\n buttonColorStyles,\n ];\n\n @property({ type: IconName })\n icon = IconName.ARROW_DOWN;\n\n protected override _updateIconColor() {\n if (!this.icon) return;\n this.iconColor = this._getTextColor();\n }\n\n protected override _buttonContent(): TemplateResult {\n return html`${this._iconTemplate(this.icon, IconSizeVariant.MEDIUM)}`;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixInput.js","sourceRoot":"","sources":["../../../src/tuix-input/TuixInput.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n LitElement,\n TemplateResult,\n html,\n nothing,\n CSSResult,\n PropertyValueMap,\n} from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '../tuix-icon/TuixIcon.js';\nimport { IconName, IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums';\nimport { Palette } from '../utils/colors.js';\nimport { DarkPalette } from '../utils/darkColors.js';\nimport {\n hostStyles,\n inputColorStyles,\n inputComponentStyles,\n inputDescriptionStyles,\n inputFontStyles,\n inputIconStyles,\n inputSearchStyles,\n inputTitleStyles,\n} from './TuixInput.styles.js';\nimport {\n DescriptionType,\n IconByDescriptionType,\n IconDescriptionColorDark,\n IconDescriptionColorLight,\n InputIconLocation,\n InputType,\n} from './enums/tuix-input.enums.js';\nimport {\n FormatIconSetParams,\n InputState,\n} from './interfaces/tuix-input.interface.js';\nimport { v4 as uuidv4 } from 'uuid';\n\n@customElement('tuix-input')\nexport class TuixInput extends LitElement {\n _inputId: string = this._setIdInput();\n\n static styles: CSSResult[] = [\n hostStyles,\n inputComponentStyles,\n inputFontStyles,\n inputColorStyles,\n inputTitleStyles,\n inputIconStyles,\n inputSearchStyles,\n inputDescriptionStyles,\n ];\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: IconName })\n iconRight?: IconName;\n\n @property({ type: String })\n value = '';\n\n @property({ type: String })\n placeholder = '';\n\n @property({ type: String })\n title = '';\n\n @property({ type: InputType })\n type = InputType.TEXT;\n\n @property({ type: Number })\n maxlength?: number;\n\n @property({ type: String })\n description?: string;\n\n @property({ type: DescriptionType })\n descriptionType = DescriptionType.TEXT;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n @property({ type: Boolean })\n readonly = false;\n\n @property({ type: Boolean, reflect: true })\n autofocus = false;\n\n @query('.t-input-container .t-input')\n private _inputElement!: HTMLInputElement;\n\n @state()\n private _type = this.type;\n\n @state()\n private _letterCounter = this.value?.length || 0;\n\n private _previousType = this.type;\n\n private _previousValue = '';\n\n private _generalIconColorsLight: Record<InputState, Palette> = {\n [InputState.INACTIVE]: Palette.BLACK,\n [InputState.ACTIVE]: Palette.MAIN,\n [InputState.DISABLED]: Palette.PRIMARY_300,\n };\n\n private _generalIconColorsDark: Record<InputState, DarkPalette> = {\n [InputState.INACTIVE]: DarkPalette.PRIMARY_100,\n [InputState.ACTIVE]: DarkPalette.MAIN,\n [InputState.DISABLED]: DarkPalette.PRIMARY_800,\n };\n\n private _handleInputBase(e: InputEvent, eventName: string) {\n this.dispatchEvent(\n new CustomEvent(eventName, {\n detail: {\n value:\n (e.target instanceof HTMLInputElement ||\n e.target instanceof HTMLTextAreaElement) &&\n e.target.value,\n },\n bubbles: true,\n })\n );\n }\n\n private _handleClickOnInput() {\n if (this.disabled) return;\n this.dispatchEvent(\n new CustomEvent('on-click', {\n bubbles: true,\n })\n );\n }\n\n private _handleInput(e: InputEvent) {\n this._handleInputBase(e, 'on-change');\n this._updateLetterCounter();\n }\n\n private _handleBlur(e: InputEvent) {\n this._handleInputBase(e, 'on-blur');\n }\n\n private _handlePasswordIconClick() {\n if (this._type === InputType.PASSWORD) {\n this._type = InputType.TEXT;\n this._inputElement.setAttribute('type', InputType.TEXT);\n } else {\n this._type = InputType.PASSWORD;\n this._inputElement.setAttribute('type', InputType.PASSWORD);\n }\n }\n\n private _formatIconSet({\n iconName,\n colorByState,\n location = InputIconLocation.RIGHT,\n clickHandler = undefined,\n }: FormatIconSetParams) {\n const iconSetContainerClasses = {\n 't-icon-set-container': true,\n 't-icon-click': !!clickHandler,\n [`t-icon-${location}`]: true,\n };\n return html`<div\n class=\"${classMap(iconSetContainerClasses)}\"\n @click=\"${clickHandler}\"\n >\n ${Object.entries(colorByState).map(\n ([state, color]) => html`<tuix-icon\n size=\"${IconSizeVariant.FULL}\"\n name=\"${iconName}\"\n color=\"${color}\"\n class=\"t-icon-${state}\"\n ></tuix-icon>`\n )}\n </div>`;\n }\n\n private _updateLetterCounter() {\n if (this.maxlength != undefined && this.type === InputType.TEXT_AREA) {\n this._letterCounter = Number(this._inputElement.value?.length);\n }\n }\n\n private _getInputTextFeatureTemplate(): TemplateResult {\n return html`${this.iconRight\n ? this._formatIconSet({\n iconName: this.iconRight,\n colorByState: this.dark\n ? this._generalIconColorsDark\n : this._generalIconColorsLight,\n })\n : nothing}`;\n }\n\n private _getInputSearchFeatureTemplate(): TemplateResult {\n const searchIconColorsLight: Record<InputState, Palette> = {\n [InputState.INACTIVE]: Palette.BLACK,\n [InputState.ACTIVE]: Palette.BLACK,\n [InputState.DISABLED]: Palette.PRIMARY_300,\n };\n\n const searchIconColorsDark: Record<InputState, DarkPalette> = {\n [InputState.INACTIVE]: DarkPalette.PRIMARY_100,\n [InputState.ACTIVE]: DarkPalette.PRIMARY_100,\n [InputState.DISABLED]: DarkPalette.PRIMARY_800,\n };\n\n return html`${this._formatIconSet({\n iconName: IconName.SEARCH,\n colorByState: this.dark ? searchIconColorsDark : searchIconColorsLight,\n location: InputIconLocation.LEFT,\n })}`;\n }\n\n private _getInputPasswordFeatureTemplate(): TemplateResult {\n return html`${this._formatIconSet({\n iconName:\n this._type === InputType.PASSWORD\n ? IconName.EYE_CLOSE_LINE\n : IconName.EYE_ON,\n colorByState: this.dark\n ? this._generalIconColorsDark\n : this._generalIconColorsLight,\n clickHandler: this._handlePasswordIconClick,\n })} `;\n }\n\n private _getFeatureTemplateByInputType(): TemplateResult {\n switch (this.type) {\n case InputType.SEARCH:\n return this._getInputSearchFeatureTemplate();\n case InputType.TEXT:\n return this._getInputTextFeatureTemplate();\n case InputType.PASSWORD:\n return this._getInputPasswordFeatureTemplate();\n default:\n return html`${nothing}`;\n }\n }\n\n private _getInputElementClasses() {\n const hasIconRight =\n this.type === InputType.PASSWORD || this.type === InputType.TEXT\n ? !!this.iconRight\n : false;\n return {\n 't-input': true,\n 't-textarea': this.type === InputType.TEXT_AREA,\n 'with-title': !!this.title,\n 'with-icon-right': hasIconRight,\n [`with-${this.descriptionType}`]:\n this.descriptionType !== DescriptionType.TEXT,\n };\n }\n\n private _getInputContainerClasses() {\n return {\n 't-input-container': true,\n 't-textarea-container': this.type === InputType.TEXT_AREA,\n };\n }\n\n private _getMainContainerClasses() {\n return {\n 't-textarea-main-container': this.type === InputType.TEXT_AREA,\n };\n }\n\n private _setIdInput() {\n return uuidv4();\n }\n\n private _getInputTemplate(): TemplateResult {\n return html`<input\n id=${this._inputId}\n type=\"text\"\n class=\"${classMap(this._getInputElementClasses())}\"\n ?disabled=\"${this.disabled}\"\n ?readonly=\"${this.readonly}\"\n .value=\"${this.value}\"\n .type=\"${this.type}\"\n placeholder=\"${this.placeholder || ' '}\"\n maxlength=\"${this.maxlength}\"\n @input=\"${this._handleInput}\"\n @blur=\"${this._handleBlur}\"\n >\n </input>\n ${\n this.title\n ? html`<label for=${this._inputId} class=\"t-title\"\n >${this.title}</label\n >`\n : nothing\n }\n ${this._getFeatureTemplateByInputType()}\n `;\n }\n\n private _getLetterCounterTemplate(): TemplateResult {\n if (!this._hasLetterCounter()) {\n return html`${nothing}`;\n }\n return html`<div class=\"t-letter-counter\">\n ${this.maxlength\n ? html`${this._letterCounter}/${this.maxlength}`\n : nothing}\n </div> `;\n }\n\n private _hasLetterCounter(): boolean {\n return (\n this.type === InputType.TEXT_AREA &&\n typeof this.maxlength === 'number' &&\n this.maxlength >= 0\n );\n }\n\n private _getTextAreaTemplate(): TemplateResult {\n return html`<textarea\n id=\"${this._inputId}\"\n class=\"${classMap(this._getInputElementClasses())}\"\n ?disabled=\"${this.disabled}\"\n ?readonly=\"${this.readonly}\"\n .value=\"${this.value}\"\n placeholder=\"${this.placeholder}\"\n maxlength=\"${this.maxlength}\"\n @input=\"${this._handleInput}\"\n @blur=\"${this._handleBlur}\"\n ></textarea>\n ${this.title\n ? html`<label for=${this._inputId} class=\"t-title\"\n >${this.title}</label\n >`\n : nothing} `;\n }\n\n private _getIconDescriptionTemplate(): TemplateResult {\n if (\n !this.descriptionType ||\n this.descriptionType === DescriptionType.TEXT\n ) {\n return html`${nothing}`;\n }\n return html`<tuix-icon\n size=\"${IconSizeVariant.SMALL}\"\n name=\"${IconByDescriptionType[this.descriptionType]}\"\n color=\"${this.dark\n ? IconDescriptionColorDark[this.descriptionType]\n : IconDescriptionColorLight[this.descriptionType]}\"\n >\n </tuix-icon>`;\n }\n\n private _getDescriptionTemplate(): TemplateResult {\n const isValidDescriptionType = this._hasValidDescriptionType();\n if (!isValidDescriptionType) {\n return html`<div></div>`;\n }\n const defaultDescription = {\n [DescriptionType.WARNING]: 'Warning',\n [DescriptionType.ERROR]: 'Error',\n [DescriptionType.SUCCESS]: 'Success',\n [DescriptionType.LOADING]: 'Loading',\n [DescriptionType.TEXT]: '',\n };\n return html`<div class=\"t-input-description\">\n ${this._getIconDescriptionTemplate()}\n <span\n >${this.description ?? defaultDescription[this.descriptionType]}</span\n >\n </div>`;\n }\n\n private _hasValidDescriptionType(): boolean {\n return Object.values(DescriptionType).includes(this.descriptionType);\n }\n\n private _getDescriptionContainerTemplate(): TemplateResult {\n const hasLetterCounter = this._hasLetterCounter();\n const hasDescription =\n this._hasValidDescriptionType() &&\n (this.descriptionType === DescriptionType.TEXT\n ? !!this.description\n : true);\n if (!hasLetterCounter && !hasDescription) {\n return html`${nothing}`;\n }\n return html`<div class=\"t-input-description-container\">\n ${this._getDescriptionTemplate()} ${this._getLetterCounterTemplate()}\n </div>`;\n }\n\n protected render(): TemplateResult {\n if (this._previousType !== this.type) {\n this._previousType = this.type;\n this._type = this.type;\n }\n if (this._previousValue !== this.value) {\n this._previousValue = this.value;\n this._letterCounter = this.value.length;\n }\n return html`<div class=\"${classMap(this._getMainContainerClasses())}\">\n <div\n class=\"${classMap(this._getInputContainerClasses())}\"\n @click=\"${this._handleClickOnInput}\"\n >\n ${this.type === InputType.TEXT_AREA\n ? this._getTextAreaTemplate()\n : this._getInputTemplate()}\n </div>\n ${this._getDescriptionContainerTemplate()}\n </div>`;\n }\n\n protected updated(changedProperties: PropertyValueMap<unknown>) {\n for (const [propName] of changedProperties) {\n if (this.disabled || this.readonly) break;\n if (String(propName) !== 'autofocus') continue;\n if (this.autofocus) {\n this._inputElement.focus();\n }\n }\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixInput.styles.js","sourceRoot":"","sources":["../../../src/tuix-input/TuixInput.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\nimport { Palette } from '../utils/colors';\nimport { DarkPalette } from '../utils/darkColors';\nimport { hexToRgb } from '../utils/hex-rgb';\n\nconst inputVars = {\n gapX: '10px',\n iconDesktopSize: '1.5rem',\n iconMobileSize: '1rem',\n paddingX: '1.25rem',\n};\n\nconst rgbDarkValidation = hexToRgb(DarkPalette.VALIDATION);\nconst rgbDarkError = hexToRgb(DarkPalette.ERROR);\n\nexport const hostStyles = css`\n :host {\n --t-field-color-form: ${unsafeCSS(Palette.PRIMARY_50)};\n --t-field-color-title: ${unsafeCSS(Palette.PRIMARY_600)};\n --t-field-color-text: ${unsafeCSS(Palette.BLACK)};\n --t-field-color-description: ${unsafeCSS(Palette.NEUTRAL_600)};\n --t-field-color-stroke-hover: ${unsafeCSS(Palette.PRIMARY_300)};\n --t-field-color-stroke-focus: ${unsafeCSS(Palette.MAIN)};\n --t-field-color-text-disabled: ${unsafeCSS(Palette.PRIMARY_300)};\n --t-field-color-stroke-validation: ${unsafeCSS(Palette.VALIDATION_200)};\n --t-field-color-bg-validation: ${unsafeCSS(Palette.VALIDATION_50)};\n --t-field-color-stroke-loading: ${unsafeCSS(Palette.PRIMARY_300)};\n --t-field-color-bg-error: ${unsafeCSS(Palette.ERROR_50)};\n --t-field-color-stroke-error: ${unsafeCSS(Palette.ERROR_200)};\n --t-field-input-cursor: auto;\n --t-field-font-size: 1rem;\n --t-field-font-weight: 300;\n --t-field-line-height: 1.25rem;\n --t-field-padding-x: 1.25rem;\n --t-field-padding-y: 1.125rem;\n --t-field-padding-top: 1.625rem;\n --t-field-padding-bottom: 0.625rem;\n --t-field-title-left-position: 1.25rem;\n }\n :host([dark]) {\n --t-field-color-form: ${unsafeCSS(DarkPalette.PRIMARY_950)};\n --t-field-color-text: ${unsafeCSS(DarkPalette.PRIMARY_100)};\n --t-field-color-description: ${unsafeCSS(DarkPalette.NEUTRAL_200)};\n --t-field-color-stroke-focus: ${unsafeCSS(DarkPalette.SECONDARY)};\n --t-field-color-text-disabled: ${unsafeCSS(DarkPalette.PRIMARY_800)};\n --t-field-color-stroke-validation: ${unsafeCSS(DarkPalette.VALIDATION_200)};\n --t-field-color-bg-validation: rgba(\n ${rgbDarkValidation.r},\n ${rgbDarkValidation.g},\n ${rgbDarkValidation.b},\n 0.2\n );\n --t-field-color-bg-error: rgba(\n ${rgbDarkError.r},\n ${rgbDarkError.g},\n ${rgbDarkError.b},\n 0.2\n );\n --t-field-color-stroke-error: ${unsafeCSS(DarkPalette.ERROR_200)};\n }\n`;\n\nexport const inputComponentStyles = css`\n .t-textarea-main-container {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n }\n .t-input-container {\n position: relative;\n --t-padding-x-desktop-with-icon: calc(\n var(--t-field-padding-x) + ${unsafeCSS(inputVars.iconDesktopSize)} +\n ${unsafeCSS(inputVars.gapX)}\n );\n --t-padding-x-mobile-with-icon: calc(\n var(--t-field-padding-x) + ${unsafeCSS(inputVars.iconMobileSize)} +\n ${unsafeCSS(inputVars.gapX)}\n );\n --t-border-size: 1px;\n }\n .t-input-container.t-textarea-container {\n height: 100%;\n }\n .t-input {\n padding: calc(var(--t-field-padding-y) - var(--t-border-size))\n var(--t-field-padding-x);\n border-radius: 4px;\n font-family: 'Rubik', sans-serif;\n cursor: var(--t-field-input-cursor);\n width: 100%;\n box-sizing: border-box;\n }\n .t-input.t-textarea {\n height: 100%;\n display: block;\n }\n .t-input.with-title {\n padding-top: calc(var(--t-field-padding-top) - var(--t-border-size));\n padding-bottom: calc(var(--t-field-padding-bottom) - var(--t-border-size));\n }\n .t-input.with-icon-right {\n padding-right: var(--t-padding-x-desktop-with-icon);\n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .t-input.with-icon-right {\n padding-right: var(--t-padding-x-mobile-with-icon);\n }\n }\n`;\n\nexport const inputFontStyles = css`\n .t-input::placeholder,\n .t-input,\n .t-title {\n font-size: var(--t-field-font-size);\n font-weight: var(--t-field-font-weight);\n line-height: var(--t-field-line-height);\n }\n @media only screen and (max-width: ${ScreenSizes.TABLET}px) {\n :host {\n --t-field-font-size: 0.813rem;\n --t-field-line-height: 1.125rem;\n --t-field-padding-y: 1.063rem;\n --t-field-padding-top: 1.5rem;\n }\n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n :host {\n --t-field-font-size: 0.813rem;\n --t-field-line-height: 1rem;\n --t-field-padding-y: 1rem;\n --t-field-padding-top: 1.375rem;\n }\n }\n`;\n\nexport const inputColorStyles = css`\n .t-input {\n background-color: var(--t-field-color-form);\n border: 1px solid var(--t-field-color-form);\n color: var(--t-field-color-text);\n }\n .t-input-container:hover .t-input,\n .t-input:hover {\n border: 1px solid var(--t-field-color-stroke-hover);\n }\n .t-input:focus {\n border: 1px solid var(--t-field-color-stroke-focus);\n outline: 1px solid var(--t-field-color-stroke-focus);\n }\n .t-input[disabled]:disabled {\n cursor: not-allowed;\n border: 1px solid var(--t-field-color-form);\n color: var(--t-field-color-text-disabled);\n }\n .t-input.with-title::placeholder {\n color: transparent;\n }\n .t-input::placeholder,\n .t-input.with-title:focus::placeholder {\n color: var(--t-field-color-title);\n }\n .t-input.with-warning {\n border: 1px solid var(--t-field-color-stroke-validation);\n background-color: var(--t-field-color-bg-validation);\n }\n .t-input.with-error {\n border: 1px solid var(--t-field-color-stroke-error);\n background-color: var(--t-field-color-bg-error);\n }\n .t-input.with-loading {\n border: 1px solid var(--t-field-color-stroke-loading);\n }\n`;\n\nexport const inputTitleStyles = css`\n .t-title {\n position: absolute;\n top: 50%;\n left: var(--t-field-title-left-position);\n font-family: 'Rubik', sans-serif;\n color: var(--t-field-color-title);\n transform: translateY(-50%);\n transition-duration: 0.3s;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n .t-textarea-container .t-title {\n top: 1rem;\n transform: none;\n }\n .t-input.with-title:focus + .t-title,\n .t-input.with-title:not(:placeholder-shown) + .t-title {\n font-size: 0.75rem;\n font-weight: 300;\n line-height: 0.875rem;\n transform: translateY(0);\n top: 0.5rem;\n }\n`;\n\nexport const inputIconStyles = css`\n .t-input-container .t-icon-set-container {\n height: ${unsafeCSS(inputVars.iconDesktopSize)};\n width: ${unsafeCSS(inputVars.iconDesktopSize)};\n cursor: var(--t-field-input-cursor);\n }\n .t-icon-set-container.t-icon-click {\n cursor: pointer;\n }\n .t-input-container .t-icon-set-container.t-icon-right {\n position: absolute;\n top: 50%;\n right: var(--t-field-padding-x);\n transform: translateY(-50%);\n }\n .t-input-container .t-icon-set-container.t-icon-left {\n position: absolute;\n top: 50%;\n left: var(--t-field-padding-x);\n transform: translateY(-50%);\n }\n .t-icon-inactive {\n display: inline;\n }\n .t-icon-active {\n display: none;\n }\n .t-icon-disabled {\n display: none;\n }\n .t-input-container:hover .t-icon-set-container .t-icon-inactive,\n .t-input:hover ~ .t-icon-set-container .t-icon-inactive,\n .t-input:focus ~ .t-icon-set-container .t-icon-inactive {\n display: none;\n }\n .t-input-container:hover .t-icon-set-container .t-icon-active,\n .t-input:hover ~ .t-icon-set-container .t-icon-active,\n .t-input:focus ~ .t-icon-set-container .t-icon-active {\n display: inline;\n }\n .t-input[disabled] ~ .t-icon-set-container .t-icon-active {\n display: none;\n }\n .t-input[disabled] ~ .t-icon-set-container .t-icon-inactive {\n display: none;\n }\n .t-input[disabled] ~ .t-icon-set-container .t-icon-disabled {\n display: inline;\n cursor: not-allowed;\n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .t-input-container .t-icon-set-container {\n height: ${unsafeCSS(inputVars.iconMobileSize)};\n width: ${unsafeCSS(inputVars.iconMobileSize)};\n }\n }\n`;\n\nexport const inputSearchStyles = css`\n .t-input[type='search'] {\n padding-left: var(--t-padding-x-desktop-with-icon);\n }\n .t-input[type='search'] + .t-title {\n left: var(--t-padding-x-desktop-with-icon);\n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .t-input[type='search'] {\n padding-left: var(--t-padding-x-mobile-with-icon);\n }\n .t-input[type='search'] + .t-title {\n left: var(--t-padding-x-mobile-with-icon);\n }\n }\n input[type='search']::-webkit-search-decoration,\n input[type='search']::-webkit-search-cancel-button,\n input[type='search']::-webkit-search-results-button,\n input[type='search']::-webkit-search-results-decoration {\n display: none;\n }\n`;\n\nexport const inputDescriptionStyles = css`\n .t-input-description-container {\n margin-top: 0.5rem;\n font-family: 'Rubik', sans-serif;\n font-size: 0.75rem;\n line-height: 1rem;\n color: var(--t-field-color-description);\n display: flex;\n justify-content: space-between;\n }\n .t-input-description-container .t-letter-counter {\n align-self: flex-end;\n }\n .t-input-description-container .t-input-description {\n display: flex;\n gap: 0.5rem;\n }\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-input.enums.js","sourceRoot":"","sources":["../../../../src/tuix-input/enums/tuix-input.enums.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD,MAAM,CAAN,IAAY,SAKX;AALD,WAAY,SAAS;IACnB,0BAAa,CAAA;IACb,8BAAiB,CAAA;IACjB,kCAAqB,CAAA;IACrB,mCAAsB,CAAA;AACxB,CAAC,EALW,SAAS,KAAT,SAAS,QAKpB;AAED,MAAM,CAAN,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IAC3B,kCAAa,CAAA;IACb,oCAAe,CAAA;AACjB,CAAC,EAHW,iBAAiB,KAAjB,iBAAiB,QAG5B;AAED,MAAM,CAAN,IAAY,eAMX;AAND,WAAY,eAAe;IACzB,gCAAa,CAAA;IACb,sCAAmB,CAAA;IACnB,kCAAe,CAAA;IACf,sCAAmB,CAAA;IACnB,sCAAmB,CAAA;AACrB,CAAC,EANW,eAAe,KAAf,eAAe,QAM1B;AAED,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACnC,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,oBAAoB;IACxD,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,QAAQ,CAAC,QAAQ;IAC1C,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,YAAY;IAChD,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,MAAM;CAC3C,CAAC;AAEF,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU;IAC7C,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,KAAK;IACtC,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,OAAO;IAC1C,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,WAAW;CAC/C,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,UAAU;IACjD,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,WAAW,CAAC,KAAK;IAC1C,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,OAAO;IAC9C,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,WAAW;CACnD,CAAC","sourcesContent":["import { IconName } from '../../tuix-icon/enums/tuix-icon.enums';\nimport { Palette } from '../../utils/colors';\nimport { DarkPalette } from '../../utils/darkColors';\n\nexport enum InputType {\n TEXT = 'text',\n SEARCH = 'search',\n PASSWORD = 'password',\n TEXT_AREA = 'textarea',\n}\n\nexport enum InputIconLocation {\n LEFT = 'left',\n RIGHT = 'right',\n}\n\nexport enum DescriptionType {\n TEXT = 'text',\n WARNING = 'warning',\n ERROR = 'error',\n SUCCESS = 'success',\n LOADING = 'loading',\n}\n\nexport const IconByDescriptionType = {\n [DescriptionType.WARNING]: IconName.TRIANGLE_EXCLAMATION,\n [DescriptionType.ERROR]: IconName.CIRCLE_X,\n [DescriptionType.SUCCESS]: IconName.CIRCLE_CHECK,\n [DescriptionType.LOADING]: IconName.LOADER,\n};\n\nexport const IconDescriptionColorLight = {\n [DescriptionType.WARNING]: Palette.VALIDATION,\n [DescriptionType.ERROR]: Palette.ERROR,\n [DescriptionType.SUCCESS]: Palette.SUCCESS,\n [DescriptionType.LOADING]: Palette.PRIMARY_300,\n};\n\nexport const IconDescriptionColorDark = {\n [DescriptionType.WARNING]: DarkPalette.VALIDATION,\n [DescriptionType.ERROR]: DarkPalette.ERROR,\n [DescriptionType.SUCCESS]: DarkPalette.SUCCESS,\n [DescriptionType.LOADING]: DarkPalette.PRIMARY_300,\n};\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-input.interface.js","sourceRoot":"","sources":["../../../../src/tuix-input/interfaces/tuix-input.interface.ts"],"names":[],"mappings":"AAMA,MAAM,CAAN,IAAY,UAIX;AAJD,WAAY,UAAU;IACpB,mCAAqB,CAAA;IACrB,+BAAiB,CAAA;IACjB,mCAAqB,CAAA;AACvB,CAAC,EAJW,UAAU,KAAV,UAAU,QAIrB","sourcesContent":["import { IconName } from '../../tuix-icon/enums/tuix-icon.enums';\nimport { DetailValue } from '../../utils/interfaces/detail-value.interface';\nimport { InputIconLocation } from '../enums/tuix-input.enums';\nimport { DarkPalette } from '../../utils/darkColors';\nimport { Palette } from '../../utils/colors';\n\nexport enum InputState {\n INACTIVE = 'inactive',\n ACTIVE = 'active',\n DISABLED = 'disabled',\n}\nexport interface FormatIconSetParams {\n iconName: IconName;\n colorByState: Record<InputState, DarkPalette | Palette>;\n location?: InputIconLocation;\n clickHandler?: (e: MouseEvent) => void;\n}\n\nexport type CustomEventTuixInput = CustomEvent<DetailValue<string>>;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixLink.js","sourceRoot":"","sources":["../../../src/tuix-link/TuixLink.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAG9D,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,UAAU;IAAxC;;QAOE,WAAM,GAAG,UAAU,CAAC,KAAK,CAAC;QAG1B,YAAO,GAAG,WAAW,CAAC,OAAO,CAAC;QAG9B,aAAQ,GAAG,KAAK,CAAC;QAGjB,SAAI,GAAG,KAAK,CAAC;IAsCf,CAAC;IApCS,YAAY;QAClB,OAAO;YACL,IAAI,EAAE,IAAI;YACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,SAAS;SAChE,CAAC;IACJ,CAAC;IAEO,eAAe;QACrB,OAAO,IAAI,CAAA;;kBAEG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM;iBAC9C,QAAQ,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;gBAC9B,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;;;;KAI3D,CAAC;IACJ,CAAC;IAEO,YAAY;QAClB,OAAO,IAAI,CAAA;oBACK,QAAQ,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;;;KAG5C,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,MAAM,aAAa,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;QAClD,IAAI,aAAa,EAAE;YACjB,OAAO,IAAI,CAAC,eAAe,EAAE,CAAC;SAC/B;aAAM;YACL,OAAO,IAAI,CAAC,YAAY,EAAE,CAAC;SAC5B;IACH,CAAC;;AApDM,eAAM,GAAG,CAAC,UAAU,EAAE,cAAc,CAAC,AAA/B,CAAgC;AAG7C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sCACb;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;wCACL;AAG1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCACjB;AAG9B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCAC9B;AAhBF,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAsDpB;SAtDY,QAAQ","sourcesContent":["import { html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { MainVariant } from '../utils/mainVariant.enum';\nimport { LinkTarget } from './enums/linkTarget.enum';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { linkStyles } from './TuixLink.styles';\nimport { linkFontStyles } from '../tuix-text/TuixText.styles';\n\n@customElement('tuix-link')\nexport class TuixLink extends LitElement {\n static styles = [linkStyles, linkFontStyles];\n\n @property({ type: String })\n href?: string;\n\n @property({ type: LinkTarget })\n target = LinkTarget.BLANK;\n\n @property({ type: MainVariant, reflect: true })\n variant = MainVariant.PRIMARY;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n private _getClassMap(): ClassInfo {\n return {\n link: true,\n disabled: this.disabled,\n [MainVariant.SECONDARY]: this.variant === MainVariant.SECONDARY,\n };\n }\n\n private _anchorTemplate(): TemplateResult {\n return html`\n <a\n target=\"${this.disabled ? LinkTarget.SELF : this.target}\"\n class=\"${classMap(this._getClassMap())}\"\n href=\"${this.disabled ? 'javascript:void(0)' : this.href}\"\n >\n <slot></slot>\n </a>\n `;\n }\n\n private _divTemplate(): TemplateResult {\n return html`\n <div class=\"${classMap(this._getClassMap())}\">\n <slot></slot>\n </div>\n `;\n }\n\n render() {\n const isValidAnchor = this.href && !this.disabled;\n if (isValidAnchor) {\n return this._anchorTemplate();\n } else {\n return this._divTemplate();\n }\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixLink.styles.js","sourceRoot":"","sources":["../../../src/tuix-link/TuixLink.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,MAAM,CAAC,MAAM,wBAAwB,GAAG,qBAAqB,CAAC;AAE9D,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;IACzB,SAAS,CAAC;;6BAEe,OAAO,CAAC,IAAI;MACnC,wBAAwB,KAAK,OAAO,CAAC,IAAI;;;;6BAIlB,WAAW,CAAC,IAAI;MACvC,wBAAwB,KAAK,WAAW,CAAC,IAAI;;;mBAGhC,WAAW,CAAC,SAAS;6BACX,OAAO,CAAC,KAAK;MACpC,wBAAwB,KAAK,OAAO,CAAC,KAAK;;;mBAG7B,WAAW,CAAC,SAAS;6BACX,WAAW,CAAC,KAAK;MACxC,wBAAwB,KAAK,WAAW,CAAC,KAAK;;;;6BAIvB,OAAO,CAAC,WAAW;MAC1C,wBAAwB,KAAK,OAAO,CAAC,WAAW;;;;;;iBAMrC,wBAAwB;;;;;;;;iBAQxB,wBAAwB;;;;;;;iBAOxB,wBAAwB;;;CAGxC,CAAC;CACD,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { MainVariant } from '../utils/mainVariant.enum';\nimport { Palette } from '../utils/colors';\nimport { DarkPalette } from '../utils/darkColors';\n\nexport const LINK_TEXT_COLOR_VAR_NAME = '--t-link-text-color';\n\nexport const linkStyles = css`\n ${unsafeCSS(`\n :host {\n --t-link-border-color: ${Palette.MAIN};\n ${LINK_TEXT_COLOR_VAR_NAME}: ${Palette.MAIN}\n }\n\n :host([dark]) {\n --t-link-border-color: ${DarkPalette.MAIN};\n ${LINK_TEXT_COLOR_VAR_NAME}: ${DarkPalette.MAIN}\n }\n\n :host([variant=${MainVariant.SECONDARY}]) {\n --t-link-border-color: ${Palette.WHITE};\n ${LINK_TEXT_COLOR_VAR_NAME}: ${Palette.WHITE}\n }\n\n :host([variant=${MainVariant.SECONDARY}][dark]) {\n --t-link-border-color: ${DarkPalette.WHITE};\n ${LINK_TEXT_COLOR_VAR_NAME}: ${DarkPalette.WHITE}\n }\n\n :host([disabled]) .link.disabled {\n --t-link-border-color: ${Palette.PRIMARY_300};\n ${LINK_TEXT_COLOR_VAR_NAME}: ${Palette.PRIMARY_300}\n }\n\n .link { \n text-decoration: none;\n display: inline;\n color: var(${LINK_TEXT_COLOR_VAR_NAME});\n border-bottom: solid 1px var(--t-link-border-active-color, transparent);\n }\n .link:hover {\n border-bottom: solid 1px var(--t-link-border-color);\n cursor: pointer;\n }\n .link.secondary {\n color: var(${LINK_TEXT_COLOR_VAR_NAME});\n }\n .link.secondary:hover {\n border-bottom: solid 1px var(--t-link-border-color);\n } \n .link.disabled {\n border-bottom: solid 1px var(--t-link-border-color);\n color: var(${LINK_TEXT_COLOR_VAR_NAME});\n cursor: not-allowed;\n } \n`)}\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"linkTarget.enum.js","sourceRoot":"","sources":["../../../../src/tuix-link/enums/linkTarget.enum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,UAKX;AALD,WAAY,UAAU;IACpB,8BAAgB,CAAA;IAChB,4BAAc,CAAA;IACd,gCAAkB,CAAA;IAClB,0BAAY,CAAA;AACd,CAAC,EALW,UAAU,KAAV,UAAU,QAKrB","sourcesContent":["export enum LinkTarget {\n BLANK = '_blank',\n SELF = '_self',\n PARENT = '_parent',\n TOP = '_top',\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixModal.js","sourceRoot":"","sources":["../../../src/tuix-modal/TuixModal.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,iBAAiB,EACjB,cAAc,GACf,MAAM,wCAAwC,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EACL,QAAQ,EACR,eAAe,GAChB,MAAM,uCAAuC,CAAC;AAG/C,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,UAAU;IAAzC;;QAIE,YAAO,GAAG,KAAK,CAAC;QAGhB,SAAI,GAAG,KAAK,CAAC;QAGb,eAAU,GAAG,KAAK,CAAC;IAqCrB,CAAC;IAnCW,QAAQ;QAChB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IACrE,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;oBAGK,cAAc,CAAC,SAAS;wBACpB,iBAAiB,CAAC,IAAI;gBAC9B,IAAI,CAAC,IAAI;;;;;;uBAMF,IAAI,CAAC,QAAQ;;sBAEd,eAAe,CAAC,MAAM;sBACtB,QAAQ,CAAC,CAAC;uBACT,WAAW,CAAC,IAAI;sBACjB,IAAI,CAAC,IAAI;;;0CAGW,IAAI,CAAC,UAAU;;;;;;;;KAQpD,CAAC;IACJ,CAAC;;AA7CM,gBAAM,GAAG,CAAC,iBAAiB,EAAE,iBAAiB,CAAC,AAAzC,CAA0C;AAGvD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAC3B;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAC9B;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CACxB;AAVR,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA+CrB;SA/CY,SAAS","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport {\n BorderRadiusPaper,\n PaperElevation,\n} from '../tuix-paper/enums/tuix-paper.enum.js';\nimport { commonModalStyles, mobileModalStyles } from './TuixModal.styles.js';\nimport { TextVariant } from '../tuix-text/enums/tuix-text.enums.js';\nimport {\n IconName,\n IconSizeVariant,\n} from '../tuix-icon/enums/tuix-icon.enums.js';\n\n@customElement('tuix-modal')\nexport class TuixModal extends LitElement {\n static styles = [commonModalStyles, mobileModalStyles];\n\n @property({ type: Boolean, reflect: true })\n visible = false;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n @property({ type: Boolean, reflect: true })\n scrollable = false;\n\n protected _onClose() {\n this.visible = false;\n this.dispatchEvent(new CustomEvent('on-close', { bubbles: true }));\n }\n\n render() {\n return html`\n <tuix-paper\n class=\"modal-container\"\n elevation=${PaperElevation.VARIANT_4}\n border-radius=${BorderRadiusPaper.SOFT}\n ?dark=${this.dark}\n >\n <div class=\"content\">\n <header>\n <slot name=\"title\"></slot>\n <tuix-icon\n @click=${this._onClose}\n class=\"close-icon\"\n size=\"${IconSizeVariant.MEDIUM}\"\n name=\"${IconName.X}\"\n color=\"${TextVariant.MAIN}\"\n ?dark=${this.dark}\n ></tuix-icon>\n </header>\n <div class=\"body\" ?scrollable=${this.scrollable}>\n <slot name=\"body\"></slot>\n </div>\n <div class=\"action-buttons\">\n <slot name=\"actions\"></slot>\n </div>\n </div>\n </tuix-paper>\n `;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixModal.styles.js","sourceRoot":"","sources":["../../../src/tuix-modal/TuixModal.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE1C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;wBASZ,SAAS,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCtD,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;uCACG,WAAW,CAAC,MAAM;;;;;;CAMxD,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\nimport { Palette } from '../utils/colors';\n\nexport const commonModalStyles = css`\n :host {\n display: none;\n position: fixed;\n width: 100%;\n height: 100vh;\n align-items: center;\n top: 0;\n left: 0;\n background-color: ${unsafeCSS(Palette.BLACK + '80')};\n }\n\n :host([visible]) {\n display: flex;\n }\n\n .modal-container {\n margin: auto;\n max-width: 96%;\n max-height: 96vh;\n\n .content {\n border-radius: 4px;\n\n header {\n display: flex;\n justify-content: space-between;\n padding: 16px 16px 8px;\n\n .close-icon {\n cursor: pointer;\n }\n }\n\n div.body {\n padding: 8px 16px 32px;\n }\n\n div.action-buttons {\n padding: 8px 16px 16px 16px;\n }\n }\n }\n`;\n\nexport const mobileModalStyles = css`\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .modal-container {\n min-width: 100%;\n max-height: 100%;\n }\n }\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixPaper.js","sourceRoot":"","sources":["../../../src/tuix-paper/TuixPaper.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,MAAM,KAAK,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAC5E,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAGjD,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,UAAU;IAAzC;;QAIE,cAAS,GAAG,cAAc,CAAC,SAAS,CAAC;QAGrC,iBAAY,GAAG,iBAAiB,CAAC,IAAI,CAAC;QAGtC,SAAI,GAAG,KAAK,CAAC;IAoBf,CAAC;IAlBS,mBAAmB;QACzB,MAAM,YAAY,GAAG,WAAW,IAAI,CAAC,SAAS,EAAE,CAAC;QACjD,MAAM,SAAS,GAAG,QAAQ,IAAI,CAAC,SAAS,EAAE,CAAC;QAC3C,OAAO;YACL,SAAS,EAAE,IAAI;YACf,CAAC,YAAY,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI;YAC1B,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC,IAAI;SACvB,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;eACA,QAAQ,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;eACpC,QAAQ,CAAC,EAAE,YAAY,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC;;;WAGjD,CAAC;IACV,CAAC;;AA5BM,gBAAM,GAAG,CAAC,WAAW,CAAC,AAAhB,CAAiB;AAG9B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC;4CACE;AAGrC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;+CACjB;AAGtC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAC9B;AAVF,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA8BrB;SA9BY,SAAS","sourcesContent":["import { LitElement, TemplateResult, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { BorderRadiusPaper, PaperElevation } from './enums/tuix-paper.enum';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { paperStyles } from './TuixPaper.styles';\n\n@customElement('tuix-paper')\nexport class TuixPaper extends LitElement {\n static styles = [paperStyles];\n\n @property({ type: PaperElevation })\n elevation = PaperElevation.VARIANT_1;\n\n @property({ type: String, attribute: 'border-radius' })\n borderRadius = BorderRadiusPaper.NONE;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n private _getOptionalClasses(): ClassInfo {\n const variantClass = `variant_${this.elevation}`;\n const darkClass = `dark_${this.elevation}`;\n return {\n elevation: true,\n [variantClass]: !this.dark,\n [darkClass]: this.dark,\n };\n }\n\n render(): TemplateResult {\n return html` <div\n class=\"${classMap(this._getOptionalClasses())}\"\n style=\"${styleMap({ borderRadius: this.borderRadius })}\"\n >\n <slot></slot>\n </div>`;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixPaper.styles.js","sourceRoot":"","sources":["../../../src/tuix-paper/TuixPaper.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE1C,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC;KACnD,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;KACZ,GAAG,CACF,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC;uBACD,OAAO;sBACR,CAAC,IAAI,KAAK,MAAM,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,OAAO,CAAC,MAAM;;oBAEtD,OAAO;2BACA,EAAE,GAAG,CAAC,GAAG,KAAK,IAAI,EAAE,GAAG,CAAC,GAAG,KAAK,IAAI,EAAE,GAAG,CAAC,GAAG,KAAK;IACzE,CACD;KACA,IAAI,CAAC,IAAI,CAAC,CAAC;AAEd,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA;IAC1B,SAAS,CAAC;;wBAEU,OAAO,CAAC,KAAK;;oBAEjB,cAAc,CAAC,SAAS;wBACpB,OAAO,CAAC,KAAK;;IAEjC,gBAAgB;uBACG,cAAc,CAAC,SAAS;+BAChB,OAAO,CAAC,MAAM;;oBAEzB,cAAc,CAAC,SAAS;;;CAG3C,CAAC;CACD,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { PaperElevation } from './enums/tuix-paper.enum';\nimport { Palette } from '../utils/colors';\n\nconst calculatedStyles = Object.values(PaperElevation)\n .slice(1, -1)\n .map(\n (variant, index) => `\n .elevation.variant_${variant} {\n box-shadow: 0px ${2 ** index}px ${2 ** (index + 2)}px ${Palette.SHADOW};\n }\n .elevation.dark_${variant} {\n background-color:rgb(${23 + 3 * index},${23 + 3 * index},${26 + 5 * index});\n }`\n )\n .join('\\n');\n\nexport const paperStyles = css`\n ${unsafeCSS(`\n .elevation {\n background-color: ${Palette.WHITE};\n }\n .elevation.dark_${PaperElevation.VARIANT_0} {\n background-color: ${Palette.BLACK};\n }\n ${calculatedStyles}\n .elevation.variant_${PaperElevation.VARIANT_4} {\n box-shadow: 0px 7px 24px ${Palette.SHADOW};\n }\n .elevation.dark_${PaperElevation.VARIANT_4} {\n background-color: rgb(33, 33, 40);\n }\n`)}\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-paper.enum.js","sourceRoot":"","sources":["../../../../src/tuix-paper/enums/tuix-paper.enum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,cAMX;AAND,WAAY,cAAc;IACxB,iCAAe,CAAA;IACf,iCAAe,CAAA;IACf,iCAAe,CAAA;IACf,iCAAe,CAAA;IACf,iCAAe,CAAA;AACjB,CAAC,EANW,cAAc,KAAd,cAAc,QAMzB;AAED,MAAM,CAAN,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,iCAAY,CAAA;IACZ,iCAAY,CAAA;IACZ,oCAAe,CAAA;IACf,oCAAe,CAAA;AACjB,CAAC,EALW,iBAAiB,KAAjB,iBAAiB,QAK5B","sourcesContent":["export enum PaperElevation {\n VARIANT_0 = '0',\n VARIANT_1 = '1',\n VARIANT_2 = '2',\n VARIANT_3 = '3',\n VARIANT_4 = '4',\n}\n\nexport enum BorderRadiusPaper {\n NONE = '0px',\n SOFT = '4px',\n MEDIUM = '10px',\n STRONG = '20px',\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixRadioButton.js","sourceRoot":"","sources":["../../../src/tuix-radio-button/TuixRadioButton.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums';\nimport { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums';\nimport {\n radioButtonContainerStyles,\n radioButtonInnerStyles,\n radioButtonLabelStyles,\n radioButtonStyles,\n radioHostStyles,\n} from './TuixRadioButton.styles';\nimport { TuixRadioButtonOption } from './interfaces/tuix-radio-button.interface';\n\n@customElement('tuix-radio-button')\nexport class TuixRadioButton extends LitElement {\n static styles = [\n radioHostStyles,\n radioButtonContainerStyles,\n radioButtonStyles,\n radioButtonInnerStyles,\n radioButtonLabelStyles,\n ];\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n @property({ type: Boolean, reflect: true })\n error = false;\n\n @property({ type: Array })\n options: TuixRadioButtonOption[] = [];\n\n @property({ type: String })\n labelSide = CheckboxLabelSide.RIGHT;\n\n @property({ type: String })\n selectedOption: TuixRadioButtonOption | null = null;\n\n private _onRadioButtonChange(event: InputEvent) {\n this.dispatchEvent(\n new CustomEvent('change', {\n detail: {\n value: (event.target as HTMLInputElement).value,\n },\n bubbles: true,\n })\n );\n }\n\n private _getFullContainerClasses(): ClassInfo {\n return {\n 't-radio-button-full-container': true,\n 't-with-error': this.error && !this.disabled,\n 't-with-label-left': this.labelSide === CheckboxLabelSide.LEFT,\n 't-multiple-options': this.options.length > 1,\n };\n }\n\n private _formatTemplate(option: TuixRadioButtonOption, index: number) {\n return html`<label class=\"${classMap(this._getFullContainerClasses())}\">\n <div class=\"t-radio-button-container\">\n <input\n type=\"radio\"\n class=\"t-radio-button\"\n ?disabled=\"${this.disabled}\"\n .value=\"${option}\"\n name=\"tuix-radio-button\"\n ?checked=\"${this.selectedOption === option}\"\n @change=\"${this._onRadioButtonChange}\"\n />\n <div class=\"t-radio-button-checkmark\">\n <div class=\"t-radio-button-inner\"></div>\n </div>\n </div>\n <div class=\"t-radio-button-label\">\n <slot name=\"label-${index}\">\n <tuix-text\n size=\"${TextSize.Field1}\"\n color=\"${TextVariant.PRIMARY}\"\n ?dark=\"${this.dark}\"\n >\n ${option}\n </tuix-text>\n </slot>\n </div>\n </label>`;\n }\n\n render() {\n return html`${this.options.map((option, index) =>\n this._formatTemplate(option, index)\n )}`;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixRadioButton.styles.js","sourceRoot":"","sources":["../../../src/tuix-radio-button/TuixRadioButton.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAExD,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAA;IAC9B,UAAU;;;6CAG+B,SAAS,CAAC,OAAO,CAAC,WAAW,CAAC;;CAE1E,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCA4BN,WAAW,CAAC,MAAM;;;;;;;CAOxD,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CnC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BxC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;CAcxC,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { hostStyles } from '../tuix-checkbox/TuixCheckbox.styles';\nimport { Palette } from '../utils/colors';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\n\nexport const radioHostStyles = css`\n ${hostStyles}\n :host {\n --t-margin-between-radio-buttons: 1rem;\n --t-radio-button-inner-color-disabled: ${unsafeCSS(Palette.PRIMARY_300)};\n }\n`;\n\nexport const radioButtonContainerStyles = css`\n .t-radio-button-full-container {\n display: flex;\n justify-content: var(--t-label-right-default-justify, flex-start);\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n :host([disabled]) .t-radio-button-full-container {\n cursor: not-allowed;\n }\n .t-radio-button-container {\n --t-radio-button-size-box: 1.5rem;\n --t-radio-button-shadow-width: 2px;\n display: block;\n position: relative;\n height: var(--t-radio-button-size-box);\n width: var(--t-radio-button-size-box);\n min-width: var(--t-radio-button-size-box);\n }\n .t-radio-button-container .t-radio-button {\n position: absolute;\n opacity: 0;\n height: 0;\n width: 0;\n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .t-radio-button-container {\n --t-radio-button-size-box: 1rem;\n --t-radio-button-shadow-width: 1px;\n margin-top: 1px;\n }\n }\n`;\n\nexport const radioButtonStyles = css`\n .t-radio-button-full-container.t-multiple-options {\n margin-bottom: var(--t-margin-between-radio-buttons);\n }\n .t-radio-button-container .t-radio-button-checkmark {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n height: var(--t-radio-button-size-box);\n width: var(--t-radio-button-size-box);\n background-color: var(--t-bg-color-primary);\n border: 1px solid var(--t-stroke-color-grey);\n box-sizing: border-box;\n border-radius: 50%;\n }\n .t-radio-button-container\n .t-radio-button:checked\n ~ .t-radio-button-checkmark {\n border: 1px solid var(--t-main-color-tuix);\n }\n .t-radio-button-container .t-radio-button:focus ~ .t-radio-button-checkmark {\n box-shadow: 0 0 0px var(--t-radio-button-shadow-width)\n var(--t-stroke-color-focus);\n }\n .t-radio-button-full-container:hover\n .t-radio-button-container\n .t-radio-button-checkmark {\n border: 1px solid var(--t-main-color-tuix);\n }\n .t-radio-button-full-container.t-with-error\n .t-radio-button-container\n .t-radio-button-checkmark {\n border: 1px solid var(--t-text-color-error);\n }\n\n .t-radio-button-container\n .t-radio-button:disabled\n ~ .t-radio-button-checkmark {\n background-color: var(--t-bg-color-disabled);\n border: none;\n box-shadow: none;\n }\n`;\n\nexport const radioButtonInnerStyles = css`\n .t-radio-button-container .t-radio-button-checkmark .t-radio-button-inner {\n background-color: var(--t-main-color-tuix);\n margin: auto;\n height: calc(var(--t-radio-button-size-box) / 2 - 2px);\n width: calc(var(--t-radio-button-size-box) / 2 - 2px);\n border-radius: 50%;\n display: none;\n }\n .t-radio-button-container\n .t-radio-button:checked\n ~ .t-radio-button-checkmark\n .t-radio-button-inner {\n display: block;\n }\n :host([error])\n .t-radio-button-container\n .t-radio-button-checkmark\n .t-radio-button-inner {\n background-color: var(--t-text-color-error);\n }\n :host([disabled])\n .t-radio-button-container\n .t-radio-button-checkmark\n .t-radio-button-inner {\n background-color: var(--t-radio-button-inner-color-disabled);\n cursor: not-allowed;\n }\n`;\n\nexport const radioButtonLabelStyles = css`\n .t-radio-button-label {\n display: block;\n color: var(--t-text-color-label);\n margin-left: 0.625rem;\n }\n .t-radio-button-full-container.t-with-label-left {\n flex-direction: row-reverse;\n justify-content: var(--t-label-left-default-justify, space-between);\n }\n .t-radio-button-full-container.t-with-label-left .t-radio-button-label {\n margin-right: 0.625rem;\n margin-left: 0;\n }\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-radio-button.interface.js","sourceRoot":"","sources":["../../../../src/tuix-radio-button/interfaces/tuix-radio-button.interface.ts"],"names":[],"mappings":"","sourcesContent":["import { DetailValue } from '../../utils/interfaces/detail-value.interface';\n\nexport type TuixRadioButtonOption = string | number;\n\nexport type CustomEventTuixRadioButton<\n T extends TuixRadioButtonOption = TuixRadioButtonOption\n> = CustomEvent<DetailValue<T>>;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixTable.js","sourceRoot":"","sources":["../../../src/tuix-table/TuixTable.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tableStyles, threeDots } from './TuixTable.styles';\nimport { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums';\nimport { IconName } from '../tuix-icon/enums/tuix-icon.enums.js';\nimport { Palette } from '../utils/colors';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\n\nimport type {\n IDataTableHeader,\n TablePaginationProps,\n PaginationEventDetail,\n ThreeDotsLoaderConfig,\n} from './interfaces/tuix-table.interface.js';\n\n@customElement('tuix-table')\nexport class TuixTable extends LitElement {\n static styles = [tableStyles, threeDots];\n\n @property({ type: Boolean }) paginated = false;\n @property({ type: Boolean }) disableMobileTable = false;\n @property({ type: Boolean }) showMobileTableInTablet = false;\n @property({ type: Object }) loader?: ThreeDotsLoaderConfig;\n @property({ type: Array }) data: Record<string, any>[] = [];\n @property({ type: Array }) headers: IDataTableHeader<any>[] = [];\n @property({ type: Array }) pageSizeOptions: number[] = [5, 10, 20];\n\n @property({ type: Number }) totalItems?: number;\n @property({ type: Number }) currentPage?: number;\n @property({ type: Number }) currentSize?: number;\n @property({ type: Boolean }) isLoadingData = false;\n\n @state() private _isTabletView = false;\n @state() private _isMobileView = false;\n @state() private _headerPercents: number[] = [];\n\n private _mqTablet?: MediaQueryList;\n private _mqMobile?: MediaQueryList;\n\n private _onScreenSizeChange = () => {\n this._isTabletView = !!this._mqTablet?.matches;\n this._isMobileView = !!this._mqMobile?.matches;\n };\n\n connectedCallback() {\n super.connectedCallback();\n this._mqTablet = window.matchMedia(`(max-width:${ScreenSizes.TABLET}px)`);\n this._mqMobile = window.matchMedia(`(max-width:${ScreenSizes.MOBILE}px)`);\n this._onScreenSizeChange();\n this._mqTablet.addEventListener('change', this._onScreenSizeChange);\n this._mqMobile.addEventListener('change', this._onScreenSizeChange);\n this._computeHeaderPercents();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._mqTablet?.removeEventListener('change', this._onScreenSizeChange);\n this._mqMobile?.removeEventListener('change', this._onScreenSizeChange);\n }\n\n updated(changedProps: Map<string, any>) {\n if (changedProps.has('headers')) this._computeHeaderPercents();\n }\n\n private get _effectiveTotalItems() {\n return this.totalItems ?? this.data.length;\n }\n\n private get _effectiveCurrentPage() {\n return this.currentPage ?? 1;\n }\n\n private get _effectivePageSize() {\n return this.currentSize ?? this.pageSizeOptions[0];\n }\n\n private get totalPages() {\n const denom = this._effectivePageSize;\n return Math.max(1, Math.ceil(this._effectiveTotalItems / denom));\n }\n\n private get _paginationProps(): TablePaginationProps {\n const totalItems = this._effectiveTotalItems;\n const itemsPerPage = this._effectivePageSize;\n const startItem = totalItems\n ? (this._effectiveCurrentPage - 1) * itemsPerPage + 1\n : 0;\n const endItem = Math.min(\n this._effectiveCurrentPage * itemsPerPage,\n totalItems\n );\n\n return {\n totalItems,\n currentPage: this._effectiveCurrentPage,\n itemsPerPage,\n startItem,\n endItem,\n onNextPage: this._nextPage,\n onPreviousPage: this._prevPage,\n onItemsPerPageChange: this._setPageSize,\n isLoading: this.isLoadingData,\n } as TablePaginationProps;\n }\n\n private _nextPage = () => {\n if (this.currentPage === this.totalPages) return;\n const next = Math.min(this.totalPages, this._effectiveCurrentPage + 1);\n const detail: PaginationEventDetail = {\n page: next,\n pageSize: this._effectivePageSize,\n };\n this.dispatchEvent(\n new CustomEvent<PaginationEventDetail>('next-page', {\n detail,\n bubbles: true,\n composed: true,\n })\n );\n };\n\n private _prevPage = () => {\n if (this.currentPage === 1) return;\n const prev = Math.max(1, this._effectiveCurrentPage - 1);\n const detail: PaginationEventDetail = {\n page: prev,\n pageSize: this._effectivePageSize,\n };\n this.dispatchEvent(\n new CustomEvent<PaginationEventDetail>('previous-page', {\n detail,\n bubbles: true,\n composed: true,\n })\n );\n };\n\n private _setPageSize = (value: number) => {\n const newSize = Math.max(1, Math.floor(value));\n const newPage = 1;\n const detail: PaginationEventDetail = { page: newPage, pageSize: newSize };\n this.dispatchEvent(\n new CustomEvent<PaginationEventDetail>('page-size-change', {\n detail,\n bubbles: true,\n composed: true,\n })\n );\n };\n\n private _computeHeaderPercents() {\n const total = this.headers.reduce((acum, header) => acum + header.width, 0);\n this._headerPercents =\n total === 0\n ? this.headers.map(() => 100 / this.headers.length)\n : this.headers.map(header => (header.width / total) * 100);\n }\n\n private _cellStyleString() {\n return `border-bottom:1px solid ${Palette.NEUTRAL_200};`;\n }\n\n private _textVariantColor(header: IDataTableHeader<any>, row: any) {\n const color = header.cellColor\n ? header.cellColor(row)\n : TextVariant.PRIMARY;\n return color;\n }\n\n private _renderHeaderCells() {\n return html`<tr>\n ${this.headers.map(\n (header, idx) => html`<th\n style=${styleMap({\n width: `${this._headerPercents[idx]}%`,\n color: Palette.WHITE,\n })}\n >\n <tuix-text size=${TextSize.Body1} color=${TextVariant.SECONDARY}\n >${header.name}</tuix-text\n >\n </th>`\n )}\n </tr>`;\n }\n\n private _renderCell(header: IDataTableHeader<any>, row: any) {\n if (header.isSlot) {\n const slotName = `${header.slotName}-${row.id}`;\n return html`<td style=\"${this._cellStyleString()}\">\n <slot name=${slotName}></slot>\n </td>`;\n }\n const content = row[header.dataKey];\n return html`<td style=\"${this._cellStyleString()}\">\n <tuix-text\n size=${TextSize.Body1}\n color=${this._textVariantColor(header, row)}\n >${content}</tuix-text\n >\n </td>`;\n }\n\n private _renderRows() {\n const rows = this.data;\n return repeat(\n rows,\n row => row.id,\n row =>\n html`<tr>\n ${this.headers.map(header => this._renderCell(header, row))}\n </tr>`\n );\n }\n\n private _onPageSizeChange(e: Event) {\n const selectedValue = parseInt((e.target as HTMLSelectElement).value);\n this._setPageSize(selectedValue);\n }\n\n private _renderPageSizeOptions() {\n return this.pageSizeOptions.map(\n size => html`<option value=${size}>${size}</option>`\n );\n }\n\n private _renderSpinner() {\n const threeDotsConfiguration = {\n size: '14px',\n color: Palette.MAIN,\n visible: true,\n ariaLabel: 'Loading',\n wrapperStyle: {\n width: '100%',\n display: 'flex',\n justifyContent: 'center',\n padding: '48px 0',\n },\n ...this.loader,\n } as Required<ThreeDotsLoaderConfig>;\n\n if (!threeDotsConfiguration.visible) return null;\n\n const wrapperVars: Record<string, string | number> = {\n '--dot-size': threeDotsConfiguration.size,\n '--dot-color': threeDotsConfiguration.color,\n ...threeDotsConfiguration.wrapperStyle,\n };\n\n const aria = threeDotsConfiguration.ariaLabel;\n\n return html`<div class=\"tuix-spinner-wrapper\">\n <div\n class=\"three-dots-wrapper\"\n role=\"status\"\n aria-label=${aria}\n style=${styleMap(wrapperVars)}\n >\n <span class=\"dot\" aria-hidden=\"true\"></span>\n <span class=\"dot\" aria-hidden=\"true\"></span>\n <span class=\"dot\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">${aria}</span>\n </div>\n </div>`;\n }\n private _renderPagination() {\n const { totalItems, startItem, endItem, itemsPerPage, isLoading } =\n this._paginationProps;\n\n return html`<footer\n style=\"background-color:${Palette.SECTION_BG};\"\n class=\"table_footer sticky\"\n >\n <div class=\"items-per-page\">\n <tuix-text size=${TextSize.Body2}>Items per page</tuix-text>\n <div\n style=\"outline: 1px solid ${Palette.NEUTRAL_200};\"\n class=\"dropdown_container\"\n >\n <select\n class=\"items-per-page-dropdown\"\n .value=${String(itemsPerPage)}\n @change=${this._onPageSizeChange}\n ?disabled=${isLoading}\n >\n ${this._renderPageSizeOptions()}\n </select>\n <tuix-icon\n class=\"arrow-icon\"\n name=${IconName.CHEVRON_DOWN}\n ></tuix-icon>\n </div>\n </div>\n\n <div class=\"navigation\">\n <tuix-text size=${TextSize.Body2}\n >${startItem} - ${endItem} of ${totalItems}</tuix-text\n >\n <div class=\"buttons\">\n <tuix-icon\n class=\"arrow-icon\"\n name=${IconName.CHEVRON_LEFT}\n @click=${this._prevPage}\n ></tuix-icon>\n <tuix-icon\n class=\"arrow-icon\"\n name=${IconName.CHEVRON_RIGHT}\n @click=${this._nextPage}\n ></tuix-icon>\n </div>\n </div>\n </footer>`;\n }\n\n private _renderTable() {\n return html`<table>\n <thead style=\"background-color: ${Palette.MAIN}\">\n ${this._renderHeaderCells()}\n </thead>\n ${this.isLoadingData\n ? html`<tbody>\n <tr>\n <td colspan=${this.headers.length}>${this._renderSpinner()}</td>\n </tr>\n </tbody>`\n : html`<tbody>\n ${this._renderRows()}\n </tbody>`}\n </table>\n ${this.paginated ? this._renderPagination() : null}`;\n }\n\n private _renderCards() {\n const rows = this.data;\n return html`<div class=\"mobile_table\">\n ${this.isLoadingData\n ? this._renderSpinner()\n : rows.map(\n row => html`<div\n style=\"border-bottom: 2px solid ${Palette.MAIN};\"\n class=\"table_entity\"\n >\n ${this.headers.map(\n header => html`<div\n class=\"table_row\"\n style=\"border-bottom:1px solid ${Palette.NEUTRAL_200};\"\n >\n <div\n class=\"header\"\n style=\"background-color:${Palette.SECTION_BG};\"\n >\n <tuix-text\n size=${TextSize.Body1}\n color=${TextVariant.PRIMARY}\n >${header.name}</tuix-text\n >\n </div>\n <div class=\"content\">\n ${header.isSlot\n ? html`<slot\n name=\"${header.slotName}-${row.id}\"\n ></slot>`\n : html`<tuix-text size=${TextSize.Body1}\n >${row[header.dataKey]}</tuix-text\n >`}\n </div>\n </div>`\n )}\n </div>`\n )}\n </div>\n ${this.paginated ? this._renderPagination() : null}`;\n }\n\n render() {\n const shouldRenderCards =\n !this.disableMobileTable &&\n (this._isMobileView ||\n (this._isTabletView && this.showMobileTableInTablet));\n\n return shouldRenderCards\n ? html`${this._renderCards()}`\n : html`${this._renderTable()}`;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixTable.styles.js","sourceRoot":"","sources":["../../../src/tuix-table/TuixTable.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAExD,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCAyGS,WAAW,CAAC,MAAM;;;;;;;;;;;;;;;;;;;;;;;;CAwBxD,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgE3B,CAAC","sourcesContent":["import { css } from 'lit';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\n\nexport const tableStyles = css`\n :host {\n display: block;\n width: 100%;\n }\n\n .table_wrapper {\n width: 100%;\n overflow-x: auto;\n }\n\n table {\n min-width: 650px;\n table-layout: fixed;\n width: 100%;\n border-collapse: collapse;\n }\n\n thead th {\n box-sizing: border-box;\n padding: 8px;\n text-align: left;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n tbody tr td {\n box-sizing: border-box;\n height: 52px;\n padding: 6px 8px;\n text-align: left;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n ::slotted(*) {\n display: inline-flex;\n align-items: center;\n margin-right: 8px;\n gap: 10px;\n }\n\n .dropdown_container {\n position: relative;\n border-radius: 4px;\n }\n\n .dropdown_container .items-per-page-dropdown {\n width: 55px;\n border: none;\n background-color: transparent;\n padding: 8px;\n cursor: pointer;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n\n .dropdown_container .items-per-page-dropdown:focus-visible {\n border: none;\n outline: none;\n }\n\n .dropdown_container .arrow-icon {\n position: absolute;\n right: 8px;\n bottom: 8px;\n cursor: pointer;\n pointer-events: none;\n }\n\n footer.table_footer {\n height: 48px;\n padding: 8px;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-sizing: border-box;\n }\n\n footer.table_footer .items-per-page {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n footer.table_footer .navigation {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n footer.table_footer .navigation .buttons {\n display: flex;\n gap: 8px;\n cursor: pointer;\n }\n\n .mobile_table {\n display: none;\n }\n\n @media only screen and (max-width: ${ScreenSizes.TABLET}px) {\n .mobile_table {\n display: block;\n }\n\n footer.table_footer {\n align-items: flex-start;\n gap: 8px;\n }\n\n .mobile_table .table_row {\n display: flex;\n min-height: 40px;\n }\n\n .mobile_table .table_row > * {\n padding: 0 16px;\n width: 50%;\n text-overflow: ellipsis;\n overflow: hidden;\n display: flex;\n align-items: center;\n }\n }\n`;\n\nexport const threeDots = css`\n .tuix-spinner-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 24px 0;\n }\n\n .three-dots-wrapper {\n display: inline-flex;\n gap: calc(var(--dot-size) * 0.5);\n align-items: center;\n justify-content: center;\n position: relative;\n }\n .three-dots-wrapper .dot {\n width: var(--dot-size);\n height: var(--dot-size);\n background: var(--dot-color);\n border-radius: 50%;\n display: inline-block;\n animation: threeDots 0.9s infinite ease-in-out both;\n }\n .three-dots-wrapper .dot:nth-child(2) {\n animation-delay: 0.15s;\n }\n .three-dots-wrapper .dot:nth-child(3) {\n animation-delay: 0.3s;\n }\n\n @keyframes threeDots {\n 0%,\n 80%,\n 100% {\n transform: scale(0.6);\n opacity: 0.6;\n }\n 40% {\n transform: scale(1);\n opacity: 1;\n }\n }\n\n .sr-only {\n border: 0;\n clip: rect(1px, 1px, 1px, 1px);\n -webkit-clip-path: inset(50%);\n clip-path: inset(50%);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px;\n white-space: nowrap;\n }\n\n .clientsLoader,\n .mobileClientsLoader,\n .tabletClientsLoader {\n display: flex;\n justify-content: center;\n padding: 16px 0;\n }\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-table.interface.js","sourceRoot":"","sources":["../../../../src/tuix-table/interfaces/tuix-table.interface.ts"],"names":[],"mappings":"","sourcesContent":["export interface IDataTableHeader<TRowData = Record<string, unknown>> {\n cellColor?: (rowData: TRowData) => string | undefined;\n isSlot?: boolean;\n slotName?: string;\n name?: string;\n dataKey: Extract<keyof TRowData, string>;\n width: number;\n}\n\nexport interface TablePaginationProps {\n totalItems: number;\n currentPage: number;\n itemsPerPage: number;\n\n startItem: number;\n endItem: number;\n\n onNextPage: () => void;\n onPreviousPage: () => void;\n onItemsPerPageChange: (newPageSize: number) => void;\n\n isLoading?: boolean;\n stickyInTablet?: boolean;\n}\n\nexport interface ThreeDotsLoaderConfig {\n size?: string;\n color?: string;\n visible?: boolean;\n ariaLabel?: string;\n wrapperStyle?: Record<string, string | number>;\n}\n\nexport interface TuixTableElement<TRowData = any> extends HTMLElement {\n data: TRowData[];\n headers: IDataTableHeader<TRowData>[];\n totalItems?: number;\n currentPage?: number;\n currentSize?: number;\n isLoadingData?: boolean;\n paginated?: boolean;\n showMobileTableInTablet?: boolean;\n disableMobileTable?: boolean;\n pageSizeOptions?: number[];\n loader?: ThreeDotsLoaderConfig;\n}\n\nexport interface PaginationEventDetail {\n page: number;\n pageSize: number;\n}\n\nexport type TuixPaginationEvent = CustomEvent<PaginationEventDetail>;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixText.js","sourceRoot":"","sources":["../../../src/tuix-text/TuixText.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,QAAQ,EACR,WAAW,EACX,SAAS,EACT,aAAa,GACd,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAC;AACvE,OAAO,gBAAgB,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AAG3E,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,UAAU;IAAxC;;QAEE,SAAI,GAAG,QAAQ,CAAC,KAAK,CAAC;QAGtB,UAAK,GAAI,WAAW,CAAC,OAAO,CAAC;QAG7B,SAAI,GAAG,KAAK,CAAC;QAoBL,iBAAY,GAAG,GAAG,EAAE;YAC1B,OAAO;gBACL,KAAK,EAAE,OAAO,wBAAwB,KAAK,IAAI,CAAC,aAAa,EAAE,GAAG;aACnE,CAAC;QACJ,CAAC,CAAC;QAEM,iBAAY,GAAG,GAAc,EAAE;YACrC,OAAO;gBACL,IAAI,EAAE,IAAI;gBACV,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;aAClB,CAAC;QACJ,CAAC,CAAC;IAUJ,CAAC;IA1BS,aAAa;QACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC;QACvD,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,WAAW,CAAC,OAAO,CAAC,CAAC;IACrD,CAAC;IAeD,MAAM;QACJ,OAAO,IAAI,CAAA;eACA,QAAQ,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;eAC7B,QAAQ,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;;;WAGjC,CAAC;IACV,CAAC;;AAtCM,eAAM,GAAG;IACd,GAAG,CAAA;QACC,SAAS,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;;;;;KAKtC;IACD,UAAU;IACV,cAAc;IACd,gBAAgB;CACjB,AAXY,CAWX;AAnBF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;sCACP;AAGtB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC;uCACH;AAG7B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCAC9B;AARF,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAiDpB;SAjDY,QAAQ","sourcesContent":["import { html, css, LitElement, unsafeCSS } from 'lit';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport {\n TextSize,\n TextVariant,\n colorText,\n colorTextDark,\n} from './enums/tuix-text.enums.js';\nimport { linkFontStyles, textStyles } from './TuixText.styles.js';\nimport { buttonSizeStyles } from '../tuix-button/TuixButton.styles.js';\nimport slottedClassName from '../utils/slottedClassName.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { LINK_TEXT_COLOR_VAR_NAME } from '../tuix-link/TuixLink.styles.js';\n\n@customElement('tuix-text')\nexport class TuixText extends LitElement {\n @property({ type: TextSize })\n size = TextSize.Body1;\n\n @property({ type: TextVariant })\n color? = TextVariant.PRIMARY;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n static styles = [\n css`\n ${unsafeCSS(slottedClassName('text'))} {\n font-family: 'Rubik', sans-serif;\n display: inline;\n margin: 0;\n }\n `,\n textStyles,\n linkFontStyles,\n buttonSizeStyles,\n ];\n\n private _getTextColor() {\n const colorMap = this.dark ? colorTextDark : colorText;\n return colorMap[this.color || TextVariant.PRIMARY];\n }\n\n private _getStyleMap = () => {\n return {\n color: `var(${LINK_TEXT_COLOR_VAR_NAME}, ${this._getTextColor()})`,\n };\n };\n\n private _getClassMap = (): ClassInfo => {\n return {\n text: true,\n [this.size]: true,\n };\n };\n\n render() {\n return html` <div\n class=\"${classMap(this._getClassMap())}\"\n style=\"${styleMap(this._getStyleMap())}\"\n >\n <slot></slot>\n </div>`;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixText.styles.js","sourceRoot":"","sources":["../../../src/tuix-text/TuixText.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,gBAAgB,MAAM,2BAA2B,CAAC;AAEzD,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;IAC7B,SAAS,CAAC;IACV,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC;;;;;;uCAMI,WAAW,CAAC,MAAM;MACnD,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC;;;;;uCAKE,WAAW,CAAC,MAAM;MACnD,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC;;;;;CAKpC,CAAC;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;IACzB,SAAS,CAAC;IACV,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC;;;;;;IAM7B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;;;IAM5B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;;;IAM5B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;;;IAM5B,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC;;;;;;IAM7B,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC;;;;;;IAMhC,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC;;;;;;IAMhC,gBAAgB,CAAC,QAAQ,CAAC,MAAM,CAAC;;;;;;IAMjC,gBAAgB,CAAC,QAAQ,CAAC,MAAM,CAAC;;;;;;uCAME,WAAW,CAAC,MAAM;MACnD,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC;;;;MAI7B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;MAI5B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;MAI5B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;MAI5B,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC;;;;;MAK7B,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC;;;;;MAKhC,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC;;;;;MAKhC,gBAAgB,CAAC,QAAQ,CAAC,MAAM,CAAC;;;;;;uCAMA,WAAW,CAAC,MAAM;MACnD,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC;;;;;MAKhC,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC;;;;MAIhC,gBAAgB,CAAC,QAAQ,CAAC,MAAM,CAAC;;;;;MAKjC,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC;;;;MAI7B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;MAI5B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;MAI5B,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;;;;MAI5B,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC;;;;;CAKlC,CAAC;CACD,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\nimport { TextSize } from './enums/tuix-text.enums';\nimport slottedClassName from '../utils/slottedClassName';\n\nexport const linkFontStyles = css`\n ${unsafeCSS(`\n ${slottedClassName(TextSize.Link)} {\n font-family: 'Rubik', sans-serif;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem; \n }\n @media only screen and (max-width: ${ScreenSizes.TABLET}px) {\n ${slottedClassName(TextSize.Link)} { \n font-size: 0.938rem;\n line-height: 1.125rem; \n } \n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n ${slottedClassName(TextSize.Link)} { \n font-size: 0.875rem;\n line-height: 1rem; \n } \n }\n`)}\n`;\n\nexport const textStyles = css`\n ${unsafeCSS(`\n ${slottedClassName(TextSize.XL)} {\n font-size: 3.375rem;\n font-weight: 600;\n line-height: 3.688rem;\n }\n\n ${slottedClassName(TextSize.L)} {\n font-size: 2.813rem;\n font-weight: 600;\n line-height: 3.375rem;\n }\n\n ${slottedClassName(TextSize.M)} {\n font-size: 2.313rem;\n font-weight: 600;\n line-height: 2.75rem;\n }\n\n ${slottedClassName(TextSize.S)} {\n font-size: 1.938rem;\n font-weight: 600;\n line-height: 2.313rem;\n }\n\n ${slottedClassName(TextSize.XS)} {\n font-size: 1.313rem;\n font-weight: 600;\n line-height: 1.563rem;\n }\n\n ${slottedClassName(TextSize.Body1)} {\n font-size: 1.125rem;\n font-weight: 300;\n line-height: 1.688rem;\n }\n\n ${slottedClassName(TextSize.Body2)} {\n font-size: 0.938rem;\n font-weight: 300;\n line-height: 1.313rem;\n }\n\n ${slottedClassName(TextSize.Field1)} {\n font-size: 1rem;\n font-weight: 300;\n line-height: 1.25rem;\n }\n\n ${slottedClassName(TextSize.Field2)} {\n font-size: 0.75rem;\n font-weight: 300;\n line-height: 0.875rem;\n }\n\n @media only screen and (max-width: ${ScreenSizes.TABLET}px) {\n ${slottedClassName(TextSize.XL)} {\n font-size: 3rem;\n line-height: 3.313rem;\n }\n ${slottedClassName(TextSize.L)} {\n font-size: 2.5rem;\n line-height: 3rem;\n }\n ${slottedClassName(TextSize.M)} {\n font-size: 2.063rem;\n line-height: 2.5rem;\n }\n ${slottedClassName(TextSize.S)} {\n font-size: 1.75rem;\n line-height: 2.125rem;\n }\n ${slottedClassName(TextSize.XS)} {\n font-size: 1.188rem;\n line-height: 1.438rem;\n }\n\n ${slottedClassName(TextSize.Body1)} {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n ${slottedClassName(TextSize.Body2)} {\n font-size: 0.875rem;\n line-height: 1.125rem;\n }\n\n ${slottedClassName(TextSize.Field1)} {\n font-size: 0.938rem;\n line-height: 1.125rem;\n }\n }\n\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n ${slottedClassName(TextSize.Body1)} {\n font-size: 0.875rem;\n font-weight: 300;\n line-height: 1.313rem;\n }\n ${slottedClassName(TextSize.Body2)} {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n ${slottedClassName(TextSize.Field1)} {\n font-size: 0.875rem;\n font-weight: 300;\n line-height: 1rem;\n }\n ${slottedClassName(TextSize.XL)} {\n font-size: 2.625rem;\n line-height: 2.875rem;\n }\n ${slottedClassName(TextSize.L)} {\n font-size: 2.188rem;\n line-height: 2.438rem;\n }\n ${slottedClassName(TextSize.M)} {\n font-size: 1.813rem;\n line-height: 2rem;\n }\n ${slottedClassName(TextSize.S)} {\n font-size: 1.5rem;\n line-height: 1.625rem;\n }\n ${slottedClassName(TextSize.XS)} {\n font-size: 1.063rem;\n line-height: 1.188rem;\n }\n }\n`)}\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-text.enums.js","sourceRoot":"","sources":["../../../../src/tuix-text/enums/tuix-text.enums.ts"],"names":[],"mappings":"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","sourcesContent":["import { Palette } from '../../utils/colors';\nimport { DarkPalette } from '../../utils/darkColors';\nimport { MainVariant } from '../../utils/mainVariant.enum';\n\nexport enum TextSize {\n XL = 'xl',\n L = 'l',\n M = 'm',\n S = 's',\n XS = 'xs',\n Body1 = 'body1',\n Body2 = 'body2',\n Link = 'link',\n Button = 'button',\n Field1 = 'field1',\n Field2 = 'field2',\n}\n\nexport enum TextVariant {\n PRIMARY = MainVariant.PRIMARY,\n SECONDARY = MainVariant.SECONDARY,\n MAIN = 'main',\n DARK_MAIN = 'dark_main',\n GREY = 'grey',\n LIGHT_GREY = 'light_grey',\n DISABLED = 'disabled',\n VALIDATION = 'validation',\n ERROR = 'error',\n SUCCESS = 'success',\n LIGHT = 'light',\n DARK = 'dark',\n DARK_BLUE = 'dark_blue',\n TITLE_BLUE = 'title_blue',\n}\n\nexport const colorText: Record<TextVariant, string> = {\n [TextVariant.MAIN]: Palette.MAIN,\n [TextVariant.DARK_MAIN]: Palette.DARK_MAIN,\n [TextVariant.PRIMARY]: Palette.BLACK,\n [TextVariant.SECONDARY]: Palette.WHITE,\n [TextVariant.GREY]: Palette.NEUTRAL_600,\n [TextVariant.LIGHT_GREY]: Palette.NEUTRAL_200,\n [TextVariant.DISABLED]: Palette.PRIMARY_200,\n [TextVariant.VALIDATION]: Palette.VALIDATION,\n [TextVariant.ERROR]: Palette.ERROR,\n [TextVariant.SUCCESS]: Palette.SUCCESS,\n [TextVariant.LIGHT]: Palette.WHITE,\n [TextVariant.DARK]: Palette.BLACK,\n [TextVariant.DARK_BLUE]: Palette.DARK_MAIN,\n [TextVariant.TITLE_BLUE]: Palette.DARK_MAIN,\n};\n\nexport const colorTextDark: Record<TextVariant, string> = {\n ...colorText,\n [TextVariant.MAIN]: DarkPalette.MAIN,\n [TextVariant.DARK_MAIN]: DarkPalette.NEUTRAL_600,\n [TextVariant.PRIMARY]: DarkPalette.WHITE,\n [TextVariant.SECONDARY]: Palette.BLACK,\n [TextVariant.GREY]: DarkPalette.NEUTRAL_600,\n [TextVariant.VALIDATION]: DarkPalette.VALIDATION,\n [TextVariant.ERROR]: DarkPalette.ERROR,\n [TextVariant.SUCCESS]: DarkPalette.SUCCESS,\n [TextVariant.LIGHT]: DarkPalette.WHITE,\n [TextVariant.DARK_BLUE]: DarkPalette.PRIMARY_800,\n [TextVariant.TITLE_BLUE]: DarkPalette.PRIMARY_300,\n};\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixToast.js","sourceRoot":"","sources":["../../../src/tuix-toast/TuixToast.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValueMap } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { IconSizeVariant } from '../tuix-icon/enums/tuix-icon.enums.js';\nimport {\n BorderRadiusPaper,\n PaperElevation,\n} from '../tuix-paper/enums/tuix-paper.enum.js';\nimport { Palette } from '../utils/colors.js';\nimport {\n iconDarkPropertiesMap,\n iconPropertiesMap,\n toastBgColorMap,\n toastBgDarkColorMap,\n ToastType,\n ToastTypeExcludingNone,\n} from './enums/tuix-toast.enums.js';\nimport {\n commonToastStyles,\n mobileToastStyles,\n tabletToastStyles,\n} from './TuixToast.styles.js';\n\n@customElement('tuix-toast')\nexport class TuixToast extends LitElement {\n static styles = [commonToastStyles, tabletToastStyles, mobileToastStyles];\n\n @property({ type: ToastType, reflect: true })\n type = ToastType.NONE;\n\n @property({ type: Number, attribute: 'visibility-duration' })\n visibilityDuration = 4000;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n @state()\n lastType = ToastType.SUCCESS as ToastTypeExcludingNone;\n\n updated(changedProperties: PropertyValueMap<unknown>) {\n super.updated(changedProperties);\n if (this.type === ToastType.NONE || this.visibilityDuration === 0) return;\n setTimeout(() => {\n this.type = ToastType.NONE;\n this._handleOnClose();\n }, this.visibilityDuration);\n }\n\n private _handleOnClose() {\n if (this.visibilityDuration === 0) return;\n this.dispatchEvent(\n new CustomEvent('on-close', {\n bubbles: true,\n })\n );\n }\n\n private _saveType = () => {\n if (this.type !== ToastType.NONE) {\n this.lastType = this.type as ToastTypeExcludingNone;\n }\n };\n\n private _getStyleMap = () => {\n this._saveType();\n const bgColorMap = this.dark ? toastBgDarkColorMap : toastBgColorMap;\n const backgroundColor = bgColorMap[this.lastType];\n\n return { backgroundColor };\n };\n\n private _getIcon = () => {\n this._saveType();\n if (this.lastType === ToastType.TEXT) return;\n const { name: iconName, color: iconColor } = this.dark\n ? iconDarkPropertiesMap[this.lastType]\n : iconPropertiesMap[this.lastType];\n return html`\n <tuix-icon\n size=\"${IconSizeVariant.MEDIUM}\"\n name=\"${iconName}\"\n color=\"${iconColor}\"\n ></tuix-icon>\n `;\n };\n\n render() {\n return html`\n <tuix-paper\n elevation=${PaperElevation.VARIANT_4}\n border-radius=${BorderRadiusPaper.SOFT}\n ?dark=${this.dark}\n >\n <div\n style=\"${styleMap({\n backgroundColor: this.dark ? Palette.BLACK : Palette.WHITE,\n borderRadius: BorderRadiusPaper.SOFT,\n })}\"\n >\n <div class=\"toast-container\" style=\"${styleMap(this._getStyleMap())}\">\n ${this._getIcon()}\n <tuix-text ?dark=${this.dark}>\n <slot></slot>\n </tuix-text>\n </div>\n </div>\n </tuix-paper>\n `;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixToast.styles.js","sourceRoot":"","sources":["../../../src/tuix-toast/TuixToast.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAExD,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;CAyBnC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;uCACG,WAAW,CAAC,MAAM;;;;;CAKxD,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;uCACG,WAAW,CAAC,MAAM;;;;;;CAMxD,CAAC","sourcesContent":["import { css } from 'lit';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\n\nexport const commonToastStyles = css`\n :host {\n position: fixed;\n bottom: -100%;\n left: 50%;\n transform: translateX(-50%);\n transition: bottom 600ms linear;\n width: 640px;\n z-index: 99;\n }\n\n :host([type='text']),\n :host([type='warning']),\n :host([type='error']),\n :host([type='success']) {\n bottom: 1.5rem;\n }\n\n .toast-container {\n padding: 12px 16px;\n display: flex;\n gap: 16px;\n align-items: center;\n border-radius: 4px;\n }\n`;\n\nexport const tabletToastStyles = css`\n @media only screen and (max-width: ${ScreenSizes.TABLET}px) {\n :host {\n width: 520px;\n }\n }\n`;\n\nexport const mobileToastStyles = css`\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n :host {\n max-width: 343px;\n width: 90%;\n }\n }\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-toast.enums.js","sourceRoot":"","sources":["../../../../src/tuix-toast/enums/tuix-toast.enums.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD,MAAM,CAAN,IAAY,SAMX;AAND,WAAY,SAAS;IACnB,0BAAa,CAAA;IACb,0BAAa,CAAA;IACb,gCAAmB,CAAA;IACnB,4BAAe,CAAA;IACf,gCAAmB,CAAA;AACrB,CAAC,EANW,SAAS,KAAT,SAAS,QAMpB;AASD,MAAM,CAAC,MAAM,eAAe,GAA2C;IACrE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,KAAK;IAC/B,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,aAAa;IAC1C,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,QAAQ;IACnC,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAA2C;IACzE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,WAAW;IACrC,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,aAAa;IAC9C,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,WAAW,CAAC,QAAQ;IACvC,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,UAAU;CAC5C,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAC5B;IACE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE;QAChB,IAAI,EAAE,QAAQ,CAAC,UAAU;QACzB,KAAK,EAAE,OAAO,CAAC,KAAK;KACrB;IACD,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;QACnB,IAAI,EAAE,QAAQ,CAAC,oBAAoB;QACnC,KAAK,EAAE,OAAO,CAAC,UAAU;KAC1B;IACD,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;QACjB,IAAI,EAAE,QAAQ,CAAC,kBAAkB;QACjC,KAAK,EAAE,OAAO,CAAC,KAAK;KACrB;IACD,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;QACnB,IAAI,EAAE,QAAQ,CAAC,YAAY;QAC3B,KAAK,EAAE,OAAO,CAAC,OAAO;KACvB;CACF,CAAC;AAEJ,MAAM,CAAC,MAAM,qBAAqB,GAG9B;IACF,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE;QAChB,IAAI,EAAE,QAAQ,CAAC,UAAU;QACzB,KAAK,EAAE,OAAO,CAAC,KAAK;KACrB;IACD,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;QACnB,IAAI,EAAE,QAAQ,CAAC,oBAAoB;QACnC,KAAK,EAAE,WAAW,CAAC,UAAU;KAC9B;IACD,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;QACjB,IAAI,EAAE,QAAQ,CAAC,kBAAkB;QACjC,KAAK,EAAE,WAAW,CAAC,KAAK;KACzB;IACD,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;QACnB,IAAI,EAAE,QAAQ,CAAC,YAAY;QAC3B,KAAK,EAAE,WAAW,CAAC,OAAO;KAC3B;CACF,CAAC","sourcesContent":["import { IconName } from '../../tuix-icon/enums/tuix-icon.enums';\nimport { Palette } from '../../utils/colors';\nimport { DarkPalette } from '../../utils/darkColors';\n\nexport enum ToastType {\n NONE = 'none',\n TEXT = 'text',\n WARNING = 'warning',\n ERROR = 'error',\n SUCCESS = 'success',\n}\n\nexport type ToastTypeExcludingNone = Exclude<ToastType, ToastType.NONE>;\n\ninterface IconProperties {\n name: IconName;\n color: Palette | DarkPalette;\n}\n\nexport const toastBgColorMap: Record<ToastTypeExcludingNone, string> = {\n [ToastType.TEXT]: Palette.WHITE,\n [ToastType.WARNING]: Palette.VALIDATION_50,\n [ToastType.ERROR]: Palette.ERROR_50,\n [ToastType.SUCCESS]: Palette.SUCCESS_50,\n};\n\nexport const toastBgDarkColorMap: Record<ToastTypeExcludingNone, string> = {\n [ToastType.TEXT]: Palette.PRIMARY_950,\n [ToastType.WARNING]: DarkPalette.VALIDATION_50,\n [ToastType.ERROR]: DarkPalette.ERROR_50,\n [ToastType.SUCCESS]: DarkPalette.SUCCESS_50,\n};\n\nexport const iconPropertiesMap: Record<ToastTypeExcludingNone, IconProperties> =\n {\n [ToastType.TEXT]: {\n name: IconName.ARROW_DOWN,\n color: Palette.BLACK,\n },\n [ToastType.WARNING]: {\n name: IconName.TRIANGLE_EXCLAMATION,\n color: Palette.VALIDATION,\n },\n [ToastType.ERROR]: {\n name: IconName.CIRCLE_EXCLAMATION,\n color: Palette.ERROR,\n },\n [ToastType.SUCCESS]: {\n name: IconName.CIRCLE_CHECK,\n color: Palette.SUCCESS,\n },\n };\n\nexport const iconDarkPropertiesMap: Record<\n ToastTypeExcludingNone,\n IconProperties\n> = {\n [ToastType.TEXT]: {\n name: IconName.ARROW_DOWN,\n color: Palette.WHITE,\n },\n [ToastType.WARNING]: {\n name: IconName.TRIANGLE_EXCLAMATION,\n color: DarkPalette.VALIDATION,\n },\n [ToastType.ERROR]: {\n name: IconName.CIRCLE_EXCLAMATION,\n color: DarkPalette.ERROR,\n },\n [ToastType.SUCCESS]: {\n name: IconName.CIRCLE_CHECK,\n color: DarkPalette.SUCCESS,\n },\n};\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixToggleButton.js","sourceRoot":"","sources":["../../../src/tuix-toggle-button/TuixToggleButton.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,4CAA4C,CAAC;AAC/E,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EACL,2BAA2B,EAC3B,2BAA2B,EAC3B,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AAGnC,IAAa,gBAAgB,GAA7B,MAAa,gBAAiB,SAAQ,UAAU;IAAhD;;QAUE,YAAO,GAAG,KAAK,CAAC;QAGhB,aAAQ,GAAG,KAAK,CAAC;QAGjB,SAAI,GAAG,KAAK,CAAC;QAGb,UAAK,GAAG,EAAE,CAAC;QAGX,cAAS,GAAG,iBAAiB,CAAC,KAAK,CAAC;IAgDtC,CAAC;IA9CS,qBAAqB,CAAC,KAAiB;QAC7C,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,MAAM,EAAE;gBACN,KAAK,EAAG,KAAK,CAAC,MAA2B,CAAC,OAAO;gBACjD,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB;YACD,OAAO,EAAE,IAAI;SACd,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,wBAAwB;QAC9B,OAAO;YACL,gCAAgC,EAAE,IAAI;YACtC,mBAAmB,EAAE,IAAI,CAAC,SAAS,KAAK,iBAAiB,CAAC,IAAI;SAC/D,CAAC;IACJ,CAAC;IAES,MAAM;QACd,OAAO,IAAI,CAAA,iBAAiB,QAAQ,CAAC,IAAI,CAAC,wBAAwB,EAAE,CAAC;;;;;sBAKnD,IAAI,CAAC,OAAO;uBACX,IAAI,CAAC,QAAQ;qBACf,IAAI,CAAC,qBAAqB;;;;;;;;;oBAS3B,QAAQ,CAAC,MAAM;qBACd,WAAW,CAAC,OAAO;qBACnB,IAAI,CAAC,IAAI;;cAEhB,IAAI,CAAC,KAAK;;;;aAIX,CAAC;IACZ,CAAC;;AApEM,uBAAM,GAAG;IACd,sBAAsB;IACtB,2BAA2B;IAC3B,2BAA2B;IAC3B,uBAAuB;IACvB,uBAAuB;CACxB,AANY,CAMX;AAGF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACZ;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kDAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAC9B;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAChB;AAGX;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDACS;AAtBzB,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAsE5B;SAtEY,gBAAgB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { CheckboxLabelSide } from '../tuix-checkbox/enums/tuix-checkbox.enums';\nimport { TextSize, TextVariant } from '../tuix-text/enums/tuix-text.enums';\nimport {\n toggleButtonCheckmarkStyles,\n toggleButtonContainerStyles,\n toggleButtonHostStyles,\n toggleButtonInnerStyles,\n toggleButtonLabelStyles,\n} from './TuixToggleButton.styles';\n\n@customElement('tuix-toggle-button')\nexport class TuixToggleButton extends LitElement {\n static styles = [\n toggleButtonHostStyles,\n toggleButtonContainerStyles,\n toggleButtonCheckmarkStyles,\n toggleButtonInnerStyles,\n toggleButtonLabelStyles,\n ];\n\n @property({ type: Boolean })\n checked = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n dark = false;\n\n @property({ type: String })\n label = '';\n\n @property({ type: String })\n labelSide = CheckboxLabelSide.RIGHT;\n\n private _onToggleButtonChange(event: InputEvent) {\n this.dispatchEvent(\n new CustomEvent('change', {\n detail: {\n value: (event.target as HTMLInputElement).checked,\n label: this.label,\n },\n bubbles: true,\n })\n );\n }\n\n private _getFullContainerClasses(): ClassInfo {\n return {\n 't-toggle-button-full-container': true,\n 't-with-label-left': this.labelSide === CheckboxLabelSide.LEFT,\n };\n }\n\n protected render() {\n return html`<label class=\"${classMap(this._getFullContainerClasses())}\">\n <div class=\"t-toggle-button-container\">\n <input\n type=\"checkbox\"\n class=\"t-toggle-button\"\n .checked=\"${this.checked}\"\n ?disabled=\"${this.disabled}\"\n @change=\"${this._onToggleButtonChange}\"\n />\n <div class=\"t-toggle-button-checkmark\">\n <div class=\"t-toggle-button-inner\"></div>\n </div>\n </div>\n <div class=\"t-toggle-button-label\">\n <slot>\n <tuix-text\n size=\"${TextSize.Field1}\"\n color=\"${TextVariant.PRIMARY}\"\n ?dark=\"${this.dark}\"\n >\n ${this.label}\n </tuix-text>\n </slot>\n </div>\n </label>`;\n }\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TuixToggleButton.styles.js","sourceRoot":"","sources":["../../../src/tuix-toggle-button/TuixToggleButton.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAExD,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;IACrC,UAAU;;4BAEc,SAAS,CAAC,OAAO,CAAC,WAAW,CAAC;6BAC7B,SAAS,CAAC,OAAO,CAAC,WAAW,CAAC;;;;4BAI/B,SAAS,CAAC,WAAW,CAAC,WAAW,CAAC;6BACjC,SAAS,CAAC,WAAW,CAAC,WAAW,CAAC;0BACrC,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC;;;0BAG5B,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC;;CAEpD,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCAgCP,WAAW,CAAC,MAAM;;;;;;;;CAQxD,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkC7C,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,CAAA;;gDAEM,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC;;;;;;;;;;;;;;;;;;;CAmBvE,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;CAczC,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { hostStyles } from '../tuix-checkbox/TuixCheckbox.styles';\nimport { Palette } from '../utils/colors';\nimport { DarkPalette } from '../utils/darkColors';\nimport { ScreenSizes } from '../utils/screenSizes.enum';\n\nexport const toggleButtonHostStyles = css`\n ${hostStyles}\n :host {\n --t-bg-color-primary: ${unsafeCSS(Palette.PRIMARY_300)};\n --t-bg-color-disabled: ${unsafeCSS(Palette.PRIMARY_100)};\n --t-toggle-shadow-color-focus: rgba(142, 141, 208, 0.16);\n }\n :host([dark]) {\n --t-bg-color-primary: ${unsafeCSS(DarkPalette.PRIMARY_800)};\n --t-bg-color-disabled: ${unsafeCSS(DarkPalette.PRIMARY_800)};\n --t-bg-color-inner: ${unsafeCSS(DarkPalette.WHITE)};\n }\n :host([dark][disabled]) {\n --t-bg-color-inner: ${unsafeCSS(DarkPalette.MAIN)};\n }\n`;\n\nexport const toggleButtonContainerStyles = css`\n .t-toggle-button-full-container {\n display: flex;\n justify-content: var(--t-label-right-default-justify, flex-start);\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n :host([disabled]) .t-toggle-button-full-container {\n cursor: not-allowed;\n }\n .t-toggle-button-container {\n --t-toggle-button-size-box: 3rem;\n --t-toggle-button-shadow-width: 2px;\n --t-toggle-inner-radio: 1rem;\n display: block;\n position: relative;\n height: calc(var(--t-toggle-button-size-box) / 2);\n width: var(--t-toggle-button-size-box);\n min-width: var(--t-toggle-button-size-box);\n }\n .t-toggle-button-container .t-toggle-button {\n position: absolute;\n opacity: 0;\n height: 0;\n width: 0;\n }\n .t-radio-button-full-container:not(.t-with-label-left) {\n justify-content: flex-start;\n }\n @media only screen and (max-width: ${ScreenSizes.MOBILE}px) {\n .t-toggle-button-container {\n --t-toggle-button-size-box: 2rem;\n --t-toggle-button-shadow-width: 1px;\n --t-toggle-inner-radio: 0.75rem;\n margin-top: 1px;\n }\n }\n`;\n\nexport const toggleButtonCheckmarkStyles = css`\n .t-toggle-button-container .t-toggle-button-checkmark {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n height: calc(var(--t-toggle-button-size-box) / 2);\n width: var(--t-toggle-button-size-box);\n border-radius: 0.75rem;\n background-color: var(--t-bg-color-primary);\n box-sizing: border-box;\n }\n .t-toggle-button-container\n .t-toggle-button:checked\n ~ .t-toggle-button-checkmark {\n background-color: var(--t-main-color-tuix);\n }\n .t-toggle-button-full-container:hover\n .t-toggle-button-container\n .t-toggle-button-checkmark {\n box-shadow: 0px 4px 4px 0px var(--t-toggle-shadow-color-focus);\n }\n .t-toggle-button-container\n .t-toggle-button:focus\n ~ .t-toggle-button-checkmark {\n box-shadow: 0 0 0px var(--t-toggle-button-shadow-width)\n var(--t-stroke-color-focus);\n }\n .t-toggle-button-container\n .t-toggle-button:disabled\n ~ .t-toggle-button-checkmark {\n background-color: var(--t-bg-color-disabled);\n box-shadow: none;\n }\n`;\n\nexport const toggleButtonInnerStyles = css`\n .t-toggle-button-container .t-toggle-button-checkmark .t-toggle-button-inner {\n background-color: var(--t-bg-color-inner, ${unsafeCSS(Palette.WHITE)});\n margin: auto auto auto calc(var(--t-toggle-button-shadow-width) * 2);\n height: var(--t-toggle-inner-radio);\n width: var(--t-toggle-inner-radio);\n border-radius: 50%;\n display: block;\n transition: 0.3s;\n }\n .t-toggle-button-container\n .t-toggle-button:checked\n ~ .t-toggle-button-checkmark\n .t-toggle-button-inner {\n transform: translateX(\n calc(\n var(--t-toggle-button-size-box) - var(--t-toggle-inner-radio) -\n var(--t-toggle-button-shadow-width) * 4\n )\n );\n }\n`;\n\nexport const toggleButtonLabelStyles = css`\n .t-toggle-button-label {\n display: block;\n color: var(--t-text-color-label);\n margin-left: 0.625rem;\n }\n .t-toggle-button-full-container.t-with-label-left {\n flex-direction: row-reverse;\n justify-content: var(--t-label-left-default-justify, space-between);\n }\n .t-toggle-button-full-container.t-with-label-left .t-toggle-button-label {\n margin-right: 0.625rem;\n margin-left: 0;\n }\n`;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tuix-toggle.interface.js","sourceRoot":"","sources":["../../../../src/tuix-toggle-button/interfaces/tuix-toggle.interface.ts"],"names":[],"mappings":"","sourcesContent":["import { CustomEventTuixCheckbox } from '../../tuix-checkbox/interfaces/tuix-checkbox.interface';\n\nexport type CustomEventTuixToggle = CustomEventTuixCheckbox;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"colors.js","sourceRoot":"","sources":["../../../src/utils/colors.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,OA4BX;AA5BD,WAAY,OAAO;IACjB,iCAAsB,CAAA;IACtB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,2BAAgB,CAAA;IAChB,gCAAqB,CAAA;IACrB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,gCAAqB,CAAA;IACrB,4BAAiB,CAAA;IACjB,4BAAiB,CAAA;IACjB,kCAAuB,CAAA;IACvB,kCAAuB,CAAA;IACvB,8BAAmB,CAAA;IACnB,iCAAsB,CAAA;IACtB,iCAAsB,CAAA;IACtB,oCAAyB,CAAA;IACzB,qCAA0B,CAAA;IAC1B,4BAAiB,CAAA;IACjB,+BAAoB,CAAA;IACpB,gCAAqB,CAAA;IACrB,iCAAsB,CAAA;IACtB,6CAAkC,CAAA;AACpC,CAAC,EA5BW,OAAO,KAAP,OAAO,QA4BlB","sourcesContent":["export enum Palette {\n PRIMARY_50 = '#F5F5FA',\n PRIMARY_100 = '#EBEAF4',\n PRIMARY_200 = '#D1D1E6',\n PRIMARY_300 = '#A8A9D1',\n PRIMARY_400 = '#7A7CB6',\n MAIN = '#585A9D',\n DARK_MAIN = '#33355B',\n PRIMARY_600 = '#454584',\n PRIMARY_700 = '#3A396B',\n PRIMARY_800 = '#32325A',\n PRIMARY_900 = '#2E2D4D',\n PRIMARY_950 = '#1F1E33',\n SECONDARY = '#BBADFF',\n WHITE = '#FFFFFF',\n BLACK = '#121212',\n NEUTRAL_200 = '#C9C8D3',\n NEUTRAL_600 = '#8A8894',\n SUCCESS = '#439F6E',\n SUCCESS_50 = '#F1F9F5',\n VALIDATION = '#FFB82E',\n VALIDATION_50 = '#FFFBF4',\n VALIDATION_200 = '#FFEAC1',\n ERROR = '#F93232',\n ERROR_50 = '#FFF5F5',\n ERROR_200 = '#FFD8D8',\n SECTION_BG = '#FAFAFA',\n SHADOW = 'rgba(66, 79, 101, 0.16)',\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"darkColors.js","sourceRoot":"","sources":["../../../src/utils/darkColors.ts"],"names":[],"mappings":"AAEA,MAAM,CAAN,IAAY,WA8BX;AA9BD,WAAY,WAAW;IACrB,qCAA+B,CAAA;IAC/B,sCAAiC,CAAA;IACjC,sCAAiC,CAAA;IACjC,sCAAiC,CAAA;IACjC,+BAAgB,CAAA;IAChB,oCAA6B,CAAA;IAC7B,sCAAiC,CAAA;IACjC,sCAAiC,CAAA;IACjC,sCAAiC,CAAA;IACjC,sCAAiC,CAAA;IACjC,sCAAiC,CAAA;IACjC,oCAA6B,CAAA;IAC7B,kDAAmC,CAAA;IACnC,gCAAiB,CAAA;IACjB,sCAAiC,CAAA;IACjC,wDAAyC,CAAA;IACzC,kCAAmB,CAAA;IACnB,uDAAwC,CAAA;IACxC,qCAAsB,CAAA;IACtB,0DAA2C,CAAA;IAC3C,yCAA0B,CAAA;IAC1B,gCAAiB,CAAA;IACjB,qDAAsC,CAAA;IACtC,oCAA6B,CAAA;IAC7B,qCAAsB,CAAA;IACtB,sCAAuB,CAAA;IACvB,sCAAuB,CAAA;IACvB,sCAAuB,CAAA;IACvB,sCAAuB,CAAA;AACzB,CAAC,EA9BW,WAAW,KAAX,WAAW,QA8BtB","sourcesContent":["import { Palette } from './colors';\n\nexport enum DarkPalette {\n PRIMARY_50 = Palette.PRIMARY_50,\n PRIMARY_100 = Palette.PRIMARY_100,\n PRIMARY_200 = Palette.PRIMARY_200,\n PRIMARY_300 = Palette.PRIMARY_300,\n MAIN = '#7A7CB6',\n DARK_MAIN = Palette.DARK_MAIN,\n PRIMARY_600 = Palette.PRIMARY_600,\n PRIMARY_700 = Palette.PRIMARY_700,\n PRIMARY_800 = Palette.PRIMARY_800,\n PRIMARY_900 = Palette.PRIMARY_900,\n PRIMARY_950 = Palette.PRIMARY_950,\n SECONDARY = Palette.SECONDARY,\n WHITE = 'rgba(255, 255, 255, 0.87)',\n BLACK = '#121212',\n NEUTRAL_200 = Palette.NEUTRAL_200,\n NEUTRAL_600 = 'rgba(255, 255, 255, 0.60)',\n SUCCESS = '#82C5A9',\n SUCCESS_50 = 'rgba(241, 249, 245, 0.30)',\n VALIDATION = '#FFD489',\n VALIDATION_50 = 'rgba(255, 212, 137, 0.20)',\n VALIDATION_200 = '#FFEAC1',\n ERROR = '#FF8486',\n ERROR_50 = 'rgba(255, 132, 134, 0.20)',\n ERROR_200 = Palette.ERROR_200,\n SECTION_BG = '#0E0E0E',\n ELEVATION_1 = '#17171A',\n ELEVATION_2 = '#1A1A1F',\n ELEVATION_3 = '#1D1E24',\n ELEVATION_4 = '#212128',\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"hex-rgb.js","sourceRoot":"","sources":["../../../src/utils/hex-rgb.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,GAAW,EAAE,EAAE;IACtC,MAAM,MAAM,GAAG,2CAA2C,CAAC;IAC3D,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAChC,OAAO,MAAM;QACX,CAAC,CAAC;YACE,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;YAC1B,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;YAC1B,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;SAC3B;QACH,CAAC,CAAC;YACE,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;SACL,CAAC;AACR,CAAC,CAAC","sourcesContent":["export const hexToRgb = (hex: string) => {\n const hexExp = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i;\n const result = hexExp.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : {\n r: 0,\n g: 0,\n b: 0,\n };\n};\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"detail-value.interface.js","sourceRoot":"","sources":["../../../../src/utils/interfaces/detail-value.interface.ts"],"names":[],"mappings":"","sourcesContent":["export interface DetailValue<T = unknown> {\n value: T;\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"mainVariant.enum.js","sourceRoot":"","sources":["../../../src/utils/mainVariant.enum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,WAGX;AAHD,WAAY,WAAW;IACrB,kCAAmB,CAAA;IACnB,sCAAuB,CAAA;AACzB,CAAC,EAHW,WAAW,KAAX,WAAW,QAGtB","sourcesContent":["export enum MainVariant {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"screenSizes.enum.js","sourceRoot":"","sources":["../../../src/utils/screenSizes.enum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,WAGX;AAHD,WAAY,WAAW;IACrB,oDAAa,CAAA;IACb,mDAAY,CAAA;AACd,CAAC,EAHW,WAAW,KAAX,WAAW,QAGtB","sourcesContent":["export enum ScreenSizes {\n TABLET = 1280,\n MOBILE = 640,\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"slottedClassName.js","sourceRoot":"","sources":["../../../src/utils/slottedClassName.ts"],"names":[],"mappings":"AAAA,eAAe,CAAC,SAAiB,EAAE,EAAE,CACnC,IAAI,SAAS,MAAM,SAAS,eAAe,CAAC","sourcesContent":["export default (className: string) =>\n `.${className}, .${className} ::slotted(*)`;\n"]}