xtreme-ui
Version:
Collection of reusable components that can be used in web projects
40 lines (39 loc) • 1.32 kB
JavaScript
"use client";
import { jsx as u } from "react/jsx-runtime";
import { forwardRef as d } from "react";
import T from "clsx";
import { ColorPopper as C } from "../../base/ColorPopper/ColorPopper.js";
import { useXTheme as S } from "../../context/useContext.js";
import { useScreenType as w } from "../../hooks/useScreen.js";
import { isValidThemeColor as x } from "../../../utils/helper/colorHelper.js";
import { ThemeColorsPreset as b } from "../../../utils/constants/theme.js";
/* empty css */
const v = d((m, i) => {
const { className: l, input: o, size: t, withScheme: s = !0, withSwatch: h = !0, withWheel: c = !0 } = m, { themeScheme: a, setThemeScheme: p, themeColor: e, setThemeColor: n } = S(), r = w(), f = T(
"xtrThemeSelect",
l
);
return !e || !x(e) ? null : /* @__PURE__ */ u(
C,
{
ref: i,
className: f,
placeholder: "Theme",
alpha: !1,
hideWheel: !c,
swatch: h ? Object.values(b) : void 0,
colorHeading: "Theme Color",
schemeHeading: s ? "Appearance" : void 0,
themeScheme: a,
input: o || (r.isMobile ? "button" : "textfield"),
size: t || (r.isMobile ? "mini" : "default"),
setThemeScheme: p,
color: e,
setColor: n
}
);
});
v.displayName = "ThemeSelect";
export {
v as ThemeSelect
};