@cerberus-design/react/dist/components/combobox/combobox.cjs

The Cerberus Design React component library.

'use strict';

Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });

const jsxRuntime = require('react/jsx-runtime');
const cerberus = require('../../context/cerberus.cjs');
const index = require('../../utils/index.cjs');
const portal = require('../portal/portal.cjs');
const show = require('../show/show.cjs');
const parts = require('./parts.cjs');
const primitives = require('./primitives.cjs');

function Combobox(props) {
  const [{ startIcon, label, ...elProps }, rootProps] = index.splitProps(props, [
    "label",
    "children",
    "startIcon",
    "container"
  ]);
  const { icons } = cerberus.useCerberusContext();
  const { selectArrow: SelectArrow, close: CloseIcon } = icons;
  const hasStartIcon = Boolean(startIcon);
  return /* @__PURE__ */ jsxRuntime.jsxs(parts.ComboboxParts.Root, { ...rootProps, children: [
    /* @__PURE__ */ jsxRuntime.jsx(show.Show, { when: label, children: /* @__PURE__ */ jsxRuntime.jsx(parts.ComboboxParts.Label, { children: label }) }),
    /* @__PURE__ */ jsxRuntime.jsxs(parts.ComboboxParts.Control, { children: [
      /* @__PURE__ */ jsxRuntime.jsx(show.Show, { when: hasStartIcon, children: /* @__PURE__ */ jsxRuntime.jsx(primitives.ComboboxStartIcon, { children: startIcon }) }),
      /* @__PURE__ */ jsxRuntime.jsx(
        parts.ComboboxParts.Input,
        {
          ...hasStartIcon && { "data-has": "start-indicator" }
        }
      ),
      /* @__PURE__ */ jsxRuntime.jsx(parts.ComboboxParts.ClearTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, {}) }),
      /* @__PURE__ */ jsxRuntime.jsx(parts.ComboboxParts.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(SelectArrow, {}) })
    ] }),
    /* @__PURE__ */ jsxRuntime.jsx(portal.Portal, { container: elProps.container, children: /* @__PURE__ */ jsxRuntime.jsx(parts.ComboboxParts.Positioner, { children: /* @__PURE__ */ jsxRuntime.jsx(parts.ComboboxParts.Content, { size: rootProps.size, children: elProps.children }) }) })
  ] });
}

exports.Combobox = Combobox;