@akinon/ui-card 0.0.6 → 0.2.0

package/dist/cjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,MAAM,CAAC;AAEtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC;AAErC,eAAO,MAAM,IAAI,mCAAoC,SAAS,sBAE7D,CAAC;AAEF,eAAO,MAAM,QAAQ,gDAAe,CAAC;AAErC,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,aAAa,EAAE,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,QAAQ,UAAW,aAAa,sBAmE5C,CAAC"}

package/dist/cjs/index.js

@@ -0,0 +1,67 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavCards = exports.CardMeta = exports.Card = void 0;
+const icons_1 = require("@akinon/icons");
+const ui_theme_1 = require("@akinon/ui-theme");
+const ui_typography_1 = require("@akinon/ui-typography");
+const antd_1 = require("antd");
+const React = require("react");
+const Card = (_a) => {
+    var { children } = _a, restCardProps = __rest(_a, ["children"]);
+    return React.createElement(antd_1.Card, Object.assign({}, restCardProps), children);
+};
+exports.Card = Card;
+exports.CardMeta = antd_1.Card.Meta;
+const NavCards = (props) => {
+    return (React.createElement(antd_1.ConfigProvider, { theme: {
+            token: {
+                colorTextBase: ui_theme_1.theme.colors.neutral['950'],
+                colorText: ui_theme_1.theme.colors.neutral['950'],
+                fontSizeHeading4: ui_theme_1.fontSize * 1.125
+            },
+            components: {
+                Card: {
+                    colorBgContainer: ui_theme_1.theme.colors.neutral['100']
+                },
+                Typography: {
+                    titleMarginBottom: 0,
+                    // TODO: this is not working for all titles, https://github.com/ant-design/ant-design/issues/46243
+                    // titleMarginTop: 0,
+                    fontWeightStrong: 500
+                }
+            }
+        } },
+        React.createElement("div", { style: { overflow: 'hidden' } },
+            React.createElement(antd_1.Row, { gutter: [16, 16], style: { padding: '1.5rem 2rem' } }, props.items.map(({ title, text, iconColor, icon, onClick }, i) => (React.createElement(antd_1.Col, { key: i, span: 8 },
+                React.createElement(antd_1.Card, { bordered: false, onClick: onClick, bodyStyle: {
+                        padding: 0,
+                        height: '127px',
+                        overflow: 'hidden',
+                        borderRadius: '0.5rem',
+                        cursor: 'pointer'
+                    } },
+                    React.createElement(antd_1.Flex, { justify: "space-between" },
+                        React.createElement("div", { style: {
+                                background: iconColor,
+                                fontSize: ui_theme_1.fontSize * 2.5,
+                                width: '80px',
+                                padding: '2rem 1.25rem',
+                                color: ui_theme_1.theme.colors.neutral['100']
+                            } },
+                            React.createElement(icons_1.Icon, { icon: icon })),
+                        React.createElement(antd_1.Flex, { vertical: true, justify: "flex-start", style: { padding: '1.25rem' } },
+                            React.createElement(ui_typography_1.Title, { level: 4, style: { marginBlockStart: 0 } }, title),
+                            React.createElement(ui_typography_1.Text, null, text)))))))))));
+};
+exports.NavCards = NavCards;

package/dist/esm/index.d.ts

@@ -0,0 +1,17 @@
+import type { CardProps as AntCardProps } from 'antd';
+import * as React from 'react';
+export type CardProps = AntCardProps;
+export declare const Card: ({ children, ...restCardProps }: CardProps) => React.JSX.Element;
+export declare const CardMeta: React.FC<import("antd/es/card").CardMetaProps>;
+export type SingleNavCard = {
+    title: string;
+    text: string;
+    icon: string;
+    iconColor: string;
+    onClick?: () => void;
+};
+export type NavCardsProps = {
+    items: SingleNavCard[];
+};
+export declare const NavCards: (props: NavCardsProps) => React.JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,MAAM,CAAC;AAEtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC;AAErC,eAAO,MAAM,IAAI,mCAAoC,SAAS,sBAE7D,CAAC;AAEF,eAAO,MAAM,QAAQ,gDAAe,CAAC;AAErC,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,aAAa,EAAE,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,QAAQ,UAAW,aAAa,sBAmE5C,CAAC"}

package/dist/esm/index.js

