UNPKG

@arolariu/components

Version:

🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡

142 lines (115 loc) • 2.35 kB
.combobox-wmFvJE { display: contents; } .trigger-asByxe { justify-content: space-between; width: 100%; min-width: 200px; } .triggerValue-s6rRGO { text-align: left; text-overflow: ellipsis; white-space: nowrap; flex: 1; overflow: hidden; } .triggerPlaceholder-T2THwp { color: var(--ac-neutral-500); } .triggerIcon-Z1UTU8 { height: 1rem; margin-left: var(--ac-spacing-2); opacity: .5; flex-shrink: 0; width: 1rem; } .content-uE5DAH { min-width: 200px; width: var(--anchor-width); padding: 0; } .command-cdXzEx { box-shadow: none; border: none; } .commandInput-s91u2v { border-bottom: 1px solid var(--ac-neutral-200); border-radius: 0; } .commandList-YCmDON { max-height: 300px; overflow-y: auto; } .item-ThEyJB { border-radius: var(--ac-radius-sm); cursor: pointer; align-items: center; gap: var(--ac-spacing-2); padding: var(--ac-spacing-2) var(--ac-spacing-3); transition: background-color .2s; display: flex; } .item-ThEyJB:hover { background-color: var(--ac-neutral-100); } .item-ThEyJB[data-disabled] { opacity: .5; pointer-events: none; } .itemSelected-JsUZAF { background-color: var(--ac-neutral-100); } .itemCheck-j350UO { opacity: 0; flex-shrink: 0; width: 1rem; height: 1rem; transition: opacity .2s; } .itemCheckVisible-QMieBm { opacity: 1; } .itemLabel-wCtpTY { text-overflow: ellipsis; white-space: nowrap; flex: 1; overflow: hidden; } .empty-EEImeI { color: var(--ac-neutral-500); font-size: var(--ac-font-size-sm); padding: var(--ac-spacing-6) var(--ac-spacing-4); text-align: center; } .group-w7Vcxw { padding: var(--ac-spacing-1) 0; } .separator-nkP8ud { background-color: var(--ac-neutral-200); height: 1px; margin: var(--ac-spacing-1) 0; } .dark .triggerPlaceholder-T2THwp { color: var(--ac-neutral-400); } .dark .commandInput-s91u2v { border-bottom-color: var(--ac-neutral-700); } .dark .item-ThEyJB:hover { background-color: var(--ac-neutral-800); } .dark .itemSelected-JsUZAF { background-color: var(--ac-neutral-800); } .dark .empty-EEImeI { color: var(--ac-neutral-400); } .dark .separator-nkP8ud { background-color: var(--ac-neutral-700); } @media (width <= 640px) { .content-uE5DAH, .trigger-asByxe { min-width: 150px; } } /*# sourceMappingURL=combobox_module.css.map */