1

video-gen-admin/node_modules/antd/es/button/style/index.js

@@ -0,0 +1,211 @@
+import { unit } from '@ant-design/cssinjs';
+import { genFocusStyle, resetIcon } from '../../style';
+import { genNoMotionStyle } from '../../style/motion';
+import { genStyleHooks, mergeToken } from '../../theme/internal';
+import genGroupStyle from './group';
+import { prepareComponentToken, prepareToken } from './token';
+import genVariantStyle from './variant';
+// ============================== Shared ==============================
+const genSharedButtonStyle = token => {
+  const {
+    componentCls,
+    iconCls,
+    fontWeight,
+    opacityLoading,
+    motionDurationSlow,
+    motionEaseInOut,
+    iconGap,
+    calc
+  } = token;
+  return {
+    [componentCls]: {
+      outline: 'none',
+      position: 'relative',
+      display: 'inline-flex',
+      gap: iconGap,
+      alignItems: 'center',
+      justifyContent: 'center',
+      fontWeight,
+      whiteSpace: 'nowrap',
+      textAlign: 'center',
+      backgroundImage: 'none',
+      cursor: 'pointer',
+      transition: `all ${token.motionDurationMid} ${token.motionEaseInOut}`,
+      userSelect: 'none',
+      touchAction: 'manipulation',
+      ...genNoMotionStyle(),
+      '&:disabled > *': {
+        pointerEvents: 'none'
+      },
+      // https://github.com/ant-design/ant-design/issues/51380
+      [`${componentCls}-icon > svg`]: resetIcon(),
+      '> a': {
+        color: 'currentColor'
+      },
+      '&:not(:disabled)': genFocusStyle(token),
+      [`&${componentCls}-two-chinese-chars::first-letter`]: {
+        letterSpacing: '0.34em'
+      },
+      [`&${componentCls}-two-chinese-chars > *:not(${iconCls})`]: {
+        marginInlineEnd: '-0.34em',
+        letterSpacing: '0.34em'
+      },
+      [`&${componentCls}-icon-only`]: {
+        paddingInline: 0,
+        // make `btn-icon-only` not too narrow
+        [`&${componentCls}-compact-item`]: {
+          flex: 'none'
+        }
+      },
+      // Loading
+      [`&${componentCls}-loading`]: {
+        opacity: opacityLoading,
+        cursor: 'default'
+      },
+      [`${componentCls}-loading-icon`]: {
+        transition: ['width', 'opacity', 'margin'].map(prop => `${prop} ${motionDurationSlow} ${motionEaseInOut}`).join(',')
+      },
+      // iconPlacement
+      [`&:not(${componentCls}-icon-end)`]: {
+        [`${componentCls}-loading-icon-motion`]: {
+          '&-appear-start, &-enter-start': {
+            marginInlineEnd: calc(iconGap).mul(-1).equal()
+          },
+          '&-appear-active, &-enter-active': {
+            marginInlineEnd: 0
+          },
+          '&-leave-start': {
+            marginInlineEnd: 0
+          },
+          '&-leave-active': {
+            marginInlineEnd: calc(iconGap).mul(-1).equal()
+          }
+        }
+      },
+      '&-icon-end': {
+        flexDirection: 'row-reverse',
+        [`${componentCls}-loading-icon-motion`]: {
+          '&-appear-start, &-enter-start': {
+            marginInlineStart: calc(iconGap).mul(-1).equal()
+          },
+          '&-appear-active, &-enter-active': {
+            marginInlineStart: 0
+          },
+          '&-leave-start': {
+            marginInlineStart: 0
+          },
+          '&-leave-active': {
+            marginInlineStart: calc(iconGap).mul(-1).equal()
+          }
+        }
+      }
+    }
+  };
+};
+// ============================== Shape ===============================
+const genCircleButtonStyle = token => ({
+  minWidth: token.controlHeight,
+  paddingInline: 0,
+  borderRadius: '50%'
+});
+// =============================== Size ===============================
+const genButtonStyle = (token, prefixCls = '') => {
+  const {
+    componentCls,
+    controlHeight,
+    fontSize,
+    borderRadius,
+    buttonPaddingHorizontal,
+    iconCls,
+    buttonPaddingVertical,
+    buttonIconOnlyFontSize
+  } = token;
+  return [{
+    [prefixCls]: {
+      fontSize,
+      height: controlHeight,
+      padding: `${unit(buttonPaddingVertical)} ${unit(buttonPaddingHorizontal)}`,
+      borderRadius,
+      [`&${componentCls}-icon-only`]: {
+        width: controlHeight,
+        [iconCls]: {
+          fontSize: buttonIconOnlyFontSize
+        }
+      }
+    }
+  },
+  // Shape - patch prefixCls again to override solid border radius style
+  {
+    [`${componentCls}${componentCls}-circle${prefixCls}`]: genCircleButtonStyle(token)
+  }, {
+    [`${componentCls}${componentCls}-round${prefixCls}`]: {
+      borderRadius: token.controlHeight,
+      [`&:not(${componentCls}-icon-only)`]: {
+        paddingInline: token.buttonPaddingHorizontal
+      }
+    }
+  }];
+};
+const genSizeBaseButtonStyle = token => {
+  const baseToken = mergeToken(token, {
+    fontSize: token.contentFontSize
+  });
+  return genButtonStyle(baseToken, token.componentCls);
+};
+const genSizeSmallButtonStyle = token => {
+  const smallToken = mergeToken(token, {
+    controlHeight: token.controlHeightSM,
+    fontSize: token.contentFontSizeSM,
+    padding: token.paddingXS,
+    buttonPaddingHorizontal: token.paddingInlineSM,
+    buttonPaddingVertical: 0,
+    borderRadius: token.borderRadiusSM,
+    buttonIconOnlyFontSize: token.onlyIconSizeSM
+  });
+  return genButtonStyle(smallToken, `${token.componentCls}-sm`);
+};
+const genSizeLargeButtonStyle = token => {
+  const largeToken = mergeToken(token, {
+    controlHeight: token.controlHeightLG,
+    fontSize: token.contentFontSizeLG,
+    buttonPaddingHorizontal: token.paddingInlineLG,
+    buttonPaddingVertical: 0,
+    borderRadius: token.borderRadiusLG,
+    buttonIconOnlyFontSize: token.onlyIconSizeLG
+  });
+  return genButtonStyle(largeToken, `${token.componentCls}-lg`);
+};
+const genBlockButtonStyle = token => {
+  const {
+    componentCls
+  } = token;
+  return {
+    [componentCls]: {
+      [`&${componentCls}-block`]: {
+        width: '100%'
+      }
+    }
+  };
+};
+// ============================== Export ==============================
+export default genStyleHooks('Button', token => {
+  const buttonToken = prepareToken(token);
+  return [
+  // Shared
+  genSharedButtonStyle(buttonToken),
+  // Size
+  genSizeBaseButtonStyle(buttonToken), genSizeSmallButtonStyle(buttonToken), genSizeLargeButtonStyle(buttonToken),
+  // Block
+  genBlockButtonStyle(buttonToken),
+  // Variant
+  genVariantStyle(buttonToken),
+  // Button Group
+  genGroupStyle(buttonToken)];
+}, prepareComponentToken, {
+  unitless: {
+    fontWeight: true,
+    contentLineHeight: true,
+    contentLineHeightSM: true,
+    contentLineHeightLG: true
+  }
+});