@@ -0,0 +1,62 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { Icon } from '@akinon/icons';
+import { fontSize, theme } from '@akinon/ui-theme';
+import { Text, Title } from '@akinon/ui-typography';
+import { Card as AntCard, Col, ConfigProvider, Flex, Row } from 'antd';
+import * as React from 'react';
+export const Card = (_a) => {
+    var { children } = _a, restCardProps = __rest(_a, ["children"]);
+    return React.createElement(AntCard, Object.assign({}, restCardProps), children);
+};
+export const CardMeta = AntCard.Meta;
+export const NavCards = (props) => {
+    return (React.createElement(ConfigProvider, { theme: {
+            token: {
+                colorTextBase: theme.colors.neutral['950'],
+                colorText: theme.colors.neutral['950'],
+                fontSizeHeading4: fontSize * 1.125
+            },
+            components: {
+                Card: {
+                    colorBgContainer: theme.colors.neutral['100']
+                },
+                Typography: {
+                    titleMarginBottom: 0,
+                    // TODO: this is not working for all titles, https://github.com/ant-design/ant-design/issues/46243
+                    // titleMarginTop: 0,
+                    fontWeightStrong: 500
+                }
+            }
+        } },
+        React.createElement("div", { style: { overflow: 'hidden' } },
+            React.createElement(Row, { gutter: [16, 16], style: { padding: '1.5rem 2rem' } }, props.items.map(({ title, text, iconColor, icon, onClick }, i) => (React.createElement(Col, { key: i, span: 8 },
+                React.createElement(AntCard, { bordered: false, onClick: onClick, bodyStyle: {
+                        padding: 0,
+                        height: '127px',
+                        overflow: 'hidden',
+                        borderRadius: '0.5rem',
+                        cursor: 'pointer'
+                    } },
+                    React.createElement(Flex, { justify: "space-between" },
+                        React.createElement("div", { style: {
+                                background: iconColor,
+                                fontSize: fontSize * 2.5,
+                                width: '80px',
+                                padding: '2rem 1.25rem',
+                                color: theme.colors.neutral['100']
+                            } },
+                            React.createElement(Icon, { icon: icon })),
+                        React.createElement(Flex, { vertical: true, justify: "flex-start", style: { padding: '1.25rem' } },
+                            React.createElement(Title, { level: 4, style: { marginBlockStart: 0 } }, title),
+                            React.createElement(Text, null, text)))))))))));
+};

package/package.json

@@ -1,41 +1,48 @@
 {
   "name": "@akinon/ui-card",
-  "version": "0.0.6",
+  "version": "0.2.0",
   "private": false,
   "type": "module",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
+  "main": "dist/esm/index.js",
+  "module": "dist/esm/index.js",
   "files": [
     "dist"
   ],
   "dependencies": {
     "antd": "5.11.0",
-    "@akinon/icons": "0.1.1",
-    "@akinon/ui-theme": "0.2.0",
-    "@akinon/ui-typography": "0.0.2"
+    "@akinon/icons": "0.3.0",
+    "@akinon/ui-typography": "0.2.0",
+    "@akinon/ui-theme": "0.4.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0",
-    "@akinon/vite-config": "^0.1.1",
+    "copyfiles": "^2.4.1",
+    "rimraf": "^5.0.5",
+    "typescript": "^5.2.2",
+    "@akinon/vite-config": "0.3.0",
     "@akinon/eslint-config": "0.1.0",
-    "@akinon/typescript-config": "0.0.0"
+    "@akinon/typescript-config": "0.1.0"
   },
   "peerDependencies": {
     "react": ">=18",
     "react-dom": ">=18"
   },
   "clean-package": "../../../clean-package.config.json",
-  "types": "dist/index.d.ts",
+  "types": "dist/esm/index.d.ts",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
+      "types": "./dist/esm/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
     },
     "./package.json": "./package.json"
   },
   "scripts": {
-    "build": "vite build",
+    "build": "pnpm run build:esm && pnpm run build:commonjs && pnpm run copy:files",
+    "build:esm": "tsc --outDir dist/esm",
+    "build:commonjs": "tsc --module commonjs --outDir dist/cjs",
+    "copy:files": "copyfiles -u 1 src/**/*.css dist/esm && copyfiles -u 1 src/**/*.css dist/cjs",
+    "clean": "rimraf dist/",
     "lint": "eslint *.ts*",
     "test": "vitest run",
     "test:ui": "vitest --ui",