@drawbridge/components 0.0.39 → 0.0.42

package/dist/wrapper-gradient.js

@@ -0,0 +1,232 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// components/wrapper-gradient.js
+var wrapper_gradient_exports = {};
+__export(wrapper_gradient_exports, {
+  default: () => wrapper_gradient_default,
+  useWrapperGradient: () => useWrapperGradient
+});
+module.exports = __toCommonJS(wrapper_gradient_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var WrapperGradientContext = (0, import_react.createContext)(null);
+var useWrapperGradient = () => (0, import_react.useContext)(WrapperGradientContext);
+var WrapperGradient = ({
+  children,
+  className,
+  classNameGradient,
+  classNameScroll,
+  color,
+  gradientTopOffset,
+  horizontal = false
+}) => {
+  const showX = horizontal === true || horizontal === "both";
+  const showY = horizontal === false || horizontal === "both";
+  const overflowClass = horizontal === "both" ? "overflow-scroll" : horizontal ? "overflow-x-scroll overflow-y-visible" : "overflow-y-scroll overflow-x-visible";
+  const overscrollClass = horizontal === "both" ? "overscroll-none" : horizontal ? "overscroll-x-none overscroll-y-auto" : "overscroll-y-none overscroll-x-auto";
+  const themed = Boolean(color);
+  const gradientDefaults = "absolute z-[2] " + (themed ? "pointer-events-none " : "") + "transition-all duration-[100ms] ";
+  const classes = {
+    container: [
+      themed ? "relative" : "w-full relative",
+      ...className ? [className] : []
+    ],
+    inner: [
+      "w-full relative scroll-smooth hide-scrollbar",
+      overscrollClass,
+      overflowClass,
+      ...classNameScroll ? [classNameScroll] : []
+    ],
+    topGradient: [
+      gradientDefaults,
+      "w-full -top-[1px]",
+      ...themed ? [] : ["bg-gradient-to-b"],
+      ...classNameGradient ? [classNameGradient] : themed ? ["h-10"] : ["from-white to-transparent h-10"]
+    ],
+    bottomGradient: [
+      gradientDefaults,
+      "w-full -bottom-[1px]",
+      ...themed ? [] : ["bg-gradient-to-t"],
+      ...classNameGradient ? [classNameGradient] : themed ? ["h-10"] : ["from-white to-transparent h-10"]
+    ],
+    leftGradient: [
+      gradientDefaults,
+      "h-full top-0 left-0",
+      ...themed ? [] : ["bg-gradient-to-r"],
+      ...classNameGradient ? [classNameGradient] : themed ? ["w-4"] : ["from-white from-30% to-transparent w-4"]
+    ],
+    rightGradient: [
+      gradientDefaults,
+      "h-full top-0 right-0",
+      ...themed ? [] : ["bg-gradient-to-l"],
+      ...classNameGradient ? [classNameGradient] : themed ? ["w-4"] : ["from-white from-30% to-transparent w-4"]
+    ]
+  };
+  const gradients = {
+    top: "linear-gradient( to bottom, " + color + " 0%, transparent 100% )",
+    bottom: "linear-gradient( to top, " + color + " 0%, transparent 100% )",
+    left: "linear-gradient( to right, " + color + " 0%, transparent 100% )",
+    right: "linear-gradient( to left, " + color + " 0%, transparent 100% )"
+  };
+  const containerRef = (0, import_react.useRef)(null);
+  const [scroll, setScroll] = (0, import_react.useState)({
+    top: 0,
+    left: 0,
+    atBottom: true,
+    atRight: true
+  });
+  (0, import_react.useEffect)(
+    () => {
+      const container = containerRef.current;
+      const handleScroll = () => {
+        const { scrollTop, scrollLeft, scrollHeight, scrollWidth, clientHeight, clientWidth } = container;
+        setScroll({
+          top: scrollTop,
+          left: scrollLeft,
+          atBottom: scrollTop + clientHeight >= scrollHeight - 1,
+          atRight: scrollLeft + clientWidth >= scrollWidth - 1
+        });
+      };
+      const handleUpdate = () => {
+        const { scrollHeight, scrollWidth, clientHeight, clientWidth } = container;
+        if (scrollHeight <= clientHeight && scrollWidth <= clientWidth) {
+          setScroll({
+            top: 0,
+            left: 0,
+            atBottom: true,
+            atRight: true
+          });
+          return;
+        }
+        ;
+        handleScroll();
+      };
+      handleUpdate();
+      container.addEventListener("scroll", handleScroll);
+      const observer = new MutationObserver((mutations) => {
+        for (const mutation of mutations) {
+          if (mutation.type === "childList" && mutation.addedNodes.length > 0) {
+            handleUpdate();
+            break;
+          }
+        }
+      });
+      observer.observe(container, {
+        childList: true,
+        subtree: true
+      });
+      const resizeObserver = new ResizeObserver(handleUpdate);
+      resizeObserver.observe(container);
+      return () => {
+        container.removeEventListener("scroll", handleScroll);
+        observer.disconnect();
+        resizeObserver.disconnect();
+      };
+    },
+    [horizontal]
+  );
+  const contextValue = (0, import_react.useMemo)(
+    () => ({
+      atBottom: scroll.atBottom,
+      atRight: scroll.atRight
+    }),
+    [scroll.atBottom, scroll.atRight]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ...{
+        className: classes.container.join(" ")
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(WrapperGradientContext.Provider, { value: contextValue, children: [
+        showY && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            ...{
+              className: classes.topGradient.join(" ") + (scroll.top > 5 ? " opacity-100 visible" : " opacity-0 invisible"),
+              style: {
+                ...themed && {
+                  backgroundImage: gradients.top
+                },
+                ...gradientTopOffset && {
+                  top: gradientTopOffset
+                }
+              }
+            }
+          }
+        ),
+        showX && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            ...{
+              className: classes.leftGradient.join(" ") + (scroll.left > 5 ? " opacity-100 visible" : " opacity-0 invisible"),
+              style: {
+                ...themed && {
+                  backgroundImage: gradients.left
+                }
+              }
+            }
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            ...{
+              className: classes.inner.join(" "),
+              ref: containerRef
+            },
+            children
+          }
+        ),
+        showY && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            ...{
+              className: classes.bottomGradient.join(" ") + (!scroll.atBottom ? " opacity-100 visible" : " opacity-0 invisible"),
+              style: {
+                ...themed && {
+                  backgroundImage: gradients.bottom
+                }
+              }
+            }
+          }
+        ),
+        showX && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            ...{
+              className: classes.rightGradient.join(" ") + (!scroll.atRight ? " opacity-100 visible" : " opacity-0 invisible"),
+              style: {
+                ...themed && {
+                  backgroundImage: gradients.right
+                }
+              }
+            }
+          }
+        )
+      ] })
+    }
+  );
+};
+var wrapper_gradient_default = WrapperGradient;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useWrapperGradient
+});

