jcicl 0.0.54 → 0.0.55
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/base/Flex/Flex.d.ts +1 -1
- package/base/Icon/Icon.js +15 -12
- package/composite/InfoCard/InfoCard.js +8 -8
- package/composite/WithLabel/WithLabel.js +10 -10
- package/package.json +1 -1
package/base/Flex/Flex.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { default as React, CSSProperties } from 'react';
|
|
2
|
-
type AlignItems = 'start' | 'center' | 'stretch' | 'end';
|
|
2
|
+
type AlignItems = 'flex-start' | 'center' | 'stretch' | 'flex-end';
|
|
3
3
|
type JustifyContent = 'start' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
|
|
4
4
|
export type FlexProps = {
|
|
5
5
|
children: React.ReactNode;
|
package/base/Icon/Icon.js
CHANGED
|
@@ -1,23 +1,26 @@
|
|
|
1
1
|
import { jsx as i } from "react/jsx-runtime";
|
|
2
2
|
import { B as c } from "../../.chunks/ButtonBase.js";
|
|
3
|
-
import
|
|
4
|
-
import { n as
|
|
5
|
-
const
|
|
3
|
+
import t from "../../theme.js";
|
|
4
|
+
import { n as d, i as p } from "../../.chunks/emotion-styled.browser.esm.js";
|
|
5
|
+
const a = d("div", {
|
|
6
6
|
shouldForwardProp: (r) => p(r)
|
|
7
7
|
})(
|
|
8
|
-
({ iconColor: r =
|
|
8
|
+
({ iconColor: r = t.colors.darkGreen, backgroundColor: n = t.colors.mint, size: e = 40 }) => ({
|
|
9
|
+
display: "flex",
|
|
10
|
+
alignItems: "center",
|
|
11
|
+
justifyContent: "center",
|
|
9
12
|
svg: {
|
|
10
13
|
border: `1px solid ${r}`,
|
|
11
14
|
backgroundColor: n,
|
|
12
15
|
borderRadius: "50%",
|
|
13
16
|
padding: "8px",
|
|
14
17
|
fill: r,
|
|
15
|
-
width: `${
|
|
16
|
-
height: `${
|
|
18
|
+
width: `${e - 18}px`,
|
|
19
|
+
height: `${e - 18}px`,
|
|
17
20
|
pointerEvents: "none"
|
|
18
21
|
}
|
|
19
22
|
})
|
|
20
|
-
), m =
|
|
23
|
+
), m = d(c)({
|
|
21
24
|
backgroundColor: "transparent",
|
|
22
25
|
borderRadius: "50%",
|
|
23
26
|
span: {
|
|
@@ -25,18 +28,18 @@ const d = t("div", {
|
|
|
25
28
|
},
|
|
26
29
|
"&:hover, :focus": {
|
|
27
30
|
span: {
|
|
28
|
-
backgroundColor:
|
|
31
|
+
backgroundColor: t.colors.grayO44
|
|
29
32
|
}
|
|
30
33
|
}
|
|
31
34
|
}), x = ({
|
|
32
35
|
icon: r,
|
|
33
36
|
iconColor: n,
|
|
34
|
-
backgroundColor:
|
|
37
|
+
backgroundColor: e,
|
|
35
38
|
size: l,
|
|
36
|
-
...
|
|
39
|
+
...o
|
|
37
40
|
}) => {
|
|
38
|
-
const s = { iconColor: n, backgroundColor:
|
|
39
|
-
return
|
|
41
|
+
const s = { iconColor: n, backgroundColor: e, size: l };
|
|
42
|
+
return o != null && o.onClick ? /* @__PURE__ */ i(m, { ...o, children: /* @__PURE__ */ i(a, { ...s, children: r }) }) : /* @__PURE__ */ i(a, { ...s, children: r });
|
|
40
43
|
};
|
|
41
44
|
export {
|
|
42
45
|
x as default
|
|
@@ -4,12 +4,12 @@ import { c as i } from "../../.chunks/emotion-react.browser.esm.js";
|
|
|
4
4
|
import l from "../../theme.js";
|
|
5
5
|
import { LabeledValue as f } from "../../base/LabeledValue/LabeledValue.js";
|
|
6
6
|
import h from "../../base/Flex/Flex.js";
|
|
7
|
-
const
|
|
7
|
+
const x = d("div")(({ padding: r, shadow: o }) => ({
|
|
8
8
|
...i`
|
|
9
9
|
h3 {
|
|
10
10
|
margin: 0;
|
|
11
11
|
width: 100%;
|
|
12
|
-
font-size:
|
|
12
|
+
font-size: 32px;
|
|
13
13
|
}
|
|
14
14
|
font-family: 'Roboto', sans-serif;
|
|
15
15
|
padding: ${r};
|
|
@@ -19,7 +19,7 @@ const g = d("div")(({ padding: r, shadow: o }) => ({
|
|
|
19
19
|
border-radius: 5px;
|
|
20
20
|
background-color: ${l.colors.white};
|
|
21
21
|
`
|
|
22
|
-
})),
|
|
22
|
+
})), g = d("div")(({ spacing: r, columns: o }) => ({
|
|
23
23
|
...i`
|
|
24
24
|
margin-top: calc(${r} * 0.75);
|
|
25
25
|
grid-row-gap: ${r};
|
|
@@ -32,15 +32,15 @@ const g = d("div")(({ padding: r, shadow: o }) => ({
|
|
|
32
32
|
title: o,
|
|
33
33
|
items: e,
|
|
34
34
|
padding: m = "1rem 2rem",
|
|
35
|
-
shadow:
|
|
36
|
-
spacing:
|
|
35
|
+
shadow: s = l.boxShadow.darkGreen,
|
|
36
|
+
spacing: c = "2rem",
|
|
37
37
|
columns: p = 3
|
|
38
|
-
}) => /* @__PURE__ */ t(
|
|
39
|
-
/* @__PURE__ */ t(h, { width: "100%", gap: "1rem", alignItems: "
|
|
38
|
+
}) => /* @__PURE__ */ t(x, { ...{ padding: m, shadow: s }, children: [
|
|
39
|
+
/* @__PURE__ */ t(h, { width: "100%", gap: "1rem", alignItems: "flex-end", children: [
|
|
40
40
|
r && r,
|
|
41
41
|
/* @__PURE__ */ a("h3", { children: o })
|
|
42
42
|
] }),
|
|
43
|
-
/* @__PURE__ */ a(
|
|
43
|
+
/* @__PURE__ */ a(g, { ...{ spacing: c, columns: p }, children: e == null ? void 0 : e.map((n) => /* @__PURE__ */ a(f, { ...n }, n.label)) })
|
|
44
44
|
] });
|
|
45
45
|
export {
|
|
46
46
|
P as InfoCard,
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
const
|
|
1
|
+
import { jsxs as l, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import m from "../../base/Flex/Flex.js";
|
|
3
|
+
const h = ({
|
|
4
4
|
label: r,
|
|
5
|
-
component:
|
|
6
|
-
fontSize:
|
|
7
|
-
styles:
|
|
8
|
-
...
|
|
9
|
-
}) => /* @__PURE__ */ m
|
|
10
|
-
/* @__PURE__ */ e(
|
|
5
|
+
component: t,
|
|
6
|
+
fontSize: i = "inherit",
|
|
7
|
+
styles: n,
|
|
8
|
+
...s
|
|
9
|
+
}) => /* @__PURE__ */ l(m, { gap: "0.5rem", alignItems: "center", styles: { ...n, fontSize: i }, ...s, children: [
|
|
10
|
+
/* @__PURE__ */ e("div", { id: r, children: t }),
|
|
11
11
|
/* @__PURE__ */ e("label", { htmlFor: r, children: r })
|
|
12
12
|
] });
|
|
13
13
|
export {
|
|
14
|
-
|
|
14
|
+
h as default
|
|
15
15
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "jcicl",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.55",
|
|
5
5
|
"description": "Component library for the websites of Johnson County Iowa",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"homepage": "https://devops.jc.net/JCIT/Business%20Solutions%20Delivery/_git/JCComponentLibrary?path=%2FREADME.md&version=GBmaster",
|