@pisell/materials 6.7.3 → 6.7.4

package/es/components/PisellBasicGrid/PisellBasicGrid.less

@@ -1,20 +0,0 @@
-/**
- * PisellBasicGrid 组件样式
- * @description 仅包含基础布局样式，不包含任何 UI 样式
- */
-
-@prefix: pisell-basic-grid;
-
-.@{prefix} {
-  display: flex;
-  box-sizing: border-box;
-
-  /**
-   * 子元素样式
-   * @description 确保子元素的 box-sizing 一致
-   */
-  &-item {
-    box-sizing: border-box;
-  }
-}
-

package/es/components/PisellBasicGrid/hooks/index.js

@@ -1 +0,0 @@
-export { useGridStyle, default } from "./useGridStyle";

package/es/components/PisellBasicGrid/hooks/useGridStyle.js

@@ -1,114 +0,0 @@
-import { useMemo } from 'react';
-import { normalizeGap, calculateFlexBasis, DIRECTION_MAP, WRAP_MAP, JUSTIFY_MAP, ALIGN_MAP, ALIGN_CONTENT_MAP } from "../utils";
-
-/**
- * useGridStyle Hook 参数
- */
-
-/**
- * 计算 Grid 布局样式的 Hook
- * @param params - 布局参数
- * @returns 容器样式和子元素样式
- * @description
- * - 根据传入的布局参数计算容器的 flex 样式
- * - 根据 columns 和 gap 计算子元素的 flex-basis
- * - 使用 useMemo 缓存计算结果，避免不必要的重复计算
- */
-export var useGridStyle = function useGridStyle(params) {
-  var _params$direction = params.direction,
-    direction = _params$direction === void 0 ? 'horizontal' : _params$direction,
-    _params$wrap = params.wrap,
-    wrap = _params$wrap === void 0 ? 'nowrap' : _params$wrap,
-    columns = params.columns,
-    _params$equalWidth = params.equalWidth,
-    equalWidth = _params$equalWidth === void 0 ? false : _params$equalWidth,
-    gap = params.gap,
-    rowGap = params.rowGap,
-    columnGap = params.columnGap,
-    _params$justify = params.justify,
-    justify = _params$justify === void 0 ? 'start' : _params$justify,
-    _params$align = params.align,
-    align = _params$align === void 0 ? 'stretch' : _params$align,
-    _params$alignContent = params.alignContent,
-    alignContent = _params$alignContent === void 0 ? 'stretch' : _params$alignContent;
-
-  /**
-   * 计算容器样式
-   */
-  var containerStyle = useMemo(function () {
-    var style = {
-      display: 'flex',
-      flexDirection: DIRECTION_MAP[direction],
-      flexWrap: WRAP_MAP[wrap],
-      justifyContent: JUSTIFY_MAP[justify],
-      alignItems: ALIGN_MAP[align]
-    };
-
-    // 多行对齐（仅在 wrap 不为 nowrap 时有效）
-    if (wrap !== 'nowrap') {
-      style.alignContent = ALIGN_CONTENT_MAP[alignContent];
-    }
-
-    // 间距处理：rowGap/columnGap 优先级高于 gap
-    var normalizedGap = normalizeGap(gap);
-    var normalizedRowGap = normalizeGap(rowGap);
-    var normalizedColumnGap = normalizeGap(columnGap);
-    if (normalizedRowGap || normalizedColumnGap) {
-      // 单独设置行列间距
-      if (normalizedRowGap) {
-        style.rowGap = normalizedRowGap;
-      }
-      if (normalizedColumnGap) {
-        style.columnGap = normalizedColumnGap;
-      }
-      // 如果只设置了其中一个，另一个使用 gap 的值
-      if (normalizedGap) {
-        if (!normalizedRowGap) {
-          style.rowGap = normalizedGap;
-        }
-        if (!normalizedColumnGap) {
-          style.columnGap = normalizedGap;
-        }
-      }
-    } else if (normalizedGap) {
-      // 统一设置间距
-      style.gap = normalizedGap;
-    }
-    return style;
-  }, [direction, wrap, justify, align, alignContent, gap, rowGap, columnGap]);
-
-  /**
-   * 计算子元素样式
-   */
-  var itemStyle = useMemo(function () {
-    var style = {
-      alignItems: 'stretch'
-    };
-
-    // 优先级：columns > equalWidth
-    if (columns !== undefined && columns > 0) {
-      // 使用 columns 时，计算 flex-basis，考虑 gap 影响
-      // 优先使用 columnGap，其次使用 gap
-      var effectiveGap = columnGap !== null && columnGap !== void 0 ? columnGap : gap;
-      style.flexBasis = calculateFlexBasis(columns, effectiveGap);
-      style.flexGrow = 0;
-      style.flexShrink = 0;
-    } else if (equalWidth) {
-      // 等分模式
-      style.flexGrow = 1;
-      style.flexShrink = 1;
-      style.flexBasis = 0;
-    } else {
-      // 默认：自适应内容宽度
-      style.flexGrow = 0;
-      style.flexShrink = 0;
-      style.flexBasis = 'auto';
-    }
-    return style;
-  }, [columns, equalWidth, gap, columnGap]);
-  return {
-    containerStyle: containerStyle,
-    itemStyle: itemStyle
-  };
-};
-export default useGridStyle;

