@vehiclehistory/property-lib 0.0.5 → 0.0.6

package/dist/assets/LoadingBar.css

@@ -0,0 +1 @@
+.loading-bar{@apply bg-gray-50 overflow-hidden relative;box-shadow:2px 0 10px inset #0003}.loading-bar .loading-bar--inner{@apply w-0 h-full;background-size:30px 30px;animation:move 2s linear infinite;box-shadow:2px 0 10px inset #0003}.loading-bar.loading-bar--primary{@apply rounded-md;}.loading-bar.loading-bar--primary .loading-bar--inner{@apply bg-[#767676];background-image:linear-gradient(-45deg,rgba(255,255,255,.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.2) 50%,rgba(255,255,255,.2) 75%,transparent 75%,transparent)}.loading-bar.loading-bar--secondary .loading-bar--inner{@apply bg-[#909090];}.loading-bar .perc{@apply absolute top-1/2 left-1/2 -translate-y-1/2 -translate-x-1/2 text-white font-bold;}

package/dist/components/Accordion/Accordion.js

@@ -0,0 +1,69 @@
+import { jsx as e, jsxs as i, Fragment as b } from "react/jsx-runtime";
+import { memo as u, useState as f } from "react";
+import g from "../Icon/Icon.js";
+import o from "classnames";
+const p = ({
+  children: a,
+  className: d,
+  clickHandler: s,
+  panelClass: n,
+  title: t,
+  unmount: c = !0,
+  isOpen: l = !1
+}) => {
+  const [r, m] = f(l);
+  return /* @__PURE__ */ e("div", { className: o("shadow rounded-lg", d), children: /* @__PURE__ */ i(b, { children: [
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        "data-div-track": `report | accordion | ${t}`,
+        className: o(
+          "acc-a flex w-full justify-between items-center bg-gray-50 px-4 py-2 text-left font-medium text-slate-700 border border-gray-200 focus:outline-none focus-visible:ring focus-visible:ring-gray-500 focus-visible:ring-opacity-75",
+          {
+            "acc-o": r
+          }
+        ),
+        title: t,
+        onClick: () => {
+          m(!r), s && s(!r);
+        },
+        children: [
+          /* @__PURE__ */ e("div", { className: "font-medium text-slate-700 sm-max:!text-base text-lg flex items-center", children: t }),
+          /* @__PURE__ */ e("span", { className: "ml-6 h-7 flex items-center", children: /* @__PURE__ */ e(
+            g,
+            {
+              name: "chevronDown",
+              size: "small",
+              className: "transition-all duration-75"
+            }
+          ) })
+        ]
+      }
+    ),
+    c && r && /* @__PURE__ */ e(
+      "div",
+      {
+        className: o(
+          "acc-p p-4 border-x border-b rounded-bl-lg rounded-br-lg border-gray-200 relative",
+          n
+        ),
+        children: a
+      }
+    ),
+    !c && /* @__PURE__ */ e(
+      "div",
+      {
+        className: o(
+          "acc-p p-4 border-x border-b rounded-bl-lg rounded-br-lg border-gray-200 relative",
+          n,
+          { hidden: !r }
+        ),
+        children: a
+      }
+    )
+  ] }) });
+}, N = u(p);
+export {
+  N as default
+};

package/dist/components/Alert/Alert.js

@@ -0,0 +1,66 @@
+import { jsx as e, jsxs as o } from "react/jsx-runtime";
+import { memo as f } from "react";
+import s from "classnames";
+import h from "../Icon/Icon.js";
+const g = ({
+  children: y,
+  className: t = "",
+  messages: r = [],
+  title: i = "",
+  titleClass: n = "",
+  props: c = {},
+  type: l = "error"
+}) => {
+  const d = {
+    error: {
+      icon: "error",
+      iconColor: "text-red-500",
+      styles: "bg-red-500/10 border-red-300 text-red-700"
+    },
+    info: {
+      icon: "info",
+      iconColor: "text-blue-500",
+      styles: "bg-blue-50 border-blue-300 text-blue-800"
+    },
+    success: {
+      icon: "success",
+      iconColor: "text-green-500",
+      styles: "bg-green-50 border-green-300 text-green-800"
+    },
+    warning: {
+      icon: "warningAlert",
+      iconColor: "text-yellow-500",
+      styles: "bg-yellow-50 border-yellow-300 text-yellow-700"
+    }
+  }, { icon: m, iconColor: a, styles: x } = d[l];
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      id: l,
+      className: s(
+        "rounded w-full py-2 px-4 mb-4 border",
+        x,
+        t
+      ),
+      ...c,
+      children: /* @__PURE__ */ o("div", { className: "flex", children: [
+        /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(
+          h,
+          {
+            name: m,
+            viewBox: "0 0 24 24",
+            className: a,
+            size: "xSmall"
+          }
+        ) }),
+        /* @__PURE__ */ o("div", { className: "ml-3", children: [
+          /* @__PURE__ */ e("div", { className: s("font-medium text-sm", n), children: i }),
+          r.length > 0 ? /* @__PURE__ */ e("div", { className: "mt-2 text-xs", children: /* @__PURE__ */ e("ul", { role: "list", className: "list-disc space-y-1 pl-5", children: r.map((b, u) => /* @__PURE__ */ e("li", { children: b }, u)) }) }) : ""
+        ] })
+      ] })
+    }
+  );
+}, C = f(g);
+export {
+  C as default
+};