package/dist/wrapper-gradient.mjs

@@ -0,0 +1,9 @@
+"use client";
+import {
+  useWrapperGradient,
+  wrapper_gradient_default
+} from "./chunk-XWELEL6Z.mjs";
+export {
+  wrapper_gradient_default as default,
+  useWrapperGradient
+};

package/package.json

@@ -1,10 +1,322 @@
 {
   "name": "@drawbridge/components",
-  "version": "0.0.39",
+  "version": "0.0.42",
   "exports": {
+    "./advertisement": {
+      "types": "./types/advertisement.d.ts",
+      "default": "./dist/advertisement.js"
+    },
     "./card-advertisement": {
       "types": "./types/card-advertisement.d.ts",
       "default": "./dist/card-advertisement.js"
+    },
+    "./embla": {
+      "types": "./types/embla.d.ts",
+      "default": "./dist/embla.js"
+    },
+    "./icons/arrow-down-tray": {
+      "types": "./types/icons/arrow-down-tray.d.ts",
+      "default": "./dist/icons/arrow-down-tray.js"
+    },
+    "./icons/arrow-left": {
+      "types": "./types/icons/arrow-left.d.ts",
+      "default": "./dist/icons/arrow-left.js"
+    },
+    "./icons/arrow-right": {
+      "types": "./types/icons/arrow-right.d.ts",
+      "default": "./dist/icons/arrow-right.js"
+    },
+    "./icons/arrow-up-tray": {
+      "types": "./types/icons/arrow-up-tray.d.ts",
+      "default": "./dist/icons/arrow-up-tray.js"
+    },
+    "./icons/bars-arrow-down": {
+      "types": "./types/icons/bars-arrow-down.d.ts",
+      "default": "./dist/icons/bars-arrow-down.js"
+    },
+    "./icons/bars-arrow-up": {
+      "types": "./types/icons/bars-arrow-up.d.ts",
+      "default": "./dist/icons/bars-arrow-up.js"
+    },
+    "./icons/bold": {
+      "types": "./types/icons/bold.d.ts",
+      "default": "./dist/icons/bold.js"
+    },
+    "./icons/bolt": {
+      "types": "./types/icons/bolt.d.ts",
+      "default": "./dist/icons/bolt.js"
+    },
+    "./icons/calendar": {
+      "types": "./types/icons/calendar.d.ts",
+      "default": "./dist/icons/calendar.js"
+    },
+    "./icons/cancel": {
+      "types": "./types/icons/cancel.d.ts",
+      "default": "./dist/icons/cancel.js"
+    },
+    "./icons/card": {
+      "types": "./types/icons/card.d.ts",
+      "default": "./dist/icons/card.js"
+    },
+    "./icons/chart": {
+      "types": "./types/icons/chart.d.ts",
+      "default": "./dist/icons/chart.js"
+    },
+    "./icons/check": {
+      "types": "./types/icons/check.d.ts",
+      "default": "./dist/icons/check.js"
+    },
+    "./icons/chevron-down": {
+      "types": "./types/icons/chevron-down.d.ts",
+      "default": "./dist/icons/chevron-down.js"
+    },
+    "./icons/chevron-left": {
+      "types": "./types/icons/chevron-left.d.ts",
+      "default": "./dist/icons/chevron-left.js"
+    },
+    "./icons/chevron-right": {
+      "types": "./types/icons/chevron-right.d.ts",
+      "default": "./dist/icons/chevron-right.js"
+    },
+    "./icons/chevron-up-down": {
+      "types": "./types/icons/chevron-up-down.d.ts",
+      "default": "./dist/icons/chevron-up-down.js"
+    },
+    "./icons/chevron-up": {
+      "types": "./types/icons/chevron-up.d.ts",
+      "default": "./dist/icons/chevron-up.js"
+    },
+    "./icons/clock": {
+      "types": "./types/icons/clock.d.ts",
+      "default": "./dist/icons/clock.js"
+    },
+    "./icons/code-bracket": {
+      "types": "./types/icons/code-bracket.d.ts",
+      "default": "./dist/icons/code-bracket.js"
+    },
+    "./icons/cog": {
+      "types": "./types/icons/cog.d.ts",
+      "default": "./dist/icons/cog.js"
+    },
+    "./icons/copy": {
+      "types": "./types/icons/copy.d.ts",
+      "default": "./dist/icons/copy.js"
+    },
+    "./icons/document": {
+      "types": "./types/icons/document.d.ts",
+      "default": "./dist/icons/document.js"
+    },
+    "./icons/download": {
+      "types": "./types/icons/download.d.ts",
+      "default": "./dist/icons/download.js"
+    },
+    "./icons/drag": {
+      "types": "./types/icons/drag.d.ts",
+      "default": "./dist/icons/drag.js"
+    },
+    "./icons/ellipsis": {
+      "types": "./types/icons/ellipsis.d.ts",
+      "default": "./dist/icons/ellipsis.js"
+    },
+    "./icons/email": {
+      "types": "./types/icons/email.d.ts",
+      "default": "./dist/icons/email.js"
+    },
+    "./icons/external": {
+      "types": "./types/icons/external.d.ts",
+      "default": "./dist/icons/external.js"
+    },
+    "./icons/filter": {
+      "types": "./types/icons/filter.d.ts",
+      "default": "./dist/icons/filter.js"
+    },
+    "./icons/flag": {
+      "types": "./types/icons/flag.d.ts",
+      "default": "./dist/icons/flag.js"
+    },
+    "./icons/google": {
+      "types": "./types/icons/google.d.ts",
+      "default": "./dist/icons/google.js"
+    },
+    "./icons/home": {
+      "types": "./types/icons/home.d.ts",
+      "default": "./dist/icons/home.js"
+    },
+    "./icons/image": {
+      "types": "./types/icons/image.d.ts",
+      "default": "./dist/icons/image.js"
+    },
+    "./icons/italic": {
+      "types": "./types/icons/italic.d.ts",
+      "default": "./dist/icons/italic.js"
+    },
+    "./icons/link": {
+      "types": "./types/icons/link.d.ts",
+      "default": "./dist/icons/link.js"
+    },
+    "./icons/loader": {
+      "types": "./types/icons/loader.d.ts",
+      "default": "./dist/icons/loader.js"
+    },
+    "./icons/lock": {
+      "types": "./types/icons/lock.d.ts",
+      "default": "./dist/icons/lock.js"
+    },
+    "./icons/logo-mark": {
+      "types": "./types/icons/logo-mark.d.ts",
+      "default": "./dist/icons/logo-mark.js"
+    },
+    "./icons/logo-tagline": {
+      "types": "./types/icons/logo-tagline.d.ts",
+      "default": "./dist/icons/logo-tagline.js"
+    },
+    "./icons/map-pin": {
+      "types": "./types/icons/map-pin.d.ts",
+      "default": "./dist/icons/map-pin.js"
+    },
+    "./icons/menu": {
+      "types": "./types/icons/menu.d.ts",
+      "default": "./dist/icons/menu.js"
+    },
+    "./icons/minus": {
+      "types": "./types/icons/minus.d.ts",
+      "default": "./dist/icons/minus.js"
+    },
+    "./icons/muted": {
+      "types": "./types/icons/muted.d.ts",
+      "default": "./dist/icons/muted.js"
+    },
+    "./icons/pause": {
+      "types": "./types/icons/pause.d.ts",
+      "default": "./dist/icons/pause.js"
+    },
+    "./icons/pencil": {
+      "types": "./types/icons/pencil.d.ts",
+      "default": "./dist/icons/pencil.js"
+    },
+    "./icons/play": {
+      "types": "./types/icons/play.d.ts",
+      "default": "./dist/icons/play.js"
+    },
+    "./icons/plus": {
+      "types": "./types/icons/plus.d.ts",
+      "default": "./dist/icons/plus.js"
+    },
+    "./icons/powered-by": {
+      "types": "./types/icons/powered-by.d.ts",
+      "default": "./dist/icons/powered-by.js"
+    },
+    "./icons/qr-code": {
+      "types": "./types/icons/qr-code.d.ts",
+      "default": "./dist/icons/qr-code.js"
+    },
+    "./icons/queue": {
+      "types": "./types/icons/queue.d.ts",
+      "default": "./dist/icons/queue.js"
+    },
+    "./icons/refresh": {
+      "types": "./types/icons/refresh.d.ts",
+      "default": "./dist/icons/refresh.js"
+    },
+    "./icons/refund": {
+      "types": "./types/icons/refund.d.ts",
+      "default": "./dist/icons/refund.js"
+    },
+    "./icons/rocket": {
+      "types": "./types/icons/rocket.d.ts",
+      "default": "./dist/icons/rocket.js"
+    },
+    "./icons/search": {
+      "types": "./types/icons/search.d.ts",
+      "default": "./dist/icons/search.js"
+    },
+    "./icons/share": {
+      "types": "./types/icons/share.d.ts",
+      "default": "./dist/icons/share.js"
+    },
+    "./icons/shop": {
+      "types": "./types/icons/shop.d.ts",
+      "default": "./dist/icons/shop.js"
+    },
+    "./icons/sparkles": {
+      "types": "./types/icons/sparkles.d.ts",
+      "default": "./dist/icons/sparkles.js"
+    },
+    "./icons/star": {
+      "types": "./types/icons/star.d.ts",
+      "default": "./dist/icons/star.js"
+    },
+    "./icons/switch": {
+      "types": "./types/icons/switch.d.ts",
+      "default": "./dist/icons/switch.js"
+    },
+    "./icons/times": {
+      "types": "./types/icons/times.d.ts",
+      "default": "./dist/icons/times.js"
+    },
+    "./icons/trash": {
+      "types": "./types/icons/trash.d.ts",
+      "default": "./dist/icons/trash.js"
+    },
+    "./icons/underline": {
+      "types": "./types/icons/underline.d.ts",
+      "default": "./dist/icons/underline.js"
+    },
+    "./icons/upload": {
+      "types": "./types/icons/upload.d.ts",
+      "default": "./dist/icons/upload.js"
+    },
+    "./icons/volume": {
+      "types": "./types/icons/volume.d.ts",
+      "default": "./dist/icons/volume.js"
+    },
+    "./icons/warning": {
+      "types": "./types/icons/warning.d.ts",
+      "default": "./dist/icons/warning.js"
+    },
+    "./input-checkbox": {
+      "types": "./types/input-checkbox.d.ts",
+      "default": "./dist/input-checkbox.js"
+    },
+    "./input-group": {
+      "types": "./types/input-group.d.ts",
+      "default": "./dist/input-group.js"
+    },
+    "./input-number": {
+      "types": "./types/input-number.d.ts",
+      "default": "./dist/input-number.js"
+    },
+    "./input-select": {
+      "types": "./types/input-select.d.ts",
+      "default": "./dist/input-select.js"
+    },
+    "./input-text": {
+      "types": "./types/input-text.d.ts",
+      "default": "./dist/input-text.js"
+    },
+    "./input-textarea": {
+      "types": "./types/input-textarea.d.ts",
+      "default": "./dist/input-textarea.js"
+    },
+    "./product": {
+      "types": "./types/product.d.ts",
+      "default": "./dist/product.js"
+    },
+    "./provider-font": {
+      "types": "./types/provider-font.d.ts",
+      "default": "./dist/provider-font.js"
+    },
+    "./styles": {
+      "types": "./types/styles.d.ts",
+      "default": "./dist/styles.js"
+    },
+    "./video": {
+      "types": "./types/video.d.ts",
+      "default": "./dist/video.js"
+    },
+    "./wrapper-gradient": {
+      "types": "./types/wrapper-gradient.d.ts",
+      "default": "./dist/wrapper-gradient.js"
     }
   },
   "files": [
@@ -32,6 +344,8 @@
     "tsup": "8.5.1"
   },
   "dependencies": {
-    "@drawbridge/drawbridge-agents": "0.0.10"
+    "@drawbridge/drawbridge-agents": "0.0.10",
+    "embla-carousel-react": "8.6.0",
+    "react-player": "2.16.0"
   }
 }

