@lanaco/lnc-react-ui/dist/ThemeProvider.js

React component library

import { jsx as c, jsxs as m } from "react/jsx-runtime";
import { createContext as u, useContext as g, useState as p, useEffect as f } from "react";
import { t as d } from "./theme-mUflS4q4.js";
import { o as x, e as i, c as r } from "./utils-BUdHa0nB.js";
import { $ as h } from "./styled-components.browser.esm-Cfeh8eHg.js";
import { b as $ } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
const k = (e) => {
  const o = e.palette.disabled.color, t = e.palette[o][e.palette.disabled.background], l = e.palette.opacity[e.palette.disabled.opacity];
  return x(t, l ?? "100%");
}, y = (e) => {
  const o = e.palette.disabled.color;
  return e.palette[o][e.palette.disabled.text];
}, C = h`
* {
  --size-small: ${(e) => i(e.theme, "small")};
  --size-medium: ${(e) => i(e.theme, "medium")};
  --size-large: ${(e) => i(e.theme, "large")};
  --disabled-text: ${(e) => y(e.theme)};
  --disabled-bg: ${(e) => k(e.theme)};

  box-sizing: border-box;
  font-family: ${(e) => {
  var o, t;
  return (t = (o = e.theme) == null ? void 0 : o.typography) == null ? void 0 : t.fontFamily;
}};
  -webkit-tap-highlight-color: transparent;

  & i {
    font-family: "Font Awesome 5 Free";
  }

  & .lnc-doc {
    & th {
      background-color: ${(e) => r(
  e.theme,
  "Background",
  "default",
  "enabled",
  "background"
)} !important;
        color: ${(e) => r(
  e.theme,
  "Text",
  "default",
  "enabled",
  "text"
)} !important;
    }
    & td {
      background-color: ${(e) => r(
  e.theme,
  "Background",
  "default",
  "enabled",
  "background"
)} !important;
        color: ${(e) => r(
  e.theme,
  "Text",
  "default",
  "enabled",
  "text"
)} !important;
    }
  }

  & .sbdocs {
    background-color: ${(e) => r(
  e.theme,
  "Background",
  "default",
  "enabled",
  "background"
)} !important;
    color: ${(e) => r(
  e.theme,
  "Text",
  "default",
  "enabled",
  "text"
)} !important;
  }
}
  body {
    position: relative;
    background-color: ${(e) => r(
  e.theme,
  "Background",
  "default",
  "enabled",
  "background"
)};
    color: ${(e) => r(e.theme, "Text", "default", "enabled", "text")};
  }
`, b = u(), F = () => g(b), H = ({ theme: e = "Lanaco Light", children: o }) => {
  const [t, l] = p(() => {
    var a;
    return typeof e == "string" ? (a = d) == null ? void 0 : a.find((n) => n.name == e) : e;
  });
  f(() => {
    var a;
    l(typeof e == "string" ? (a = d) == null ? void 0 : a.find((n) => n.name == e) : e);
  }, [e]);
  const s = () => {
    var a;
    l(typeof e == "string" ? (a = d) == null ? void 0 : a.find((n) => n.name == e) : e);
  };
  return /* @__PURE__ */ c(
    b.Provider,
    {
      value: { theme: t, switchTheme: s },
      children: /* @__PURE__ */ m($, { theme: t, children: [
        /* @__PURE__ */ c(C, { theme: t }),
        o
      ] })
    }
  );
};
export {
  H as default,
  F as useTheme
};