@aquera/nile-elements 0.0.52 → 0.0.54
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/demo/variables.css +5 -0
- package/demo/variables_v2.css +5 -0
- package/dist/index.iife.js +289 -220
- 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 +3 -0
- package/dist/nile-table-body/nile-table-body.css.cjs.js +1 -1
- package/dist/nile-table-body/nile-table-body.css.cjs.js.map +1 -1
- package/dist/nile-table-body/nile-table-body.css.esm.js +10 -0
- package/dist/nile-table-cell-item/nile-table-cell-item.cjs.js +1 -1
- package/dist/nile-table-cell-item/nile-table-cell-item.cjs.js.map +1 -1
- package/dist/nile-table-cell-item/nile-table-cell-item.css.cjs.js +1 -1
- package/dist/nile-table-cell-item/nile-table-cell-item.css.cjs.js.map +1 -1
- package/dist/nile-table-cell-item/nile-table-cell-item.css.esm.js +3 -0
- package/dist/nile-table-cell-item/nile-table-cell-item.esm.js +2 -2
- package/dist/nile-table-header-item/index.cjs.js +1 -1
- package/dist/nile-table-header-item/index.esm.js +1 -1
- package/dist/nile-table-header-item/nile-table-header-item.cjs.js +1 -1
- package/dist/nile-table-header-item/nile-table-header-item.cjs.js.map +1 -1
- package/dist/nile-table-header-item/nile-table-header-item.esm.js +3 -8
- package/dist/nile-table-row/nile-table-row.cjs.js +1 -1
- package/dist/nile-table-row/nile-table-row.cjs.js.map +1 -1
- package/dist/nile-table-row/nile-table-row.css.cjs.js +1 -1
- package/dist/nile-table-row/nile-table-row.css.cjs.js.map +1 -1
- package/dist/nile-table-row/nile-table-row.css.esm.js +7 -2
- package/dist/nile-table-row/nile-table-row.esm.js +1 -1
- package/dist/nile-textarea/index.cjs.js +1 -1
- package/dist/nile-textarea/index.esm.js +1 -1
- package/dist/nile-textarea/nile-textarea.cjs.js +1 -1
- package/dist/nile-textarea/nile-textarea.cjs.js.map +1 -1
- 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 +43 -8
- package/dist/nile-textarea/nile-textarea.esm.js +58 -40
- package/dist/src/nile-input/nile-input.css.js +3 -0
- package/dist/src/nile-input/nile-input.css.js.map +1 -1
- package/dist/src/nile-table-body/nile-table-body.css.js +10 -0
- package/dist/src/nile-table-body/nile-table-body.css.js.map +1 -1
- package/dist/src/nile-table-cell-item/nile-table-cell-item.css.js +3 -0
- package/dist/src/nile-table-cell-item/nile-table-cell-item.css.js.map +1 -1
- package/dist/src/nile-table-cell-item/nile-table-cell-item.js +1 -1
- package/dist/src/nile-table-cell-item/nile-table-cell-item.js.map +1 -1
- package/dist/src/nile-table-header-item/nile-table-header-item.d.ts +4 -0
- package/dist/src/nile-table-header-item/nile-table-header-item.js +17 -7
- package/dist/src/nile-table-header-item/nile-table-header-item.js.map +1 -1
- package/dist/src/nile-table-row/nile-table-row.css.js +5 -0
- package/dist/src/nile-table-row/nile-table-row.css.js.map +1 -1
- package/dist/src/nile-table-row/nile-table-row.js +1 -1
- package/dist/src/nile-table-row/nile-table-row.js.map +1 -1
- package/dist/src/nile-textarea/nile-textarea.css.js +43 -8
- package/dist/src/nile-textarea/nile-textarea.css.js.map +1 -1
- package/dist/src/nile-textarea/nile-textarea.d.ts +7 -2
- package/dist/src/nile-textarea/nile-textarea.js +107 -45
- package/dist/src/nile-textarea/nile-textarea.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-input/nile-input.css.ts +3 -0
- package/src/nile-table-body/nile-table-body.css.ts +10 -0
- package/src/nile-table-cell-item/nile-table-cell-item.css.ts +3 -0
- package/src/nile-table-cell-item/nile-table-cell-item.ts +1 -1
- package/src/nile-table-header-item/nile-table-header-item.ts +13 -6
- package/src/nile-table-row/nile-table-row.css.ts +5 -0
- package/src/nile-table-row/nile-table-row.ts +1 -1
- package/src/nile-textarea/nile-textarea.css.ts +43 -8
- package/src/nile-textarea/nile-textarea.ts +127 -62
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-input.css.js","sourceRoot":"","sources":["../../../src/nile-input/nile-input.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAifxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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-element';\n\n/**\n * Input CSS\n */\nexport const styles = css`\n :host {\n display: block;\n }\n\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 color: inherit;\n margin-bottom: 12px;\n color: var(--nile-colors-dark-900);\n font-family: var(--nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-label.form-control--medium .form-control__label {\n font-size: 14px;\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: #a4121c;\n }\n\n /* Help text */\n .form-control--has-help-text .form-control__help-text {\n display: block;\n color: #7f7f7f;\n margin-top: 6px;\n }\n\n /* Error message */\n .form-control__error-message {\n display: block;\n color: #a4121c;\n margin-top: 12px;\n font-size: 12px;\n font-style: normal;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: 10.24px;\n }\n\n .form-control--has-help-text.form-control--radio-group\n .form-control__help-text {\n margin-top: 0.25rem;\n }\n\n .input {\n flex: 1 1 auto;\n display: inline-flex;\n align-items: stretch;\n justify-content: start;\n position: relative;\n width: 100%;\n font-weight: 400;\n vertical-align: middle;\n overflow: hidden;\n cursor: text;\n transition: 150ms color, 150ms border, 150ms box-shadow,\n 150ms background-color;\n box-sizing: border-box;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n /* Standard inputs */\n .input--standard {\n background-color: var(--nile-input-standard-background-color);\n border: solid 1px var(--nile-input-standard-border-color);\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); /**for v2 */\n }\n\n .input--standard:hover:not(.input--disabled) {\n background-color: hsl(0, 0%, 100%);\n border-color: #000;\n }\n\n .input--standard.input--focused:not(.input--disabled) {\n background-color: hsl(0, 0%, 100%);\n border-color: #005ea6;\n }\n\n .input--standard.input--focused:not(.input--disabled) .input__control {\n color: hsl(240 5.3% 26.1%);\n }\n\n .input--standard.input--disabled {\n background-color: #fff;\n border-color: #c7ced4;\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .input--standard.input--disabled .input__control {\n color: hsl(240 5.9% 10%);\n }\n\n .input--standard.input--disabled .input__control::placeholder {\n color: hsl(240 5.2% 33.9%);\n color: var(--nile-input-standard-disabled-placeholder-font-color);\n }\n\n .input--standard.input--warning {\n border-color: var(--nile-colors-yellow-500);\n }\n\n .input--standard.input--error {\n border-color: #e5434d;\n }\n\n .input--standard.input--success {\n border-color: #43e5c0;\n }\n\n .input--standard.input--destructive {\n border-color: #fda29b;\n }\n\n .input--standard.input--destructive:focus {\n border: 1px solid #fda29b;\n /* Focus rings/ring-error-shadow-xs */\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n /* Filled inputs */\n .input--filled {\n border: none;\n background-color: hsl(240 4.8% 95.9%);\n color: hsl(240 5.3% 26.1%);\n }\n\n .input--filled:hover:not(.input--disabled) {\n background-color: hsl(240 4.8% 95.9%);\n }\n\n .input--filled.input--focused:not(.input--disabled) {\n background-color: hsl(240 4.8% 95.9%);\n outline: solid 3px hsl(200.4 98% 39.4%);\n outline-offset: 1px;\n }\n\n .input--filled.input--disabled {\n background-color: hsl(240 4.8% 95.9%);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .input__control {\n flex: 1 1 auto;\n min-width: 0;\n height: 100%;\n border: none;\n background: none;\n box-shadow: none;\n padding: 0;\n margin: 0;\n cursor: inherit;\n -webkit-appearance: none;\n color: var(--nile-colors-dark-900);\n font-family: var(--nile-font-family-sans-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .input__control::-webkit-search-decoration,\n .input__control::-webkit-search-cancel-button,\n .input__control::-webkit-search-results-button,\n .input__control::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n\n .input__control:-webkit-autofill {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input__control:-webkit-autofill:hover {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input__control:-webkit-autofill:focus {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input__control:-webkit-autofill:active {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input--filled .input__control:-webkit-autofill {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input--filled .input__control:-webkit-autofill:hover {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input--filled .input__control:-webkit-autofill:focus {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input--filled .input__control:-webkit-autofill:active {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input__control::placeholder {\n color: #7f7f7f;\n color: #667085; /**for v2 */\n user-select: none;\n }\n\n .input:hover:not(.input--disabled) .input__control {\n color: #000;\n font-size: 14px;\n line-height: 14px;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n .input__control:focus {\n outline: none;\n }\n\n .input__prefix,\n .input__suffix {\n display: inline-flex;\n flex: 0 0 auto;\n align-items: center;\n cursor: default;\n }\n\n .input__prefix::slotted(nile-icon) {\n color: hsl(240 3.8% 46.1%);\n }\n\n .input__suffix::slotted(nile-icon) {\n color: hsl(240 3.8% 46.1%);\n }\n\n .input--standard:focus {\n border-radius: 4px;\n border: 1px solid #85aad1; /**for v2 */\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(133, 170, 209, 0.24); /**for v2 */\n }\n\n /*\n * Size modifiers\n */\n\n .input--small {\n border-radius: 0.25rem;\n font-size: var(--nile-input-font-size-small);\n height: 1.875rem;\n }\n\n .input--small .input__control {\n height: calc(1.875rem);\n padding: 0 0.75rem;\n }\n\n .input--small .input__clear {\n width: calc(1em + 0.75rem * 2);\n }\n\n .input--small .input__password-toggle {\n width: calc(1em + 0.75rem * 2);\n }\n\n .input--small .input__prefix::slotted(*) {\n margin-inline-start: 0.75rem;\n }\n\n .input--small .input__suffix::slotted(*) {\n margin-inline-end: 0.75rem;\n }\n\n .input--medium {\n border-radius: 0.25rem;\n font-size: var(--nile-input-font-size-medium);\n height: 38px;\n }\n\n .input--medium .input__control {\n height: 14px;\n padding: 12px;\n }\n\n .input--medium .input__clear {\n width: calc(1em + 1rem * 2);\n }\n\n .input--medium .input__password-toggle {\n width: calc(1em + 1rem * 2);\n }\n\n .input--medium .input__prefix::slotted(*) {\n margin-inline-start: 12px;\n }\n\n .input--medium .input__suffix::slotted(*) {\n margin-inline-end: 12px;\n }\n\n .input--large {\n border-radius: 0.25rem;\n font-size: 1.25rem;\n height: 3.125rem;\n }\n\n .input--large .input__control {\n height: calc(3.125rem - 1px * 2);\n padding: 0 1.25rem;\n }\n\n .input--large .input__clear {\n width: calc(1em + 1.25rem * 2);\n }\n\n .input--large .input__password-toggle {\n width: calc(1em + 1.25rem * 2);\n }\n\n .input--large .input__prefix::slotted(*) {\n margin-inline-start: 1.25rem;\n }\n\n .input--large .input__suffix::slotted(*) {\n margin-inline-end: 1.25rem;\n }\n\n /*\n * Pill modifier\n */\n\n .input--pill.input--small {\n border-radius: 1.875rem;\n }\n\n .input--pill.input--medium {\n border-radius: 2.5rem;\n }\n\n .input--pill.input--large {\n border-radius: 3.125rem;\n }\n\n /*\n * Clearable + Password Toggle\n */\n\n .input__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: hsl(240 3.8% 46.1%);\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .input__password-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: hsl(240 3.8% 46.1%);\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .input__clear:hover {\n color: hsl(240 5.2% 33.9%);\n }\n\n .input__password-toggle:hover {\n color: hsl(240 5.2% 33.9%);\n }\n\n .input__clear:focus,\n .input__password-toggle:focus {\n outline: none;\n }\n\n .input--empty .input__clear {\n visibility: hidden;\n }\n\n /* Don't show the browser's password toggle in Edge */\n ::-ms-reveal {\n display: none;\n }\n\n /* Hide the built-in number spinner */\n .input--no-spin-buttons input[type='number']::-webkit-outer-spin-button,\n .input--no-spin-buttons input[type='number']::-webkit-inner-spin-button {\n -webkit-appearance: none;\n display: none;\n }\n\n .input--no-spin-buttons input[type='number'] {\n -moz-appearance: textfield;\n }\n\n :host([no-border]) .input--standard {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n :host([no-border]) .input--standard:hover:not(.input--disabled) {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n :host([no-border]) .input--standard.input--focused:not(.input--disabled) {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n :host([no-border]) .input--standard.input--focused:not(.input--disabled) {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n .input__password {\n font-family: 'disc';\n }\n\n .input__non-printable {\n border-radius: 4px;\n max-width: 400px;\n background-color: var(--nile-colors-white-base);\n border: 1px solid var(--nile-colors-red-500);\n color: var(--nile-colors-red-500);\n padding: 10px;\n font-size: 12px;\n max-height: 300px;\n overflow-y: scroll;\n }\n\n .input__remove-non-printable {\n color: var(--nile-colors-red-500);\n margin-left: 10px;\n font-size: 14px;\n color: var(--nile-colors-dark-900);\n }\n\n .input__srtiked-text-container {\n margin-top: 4px;\n color: var(--nile-colors-dark-900);\n word-wrap: break-all;\n }\n\n .input__srtiked-text {\n text-decoration: line-through;\n text-decoration-color: var(--nile-colors-white-base);\n color: var(--nile-colors-white-base);\n background-color: var(--nile-colors-red-500);\n }\n`;\n\nexport default [styles];\n"]}
|
|
1
|
+
{"version":3,"file":"nile-input.css.js","sourceRoot":"","sources":["../../../src/nile-input/nile-input.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAofxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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-element';\n\n/**\n * Input CSS\n */\nexport const styles = css`\n :host {\n display: block;\n }\n\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 color: inherit;\n margin-bottom: 12px;\n color: var(--nile-colors-dark-900);\n font-family: var(--nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-label.form-control--medium .form-control__label {\n font-size: 14px;\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: #a4121c;\n }\n\n /* Help text */\n .form-control--has-help-text .form-control__help-text {\n display: block;\n color: #7f7f7f;\n margin-top: 6px;\n }\n\n /* Error message */\n .form-control__error-message {\n display: block;\n color: #a4121c;\n margin-top: 12px;\n font-size: 12px;\n font-style: normal;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: 10.24px;\n }\n\n .form-control--has-help-text.form-control--radio-group\n .form-control__help-text {\n margin-top: 0.25rem;\n }\n\n .input {\n flex: 1 1 auto;\n display: inline-flex;\n align-items: stretch;\n justify-content: start;\n position: relative;\n width: 100%;\n font-weight: 400;\n vertical-align: middle;\n overflow: hidden;\n cursor: text;\n transition: 150ms color, 150ms border, 150ms box-shadow,\n 150ms background-color;\n box-sizing: border-box;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n /* Standard inputs */\n .input--standard {\n background-color: var(--nile-input-standard-background-color);\n border: solid 1px var(--nile-input-standard-border-color);\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); /**for v2 */\n }\n\n .input--standard:hover:not(.input--disabled) {\n background-color: hsl(0, 0%, 100%);\n border-color: #000;\n }\n\n .input--standard.input--focused:not(.input--disabled) {\n background-color: hsl(0, 0%, 100%);\n border-color: #005ea6;\n }\n\n .input--standard.input--focused:not(.input--disabled) .input__control {\n color: hsl(240 5.3% 26.1%);\n }\n\n .input--standard.input--disabled {\n background-color: #fff;\n border-color: #c7ced4;\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .input--standard.input--disabled .input__control {\n color: hsl(240 5.9% 10%);\n }\n\n .input--standard.input--disabled .input__control::placeholder {\n color: hsl(240 5.2% 33.9%);\n color: var(--nile-input-standard-disabled-placeholder-font-color);\n }\n\n .input--standard.input--warning {\n border-color: var(--nile-colors-yellow-500);\n }\n\n .input--standard.input--error {\n border-color: #e5434d;\n }\n\n .input--standard.input--success {\n border-color: #43e5c0;\n }\n\n .input--standard.input--destructive {\n border-color: #fda29b;\n }\n\n .input--standard.input--destructive:focus {\n border: 1px solid #fda29b;\n /* Focus rings/ring-error-shadow-xs */\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n /* Filled inputs */\n .input--filled {\n border: none;\n background-color: hsl(240 4.8% 95.9%);\n color: hsl(240 5.3% 26.1%);\n }\n\n .input--filled:hover:not(.input--disabled) {\n background-color: hsl(240 4.8% 95.9%);\n }\n\n .input--filled.input--focused:not(.input--disabled) {\n background-color: hsl(240 4.8% 95.9%);\n outline: solid 3px hsl(200.4 98% 39.4%);\n outline-offset: 1px;\n }\n\n .input--filled.input--disabled {\n background-color: hsl(240 4.8% 95.9%);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .input__control {\n flex: 1 1 auto;\n min-width: 0;\n height: 100%;\n border: none;\n background: none;\n box-shadow: none;\n padding: 0;\n margin: 0;\n cursor: inherit;\n -webkit-appearance: none;\n color: var(--nile-colors-dark-900);\n font-family: var(--nile-font-family-sans-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .input__control::-webkit-search-decoration,\n .input__control::-webkit-search-cancel-button,\n .input__control::-webkit-search-results-button,\n .input__control::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n\n .input__control:-webkit-autofill {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input__control:-webkit-autofill:hover {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input__control:-webkit-autofill:focus {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input__control:-webkit-autofill:active {\n box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n caret-color: hsl(240 5.3% 26.1%);\n }\n\n .input--filled .input__control:-webkit-autofill {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input--filled .input__control:-webkit-autofill:hover {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input--filled .input__control:-webkit-autofill:focus {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input--filled .input__control:-webkit-autofill:active {\n box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n }\n\n .input__control::placeholder {\n color: #7f7f7f;\n color: #667085; /**for v2 */\n user-select: none;\n }\n\n .input:hover:not(.input--disabled) .input__control {\n color: #000;\n font-size: 14px;\n line-height: 14px;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n .input__control:focus {\n outline: none;\n }\n\n .input__prefix,\n .input__suffix {\n display: inline-flex;\n flex: 0 0 auto;\n align-items: center;\n cursor: default;\n }\n\n .input__prefix::slotted(nile-icon) {\n color: hsl(240 3.8% 46.1%);\n }\n\n .input__suffix::slotted(nile-icon) {\n color: hsl(240 3.8% 46.1%);\n }\n\n .input--standard:focus {\n border-radius: 4px;\n border: 1px solid #85aad1; /**for v2 */\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(133, 170, 209, 0.24); /**for v2 */\n }\n\n /*\n * Size modifiers\n */\n\n .input--small {\n border-radius: 0.25rem;\n font-size: var(--nile-input-font-size-small);\n height: 1.875rem;\n }\n\n .input--small .input__control {\n height: calc(1.875rem);\n padding: 0 0.75rem;\n }\n\n .input--small .input__clear {\n width: calc(1em + 0.75rem * 2);\n }\n\n .input--small .input__password-toggle {\n width: calc(1em + 0.75rem * 2);\n }\n\n .input--small .input__prefix::slotted(*) {\n margin-inline-start: 0.75rem;\n }\n\n .input--small .input__suffix::slotted(*) {\n margin-inline-end: 0.75rem;\n }\n\n .input--medium {\n border-radius: 0.25rem;\n font-size: var(--nile-input-font-size-medium);\n height: 38px;\n }\n\n .input--medium .input__control {\n height: 14px;\n padding: 12px;\n }\n\n .input--medium .input__clear {\n width: calc(1em + 1rem * 2);\n }\n\n .input--medium .input__password-toggle {\n width: calc(1em + 1rem * 2);\n }\n\n .input--medium .input__prefix::slotted(*) {\n margin-inline-start: 12px;\n }\n\n .input--medium .input__suffix::slotted(*) {\n margin-inline-end: 12px;\n }\n\n .input--large {\n border-radius: 0.25rem;\n font-size: 1.25rem;\n height: 3.125rem;\n }\n\n .input--large .input__control {\n height: calc(3.125rem - 1px * 2);\n padding: 0 1.25rem;\n }\n\n .input--large .input__clear {\n width: calc(1em + 1.25rem * 2);\n }\n\n .input--large .input__password-toggle {\n width: calc(1em + 1.25rem * 2);\n }\n\n .input--large .input__prefix::slotted(*) {\n margin-inline-start: 1.25rem;\n }\n\n .input--large .input__suffix::slotted(*) {\n margin-inline-end: 1.25rem;\n }\n\n /*\n * Pill modifier\n */\n\n .input--pill.input--small {\n border-radius: 1.875rem;\n }\n\n .input--pill.input--medium {\n border-radius: 2.5rem;\n }\n\n .input--pill.input--large {\n border-radius: 3.125rem;\n }\n\n /*\n * Clearable + Password Toggle\n */\n\n .input__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: hsl(240 3.8% 46.1%);\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .input__password-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: hsl(240 3.8% 46.1%);\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .input__clear:hover {\n color: hsl(240 5.2% 33.9%);\n }\n\n .input__password-toggle:hover {\n color: hsl(240 5.2% 33.9%);\n }\n\n .input__clear:focus,\n .input__password-toggle:focus {\n outline: none;\n }\n\n .input--empty .input__clear {\n visibility: hidden;\n }\n\n /* Don't show the browser's password toggle in Edge */\n ::-ms-reveal {\n display: none;\n }\n\n /* Hide the built-in number spinner */\n .input--no-spin-buttons input[type='number']::-webkit-outer-spin-button,\n .input--no-spin-buttons input[type='number']::-webkit-inner-spin-button {\n -webkit-appearance: none;\n display: none;\n }\n\n .input--no-spin-buttons input[type='number'] {\n -moz-appearance: textfield;\n }\n\n :host([no-border]) .input--standard {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n :host([no-border]) .input--standard:hover:not(.input--disabled) {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n :host([no-border]) .input--standard.input--focused:not(.input--disabled) {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n :host([no-border]) .input--standard.input--focused:not(.input--disabled) {\n border: none;\n box-shadow: 0 0 0 0;\n }\n\n .input__password {\n font-family: 'disc';\n }\n\n .input__non-printable {\n border-radius: 4px;\n max-width: 400px;\n background-color: var(--nile-colors-white-base);\n border: 1px solid var(--nile-colors-red-500);\n color: var(--nile-colors-red-500);\n padding: 10px;\n font-size: 12px;\n max-height: 300px;\n overflow-y: scroll;\n line-height: 16px;\n }\n\n .input__remove-non-printable {\n color: var(--nile-colors-red-500);\n margin-left: 10px;\n font-size: 14px;\n color: var(--nile-colors-dark-900);\n cursor: pointer;\n }\n\n .input__srtiked-text-container {\n margin-top: 4px;\n color: var(--nile-colors-dark-900);\n word-wrap: break-all;\n line-height: 16px;\n }\n\n .input__srtiked-text {\n text-decoration: line-through;\n text-decoration-color: var(--nile-colors-white-base);\n color: var(--nile-colors-white-base);\n background-color: var(--nile-colors-red-500);\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -11,6 +11,8 @@ import { css } from 'lit-element';
|
|
|
11
11
|
export const styles = css `
|
|
12
12
|
:host {
|
|
13
13
|
box-sizing: border-box;
|
|
14
|
+
--nile-table-background--odd: var(--nile-table-body-row-odd-background-color);
|
|
15
|
+
--nile-table-background--even: var(--nile-table-body-row-even-background-color);
|
|
14
16
|
}
|
|
15
17
|
.base {
|
|
16
18
|
width: max-content;
|
|
@@ -26,6 +28,14 @@ export const styles = css `
|
|
|
26
28
|
display: table;
|
|
27
29
|
border-collapse: collapse;
|
|
28
30
|
}
|
|
31
|
+
|
|
32
|
+
slot::slotted(nile-table-row:nth-child(odd)) {
|
|
33
|
+
border-bottom: 1px solid var(--nile-table-row-border-color);
|
|
34
|
+
background: var(--nile-table-background--odd);
|
|
35
|
+
}
|
|
36
|
+
slot::slotted(nile-table-row:nth-child(even)) {
|
|
37
|
+
background: var(--nile-table-background--even);
|
|
38
|
+
}
|
|
29
39
|
`;
|
|
30
40
|
export default [styles];
|
|
31
41
|
//# sourceMappingURL=nile-table-body.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-table-body.css.js","sourceRoot":"","sources":["../../../src/nile-table-body/nile-table-body.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-table-body.css.js","sourceRoot":"","sources":["../../../src/nile-table-body/nile-table-body.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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-element';\n\n/**\n * TableBody CSS\n */\nexport const styles = css`\n :host {\n box-sizing: border-box;\n --nile-table-background--odd: var(--nile-table-body-row-odd-background-color);\n --nile-table-background--even: var(--nile-table-body-row-even-background-color);\n }\n .base {\n width: max-content;\n background-color: var(--nile-colors-white-base);\n }\n\n .table__header {\n display: flex;\n box-sizing: border-box;\n }\n\n .nile__table__body {\n display: table;\n border-collapse: collapse;\n }\n\n slot::slotted(nile-table-row:nth-child(odd)) {\n border-bottom: 1px solid var(--nile-table-row-border-color);\n background: var(--nile-table-background--odd);\n }\n slot::slotted(nile-table-row:nth-child(even)) {\n background: var(--nile-table-background--even);\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-table-cell-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-cell-item/nile-table-cell-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-table-cell-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-cell-item/nile-table-cell-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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-element';\n\n/**\n * TableCellItem CSS\n */\nexport const styles = css`\n :host {\n box-sizing: border-box;\n display: table-cell;\n --min--height: 52px;\n --max--cell-width:auto;\n max-width: var(--max--cell-width);\n overflow: hidden;\n }\n\n .column {\n display: flex;\n flex-direction: row;\n padding: 0 var(--nile-type-scale-4);\n align-items: center;\n min-height: var(--min--height);\n height: auto;\n width: auto;\n\n /**font styling */\n color: var(--nile-colors-dark-900);\n\n font-feature-settings: 'clig' off, 'liga' off;\n /* New Paragraph/Regular */\n font-size: var(--nile-type-scale-3);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular);\n line-height: var(--nile-type-scale-3); /* 100% */\n letter-spacing: 0.2px;\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -38,7 +38,7 @@ let NileTableCellItem = class NileTableCellItem extends NileElement {
|
|
|
38
38
|
render() {
|
|
39
39
|
return html `
|
|
40
40
|
${this.hasSlotController.test('[default]')
|
|
41
|
-
? html ` <slot class="column"> </slot>`
|
|
41
|
+
? html ` <slot class="column" part="nile__table-cell"> </slot>`
|
|
42
42
|
: ''}
|
|
43
43
|
`;
|
|
44
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-table-cell-item.js","sourceRoot":"","sources":["../../../src/nile-table-cell-item/nile-table-cell-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAIL,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;;;GAKG;AAEI,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,WAAW;IAA3C;;QACY,sBAAiB,GAAG,IAAI,iBAAiB,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;QAyB9E,gBAAgB;IAClB,CAAC;IAzBC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAED,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACI,MAAM;QACX,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC;YACxC,CAAC,CAAC,IAAI,CAAA,
|
|
1
|
+
{"version":3,"file":"nile-table-cell-item.js","sourceRoot":"","sources":["../../../src/nile-table-cell-item/nile-table-cell-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAIL,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;;;GAKG;AAEI,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,WAAW;IAA3C;;QACY,sBAAiB,GAAG,IAAI,iBAAiB,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;QAyB9E,gBAAgB;IAClB,CAAC;IAzBC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAED,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACI,MAAM;QACX,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC;YACxC,CAAC,CAAC,IAAI,CAAA,wDAAwD;YAC9D,CAAC,CAAC,EAAE;KACP,CAAC;IACJ,CAAC;CAGF,CAAA;AA3BY,iBAAiB;IAD7B,aAAa,CAAC,sBAAsB,CAAC;GACzB,iBAAiB,CA2B7B;SA3BY,iBAAiB;AA6B9B,eAAe,iBAAiB,CAAC","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 {\n LitElement,\n html,\n property,\n CSSResultArray,\n TemplateResult,\n} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-table-cell-item.css';\nimport NileElement from '../internal/nile-element';\nimport { HasSlotController } from '../internal/slot';\n\n/**\n * Nile table Cell Item component.\n *\n * @tag nile-table-cell-item\n *\n */\n@customElement('nile-table-cell-item')\nexport class NileTableCellItem extends NileElement {\n private readonly hasSlotController = new HasSlotController(this, '[default]');\n /**\n * The styles for TableCellItem\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n */\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n /* #endregion */\n\n /* #region Methods */\n\n /**\n * Render method\n * @slot This is a slot test\n */\n public render(): TemplateResult {\n return html`\n ${this.hasSlotController.test('[default]')\n ? html` <slot class=\"column\" part=\"nile__table-cell\"> </slot>`\n : ''}\n `;\n }\n\n /* #endregion */\n}\n\nexport default NileTableCellItem;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-table-cell-item': NileTableCellItem;\n }\n}\n"]}
|
|
@@ -19,6 +19,10 @@ export declare class NileTableHeaderItem extends NileElement {
|
|
|
19
19
|
* @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
|
|
20
20
|
*/
|
|
21
21
|
static get styles(): CSSResultArray;
|
|
22
|
+
/** Enables the sort functionality. */
|
|
23
|
+
havesort: boolean;
|
|
24
|
+
/** Places the icon . */
|
|
25
|
+
iconName: string;
|
|
22
26
|
/**
|
|
23
27
|
* Render method
|
|
24
28
|
* @slot This is a slot test
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
7
|
import { __decorate } from "tslib";
|
|
8
|
-
import { html, } from 'lit-element';
|
|
8
|
+
import { html, property, } from 'lit-element';
|
|
9
9
|
import { customElement } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './nile-table-header-item.css';
|
|
11
11
|
import NileElement from '../internal/nile-element';
|
|
@@ -20,6 +20,10 @@ let NileTableHeaderItem = class NileTableHeaderItem extends NileElement {
|
|
|
20
20
|
constructor() {
|
|
21
21
|
super(...arguments);
|
|
22
22
|
this.hasSlotController = new HasSlotController(this, '[default]');
|
|
23
|
+
/** Enables the sort functionality. */
|
|
24
|
+
this.havesort = false;
|
|
25
|
+
/** Places the icon . */
|
|
26
|
+
this.iconName = '';
|
|
23
27
|
/* #endregion */
|
|
24
28
|
}
|
|
25
29
|
/**
|
|
@@ -36,6 +40,9 @@ let NileTableHeaderItem = class NileTableHeaderItem extends NileElement {
|
|
|
36
40
|
* @slot This is a slot test
|
|
37
41
|
*/
|
|
38
42
|
handleClick(e) {
|
|
43
|
+
if (!this.havesort) {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
39
46
|
let curr_sort_string = e.target?.parentElement?.children[0]?.assignedNodes()[0];
|
|
40
47
|
this.emit('nile-click-sort', { value: curr_sort_string });
|
|
41
48
|
}
|
|
@@ -43,16 +50,19 @@ let NileTableHeaderItem = class NileTableHeaderItem extends NileElement {
|
|
|
43
50
|
return html ` ${this.hasSlotController.test('[default]')
|
|
44
51
|
? html ` <div class="headers">
|
|
45
52
|
<slot @click=${this.handleClick}> </slot>
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
size="16"
|
|
50
|
-
@click=${this.handleClick}
|
|
51
|
-
></nile-icon>
|
|
53
|
+
${this.iconName
|
|
54
|
+
? html ` <nile-icon name="${this.iconName}" size="16" @click=${this.handleClick}></nile-icon>`
|
|
55
|
+
: html ``}
|
|
52
56
|
</div>`
|
|
53
57
|
: html ``}`;
|
|
54
58
|
}
|
|
55
59
|
};
|
|
60
|
+
__decorate([
|
|
61
|
+
property({ type: Boolean, reflect: true })
|
|
62
|
+
], NileTableHeaderItem.prototype, "havesort", void 0);
|
|
63
|
+
__decorate([
|
|
64
|
+
property({ type: String, reflect: true, attribute: 'icon-name' })
|
|
65
|
+
], NileTableHeaderItem.prototype, "iconName", void 0);
|
|
56
66
|
NileTableHeaderItem = __decorate([
|
|
57
67
|
customElement('nile-table-header-item')
|
|
58
68
|
], NileTableHeaderItem);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-table-header-item.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,
|
|
1
|
+
{"version":3,"file":"nile-table-header-item.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;;;GAKG;AAEI,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,WAAW;IAA7C;;QACY,sBAAiB,GAAG,IAAI,iBAAiB,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;QAS9E,sCAAsC;QACM,aAAQ,GAAG,KAAK,CAAC;QAE7D,wBAAwB;QAC2C,aAAQ,GACzE,EAAE,CAAC;QA6BL,gBAAgB;IAClB,CAAC;IA3CC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IASD,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACK,WAAW,CAAC,CAAM;QACxB,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO;SACR;QACD,IAAI,gBAAgB,GAClB,CAAC,CAAC,MAAM,EAAE,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3D,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,CAAC,CAAC;IAC5D,CAAC;IACM,MAAM;QACX,OAAO,IAAI,CAAA,IAAI,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC;YACrD,CAAC,CAAC,IAAI,CAAA;yBACa,IAAI,CAAC,WAAW;YAC7B,IAAI,CAAC,QAAQ;gBACb,CAAC,CAAC,IAAI,CAAA,qBAAqB,IAAI,CAAC,QAAQ,sBAAsB,IAAI,CAAC,WAAW,eAAe;gBAC7F,CAAC,CAAC,IAAI,CAAA,EAAE;eACL;YACT,CAAC,CAAC,IAAI,CAAA,EAAE,EAAE,CAAC;IACf,CAAC;CAGF,CAAA;AAlC6C;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qDAAkB;AAGM;IAAlE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;qDAC7D;AAfM,mBAAmB;IAD/B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,mBAAmB,CA6C/B;SA7CY,mBAAmB;AA+ChC,eAAe,mBAAmB,CAAC","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 {\n LitElement,\n html,\n property,\n CSSResultArray,\n TemplateResult,\n} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-table-header-item.css';\nimport NileElement from '../internal/nile-element';\nimport { HasSlotController } from '../internal/slot';\n\n/**\n * Nile icon component.\n *\n * @tag nile-table-header-item\n *\n */\n@customElement('nile-table-header-item')\nexport class NileTableHeaderItem extends NileElement {\n private readonly hasSlotController = new HasSlotController(this, '[default]');\n /**\n * The styles for TableHeaderItem\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n */\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n /** Enables the sort functionality. */\n @property({ type: Boolean, reflect: true }) havesort = false;\n \n /** Places the icon . */\n @property({ type: String, reflect: true, attribute: 'icon-name' }) iconName =\n '';\n\n /* #endregion */\n\n /* #region Methods */\n\n /**\n * Render method\n * @slot This is a slot test\n */\n private handleClick(e: any) {\n if (!this.havesort) {\n return;\n }\n let curr_sort_string =\n e.target?.parentElement?.children[0]?.assignedNodes()[0];\n this.emit('nile-click-sort', { value: curr_sort_string });\n }\n public render(): TemplateResult {\n return html` ${this.hasSlotController.test('[default]')\n ? html` <div class=\"headers\">\n <slot @click=${this.handleClick}> </slot>\n ${this.iconName\n ? html` <nile-icon name=\"${this.iconName}\" size=\"16\" @click=${this.handleClick}></nile-icon>`\n : html``}\n </div>`\n : html``}`;\n }\n\n /* #endregion */\n}\n\nexport default NileTableHeaderItem;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-table-header-item': NileTableHeaderItem;\n }\n}\n"]}
|
|
@@ -12,6 +12,11 @@ export const styles = css `
|
|
|
12
12
|
:host {
|
|
13
13
|
display: table-row;
|
|
14
14
|
border-bottom: 1px solid #e4e2e4;
|
|
15
|
+
--nile-header-background:var(--nile-table-header-background-color);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
slot::slotted(nile-table-header-item) {
|
|
19
|
+
background-color: var(--nile-header-background);
|
|
15
20
|
}
|
|
16
21
|
`;
|
|
17
22
|
export default [styles];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-table-row.css.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-table-row.css.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;CAUxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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-element';\n\n/**\n * TableRow CSS\n */\nexport const styles = css`\n :host {\n display: table-row;\n border-bottom: 1px solid #e4e2e4;\n --nile-header-background:var(--nile-table-header-background-color);\n }\n\n slot::slotted(nile-table-header-item) {\n background-color: var(--nile-header-background);\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-table-row.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAIL,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAS,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,WAAW;IAC3C;;;OAGG;IAEI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAED,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACI,MAAM;QACX,OAAO,IAAI,CAAA,
|
|
1
|
+
{"version":3,"file":"nile-table-row.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAIL,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAS,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,WAAW;IAC3C;;;OAGG;IAEI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAED,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACI,MAAM;QACX,OAAO,IAAI,CAAA,kCAAkC,CAAC;IAChD,CAAC;CAGF,CAAA;AAvBY,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAuBxB;SAvBY,YAAY;AAyBzB,eAAe,YAAY,CAAC","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 {\n LitElement,\n html,\n property,\n CSSResultArray,\n TemplateResult,\n} from 'lit-element';\nimport { customElement, query } from 'lit/decorators.js';\nimport { styles } from './nile-table-row.css';\nimport NileElement from '../internal/nile-element';\n\n/**\n *nile-table-row component.\n *\n * @tag nile-table-row\n *\n */\n@customElement('nile-table-row')\nexport class NileTableRow extends NileElement {\n /**\n * The styles for TableRow\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n */\n\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n /* #endregion */\n\n /* #region Methods */\n\n /**\n * Render method\n * @slot This is a slot test\n */\n public render(): TemplateResult {\n return html` <slot part=\"nile-row\"></slot> `;\n }\n\n /* #endregion */\n}\n\nexport default NileTableRow;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-table-row': NileTableRow;\n }\n}\n"]}
|
|
@@ -25,8 +25,8 @@ export const styles = css `
|
|
|
25
25
|
font-family: var(--nile-font-family-serif);
|
|
26
26
|
font-size: 14px;
|
|
27
27
|
font-style: normal;
|
|
28
|
-
font-weight: var(--nile-textarea-label-font-weight);
|
|
29
|
-
line-height: var(--nile-textarea-label-line-height);
|
|
28
|
+
font-weight: var(--nile-textarea-label-font-weight);
|
|
29
|
+
line-height: var(--nile-textarea-label-line-height);
|
|
30
30
|
letter-spacing: 0.2px;
|
|
31
31
|
}
|
|
32
32
|
|
|
@@ -85,13 +85,13 @@ export const styles = css `
|
|
|
85
85
|
/* Standard textareas */
|
|
86
86
|
.textarea--standard {
|
|
87
87
|
background-color: var(--nile-colors-white-base);
|
|
88
|
-
border: 1px solid var(--nile-textarea-standard-border-color);
|
|
89
|
-
box-shadow:var(--nile-textarea-standard-box-shadow);
|
|
88
|
+
border: 1px solid var(--nile-textarea-standard-border-color);
|
|
89
|
+
box-shadow:var(--nile-textarea-standard-box-shadow);
|
|
90
90
|
}
|
|
91
91
|
|
|
92
92
|
.textarea--standard:hover:not(.textarea--disabled) {
|
|
93
93
|
background-color: var(--nile-colors-white-base);
|
|
94
|
-
border-color: var(--nile-textarea-standard-hover-border-color);
|
|
94
|
+
border-color: var(--nile-textarea-standard-hover-border-color);
|
|
95
95
|
border-radius: var(--nile-radius-base-standard);
|
|
96
96
|
}
|
|
97
97
|
|
|
@@ -102,7 +102,7 @@ export const styles = css `
|
|
|
102
102
|
|
|
103
103
|
.textarea--standard.textarea--focused:not(.textarea--disabled) {
|
|
104
104
|
background-color: var(--nile-colors-white-base);
|
|
105
|
-
border-color: var(--nile-textarea-standard-focused-border-color);
|
|
105
|
+
border-color: var(--nile-textarea-standard-focused-border-color);
|
|
106
106
|
box-shadow:var(--nile-textarea-standard-focused-box-shadow);
|
|
107
107
|
}
|
|
108
108
|
|
|
@@ -112,11 +112,11 @@ export const styles = css `
|
|
|
112
112
|
}
|
|
113
113
|
|
|
114
114
|
.textarea--standard.textarea--disabled {
|
|
115
|
-
border-color: var(--nile-textarea-standard-disabled-border-color);
|
|
115
|
+
border-color: var(--nile-textarea-standard-disabled-border-color);
|
|
116
116
|
background: var(--nile-textarea-standard-disabled-background-color);
|
|
117
117
|
opacity: 0.5;
|
|
118
118
|
cursor: not-allowed;
|
|
119
|
-
box-shadow:var(--nile-textarea-standard-disabled-box-shadow);
|
|
119
|
+
box-shadow:var(--nile-textarea-standard-disabled-box-shadow);
|
|
120
120
|
}
|
|
121
121
|
|
|
122
122
|
.textarea--standard.textarea--disabled .textarea__control {
|
|
@@ -203,6 +203,41 @@ export const styles = css `
|
|
|
203
203
|
box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),
|
|
204
204
|
0px 0px 0px 4px rgba(240, 68, 56, 0.24);
|
|
205
205
|
}
|
|
206
|
+
|
|
207
|
+
.input__non-printable {
|
|
208
|
+
border-radius: 4px;
|
|
209
|
+
max-width: 400px;
|
|
210
|
+
background-color: var(--nile-colors-white-base);
|
|
211
|
+
border: 1px solid var(--nile-colors-red-500);
|
|
212
|
+
color: var(--nile-colors-red-500);
|
|
213
|
+
padding: 10px;
|
|
214
|
+
font-size: 12px;
|
|
215
|
+
max-height: 300px;
|
|
216
|
+
overflow-y: scroll;
|
|
217
|
+
line-height: 16px;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.input__remove-non-printable {
|
|
221
|
+
color: var(--nile-colors-red-500);
|
|
222
|
+
margin-left: 10px;
|
|
223
|
+
font-size: 14px;
|
|
224
|
+
color: var(--nile-colors-dark-900);
|
|
225
|
+
cursor: pointer;
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
.input__srtiked-text-container {
|
|
229
|
+
margin-top: 4px;
|
|
230
|
+
color: var(--nile-colors-dark-900);
|
|
231
|
+
word-wrap: break-all;
|
|
232
|
+
line-height: 16px;
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
.input__srtiked-text {
|
|
236
|
+
text-decoration: line-through;
|
|
237
|
+
text-decoration-color: var(--nile-colors-white-base);
|
|
238
|
+
color: var(--nile-colors-white-base);
|
|
239
|
+
background-color: var(--nile-colors-red-500);
|
|
240
|
+
}
|
|
206
241
|
`;
|
|
207
242
|
export default [styles];
|
|
208
243
|
//# sourceMappingURL=nile-textarea.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-textarea.css.js","sourceRoot":"","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-textarea.css.js","sourceRoot":"","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsOxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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-element';\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: 12px;\n color: var(--nile-textarea-label-color);\n font-family: var(--nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: var(--nile-textarea-label-font-weight);\n line-height: var(--nile-textarea-label-line-height);\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);\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: #a4121c;\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);\n margin-top: 6px;\n }\n\n /* Error message */\n .form-control__error-message {\n display: block;\n color: var(--nile-colors-red-700);\n margin-top: 12px;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: 10.24px;\n }\n\n /* Host styles */\n :host {\n display: block;\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-base-standard);\n transition: 0.3s color, 0.3s border, 0.3s box-shadow, 0.3s background-color;\n cursor: text;\n min-height: 12px;\n }\n\n /* Standard textareas */\n .textarea--standard {\n background-color: var(--nile-colors-white-base);\n border: 1px solid var(--nile-textarea-standard-border-color);\n box-shadow:var(--nile-textarea-standard-box-shadow);\n }\n\n .textarea--standard:hover:not(.textarea--disabled) {\n background-color: var(--nile-colors-white-base);\n border-color: var(--nile-textarea-standard-hover-border-color);\n border-radius: var(--nile-radius-base-standard);\n }\n\n .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n border-color: var(--nile-colors-dark-900);\n border-radius: var(--nile-radius-base-standard);\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled) {\n background-color: var(--nile-colors-white-base);\n border-color: var(--nile-textarea-standard-focused-border-color);\n box-shadow:var(--nile-textarea-standard-focused-box-shadow);\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled)\n .textarea__control {\n color: #000000;\n }\n\n .textarea--standard.textarea--disabled {\n border-color: var(--nile-textarea-standard-disabled-border-color);\n background: var(--nile-textarea-standard-disabled-background-color);\n opacity: 0.5;\n cursor: not-allowed;\n box-shadow:var(--nile-textarea-standard-disabled-box-shadow);\n }\n\n .textarea--standard.textarea--disabled .textarea__control {\n color: var(--nile-colors-neutral-500);\n }\n\n .textarea--standard.textarea--disabled .textarea__control::placeholder {\n color: var(--nile-colors-neutral-500);\n }\n\n /* Textarea control styles */\n .textarea__control {\n flex: 1 1 auto;\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px; /* 100% */\n letter-spacing: 0.2px;\n color: var(--nile-colors-dark-900);\n border: none;\n background: none;\n box-shadow: none;\n cursor: inherit;\n -webkit-appearance: 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);\n user-select: none;\n }\n\n .textarea__control:focus {\n outline: none;\n }\n\n .textarea--medium .textarea__control {\n padding:var(--nile-textarea-padding);\n }\n\n /* Resize types */\n .textarea--resize-none .textarea__control {\n resize: none;\n min-height: 12px;\n }\n\n .textarea--resize-vertical .textarea__control {\n resize: vertical;\n min-height: 12px;\n }\n\n .textarea--resize-auto .textarea__control {\n resize: none;\n overflow-y: hidden;\n min-height: 12px;\n }\n\n .textarea--standard.textarea--warning {\n border-color: var(--nile-colors-yellow-500);\n }\n\n .textarea--standard.textarea--error {\n border-color: var(--nile-colors-red-500);\n }\n\n .textarea--standard.textarea--success {\n border-color: var(--nile-colors-green-500);\n }\n\n .textarea--standard.textarea--destructive {\n border-color: #fda29b;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .textarea--standard.textarea--destructive.textarea--focused {\n border-color: #fda29b;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n .input__non-printable {\n border-radius: 4px;\n max-width: 400px;\n background-color: var(--nile-colors-white-base);\n border: 1px solid var(--nile-colors-red-500);\n color: var(--nile-colors-red-500);\n padding: 10px;\n font-size: 12px;\n max-height: 300px;\n overflow-y: scroll;\n line-height: 16px;\n }\n\n .input__remove-non-printable {\n color: var(--nile-colors-red-500);\n margin-left: 10px;\n font-size: 14px;\n color: var(--nile-colors-dark-900);\n cursor: pointer;\n }\n\n .input__srtiked-text-container {\n margin-top: 4px;\n color: var(--nile-colors-dark-900);\n word-wrap: break-all;\n line-height: 16px;\n }\n\n .input__srtiked-text {\n text-decoration: line-through;\n text-decoration-color: var(--nile-colors-white-base);\n color: var(--nile-colors-white-base);\n background-color: var(--nile-colors-red-500);\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -74,8 +74,6 @@ export declare class NileTextarea extends NileElement {
|
|
|
74
74
|
error: boolean;
|
|
75
75
|
/** Sets the input to a success state, changing its visual appearance. */
|
|
76
76
|
success: boolean;
|
|
77
|
-
/** Sets the input to a destructive state, changing its visual appearance. */
|
|
78
|
-
destructive: boolean;
|
|
79
77
|
/** Controls whether and how text input is automatically capitalized as it is entered by the user. */
|
|
80
78
|
autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
|
|
81
79
|
/** Indicates whether the browser's autocorrect feature is on or off. */
|
|
@@ -99,6 +97,9 @@ export declare class NileTextarea extends NileElement {
|
|
|
99
97
|
/** The default value of the form control. Primarily used for resetting the form control. */
|
|
100
98
|
defaultValue: string;
|
|
101
99
|
fullHeight: boolean;
|
|
100
|
+
checkNonPrintableChar: boolean;
|
|
101
|
+
hasPrintableCharacters: boolean;
|
|
102
|
+
markedValue: string;
|
|
102
103
|
connectedCallback(): void;
|
|
103
104
|
disconnectedCallback(): void;
|
|
104
105
|
private handleBlur;
|
|
@@ -108,6 +109,10 @@ export declare class NileTextarea extends NileElement {
|
|
|
108
109
|
private setTextareaHeight;
|
|
109
110
|
handleRowsChange(): void;
|
|
110
111
|
handleValueChange(): Promise<void>;
|
|
112
|
+
/** checks non printable characters in the value. */
|
|
113
|
+
markNonPrintableCharacters(): void;
|
|
114
|
+
/** Removes all non printable characters from the value. */
|
|
115
|
+
removeAllNonPrintableCharacters(): void;
|
|
111
116
|
/** Sets focus on the textarea. */
|
|
112
117
|
focus(options?: FocusOptions): void;
|
|
113
118
|
/** Removes focus from the textarea. */
|