package/types/advertisement.d.ts

@@ -0,0 +1,36 @@
+import { ComponentType, ReactNode } from 'react';
+import { BrandStyle } from './styles';
+
+export interface AdvertisementProps {
+	action?: 'add' | 'buy' | null;
+	affiliate?: string;
+	brand?: { style?: BrandStyle };
+	button?: string;
+	campaign?: string;
+	disabled?: boolean;
+	errors?: { variant?: ReactNode; root?: ReactNode };
+	file?: any;
+	fonts?: Record<string, unknown>;
+	header?: ReactNode;
+	id?: string;
+	ImageComponent?: ComponentType<any>;
+	lead?: string;
+	onAdd?: () => void;
+	onBuy?: () => void;
+	onClick?: () => void;
+	onVariantChange?: ( value: string ) => void;
+	onVariantSelect?: ( variant: any ) => void;
+	organization?: string;
+	page?: string;
+	preview?: boolean;
+	product?: any;
+	style?: BrandStyle;
+	title?: string;
+	url?: string;
+	variant?: string;
+	VideoComponent?: ComponentType<any>;
+}
+
+declare const Advertisement: ComponentType<AdvertisementProps>;
+
+export default Advertisement;

package/types/embla.d.ts

@@ -0,0 +1,2 @@
+export { default } from 'embla-carousel-react';
+export * from 'embla-carousel-react';

package/types/icons/arrow-down-tray.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/arrow-left.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/arrow-right.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/arrow-up-tray.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/bars-arrow-down.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/bars-arrow-up.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/bold.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/bolt.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;

package/types/icons/calendar.d.ts

@@ -0,0 +1,5 @@
+import { ComponentType, SVGProps } from 'react';
+
+declare const Icon: ComponentType<SVGProps<SVGSVGElement>>;
+
+export default Icon;