import { define } from "./preactement/define";
import { Dropdown } from "../Dropdown";
import { parseBooleanAttr } from "./wrapperUtils";
import { jsx as _jsx } from "preact/compat/jsx-runtime";
const attributes = [
// Using the lowercase HTML attribute name rather than `auto-focus` so it's
// more natural. There's no reason for us to worry about name collisions.
'autofocus', 'aria-disabled', 'class-name', 'disabled', 'error-message', 'error-placement', 'field-class-name', 'options', 'label', 'label-class-name', 'label-id', 'hint', 'hint-id', 'inversed', 'name', 'requirement-label', 'root-id', 'size', 'value', 'default-value'];

/* eslint-disable @typescript-eslint/no-namespace */

/* eslint-enable */

const Wrapper = _ref => {
  let {
    children,
    options,
    rootId,
    ...otherProps
  } = _ref;
  return /*#__PURE__*/_jsx(Dropdown, {
    ...otherProps,
    autoFocus: parseBooleanAttr(otherProps.autofocus),
    disabled: parseBooleanAttr(otherProps.disabled),
    "aria-disabled": parseBooleanAttr(otherProps.ariaDisabled),
    options: typeof options === 'string' ? JSON.parse(options) : options,
    id: rootId,
    inversed: parseBooleanAttr(otherProps.inversed),
    children: options ? undefined : children
  });
};
define('ds-dropdown', () => Wrapper, {
  attributes,
  events: ['onChange', 'onBlur']
});