@starasia/card 1.0.3 → 2.0.1

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/dist/card.es.js CHANGED
@@ -1,59 +1,41 @@
1
1
  import { jsx as s } from "react/jsx-runtime";
2
- const d = `:root {
3
- /* radius */
4
- --starasia-ui-card-border-radius: var(--starasia-ui-radii-md, 6px);
5
-
6
- /* white */
7
- --starasia-ui-card-color-white: var(--starasia-ui-color-gray-50, rgba(255, 254, 255, 1));
8
-
9
- /* background color */
10
- --starasia-ui-card-background-color: var(
11
- --starasia-ui-color-gray-50,
12
- rgba(249, 250, 251, 1)
13
- );
14
-
15
- /* border color */
16
- --starasia-ui-card-border-color: var(--starasia-ui-color-gray-300, rgba(209, 213, 219, 1));
17
-
18
- /* box shadow */
19
- --starasia-ui-card-box-shadow: var(
20
- --starasia-ui-shadow-md,
21
- 0 4px 6px -1px rgb(0 0 0 / 0.1),
22
- 0 2px 4px -2px rgb(0 0 0 / 0.1)
23
- );
2
+ const e = `:root {
3
+ --sa-card-radius: var(--sa-radii-md, 0.5rem);
4
+ --sa-card-bg: var(--sa-background-primary, #ffffff);
5
+ --sa-card-border: var(--sa-border-subtle, #0b120e24);
6
+ --sa-card-shadow: var(--sa-shadow-card, 0px 4px 35px 0px #7090b040);
24
7
  }
25
8
 
26
9
  .starasia-card {
27
- border-radius: var(--starasia-ui-card-border-radius);
28
- background-color: var(--starasia-ui-card-background-color);
29
- border: var(--starasia-ui-border, 1px) solid
30
- var(--starasia-ui-card-border-color);
31
- box-shadow: var(--starasia-ui-card-box-shadow);
10
+ border-radius: var(--sa-card-radius);
11
+ background-color: var(--sa-card-bg);
12
+ border: var(--sa-border, 1px) solid var(--sa-card-border);
13
+ box-shadow: var(--sa-card-shadow);
32
14
  width: max-content;
33
15
  }
34
16
 
35
17
  .starasia-card-header {
36
- padding: var(--starasia-ui-spacing-lg, 16px);
18
+ padding: var(--sa-spacing-lg, 1rem);
37
19
  }
38
20
 
39
21
  .starasia-card-body {
40
- padding: var(--starasia-ui-spacing-lg, 16px);
22
+ padding: var(--sa-spacing-lg, 1rem);
41
23
  }
42
24
 
43
25
  .starasia-card-footer {
44
- padding: var(--starasia-ui-spacing-lg, 16px);
26
+ padding: var(--sa-spacing-lg, 1rem);
45
27
  }
46
- `, n = "starasia-card-styles", t = (r) => {
47
- if (!document.getElementById(n)) {
28
+ `, d = "starasia-card-styles", n = (r) => {
29
+ if (!document.getElementById(d)) {
48
30
  const a = document.createElement("style");
49
- a.id = n, a.textContent = r, document.head.appendChild(a);
31
+ a.id = d, a.textContent = r, document.head.appendChild(a);
50
32
  }
51
33
  };
52
- t(d);
53
- const i = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card", style: { ...a }, children: r }), e = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card-header", style: { ...a }, children: r }), c = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card-body", style: { ...a }, children: r }), l = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card-footer", style: { ...a }, children: r });
34
+ n(e);
35
+ const o = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card", style: { ...a }, children: r }), c = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card-header", style: { ...a }, children: r }), i = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card-body", style: { ...a }, children: r }), l = ({ children: r, style: a }) => /* @__PURE__ */ s("div", { className: "starasia-card-footer", style: { ...a }, children: r });
54
36
  export {
55
- i as Card,
56
- c as CardBody,
37
+ o as Card,
38
+ i as CardBody,
57
39
  l as CardFooter,
58
- e as CardHeader
40
+ c as CardHeader
59
41
  };
