@uiw/react-card - npm Package Compare versions

Comparing version 4.21.14 to 5.0.0-bate-0

cjs/index.d.ts

 import React from 'react';
 import { IProps, HTMLDivProps } from '@uiw/utils';
-import './style/index.less';
+export * from './style';
 export interface CardProps extends IProps, Omit<HTMLDivProps, 'title'> {
@@ -16,1 +16,2 @@ active?: boolean;
 export default _default;
+//# sourceMappingURL=index.d.ts.map

cjs/index.js

@@ -10,2 +10,3 @@ "use strict";
 });
+var _exportNames = {};
 exports["default"] = void 0;
@@ -19,2 +20,16 @@
 
+var _style = require("./style");
+
+Object.keys(_style).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _style[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _style[key];
+    }
+  });
+});
+
 var _jsxRuntime = require("react/jsx-runtime");
@@ -44,19 +59,23 @@
   }, [prefixCls, className, bordered, noHover]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, resetProps), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_style.CardStyleWarp, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, resetProps), {}, {
+    bordered: bordered,
+    active: active,
+    noHover: noHover,
+    prefix: prefixCls,
     className: cls,
     ref: ref,
-    children: [(title || extra) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: [(title || extra) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_style.CardStyleHead, {
       className: "".concat(prefixCls, "-head"),
-      children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_style.CardStyleHeadTitle, {
         className: "".concat(prefixCls, "-head-title"),
         children: title
-      }), extra && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      }), extra && /*#__PURE__*/(0, _jsxRuntime.jsx)(_style.CardStyleHeadExtra, {
         className: "".concat(prefixCls, "-extra"),
         children: extra
       })]
