@crossed/ui/lib/commonjs/forms/Select/index.js

A universal & performant styling library for React Native, Next.js & React

var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var Select_exports = {};
__export(Select_exports, {
  Select: () => Select
});
module.exports = __toCommonJS(Select_exports);
var import_jsx_runtime = require("react/jsx-runtime");
var import_react = require("react");
var import_Sheet = require("../../overlay/Sheet");
var import_YBox = require("../../layout/YBox");
var import_Text = require("../../typography/Text");
var import_Form = require("../../forms/Form");
var import_Label = require("./Label");
var import_context = require("./context");
var import_core = require("@crossed/core");
var import_Trigger = require("./Trigger");
var import_Content = require("./Content");
var import_useFloating = require("./useFloating");
var import_Floating = require("../../overlay/Floating");
var import_styled = require("@crossed/styled");
var import_useMedia = require("../../useMedia");
const Select = (0, import_react.memo)((e) => {
  const {
    label,
    description,
    extra,
    error,
    multiple,
    clearable,
    searchable,
    value: valueProps,
    onChange,
    defaultValue,
    items,
    disabled,
    id,
    onSearch,
    loading,
    renderValue,
    children,
    section
  } = e;
  const { md } = (0, import_useMedia.useMedia)();
  const [value, setValue] = (0, import_core.useUncontrolled)({
    value: valueProps,
    onChange,
    defaultValue
  });
  const { refs, floatingStyles } = (0, import_useFloating.useFloating)();
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
    import_context.SelectConfigProvider,
    {
      multiple,
      clearable,
      searchable,
      disabled,
      section,
      showSheet: !import_styled.isWeb || !md,
      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
        import_context.SelectValueProvider,
        {
          value,
          setValue,
          renderValue,
          items,
          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Floating.Floating, { removeScroll: false, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Sheet.Sheet, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Form.FormField, { disabled, children: [
            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_YBox.YBox, { space: "xxs", children: [
              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                import_Label.SelectLabel,
                {
                  label,
                  description,
                  extra
                }
              ),
              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                import_Trigger.SelectTrigger,
                {
                  ref: refs.setReference,
                  id,
                  disabled,
                  children
                }
              ),
              !!error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Text.Text, { color: "error", children: error.toString() })
            ] }),
            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
              import_Content.SelectContent,
              {
                ref: refs.setFloating,
                floatingStyles,
                onSearch,
                loading
              }
            )
          ] }) }) })
        }
      )
    }
  );
});
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  Select
});
//# sourceMappingURL=index.js.map