@aquera/nile-elements 1.5.6 → 1.5.7

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 (161) hide show
  1. package/README.md +6 -0
  2. package/dist/index.js +110 -31
  3. package/dist/nile-auto-complete/nile-auto-complete.cjs.js +1 -1
  4. package/dist/nile-auto-complete/nile-auto-complete.cjs.js.map +1 -1
  5. package/dist/nile-auto-complete/nile-auto-complete.css.cjs.js +1 -1
  6. package/dist/nile-auto-complete/nile-auto-complete.css.cjs.js.map +1 -1
  7. package/dist/nile-auto-complete/nile-auto-complete.css.esm.js +4 -2
  8. package/dist/nile-auto-complete/nile-auto-complete.esm.js +1 -1
  9. package/dist/nile-button/nile-button.css.cjs.js +1 -1
  10. package/dist/nile-button/nile-button.css.cjs.js.map +1 -1
  11. package/dist/nile-button/nile-button.css.esm.js +7 -3
  12. package/dist/nile-calendar/nile-calendar.cjs.js +1 -1
  13. package/dist/nile-calendar/nile-calendar.cjs.js.map +1 -1
  14. package/dist/nile-calendar/nile-calendar.css.cjs.js +1 -1
  15. package/dist/nile-calendar/nile-calendar.css.cjs.js.map +1 -1
  16. package/dist/nile-calendar/nile-calendar.css.esm.js +7 -0
  17. package/dist/nile-calendar/nile-calendar.esm.js +6 -5
  18. package/dist/nile-chip/nile-chip.css.cjs.js +1 -1
  19. package/dist/nile-chip/nile-chip.css.cjs.js.map +1 -1
  20. package/dist/nile-chip/nile-chip.css.esm.js +1 -0
  21. package/dist/nile-code-editor/nile-code-editor.cjs.js +1 -1
  22. package/dist/nile-code-editor/nile-code-editor.cjs.js.map +1 -1
  23. package/dist/nile-code-editor/nile-code-editor.css.cjs.js +1 -1
  24. package/dist/nile-code-editor/nile-code-editor.css.cjs.js.map +1 -1
  25. package/dist/nile-code-editor/nile-code-editor.css.esm.js +3 -0
  26. package/dist/nile-code-editor/nile-code-editor.esm.js +1 -0
  27. package/dist/nile-filter-chip/nile-filter-chip.css.cjs.js +1 -1
  28. package/dist/nile-filter-chip/nile-filter-chip.css.cjs.js.map +1 -1
  29. package/dist/nile-filter-chip/nile-filter-chip.css.esm.js +8 -2
  30. package/dist/nile-icon/icons/svg/close.cjs.js +1 -1
  31. package/dist/nile-icon/icons/svg/close.cjs.js.map +1 -1
  32. package/dist/nile-icon/icons/svg/close.esm.js +1 -1
  33. package/dist/nile-input/nile-input.cjs.js +1 -1
  34. package/dist/nile-input/nile-input.cjs.js.map +1 -1
  35. package/dist/nile-input/nile-input.css.cjs.js +1 -1
  36. package/dist/nile-input/nile-input.css.cjs.js.map +1 -1
  37. package/dist/nile-input/nile-input.css.esm.js +11 -1
  38. package/dist/nile-input/nile-input.esm.js +2 -0
  39. package/dist/nile-link/nile-link.css.cjs.js +1 -1
  40. package/dist/nile-link/nile-link.css.cjs.js.map +1 -1
  41. package/dist/nile-link/nile-link.css.esm.js +5 -3
  42. package/dist/nile-radio/nile-radio.cjs.js +1 -1
  43. package/dist/nile-radio/nile-radio.cjs.js.map +1 -1
  44. package/dist/nile-radio/nile-radio.css.cjs.js +1 -1
  45. package/dist/nile-radio/nile-radio.css.cjs.js.map +1 -1
  46. package/dist/nile-radio/nile-radio.css.esm.js +2 -2
  47. package/dist/nile-radio/nile-radio.esm.js +2 -2
  48. package/dist/nile-radio-group/nile-radio-group.cjs.js +1 -1
  49. package/dist/nile-radio-group/nile-radio-group.cjs.js.map +1 -1
  50. package/dist/nile-radio-group/nile-radio-group.esm.js +1 -1
  51. package/dist/nile-rich-text-editor/nile-rich-text-editor.cjs.js +1 -1
  52. package/dist/nile-rich-text-editor/nile-rich-text-editor.cjs.js.map +1 -1
  53. package/dist/nile-rich-text-editor/nile-rich-text-editor.css.cjs.js +1 -1
  54. package/dist/nile-rich-text-editor/nile-rich-text-editor.css.cjs.js.map +1 -1
  55. package/dist/nile-rich-text-editor/nile-rich-text-editor.css.esm.js +6 -0
  56. package/dist/nile-rich-text-editor/nile-rich-text-editor.esm.js +1 -1
  57. package/dist/nile-select/nile-select.cjs.js +1 -1
  58. package/dist/nile-select/nile-select.cjs.js.map +1 -1
  59. package/dist/nile-select/nile-select.css.cjs.js +1 -1
  60. package/dist/nile-select/nile-select.css.cjs.js.map +1 -1
  61. package/dist/nile-select/nile-select.css.esm.js +21 -5
  62. package/dist/nile-select/nile-select.esm.js +6 -6
  63. package/dist/nile-slide-toggle/nile-slide-toggle.cjs.js +1 -1
  64. package/dist/nile-slide-toggle/nile-slide-toggle.cjs.js.map +1 -1
  65. package/dist/nile-slide-toggle/nile-slide-toggle.esm.js +4 -3
  66. package/dist/nile-textarea/nile-textarea.css.cjs.js +1 -1
  67. package/dist/nile-textarea/nile-textarea.css.cjs.js.map +1 -1
  68. package/dist/nile-textarea/nile-textarea.css.esm.js +9 -2
  69. package/dist/nile-virtual-select/nile-virtual-select.cjs.js +3 -3
  70. package/dist/nile-virtual-select/nile-virtual-select.cjs.js.map +1 -1
  71. package/dist/nile-virtual-select/nile-virtual-select.css.cjs.js +1 -1
  72. package/dist/nile-virtual-select/nile-virtual-select.css.cjs.js.map +1 -1
  73. package/dist/nile-virtual-select/nile-virtual-select.css.esm.js +13 -3
  74. package/dist/nile-virtual-select/nile-virtual-select.esm.js +5 -5
  75. package/dist/src/nile-auto-complete/nile-auto-complete.css.js +2 -0
  76. package/dist/src/nile-auto-complete/nile-auto-complete.css.js.map +1 -1
  77. package/dist/src/nile-auto-complete/nile-auto-complete.js +1 -1
  78. package/dist/src/nile-auto-complete/nile-auto-complete.js.map +1 -1
  79. package/dist/src/nile-button/nile-button.css.js +7 -3
  80. package/dist/src/nile-button/nile-button.css.js.map +1 -1
  81. package/dist/src/nile-calendar/nile-calendar.css.js +7 -0
  82. package/dist/src/nile-calendar/nile-calendar.css.js.map +1 -1
  83. package/dist/src/nile-calendar/nile-calendar.js +6 -5
  84. package/dist/src/nile-calendar/nile-calendar.js.map +1 -1
  85. package/dist/src/nile-chip/nile-chip.css.js +1 -0
  86. package/dist/src/nile-chip/nile-chip.css.js.map +1 -1
  87. package/dist/src/nile-code-editor/nile-code-editor.css.js +3 -0
  88. package/dist/src/nile-code-editor/nile-code-editor.css.js.map +1 -1
  89. package/dist/src/nile-code-editor/nile-code-editor.js +1 -0
  90. package/dist/src/nile-code-editor/nile-code-editor.js.map +1 -1
  91. package/dist/src/nile-detail/nile-detail.test.js +6 -6
  92. package/dist/src/nile-detail/nile-detail.test.js.map +1 -1
  93. package/dist/src/nile-filter-chip/nile-filter-chip.css.js +6 -0
  94. package/dist/src/nile-filter-chip/nile-filter-chip.css.js.map +1 -1
  95. package/dist/src/nile-icon/icons/svg/close.d.ts +1 -1
  96. package/dist/src/nile-icon/icons/svg/close.js +1 -1
  97. package/dist/src/nile-icon/icons/svg/close.js.map +1 -1
  98. package/dist/src/nile-inline-sidebar-group/nile-inline-sidebar-group.test.js +1 -1
  99. package/dist/src/nile-inline-sidebar-group/nile-inline-sidebar-group.test.js.map +1 -1
  100. package/dist/src/nile-inline-sidebar-item/nile-inline-sidebar-item.test.js +5 -5
  101. package/dist/src/nile-inline-sidebar-item/nile-inline-sidebar-item.test.js.map +1 -1
  102. package/dist/src/nile-input/nile-input.css.js +11 -1
  103. package/dist/src/nile-input/nile-input.css.js.map +1 -1
  104. package/dist/src/nile-input/nile-input.js +2 -0
  105. package/dist/src/nile-input/nile-input.js.map +1 -1
  106. package/dist/src/nile-link/nile-link.css.js +3 -1
  107. package/dist/src/nile-link/nile-link.css.js.map +1 -1
  108. package/dist/src/nile-radio/nile-radio.css.js +2 -2
  109. package/dist/src/nile-radio/nile-radio.css.js.map +1 -1
  110. package/dist/src/nile-radio/nile-radio.js +15 -1
  111. package/dist/src/nile-radio/nile-radio.js.map +1 -1
  112. package/dist/src/nile-radio-group/nile-radio-group.js +8 -0
  113. package/dist/src/nile-radio-group/nile-radio-group.js.map +1 -1
  114. package/dist/src/nile-rich-text-editor/nile-rich-text-editor.css.js +6 -0
  115. package/dist/src/nile-rich-text-editor/nile-rich-text-editor.css.js.map +1 -1
  116. package/dist/src/nile-rich-text-editor/nile-rich-text-editor.js +8 -3
  117. package/dist/src/nile-rich-text-editor/nile-rich-text-editor.js.map +1 -1
  118. package/dist/src/nile-select/nile-select.css.js +21 -5
  119. package/dist/src/nile-select/nile-select.css.js.map +1 -1
  120. package/dist/src/nile-select/nile-select.js +2 -2
  121. package/dist/src/nile-select/nile-select.js.map +1 -1
  122. package/dist/src/nile-slide-toggle/nile-slide-toggle.js +1 -0
  123. package/dist/src/nile-slide-toggle/nile-slide-toggle.js.map +1 -1
  124. package/dist/src/nile-textarea/nile-textarea.css.js +9 -2
  125. package/dist/src/nile-textarea/nile-textarea.css.js.map +1 -1
  126. package/dist/src/nile-virtual-select/nile-virtual-select.css.js +13 -3
  127. package/dist/src/nile-virtual-select/nile-virtual-select.css.js.map +1 -1
  128. package/dist/src/nile-virtual-select/nile-virtual-select.js +2 -2
  129. package/dist/src/nile-virtual-select/nile-virtual-select.js.map +1 -1
  130. package/dist/src/version.js +2 -2
  131. package/dist/src/version.js.map +1 -1
  132. package/dist/tsconfig.tsbuildinfo +1 -1
  133. package/package.json +1 -1
  134. package/src/nile-auto-complete/nile-auto-complete.css.ts +2 -0
  135. package/src/nile-auto-complete/nile-auto-complete.ts +1 -1
  136. package/src/nile-button/nile-button.css.ts +7 -3
  137. package/src/nile-calendar/nile-calendar.css.ts +7 -0
  138. package/src/nile-calendar/nile-calendar.ts +6 -5
  139. package/src/nile-chip/nile-chip.css.ts +1 -0
  140. package/src/nile-code-editor/nile-code-editor.css.ts +3 -0
  141. package/src/nile-code-editor/nile-code-editor.ts +1 -0
  142. package/src/nile-detail/nile-detail.test.ts +6 -6
  143. package/src/nile-filter-chip/nile-filter-chip.css.ts +6 -0
  144. package/src/nile-icon/icons/svg/close.ts +1 -1
  145. package/src/nile-inline-sidebar-group/nile-inline-sidebar-group.test.ts +1 -1
  146. package/src/nile-inline-sidebar-item/nile-inline-sidebar-item.test.ts +5 -5
  147. package/src/nile-input/nile-input.css.ts +11 -1
  148. package/src/nile-input/nile-input.ts +2 -0
  149. package/src/nile-link/nile-link.css.ts +3 -1
  150. package/src/nile-radio/nile-radio.css.ts +2 -2
  151. package/src/nile-radio/nile-radio.ts +17 -3
  152. package/src/nile-radio-group/nile-radio-group.ts +6 -0
  153. package/src/nile-rich-text-editor/nile-rich-text-editor.css.ts +6 -0
  154. package/src/nile-rich-text-editor/nile-rich-text-editor.ts +8 -3
  155. package/src/nile-select/nile-select.css.ts +21 -5
  156. package/src/nile-select/nile-select.ts +2 -2
  157. package/src/nile-slide-toggle/nile-slide-toggle.ts +1 -0
  158. package/src/nile-textarea/nile-textarea.css.ts +9 -2
  159. package/src/nile-virtual-select/nile-virtual-select.css.ts +13 -3
  160. package/src/nile-virtual-select/nile-virtual-select.ts +2 -2
  161. package/web-test-runner.config.mjs +6 -3