-    }), children && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    }), children && /*#__PURE__*/(0, _jsxRuntime.jsx)(_style.CardBody, {
       className: ["".concat(prefixCls, "-body"), bodyClassName].filter(Boolean).join(' ').trim(),
       style: bodyStyle,
       children: children
-    }), footer && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    }), footer && /*#__PURE__*/(0, _jsxRuntime.jsx)(_style.CardStyleFooter, {
       className: "".concat(prefixCls, "-footer"),
@@ -69,3 +88,2 @@ children: footer
 exports["default"] = _default;
-module.exports = exports.default;
 //# sourceMappingURL=index.js.map

esm/index.d.ts

 import React from 'react';
 import { IProps, HTMLDivProps } from '@uiw/utils';
-import './style/index.less';
+export * from './style';
 export interface CardProps extends IProps, Omit<HTMLDivProps, 'title'> {
@@ -16,1 +16,2 @@ active?: boolean;
 export default _default;
+//# sourceMappingURL=index.d.ts.map

esm/index.js

@@ -5,5 +5,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { useMemo } from 'react';
-import "./style/index.css";
+import { CardStyleWarp, CardStyleFooter, CardBody, CardStyleHead, CardStyleHeadTitle, CardStyleHeadExtra } from './style';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+export * from './style';
 export default /*#__PURE__*/React.forwardRef((props, ref) => {
@@ -26,19 +27,23 @@ var {
   var cls = useMemo(() => [prefixCls, className, bordered ? prefixCls + "-bordered" : null, noHover ? prefixCls + "-no-hover" : null, active ? 'active' : null].filter(Boolean).join(' ').trim(), [prefixCls, className, bordered, noHover]);
-  return /*#__PURE__*/_jsxs("div", _extends({}, resetProps, {
+  return /*#__PURE__*/_jsxs(CardStyleWarp, _extends({}, resetProps, {
+    bordered: bordered,
+    active: active,
+    noHover: noHover,
+    prefix: prefixCls,
     className: cls,
     ref: ref,
-    children: [(title || extra) && /*#__PURE__*/_jsxs("div", {
+    children: [(title || extra) && /*#__PURE__*/_jsxs(CardStyleHead, {
       className: prefixCls + "-head",
-      children: [title && /*#__PURE__*/_jsx("div", {
+      children: [title && /*#__PURE__*/_jsx(CardStyleHeadTitle, {
         className: prefixCls + "-head-title",
         children: title
-      }), extra && /*#__PURE__*/_jsx("div", {
+      }), extra && /*#__PURE__*/_jsx(CardStyleHeadExtra, {
         className: prefixCls + "-extra",
         children: extra
       })]
-    }), children && /*#__PURE__*/_jsx("div", {
+    }), children && /*#__PURE__*/_jsx(CardBody, {
       className: [prefixCls + "-body", bodyClassName].filter(Boolean).join(' ').trim(),
       style: bodyStyle,
       children: children
-    }), footer && /*#__PURE__*/_jsx("div", {
+    }), footer && /*#__PURE__*/_jsx(CardStyleFooter, {
       className: prefixCls + "-footer",
@@ -45,0 +50,0 @@ children: footer

package.json

 {
   "name": "@uiw/react-card",
-  "version": "4.21.14",
+  "version": "5.0.0-bate-0",
   "description": "Card component",
@@ -44,7 +44,11 @@ "author": "Kenny Wong <[e-mail]>",
     "react": ">=16.9.0",
-    "react-dom": ">=16.9.0"
+    "react-dom": ">=16.9.0",
+    "styled-components": ">=5.3.5"
   },
   "dependencies": {
-    "@uiw/utils": "^4.21.14"
+    "@uiw/utils": "^5.0.0-bate-0"
+  },
+  "devDependencies": {
+    "@types/styled-components": "~5.1.25"
   }
 }

README.md

@@ -20,10 +20,9 @@ Card 卡片
 
-<!--rehype:codeSandbox=true&codePen=true--> 
-```jsx
-import ReactDOM from 'react-dom';
+```jsx mdx:preview&codeSandbox=true&codePen=true
+import React from 'react';
 import { Card } from 'uiw';
 
-ReactDOM.render(
-  <div>
-    <Card title="Card标题" extra={<a href="#">更多</a>} style={{ width: 300 }}>
+function Demo () {
+  return <div>
+    <Card  title="Card标题" extra={<a href="#">更多</a>} style={{ width: 300 }}>
       卡片内容<br/>
@@ -33,5 +32,5 @@ 卡片内容<br/>
     </Card>
-  </div>,
-  _mount_
-);
+  </div>
+}
+export default Demo
 ```
@@ -43,15 +42,14 @@
 
-<!--rehype:codeSandbox=true&codePen=true--> 
-```jsx
-import ReactDOM from 'react-dom';
+```jsx mdx:preview&codeSandbox=true&codePen=true
+import React from 'react';
 import { Card } from 'uiw';
 
-ReactDOM.render(
-  <Card title="Card标题" bordered={false} style={{ width: 300 }}>
+function Demo() {
+  return   <Card title="Card标题" bordered={false} style={{ width: 300 }}>
     卡片内容<br/>
     卡片内容<br/>
     卡片内容<br/>
-  </Card>,
-  _mount_
-);
+  </Card>
+}
+export default Demo
 ```
@@ -63,15 +61,14 @@
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true--> 
-```jsx
-import ReactDOM from 'react-dom';
+```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true
+import React from 'react';
 import { Card } from 'uiw';
 
-ReactDOM.render(
-  <Card style={{ width: 300 }}>
+function Demo() {
+  return <Card style={{ width: 300 }}>
     卡片内容<br/>
     卡片内容<br/>
     卡片内容<br/>
-  </Card>,
-  _mount_
-);
+  </Card>
+}
+export default Demo
 ```
@@ -83,5 +80,4 @@
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true--> 
-```jsx
-import ReactDOM from 'react-dom';
+```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true
+import React from 'react';
 import { Card } from 'uiw';
@@ -91,4 +87,4 @@
 
-ReactDOM.render(
-  <Card style={{ width: 240 }} bodyStyle={{ padding: 10 }}>
+function Demo() {
+  return <Card style={{ width: 240 }} bodyStyle={{ padding: 10 }}>
     <div>
@@ -101,5 +97,5 @@ <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />
     </div>
-  </Card>,
-  _mount_
-);
+  </Card>
+}
+export default Demo
 ```
@@ -109,5 +105,4 @@
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true--> 
-```jsx
-import ReactDOM from 'react-dom';
+```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true
+import React from 'react';
 import { Card, Icon } from 'uiw';
@@ -122,4 +117,4 @@
 
-ReactDOM.render(
-  <Card
+function Demo() {
+  return <Card
     title="Card标题"
@@ -137,5 +132,5 @@ footer={footer}
     </div>
-  </Card>,
-  _mount_
-);
+  </Card>
+}
+export default Demo
 ```
@@ -147,5 +142,4 @@
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true--> 
-```jsx
-import ReactDOM from 'react-dom';
+```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true
+import React from 'react';
 import { Card, Icon } from 'uiw';
@@ -160,4 +154,4 @@
 
-ReactDOM.render(
-  <Card
+function Demo() {
+  return <Card
     active
@@ -176,5 +170,5 @@ title="Card标题"
     </div>
-  </Card>,
-  _mount_
-);
+  </Card>
+}
+export default Demo
 ```
@@ -181,0 +175,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

75578

increased by205.8%

Number of downloads

149

increased by8.76%

Number of package files

23

increased by64.29%

Lines of code

736

increased by148.65%

Worsened metrics

Dependency count

4

increased by33.33%

Dev dependency count

1

increased byInfinity%

Number of low quality alerts

1

increased byInfinity%

Number of lines in readme file

174

decreased by-3.33%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@emotion/is-prop-valid@1.2.2(transitive)

• + Added@emotion/memoize@0.8.1(transitive)

• + Added@emotion/unitless@0.8.1(transitive)

• + Added@types/stylis@4.2.5(transitive)

• + Added@uiw/utils@5.0.0-bate-9(transitive)

• + Addedcamelize@1.0.1(transitive)

• + Addedcss-color-keywords@1.0.0(transitive)

• + Addedcss-to-react-native@3.2.0(transitive)

• + Addedcsstype@3.1.3(transitive)

• + Addednanoid@3.3.8(transitive)

• + Addedpicocolors@1.1.1(transitive)

• + Addedpostcss@8.4.38(transitive)

• + Addedpostcss-value-parser@4.2.0(transitive)

• + Addedshallowequal@1.1.0(transitive)

• + Addedsource-map-js@1.2.1(transitive)

• + Addedstyled-components@6.1.13(transitive)

• + Addedstylis@4.3.2(transitive)

• + Addedtslib@2.6.2(transitive)

• - Removed@uiw/utils@4.22.3(transitive)

• Updated@uiw/utils@^5.0.0-bate-0