tailwind-joy/dist/tw-extension.js

React component library that styles the components of Joy UI in the Tailwind CSS way.

import { tjSafelist as h } from "./safelist.js";
function j(e) {
  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
}
var s = {}, u = {}, d;
function _() {
  return d || (d = 1, function(e) {
    Object.defineProperty(e, "__esModule", {
      value: !0
    }), Object.defineProperty(e, "default", {
      enumerable: !0,
      get: function() {
        return a;
      }
    });
    function n(t, r) {
      return {
        handler: t,
        config: r
      };
    }
    n.withOptions = function(t, r = () => ({})) {
      const i = function(o) {
        return {
          __options: o,
          handler: t(o),
          config: r(o)
        };
      };
      return i.__isOptionsFunction = !0, i.__pluginFunction = t, i.__configFunction = r, i;
    };
    const a = n;
  }(u)), u;
}
var g;
function v() {
  return g || (g = 1, function(e) {
    Object.defineProperty(e, "__esModule", {
      value: !0
    }), Object.defineProperty(e, "default", {
      enumerable: !0,
      get: function() {
        return t;
      }
    });
    const n = /* @__PURE__ */ a(_());
    function a(r) {
      return r && r.__esModule ? r : {
        default: r
      };
    }
    const t = n.default;
  }(s)), s;
}
var f, p;
function y() {
  if (p) return f;
  p = 1;
  let e = v();
  return f = (e.__esModule ? e : { default: e }).default, f;
}
var P = y();
const b = /* @__PURE__ */ j(P), c = {
  common: {
    black: "#000",
    white: "#fff"
  },
  primary: {
    50: "#edf5fd",
    100: "#e3effb",
    200: "#c7dff7",
    300: "#97c3f0",
    400: "#4393e4",
    500: "#0b6bcb",
    600: "#185ea5",
    700: "#12467b",
    800: "#0a2744",
    900: "#051423"
  },
  neutral: {
    50: "#fbfcfe",
    100: "#f0f4f8",
    200: "#dde7ee",
    300: "#cdd7e1",
    400: "#9fa6ad",
    500: "#636b74",
    600: "#555e68",
    700: "#32383e",
    800: "#171a1c",
    900: "#0b0d0e"
  },
  danger: {
    50: "#fef6f6",
    100: "#fce4e4",
    200: "#f7c5c5",
    300: "#f09898",
    400: "#e47474",
    500: "#c41c1c",
    600: "#a51818",
    700: "#7d1212",
    800: "#430a0a",
    900: "#240505"
  },
  success: {
    50: "#f6fef6",
    100: "#e3fbe3",
    200: "#c7f7c7",
    300: "#a1e8a1",
    400: "#51bc51",
    500: "#1f7a1f",
    600: "#136c13",
    700: "#0a470a",
    800: "#042f04",
    900: "#021d02"
  },
  warning: {
    50: "#fefaf6",
    100: "#fdf0e1",
    200: "#fce1c2",
    300: "#f3c896",
    400: "#ea9a3e",
    500: "#9a5b13",
    600: "#72430d",
    700: "#492b08",
    800: "#2e1b05",
    900: "#1d1002"
  }
}, w = h.join(" "), M = {
  colors: {
    joy: c
  },
  keyframes: {
    "joy-circulate": {
      "0%": {
        transform: "rotate(-90deg)"
      },
      "100%": {
        transform: "rotate(270deg)"
      }
    },
    "joy-linear-circulate": {
      "0%": {
        left: "var(--_LinearProgress-progressInset)",
        width: "var(--LinearProgress-progressMinWidth)"
      },
      "25%": {
        width: "var(--LinearProgress-progressMaxWidth)"
      },
      "50%": {
        left: "var(--_LinearProgress-progressLeft)",
        width: "var(--LinearProgress-progressMinWidth)"
      },
      "75%": {
        width: "var(--LinearProgress-progressMaxWidth)"
      },
      "100%": {
        left: "var(--_LinearProgress-progressInset)",
        width: "var(--LinearProgress-progressMinWidth)"
      }
    },
    "joy-pulse": {
      "0%": {
        opacity: "1"
      },
      "50%": {
        opacity: "0.8",
        background: "var(--unstable_pulse-bg)"
      },
      "100%": {
        opacity: "1"
      }
    },
    "joy-wave": {
      "0%": {
        transform: "translateX(-100%)"
      },
      "50%": {
        transform: "translateX(100%)"
      },
      "100%": {
        transform: "translateX(100%)"
      }
    }
  },
  animation: {
    "joy-circulate": "joy-circulate 0.8s linear 0s infinite normal none running",
    "joy-linear-circulate": "joy-linear-circulate var(--LinearProgress-circulation, 2.5s ease-in-out 0s infinite normal none running)",
    "joy-pulse": "joy-pulse 2s ease-in-out 0.5s infinite",
    "joy-wave": "joy-wave 1.6s linear 0.5s infinite"
  }
};
function l(e, n) {
  const a = n ? `${n}-` : "";
  return Object.entries(e).flatMap(([t, r]) => typeof r == "object" ? l(r ?? {}, `${a}${t}`) : [[`${a}${t}`, r]]);
}
const O = b(
  ({ addBase: e, addUtilities: n, matchUtilities: a, addVariant: t, matchVariant: r }) => {
    e({
      ":root": {
        "--pi": "3.1415926535",
        ...Object.fromEntries(l(c, "--color-joy")),
        // deprecated
        ...Object.fromEntries(l(c, "--joy"))
      }
    }), t(
      "non-touchscreen-hover",
      "@media (hover: hover) and (pointer: fine) { &:hover }"
    ), t("non-touchscreen", "@media (hover: hover) and (pointer: fine)");
  }
);
export {
  w as tjClassNames,
  O as tjPlugin,
  M as tjTheme
};