function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import PisellSingleSelect from "./PisellSingleSelect";
import { useState } from 'react';
import { Form } from 'antd';
import React from 'react';

/**
 * PisellSingleSelect 组件 Storybook
 *
 * 用于展示和测试组件的各种状态和配置
 */
var meta = {
  title: '表单/表单组件/PisellSingleSelect',
  component: PisellSingleSelect,
  tags: ['autodocs'],
  argTypes: {
    value: {
      control: 'text',
      description: '当前选中值'
    },
    placeholder: {
      control: 'text',
      description: '占位符文本'
    },
    disabled: {
      control: 'boolean',
      description: '是否禁用'
    },
    readOnly: {
      control: 'boolean',
      description: '是否只读'
    },
    showSearch: {
      control: 'boolean',
      description: '是否显示搜索框'
    },
    allowClear: {
      control: 'boolean',
      description: '是否显示清空按钮'
    },
    size: {
      control: 'radio',
      options: ['small', 'medium', 'large'],
      description: '尺寸'
    },
    error: {
      control: 'boolean',
      description: '是否显示错误状态'
    },
    required: {
      control: 'boolean',
      description: '是否必填'
    }
  }
};
export default meta;
// 模拟数据
var fruitOptions = [{
  value: 'apple',
  label: '苹果'
}, {
  value: 'banana',
  label: '香蕉'
}, {
  value: 'orange',
  label: '橙子'
}, {
  value: 'grape',
  label: '葡萄'
}, {
  value: 'watermelon',
  label: '西瓜'
}];
var cityOptions = [{
  value: 'beijing',
  label: '北京'
}, {
  value: 'shanghai',
  label: '上海'
}, {
  value: 'guangzhou',
  label: '广州'
}, {
  value: 'shenzhen',
  label: '深圳'
}, {
  value: 'chengdu',
  label: '成都'
}, {
  value: 'hangzhou',
  label: '杭州'
}, {
  value: 'wuhan',
  label: '武汉'
}, {
  value: 'xian',
  label: '西安'
}];

/**
 * 基础示例
 */
export var Basic = {
  args: {
    options: fruitOptions,
    placeholder: '请选择一种水果'
  },
  render: function render(args) {
    var _useState = useState(args.value),
      _useState2 = _slicedToArray(_useState, 2),
      value = _useState2[0],
      setValue = _useState2[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, _extends({}, args, {
      value: value,
      onChange: function onChange(val) {
        return setValue(val);
      }
    }));
  }
};

/**
 * 带标签
 */
export var WithLabel = {
  args: {
    options: fruitOptions,
    label: '最爱水果',
    placeholder: '请选择',
    required: true
  },
  render: function render(args) {
    var _useState3 = useState(null),
      _useState4 = _slicedToArray(_useState3, 2),
      value = _useState4[0],
      setValue = _useState4[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, _extends({}, args, {
      value: value,
      onChange: function onChange(val) {
        return setValue(val);
      }
    }));
  }
};

/**
 * 带辅助文本
 */
export var WithHelperText = {
  args: {
    options: fruitOptions,
    label: '选择水果',
    helperText: '请选择你最喜欢的水果',
    placeholder: '请选择'
  },
  render: function render(args) {
    var _useState5 = useState(null),
      _useState6 = _slicedToArray(_useState5, 2),
      value = _useState6[0],
      setValue = _useState6[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, _extends({}, args, {
      value: value,
      onChange: function onChange(val) {
        return setValue(val);
      }
    }));
  }
};

/**
 * 带搜索功能
 */
export var WithSearch = {
  args: {
    options: cityOptions,
    label: '选择城市',
    placeholder: '搜索城市...',
    showSearch: true
  },
  render: function render(args) {
    var _useState7 = useState(null),
      _useState8 = _slicedToArray(_useState7, 2),
      value = _useState8[0],
      setValue = _useState8[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, _extends({}, args, {
      value: value,
      onChange: function onChange(val) {
        return setValue(val);
      },
      onSearch: function onSearch(keyword) {
        return console.log('搜索关键词:', keyword);
      }
    }));
  }
};

