song-ui-u/es/hook/use-style/index.mjs

vue3 + js的PC前端组件库

import { types } from '../../utils/types.mjs';
import 'song-ui-pro-icon';

const useStyle = () => {
  const fontSize = (value) => {
    return value ? { "font-size": `${value}px` } : {};
  };
  const color = (value) => {
    return value ? { color: value } : {};
  };
  const width = (value) => {
    return value ? { width: value + "px" } : {};
  };
  const height = (value) => {
    return value ? { height: value + "px" } : {};
  };
  const bgColor = (value) => {
    return value ? { "background-color": value } : {};
  };
  const opacity = (value) => {
    return { opacity: value || 1 };
  };
  const align = (value) => {
    return value ? { "text-align": value } : {};
  };
  const borderColor = (value) => {
    return value ? { "border-color": value } : {};
  };
  const gap = (value) => {
    const isNumber = types().isNumber(value) && value;
    const isArray = types().isArray(value);
    let val = null;
    if (isArray) {
      if (value.length === 1) {
        val = value[0] + "px";
      }
      if (value.length === 2) {
        val = `${value[0]}px ${value[1]}px`;
      }
    }
    if (isNumber) {
      val = value + "px";
    }
    return val ? { gap: val } : {};
  };
  const alignItem = (value) => {
    return value ? { "align-items": value } : {};
  };
  const justifyItem = (value) => {
    return value ? { "justify-content": value } : {};
  };
  const flexOrder = (value) => {
    const isNumber = types().isNumber(value);
    return isNumber ? { order: value } : {};
  };
  return {
    fontSize,
    color,
    width,
    height,
    bgColor,
    opacity,
    align,
    gap,
    alignItem,
    justifyItem,
    flexOrder,
    borderColor
  };
};

export { useStyle };
//# sourceMappingURL=index.mjs.map