@aquera/nile-elements 0.1.52-beta-1.2 → 0.1.52-beta-1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (168) hide show
  1. package/README.md +2 -3
  2. package/demo/index.html +33 -150
  3. package/dist/index.cjs.js +1 -1
  4. package/dist/index.esm.js +1 -1
  5. package/dist/index.js +639 -1385
  6. package/dist/internal/form.cjs.js +1 -1
  7. package/dist/internal/form.cjs.js.map +1 -1
  8. package/dist/internal/form.esm.js +1 -1
  9. package/dist/nile-accordion/nile-accordian.test.cjs.js +1 -1
  10. package/dist/nile-auto-complete/index.cjs.js +1 -1
  11. package/dist/nile-auto-complete/index.esm.js +1 -1
  12. package/dist/nile-auto-complete/nile-auto-complete.cjs.js +17 -1
  13. package/dist/nile-auto-complete/nile-auto-complete.cjs.js.map +1 -1
  14. package/dist/nile-auto-complete/nile-auto-complete.esm.js +29 -8
  15. package/dist/nile-auto-complete/nile-auto-complete.test.cjs.js +1 -1
  16. package/dist/nile-auto-complete/nile-auto-complete.test.cjs.js.map +1 -1
  17. package/dist/nile-auto-complete/nile-auto-complete.test.esm.js +1 -1
  18. package/dist/nile-avatar/nile-avatar.test.cjs.js +1 -1
  19. package/dist/nile-badge/nile-badge.test.cjs.js +1 -1
  20. package/dist/nile-button/nile-button.test.cjs.js +1 -1
  21. package/dist/nile-button-toggle-group/nile-button-toggle-group.test.cjs.js +1 -1
  22. package/dist/nile-calendar/nile-calendar.test.cjs.js +1 -1
  23. package/dist/nile-calendar/nile-calendar.test.cjs.js.map +1 -1
  24. package/dist/nile-calendar/nile-calendar.test.esm.js +1 -1
  25. package/dist/nile-card/nile-card.test.cjs.js +1 -1
  26. package/dist/nile-checkbox/nile-checkbox.test.cjs.js +1 -1
  27. package/dist/nile-chip/nile-chip.test.cjs.js +1 -1
  28. package/dist/nile-chip/nile-chip.test.cjs.js.map +1 -1
  29. package/dist/nile-chip/nile-chip.test.esm.js +1 -1
  30. package/dist/nile-code-editor/extensionSetup.cjs.js +5 -5
  31. package/dist/nile-code-editor/extensionSetup.cjs.js.map +1 -1
  32. package/dist/nile-code-editor/extensionSetup.esm.js +1 -1
  33. package/dist/nile-code-editor/nile-code-editor.cjs.js +2 -2
  34. package/dist/nile-code-editor/nile-code-editor.cjs.js.map +1 -1
  35. package/dist/nile-code-editor/nile-code-editor.esm.js +3 -3
  36. package/dist/nile-code-editor/theme.cjs.js +1 -1
  37. package/dist/nile-code-editor/theme.cjs.js.map +1 -1
  38. package/dist/nile-code-editor/theme.esm.js +1 -1
  39. package/dist/nile-dialog/nile-dialog.test.cjs.js +1 -1
  40. package/dist/nile-drawer/nile-drawer.test.cjs.js +1 -1
  41. package/dist/nile-dropdown/nile-dropdown.test.cjs.js +1 -1
  42. package/dist/nile-empty-state/nile-empty-state.test.cjs.js +1 -1
  43. package/dist/nile-error-message/nile-error-message.test.cjs.js +1 -1
  44. package/dist/nile-filter-chip/nile-filter-chip.test.cjs.js +1 -1
  45. package/dist/nile-form-group/nile-form-group.test.cjs.js +1 -1
  46. package/dist/nile-form-help-text/nile-form-help-text.test.cjs.js +1 -1
  47. package/dist/nile-hero/nile-hero.test.cjs.js +1 -1
  48. package/dist/nile-icon/nile-icon.test.cjs.js +1 -1
  49. package/dist/nile-input/nile-input.test.cjs.js +1 -1
  50. package/dist/nile-link/nile-link.test.cjs.js +1 -1
  51. package/dist/nile-loader/nile-loader.test.cjs.js +1 -1
  52. package/dist/nile-option/nile-option.cjs.js +1 -1
  53. package/dist/nile-option/nile-option.cjs.js.map +1 -1
  54. package/dist/nile-option/nile-option.css.cjs.js +1 -1
  55. package/dist/nile-option/nile-option.css.cjs.js.map +1 -1
  56. package/dist/nile-option/nile-option.css.esm.js +1 -1
  57. package/dist/nile-option/nile-option.esm.js +2 -2
  58. package/dist/nile-popover/nile-popover.test.cjs.js +1 -1
  59. package/dist/nile-popup/nile-popup.test.cjs.js +1 -1
  60. package/dist/nile-progress-bar/nile-progress-bar.test.cjs.js +1 -1
  61. package/dist/nile-radio/nile-radio.test.cjs.js +1 -1
  62. package/dist/nile-radio-group/nile-radio-group.test.cjs.js +1 -1
  63. package/dist/nile-select/index.cjs.js +1 -1
  64. package/dist/nile-select/index.esm.js +1 -1
  65. package/dist/nile-select/nile-select.cjs.js +1 -1
  66. package/dist/nile-select/nile-select.cjs.js.map +1 -1
  67. package/dist/nile-select/nile-select.esm.js +2 -2
  68. package/dist/nile-select/nile-select.test.cjs.js +1 -1
  69. package/dist/nile-select/nile-select.test.cjs.js.map +1 -1
  70. package/dist/nile-select/nile-select.test.esm.js +2 -2
  71. package/dist/nile-slide-toggle/nile-slide-toggle.test.cjs.js +1 -1
  72. package/dist/nile-tab-group/nile-tab-group.test.cjs.js +1 -1
  73. package/dist/nile-textarea/nile-textarea.test.cjs.js +1 -1
  74. package/dist/src/index.d.ts +0 -1
  75. package/dist/src/index.js +0 -1
  76. package/dist/src/index.js.map +1 -1
  77. package/dist/src/internal/form.js +2 -2
  78. package/dist/src/internal/form.js.map +1 -1
  79. package/dist/src/nile-code-editor/nile-code-editor.d.ts +2 -0
  80. package/dist/src/nile-code-editor/nile-code-editor.js +46 -4
  81. package/dist/src/nile-code-editor/nile-code-editor.js.map +1 -1
  82. package/dist/src/nile-code-editor/theme.d.ts +68 -0
  83. package/dist/src/nile-code-editor/theme.js +68 -0
  84. package/dist/src/nile-code-editor/theme.js.map +1 -1
  85. package/dist/src/nile-option/nile-option.css.js +1 -1
  86. package/dist/src/nile-option/nile-option.css.js.map +1 -1
  87. package/dist/src/nile-option/nile-option.d.ts +1 -5
  88. package/dist/src/nile-option/nile-option.js +6 -21
  89. package/dist/src/nile-option/nile-option.js.map +1 -1
  90. package/dist/src/nile-select/nile-select.d.ts +2 -11
  91. package/dist/src/nile-select/nile-select.js +18 -37
  92. package/dist/src/nile-select/nile-select.js.map +1 -1
  93. package/dist/tsconfig.tsbuildinfo +1 -1
  94. package/package.json +4 -1
  95. package/src/index.ts +1 -3
  96. package/src/internal/form.ts +2 -2
  97. package/src/nile-code-editor/nile-code-editor.ts +53 -4
  98. package/src/nile-code-editor/theme.ts +69 -0
  99. package/src/nile-option/nile-option.css.ts +1 -1
  100. package/src/nile-option/nile-option.ts +3 -17
  101. package/src/nile-select/nile-select.ts +9 -35
  102. package/vscode-html-custom-data.json +8 -230
  103. package/dist/nile-select/virtual-scroll-helper.cjs.js +0 -2
  104. package/dist/nile-select/virtual-scroll-helper.cjs.js.map +0 -1
  105. package/dist/nile-select/virtual-scroll-helper.esm.js +0 -38
  106. package/dist/nile-virtual-select/index.cjs.js +0 -2
  107. package/dist/nile-virtual-select/index.cjs.js.map +0 -1
  108. package/dist/nile-virtual-select/index.esm.js +0 -1
  109. package/dist/nile-virtual-select/nile-virtual-select.cjs.js +0 -2
  110. package/dist/nile-virtual-select/nile-virtual-select.cjs.js.map +0 -1
  111. package/dist/nile-virtual-select/nile-virtual-select.css.cjs.js +0 -2
  112. package/dist/nile-virtual-select/nile-virtual-select.css.cjs.js.map +0 -1
  113. package/dist/nile-virtual-select/nile-virtual-select.css.esm.js +0 -467
  114. package/dist/nile-virtual-select/nile-virtual-select.esm.js +0 -227
  115. package/dist/nile-virtual-select/nile-virtual-select.test.cjs.js +0 -2
  116. package/dist/nile-virtual-select/nile-virtual-select.test.cjs.js.map +0 -1
  117. package/dist/nile-virtual-select/nile-virtual-select.test.esm.js +0 -49
  118. package/dist/nile-virtual-select/renderer.cjs.js +0 -2
  119. package/dist/nile-virtual-select/renderer.cjs.js.map +0 -1
  120. package/dist/nile-virtual-select/renderer.esm.js +0 -18
  121. package/dist/nile-virtual-select/search-manager.cjs.js +0 -2
  122. package/dist/nile-virtual-select/search-manager.cjs.js.map +0 -1
  123. package/dist/nile-virtual-select/search-manager.esm.js +0 -1
  124. package/dist/nile-virtual-select/selection-manager.cjs.js +0 -2
  125. package/dist/nile-virtual-select/selection-manager.cjs.js.map +0 -1
  126. package/dist/nile-virtual-select/selection-manager.esm.js +0 -1
  127. package/dist/nile-virtual-select/types.cjs.js +0 -2
  128. package/dist/nile-virtual-select/types.cjs.js.map +0 -1
  129. package/dist/nile-virtual-select/types.esm.js +0 -1
  130. package/dist/src/nile-select/virtual-scroll-helper.d.ts +0 -9
  131. package/dist/src/nile-select/virtual-scroll-helper.js +0 -51
  132. package/dist/src/nile-select/virtual-scroll-helper.js.map +0 -1
  133. package/dist/src/nile-virtual-select/index.d.ts +0 -1
  134. package/dist/src/nile-virtual-select/index.js +0 -2
  135. package/dist/src/nile-virtual-select/index.js.map +0 -1
  136. package/dist/src/nile-virtual-select/nile-virtual-select.css.d.ts +0 -12
  137. package/dist/src/nile-virtual-select/nile-virtual-select.css.js +0 -479
  138. package/dist/src/nile-virtual-select/nile-virtual-select.css.js.map +0 -1
  139. package/dist/src/nile-virtual-select/nile-virtual-select.d.ts +0 -263
  140. package/dist/src/nile-virtual-select/nile-virtual-select.js +0 -1183
  141. package/dist/src/nile-virtual-select/nile-virtual-select.js.map +0 -1
  142. package/dist/src/nile-virtual-select/nile-virtual-select.test.d.ts +0 -7
  143. package/dist/src/nile-virtual-select/nile-virtual-select.test.js +0 -341
  144. package/dist/src/nile-virtual-select/nile-virtual-select.test.js.map +0 -1
  145. package/dist/src/nile-virtual-select/renderer.d.ts +0 -11
  146. package/dist/src/nile-virtual-select/renderer.js +0 -51
  147. package/dist/src/nile-virtual-select/renderer.js.map +0 -1
  148. package/dist/src/nile-virtual-select/search-manager.d.ts +0 -12
  149. package/dist/src/nile-virtual-select/search-manager.js +0 -40
  150. package/dist/src/nile-virtual-select/search-manager.js.map +0 -1
  151. package/dist/src/nile-virtual-select/selection-manager.d.ts +0 -12
  152. package/dist/src/nile-virtual-select/selection-manager.js +0 -64
  153. package/dist/src/nile-virtual-select/selection-manager.js.map +0 -1
  154. package/dist/src/nile-virtual-select/types.d.ts +0 -50
  155. package/dist/src/nile-virtual-select/types.js +0 -8
  156. package/dist/src/nile-virtual-select/types.js.map +0 -1
  157. package/dist/virtualize-a4a40d96.esm.js +0 -22
  158. package/dist/virtualize-b6a2fbe0.cjs.js +0 -18
  159. package/dist/virtualize-b6a2fbe0.cjs.js.map +0 -1
  160. package/src/nile-select/virtual-scroll-helper.ts +0 -56
  161. package/src/nile-virtual-select/index.ts +0 -1
  162. package/src/nile-virtual-select/nile-virtual-select.css.ts +0 -481
  163. package/src/nile-virtual-select/nile-virtual-select.test.ts +0 -414
  164. package/src/nile-virtual-select/nile-virtual-select.ts +0 -1268
  165. package/src/nile-virtual-select/renderer.ts +0 -73
  166. package/src/nile-virtual-select/search-manager.ts +0 -50
  167. package/src/nile-virtual-select/selection-manager.ts +0 -75
  168. package/src/nile-virtual-select/types.ts +0 -54