package/es/components/PisellBasicGrid/index.js

@@ -1,6 +0,0 @@
-/**
- * PisellBasicGrid 组件导出
- * @description 基于 Flexbox 的基础布局组件
- */
-
-export { PisellBasicGrid, default } from "./PisellBasicGrid";

package/es/components/PisellBasicGrid/types.js

@@ -1 +0,0 @@
-export {};

package/es/components/PisellBasicGrid/utils/index.js

@@ -1,126 +0,0 @@
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-/**
- * 将间距值转换为 CSS 值
- * @param value - 间距值，可以是数字或字符串
- * @returns CSS 间距值字符串
- * @example
- * normalizeGap(16) // '16px'
- * normalizeGap('1rem') // '1rem'
- * normalizeGap(undefined) // undefined
- */
-export var normalizeGap = function normalizeGap(value) {
-  if (value === undefined || value === null) {
-    return undefined;
-  }
-  if (typeof value === 'number') {
-    return "".concat(value, "px");
-  }
-  return value;
-};
-
-/**
- * 计算 flex-basis 值，考虑 gap 影响
- * @param columns - 一行显示的元素个数
- * @param gap - 间距值
- * @returns flex-basis CSS 值
- * @description 公式：calc((100% - gap * (N-1)) / N)
- * @example
- * calculateFlexBasis(4, 16) // 'calc((100% - 16px * 3) / 4)'
- * calculateFlexBasis(3, '1rem') // 'calc((100% - 1rem * 2) / 3)'
- */
-export var calculateFlexBasis = function calculateFlexBasis(columns, gap) {
-  var gapValue = normalizeGap(gap) || '0px';
-  var gapCount = columns - 1;
-  if (gapCount <= 0) {
-    return '100%';
-  }
-  return "calc((100% - ".concat(gapValue, " * ").concat(gapCount, ") / ").concat(columns, ")");
-};
-
-/**
- * 获取数据项的唯一 key
- * @param item - 数据项
- * @param index - 索引
- * @param rowKey - rowKey 配置
- * @returns 唯一 key 字符串
- * @example
- * getRowKey({ id: 1 }, 0, 'id') // '1'
- * getRowKey({ id: 1 }, 0, (item, index) => `item-${item.id}`) // 'item-1'
- * getRowKey({ id: 1 }, 0) // '0'
- */
-export var getRowKey = function getRowKey(item, index, rowKey) {
-  if (typeof rowKey === 'function') {
-    return rowKey(item, index);
-  }
-  if (typeof rowKey === 'string' && item && _typeof(item) === 'object') {
-    var key = item[rowKey];
-    if (key !== undefined && key !== null) {
-      return String(key);
-    }
-  }
-  return String(index);
-};
-
-/**
- * flex-direction 映射表
- * @description 将 direction 属性值映射为 CSS flex-direction 值
- */
-export var DIRECTION_MAP = {
-  horizontal: 'row',
-  'horizontal-reverse': 'row-reverse',
-  vertical: 'column',
-  'vertical-reverse': 'column-reverse'
-};
-
-/**
- * flex-wrap 映射表
- * @description 将 wrap 属性值映射为 CSS flex-wrap 值
- */
-export var WRAP_MAP = {
-  nowrap: 'nowrap',
-  wrap: 'wrap',
-  'wrap-reverse': 'wrap-reverse'
-};
-
-/**
- * justify-content 映射表
- * @description 将 justify 属性值映射为 CSS justify-content 值
- */
-export var JUSTIFY_MAP = {
-  start: 'flex-start',
-  end: 'flex-end',
-  center: 'center',
-  between: 'space-between',
-  around: 'space-around',
-  evenly: 'space-evenly'
-};
-
-/**
- * align-items 映射表
- * @description 将 align 属性值映射为 CSS align-items 值
- */
-export var ALIGN_MAP = {
-  start: 'flex-start',
-  end: 'flex-end',
-  center: 'center',
-  stretch: 'stretch',
-  baseline: 'baseline'
-};
-
-/**
- * align-content 映射表
- * @description 将 alignContent 属性值映射为 CSS align-content 值
- */
-export var ALIGN_CONTENT_MAP = {
-  start: 'flex-start',
-  end: 'flex-end',
-  center: 'center',
-  between: 'space-between',
-  around: 'space-around',
-  stretch: 'stretch'
-};
-
-/**
- * 组件样式前缀
- */
-export var COMPONENT_PREFIX = 'pisell-basic-grid';

