@primer/react/lib-esm/Select/Select.js

An implementation of GitHub's Primer Design System using React

import { c } from 'react-compiler-runtime';
import React from 'react';
import { clsx } from 'clsx';
import { TextInputWrapper } from '../internal/components/TextInputWrapper.js';
import classes from './Select.module.css.js';
import { jsxs, jsx } from 'react/jsx-runtime';

const ArrowIndicatorSVG = t0 => {
  const $ = c(3);
  const {
    className
  } = t0;
  let t1;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = /*#__PURE__*/jsx("path", {
      d: "m4.074 9.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.043 9H4.251a.25.25 0 0 0-.177.427ZM4.074 7.47 7.47 4.073a.25.25 0 0 1 .354 0L11.22 7.47a.25.25 0 0 1-.177.426H4.251a.25.25 0 0 1-.177-.426Z"
    });
    $[0] = t1;
  } else {
    t1 = $[0];
  }
  let t2;
  if ($[1] !== className) {
    t2 = /*#__PURE__*/jsx("svg", {
      "aria-hidden": "true",
      width: "16",
      height: "16",
      fill: "currentColor",
      xmlns: "http://www.w3.org/2000/svg",
      className: className,
      children: t1
    });
    $[1] = className;
    $[2] = t2;
  } else {
    t2 = $[2];
  }
  return t2;
};
const ArrowIndicator = t0 => {
  const $ = c(4);
  const {
    className
  } = t0;
  let t1;
  if ($[0] !== className) {
    t1 = clsx(classes.ArrowIndicator, className);
    $[0] = className;
    $[1] = t1;
  } else {
    t1 = $[1];
  }
  let t2;
  if ($[2] !== t1) {
    t2 = /*#__PURE__*/jsx(ArrowIndicatorSVG, {
      className: t1
    });
    $[2] = t1;
    $[3] = t2;
  } else {
    t2 = $[3];
  }
  return t2;
};
const Select = /*#__PURE__*/React.forwardRef((t0, ref) => {
  var _ref, _defaultValue;
  const $ = c(39);
  let block;
  let children;
  let className;
  let contrast;
  let defaultValue;
  let disabled;
  let placeholder;
  let required;
  let rest;
  let size;
  let sx;
  let validationStatus;
  if ($[0] !== t0) {
    ({
      block,
      children,
      className,
      contrast,
      defaultValue,
      disabled,
      placeholder,
      size,
      required,
      validationStatus,
      sx,
      ...rest
    } = t0);
    $[0] = t0;
    $[1] = block;
    $[2] = children;
    $[3] = className;
    $[4] = contrast;
    $[5] = defaultValue;
    $[6] = disabled;
    $[7] = placeholder;
    $[8] = required;
    $[9] = rest;
    $[10] = size;
    $[11] = sx;
    $[12] = validationStatus;
  } else {
    block = $[1];
    children = $[2];
    className = $[3];
    contrast = $[4];
    defaultValue = $[5];
    disabled = $[6];
    placeholder = $[7];
    required = $[8];
    rest = $[9];
    size = $[10];
    sx = $[11];
    validationStatus = $[12];
  }
  const t1 = validationStatus === "error" ? "true" : "false";
  const t2 = disabled && classes.Disabled;
  let t3;
  if ($[13] !== className || $[14] !== t2) {
    t3 = clsx(className, classes.Select, t2);
    $[13] = className;
    $[14] = t2;
    $[15] = t3;
  } else {
    t3 = $[15];
  }
  const t4 = Boolean(placeholder);
  const t5 = (_ref = (_defaultValue = defaultValue) !== null && _defaultValue !== void 0 ? _defaultValue : placeholder) !== null && _ref !== void 0 ? _ref : undefined;
  let t6;
  if ($[16] !== placeholder || $[17] !== required) {
    t6 = placeholder && /*#__PURE__*/jsx("option", {
      value: "",
      disabled: required,
      hidden: required,
      children: placeholder
    });
    $[16] = placeholder;
    $[17] = required;
    $[18] = t6;
  } else {
    t6 = $[18];
  }
  let t7;
  if ($[19] !== children || $[20] !== disabled || $[21] !== ref || $[22] !== required || $[23] !== rest || $[24] !== t1 || $[25] !== t3 || $[26] !== t4 || $[27] !== t5 || $[28] !== t6) {
    t7 = /*#__PURE__*/jsxs("select", {
      ...rest,
      ref: ref,
      required: required,
      disabled: disabled,
      "aria-invalid": t1,
      className: t3,
      "data-hasplaceholder": t4,
      defaultValue: t5,
      children: [t6, children]
    });
    $[19] = children;
    $[20] = disabled;
    $[21] = ref;
    $[22] = required;
    $[23] = rest;
    $[24] = t1;
    $[25] = t3;
    $[26] = t4;
    $[27] = t5;
    $[28] = t6;
    $[29] = t7;
  } else {
    t7 = $[29];
  }
  let t8;
  if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
    t8 = /*#__PURE__*/jsx(ArrowIndicator, {
      className: classes.ArrowIndicator
    });
    $[30] = t8;
  } else {
    t8 = $[30];
  }
  let t9;
  if ($[31] !== block || $[32] !== contrast || $[33] !== disabled || $[34] !== size || $[35] !== sx || $[36] !== t7 || $[37] !== validationStatus) {
    t9 = /*#__PURE__*/jsxs(TextInputWrapper, {
      block: block,
      contrast: contrast,
      disabled: disabled,
      size: size,
      validationStatus: validationStatus,
      className: classes.TextInputWrapper,
      sx: sx,
      children: [t7, t8]
    });
    $[31] = block;
    $[32] = contrast;
    $[33] = disabled;
    $[34] = size;
    $[35] = sx;
    $[36] = t7;
    $[37] = validationStatus;
    $[38] = t9;
  } else {
    t9 = $[38];
  }
  return t9;
});
const Option = props => {
  const $ = c(2);
  let t0;
  if ($[0] !== props) {
    t0 = /*#__PURE__*/jsx("option", {
      ...props
    });
    $[0] = props;
    $[1] = t0;
  } else {
    t0 = $[1];
  }
  return t0;
};
const OptGroup = props => {
  const $ = c(2);
  let t0;
  if ($[0] !== props) {
    t0 = /*#__PURE__*/jsx("optgroup", {
      ...props
    });
    $[0] = props;
    $[1] = t0;
  } else {
    t0 = $[1];
  }
  return t0;
};
var Select$1 = Object.assign(Select, {
  Option,
  OptGroup
});

export { Select$1 as default };