@playbooks/ui
Version:
An interface library for Playbooks.
71 lines (70 loc) • 2.99 kB
JavaScript
"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require$$0 = require("react/jsx-runtime");
const html = require("./toast-context-kVz4KXNu.cjs");
const ModalLoader = ({
name = "ModalLoader",
title = "Processing Order",
message = "Give us a second...",
tailwind,
className,
children,
...props
}) => {
const { theme } = html.useInterface();
const base = theme.modalLoader();
const computed = { ...base, ...props, tailwind, className, name };
return /* @__PURE__ */ require$$0.jsx(html.Div, { ...computed, children: /* @__PURE__ */ require$$0.jsxs(html.Span, { children: [
/* @__PURE__ */ require$$0.jsx(html.Oval, { size: "w-14 h-14", className: "stroke-gray-600 dark:stroke-gray-300 mb-4" }),
/* @__PURE__ */ require$$0.jsxs(html.Div, { spacing: "space-y-1", className: "text-center", children: [
title && /* @__PURE__ */ require$$0.jsx(html.H5, { tailwind: { fontWeight: "font-bold" }, children: title }),
message && /* @__PURE__ */ require$$0.jsx(html.Small, { children: message }),
children
] })
] }) });
};
const PageLoader = ({
name = "PageLoader",
title = "Hang Tight",
message = "Loading dashboard...",
tailwind,
className,
children,
...props
}) => {
const { theme } = html.useInterface();
const base = theme.pageLoader();
const computed = { ...base, ...props, tailwind, className, name };
return /* @__PURE__ */ require$$0.jsx(html.Div, { ...computed, children: /* @__PURE__ */ require$$0.jsxs(html.Span, { display: "flex-start", space: "space-x-8", children: [
/* @__PURE__ */ require$$0.jsx(html.Oval, { size: "w-12 h-12", className: "stroke-gray-600 dark:stroke-gray-300" }),
/* @__PURE__ */ require$$0.jsxs(html.Div, { align: "text-left", children: [
title && /* @__PURE__ */ require$$0.jsx(html.H5, { tailwind: { fontWeight: "font-bold" }, children: title }),
message && /* @__PURE__ */ require$$0.jsx(html.P, { children: message }),
children
] })
] }) });
};
const SectionLoader = ({
name = "SectionLoader",
title = "Loading",
message = "Give us a second...",
tailwind,
className,
children,
...props
}) => {
const { theme } = html.useInterface();
const base = theme.sectionLoader();
const computed = { ...base, ...props, tailwind, className, name };
return /* @__PURE__ */ require$$0.jsxs(html.Div, { ...computed, children: [
/* @__PURE__ */ require$$0.jsx(html.Oval, { size: "w-12 h-12", className: "stroke-gray-600 dark:stroke-gray-300 mb-4" }),
/* @__PURE__ */ require$$0.jsxs(html.Div, { spacing: "space-y-1", className: "text-center", children: [
title && /* @__PURE__ */ require$$0.jsx(html.H5, { tailwind: { fontWeight: "font-bold" }, children: title }),
message && /* @__PURE__ */ require$$0.jsx(html.Small, { children: message }),
children
] })
] });
};
exports.ModalLoader = ModalLoader;
exports.PageLoader = PageLoader;
exports.SectionLoader = SectionLoader;