package/dist/card.umd.js CHANGED
@@ -1,45 +1,27 @@
1
- (function(r,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react/jsx-runtime")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime"],n):(r=typeof globalThis<"u"?globalThis:r||self,n(r.Card={},r.jsxRuntime))})(this,function(r,n){"use strict";const t=`:root {
2
- /* radius */
3
- --starasia-ui-card-border-radius: var(--starasia-ui-radii-md, 6px);
4
-
5
- /* white */
6
- --starasia-ui-card-color-white: var(--starasia-ui-color-gray-50, rgba(255, 254, 255, 1));
7
-
8
- /* background color */
9
- --starasia-ui-card-background-color: var(
10
- --starasia-ui-color-gray-50,
11
- rgba(249, 250, 251, 1)
12
- );
13
-
14
- /* border color */
15
- --starasia-ui-card-border-color: var(--starasia-ui-color-gray-300, rgba(209, 213, 219, 1));
16
-
17
- /* box shadow */
18
- --starasia-ui-card-box-shadow: var(
19
- --starasia-ui-shadow-md,
20
- 0 4px 6px -1px rgb(0 0 0 / 0.1),
21
- 0 2px 4px -2px rgb(0 0 0 / 0.1)
22
- );
1
+ (function(r,d){typeof exports=="object"&&typeof module<"u"?d(exports,require("react/jsx-runtime")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime"],d):(r=typeof globalThis<"u"?globalThis:r||self,d(r.Card={},r.jsxRuntime))})(this,function(r,d){"use strict";const n=`:root {
2
+ --sa-card-radius: var(--sa-radii-md, 0.5rem);
3
+ --sa-card-bg: var(--sa-background-primary, #ffffff);
4
+ --sa-card-border: var(--sa-border-subtle, #0b120e24);
5
+ --sa-card-shadow: var(--sa-shadow-card, 0px 4px 35px 0px #7090b040);
23
6
  }
24
7
 
25
8
  .starasia-card {
26
- border-radius: var(--starasia-ui-card-border-radius);
27
- background-color: var(--starasia-ui-card-background-color);
28
- border: var(--starasia-ui-border, 1px) solid
29
- var(--starasia-ui-card-border-color);
30
- box-shadow: var(--starasia-ui-card-box-shadow);
9
+ border-radius: var(--sa-card-radius);
10
+ background-color: var(--sa-card-bg);
11
+ border: var(--sa-border, 1px) solid var(--sa-card-border);
12
+ box-shadow: var(--sa-card-shadow);
31
13
  width: max-content;
32
14
  }
33
15
 
34
16
  .starasia-card-header {
35
- padding: var(--starasia-ui-spacing-lg, 16px);
17
+ padding: var(--sa-spacing-lg, 1rem);
36
18
  }
37
19
 
38
20
  .starasia-card-body {
39
- padding: var(--starasia-ui-spacing-lg, 16px);
21
+ padding: var(--sa-spacing-lg, 1rem);
40
22
  }
41
23
 
42
24
  .starasia-card-footer {
43
- padding: var(--starasia-ui-spacing-lg, 16px);
25
+ padding: var(--sa-spacing-lg, 1rem);
44
26
  }
45
- `,d="starasia-card-styles";(s=>{if(!document.getElementById(d)){const a=document.createElement("style");a.id=d,a.textContent=s,document.head.appendChild(a)}})(t);const e=({children:s,style:a})=>n.jsx("div",{className:"starasia-card",style:{...a},children:s}),i=({children:s,style:a})=>n.jsx("div",{className:"starasia-card-header",style:{...a},children:s}),o=({children:s,style:a})=>n.jsx("div",{className:"starasia-card-body",style:{...a},children:s}),c=({children:s,style:a})=>n.jsx("div",{className:"starasia-card-footer",style:{...a},children:s});r.Card=e,r.CardBody=o,r.CardFooter=c,r.CardHeader=i,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
27
+ `,s="starasia-card-styles";(e=>{if(!document.getElementById(s)){const a=document.createElement("style");a.id=s,a.textContent=e,document.head.appendChild(a)}})(n);const t=({children:e,style:a})=>d.jsx("div",{className:"starasia-card",style:{...a},children:e}),o=({children:e,style:a})=>d.jsx("div",{className:"starasia-card-header",style:{...a},children:e}),c=({children:e,style:a})=>d.jsx("div",{className:"starasia-card-body",style:{...a},children:e}),i=({children:e,style:a})=>d.jsx("div",{className:"starasia-card-footer",style:{...a},children:e});r.Card=t,r.CardBody=c,r.CardFooter=i,r.CardHeader=o,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@starasia/card",
3
- "version": "1.0.3",
3
+ "version": "2.0.1",
4
4
  "description": "Card component for starasia UI",
5
5
  "author": "Prawito Hudoro",
6
6
  "main": "dist/card.umd.js",
@@ -12,10 +12,6 @@
12
12
  "dist/*.map",
13
13
  "dist/*.css"
14
14
  ],
15
- "scripts": {
16
- "dev": "vite --config vite.config.ts --port 3000",
17
- "build": "vite build --config vite.config.ts"
18
- },
19
15
  "keywords": [],
20
16
  "license": "ISC",
21
17
  "type": "module",
@@ -37,5 +33,9 @@
37
33
  "react-dom": "^18.2.0",
38
34
  "@types/react": "^18.2.55",
39
35
  "@types/react-dom": "^18.2.19"
36
+ },
37
+ "scripts": {
38
+ "dev": "vite --config vite.config.ts --port 3000",
39
+ "build": "vite build --config vite.config.ts"
40
40
  }
41
- }
41
+ }