@lobehub/ui/es/CodeDiff/style.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/CodeDiff/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const prefix = 'lobe-code-diff';\nexport const compactActionsCls = `${prefix}-actions-compact`;\nexport const compactLangCls = `${prefix}-lang`;\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    actions: css`\n      opacity: 0;\n      transition: opacity 0.2s ${cssVar.motionEaseInOut};\n    `,\n    actionsCompact: cx(\n      compactActionsCls,\n      css`\n        position: absolute;\n        z-index: 2;\n        inset-block-start: 8px;\n        inset-inline-end: 8px;\n\n        opacity: 0;\n\n        transition: opacity 0.2s ${cssVar.motionEaseInOut};\n      `,\n    ),\n    additions: css`\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 12px;\n      color: ${cssVar.colorSuccess};\n    `,\n    body: css`\n      overflow: auto;\n\n      width: 100%;\n\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 13px;\n      line-height: 1.6;\n    `,\n    bodyCollapsed: css`\n      height: 0;\n      opacity: 0;\n    `,\n    bodyRoot: css`\n      overflow: hidden;\n      transition: opacity 0.25s ${cssVar.motionEaseOut};\n    `,\n    borderless: lobeStaticStylish.variantBorderlessWithoutHover,\n    deletions: css`\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 12px;\n      color: ${cssVar.colorError};\n    `,\n    filled: cx(\n      lobeStaticStylish.variantFilledWithoutHover,\n      css`\n        background: ${cssVar.colorFillQuaternary};\n      `,\n    ),\n    header: css`\n      cursor: pointer;\n\n      position: relative;\n\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      justify-content: space-between;\n\n      padding: 4px;\n\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 13px;\n      color: ${cssVar.colorTextSecondary};\n    `,\n    headerBorderless: css`\n      padding-inline: 0;\n    `,\n    headerFilled: css`\n      background: transparent;\n    `,\n    headerOutlined: css`\n      & + .${prefix}-body {\n        border-block-start: 1px solid ${cssVar.colorFillQuaternary};\n      }\n    `,\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\n    lang: cx(\n      compactLangCls,\n      lobeStaticStylish.blur,\n      css`\n        position: absolute;\n        z-index: 2;\n        inset-block-end: 8px;\n        inset-inline-end: 8px;\n\n        font-family: ${cssVar.fontFamilyCode};\n        color: ${cssVar.colorTextSecondary};\n\n        opacity: 0;\n        background: ${cssVar.colorFillQuaternary};\n\n        transition: opacity 0.1s;\n      `,\n    ),\n    root: cx(\n      prefix,\n      css`\n        position: relative;\n\n        overflow: hidden;\n\n        width: 100%;\n        border-radius: ${cssVar.borderRadius};\n\n        transition: background-color 100ms ${cssVar.motionEaseOut};\n\n        .language-title {\n          opacity: 0.5;\n          filter: grayscale(100%);\n          transition:\n            opacity,\n            grayscale 0.2s ${cssVar.motionEaseInOut};\n        }\n\n        .panel-actions {\n          opacity: 0;\n          transition: opacity 0.2s ${cssVar.motionEaseInOut};\n        }\n\n        &:hover {\n          .language-title {\n            opacity: 1;\n            filter: grayscale(0%);\n          }\n\n          .panel-actions {\n            opacity: 1;\n          }\n\n          .${compactActionsCls} {\n            opacity: 1;\n          }\n\n          .${compactLangCls} {\n            opacity: 1;\n          }\n        }\n      `,\n    ),\n    stats: css`\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    `,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    variant: 'filled',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n  },\n});\n\nexport const headerVariants = cva(styles.header, {\n  defaultVariants: {\n    variant: 'filled',\n  },\n\n  variants: {\n    variant: {\n      filled: cx(styles.headerFilled, styles.headerOutlined),\n      outlined: styles.headerOutlined,\n      borderless: styles.headerBorderless,\n    },\n  },\n});\n\nexport const bodyVariants = cva(styles.bodyRoot, {\n  defaultVariants: {\n    expand: true,\n  },\n  variants: {\n    expand: {\n      false: styles.bodyCollapsed,\n      true: null,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS;AACtB,MAAa,oBAAoB,GAAG,OAAO;AAC3C,MAAa,iBAAiB,GAAG,OAAO;AAExC,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;AAC5D,QAAO;EACL,SAAS,GAAG;;iCAEiB,OAAO,gBAAgB;;EAEpD,gBAAgB,GACd,mBACA,GAAG;;;;;;;;mCAQ0B,OAAO,gBAAgB;QAErD;EACD,WAAW,GAAG;qBACG,OAAO,eAAe;;eAE5B,OAAO,aAAa;;EAE/B,MAAM,GAAG;;;;;qBAKQ,OAAO,eAAe;;;;EAIvC,eAAe,GAAG;;;;EAIlB,UAAU,GAAG;;kCAEiB,OAAO,cAAc;;EAEnD,YAAYA,cAAkB;EAC9B,WAAW,GAAG;qBACG,OAAO,eAAe;;eAE5B,OAAO,WAAW;;EAE7B,QAAQ,GACNA,cAAkB,2BAClB,GAAG;sBACa,OAAO,oBAAoB;QAE5C;EACD,QAAQ,GAAG;;;;;;;;;;;;qBAYM,OAAO,eAAe;;eAE5B,OAAO,mBAAmB;;EAErC,kBAAkB,GAAG;;;EAGrB,cAAc,GAAG;;;EAGjB,gBAAgB,GAAG;aACV,OAAO;wCACoB,OAAO,oBAAoB;;;EAG/D,UAAUA,cAAkB;EAC5B,MAAM,GACJ,gBACAA,cAAkB,MAClB,GAAG;;;;;;uBAMc,OAAO,eAAe;iBAC5B,OAAO,mBAAmB;;;sBAGrB,OAAO,oBAAoB;;;QAI5C;EACD,MAAM,GACJ,QACA,GAAG;;;;;;yBAMgB,OAAO,aAAa;;6CAEA,OAAO,cAAc;;;;;;;6BAOrC,OAAO,gBAAgB;;;;;qCAKf,OAAO,gBAAgB;;;;;;;;;;;;;aAa/C,kBAAkB;;;;aAIlB,eAAe;;;;QAKvB;EACD,OAAO,GAAG;;;;;EAKX;EACD;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB,EACf,SAAS,UACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC;AAEF,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB,EACf,SAAS,UACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,GAAG,OAAO,cAAc,OAAO,eAAe;EACtD,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC;AAEF,MAAa,eAAe,IAAI,OAAO,UAAU;CAC/C,iBAAiB,EACf,QAAQ,MACT;CACD,UAAU,EACR,QAAQ;EACN,OAAO,OAAO;EACd,MAAM;EACP,EACF;CACF,CAAC"}