jcicl 0.0.78 → 0.0.80

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": "jcicl",
3
3
  "private": false,
4
- "version": "0.0.78",
4
+ "version": "0.0.80",
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",
@@ -23,6 +23,7 @@ interface EditableInfoCardStyleProps {
23
23
  loading?: boolean;
24
24
  loadingStyles?: CSSObject;
25
25
  titleSpacing?: string;
26
+ canEditTitle?: boolean;
26
27
  }
27
28
  export interface EditableInfoCardProps extends EditableInfoCardStyleProps {
28
29
  title?: string;
@@ -1,25 +1,25 @@
1
- import { jsx as o, jsxs as n, Fragment as y } from "react/jsx-runtime";
2
- import { useState as z, useEffect as J } from "react";
1
+ import { jsx as o, jsxs as n, Fragment as S } from "react/jsx-runtime";
2
+ import { useState as k, useEffect as K } from "react";
3
3
  import { n as i } from "../../.chunks/emotion-styled.browser.esm.js";
4
- import { c as m } from "../../.chunks/emotion-react.browser.esm.js";
4
+ import { c as u } from "../../.chunks/emotion-react.browser.esm.js";
5
5
  import { c as C } from "../../.chunks/createSvgIcon.js";
6
6
  import d from "../../theme.js";
7
- import { LabeledValue as K } from "../../base/LabeledValue/LabeledValue.js";
8
- import { LabeledInput as N } from "../../composite/LabeledInput/LabeledInput.js";
9
- import k from "../../base/Loading/Loading.js";
7
+ import { LabeledValue as N } from "../../base/LabeledValue/LabeledValue.js";
8
+ import { LabeledInput as O } from "../../composite/LabeledInput/LabeledInput.js";
9
+ import M from "../../base/Loading/Loading.js";
10
10
  import f from "../../base/Flex/Flex.js";
11
11
  import { Tooltip as x } from "../../composite/Tooltip/Tooltip.js";
12
- import { T as O } from "../../.chunks/Input.js";
13
- import { B as Q } from "../../.chunks/ButtonBase.js";
14
- const X = C(/* @__PURE__ */ o("path", {
12
+ import { T as Q } from "../../.chunks/Input.js";
13
+ import { B as X } from "../../.chunks/ButtonBase.js";
14
+ const Z = C(/* @__PURE__ */ o("path", {
15
15
  d: "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.996.996 0 0 0-1.41 0l-1.83 1.83 3.75 3.75z"
16
- }), "Edit"), Z = C(/* @__PURE__ */ o("path", {
16
+ }), "Edit"), _ = C(/* @__PURE__ */ o("path", {
17
17
  d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
18
- }), "Close"), _ = C(/* @__PURE__ */ o("path", {
18
+ }), "Close"), oo = C(/* @__PURE__ */ o("path", {
19
19
  d: "M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
20
- }), "Check"), L = i("div")(
21
- ({ width: t, padding: l, shadow: r, styles: u, isEditing: c }) => ({
22
- ...m`
20
+ }), "Check"), P = i("div")(
21
+ ({ width: t, padding: a, shadow: r, styles: m, isEditing: c }) => ({
22
+ ...u`
23
23
  width: ${t};
24
24
  max-width: 100%;
25
25
  box-sizing: border-box;
@@ -29,13 +29,13 @@ const X = C(/* @__PURE__ */ o("path", {
29
29
  font-size: 28px;
30
30
  }
31
31
  font-family: 'Roboto', sans-serif;
32
- padding: ${l};
32
+ padding: ${a};
33
33
  display: flex;
34
34
  flex-direction: column;
35
35
  box-shadow: ${r};
36
36
  border-radius: 5px;
37
37
  background-color: ${d.colors.white};
38
- ${u};
38
+ ${m};
39
39
  z-index: ${c ? 0 : 1};
40
40
  position: relative;
41
41
  transform: ${c ? "rotateY(-180deg)" : "rotateY(0deg)"};
@@ -43,7 +43,7 @@ const X = C(/* @__PURE__ */ o("path", {
43
43
  opacity: ${c ? "0" : "1"};
44
44
  `
45
45
  })
46
- ), oo = i(O)({
46
+ ), eo = i(Q)({
47
47
  backgroundColor: d.colors.white,
48
48
  borderRadius: "0",
49
49
  input: {
@@ -71,8 +71,8 @@ const X = C(/* @__PURE__ */ o("path", {
71
71
  border: "none"
72
72
  }
73
73
  }
74
- }), eo = i(L)(({ isEditing: t }) => ({
75
- ...m`
74
+ }), to = i(P)(({ isEditing: t }) => ({
75
+ ...u`
76
76
  position: absolute;
77
77
  top: 0;
78
78
  z-index: ${t ? 1 : 0};
@@ -80,68 +80,69 @@ const X = C(/* @__PURE__ */ o("path", {
80
80
  opacity: ${t ? "1" : "0"};
81
81
  transition: 920ms all ease-in-out;
82
82
  `
83
- })), M = i("div")(
84
- ({ spacing: t, columns: l, numRows: r }) => ({
85
- ...m`
83
+ })), B = i("div")(
84
+ ({ spacing: t, columns: a, numRows: r }) => ({
85
+ ...u`
86
86
  margin-top: calc(${t} * 0.75);
87
87
  grid-row-gap: ${t};
88
88
  grid-column-gap: calc(${t} * 1.5);
89
89
  display: grid;
90
- grid-template-columns: repeat(${l}, 1fr);
90
+ grid-template-columns: repeat(${a}, 1fr);
91
91
  grid-template-rows: repeat(${r}, 1fr);
92
92
  `
93
93
  })
94
- ), $ = i(Q)(() => ({
95
- ...m`
94
+ ), $ = i(X)(() => ({
95
+ ...u`
96
96
  width: 40px;
97
97
  height: 40px;
98
98
  border-radius: 50%;
99
99
  `
100
- })), to = i("div")`
100
+ })), ro = i("div")`
101
101
  position: relative;
102
102
  width: 100%;
103
- `, B = i("div")`
103
+ `, L = i("div")`
104
104
  height: 19px;
105
- `, go = ({
105
+ `, xo = ({
106
106
  decorativeElement: t,
107
- title: l,
107
+ title: a,
108
108
  items: r = [],
109
- padding: u = "1rem 2rem",
109
+ padding: m = "1rem 2rem",
110
110
  shadow: c = d.boxShadow.darkGreen,
111
- spacing: P = "2rem",
112
- titleSpacing: R = "1rem",
113
- columns: w = 3,
114
- styles: T,
115
- width: j = "100%",
116
- loading: v = !1,
117
- onSave: E = () => {
111
+ spacing: R = "2rem",
112
+ titleSpacing: w = "1rem",
113
+ canEditTitle: T = !0,
114
+ columns: v = 3,
115
+ styles: j,
116
+ width: E = "100%",
117
+ loading: I = !1,
118
+ onSave: V = () => {
118
119
  },
119
- onCancel: V = () => {
120
+ onCancel: Y = () => {
120
121
  },
121
- onEdit: Y = () => {
122
+ onEdit: F = () => {
122
123
  }
123
124
  }) => {
124
- const b = r.reduce((e, a) => ({ ...e, [a.label]: a.value }), { titleValue: l }), [F, g] = z(!1), [p, h] = z(b);
125
- J(() => {
125
+ const b = r.reduce((e, l) => ({ ...e, [l.label]: l.value }), { titleValue: a }), [G, g] = k(!1), [p, h] = k(b);
126
+ K(() => {
126
127
  h(b);
127
128
  }, [r]);
128
- const G = () => {
129
- Y(), g(!0);
130
- }, U = () => {
131
- E(p), g(!1);
129
+ const U = () => {
130
+ F(), g(!0);
132
131
  }, W = () => {
133
- V(), h(b), g(!1);
134
- }, q = (e, a) => {
135
- h((H) => ({ ...H, [e]: a }));
136
- }, A = (e) => {
137
- h((a) => ({ ...a, titleValue: e }));
138
- }, D = Math.ceil(r.length / w), s = 50, I = { width: j, padding: u, shadow: c, styles: T, isEditing: F }, S = { spacing: P, columns: w, numRows: D };
139
- return /* @__PURE__ */ n(to, { children: [
140
- /* @__PURE__ */ n(L, { ...I, children: [
132
+ V(p), g(!1);
133
+ }, q = () => {
134
+ Y(), h(b), g(!1);
135
+ }, A = (e, l) => {
136
+ h((J) => ({ ...J, [e]: l }));
137
+ }, D = (e) => {
138
+ h((l) => ({ ...l, titleValue: e }));
139
+ }, H = Math.ceil(r.length / v), s = 50, y = { width: E, padding: m, shadow: c, styles: j, isEditing: G }, z = { spacing: R, columns: v, numRows: H };
140
+ return /* @__PURE__ */ n(ro, { children: [
141
+ /* @__PURE__ */ n(P, { ...y, children: [
141
142
  /* @__PURE__ */ n(f, { width: "100%", gap: "1rem", justifyContent: "space-between", children: [
142
- /* @__PURE__ */ n(f, { width: "100%", gap: R, alignItems: "center", children: [
143
+ /* @__PURE__ */ n(f, { width: "100%", gap: w, alignItems: "center", children: [
143
144
  t && t,
144
- /* @__PURE__ */ o("h3", { children: l })
145
+ /* @__PURE__ */ o("h3", { children: a })
145
146
  ] }),
146
147
  /* @__PURE__ */ o(
147
148
  x,
@@ -160,14 +161,14 @@ const X = C(/* @__PURE__ */ o("path", {
160
161
  ]
161
162
  }
162
163
  },
163
- children: /* @__PURE__ */ o($, { onClick: G, children: /* @__PURE__ */ o(X, {}) })
164
+ children: /* @__PURE__ */ o($, { onClick: U, children: /* @__PURE__ */ o(Z, {}) })
164
165
  }
165
166
  )
166
167
  ] }),
167
- /* @__PURE__ */ o(M, { ...S, children: v ? /* @__PURE__ */ n(y, { children: [
168
- /* @__PURE__ */ o(B, {}),
168
+ /* @__PURE__ */ o(B, { ...z, children: I ? /* @__PURE__ */ n(S, { children: [
169
+ /* @__PURE__ */ o(L, {}),
169
170
  /* @__PURE__ */ o(
170
- k,
171
+ M,
171
172
  {
172
173
  size: s,
173
174
  styles: {
@@ -177,19 +178,19 @@ const X = C(/* @__PURE__ */ o("path", {
177
178
  }
178
179
  }
179
180
  )
180
- ] }) : r == null ? void 0 : r.map((e) => /* @__PURE__ */ o(K, { ...e }, e.label)) })
181
+ ] }) : r == null ? void 0 : r.map((e) => /* @__PURE__ */ o(N, { ...e }, e.label)) })
181
182
  ] }),
182
- /* @__PURE__ */ n(eo, { ...I, children: [
183
+ /* @__PURE__ */ n(to, { ...y, children: [
183
184
  /* @__PURE__ */ n(f, { width: "100%", justifyContent: "space-between", children: [
184
- /* @__PURE__ */ n(f, { width: "100%", gap: "1rem", alignItems: "center", children: [
185
+ /* @__PURE__ */ n(f, { width: "100%", gap: w, alignItems: "center", children: [
185
186
  t && t,
186
- /* @__PURE__ */ o("h3", { children: /* @__PURE__ */ o(
187
- oo,
187
+ /* @__PURE__ */ o("h3", { children: T ? /* @__PURE__ */ o(
188
+ eo,
188
189
  {
189
- onChange: (e) => A(e.target.value),
190
- value: (p == null ? void 0 : p.titleValue) ?? l
190
+ onChange: (e) => D(e.target.value),
191
+ value: (p == null ? void 0 : p.titleValue) ?? a
191
192
  }
192
- ) })
193
+ ) : /* @__PURE__ */ o("h3", { children: a }) })
193
194
  ] }),
194
195
  /* @__PURE__ */ o(
195
196
  x,
@@ -208,7 +209,7 @@ const X = C(/* @__PURE__ */ o("path", {
208
209
  ]
209
210
  }
210
211
  },
211
- children: /* @__PURE__ */ o($, { onClick: W, children: /* @__PURE__ */ o(Z, {}) })
212
+ children: /* @__PURE__ */ o($, { onClick: q, children: /* @__PURE__ */ o(_, {}) })
212
213
  }
213
214
  ),
214
215
  /* @__PURE__ */ o(
@@ -228,14 +229,14 @@ const X = C(/* @__PURE__ */ o("path", {
228
229
  ]
229
230
  }
230
231
  },
231
- children: /* @__PURE__ */ o($, { onClick: U, children: /* @__PURE__ */ o(_, {}) })
232
+ children: /* @__PURE__ */ o($, { onClick: W, children: /* @__PURE__ */ o(oo, {}) })
232
233
  }
233
234
  )
234
235
  ] }),
235
- /* @__PURE__ */ o(M, { ...S, children: v ? /* @__PURE__ */ n(y, { children: [
236
- /* @__PURE__ */ o(B, {}),
236
+ /* @__PURE__ */ o(B, { ...z, children: I ? /* @__PURE__ */ n(S, { children: [
237
+ /* @__PURE__ */ o(L, {}),
237
238
  /* @__PURE__ */ o(
238
- k,
239
+ M,
239
240
  {
240
241
  size: s,
241
242
  styles: {
@@ -246,11 +247,11 @@ const X = C(/* @__PURE__ */ o("path", {
246
247
  }
247
248
  )
248
249
  ] }) : r == null ? void 0 : r.map((e) => /* @__PURE__ */ o(
249
- N,
250
+ O,
250
251
  {
251
252
  label: e.label,
252
253
  value: p[e.label],
253
- onChange: (a) => q(e.label, a.target.value)
254
+ onChange: (l) => A(e.label, l.target.value)
254
255
  },
255
256
  e.label
256
257
  )) })
@@ -258,6 +259,6 @@ const X = C(/* @__PURE__ */ o("path", {
258
259
  ] });
259
260
  };
260
261
  export {
261
- go as EditableInfoCard,
262
- go as default
262
+ xo as EditableInfoCard,
263
+ xo as default
263
264
  };