@aristobyte-ui/card 2.1.9 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@aristobyte-ui/card",
3
3
  "description": "AristoByteUI Card component: a versatile container for displaying content and UI elements.",
4
- "version": "2.1.9",
4
+ "version": "2.3.0",
5
5
  "license": "MIT",
6
6
  "private": false,
7
7
  "author": "AristoByte <info@aristobyte.com>",
@@ -34,7 +34,8 @@
34
34
  "ui-kit"
35
35
  ],
36
36
  "files": [
37
- "dist"
37
+ "es",
38
+ "lib"
38
39
  ],
39
40
  "publishConfig": {
40
41
  "access": "public"
@@ -46,7 +47,7 @@
46
47
  "react-dom": "^19.1.0"
47
48
  },
48
49
  "dependencies": {
49
- "@aristobyte-ui/label": "2.1.9",
50
- "@aristobyte-ui/utils": "2.1.9"
50
+ "@aristobyte-ui/label": "2.3.0",
51
+ "@aristobyte-ui/utils": "2.3.0"
51
52
  }
52
53
  }
@@ -1,61 +0,0 @@
1
- .card {
2
- align-self: stretch;
3
- align-items: flex-start;
4
- border-radius: 10px;
5
- border: 1px solid #314158; //@TODO: @COLOR
6
- background-color: rgba(29, 41, 61, 0.3); //@TODO: @COLOR
7
- display: flex;
8
- flex-direction: column;
9
- padding: 17px 17px 30px;
10
- transition: all 150ms ease-out;
11
- width: calc(100% - 2 * 17px);
12
-
13
- &__icon {
14
- align-items: center;
15
- display: flex;
16
- justify-content: center;
17
- }
18
-
19
- &__title {
20
- align-items: center;
21
- color: #e2e8f0; //@TODO: @COLOR
22
- display: flex;
23
- font-size: 20px;
24
- font-style: normal;
25
- font-weight: 500;
26
- line-height: 20px;
27
- gap: 12px;
28
-
29
- b {
30
- border: solid rgba(69, 85, 108, 0.5); // @TODO: @COLOR
31
- background-color: rgba(49, 65, 88, 0.4); // @TODO: @COLOR
32
- border-radius: 10px;
33
- color: $white;
34
- padding: 3px 6px;
35
- }
36
- }
37
-
38
- &__description {
39
- color: #90a1b9; //@TODO: @COLOR
40
- font-size: 16px;
41
- font-style: normal;
42
- font-weight: 400;
43
- line-height: 22px;
44
- margin: 14px 0 0;
45
-
46
- b {
47
- border: solid rgba(69, 85, 108, 0.5); // @TODO: @COLOR
48
- background-color: rgba(49, 65, 88, 0.4); // @TODO: @COLOR
49
- border-radius: 10px;
50
- color: $white;
51
- padding: 3px 6px;
52
- }
53
- }
54
-
55
- &__content {
56
- display: flex;
57
- flex-direction: column;
58
- margin: 24px 0 0;
59
- width: 100%;
60
- }
61
- }
@@ -1,16 +0,0 @@
1
- import * as React from "react";
2
- import { Label } from "@aristobyte-ui/label";
3
- export var Card = function (_a) {
4
- var title = _a.title, description = _a.description, label = _a.label, icon = _a.icon, children = _a.children, _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.style, style = _c === void 0 ? {} : _c;
5
- return (React.createElement("div", { className: "card ".concat(className), style: style },
6
- (title || icon || label) && (React.createElement("h3", { className: "card__title" },
7
- icon && (React.createElement("div", { className: "card__icon" }, icon.component({
8
- size: icon.size || 8,
9
- color: icon.color,
10
- colors: icon.colors,
11
- }))),
12
- title && React.createElement("span", { dangerouslySetInnerHTML: { __html: title } }),
13
- label && (React.createElement(Label, { text: label.text, backgroundColor: label.backgroundColor, borderColor: label.borderColor, color: label.color })))),
14
- description && (React.createElement("p", { className: "card__description", dangerouslySetInnerHTML: { __html: description } })),
15
- children && React.createElement("div", { className: "card__content" }, children)));
16
- };
@@ -1 +0,0 @@
1
- export * from "./Card";
@@ -1,61 +0,0 @@
1
- .card {
2
- align-self: stretch;
3
- align-items: flex-start;
4
- border-radius: 10px;
5
- border: 1px solid #314158; //@TODO: @COLOR
6
- background-color: rgba(29, 41, 61, 0.3); //@TODO: @COLOR
7
- display: flex;
8
- flex-direction: column;
9
- padding: 17px 17px 30px;
10
- transition: all 150ms ease-out;
11
- width: calc(100% - 2 * 17px);
12
-
13
- &__icon {
14
- align-items: center;
15
- display: flex;
16
- justify-content: center;
17
- }
18
-
19
- &__title {
20
- align-items: center;
21
- color: #e2e8f0; //@TODO: @COLOR
22
- display: flex;
23
- font-size: 20px;
24
- font-style: normal;
25
- font-weight: 500;
26
- line-height: 20px;
27
- gap: 12px;
28
-
29
- b {
30
- border: solid rgba(69, 85, 108, 0.5); // @TODO: @COLOR
31
- background-color: rgba(49, 65, 88, 0.4); // @TODO: @COLOR
32
- border-radius: 10px;
33
- color: $white;
34
- padding: 3px 6px;
35
- }
36
- }
37
-
38
- &__description {
39
- color: #90a1b9; //@TODO: @COLOR
40
- font-size: 16px;
41
- font-style: normal;
42
- font-weight: 400;
43
- line-height: 22px;
44
- margin: 14px 0 0;
45
-
46
- b {
47
- border: solid rgba(69, 85, 108, 0.5); // @TODO: @COLOR
48
- background-color: rgba(49, 65, 88, 0.4); // @TODO: @COLOR
49
- border-radius: 10px;
50
- color: $white;
51
- padding: 3px 6px;
52
- }
53
- }
54
-
55
- &__content {
56
- display: flex;
57
- flex-direction: column;
58
- margin: 24px 0 0;
59
- width: 100%;
60
- }
61
- }
@@ -1,53 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.Card = void 0;
37
- var React = __importStar(require("react"));
38
- var label_1 = require("@aristobyte-ui/label");
39
- var Card = function (_a) {
40
- var title = _a.title, description = _a.description, label = _a.label, icon = _a.icon, children = _a.children, _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.style, style = _c === void 0 ? {} : _c;
41
- return (React.createElement("div", { className: "card ".concat(className), style: style },
42
- (title || icon || label) && (React.createElement("h3", { className: "card__title" },
43
- icon && (React.createElement("div", { className: "card__icon" }, icon.component({
44
- size: icon.size || 8,
45
- color: icon.color,
46
- colors: icon.colors,
47
- }))),
48
- title && React.createElement("span", { dangerouslySetInnerHTML: { __html: title } }),
49
- label && (React.createElement(label_1.Label, { text: label.text, backgroundColor: label.backgroundColor, borderColor: label.borderColor, color: label.color })))),
50
- description && (React.createElement("p", { className: "card__description", dangerouslySetInnerHTML: { __html: description } })),
51
- children && React.createElement("div", { className: "card__content" }, children)));
52
- };
53
- exports.Card = Card;
@@ -1,17 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
- for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- __exportStar(require("./Card"), exports);