UNPKG

@dndbuilder.com/react

Version:

Drag and drop builder for React

58 lines (57 loc) 2.4 kB
"use client"; import { jsxs as i, jsx as t } from "react/jsx-runtime"; import { memo as d, useRef as p, Suspense as y } from "react"; import { FiLock as x, FiGrid as f } from "../../../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.0.0/node_modules/react-icons/fi/index.js"; import { LicenseManager as o } from "../../../licensing/index.js"; import { classNames as r } from "../../../../../../utils.js"; import { useDrag as u } from "../../../../../../node_modules/.pnpm/react-dnd@16.0.1_@types_node@22.13.4_@types_react@19.0.10_react@19.0.0/node_modules/react-dnd/dist/hooks/useDrag/useDrag.js"; const R = d(({ block: e, ...n }) => { const m = o.isBlockPremium(e.type), a = o.canUseBlock(e.type), [{ opacity: c }, l] = u( () => ({ type: e.type, item: { type: e.type, settings: e.settings, advancedSettings: e.advancedSettings }, canDrag: a, // Disable dragging for premium blocks if not licensed collect: (g) => ({ opacity: g.isDragging() ? 0.5 : 1 }) }), [a] ), s = p(null); return a && l(s), /* @__PURE__ */ i( "div", { ref: s, style: { opacity: c }, className: r( "relative flex h-[88px] flex-col items-center overflow-hidden rounded-sm bg-gray-50 py-4 text-gray-800 ring-1 ring-gray-300 transition-colors duration-300", a ? "cursor-move hover:border-gray-600 hover:bg-gray-100 hover:text-gray-800 hover:ring-gray-600" : "cursor-not-allowed !opacity-70" ), ...n, children: [ m && /* @__PURE__ */ t("div", { className: r("absolute right-1 top-1"), children: /* @__PURE__ */ i( "span", { className: r( "flex items-center rounded-full bg-amber-100 px-2 py-0.5 text-[10px] font-medium text-amber-800" ), children: [ /* @__PURE__ */ t(x, { className: "mr-0.5", size: 10 }), "PRO" ] } ) }), /* @__PURE__ */ t("div", { className: r("mb-1 text-[22px] text-gray-700"), children: /* @__PURE__ */ t(y, { fallback: null, children: e.icon ? /* @__PURE__ */ t(e.icon, {}) : /* @__PURE__ */ t(f, {}) }) }), /* @__PURE__ */ t("p", { className: r("mt-auto text-center text-xs"), children: e.label }) ] } ); }); export { R as default }; //# sourceMappingURL=block-navigation-item.js.map