/**
 * 带清空按钮
 */
export var WithClear = {
  args: {
    options: fruitOptions,
    label: '选择水果',
    placeholder: '请选择',
    allowClear: true
  },
  render: function render(args) {
    var _useState9 = useState('apple'),
      _useState10 = _slicedToArray(_useState9, 2),
      value = _useState10[0],
      setValue = _useState10[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, _extends({}, args, {
      value: value,
      onChange: function onChange(val) {
        return setValue(val);
      }
    }));
  }
};

/**
 * 禁用态
 */
export var Disabled = {
  args: {
    options: fruitOptions,
    label: '选择水果',
    value: 'apple',
    disabled: true
  }
};

/**
 * 只读态
 */
export var ReadOnly = {
  args: {
    options: fruitOptions,
    label: '选择水果',
    value: 'apple',
    readOnly: true
  }
};

/**
 * 只读态 - 空值
 */
export var ReadOnlyEmpty = {
  args: {
    options: fruitOptions,
    label: '选择水果',
    value: null,
    readOnly: true
  }
};

/**
 * 错误状态
 */
export var WithError = {
  args: {
    options: fruitOptions,
    label: '选择水果',
    placeholder: '请选择',
    required: true,
    error: true,
    errorText: '此项为必填项，请选择'
  },
  render: function render(args) {
    var _useState11 = useState(null),
      _useState12 = _slicedToArray(_useState11, 2),
      value = _useState12[0],
      setValue = _useState12[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, _extends({}, args, {
      value: value,
      onChange: function onChange(val) {
        return setValue(val);
      }
    }));
  }
};

/**
 * 不同尺寸
 */
export var Sizes = {
  render: function render() {
    var _useState13 = useState('apple'),
      _useState14 = _slicedToArray(_useState13, 2),
      small = _useState14[0],
      setSmall = _useState14[1];
    var _useState15 = useState('banana'),
      _useState16 = _slicedToArray(_useState15, 2),
      medium = _useState16[0],
      setMedium = _useState16[1];
    var _useState17 = useState('orange'),
      _useState18 = _slicedToArray(_useState17, 2),
      large = _useState18[0],
      setLarge = _useState18[1];
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: 24
      }
    }, /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "Small \u5C3A\u5BF8",
      size: "small",
      value: small,
      onChange: setSmall
    }), /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "Medium \u5C3A\u5BF8\uFF08\u9ED8\u8BA4\uFF09",
      size: "medium",
      value: medium,
      onChange: setMedium
    }), /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "Large \u5C3A\u5BF8",
      size: "large",
      value: large,
      onChange: setLarge
    }));
  }
};

/**
 * 表单场景
 */
export var InForm = {
  render: function render() {
    var _useState19 = useState(null),
      _useState20 = _slicedToArray(_useState19, 2),
      fruit = _useState20[0],
      setFruit = _useState20[1];
    var _useState21 = useState(null),
      _useState22 = _slicedToArray(_useState21, 2),
      city = _useState22[0],
      setCity = _useState22[1];
    return /*#__PURE__*/React.createElement(Form, {
      layout: "vertical",
      style: {
        maxWidth: 400
      }
    }, /*#__PURE__*/React.createElement(Form.Item, {
      label: "\u6700\u7231\u6C34\u679C\uFF08\u5FC5\u586B\uFF09"
    }, /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      value: fruit,
      onChange: setFruit,
      placeholder: "\u8BF7\u9009\u62E9\u6C34\u679C",
      required: true
    })), /*#__PURE__*/React.createElement(Form.Item, {
      label: "\u6240\u5728\u57CE\u5E02"
    }, /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: cityOptions,
      value: city,
      onChange: setCity,
      placeholder: "\u8BF7\u9009\u62E9\u57CE\u5E02",
      showSearch: true,
      allowClear: true
    })));
  }
};

/**
 * 自定义过滤
 */
