jcicl 0.0.145 → 0.0.147

package/Accordion/Accordion.js

@@ -1,4 +1,4 @@
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 import { useState as g } from "react";
 import { n, i as u } from "../.chunks/emotion-styled.browser.esm.js";
 import { c as d } from "../.chunks/emotion-react.browser.esm.js";
@@ -8,7 +8,7 @@ import { c as y } from "../.chunks/createSvgIcon.js";
 import { B as b } from "../.chunks/ButtonBase.js";
 const A = y(/* @__PURE__ */ r("path", {
   d: "M6.23 20.23 8 22l10-10L8 2 6.23 3.77 14.46 12z"
-}), "ArrowForwardIos"), B = n("div")(({ padding: o, shadow: t, width: e }) => ({
+}), "ArrowForwardIos"), j = n("div")(({ padding: o, shadow: t, width: e }) => ({
   ...d`
     h3 {
       margin: 0;
@@ -24,7 +24,7 @@ const A = y(/* @__PURE__ */ r("path", {
     background-color: ${c.colors.white};
     width: ${e};
   `
-})), $ = n("div")(({ expanded: o }) => ({
+})), B = n("div")(({ expanded: o }) => ({
   ...d`
     transition: 313ms all ease-in-out;
     display: grid;
@@ -33,7 +33,7 @@ const A = y(/* @__PURE__ */ r("path", {
       overflow: hidden;
     }
   `
-})), v = n(b, {
+})), $ = n(b, {
   shouldForwardProp: (o) => u(o) && typeof o == "string"
 })(({ expanded: o }) => ({
   ...d`
@@ -44,7 +44,7 @@ const A = y(/* @__PURE__ */ r("path", {
     height: 24px;
     aspect-ratio: 1;
   `
-})), G = ({
+})), C = ({
   decorativeElement: o,
   title: t,
   children: e,
@@ -52,19 +52,19 @@ const A = y(/* @__PURE__ */ r("path", {
   shadow: m = c.boxShadows.darkGreen,
   width: p = "360px"
 }) => {
-  const [i, f] = g(!1), h = { padding: l, shadow: m, width: p }, w = { expanded: i }, x = { expanded: i };
-  return /* @__PURE__ */ s(B, { ...h, children: [
-    /* @__PURE__ */ s(a, { alignItems: "center", justifyContent: "space-between", children: [
-      /* @__PURE__ */ s(a, { width: "100%", gap: "1rem", alignItems: "center", children: [
+  const [s, f] = g(!1), h = { padding: l, shadow: m, width: p }, w = { expanded: s }, x = { expanded: s };
+  return /* @__PURE__ */ i(j, { ...h, children: [
+    /* @__PURE__ */ i(a, { className: "jcAccordionHeader", alignItems: "center", justifyContent: "space-between", children: [
+      /* @__PURE__ */ i(a, { className: "jcAccordionTitle", width: "100%", gap: "1rem", alignItems: "center", children: [
         o && o,
         /* @__PURE__ */ r("h3", { children: t })
       ] }),
-      /* @__PURE__ */ r(v, { ...w, onClick: () => f(!i), children: /* @__PURE__ */ r(A, {}) })
+      /* @__PURE__ */ r($, { ...w, onClick: () => f(!s), children: /* @__PURE__ */ r(A, {}) })
     ] }),
-    /* @__PURE__ */ r($, { className: "jcAccordionBody", ...x, children: /* @__PURE__ */ r("div", { children: e }) })
+    /* @__PURE__ */ r(B, { className: "jcAccordionBody", ...x, children: /* @__PURE__ */ r("div", { children: e }) })
   ] });
 };
 export {
-  G as Accordion,
-  G as default
+  C as Accordion,
+  C as default
 };

package/Flex/Flex.d.ts

@@ -13,6 +13,7 @@ export interface FlexProps {
     /** Format: `{ reactCssProperty: value, reactCssProperty: value }` A React CSS property is simply any css property converted to camelCase */
     styles?: CSSProperties;
     id?: string;
+    className?: string;
 }
 export declare const Flex: React.FC<FlexProps>;
 export default Flex;

package/Flex/Flex.js

@@ -18,7 +18,7 @@ const p = d("div", {
     fontFamily: "Roboto, sans-serif",
     ...n
   })
-), b = ({ children: o, ...r }) => /* @__PURE__ */ x(p, { className: "jcFlex", ...r, children: o });
+), b = ({ children: o, className: r, ...a }) => /* @__PURE__ */ x(p, { className: `jcFlex ${r}`, ...a, children: o });
 export {
   b as Flex,
   b as default

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.145",
+  "version": "0.0.147",
   "description": "Component library for the websites of Johnson County Iowa",
   "license": "MIT",
   "homepage": "https://devops.jc.net/JCIT/Business%20Solutions%20Delivery/_git/JCComponentLibrary?path=%2FREADME.md&version=GBmaster",