jcicl 0.0.181 → 0.0.183

package/LabeledDropdown/LabeledDropdown.js

@@ -1,47 +1,330 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import { n as p } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as s } from "../.chunks/emotion-react.browser.esm.js";
-import i from "../theme.js";
-import { S as n } from "../.chunks/Select.js";
-const l = p("div")(() => ({
-  ...s`
-    display: flex;
-    flex-wrap: nowrap;
-    align-items: end;
-    gap: 3px;
-    font-family: 'Roboto', sans-serif;
-
-    .jcDropdownLabel {
-      white-space: nowrap;
-      font-weight: bold;
-      text-transform: capitalize;
+import { jsx as c, jsxs as I } from "react/jsx-runtime";
+import { n as D } from "../.chunks/emotion-styled.browser.esm.js";
+import { c as V } from "../.chunks/emotion-react.browser.esm.js";
+import N from "../theme.js";
+import { L as $, F, S as P } from "../.chunks/Select.js";
+import * as p from "react";
+import { g as f, a as E, s as U, r as G, d as u, u as z, c as w, P as t, b as H } from "../.chunks/DefaultPropsProvider.js";
+import { m as W } from "../.chunks/memoTheme.js";
+import { B as _ } from "../.chunks/ButtonBase.js";
+import { d as M } from "../.chunks/dividerClasses.js";
+import { a as q, u as A } from "../.chunks/TransitionGroupContext.js";
+const O = f("MuiListItemIcon", ["root", "alignItemsFlexStart"]), h = f("MuiListItemText", ["root", "multiline", "dense", "inset", "primary", "secondary"]);
+function J(e) {
+  return E("MuiMenuItem", e);
+}
+const d = f("MuiMenuItem", ["root", "focusVisible", "dense", "disabled", "divider", "gutters", "selected"]), K = (e, o) => {
+  const {
+    ownerState: s
+  } = e;
+  return [o.root, s.dense && o.dense, s.divider && o.divider, !s.disableGutters && o.gutters];
+}, Q = (e) => {
+  const {
+    disabled: o,
+    dense: s,
+    divider: r,
+    disableGutters: n,
+    selected: i,
+    classes: a
+  } = e, l = H({
+    root: ["root", s && "dense", o && "disabled", !n && "gutters", r && "divider", i && "selected"]
+  }, J, a);
+  return {
+    ...a,
+    ...l
+  };
+}, X = U(_, {
+  shouldForwardProp: (e) => G(e) || e === "classes",
+  name: "MuiMenuItem",
+  slot: "Root",
+  overridesResolver: K
+})(W(({
+  theme: e
+}) => ({
+  ...e.typography.body1,
+  display: "flex",
+  justifyContent: "flex-start",
+  alignItems: "center",
+  position: "relative",
+  textDecoration: "none",
+  minHeight: 48,
+  paddingTop: 6,
+  paddingBottom: 6,
+  boxSizing: "border-box",
+  whiteSpace: "nowrap",
+  "&:hover": {
+    textDecoration: "none",
+    backgroundColor: (e.vars || e).palette.action.hover,
+    // Reset on touch devices, it doesn't add specificity
+    "@media (hover: none)": {
+      backgroundColor: "transparent"
     }
+  },
+  [`&.${d.selected}`]: {
+    backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})` : u(e.palette.primary.main, e.palette.action.selectedOpacity),
+    [`&.${d.focusVisible}`]: {
+      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : u(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
+    }
+  },
+  [`&.${d.selected}:hover`]: {
+    backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))` : u(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    "@media (hover: none)": {
+      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})` : u(e.palette.primary.main, e.palette.action.selectedOpacity)
+    }
+  },
+  [`&.${d.focusVisible}`]: {
+    backgroundColor: (e.vars || e).palette.action.focus
+  },
+  [`&.${d.disabled}`]: {
+    opacity: (e.vars || e).palette.action.disabledOpacity
+  },
+  [`& + .${M.root}`]: {
+    marginTop: e.spacing(1),
+    marginBottom: e.spacing(1)
+  },
+  [`& + .${M.inset}`]: {
+    marginLeft: 52
+  },
+  [`& .${h.root}`]: {
+    marginTop: 0,
+    marginBottom: 0
+  },
+  [`& .${h.inset}`]: {
+    paddingLeft: 36
+  },
+  [`& .${O.root}`]: {
+    minWidth: 36
+  },
+  variants: [{
+    props: ({
+      ownerState: o
+    }) => !o.disableGutters,
+    style: {
+      paddingLeft: 16,
+      paddingRight: 16
+    }
+  }, {
+    props: ({
+      ownerState: o
+    }) => o.divider,
+    style: {
+      borderBottom: `1px solid ${(e.vars || e).palette.divider}`,
+      backgroundClip: "padding-box"
+    }
+  }, {
+    props: ({
+      ownerState: o
+    }) => !o.dense,
+    style: {
+      [e.breakpoints.up("sm")]: {
+        minHeight: "auto"
+      }
+    }
+  }, {
+    props: ({
+      ownerState: o
+    }) => o.dense,
+    style: {
+      minHeight: 32,
+      // https://m2.material.io/components/menus#specs > Dense
+      paddingTop: 4,
+      paddingBottom: 4,
+      ...e.typography.body2,
+      [`& .${O.root} svg`]: {
+        fontSize: "1.25rem"
+      }
+    }
+  }]
+}))), T = /* @__PURE__ */ p.forwardRef(function(o, s) {
+  const r = z({
+    props: o,
+    name: "MuiMenuItem"
+  }), {
+    autoFocus: n = !1,
+    component: i = "li",
+    dense: a = !1,
+    divider: g = !1,
+    disableGutters: l = !1,
+    focusVisibleClassName: L,
+    role: R = "menuitem",
+    tabIndex: v,
+    className: S,
+    ...k
+  } = r, y = p.useContext($), x = p.useMemo(() => ({
+    dense: a || y.dense || !1,
+    disableGutters: l
+  }), [y.dense, a, l]), m = p.useRef(null);
+  q(() => {
+    n && (m.current ? m.current.focus() : process.env.NODE_ENV !== "production" && console.error("MUI: Unable to set focus to a MenuItem whose component has not been rendered."));
+  }, [n]);
+  const B = {
+    ...r,
+    dense: x.dense,
+    divider: g,
+    disableGutters: l
+  }, b = Q(r), j = A(m, s);
+  let C;
+  return r.disabled || (C = v !== void 0 ? v : -1), /* @__PURE__ */ c($.Provider, {
+    value: x,
+    children: /* @__PURE__ */ c(X, {
+      ref: j,
+      role: R,
+      tabIndex: C,
+      component: i,
+      focusVisibleClassName: w(b.focusVisible, L),
+      className: w(b.root, S),
+      ...k,
+      ownerState: B,
+      classes: b
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (T.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the list item is focused during the first mount.
+   * Focus will also be triggered if the value changes from false to true.
+   * @default false
+   */
+  autoFocus: t.bool,
+  /**
+   * The content of the component.
+   */
+  children: t.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: t.object,
+  /**
+   * @ignore
+   */
+  className: t.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: t.elementType,
+  /**
+   * If `true`, compact vertical padding designed for keyboard and mouse input is used.
+   * The prop defaults to the value inherited from the parent Menu component.
+   * @default false
+   */
+  dense: t.bool,
+  /**
+   * @ignore
+   */
+  disabled: t.bool,
+  /**
+   * If `true`, the left and right padding is removed.
+   * @default false
+   */
+  disableGutters: t.bool,
+  /**
+   * If `true`, a 1px light border is added to the bottom of the menu item.
+   * @default false
+   */
+  divider: t.bool,
+  /**
+   * This prop can help identify which element has keyboard focus.
+   * The class name will be applied when the element gains the focus through keyboard interaction.
+   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
+   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
+   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
+   * if needed.
+   */
+  focusVisibleClassName: t.string,
+  /**
+   * @ignore
+   */
+  role: t.string,
+  /**
+   * If `true`, the component is selected.
+   * @default false
+   */
+  selected: t.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
+  /**
+   * @default 0
+   */
+  tabIndex: t.number
+});
+const Y = D("div")(
+  ({ borderFocusColor: e, minWidth: o = "130px" }) => ({
+    ...V`
+      display: flex;
+      flex-wrap: nowrap;
+      align-items: center;
+      gap: 9px;
+      font-family: 'Roboto', sans-serif;
+      min-width: ${o};
 
-    .MuiButtonBase-root {
-      padding: 0;
+      .jcDropdownLabel {
+        white-space: nowrap;
+        font-weight: bold;
+        text-transform: capitalize;
+      }
 
-      input {
-        width: 19px;
-        height: 19px;
+      .MuiInputBase-input {
+        padding: 0;
+        padding-right: 0px !important;
+        min-height: 0;
       }
-    }
 
-    .Mui-checked {
-      color: ${i.colors.green} !important;
-    }
-  `
-})), h = ({
+      .MuiInputBase-root {
+        height: 18px;
+        padding: 2px 0;
+
+        ::before,
+        ::after {
+          border: none !important;
+        }
+
+        transition: 313ms all ease-out;
+        border-radius: 0;
+        border-bottom: 1px solid ${N.colors.gray};
+        width: 100%;
+
+        .Mui-select {
+          border: none !important;
+        }
+
+        :hover,
+        :focus-visible,
+        &.Mui-focused {
+          box-shadow: 0 -5px 4px -4px ${e} inset;
+        }
+      }
+
+      svg {
+        height: 19px;
+        width: 19px;
+        margin-right: -6px;
+      }
+    `
+  })
+), de = ({
   label: e,
-  colon: a = !1,
-  ...r
-}) => /* @__PURE__ */ o(l, { className: "jcLabeledDropdown", children: [
-  /* @__PURE__ */ o("span", { className: "jcDropdownLabel", children: [
+  colon: o = !0,
+  options: s,
+  borderFocusColor: r = N.colors.green,
+  // border primary
+  minWidth: n,
+  ...i
+}) => /* @__PURE__ */ I(Y, { className: "jcLabeledDropdown", borderFocusColor: r, minWidth: n, children: [
+  /* @__PURE__ */ I("span", { className: "jcDropdownLabel", children: [
     e,
-    a && ":"
+    o && ":"
   ] }),
-  /* @__PURE__ */ t(n, { ...r })
+  /* @__PURE__ */ c(F, { variant: "standard", fullWidth: !0, children: /* @__PURE__ */ c(P, { ...i, children: s.map((a) => /* @__PURE__ */ c(T, { value: a.value, children: a.label }, a.value)) }) })
 ] });
 export {
-  h as LabeledDropdown,
-  h as default
+  de as LabeledDropdown,
+  de as default
 };

package/LabeledDropdown/index.d.ts

@@ -1 +1 @@
-export {};
+export { default, type LabeledDropdownProps, type DropdownOption } from './LabeledDropdown.tsx';

package/LabeledDropdown/index.js

@@ -1 +1,4 @@
-
+import { LabeledDropdown as a } from "./LabeledDropdown.js";
+export {
+  a as default
+};

package/LabeledInput/LabeledInput.js

@@ -1,12 +1,12 @@
-import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
 import { n as p } from "../.chunks/emotion-styled.browser.esm.js";
 import { c as s } from "../.chunks/emotion-react.browser.esm.js";
 import { Input as n } from "../Input/Input.js";
-const i = p("div")(({ grid: e }) => ({
+const i = p("div")(({ grid: t }) => ({
   ...s`
     display: flex;
     flex-wrap: nowrap;
-    gap: 0.5rem;
+    gap: 9px;
     font-family: 'Roboto', sans-serif;
 
     span {
@@ -20,12 +20,12 @@ const i = p("div")(({ grid: e }) => ({
     }
 
     .MuiInputBase-root {
-      width: ${e && "100%"};
+      width: ${t && "100%"};
     }
   `
-})), c = ({ label: e, grid: o = !0, ...a }) => /* @__PURE__ */ t(i, { grid: o, className: "jcLabeledInput", children: [
-  /* @__PURE__ */ t("span", { children: [
-    e,
+})), c = ({ label: t, grid: o = !0, ...a }) => /* @__PURE__ */ e(i, { grid: o, className: "jcLabeledInput", children: [
+  /* @__PURE__ */ e("span", { children: [
+    t,
     ":"
   ] }),
   /* @__PURE__ */ r(n, { ...a })

package/Pagination/Pagination.js

@@ -2,7 +2,7 @@ import { jsx as d, jsxs as Z } from "react/jsx-runtime";
 import { n as aa } from "../.chunks/emotion-styled.browser.esm.js";
 import { c as ta } from "../.chunks/emotion-react.browser.esm.js";
 import * as G from "react";
-import { a as _, g as H, s as B, e as N, u as q, b as U, P as t, c as I, d as J } from "../.chunks/DefaultPropsProvider.js";
+import { g as _, a as H, s as B, d as N, u as q, c as U, P as t, e as I, b as J } from "../.chunks/DefaultPropsProvider.js";
 import { u as ea } from "../.chunks/useControlled.js";
 import { u as j, i as w } from "../.chunks/useSlot.js";
 import { u as oa } from "../.chunks/index.js";

package/Tooltip/Tooltip.js

@@ -1,6 +1,6 @@
 import { jsx as re, jsxs as Et } from "react/jsx-runtime";
 import * as C from "react";
-import { a as Ht, g as Ut, P as r, d as Ft, s as et, u as qt, c as zt, e as Yt, b as qe } from "../.chunks/DefaultPropsProvider.js";
+import { g as Ht, a as Ut, P as r, b as Ft, s as et, u as qt, e as zt, d as Yt, c as qe } from "../.chunks/DefaultPropsProvider.js";
 import { u as Xt, a as ze } from "../.chunks/index.js";
 import { o as Rt, P as fo, H as Qe, h as uo, a as mo, c as vo, g as ho, G as At, e as go } from "../.chunks/Portal.js";
 import { m as lt } from "../.chunks/memoTheme.js";

package/package.json

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