@@ -1 +1 @@
1
- {"version":3,"file":"nile-textarea.css.cjs.js","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * TextArea CSS\n */\nexport const styles = css`\n .form-control .form-control__label {\n display: none;\n }\n\n .form-control .form-control__help-text {\n display: none;\n }\n\n /* Label */\n .form-control--has-label .form-control__label {\n display: inline-block;\n margin-bottom: var(--nile-spacing-sm, var(--ng-spacing-sm));\n color: var(--nile-textarea-label-color, var(--ng-colors-text-secondary-700));\n font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n font-style: normal;\n font-weight: var(--nile-textarea-label-font-weight, var(--ng-font-weight-medium));\n line-height: var(--nile-textarea-label-line-height, var(--ng-line-height-text-sm));\n letter-spacing: 0.2px;\n }\n\n .form-control--has-label.form-control--medium .form-control__label {\n font-size: var(--nile-font-size-base, var(--ng-font-size-text-sm));\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));\n }\n\n /* Help text */\n .form-control--has-help-text .form-control__help-text {\n display: block;\n color: var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n margin-top: var(--nile-spacing-sm, var(--ng-spacing-sm));\n }\n\n /* Error message */\n .form-control__error-message {\n display: block;\n color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));\n margin-top: var(--nile-spacing-lg, var(--ng-spacing-sm));\n font-size: var(--nile-type-scale-2), var(--ng-font-size-text-md);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n letter-spacing: 0.2px;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: var(--nile-type-scale-1, var(--ng-font-size-text-sm));\n }\n\n /* Host styles */\n :host {\n display: block;\n -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n }\n\n /* Textarea styles */\n .textarea {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n letter-spacing: 0.5px;\n vertical-align: middle;\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n transition: var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) color, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) border, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) box-shadow, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) background-color;\n cursor: text;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n /* Standard textareas */\n .textarea--standard {\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n border: 1px solid var(--nile-textarea-standard-border-color, var(--ng-colors-border-primary));\n box-shadow:var(--nile-textarea-standard-box-shadow, var(--ng-colors-effects-shadow-xs));\n }\n\n .textarea--standard:hover:not(.textarea--disabled) {\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-fg-quaternary-400));\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n }\n\n .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n border-color: var(--nile-colors-dark-900, var(--ng-colors-fg-quaternary-400));\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled) {\n position: relative; \n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n box-shadow: var(--nile-textarea-standard-focused-box-shadow, var(--ng-colors-effects-shadow-xs));\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-brand));\n /* border-width: var(--nile-border-width-1, var(--ng-border-width-2)); */\n}\n\n/* Added to apply the hover effect in nxtgen */\n.textarea--standard.textarea--focused:not(.textarea--disabled)::before {\n content: \"\";\n position: absolute;\n inset: 0; \n pointer-events: none; \n border-radius: 6.5px;\n box-shadow: inset 0 0 0 1px var(--ng-colors-border-brand);\n}\n\n\n .textarea--standard.textarea--warning:not(.textarea--disabled):hover {\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-warning));\n }\n\n .textarea--standard.textarea--warning.textarea--focused:not(.textarea--disabled) {\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-warning-subtle));\n border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n }\n\n .textarea--standard.textarea--error:not(.textarea--disabled):hover {\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-error));\n }\n\n .textarea--standard.textarea--error.textarea--focused:not(.textarea--disabled) {\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-error));\n }\n\n .textarea--standard.textarea--success:not(.textarea--disabled):hover {\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-success));\n }\n\n .textarea--standard.textarea--success.textarea--focused:not(.textarea--disabled) {\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-success));\n border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled)\n .textarea__control {\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n }\n\n .textarea--standard.textarea--disabled {\n border-color: var(--nile-textarea-standard-disabled-border-color, var(--ng-colors-border-disabled));\n background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n cursor: not-allowed;\n box-shadow:var(--nile-textarea-standard-disabled-box-shadow, var(--ng-colors-effects-shadow-xs));\n }\n\n .textarea--standard.textarea--disabled .textarea__control {\n color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled));\n \n }\n\n .textarea--standard.textarea--disabled .textarea__control::placeholder {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder));\n }\n\n /* Textarea control styles */\n .textarea__control {\n flex: 1 1 auto;\n font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n font-style: normal;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md)); /* 100% */\n letter-spacing: 0.2px;\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n border: none;\n background: none;\n box-shadow: none;\n cursor: inherit;\n -webkit-appearance: none;\n }\n\n .textarea--standard.textarea--disabled .textarea__control {\n cursor: not-allowed;\n resize: none;\n }\n\n .textarea__control::-webkit-search-decoration,\n .textarea__control::-webkit-search-cancel-button,\n .textarea__control::-webkit-search-results-button,\n .textarea__control::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n\n .textarea__control::placeholder {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder));\n user-select: none;\n }\n\n .textarea__control:focus {\n outline: none;\n }\n\n .textarea--medium .textarea__control {\n padding: var(--nile-spacing-lg, var(--ng-spacing-lg));\n }\n\n /* Resize types */\n .textarea--resize-none .textarea__control {\n resize: none;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n .textarea--resize-vertical .textarea__control {\n resize: vertical;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n .textarea--resize-auto .textarea__control {\n resize: none;\n overflow-y: hidden;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n .textarea--standard.textarea--warning {\n border-color: var(--nile-colors-yellow-500, var(--ng-colors-border-warning-subtle));\n }\n\n .textarea--standard.textarea--error {\n border-color: var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));\n }\n\n .textarea--standard.textarea--success {\n border-color: var(--nile-colors-green-500, var(--ng-colors-border-success-subtle));\n }\n\n .textarea--standard.textarea--destructive {\n border-color: var(--nile-colors-red-400);\n box-shadow: var(--nile-box-shadow-1, var(--ng-colors-effects-shadow-xs));\n }\n\n .textarea--standard.textarea--destructive.textarea--focused {\n border-color: var(--nile-colors-red-400, var(--ng-colors-border-error));\n box-shadow: var(--nile-box-shadow-5, var(--ng-colors-effects-shadow-xs));\n }\n\n .input__non-printable {\n border-radius: var(--nile-radius-sm, var(--ng-radius-xs));\n max-width: 400px;\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n //TODO: Need Token from design system\n border: 1px solid var(--nile-colors-red-500);\n //TODO: Need Token from design system\n color: var(--nile-colors-red-500);\n padding: var(--nile-spacing-lg, var(--ng-spacing-lg));\n font-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));\n max-height: 300px;\n overflow-y: auto;\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n }\n\n .input__remove-non-printable {\n color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n margin-left: var(--nile-spacing-lg, var(--ng-spacing-lg));\n font-size: var(--nile-type-scale-3, var(--nile-font-size-base));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n cursor: pointer;\n }\n\n .input__srtiked-text-container {\n margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n word-break: break-all;\n overflow-wrap: break-word;\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n }\n\n .input__srtiked-text {\n text-decoration: line-through;\n text-decoration-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n background-color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
1
+ {"version":3,"file":"nile-textarea.css.cjs.js","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * TextArea CSS\n */\nexport const styles = css`\n .form-control .form-control__label {\n display: none;\n }\n\n .form-control .form-control__help-text {\n display: none;\n }\n\n /* Label */\n .form-control--has-label .form-control__label {\n display: inline-block;\n margin-bottom: var(--nile-spacing-sm, var(--ng-spacing-sm));\n color: var(--nile-textarea-label-color, var(--ng-colors-text-secondary-700));\n font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n font-style: normal;\n font-weight: var(--nile-textarea-label-font-weight, var(--ng-font-weight-medium));\n line-height: var(--nile-textarea-label-line-height, var(--ng-line-height-text-sm));\n letter-spacing: 0.2px;\n }\n\n .form-control--has-label.form-control--medium .form-control__label {\n font-size: var(--nile-font-size-base, var(--ng-font-size-text-sm));\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));\n }\n\n /* Help text */\n .form-control--has-help-text .form-control__help-text {\n display: block;\n color: var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n margin-top: var(--nile-spacing-sm, var(--ng-spacing-sm));\n }\n\n /* Error message */\n .form-control__error-message {\n display: block;\n color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));\n margin-top: var(--nile-spacing-lg, var(--ng-spacing-sm));\n font-size: var(--nile-type-scale-2), var(--ng-font-size-text-md);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n letter-spacing: 0.2px;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: var(--nile-type-scale-1, var(--ng-font-size-text-sm));\n }\n\n /* Host styles */\n :host {\n display: block;\n -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n }\n\n :host([disabled]) .form-control--has-label .form-control__label {\n user-select: none;\n -webkit-user-select: none;\n }\n\n /* Textarea styles */\n .textarea {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n letter-spacing: 0.5px;\n vertical-align: middle;\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n transition: var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) color, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) border, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) box-shadow, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) background-color;\n cursor: text;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n /* Standard textareas */\n .textarea--standard {\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n border: 1px solid var(--nile-textarea-standard-border-color, var(--ng-colors-border-primary));\n box-shadow:var(--nile-textarea-standard-box-shadow, var(--ng-colors-effects-shadow-xs));\n }\n\n .textarea--standard:hover:not(.textarea--disabled) {\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-fg-quaternary-400));\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n }\n\n .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n border-color: var(--nile-colors-dark-900, var(--ng-colors-fg-quaternary-400));\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled) {\n position: relative; \n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n box-shadow: var(--nile-textarea-standard-focused-box-shadow, var(--ng-colors-effects-shadow-xs));\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-brand));\n /* border-width: var(--nile-border-width-1, var(--ng-border-width-2)); */\n}\n\n/* Added to apply the hover effect in nxtgen */\n.textarea--standard.textarea--focused:not(.textarea--disabled)::before {\n content: \"\";\n position: absolute;\n inset: 0; \n pointer-events: none; \n border-radius: 6.5px;\n box-shadow: inset 0 0 0 1px var(--ng-colors-border-brand);\n}\n\n\n .textarea--standard.textarea--warning:not(.textarea--disabled):hover {\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-warning));\n }\n\n .textarea--standard.textarea--warning.textarea--focused:not(.textarea--disabled) {\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-warning-subtle));\n border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n }\n\n .textarea--standard.textarea--error:not(.textarea--disabled):hover {\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-error));\n }\n\n .textarea--standard.textarea--error.textarea--focused:not(.textarea--disabled) {\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-error));\n }\n\n .textarea--standard.textarea--success:not(.textarea--disabled):hover {\n border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-success));\n }\n\n .textarea--standard.textarea--success.textarea--focused:not(.textarea--disabled) {\n border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-success));\n border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled)\n .textarea__control {\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n }\n\n .textarea--standard.textarea--disabled {\n border-color: var(--nile-textarea-standard-disabled-border-color, var(--ng-colors-border-disabled));\n background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n cursor: not-allowed;\n user-select: none;\n -webkit-user-select: none;\n box-shadow:var(--nile-textarea-standard-disabled-box-shadow, var(--ng-colors-effects-shadow-xs));\n }\n\n .textarea--standard.textarea--disabled .textarea__control {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n pointer-events: none;\n }\n\n .textarea--standard.textarea--disabled .textarea__control::placeholder {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder));\n }\n\n /* Textarea control styles */\n .textarea__control {\n flex: 1 1 auto;\n font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n font-style: normal;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md)); /* 100% */\n letter-spacing: 0.2px;\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n border: none;\n background: none;\n box-shadow: none;\n cursor: inherit;\n -webkit-appearance: none;\n }\n\n .textarea--standard.textarea--disabled .textarea__control {\n cursor: not-allowed;\n resize: none;\n }\n\n .textarea__control::-webkit-search-decoration,\n .textarea__control::-webkit-search-cancel-button,\n .textarea__control::-webkit-search-results-button,\n .textarea__control::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n\n .textarea__control::placeholder {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder));\n user-select: none;\n }\n\n .textarea__control:focus {\n outline: none;\n }\n\n .textarea--medium .textarea__control {\n padding: var(--nile-spacing-lg, var(--ng-spacing-lg));\n }\n\n /* Resize types */\n .textarea--resize-none .textarea__control {\n resize: none;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n .textarea--resize-vertical .textarea__control {\n resize: vertical;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n .textarea--resize-auto .textarea__control {\n resize: none;\n overflow-y: hidden;\n min-height: var(--nile-height-12px, var(--ng-height-12px));\n }\n\n .textarea--standard.textarea--warning {\n border-color: var(--nile-colors-yellow-500, var(--ng-colors-border-warning-subtle));\n }\n\n .textarea--standard.textarea--error {\n border-color: var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));\n }\n\n .textarea--standard.textarea--success {\n border-color: var(--nile-colors-green-500, var(--ng-colors-border-success-subtle));\n }\n\n .textarea--standard.textarea--destructive {\n border-color: var(--nile-colors-red-400);\n box-shadow: var(--nile-box-shadow-1, var(--ng-colors-effects-shadow-xs));\n }\n\n .textarea--standard.textarea--destructive.textarea--focused {\n border-color: var(--nile-colors-red-400, var(--ng-colors-border-error));\n box-shadow: var(--nile-box-shadow-5, var(--ng-colors-effects-shadow-xs));\n }\n\n .input__non-printable {\n border-radius: var(--nile-radius-sm, var(--ng-radius-xs));\n max-width: 400px;\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n //TODO: Need Token from design system\n border: 1px solid var(--nile-colors-red-500);\n //TODO: Need Token from design system\n color: var(--nile-colors-red-500);\n padding: var(--nile-spacing-lg, var(--ng-spacing-lg));\n font-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));\n max-height: 300px;\n overflow-y: auto;\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n }\n\n .input__remove-non-printable {\n color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n margin-left: var(--nile-spacing-lg, var(--ng-spacing-lg));\n font-size: var(--nile-type-scale-3, var(--nile-font-size-base));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n cursor: pointer;\n }\n\n .input__srtiked-text-container {\n margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n word-break: break-all;\n overflow-wrap: break-word;\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n }\n\n .input__srtiked-text {\n text-decoration: line-through;\n text-decoration-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n background-color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
@@ -61,6 +61,11 @@ import{css as r}from"lit";const e=r`
61
61
  text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));
62
62
  }
63
63
 
64
+ :host([disabled]) .form-control--has-label .form-control__label {
65
+ user-select: none;
66
+ -webkit-user-select: none;
67
+ }
68
+
64
69
  /* Textarea styles */
65
70
  .textarea {
66
71
  display: flex;
@@ -147,12 +152,14 @@ import{css as r}from"lit";const e=r`
147
152
  border-color: var(--nile-textarea-standard-disabled-border-color, var(--ng-colors-border-disabled));
148
153
  background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));
149
154
  cursor: not-allowed;
155
+ user-select: none;
156
+ -webkit-user-select: none;
150
157
  box-shadow:var(--nile-textarea-standard-disabled-box-shadow, var(--ng-colors-effects-shadow-xs));
151
158
  }
152
159
 
153
160
  .textarea--standard.textarea--disabled .textarea__control {
154
- color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled));
155
-
161
+ color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));
162
+ pointer-events: none;
156
163
  }
157
164
 
158
165
  .textarea--standard.textarea--disabled .textarea__control::placeholder {