jcicl 0.0.24 → 0.0.25

package/base/Avatar/index.d.ts

@@ -1 +1 @@
-export { default, type AvatarProps } from './Avatar';
+export { default } from './Avatar';

package/composite/List/List.d.ts

@@ -1 +1,10 @@
-export {};
+import { default as React, PropsWithChildren } from 'react';
+import { ButtonBaseProps } from '@mui/material/ButtonBase/ButtonBase';
+export interface ListProps extends ButtonBaseProps {
+    interactable?: boolean;
+    width?: string;
+    padding?: string;
+    borderColor?: string;
+}
+declare const List: React.FC<PropsWithChildren<ListProps>>;
+export default List;

package/composite/List/List.js

@@ -1 +1,59 @@
-
+import { jsx as t } from "react/jsx-runtime";
+import d from "react";
+import { n as a } from "../../.chunks/emotion-styled.browser.esm.js";
+import i from "../../theme.js";
+import { B as f } from "../../.chunks/ButtonBase.js";
+const m = a("div")(({ width: e, borderColor: o }) => ({
+  display: "flex",
+  flexDirection: "column",
+  fontFamily: "Roboto, sans-serif",
+  listStyleType: "none",
+  border: `1px solid ${o}`,
+  borderRadius: "4px",
+  overflow: "hidden",
+  pointerEvents: "none",
+  ...e && {
+    width: e
+  }
+})), c = a("div")(
+  ({ padding: e, borderColor: o, interactable: r }) => ({
+    backgroundColor: i.colors.white,
+    padding: e,
+    ...!r && {
+      borderBottom: `1px solid ${o}`,
+      "&:last-child": {
+        borderBottom: "none"
+      }
+    }
+  })
+), h = a(f)(({ borderColor: e }) => ({
+  borderBottom: `1px solid ${e}`,
+  fontSize: "inherit",
+  pointerEvents: "all",
+  "&:last-child": {
+    borderBottom: "none"
+  },
+  span: {
+    transition: "201ms all ease-in-out"
+  },
+  "&:hover": {
+    span: {
+      boxShadow: `inset ${i.boxShadow.green}`
+    }
+  },
+  "&:focus": {
+    span: {
+      boxShadow: `inset ${i.boxShadow.darkGreenThick}`
+    }
+  }
+})), v = ({
+  interactable: e = !1,
+  width: o,
+  padding: r = "1rem ",
+  borderColor: n = i.colors.darkGreen,
+  children: l,
+  ...p
+}) => e ? /* @__PURE__ */ t(m, { width: o, borderColor: n, children: d.Children.map(l, (s) => /* @__PURE__ */ t(h, { borderColor: n, ...p, children: /* @__PURE__ */ t(c, { padding: r, borderColor: "transparent", interactable: !0, children: s }) })) }) : /* @__PURE__ */ t(m, { width: o, borderColor: n, children: d.Children.map(l, (s) => /* @__PURE__ */ t(c, { padding: r, borderColor: n, interactable: !1, children: s })) });
+export {
+  v as default
+};

package/composite/List/index.d.ts

@@ -0,0 +1 @@
+export { default, type ListProps } from './List';

package/composite/List/index.js

@@ -0,0 +1,4 @@
+import { default as o } from "./List.js";
+export {
+  o as default
+};

package/composite/index.d.ts

@@ -1 +1,2 @@
+export { default as List } from './List';
 export { default as WithLabel } from './WithLabel';

package/composite/index.js

@@ -1,4 +1,6 @@
-import { default as t } from "./WithLabel/WithLabel.js";
+import { default as e } from "./List/List.js";
+import { default as o } from "./WithLabel/WithLabel.js";
 export {
-  t as WithLabel
+  e as List,
+  o as WithLabel
 };

package/index.d.ts

@@ -1,3 +1,4 @@
 export { Avatar, AvatarWithImage, Button, Divider, Flex, Grid } from './base';