package/dist/components/Autocomplete/Autocomplete.js

@@ -0,0 +1,173 @@
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import l from "classnames";
+import s from "../Icon/Icon.js";
+const A = ({
+  autoFocus: p = !1,
+  required: h = !1,
+  className: u = "",
+  defaultValue: x = "",
+  id: f = "",
+  type: b,
+  floatingLabel: r = "",
+  inputClass: g = "",
+  leftIcon: w = "homeSearch",
+  mobileBackdrop: y = !1,
+  showSearchIcon: o = !0,
+  options: d = [],
+  name: v = "",
+  placeholder: i = "",
+  props: N = {},
+  size: a = "medium",
+  styles: m = null,
+  title: B = ""
+}) => /* @__PURE__ */ c(
+  "div",
+  {
+    id: f,
+    "data-search": "container",
+    "data-search-type": b,
+    className: l("Autocomplete", u),
+    style: m ? { ...m } : null,
+    children: [
+      o && /* @__PURE__ */ c(
+        "span",
+        {
+          className: l(
+            "search-icon-left absolute inset-y-0 left-0 flex items-center pl-2",
+            {
+              "pointer-events-none": y
+            }
+          ),
+          children: [
+            /* @__PURE__ */ e(
+              s,
+              {
+                className: "home-search select-none text-gray-500",
+                name: w,
+                size: a === "xLarge" ? "small" : "xSmall",
+                viewBox: "0 0 24 24"
+              }
+            ),
+            /* @__PURE__ */ e(
+              s,
+              {
+                className: "arrow-left select-none text-gray-500 hidden",
+                name: "arrowLeft",
+                size: a === "xLarge" ? "small" : "xSmall",
+                viewBox: "0 0 24 24"
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ e(
+        "input",
+        {
+          "data-lpignore": "true",
+          autoFocus: p,
+          className: l(
+            "w-full bg-white placeholder:bg-white rounded border border-gray-300 py-2 pr-8 shadow-sm focus:outline-none sm-max:text-sm placeholder:text-gray-500 sm-max:placeholder:text-sm placeholder-shown:text-ellipsis truncate",
+            {
+              "pl-8": o === !0,
+              "px-3 h-10": a === "medium",
+              "px-4 h-12": a === "large",
+              "px-5 h-[60px] sm:!text-base": a === "xLarge",
+              peer: r
+            },
+            g
+          ),
+          required: h,
+          autoComplete: "off",
+          value: x,
+          placeholder: !i && r ? " " : i,
+          type: "search",
+          name: v || "search-input",
+          "data-id": "search-input",
+          ...N
+        }
+      ),
+      r && /* @__PURE__ */ e(
+        "label",
+        {
+          className: l(
+            "floating-label absolute text-sm !normal-case text-gray-500 duration-300 transform -translate-y-4 scale-75 top-2 z-10 origin-[0] bg-white px-2 peer-focus:text-[#222] peer-focus:px-2 peer-focus:bg-white peer-placeholder-shown:bg-white peer-placeholder-shown:scale-100 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:top-1/2 peer-focus:top-2 peer-focus:scale-75 peer-focus:-translate-y-4 start-1 pointer-events-none",
+            {
+              "!left-7": o === !0,
+              "left-2": a === "medium",
+              "left-3": a === "large",
+              "left-4": a === "xLarge"
+            }
+          ),
+          children: r
+        }
+      ),
+      /* @__PURE__ */ e(
+        "span",
+        {
+          "data-id": "search-clear",
+          className: "clear-btn absolute inset-y-0 right-0 flex items-center px-2 hidden",
+          children: /* @__PURE__ */ e(
+            s,
+            {
+              className: "cursor-pointer text-gray-500",
+              name: "xCircle",
+              size: "xSmall",
+              viewBox: "0 0 20 20"
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e(
+        "span",
+        {
+          "data-id": "search-loading",
+          className: "absolute inset-y-0 right-0 flex items-center px-2 pointer-events-none hidden",
+          children: /* @__PURE__ */ e(
+            s,
+            {
+              className: "animate-spin text-[#222]] pointer-events-none",
+              name: "spinnerDark",
+              size: "xSmall",
+              viewBox: "0 0 24 24"
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ c(
+        "div",
+        {
+          "data-id": "search-dropdown",
+          className: "dropdown absolute z-[15] w-full bg-white shadow-lg max-h-56 rounded-bl rounded-br py-1 overflow-auto focus:outline-none sm:text-sm sm:custom-scrollbar border-x border-b border-gray-300 hidden",
+          children: [
+            /* @__PURE__ */ e("div", { "data-id": "search-dropdown-header" }),
+            /* @__PURE__ */ e(
+              "ul",
+              {
+                "data-id": "search-dropdown-body",
+                role: "listbox",
+                "data-title": B,
+                "aria-labelledby": "Label",
+                "aria-activedescendant": "search-item-0",
+                children: d.length > 0 ? d.map((t, n) => /* @__PURE__ */ e(
+                  "li",
+                  {
+                    id: `search-item-${n}`,
+                    tabIndex: -1,
+                    className: "dropdown-item text-gray-900 cursor-default select-none py-2 pl-3 pr-4 truncate hover:bg-gray-50 font-normal focus:bg-gray-50 focus:text-green-400 focus-visible:outline-0",
+                    "aria-selected": n === 0,
+                    role: "option",
+                    children: (t == null ? void 0 : t.name) || t
+                  },
+                  `search-item-${n}`
+                )) : ""
+              }
+            )
+          ]
+        }
+      )
+    ]
+  }
+);
+export {
+  A as default
+};

package/dist/components/Badge/Badge.js

@@ -0,0 +1,25 @@
+import { jsx as m } from "react/jsx-runtime";
+import o from "classnames";
+const n = ({
+  children: t,
+  className: x = "",
+  size: s = "sm",
+  tag: a = "span"
+}) => /* @__PURE__ */ m(
+  a || "span",
+  {
+    className: o(
+      " bg-gray-200 font-semibold py-1 px-2 rounded-md",
+      {
+        "text-sm": s === "sm",
+        "text-xs": s === "xs",
+        "text-xxs !py-0.5 !px-1.5": s === "xxs"
+      },
+      x
+    ),
+    children: t
+  }
+);
+export {
+  n as default
+};

package/dist/components/Button/Button.js

@@ -0,0 +1,43 @@
+import { jsx as c } from "react/jsx-runtime";
+import { memo as B } from "react";
+import p from "classnames";
+const y = ({
+  children: u,
+  className: m = "",
+  disabled: n = !1,
+  href: o,
+  props: r = {},
+  rounded: a = !1,
+  type: e = "button",
+  uppercase: l = !1,
+  variation: t = "primary"
+}) => {
+  const s = o ? "a" : "button";
+  return /* @__PURE__ */ c(
+    s,
+    {
+      type: s !== "a" ? e : null,
+      className: p(
+        "Button",
+        {
+          "Button--primary": t === "primary",
+          "Button--secondary": t === "secondary",
+          "Button--rounded": a,
+          "Button--icon": t === "icon",
+          "Button--link": t === "link",
+          "Button--disabled": n,
+          "custom-link": o
+        },
+        l,
+        m
+      ),
+      disabled: n,
+      href: o,
+      ...r,
+      children: u
+    }
+  );
+}, k = B(y);
+export {
+  k as default
+};

package/dist/components/ButtonGroup/ButtonGroup.js

@@ -0,0 +1,6 @@
+import { jsx as e } from "react/jsx-runtime";
+import o from "classnames";
+const i = ({ children: r, className: d }) => /* @__PURE__ */ e("div", { className: o("flex md:max-w-min border border-gray-300 divide-x divide-gray-200 rounded-lg", d), children: r });
+export {
+  i as default
+};

package/dist/components/Card/Card.js

@@ -0,0 +1,32 @@
+import { jsx as o } from "react/jsx-runtime";
+import u from "classnames";
+const c = ({
+  block: e = !1,
+  borderless: r = !1,
+  children: s,
+  className: a = "",
+  divider: f = !0,
+  inset: l = !0,
+  id: t = null,
+  role: m = null
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    className: u(
+      "bg-white",
+      {
+        f1: !r,
+        f2: e,
+        f3: f,
+        f4: l
+      },
+      a
+    ),
+    id: t,
+    role: m,
+    children: s
+  }
+);
+export {
+  c as default
+};

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,44 @@
+import { jsxs as d, jsx as i } from "react/jsx-runtime";
+import { memo as h } from "react";
+import o from "classnames";
+const p = ({
+  checked: s = !1,
+  children: c,
+  className: t = "",
+  error: a = !1,
+  id: e = "",
+  label: l = "",
+  name: m = "",
+  props: b = {},
+  variation: f = "primary",
+  value: n = ""
+}) => {
+  const r = l ? "div" : "label", x = r === "label" ? { htmlFor: e } : {};
+  return /* @__PURE__ */ d(
+    r,
+    {
+      className: o("checkbox flex items-center", f, t),
+      ...x,
+      children: [
+        /* @__PURE__ */ i(
+          "input",
+          {
+            checked: s,
+            className: o("form-checkbox ", {
+              "!border-red-500 !bg-red-500 focus:!ring-red-500 focus:!border-red-500": a
+            }),
+            id: e,
+            name: m,
+            type: "checkbox",
+            value: n,
+            ...b
+          }
+        ),
+        c
+      ]
+    }
+  );
+}, j = h(p);
+export {
+  j as default
+};

package/dist/components/Container/Container.js

@@ -0,0 +1,33 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { memo as d } from "react";
+import l from "classnames";
+const o = ({ children: a, aside: r, direction: m = "right" }) => /* @__PURE__ */ s("div", { className: "flex flex-col lg:flex-row lg:p-0 max-w-screen-lg", children: [
+  /* @__PURE__ */ e(
+    "main",
+    {
+      className: l(
+        "w-full md:mb-0 flex-1 md:block lg:max-w-container",
+        {
+          "lg:order-2": m === "left"
+        }
+      ),
+      children: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    "aside",
+    {
+      className: l(
+        "sm-max:hidden md:hidden lg:block flex-1 max-w-aside mb-6 md:mb-0 empty:!hidden",
+        {
+          "md:ml-8": m === "right",
+          "md:mr-8": m === "left"
+        }
+      ),
+      children: r
+    }
+  )
+] }), f = d(o);
+export {
+  f as default
+};

package/dist/components/Dialog/Dialog.js

@@ -0,0 +1,88 @@
+import { jsxs as a, Fragment as N, jsx as e } from "react/jsx-runtime";
+import { memo as $ } from "react";
+import i from "classnames";
+import j from "../Icon/Icon.js";
+const v = ({
+  activator: s,
+  id: o = "",
+  children: t,
+  className: d = "",
+  contentClass: n = "",
+  dark: c = !1,
+  footer: r,
+  fullMobile: m = !0,
+  headerClass: g = "",
+  hideClose: f = !1,
+  iconSize: h = "medium",
+  preventPageScroll: p = !0,
+  stickyHeader: u = !1,
+  title: l = "",
+  titleClass: b = ""
+}) => /* @__PURE__ */ a(N, { children: [
+  s && /* @__PURE__ */ e("span", { id: `${o}-dialog-activator`, children: s }),
+  /* @__PURE__ */ e(
+    "dialog",
+    {
+      inert: "",
+      id: `${o}-dialog`,
+      className: i(
+        "dialog",
+        {
+          "dialog-full-mobile": m,
+          dark: c,
+          "prevent-scroll": p
+        },
+        d
+      ),
+      children: /* @__PURE__ */ a("form", { method: "dialog", children: [
+        /* @__PURE__ */ a(
+          "header",
+          {
+            className: i(
+              "dialog-header flex items-center p-4",
+              {
+                "sticky top-0 bg-white z-10": u,
+                "!pb-0 border-0 justify-end": !l,
+                "justify-between border-b": l
+              },
+              g
+            ),
+            children: [
+              l && /* @__PURE__ */ e("h3", { id: `${o}-dialog-title`, className: b, children: l }),
+              !f && /* @__PURE__ */ e(
+                "button",
+                {
+                  type: "button",
+                  title: "Close",
+                  className: "dialog-close",
+                  "data-dialog-close": "",
+                  value: "close",
+                  children: /* @__PURE__ */ e(
+                    j,
+                    {
+                      name: "close",
+                      size: h,
+                      className: "pointer-events-none"
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            id: `${o}-dialog-content`,
+            className: i("dialog-content", n),
+            children: t
+          }
+        ),
+        r && /* @__PURE__ */ e("footer", { id: `${o}-dialog-footer`, className: "dialog-footer", children: r })
+      ] })
+    }
+  )
+] }), D = $(v);
+export {
+  D as default
+};