package/es/components/PisellCards/PisellCards.js

@@ -1,10 +0,0 @@
-/**
- * PisellCards 命名空间容器
- * 用于收纳所有卡片组件
- * 注意：PisellCards 自身不作为组件直接使用
- */
-
-var PisellCards = function PisellCards() {
-  return null;
-};
-export default PisellCards;

package/es/components/PisellCards/PisellCards.less

@@ -1 +0,0 @@
-// 这里是组件的样式

package/es/components/PisellCards/components/GraphicTextCard/GraphicTextCard.js

@@ -1,171 +0,0 @@
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["text", "variant", "size", "image", "icon", "graphicConfig", "graphicSlot", "badge", "prefixSlot", "suffixSlot", "textConfig", "active", "disabled", "loading", "children", "render", "dataSource"];
-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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import React, { useMemo, useCallback, useEffect } from 'react';
-import { GraphicArea, TextContent, BadgeWrapper } from "./components";
-import { useGraphicTextCardStyle, useGraphicTextCardClick } from "./hooks";
-import { getDefaultGraphicSize } from "./utils";
-import "./GraphicTextCard.less";
-
-/**
- * GraphicTextCard 图文卡片组件
- * 结合图标/图片、文本和状态标识，专为标签页、分类导航等场景设计
- *
- * @component
- * @example
- * ```tsx
- * // 基础用法（样式一：垂直布局-图片）
- * <GraphicTextCard
- *   text="Tab title"
- *   image="https://example.com/image.png"
- *   variant="vertical-image"
- * />
- *
- * // 使用图标（样式二：垂直布局-图标）
- * <GraphicTextCard
- *   text="Tabs"
- *   icon={<SmileIcon />}
- *   variant="vertical-icon"
- * />
- *
- * // 横向布局（样式三）
- * <GraphicTextCard
- *   text="Tab title"
- *   image="https://example.com/image.png"
- *   variant="horizontal"
- * />
- *
- * // 卡片式（样式四）
- * <GraphicTextCard
- *   text="Tab title"
- *   image="https://example.com/image.png"
- *   variant="card"
- *   active={{ value: true }}
- * />
- *
- * // 带角标
- * <GraphicTextCard
- *   text="Tab title"
- *   icon={<SmileIcon />}
- *   badge={{ type: 'number', content: 99 }}
- * />
- * ```
- */
-var GraphicTextCard = function GraphicTextCard(props) {
-  var text = props.text,
-    _props$variant = props.variant,
-    variant = _props$variant === void 0 ? 'vertical-image' : _props$variant,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'default' : _props$size,
-    image = props.image,
-    icon = props.icon,
-    _props$graphicConfig = props.graphicConfig,
-    graphicConfig = _props$graphicConfig === void 0 ? {} : _props$graphicConfig,
-    graphicSlot = props.graphicSlot,
-    badge = props.badge,
-    prefixSlot = props.prefixSlot,
-    suffixSlot = props.suffixSlot,
-    textConfig = props.textConfig,
-    active = props.active,
-    disabled = props.disabled,
-    loading = props.loading,
-    children = props.children,
-    render = props.render,
-    dataSource = props.dataSource,
-    restProps = _objectWithoutProperties(props, _excluded);
-  // 使用自定义 Hook 处理样式和类名
-  var _useGraphicTextCardSt = useGraphicTextCardStyle(props),
-    mergedStyle = _useGraphicTextCardSt.mergedStyle,
-    mergedClassName = _useGraphicTextCardSt.mergedClassName;
-
-  // 使用自定义 Hook 处理点击事件
-  var handleClick = useGraphicTextCardClick(props);
-  useEffect(function () {
-    document.body.id = 'body';
-  }, []);
-  /**
-   * 计算图形区域尺寸
-   * 优先使用 graphicConfig 中的配置，否则使用默认值
-   */
-  var graphicSize = useMemo(function () {
-    var _graphicConfig$width, _graphicConfig$height;
-    var defaultSize = getDefaultGraphicSize(variant, size);
-    return {
-      width: (_graphicConfig$width = graphicConfig.width) !== null && _graphicConfig$width !== void 0 ? _graphicConfig$width : defaultSize.width,
-      height: (_graphicConfig$height = graphicConfig.height) !== null && _graphicConfig$height !== void 0 ? _graphicConfig$height : defaultSize.height
-    };
-  }, [variant, size, graphicConfig.width, graphicConfig.height]);
-  /**
-   * 渲染状态的 extra 内容
-   * 优先级：loading > disabled > active
-   */
-  var renderExtra = useCallback(function () {
-    if (loading !== null && loading !== void 0 && loading.value && loading !== null && loading !== void 0 && loading.extra) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: "graphic-text-card__extra"
-      }, loading.extra);
-    }
-    if (disabled !== null && disabled !== void 0 && disabled.value && disabled !== null && disabled !== void 0 && disabled.extra) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: "graphic-text-card__extra"
-      }, disabled.extra);
-    }
-    if (active !== null && active !== void 0 && active.value && active !== null && active !== void 0 && active.extra) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: "graphic-text-card__extra"
-      }, active.extra);
-    }
-    return null;
-  }, [active, disabled, loading]);
-  /**
-   * 渲染主内容
-   */
-  var renderContent = useCallback(function () {
-    // 如果提供了自定义渲染函数，使用自定义渲染
-    if (render) {
-      return render(props);
-    }
-    return /*#__PURE__*/React.createElement(React.Fragment, null, prefixSlot, graphicSlot || /*#__PURE__*/React.createElement(GraphicArea, {
-      image: image,
-      icon: icon,
-      config: _objectSpread(_objectSpread({}, graphicConfig), {}, {
-        width: graphicSize.width,
-        height: graphicSize.height
-      })
-    }), /*#__PURE__*/React.createElement(TextContent, {
-      text: text,
-      textConfig: textConfig,
-      active: active
-    }), suffixSlot);
-  }, [render, props, prefixSlot, graphicSlot, image, icon, graphicConfig, graphicSize, text, textConfig, suffixSlot, active]);
-  return /*#__PURE__*/React.createElement(BadgeWrapper, {
-    badge: badge
-  }, /*#__PURE__*/React.createElement("div", _extends({
-    onClick: handleClick,
-    "data-active": active === null || active === void 0 ? void 0 : active.value,
-    "data-disabled": disabled === null || disabled === void 0 ? void 0 : disabled.value,
-    "data-loading": loading === null || loading === void 0 ? void 0 : loading.value,
-    role: "button",
-    "aria-disabled": disabled === null || disabled === void 0 ? void 0 : disabled.value,
-    tabIndex: disabled !== null && disabled !== void 0 && disabled.value ? -1 : 0
-  }, restProps, {
-    className: mergedClassName,
-    style: mergedStyle
-  }), renderContent(), renderExtra(), children));
-};
-
-/**
- * Provider 包装器
- * 兼容 PisellCards 系统的 props 传递方式
- */
-var Provider = function Provider(props) {
-  return /*#__PURE__*/React.createElement(GraphicTextCard, _extends({}, props === null || props === void 0 ? void 0 : props.props, props));
-};
-export default Provider;