UNPKG

@playbooks/ui

Version:

An interface library for Playbooks.

536 lines (535 loc) 19.3 kB
import require$$1, { jsx } from "react/jsx-runtime"; import { g as getDefaultExportFromCjs } from "./_commonjsHelpers-DWwsNxpa-CUmg6egw.js"; import React__default from "react"; import { useUI } from "./context.es.js"; import { Div } from "./html.es.js"; const isArray = (data) => { return Array.isArray(data); }; const isObject = (data) => { return data !== null && data && typeof data === "object"; }; const isEmpty = (data) => { if (data === null || data === void 0 || data === "undefined") { return true; } if (isArray(data)) { return data.length === 0 ? true : false; } if (isObject(data)) { return Object.keys(data).length === 0 ? true : false; } return data.length === 0 ? true : false; }; const computeTailwind = (props) => { let classes = ""; Object.keys(props).filter((key, i, s) => s.indexOf(key) === i).map((key) => { const data = props[key]; if (isArray(data)) return; if (isObject(data)) return; if (isEmpty(data)) return; if (typeof data === "function") return; classes = classes.concat(data + " "); }); return classes; }; var dynamic$2 = { exports: {} }; var _interop_require_default = {}; var hasRequired_interop_require_default; function require_interop_require_default() { if (hasRequired_interop_require_default) return _interop_require_default; hasRequired_interop_require_default = 1; function _interop_require_default$1(obj) { return obj && obj.__esModule ? obj : { default: obj }; } _interop_require_default._ = _interop_require_default$1; return _interop_require_default; } function commonjsRequire(path) { throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.'); } var loadable_sharedRuntime = {}; var loadableContext_sharedRuntime = {}; var hasRequiredLoadableContext_sharedRuntime; function requireLoadableContext_sharedRuntime() { if (hasRequiredLoadableContext_sharedRuntime) return loadableContext_sharedRuntime; hasRequiredLoadableContext_sharedRuntime = 1; (function(exports) { "use client"; Object.defineProperty(exports, "__esModule", { value: true }); Object.defineProperty(exports, "LoadableContext", { enumerable: true, get: function() { return LoadableContext; } }); const _interop_require_default2 = /* @__PURE__ */ require_interop_require_default(); const _react = /* @__PURE__ */ _interop_require_default2._(React__default); const LoadableContext = _react.default.createContext(null); if (process.env.NODE_ENV !== "production") { LoadableContext.displayName = "LoadableContext"; } })(loadableContext_sharedRuntime); return loadableContext_sharedRuntime; } var hasRequiredLoadable_sharedRuntime; function requireLoadable_sharedRuntime() { if (hasRequiredLoadable_sharedRuntime) return loadable_sharedRuntime; hasRequiredLoadable_sharedRuntime = 1; (function(exports) { Object.defineProperty(exports, "__esModule", { value: true }); Object.defineProperty(exports, "default", { enumerable: true, get: function() { return _default; } }); const _interop_require_default2 = /* @__PURE__ */ require_interop_require_default(); const _react = /* @__PURE__ */ _interop_require_default2._(React__default); const _loadablecontextsharedruntime = requireLoadableContext_sharedRuntime(); function resolve(obj) { return obj && obj.default ? obj.default : obj; } const ALL_INITIALIZERS = []; const READY_INITIALIZERS = []; let initialized = false; function load(loader) { let promise = loader(); let state = { loading: true, loaded: null, error: null }; state.promise = promise.then((loaded) => { state.loading = false; state.loaded = loaded; return loaded; }).catch((err) => { state.loading = false; state.error = err; throw err; }); return state; } function createLoadableComponent(loadFn, options) { let opts = Object.assign({ loader: null, loading: null, delay: 200, timeout: null, webpack: null, modules: null }, options); let subscription = null; function init() { if (!subscription) { const sub = new LoadableSubscription(loadFn, opts); subscription = { getCurrentValue: sub.getCurrentValue.bind(sub), subscribe: sub.subscribe.bind(sub), retry: sub.retry.bind(sub), promise: sub.promise.bind(sub) }; } return subscription.promise(); } if (typeof window === "undefined") { ALL_INITIALIZERS.push(init); } if (!initialized && typeof window !== "undefined") { const moduleIds = opts.webpack && typeof commonjsRequire.resolveWeak === "function" ? opts.webpack() : opts.modules; if (moduleIds) { READY_INITIALIZERS.push((ids) => { for (const moduleId of moduleIds) { if (ids.includes(moduleId)) { return init(); } } }); } } function useLoadableModule() { init(); const context = _react.default.useContext(_loadablecontextsharedruntime.LoadableContext); if (context && Array.isArray(opts.modules)) { opts.modules.forEach((moduleName) => { context(moduleName); }); } } function LoadableComponent(props, ref) { useLoadableModule(); const state = _react.default.useSyncExternalStore(subscription.subscribe, subscription.getCurrentValue, subscription.getCurrentValue); _react.default.useImperativeHandle(ref, () => ({ retry: subscription.retry }), []); return _react.default.useMemo(() => { if (state.loading || state.error) { return /* @__PURE__ */ _react.default.createElement(opts.loading, { isLoading: state.loading, pastDelay: state.pastDelay, timedOut: state.timedOut, error: state.error, retry: subscription.retry }); } else if (state.loaded) { return /* @__PURE__ */ _react.default.createElement(resolve(state.loaded), props); } else { return null; } }, [ props, state ]); } LoadableComponent.preload = () => init(); LoadableComponent.displayName = "LoadableComponent"; return /* @__PURE__ */ _react.default.forwardRef(LoadableComponent); } class LoadableSubscription { promise() { return this._res.promise; } retry() { this._clearTimeouts(); this._res = this._loadFn(this._opts.loader); this._state = { pastDelay: false, timedOut: false }; const { _res: res, _opts: opts } = this; if (res.loading) { if (typeof opts.delay === "number") { if (opts.delay === 0) { this._state.pastDelay = true; } else { this._delay = setTimeout(() => { this._update({ pastDelay: true }); }, opts.delay); } } if (typeof opts.timeout === "number") { this._timeout = setTimeout(() => { this._update({ timedOut: true }); }, opts.timeout); } } this._res.promise.then(() => { this._update({}); this._clearTimeouts(); }).catch((_err) => { this._update({}); this._clearTimeouts(); }); this._update({}); } _update(partial) { this._state = { ...this._state, error: this._res.error, loaded: this._res.loaded, loading: this._res.loading, ...partial }; this._callbacks.forEach((callback) => callback()); } _clearTimeouts() { clearTimeout(this._delay); clearTimeout(this._timeout); } getCurrentValue() { return this._state; } subscribe(callback) { this._callbacks.add(callback); return () => { this._callbacks.delete(callback); }; } constructor(loadFn, opts) { this._loadFn = loadFn; this._opts = opts; this._callbacks = /* @__PURE__ */ new Set(); this._delay = null; this._timeout = null; this.retry(); } } function Loadable(opts) { return createLoadableComponent(load, opts); } function flushInitializers(initializers, ids) { let promises = []; while (initializers.length) { let init = initializers.pop(); promises.push(init(ids)); } return Promise.all(promises).then(() => { if (initializers.length) { return flushInitializers(initializers, ids); } }); } Loadable.preloadAll = () => { return new Promise((resolveInitializers, reject) => { flushInitializers(ALL_INITIALIZERS).then(resolveInitializers, reject); }); }; Loadable.preloadReady = (ids) => { if (ids === void 0) ids = []; return new Promise((resolvePreload) => { const res = () => { initialized = true; return resolvePreload(); }; flushInitializers(READY_INITIALIZERS, ids).then(res, res); }); }; if (typeof window !== "undefined") { window.__NEXT_PRELOADREADY = Loadable.preloadReady; } const _default = Loadable; })(loadable_sharedRuntime); return loadable_sharedRuntime; } var hasRequiredDynamic$1; function requireDynamic$1() { if (hasRequiredDynamic$1) return dynamic$2.exports; hasRequiredDynamic$1 = 1; (function(module, exports) { Object.defineProperty(exports, "__esModule", { value: true }); function _export(target, all) { for (var name in all) Object.defineProperty(target, name, { enumerable: true, get: all[name] }); } _export(exports, { /** * This function lets you dynamically import a component. * It uses [React.lazy()](https://react.dev/reference/react/lazy) with [Suspense](https://react.dev/reference/react/Suspense) under the hood. * * Read more: [Next.js Docs: `next/dynamic`](https://nextjs.org/docs/app/building-your-application/optimizing/lazy-loading#nextdynamic) */ default: function() { return dynamic2; }, noSSR: function() { return noSSR; } }); const _interop_require_default2 = /* @__PURE__ */ require_interop_require_default(); const _jsxruntime = require$$1; const _loadablesharedruntime = /* @__PURE__ */ _interop_require_default2._(requireLoadable_sharedRuntime()); const isServerSide = typeof window === "undefined"; function convertModule(mod) { return { default: (mod == null ? void 0 : mod.default) || mod }; } function noSSR(LoadableInitializer, loadableOptions) { delete loadableOptions.webpack; delete loadableOptions.modules; if (!isServerSide) { return LoadableInitializer(loadableOptions); } const Loading = loadableOptions.loading; return () => /* @__PURE__ */ (0, _jsxruntime.jsx)(Loading, { error: null, isLoading: true, pastDelay: false, timedOut: false }); } function dynamic2(dynamicOptions, options) { let loadableFn = _loadablesharedruntime.default; let loadableOptions = { // A loading component is not required, so we default it loading: (param) => { let { error, isLoading, pastDelay } = param; if (!pastDelay) return null; if (process.env.NODE_ENV !== "production") { if (isLoading) { return null; } if (error) { return /* @__PURE__ */ (0, _jsxruntime.jsxs)("p", { children: [ error.message, /* @__PURE__ */ (0, _jsxruntime.jsx)("br", {}), error.stack ] }); } } return null; } }; if (dynamicOptions instanceof Promise) { loadableOptions.loader = () => dynamicOptions; } else if (typeof dynamicOptions === "function") { loadableOptions.loader = dynamicOptions; } else if (typeof dynamicOptions === "object") { loadableOptions = { ...loadableOptions, ...dynamicOptions }; } loadableOptions = { ...loadableOptions, ...options }; const loaderFn = loadableOptions.loader; const loader = () => loaderFn != null ? loaderFn().then(convertModule) : Promise.resolve(convertModule(() => null)); if (loadableOptions.loadableGenerated) { loadableOptions = { ...loadableOptions, ...loadableOptions.loadableGenerated }; delete loadableOptions.loadableGenerated; } if (typeof loadableOptions.ssr === "boolean" && !loadableOptions.ssr) { delete loadableOptions.webpack; delete loadableOptions.modules; return noSSR(loadableFn, loadableOptions); } return loadableFn({ ...loadableOptions, loader }); } if ((typeof exports.default === "function" || typeof exports.default === "object" && exports.default !== null) && typeof exports.default.__esModule === "undefined") { Object.defineProperty(exports.default, "__esModule", { value: true }); Object.assign(exports.default, exports); module.exports = exports.default; } })(dynamic$2, dynamic$2.exports); return dynamic$2.exports; } var dynamic$1; var hasRequiredDynamic; function requireDynamic() { if (hasRequiredDynamic) return dynamic$1; hasRequiredDynamic = 1; dynamic$1 = requireDynamic$1(); return dynamic$1; } var dynamicExports = requireDynamic(); const dynamic = /* @__PURE__ */ getDefaultExportFromCjs(dynamicExports); const FontAwesomeIcon = dynamic(() => import("./index.es-16MYTIHF-DRai9imL.js").then((v) => v.FontAwesomeIcon), { ssr: false }); const FontAwesome = ({ type = "fas", name, icon, tailwind, className, ...props }) => { const base = {}; const classes = computeTailwind({ ...base, ...props, ...tailwind, className }); return /* @__PURE__ */ jsx(FontAwesomeIcon, { "data-name": name, icon: [type, icon], className: classes }); }; const Icon = (props) => { switch (props?.type) { case "fab": return /* @__PURE__ */ jsx(FabIcon, { ...props }); case "fad": return /* @__PURE__ */ jsx(FadIcon, { ...props }); case "fal": return /* @__PURE__ */ jsx(FalIcon, { ...props }); case "far": return /* @__PURE__ */ jsx(FarIcon, { ...props }); case "fas": return /* @__PURE__ */ jsx(FasIcon, { ...props }); case "wrapped-fab": return /* @__PURE__ */ jsx(WrappedFabIcon, { ...props }); case "wrapped-fad": return /* @__PURE__ */ jsx(WrappedFadIcon, { ...props }); case "wrapped-fal": return /* @__PURE__ */ jsx(WrappedFalIcon, { ...props }); case "wrapped-far": return /* @__PURE__ */ jsx(WrappedFarIcon, { ...props }); case "wrapped-fas": return /* @__PURE__ */ jsx(WrappedFasIcon, { ...props }); default: return /* @__PURE__ */ jsx(FarIcon, { ...props }); } }; const FabIcon = ({ name = "FabIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.icon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(FontAwesome, { type: "fab", icon, ...computed }); }; const FadIcon = ({ name = "FadIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.icon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(FontAwesome, { type: "fad", icon, ...computed }); }; const FalIcon = ({ name = "FalIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.icon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(FontAwesome, { type: "fal", icon, ...computed }); }; const FarIcon = ({ name = "FarIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.icon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(FontAwesome, { type: "far", icon, ...computed }); }; const FasIcon = ({ name = "FasIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.icon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(FontAwesome, { type: "fas", icon, ...computed }); }; const WrappedFabIcon = ({ name = "WrappedFabIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.wrappedIcon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(Div, { ...computed, children: /* @__PURE__ */ jsx(FontAwesome, { type: "fab", icon, tailwind: tailwind?.icon }) }); }; const WrappedFadIcon = ({ name = "WrappedFadIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.wrappedIcon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(Div, { ...computed, children: /* @__PURE__ */ jsx(FontAwesome, { type: "fad", icon, tailwind: tailwind?.icon }) }); }; const WrappedFalIcon = ({ name = "WrappedFalIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.wrappedIcon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(Div, { ...computed, children: /* @__PURE__ */ jsx(FontAwesome, { type: "far", icon, tailwind: tailwind?.icon }) }); }; const WrappedFarIcon = ({ name = "WrappedFarIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.wrappedIcon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(Div, { ...computed, children: /* @__PURE__ */ jsx(FontAwesome, { type: "far", icon, tailwind: tailwind?.icon }) }); }; const WrappedFasIcon = ({ name = "WrappedFasIcon", icon, tailwind, className, ...props }) => { const context = useUI(); const base = context?.theme?.wrappedIcon(); const computed = { ...base, ...props, tailwind, className, name }; return /* @__PURE__ */ jsx(Div, { ...computed, children: /* @__PURE__ */ jsx(FontAwesome, { type: "far", icon, tailwind: tailwind?.icon }) }); }; export { FabIcon, FadIcon, FalIcon, FarIcon, FasIcon, Icon, WrappedFabIcon, WrappedFadIcon, WrappedFalIcon, WrappedFarIcon, WrappedFasIcon };