ant-design-x-vue-next/es/sources/style/index.mjs

Ant Design X for Vue — community continuation aligned with @ant-design/x

import "vue";
import "../../_util/cssinjs/StyleContext.mjs";
import "../../_util/cssinjs/theme/ThemeCache.mjs";
import "../../_util/warning.mjs";
import "../../_util/cssinjs/transformers/legacyLogicalProperties.mjs";
import { merge as b } from "../../_util/cssinjs-utils/util/statistic.mjs";
import { genStyleHooks as f } from "../../theme/genStyleUtils.mjs";
import "../../transition-collapse/index.mjs";
import { genTransitionCollapseStyle as $ } from "../../transition-collapse/style/index.mjs";
const y = (o) => {
  const {
    componentCls: i,
    paddingXS: e,
    fontSizeSM: l,
    marginXXS: t,
    marginXS: c,
    marginSM: g,
    colorTextSecondary: a,
    colorText: m,
    fontSize: d,
    colorLink: u,
    lineHeight: s,
    colorFillSecondary: p,
    controlHeightXS: n,
    paddingXXS: S,
    calc: r
  } = o;
  return {
    [i]: {
      [`${i}-title-wrapper`]: {
        width: "fit-content",
        display: "flex",
        flexDirection: "row",
        gap: e,
        alignItems: "center",
        fontSize: d,
        color: a,
        lineHeight: s,
        cursor: "pointer",
        marginBottom: g
      },
      [`${i}-title-down-icon`]: {
        fontSize: l,
        svg: {
          transition: `all ${o.motionDurationMid} ${o.motionEaseInOut}`
        }
      },
      [`${i}-icon-position-end`]: {
        [`${i}-title-down-icon`]: {
          order: 1
        }
      },
      [`${i}-list`]: {
        listStyle: "none",
        margin: 0,
        padding: 0,
        "ul, ol": {
          margin: 0,
          padding: 0,
          listStyle: "none"
        }
      },
      [`${i}-list-item`]: {
        marginBottom: c
      },
      [`${i}-link`]: {
        color: m,
        display: "flex",
        gap: t,
        "&:hover": {
          color: u
        }
      },
      [`&${i}-inline`]: {
        display: "inline-flex",
        [`${i}-title-wrapper`]: {
          background: p,
          borderRadius: r(n).div(2).equal(),
          height: n,
          lineHeight: `${n}px`,
          fontSize: r(l).sub(2).equal(),
          color: a,
          fontWeight: 400,
          paddingInline: r(S).add(2).equal(),
          paddingBlock: 0,
          marginInline: t,
          marginBlock: 0,
          marginBottom: 0
        }
      },
      [`${i}-carousel-title`]: {
        display: "flex",
        justifyContent: "space-between"
      },
      [`${i}-carousel-btn`]: {
        display: "inline-flex",
        cursor: "pointer",
        height: o.controlHeight,
        borderRadius: o.borderRadius,
        paddingInline: e,
        transition: `background ${o.motionDurationMid} ${o.motionEaseInOut}`,
        [`&:not(${i}-carousel-btn-disabled):hover`]: {
          background: p
        }
      },
      [`${i}-carousel-btn-disabled`]: {
        opacity: 0.4,
        cursor: "text"
      },
      [`${i}-carousel-item`]: {
        padding: e,
        boxSizing: "border-box",
        fontSize: d,
        lineHeight: s,
        cursor: "pointer",
        "&-title-wrapper": {
          gap: t,
          display: "flex"
        },
        "&-description": {
          opacity: 0.8,
          display: "-webkit-box",
          overflow: "hidden",
          WebkitBoxOrient: "vertical",
          WebkitLineClamp: 3,
          textOverflow: "ellipsis"
        }
      },
      [`&${i}-rtl`]: {
        direction: "rtl"
      }
    }
  };
}, x = () => ({}), H = f(
  "Sources",
  (o) => {
    const i = b(o, {});
    return [y(i), $(i)];
  },
  x
);
export {
  H as default,
  x as prepareComponentToken
};