+export { List, WithLabel } from './composite';
 export { AppHeader, Nav } from './supercomposite';
 export { AppContainer, BasicPage } from './templates';

package/index.js

@@ -1,24 +1,28 @@
 import { default as a } from "./base/Avatar/Avatar.js";
-import { AvatarWithImage as f } from "./base/AvatarWithImage/AvatarWithImage.js";
+import { AvatarWithImage as p } from "./base/AvatarWithImage/AvatarWithImage.js";
 import { Button as x } from "./base/Button/Button.js";
 import { Divider as i } from "./base/Divider/Divider.js";
 import { default as s } from "./base/Flex/Flex.js";
 import { Grid as v } from "./base/Grid/Grid.js";
 import "./base/Input/Input.js";
+import { default as n } from "./composite/List/List.js";
+import { default as h } from "./composite/WithLabel/WithLabel.js";
 import "./supercomposite/AppBar/AppBar.js";
-import { default as n } from "./supercomposite/AppHeader/AppHeader.js";
-import { Nav as B } from "./supercomposite/Nav/Nav.js";
-import { default as h } from "./templates/AppContainer/AppContainer.js";
-import { default as D } from "./templates/BasicPage/BasicPage.js";
+import { default as L } from "./supercomposite/AppHeader/AppHeader.js";
+import { Nav as b } from "./supercomposite/Nav/Nav.js";
+import { default as C } from "./templates/AppContainer/AppContainer.js";
+import { default as F } from "./templates/BasicPage/BasicPage.js";
 export {
-  h as AppContainer,
-  n as AppHeader,
+  C as AppContainer,
+  L as AppHeader,
   a as Avatar,
-  f as AvatarWithImage,
-  D as BasicPage,
+  p as AvatarWithImage,
+  F as BasicPage,
   x as Button,
   i as Divider,
   s as Flex,
   v as Grid,
-  B as Nav
+  n as List,
+  b as Nav,
+  h as WithLabel
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.24",
+  "version": "0.0.25",
   "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",

package/templates/AppContainer/AppContainer.js

@@ -8,7 +8,7 @@ const c = d("div")({
   flexDirection: "column",
   width: "100%",
   position: "relative",
-  backgroundColor: o.colors.whiteGreen2,
+  backgroundColor: o.colors.whiteGreenA,
   height: "100vh",
   fontFamily: "Roboto, sans-serif",
   overflow: "hidden"

package/theme.d.ts

@@ -10,6 +10,7 @@ export interface ThemeColors {
     gold: string;
     gray: string;
     veryLightGray: string;
+    veryLightGrayO33: string;
     grayO44: string;
     green: string;
     midnight: string;
@@ -17,12 +18,13 @@ export interface ThemeColors {
     sunlight: string;
     white: string;
     whiteGreen: string;
-    whiteGreen2: string;
+    whiteGreenA: string;
 }
 export interface ThemeBoxShadows extends Partial<ThemeColors> {
     black63?: string;
     darkGreenThick?: string;
     gray63?: string;
+    greenThick?: string;
 }
 export interface Theme {
     boxShadow: ThemeBoxShadows;

package/theme.js

@@ -18,8 +18,9 @@ const e = {
     sunlight: "#faf9e8",
     white: "white",
     whiteGreen: "#f2fcf5",
-    whiteGreen2: "#dae8de",
-    veryLightGray: "#fafafa"
+    whiteGreenA: "#dae8de",
+    veryLightGray: "#fafafa",
+    veryLightGrayO33: "#fafafa33"
   },
   constants: {
     appHeaderHeight: 54,
@@ -37,6 +38,7 @@ e.boxShadow = {
     ])
   ),
   darkGreenThick: `0 0 2px 1px ${e.colors.darkGreen}`,
+  greenThick: `0 0 2px 1px ${e.colors.green}`,
   gray63: "0px 0px 2px 1px rgba(100, 100, 100, 0.63)",
   black63: "0px 0px 2px 1px rgba(0, 0, 0, 0.63)"
 };