var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/components/PisellCards/components/GraphicTextCard/GraphicTextCard.stories.tsx
var GraphicTextCard_stories_exports = {};
__export(GraphicTextCard_stories_exports, {
  BadgeDot: () => BadgeDot,
  BadgeNumber: () => BadgeNumber,
  BadgePositions: () => BadgePositions,
  BadgeShowZero: () => BadgeShowZero,
  BadgeSizeAndOffset: () => BadgeSizeAndOffset,
  BadgeSizes: () => BadgeSizes,
  BadgeText: () => BadgeText,
  ClickInteraction: () => ClickInteraction,
  CompleteExample: () => CompleteExample,
  Default: () => Default,
  GraphicConfigIcon: () => GraphicConfigIcon,
  GraphicConfigSize: () => GraphicConfigSize,
  GraphicImagePriority: () => GraphicImagePriority,
  GraphicSlot: () => GraphicSlot,
  MultipleCards: () => MultipleCards,
  NavigationMenu: () => NavigationMenu,
  NotClickable: () => NotClickable,
  PrefixSlot: () => PrefixSlot,
  ProductCategories: () => ProductCategories,
  ReactNodeText: () => ReactNodeText,
  SizeDefault: () => SizeDefault,
  SizeLarge: () => SizeLarge,
  SizeSmall: () => SizeSmall,
  StateActive: () => StateActive,
  StateDisabled: () => StateDisabled,
  StateLoading: () => StateLoading,
  StatePriority: () => StatePriority,
  SuffixSlot: () => SuffixSlot,
  TextAlign: () => TextAlign,
  TextConfig: () => TextConfig,
  TextEllipsis: () => TextEllipsis,
  VariantCard: () => VariantCard,
  VariantHorizontal: () => VariantHorizontal,
  VariantVerticalIcon: () => VariantVerticalIcon,
  VariantVerticalImage: () => VariantVerticalImage,
  WidthModeAuto: () => WidthModeAuto,
  WidthModeFixed: () => WidthModeFixed,
  WidthModeFull: () => WidthModeFull,
  default: () => GraphicTextCard_stories_default
});
module.exports = __toCommonJS(GraphicTextCard_stories_exports);
var import_react = __toESM(require("react"));
var import_test = require("@storybook/test");
var import_icons = require("@ant-design/icons");
var import_antd = require("antd");
var import_GraphicTextCard = __toESM(require("./GraphicTextCard"));
var meta = {
  title: "Atom Components/PisellCards/GraphicTextCard",
  component: import_GraphicTextCard.default,
  parameters: {
    layout: "padded",
    docs: {
      description: {
        component: "图文卡片组件，结合图标/图片、文本和状态标识。支持 4 种样式变体、3 种尺寸、4 种状态。"
      }
    }
  },
  tags: ["autodocs"],
  argTypes: {
    text: {
      control: "text",
      description: "卡片显示的文本内容（必填）"
    },
    variant: {
      control: "select",
      options: ["vertical-image", "vertical-icon", "horizontal", "card"],
      description: "卡片样式变体"
    },
    size: {
      control: "select",
      options: ["small", "default", "large"],
      description: "卡片尺寸"
    },
    clickable: {
      control: "boolean",
      description: "是否可点击"
    },
    widthMode: {
      control: "select",
      options: ["auto", "fixed", "full"],
      description: "宽度模式"
    }
  }
};
var GraphicTextCard_stories_default = meta;
var Default = {
  args: {
    text: "分类一",
    image: "https://via.placeholder.com/80"
  },
  play: async ({ canvasElement }) => {
    const canvas = (0, import_test.within)(canvasElement);
    await (0, import_test.expect)(canvas.getByText("分类一")).toBeInTheDocument();
  }
};
var MultipleCards = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(import_GraphicTextCard.default, { text: "分类一", image: "https://via.placeholder.com/80" }), /* @__PURE__ */ import_react.default.createElement(import_GraphicTextCard.default, { text: "分类二", image: "https://via.placeholder.com/80" }), /* @__PURE__ */ import_react.default.createElement(import_GraphicTextCard.default, { text: "分类三", image: "https://via.placeholder.com/80" }))
};
var ReactNodeText = {
  args: {
    text: /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "blue" } }, "自定义文本"),
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "vertical-icon"
  }
};
var VariantVerticalImage = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "分类一",
      image: "https://via.placeholder.com/80",
      variant: "vertical-image"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "分类二",
      image: "https://via.placeholder.com/80",
      variant: "vertical-image",
      active: { value: true }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "分类三",
      image: "https://via.placeholder.com/80",
      variant: "vertical-image",
      disabled: { value: true }
    }
  ))
};
var VariantVerticalIcon = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "首页",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "商城",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ShoppingOutlined, null),
      variant: "vertical-icon",
      active: { value: true }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "我的",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.UserOutlined, null),
      variant: "vertical-icon"
    }
  ))
};
var VariantHorizontal = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical" }, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "商品分类",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.AppstoreOutlined, null),
      variant: "horizontal"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "热门推荐",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.AppstoreOutlined, null),
      variant: "horizontal",
      active: { value: true }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "限时特惠",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.GiftOutlined, null),
      variant: "horizontal"
    }
  ))
};
var VariantCard = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "会员中心",
      image: "https://via.placeholder.com/120",
      variant: "card"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "VIP 专区",
      image: "https://via.placeholder.com/120",
      variant: "card",
      active: { value: true }
    }
  ))
};
var SizeSmall = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "小尺寸",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      size: "small"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "小尺寸 Active",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      size: "small",
      active: { value: true }
    }
  ))
};
var SizeDefault = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "默认尺寸",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      size: "default"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "默认尺寸 Active",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      size: "default",
      active: { value: true }
    }
  ))
};
var SizeLarge = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "大尺寸",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      size: "large"
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "大尺寸 Active",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      size: "large",
      active: { value: true }
    }
  ))
};
var StateActive = {
  render: () => {
    const [activeKey, setActiveKey] = (0, import_react.useState)("home");
    return /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
      import_GraphicTextCard.default,
      {
        text: "首页",
        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
        variant: "vertical-icon",
        active: { value: activeKey === "home" },
        onClick: () => setActiveKey("home")
      }
    ), /* @__PURE__ */ import_react.default.createElement(
      import_GraphicTextCard.default,
      {
        text: "商城",
        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ShoppingOutlined, null),
        variant: "vertical-icon",
        active: { value: activeKey === "shop" },
        onClick: () => setActiveKey("shop")
      }
    ), /* @__PURE__ */ import_react.default.createElement(
      import_GraphicTextCard.default,
      {
        text: "我的",
        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.UserOutlined, null),
        variant: "vertical-icon",
        active: { value: activeKey === "user" },
        onClick: () => setActiveKey("user")
      }
    ));
  }
};
var StateDisabled = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "禁用状态",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      disabled: { value: true }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "正常状态",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon"
    }
  ))
};
var StateLoading = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "加载中",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      loading: {
        value: true,
        extra: /* @__PURE__ */ import_react.default.createElement(import_antd.Spin, { size: "small" })
      }
    }
  ))
};
var StatePriority = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical" }, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Loading > Disabled > Active",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      active: { value: true, extra: /* @__PURE__ */ import_react.default.createElement("span", null, "Active") },
      disabled: { value: true, extra: /* @__PURE__ */ import_react.default.createElement("span", null, "Disabled") },
      loading: { value: true, extra: /* @__PURE__ */ import_react.default.createElement("span", null, "Loading") }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Disabled > Active",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      active: { value: true, extra: /* @__PURE__ */ import_react.default.createElement("span", null, "Active") },
      disabled: { value: true, extra: /* @__PURE__ */ import_react.default.createElement("span", null, "Disabled") }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Active",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      active: { value: true, extra: /* @__PURE__ */ import_react.default.createElement("span", null, "Active") }
    }
  ))
};
var GraphicImagePriority = {
  args: {
    text: "图片优先",
    image: "https://via.placeholder.com/100",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "vertical-image"
  }
};
var GraphicConfigSize = {
  args: {
    text: "自定义尺寸",
    image: "https://via.placeholder.com/100",
    variant: "vertical-image",
    graphicConfig: {
      width: 100,
      height: 100
    }
  }
};
var GraphicConfigIcon = {
  args: {
    text: "自定义图标",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "vertical-icon",
    graphicConfig: {
      iconSize: 32,
      iconColor: "#ff4d4f",
      background: "#fff1f0",
      borderRadius: 8
    }
  }
};
var GraphicSlot = {
  args: {
    text: "自定义图形",
    variant: "vertical-icon",
    graphicSlot: /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        style: {
          width: 64,
          height: 64,
          background: "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
          borderRadius: 8,
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
          color: "#fff",
          fontSize: 24
        }
      },
      "🎉"
    )
  }
};
var BadgeDot = {
  args: {
    text: "消息",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
    variant: "vertical-icon",
    badge: { type: "dot" }
  }
};
var BadgeNumber = {
  args: {
    text: "消息",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
    variant: "vertical-icon",
    badge: { type: "number", content: 99 }
  }
};
var BadgeText = {
  args: {
    text: "活动",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.GiftOutlined, null),
    variant: "vertical-icon",
    badge: { type: "text", content: "New" }
  }
};
var BadgePositions = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Top Right (默认)",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99 }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Top Left",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [-10, 0] }
    }
  )), /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Bottom Right",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [0, 10] }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Bottom Left",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [-10, 10] }
    }
  )))
};
var BadgeSizes = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Small Badge",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, size: "small" }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Default Badge",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, size: "default" }
    }
  ))
};
var BadgeShowZero = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Hide Zero",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 0, showZero: false }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Show Zero",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 0, showZero: true }
    }
  ))
};
var BadgeSizeAndOffset = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical", size: "large" }, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("h4", null, "角标大小（通过 size 属性控制）"), /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Small Badge",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, size: "small" }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Default Badge",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99 }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Large Badge",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, size: "default" }
    }
  ))), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("h4", null, "角标 offset 位置（通过 offset 控制位置）"), /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Offset [0, 0] (默认)",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [0, 0] }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Offset [5, 5]",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [5, 5] }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Offset [10, 10]",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [10, 10] }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Offset [-5, -5]",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: { type: "number", content: 99, offset: [-5, -5] }
    }
  ))), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("h4", null, "角标 offset 和大小组合"), /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Small + Offset",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: {
        type: "number",
        content: 99,
        size: "small",
        offset: [5, 5]
      }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "Default + Offset",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null),
      variant: "vertical-icon",
      badge: {
        type: "number",
        content: 99,
        size: "default",
        offset: [10, 10]
      }
    }
  ))))
};
var PrefixSlot = {
  args: {
    text: "前置插槽",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "horizontal",
    prefixSlot: /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        style: {
          width: 4,
          height: 40,
          background: "#1890ff",
          borderRadius: 2
        }
      }
    )
  }
};
var SuffixSlot = {
  args: {
    text: "后置插槽",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "horizontal",
    suffixSlot: /* @__PURE__ */ import_react.default.createElement(import_icons.RightOutlined, { style: { color: "#999" } })
  }
};
var TextConfig = {
  args: {
    text: "自定义文本",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "vertical-icon",
    textConfig: {
      fontSize: 18,
      fontWeight: "bold",
      color: "#1890ff"
    }
  }
};
var TextEllipsis = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical" }, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "这是一段很长很长很长很长很长很长的文本内容这是一段很长很长很长很长很长很长的文本内容这是一段很长很长很长很长很长很长的文本内容",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "horizontal",
      textConfig: { maxLines: 1, ellipsis: true },
      style: { width: 200 }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "这是一段很长很长很长很长很长很长的文本内容这是一段很长很长很长很长很长很长的文本内容，会显示两行然后省略这是一段很长很长很长很长很长很长的文本内容，会显示两行然后省略这是一段很长很长很长很长很长很长的文本内容，会显示两行然后省略，会显示两行然后省略",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "horizontal",
      textConfig: { maxLines: 2, ellipsis: true },
      style: { width: 200 }
    }
  ))
};
var TextAlign = {
  render: () => /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "左对齐",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      textConfig: { textAlign: "left" }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "居中对齐",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      textConfig: { textAlign: "center" }
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "右对齐",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "vertical-icon",
      textConfig: { textAlign: "right" }
    }
  ))
};
var WidthModeAuto = {
  args: {
    text: "自动宽度",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "horizontal",
    widthMode: "auto",
    maxWidth: 300
  }
};
var WidthModeFixed = {
  args: {
    text: "固定宽度",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "horizontal",
    widthMode: "fixed",
    width: 200
  }
};
var WidthModeFull = {
  render: () => /* @__PURE__ */ import_react.default.createElement("div", { style: { width: "100%", border: "1px dashed #ccc", padding: 16 } }, /* @__PURE__ */ import_react.default.createElement(
    import_GraphicTextCard.default,
    {
      text: "撑满容器",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
      variant: "horizontal",
      widthMode: "full"
    }
  ))
};
var ClickInteraction = {
  render: () => {
    const [clicked, setClicked] = (0, import_react.useState)(false);
    return /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical" }, /* @__PURE__ */ import_react.default.createElement(
      import_GraphicTextCard.default,
      {
        text: "点击我",
        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
        variant: "vertical-icon",
        onClick: () => setClicked(true)
      }
    ), clicked && /* @__PURE__ */ import_react.default.createElement("div", null, "已点击！"));
  }
};
var NotClickable = {
  args: {
    text: "不可点击",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "vertical-icon",
    clickable: false
  }
};
var NavigationMenu = {
  render: () => {
    const [activeKey, setActiveKey] = (0, import_react.useState)("home");
    const menuItems = [
      { key: "home", icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null), text: "首页" },
      { key: "shop", icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ShoppingOutlined, null), text: "商城" },
      { key: "message", icon: /* @__PURE__ */ import_react.default.createElement(import_icons.MessageOutlined, null), text: "消息", badge: 5 },
      { key: "user", icon: /* @__PURE__ */ import_react.default.createElement(import_icons.UserOutlined, null), text: "我的" }
    ];
    return /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, menuItems.map((item) => /* @__PURE__ */ import_react.default.createElement(
      import_GraphicTextCard.default,
      {
        key: item.key,
        text: item.text,
        icon: item.icon,
        variant: "vertical-icon",
        active: { value: activeKey === item.key },
        badge: item.badge ? { type: "number", content: item.badge } : void 0,
        onClick: () => setActiveKey(item.key)
      }
    )));
  }
};
var ProductCategories = {
  render: () => {
    const categories = [
      { id: 1, name: "电子产品", image: "https://via.placeholder.com/80" },
      {
        id: 2,
        name: "服装鞋包",
        image: "https://via.placeholder.com/80",
        hot: true
      },
      { id: 3, name: "美妆护肤", image: "https://via.placeholder.com/80" },
      {
        id: 4,
        name: "食品生鲜",
        image: "https://via.placeholder.com/80",
        badge: "New"
      }
    ];
    return /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { wrap: true }, categories.map((category) => /* @__PURE__ */ import_react.default.createElement(
      import_GraphicTextCard.default,
      {
        key: category.id,
        text: category.name,
        image: category.image,
        variant: "vertical-image",
        badge: category.hot ? { type: "text", content: "Hot", color: "#ff4d4f" } : category.badge ? { type: "text", content: category.badge, color: "#52c41a" } : void 0,
        onClick: () => console.log("点击分类:", category.name)
      }
    )));
  }
};
var CompleteExample = {
  args: {
    text: "完整示例",
    icon: /* @__PURE__ */ import_react.default.createElement(import_icons.HomeOutlined, null),
    variant: "vertical-icon",
    size: "large",
    badge: { type: "number", content: 99, size: "small", offset: [5, 5] },
    textConfig: {
      fontSize: 16,
      fontWeight: "bold",
      color: "#1890ff"
    },
    active: { value: true },
    onClick: () => console.log("clicked")
  }
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  BadgeDot,
  BadgeNumber,
  BadgePositions,
  BadgeShowZero,
  BadgeSizeAndOffset,
  BadgeSizes,
  BadgeText,
  ClickInteraction,
  CompleteExample,
  Default,
  GraphicConfigIcon,
  GraphicConfigSize,
  GraphicImagePriority,
  GraphicSlot,
  MultipleCards,
  NavigationMenu,
  NotClickable,
  PrefixSlot,
  ProductCategories,
  ReactNodeText,
  SizeDefault,
  SizeLarge,
  SizeSmall,
  StateActive,
  StateDisabled,
  StateLoading,
  StatePriority,
  SuffixSlot,
  TextAlign,
  TextConfig,
  TextEllipsis,
  VariantCard,
  VariantHorizontal,
  VariantVerticalIcon,
  VariantVerticalImage,
  WidthModeAuto,
  WidthModeFixed,
  WidthModeFull
});