export var CustomFilter = {
  render: function render() {
    var _useState23 = useState(null),
      _useState24 = _slicedToArray(_useState23, 2),
      value = _useState24[0],
      setValue = _useState24[1];
    return /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: cityOptions,
      label: "\u9009\u62E9\u57CE\u5E02\uFF08\u652F\u6301\u62FC\u97F3\u641C\u7D22\uFF09",
      placeholder: "\u8F93\u5165\u57CE\u5E02\u540D\u6216\u62FC\u97F3...",
      showSearch: true,
      value: value,
      onChange: setValue,
      filterOption: function filterOption(input, option) {
        var searchText = input.toLowerCase();
        // 支持 label 匹配
        return option.label.toLowerCase().includes(searchText);
      }
    });
  }
};

/**
 * 回调事件演示
 */
export var WithCallbacks = {
  render: function render() {
    var _useState25 = useState(null),
      _useState26 = _slicedToArray(_useState25, 2),
      value = _useState26[0],
      setValue = _useState26[1];
    var _useState27 = useState([]),
      _useState28 = _slicedToArray(_useState27, 2),
      logs = _useState28[0],
      setLogs = _useState28[1];
    var addLog = function addLog(message) {
      setLogs(function (prev) {
        return [].concat(_toConsumableArray(prev), ["".concat(new Date().toLocaleTimeString(), ": ").concat(message)]);
      });
    };
    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "\u9009\u62E9\u6C34\u679C",
      value: value,
      onChange: function onChange(val, option) {
        setValue(val);
        addLog("onChange: ".concat(val, " - ").concat(option === null || option === void 0 ? void 0 : option.label));
      },
      onFocus: function onFocus() {
        return addLog('onFocus 触发');
      },
      onBlur: function onBlur() {
        return addLog('onBlur 触发');
      },
      onSearch: function onSearch(keyword) {
        return addLog("onSearch: ".concat(keyword));
      },
      onDropdownVisibleChange: function onDropdownVisibleChange(visible) {
        return addLog("\u4E0B\u62C9\u6846".concat(visible ? '打开' : '关闭'));
      },
      showSearch: true,
      allowClear: true
    }), /*#__PURE__*/React.createElement("div", {
      style: {
        marginTop: 16,
        padding: 12,
        background: '#f5f5f5',
        borderRadius: 4
      }
    }, /*#__PURE__*/React.createElement("strong", null, "\u4E8B\u4EF6\u65E5\u5FD7\uFF1A"), /*#__PURE__*/React.createElement("div", {
      style: {
        maxHeight: 200,
        overflow: 'auto',
        marginTop: 8
      }
    }, logs.map(function (log, index) {
      return /*#__PURE__*/React.createElement("div", {
        key: index,
        style: {
          fontSize: 12,
          padding: '4px 0'
        }
      }, log);
    }))));
  }
};

/**
 * 所有状态组合
 */
export var AllStates = {
  render: function render() {
    var _useState29 = useState('apple'),
      _useState30 = _slicedToArray(_useState29, 2),
      value1 = _useState30[0],
      setValue1 = _useState30[1];
    var _useState31 = useState(null),
      _useState32 = _slicedToArray(_useState31, 2),
      value2 = _useState32[0],
      setValue2 = _useState32[1];
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: 24
      }
    }, /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "\u6B63\u5E38\u72B6\u6001",
      value: value1,
      onChange: setValue1
    }), /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "\u7981\u7528\u6001",
      value: "apple",
      disabled: true
    }), /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "\u53EA\u8BFB\u6001",
      value: "banana",
      readOnly: true
    }), /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "\u9519\u8BEF\u72B6\u6001\uFF08\u5FC5\u586B\uFF09",
      value: value2,
      onChange: setValue2,
      required: true,
      error: true,
      errorText: "\u6B64\u9879\u4E3A\u5FC5\u586B\u9879\uFF0C\u8BF7\u9009\u62E9"
    }), /*#__PURE__*/React.createElement(PisellSingleSelect, {
      options: fruitOptions,
      label: "\u5E26\u8F85\u52A9\u6587\u672C",
      helperText: "\u8BF7\u9009\u62E9\u4F60\u6700\u559C\u6B22\u7684\u6C34\u679C",
      value: value1,
      onChange: setValue1
    }));
  }
};