@@ -1 +0,0 @@
1
- {"version":3,"file":"nile-virtual-select.css.cjs.js","sources":["../../../src/nile-virtual-select/nile-virtual-select.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2025\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 * Select_2 CSS\n */\nexport const styles = css`\n :host {\n box-sizing: border-box;\n }\n\n .virtualized{\n min-width: 110px;\n width: 100%;\n }\n\n .virtualized ::slotted(nile-option),\n .virtualized nile-option {\n width: 100%;\n display: block;\n }\n\n :host *,\n :host *::before,\n :host *::after {\n box-sizing: inherit;\n }\n\n [hidden] {\n display: none !important;\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: block;\n margin-bottom: 6px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\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: var(--nile-colors-red-700);\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: 0.75rem;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: 0.875rem;\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 :host {\n display: block;\n }\n\n /** The popup */\n .select {\n flex: 1 1 auto;\n display: inline-flex;\n width: 100%;\n position: relative;\n vertical-align: middle;\n }\n\n .select::part(popup) {\n z-index: 9999;\n }\n\n .select[data-current-placement^='top']::part(popup) {\n transform-origin: bottom;\n }\n\n .select[data-current-placement^='bottom']::part(popup) {\n transform-origin: top;\n }\n\n /* Combobox */\n .select__combobox {\n flex: 1;\n display: flex;\n width: 100%;\n min-width: 0;\n position: relative;\n align-items: center;\n justify-content: start;\n font-family: var(--nile-font-family-sans-serif);\n font-weight: 400;\n letter-spacing: normal;\n vertical-align: middle;\n overflow: hidden;\n cursor: pointer;\n transition: 150ms color, 150ms border, 150ms box-shadow,\n 150ms background-color;\n }\n\n .select__display-input {\n position: relative;\n width: 100%;\n font: inherit;\n border: none;\n background: none;\n color: var(--nile-colors-dark-900);\n cursor: inherit;\n overflow: hidden;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n font-family: var(--nile-font-family-serif);\n }\n\n .select__display-input::placeholder {\n font-family: var(--nile-font-family-serif);\n }\n\n .select:not(.select--disabled):hover .select__display-input {\n color: var(--nile-colors-dark-900);\n }\n\n .select__display-input:focus {\n outline: none;\n }\n\n /* Visually hide the display input when multiple is enabled */\n .select--multiple:not(.select--placeholder-visible) .select__display-input {\n position: absolute;\n z-index: -1;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n }\n\n .select__value-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n }\n\n .select__tags {\n display: flex;\n flex: 1;\n align-items: center;\n flex-wrap: no-wrap;\n margin-inline-start: 0.5rem;\n width: 100%;\n overflow: hidden;\n }\n\n .select__tags-count {\n color: var(--nile-colors-primary-600);\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n margin: 6px;\n }\n\n .select__tags-count-clearable {\n margin-right: 50px;\n }\n\n .select__tags::slotted(nile-tag) {\n cursor: pointer !important;\n }\n\n .select--disabled .select__tags,\n .select--disabled .select__tags::slotted(nile-tag) {\n cursor: not-allowed !important;\n }\n\n /* Standard selects */\n .select--standard .select__combobox {\n background-color: var(--nile-colors-white-base);\n border: solid 1px var(--nile-colors-neutral-500);\n }\n\n .select--standard .select__combobox:hover {\n border: 1px solid var(--nile-colors-dark-900);\n background: var(--nile-colors-white-base);\n }\n\n .select--standard.select--disabled .select__combobox {\n background-color: var(--nile-colors-neutral-100);\n border-color: var(--nile-colors-neutral-500);\n color: var(--nile-colors-dark-500);\n opacity: 0.5;\n cursor: not-allowed;\n outline: none;\n }\n\n .select--standard:not(.select--disabled).select--open .select__combobox,\n .select--standard:not(.select--disabled).select--focused .select__combobox {\n background-color: var(--nile-colors-neutral-100);\n }\n\n .select--warning .select__combobox {\n border-color: var(--nile-colors-yellow-500);\n }\n\n .select--error .select__combobox {\n border-color: var(--nile-colors-red-500);\n }\n\n .select--success {\n border-color: var(--nile-colors-green-500);\n }\n\n /* Filled selects */\n .select--filled .select__combobox {\n border: none;\n background-color: var(--nile-colors-neutral-100);\n color: var(--nile-colors-dark-900);\n }\n\n .select--filled:hover:not(.select--disabled) .select__combobox {\n background-color: var(--nile-colors-neutral-100);\n }\n\n .select--filled.select--disabled .select__combobox {\n background-color: var(--nile-colors-neutral-100);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .select--filled:not(.select--disabled).select--open .select__combobox,\n .select--filled:not(.select--disabled).select--focused .select__combobox {\n background-color: var(--nile-colors-neutral-100);\n outline: 3px solid rgba(0, 89, 255, 0.4);\n }\n\n .select--medium .select__combobox {\n border-radius: 4px;\n font-size: 14px;\n padding: 12px;\n height: 40px;\n box-sizing: border-box;\n }\n\n .select--medium .select__clear {\n margin-inline-start: 0.75rem;\n }\n\n .select--medium .select__prefix::slotted(*) {\n margin-inline-end: 0.75rem;\n }\n\n .select--medium .select__prefix.multiple::slotted(*) {\n margin-inline-start: 0.75rem;\n }\n\n .select--medium.select--multiple:not(.select--placeholder-visible)\n .select__combobox {\n padding-inline-start: 0;\n }\n\n .select--medium .select__tags {\n gap: 3px;\n }\n\n /* Pills */\n .select--pill.select--medium .select__combobox {\n border-radius: 2.5rem;\n }\n\n /* Prefix */\n .select__prefix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: var(--nile-colors-dark-500);\n }\n\n .select__suffix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: var(--nile-colors-dark-500);\n }\n\n /* Clear button */\n .select__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: var(--nile-colors-primary-600);\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .select__clear:hover {\n color: var(--nile-colors-dark-500);\n }\n\n .select__clear:focus {\n outline: none;\n }\n\n /* Expand icon */\n .select__expand-icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n transition: 250ms rotate ease;\n rotate: 0;\n margin-inline-start: 0.25rem;\n }\n\n .select--open .select__expand-icon {\n rotate: -180deg;\n }\n\n /* Listbox */\n .select__listbox {\n display: block;\n position: relative;\n font-size: 1rem;\n font-weight: 400;\n background: var(--nile-colors-white-base);\n border: solid 1px var(--nile-colors-neutral-500);\n border-radius: 0.25rem;\n padding-block: 0;\n padding-inline: 0;\n overflow: auto;\n overscroll-behavior: none;\n /* Make sure it adheres to the popup's auto size */\n max-width: var(--auto-size-available-width);\n max-height: var(--auto-size-available-height);\n }\n\n .select__options {\n font-size: 14px;\n color: rgb(133, 129, 129);\n width: 100%;\n }\n\n .select__options__search-enabled {\n padding-top: 10px;\n width: 100%;\n }\n\n .select__listbox::slotted(nile-divider) {\n --spacing: 0.25rem;\n }\n\n .select__listbox::slotted(small) {\n font-size: 0.875rem;\n font-weight: 600;\n color: var(--nile-colors-dark-500);\n padding-block: 0.25rem;\n padding-inline: 1rem;\n }\n\n .select__search {\n position: sticky;\n top: 0px;\n z-index: 1;\n width: calc(100% - 16px);\n padding: 8px;\n background-color: white;\n margin-bottom: -8px;\n }\n\n .select__footer {\n position: sticky;\n bottom: 0px;\n background: var(--nile-colors-neutral-100);\n border: 1px solid var(--nile-colors-neutral-400);\n display: flex;\n height: 15px;\n /* Auto layout */\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 8px 12px 16px;\n gap: 12px;\n justify-content: space-between;\n }\n\n .tag__prefix[slot='prefix'] {\n height: 14px;\n display: inline-block;\n overflow: hidden;\n }\n\n .tag__prefix[slot='prefix'] img {\n max-height: 100%;\n }\n\n .select__loader {\n width: 100%;\n text-align: center;\n display: block;\n }\n\n .select__loader--icon {\n margin-top: 20px;\n animation: spin 0.6s linear infinite;\n }\n\n .select__no-results {\n padding: 10px;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .select__invisible{\n opacity: 0;\n }\n\n .select__prefix--from-options {\n margin-inline-end: 12px;\n }\n \n .select__hide-default{\n display: none;\n }\n\n .virtualized nile-option[selected] {\n background-color: var(--nile-colors-neutral-100);\n }\n\n .virtualized nile-option[selected]::part(base) {\n color: var(--nile-colors-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,467 +0,0 @@
1
- import{css as e}from"lit";const o=e`
2
- :host {
3
- box-sizing: border-box;
4
- }
5
-
6
- .virtualized{
7
- min-width: 110px;
8
- width: 100%;
9
- }
10
-
11
- .virtualized ::slotted(nile-option),
12
- .virtualized nile-option {
13
- width: 100%;
14
- display: block;
15
- }
16
-
17
- :host *,
18
- :host *::before,
19
- :host *::after {
20
- box-sizing: inherit;
21
- }
22
-
23
- [hidden] {
24
- display: none !important;
25
- }
26
-
27
- .form-control .form-control__label {
28
- display: none;
29
- }
30
-
31
- .form-control .form-control__help-text {
32
- display: none;
33
- }
34
-
35
- /* Label */
36
- .form-control--has-label .form-control__label {
37
- display: block;
38
- margin-bottom: 6px;
39
- color: var(--nile-colors-dark-900);
40
- font-family: Colfax-regular;
41
- font-size: 14px;
42
- font-style: normal;
43
- font-weight: 400;
44
- line-height: 20px;
45
- letter-spacing: 0.2px;
46
- }
47
-
48
- .form-control--has-label.form-control--medium .form-control__label {
49
- font-size: 14px;
50
- }
51
-
52
- :host([required]) .form-control--has-label .form-control__label::after {
53
- content: '*';
54
- margin-inline-start: -2px;
55
- color: var(--nile-colors-red-700);
56
- }
57
-
58
- /* Help text */
59
- .form-control--has-help-text .form-control__help-text {
60
- display: block;
61
- color: var(--nile-colors-dark-500);
62
- margin-top: 0.75rem;
63
- }
64
-
65
- .form-control--has-help-text.form-control--medium .form-control__help-text {
66
- font-size: 0.875rem;
67
- }
68
-
69
- .form-control--has-help-text.form-control--radio-group
70
- .form-control__help-text {
71
- margin-top: 0.25rem;
72
- }
73
-
74
- :host {
75
- display: block;
76
- }
77
-
78
- /** The popup */
79
- .select {
80
- flex: 1 1 auto;
81
- display: inline-flex;
82
- width: 100%;
83
- position: relative;
84
- vertical-align: middle;
85
- }
86
-
87
- .select::part(popup) {
88
- z-index: 9999;
89
- }
90
-
91
- .select[data-current-placement^='top']::part(popup) {
92
- transform-origin: bottom;
93
- }
94
-
95
- .select[data-current-placement^='bottom']::part(popup) {
96
- transform-origin: top;
97
- }
98
-
99
- /* Combobox */
100
- .select__combobox {
101
- flex: 1;
102
- display: flex;
103
- width: 100%;
104
- min-width: 0;
105
- position: relative;
106
- align-items: center;
107
- justify-content: start;
108
- font-family: var(--nile-font-family-sans-serif);
109
- font-weight: 400;
110
- letter-spacing: normal;
111
- vertical-align: middle;
112
- overflow: hidden;
113
- cursor: pointer;
114
- transition: 150ms color, 150ms border, 150ms box-shadow,
115
- 150ms background-color;
116
- }
117
-
118
- .select__display-input {
119
- position: relative;
120
- width: 100%;
121
- font: inherit;
122
- border: none;
123
- background: none;
124
- color: var(--nile-colors-dark-900);
125
- cursor: inherit;
126
- overflow: hidden;
127
- padding: 0;
128
- margin: 0;
129
- -webkit-appearance: none;
130
- font-family: var(--nile-font-family-serif);
131
- }
132
-
133
- .select__display-input::placeholder {
134
- font-family: var(--nile-font-family-serif);
135
- }
136
-
137
- .select:not(.select--disabled):hover .select__display-input {
138
- color: var(--nile-colors-dark-900);
139
- }
140
-
141
- .select__display-input:focus {
142
- outline: none;
143
- }
144
-
145
- /* Visually hide the display input when multiple is enabled */
146
- .select--multiple:not(.select--placeholder-visible) .select__display-input {
147
- position: absolute;
148
- z-index: -1;
149
- top: 0;
150
- left: 0;
151
- width: 100%;
152
- height: 100%;
153
- opacity: 0;
154
- }
155
-
156
- .select__value-input {
157
- position: absolute;
158
- top: 0;
159
- left: 0;
160
- width: 100%;
161
- height: 100%;
162
- padding: 0;
163
- margin: 0;
164
- opacity: 0;
165
- z-index: -1;
166
- }
167
-
168
- .select__tags {
169
- display: flex;
170
- flex: 1;
171
- align-items: center;
172
- flex-wrap: no-wrap;
173
- margin-inline-start: 0.5rem;
174
- width: 100%;
175
- overflow: hidden;
176
- }
177
-
178
- .select__tags-count {
179
- color: var(--nile-colors-primary-600);
180
- font-family: Colfax-regular;
181
- font-size: 14px;
182
- font-style: normal;
183
- font-weight: 400;
184
- line-height: 14px;
185
- letter-spacing: 0.2px;
186
- margin: 6px;
187
- }
188
-
189
- .select__tags-count-clearable {
190
- margin-right: 50px;
191
- }
192
-
193
- .select__tags::slotted(nile-tag) {
194
- cursor: pointer !important;
195
- }
196
-
197
- .select--disabled .select__tags,
198
- .select--disabled .select__tags::slotted(nile-tag) {
199
- cursor: not-allowed !important;
200
- }
201
-
202
- /* Standard selects */
203
- .select--standard .select__combobox {
204
- background-color: var(--nile-colors-white-base);
205
- border: solid 1px var(--nile-colors-neutral-500);
206
- }
207
-
208
- .select--standard .select__combobox:hover {
209
- border: 1px solid var(--nile-colors-dark-900);
210
- background: var(--nile-colors-white-base);
211
- }
212
-
213
- .select--standard.select--disabled .select__combobox {
214
- background-color: var(--nile-colors-neutral-100);
215
- border-color: var(--nile-colors-neutral-500);
216
- color: var(--nile-colors-dark-500);
217
- opacity: 0.5;
218
- cursor: not-allowed;
219
- outline: none;
220
- }
221
-
222
- .select--standard:not(.select--disabled).select--open .select__combobox,
223
- .select--standard:not(.select--disabled).select--focused .select__combobox {
224
- background-color: var(--nile-colors-neutral-100);
225
- }
226
-
227
- .select--warning .select__combobox {
228
- border-color: var(--nile-colors-yellow-500);
229
- }
230
-
231
- .select--error .select__combobox {
232
- border-color: var(--nile-colors-red-500);
233
- }
234
-
235
- .select--success {
236
- border-color: var(--nile-colors-green-500);
237
- }
238
-
239
- /* Filled selects */
240
- .select--filled .select__combobox {
241
- border: none;
242
- background-color: var(--nile-colors-neutral-100);
243
- color: var(--nile-colors-dark-900);
244
- }
245
-
246
- .select--filled:hover:not(.select--disabled) .select__combobox {
247
- background-color: var(--nile-colors-neutral-100);
248
- }
249
-
250
- .select--filled.select--disabled .select__combobox {
251
- background-color: var(--nile-colors-neutral-100);
252
- opacity: 0.5;
253
- cursor: not-allowed;
254
- }
255
-
256
- .select--filled:not(.select--disabled).select--open .select__combobox,
257
- .select--filled:not(.select--disabled).select--focused .select__combobox {
258
- background-color: var(--nile-colors-neutral-100);
259
- outline: 3px solid rgba(0, 89, 255, 0.4);
260
- }
261
-
262
- .select--medium .select__combobox {
263
- border-radius: 4px;
264
- font-size: 14px;
265
- padding: 12px;
266
- height: 40px;
267
- box-sizing: border-box;
268
- }
269
-
270
- .select--medium .select__clear {
271
- margin-inline-start: 0.75rem;
272
- }
273
-
274
- .select--medium .select__prefix::slotted(*) {
275
- margin-inline-end: 0.75rem;
276
- }
277
-
278
- .select--medium .select__prefix.multiple::slotted(*) {
279
- margin-inline-start: 0.75rem;
280
- }
281
-
282
- .select--medium.select--multiple:not(.select--placeholder-visible)
283
- .select__combobox {
284
- padding-inline-start: 0;
285
- }
286
-
287
- .select--medium .select__tags {
288
- gap: 3px;
289
- }
290
-
291
- /* Pills */
292
- .select--pill.select--medium .select__combobox {
293
- border-radius: 2.5rem;
294
- }
295
-
296
- /* Prefix */
297
- .select__prefix {
298
- flex: 0;
299
- display: inline-flex;
300
- align-items: center;
301
- color: var(--nile-colors-dark-500);
302
- }
303
-
304
- .select__suffix {
305
- flex: 0;
306
- display: inline-flex;
307
- align-items: center;
308
- color: var(--nile-colors-dark-500);
309
- }
310
-
311
- /* Clear button */
312
- .select__clear {
313
- display: inline-flex;
314
- align-items: center;
315
- justify-content: center;
316
- font-size: inherit;
317
- color: var(--nile-colors-primary-600);
318
- border: none;
319
- background: none;
320
- padding: 0;
321
- transition: 150ms color;
322
- cursor: pointer;
323
- }
324
-
325
- .select__clear:hover {
326
- color: var(--nile-colors-dark-500);
327
- }
328
-
329
- .select__clear:focus {
330
- outline: none;
331
- }
332
-
333
- /* Expand icon */
334
- .select__expand-icon {
335
- flex: 0 0 auto;
336
- display: flex;
337
- align-items: center;
338
- transition: 250ms rotate ease;
339
- rotate: 0;
340
- margin-inline-start: 0.25rem;
341
- }
342
-
343
- .select--open .select__expand-icon {
344
- rotate: -180deg;
345
- }
346
-
347
- /* Listbox */
348
- .select__listbox {
349
- display: block;
350
- position: relative;
351
- font-size: 1rem;
352
- font-weight: 400;
353
- background: var(--nile-colors-white-base);
354
- border: solid 1px var(--nile-colors-neutral-500);
355
- border-radius: 0.25rem;
356
- padding-block: 0;
357
- padding-inline: 0;
358
- overflow: auto;
359
- overscroll-behavior: none;
360
- /* Make sure it adheres to the popup's auto size */
361
- max-width: var(--auto-size-available-width);
362
- max-height: var(--auto-size-available-height);
363
- }
364
-
365
- .select__options {
366
- font-size: 14px;
367
- color: rgb(133, 129, 129);
368
- width: 100%;
369
- }
370
-
371
- .select__options__search-enabled {
372
- padding-top: 10px;
373
- width: 100%;
374
- }
375
-
376
- .select__listbox::slotted(nile-divider) {
377
- --spacing: 0.25rem;
378
- }
379
-
380
- .select__listbox::slotted(small) {
381
- font-size: 0.875rem;
382
- font-weight: 600;
383
- color: var(--nile-colors-dark-500);
384
- padding-block: 0.25rem;
385
- padding-inline: 1rem;
386
- }
387
-
388
- .select__search {
389
- position: sticky;
390
- top: 0px;
391
- z-index: 1;
392
- width: calc(100% - 16px);
393
- padding: 8px;
394
- background-color: white;
395
- margin-bottom: -8px;
396
- }
397
-
398
- .select__footer {
399
- position: sticky;
400
- bottom: 0px;
401
- background: var(--nile-colors-neutral-100);
402
- border: 1px solid var(--nile-colors-neutral-400);
403
- display: flex;
404
- height: 15px;
405
- /* Auto layout */
406
- display: flex;
407
- flex-direction: row;
408
- align-items: flex-start;
409
- padding: 8px 12px 16px;
410
- gap: 12px;
411
- justify-content: space-between;
412
- }
413
-
414
- .tag__prefix[slot='prefix'] {
415
- height: 14px;
416
- display: inline-block;
417
- overflow: hidden;
418
- }
419
-
420
- .tag__prefix[slot='prefix'] img {
421
- max-height: 100%;
422
- }
423
-
424
- .select__loader {
425
- width: 100%;
426
- text-align: center;
427
- display: block;
428
- }
429
-
430
- .select__loader--icon {
431
- margin-top: 20px;
432
- animation: spin 0.6s linear infinite;
433
- }
434
-
435
- .select__no-results {
436
- padding: 10px;
437
- }
438
-
439
- @keyframes spin {
440
- 0% {
441
- transform: rotate(0deg);
442
- }
443
- 100% {
444
- transform: rotate(360deg);
445
- }
446
- }
447
-
448
- .select__invisible{
449
- opacity: 0;
450
- }
451
-
452
- .select__prefix--from-options {
453
- margin-inline-end: 12px;
454
- }
455
-
456
- .select__hide-default{
457
- display: none;
458
- }
459
-
460
- .virtualized nile-option[selected] {
461
- background-color: var(--nile-colors-neutral-100);
462
- }
463
-
464
- .virtualized nile-option[selected]::part(base) {
465
- color: var(--nile-colors-primary-600);
466
- }
467
- `;export{o as s};