jcicl 0.0.80 → 0.0.81

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