@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.
- package/README.md +6 -0
- package/dist/index.js +110 -31
- package/dist/nile-auto-complete/nile-auto-complete.cjs.js +1 -1
- package/dist/nile-auto-complete/nile-auto-complete.cjs.js.map +1 -1
- package/dist/nile-auto-complete/nile-auto-complete.css.cjs.js +1 -1
- package/dist/nile-auto-complete/nile-auto-complete.css.cjs.js.map +1 -1
- package/dist/nile-auto-complete/nile-auto-complete.css.esm.js +4 -2
- package/dist/nile-auto-complete/nile-auto-complete.esm.js +1 -1
- package/dist/nile-button/nile-button.css.cjs.js +1 -1
- package/dist/nile-button/nile-button.css.cjs.js.map +1 -1
- package/dist/nile-button/nile-button.css.esm.js +7 -3
- package/dist/nile-calendar/nile-calendar.cjs.js +1 -1
- package/dist/nile-calendar/nile-calendar.cjs.js.map +1 -1
- package/dist/nile-calendar/nile-calendar.css.cjs.js +1 -1
- package/dist/nile-calendar/nile-calendar.css.cjs.js.map +1 -1
- package/dist/nile-calendar/nile-calendar.css.esm.js +7 -0
- package/dist/nile-calendar/nile-calendar.esm.js +6 -5
- package/dist/nile-chip/nile-chip.css.cjs.js +1 -1
- package/dist/nile-chip/nile-chip.css.cjs.js.map +1 -1
- package/dist/nile-chip/nile-chip.css.esm.js +1 -0
- package/dist/nile-code-editor/nile-code-editor.cjs.js +1 -1
- package/dist/nile-code-editor/nile-code-editor.cjs.js.map +1 -1
- package/dist/nile-code-editor/nile-code-editor.css.cjs.js +1 -1
- package/dist/nile-code-editor/nile-code-editor.css.cjs.js.map +1 -1
- package/dist/nile-code-editor/nile-code-editor.css.esm.js +3 -0
- package/dist/nile-code-editor/nile-code-editor.esm.js +1 -0
- package/dist/nile-filter-chip/nile-filter-chip.css.cjs.js +1 -1
- package/dist/nile-filter-chip/nile-filter-chip.css.cjs.js.map +1 -1
- package/dist/nile-filter-chip/nile-filter-chip.css.esm.js +8 -2
- package/dist/nile-icon/icons/svg/close.cjs.js +1 -1
- package/dist/nile-icon/icons/svg/close.cjs.js.map +1 -1
- package/dist/nile-icon/icons/svg/close.esm.js +1 -1
- package/dist/nile-input/nile-input.cjs.js +1 -1
- package/dist/nile-input/nile-input.cjs.js.map +1 -1
- package/dist/nile-input/nile-input.css.cjs.js +1 -1
- package/dist/nile-input/nile-input.css.cjs.js.map +1 -1
- package/dist/nile-input/nile-input.css.esm.js +11 -1
- package/dist/nile-input/nile-input.esm.js +2 -0
- package/dist/nile-link/nile-link.css.cjs.js +1 -1
- package/dist/nile-link/nile-link.css.cjs.js.map +1 -1
- package/dist/nile-link/nile-link.css.esm.js +5 -3
- package/dist/nile-radio/nile-radio.cjs.js +1 -1
- package/dist/nile-radio/nile-radio.cjs.js.map +1 -1
- package/dist/nile-radio/nile-radio.css.cjs.js +1 -1
- package/dist/nile-radio/nile-radio.css.cjs.js.map +1 -1
- package/dist/nile-radio/nile-radio.css.esm.js +2 -2
- package/dist/nile-radio/nile-radio.esm.js +2 -2
- package/dist/nile-radio-group/nile-radio-group.cjs.js +1 -1
- package/dist/nile-radio-group/nile-radio-group.cjs.js.map +1 -1
- package/dist/nile-radio-group/nile-radio-group.esm.js +1 -1
- package/dist/nile-rich-text-editor/nile-rich-text-editor.cjs.js +1 -1
- package/dist/nile-rich-text-editor/nile-rich-text-editor.cjs.js.map +1 -1
- package/dist/nile-rich-text-editor/nile-rich-text-editor.css.cjs.js +1 -1
- package/dist/nile-rich-text-editor/nile-rich-text-editor.css.cjs.js.map +1 -1
- package/dist/nile-rich-text-editor/nile-rich-text-editor.css.esm.js +6 -0
- package/dist/nile-rich-text-editor/nile-rich-text-editor.esm.js +1 -1
- package/dist/nile-select/nile-select.cjs.js +1 -1
- package/dist/nile-select/nile-select.cjs.js.map +1 -1
- package/dist/nile-select/nile-select.css.cjs.js +1 -1
- package/dist/nile-select/nile-select.css.cjs.js.map +1 -1
- package/dist/nile-select/nile-select.css.esm.js +21 -5
- package/dist/nile-select/nile-select.esm.js +6 -6
- package/dist/nile-slide-toggle/nile-slide-toggle.cjs.js +1 -1
- package/dist/nile-slide-toggle/nile-slide-toggle.cjs.js.map +1 -1
- package/dist/nile-slide-toggle/nile-slide-toggle.esm.js +4 -3
- package/dist/nile-textarea/nile-textarea.css.cjs.js +1 -1
- package/dist/nile-textarea/nile-textarea.css.cjs.js.map +1 -1
- package/dist/nile-textarea/nile-textarea.css.esm.js +9 -2
- package/dist/nile-virtual-select/nile-virtual-select.cjs.js +3 -3
- package/dist/nile-virtual-select/nile-virtual-select.cjs.js.map +1 -1
- package/dist/nile-virtual-select/nile-virtual-select.css.cjs.js +1 -1
- package/dist/nile-virtual-select/nile-virtual-select.css.cjs.js.map +1 -1
- package/dist/nile-virtual-select/nile-virtual-select.css.esm.js +13 -3
- package/dist/nile-virtual-select/nile-virtual-select.esm.js +5 -5
- package/dist/src/nile-auto-complete/nile-auto-complete.css.js +2 -0
- package/dist/src/nile-auto-complete/nile-auto-complete.css.js.map +1 -1
- package/dist/src/nile-auto-complete/nile-auto-complete.js +1 -1
- package/dist/src/nile-auto-complete/nile-auto-complete.js.map +1 -1
- package/dist/src/nile-button/nile-button.css.js +7 -3
- package/dist/src/nile-button/nile-button.css.js.map +1 -1
- package/dist/src/nile-calendar/nile-calendar.css.js +7 -0
- package/dist/src/nile-calendar/nile-calendar.css.js.map +1 -1
- package/dist/src/nile-calendar/nile-calendar.js +6 -5
- package/dist/src/nile-calendar/nile-calendar.js.map +1 -1
- package/dist/src/nile-chip/nile-chip.css.js +1 -0
- package/dist/src/nile-chip/nile-chip.css.js.map +1 -1
- package/dist/src/nile-code-editor/nile-code-editor.css.js +3 -0
- package/dist/src/nile-code-editor/nile-code-editor.css.js.map +1 -1
- package/dist/src/nile-code-editor/nile-code-editor.js +1 -0
- package/dist/src/nile-code-editor/nile-code-editor.js.map +1 -1
- package/dist/src/nile-detail/nile-detail.test.js +6 -6
- package/dist/src/nile-detail/nile-detail.test.js.map +1 -1
- package/dist/src/nile-filter-chip/nile-filter-chip.css.js +6 -0
- package/dist/src/nile-filter-chip/nile-filter-chip.css.js.map +1 -1
- package/dist/src/nile-icon/icons/svg/close.d.ts +1 -1
- package/dist/src/nile-icon/icons/svg/close.js +1 -1
- package/dist/src/nile-icon/icons/svg/close.js.map +1 -1
- package/dist/src/nile-inline-sidebar-group/nile-inline-sidebar-group.test.js +1 -1
- package/dist/src/nile-inline-sidebar-group/nile-inline-sidebar-group.test.js.map +1 -1
- package/dist/src/nile-inline-sidebar-item/nile-inline-sidebar-item.test.js +5 -5
- package/dist/src/nile-inline-sidebar-item/nile-inline-sidebar-item.test.js.map +1 -1
- package/dist/src/nile-input/nile-input.css.js +11 -1
- package/dist/src/nile-input/nile-input.css.js.map +1 -1
- package/dist/src/nile-input/nile-input.js +2 -0
- package/dist/src/nile-input/nile-input.js.map +1 -1
- package/dist/src/nile-link/nile-link.css.js +3 -1
- package/dist/src/nile-link/nile-link.css.js.map +1 -1
- package/dist/src/nile-radio/nile-radio.css.js +2 -2
- package/dist/src/nile-radio/nile-radio.css.js.map +1 -1
- package/dist/src/nile-radio/nile-radio.js +15 -1
- package/dist/src/nile-radio/nile-radio.js.map +1 -1
- package/dist/src/nile-radio-group/nile-radio-group.js +8 -0
- package/dist/src/nile-radio-group/nile-radio-group.js.map +1 -1
- package/dist/src/nile-rich-text-editor/nile-rich-text-editor.css.js +6 -0
- package/dist/src/nile-rich-text-editor/nile-rich-text-editor.css.js.map +1 -1
- package/dist/src/nile-rich-text-editor/nile-rich-text-editor.js +8 -3
- package/dist/src/nile-rich-text-editor/nile-rich-text-editor.js.map +1 -1
- package/dist/src/nile-select/nile-select.css.js +21 -5
- package/dist/src/nile-select/nile-select.css.js.map +1 -1
- package/dist/src/nile-select/nile-select.js +2 -2
- package/dist/src/nile-select/nile-select.js.map +1 -1
- package/dist/src/nile-slide-toggle/nile-slide-toggle.js +1 -0
- package/dist/src/nile-slide-toggle/nile-slide-toggle.js.map +1 -1
- package/dist/src/nile-textarea/nile-textarea.css.js +9 -2
- package/dist/src/nile-textarea/nile-textarea.css.js.map +1 -1
- package/dist/src/nile-virtual-select/nile-virtual-select.css.js +13 -3
- package/dist/src/nile-virtual-select/nile-virtual-select.css.js.map +1 -1
- package/dist/src/nile-virtual-select/nile-virtual-select.js +2 -2
- package/dist/src/nile-virtual-select/nile-virtual-select.js.map +1 -1
- package/dist/src/version.js +2 -2
- package/dist/src/version.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-auto-complete/nile-auto-complete.css.ts +2 -0
- package/src/nile-auto-complete/nile-auto-complete.ts +1 -1
- package/src/nile-button/nile-button.css.ts +7 -3
- package/src/nile-calendar/nile-calendar.css.ts +7 -0
- package/src/nile-calendar/nile-calendar.ts +6 -5
- package/src/nile-chip/nile-chip.css.ts +1 -0
- package/src/nile-code-editor/nile-code-editor.css.ts +3 -0
- package/src/nile-code-editor/nile-code-editor.ts +1 -0
- package/src/nile-detail/nile-detail.test.ts +6 -6
- package/src/nile-filter-chip/nile-filter-chip.css.ts +6 -0
- package/src/nile-icon/icons/svg/close.ts +1 -1
- package/src/nile-inline-sidebar-group/nile-inline-sidebar-group.test.ts +1 -1
- package/src/nile-inline-sidebar-item/nile-inline-sidebar-item.test.ts +5 -5
- package/src/nile-input/nile-input.css.ts +11 -1
- package/src/nile-input/nile-input.ts +2 -0
- package/src/nile-link/nile-link.css.ts +3 -1
- package/src/nile-radio/nile-radio.css.ts +2 -2
- package/src/nile-radio/nile-radio.ts +17 -3
- package/src/nile-radio-group/nile-radio-group.ts +6 -0
- package/src/nile-rich-text-editor/nile-rich-text-editor.css.ts +6 -0
- package/src/nile-rich-text-editor/nile-rich-text-editor.ts +8 -3
- package/src/nile-select/nile-select.css.ts +21 -5
- package/src/nile-select/nile-select.ts +2 -2
- package/src/nile-slide-toggle/nile-slide-toggle.ts +1 -0
- package/src/nile-textarea/nile-textarea.css.ts +9 -2
- package/src/nile-virtual-select/nile-virtual-select.css.ts +13 -3
- package/src/nile-virtual-select/nile-virtual-select.ts +2 -2
- 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-
|
|
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 {
|