@drawbridge/components 0.0.77 → 0.1.0

package/dist/styles.js

@@ -15,8 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// components/styles.js
 var styles_exports = {};
 __export(styles_exports, {
   FONT_FALLBACK: () => FONT_FALLBACK,
@@ -24,6 +22,7 @@ __export(styles_exports, {
   borderStyle: () => borderStyle,
   buttonStyle: () => buttonStyle,
   closeStyle: () => closeStyle,
+  dotStyle: () => dotStyle,
   headerStyle: () => headerStyle,
   inputCheckboxStyle: () => inputCheckboxStyle,
   inputNameStyle: () => inputNameStyle,
@@ -37,35 +36,35 @@ __export(styles_exports, {
   toFontWeight: () => toFontWeight
 });
 module.exports = __toCommonJS(styles_exports);
-var WHITE = "rgb( 255, 255, 255 )";
-var BLACK = "rgb( 0, 0, 0 )";
-var bgColor = (style) => {
+const WHITE = "rgb( 255, 255, 255 )";
+const BLACK = "rgb( 0, 0, 0 )";
+const bgColor = (style) => {
   var _a, _b;
   return ((_b = (_a = style == null ? void 0 : style.background) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb) || WHITE;
 };
-var textColor = (style) => {
+const textColor = (style) => {
   var _a, _b;
   return ((_b = (_a = style == null ? void 0 : style.text) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb) || BLACK;
 };
-var DEFAULT_FAMILY = "Roboto Flex";
-var FONT_FALLBACK = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
-var toFontFamily = (family) => '"' + (family || DEFAULT_FAMILY) + '", ' + FONT_FALLBACK;
-var toFontWeight = (variant) => {
+const DEFAULT_FAMILY = "Roboto Flex";
+const FONT_FALLBACK = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
+const toFontFamily = (family) => '"' + (family || DEFAULT_FAMILY) + '", ' + FONT_FALLBACK;
+const toFontWeight = (variant) => {
   var _a;
   if (!variant) return void 0;
   if (variant.includes("italic")) return (_a = variant.match(/^\d+/)) == null ? void 0 : _a[0];
   if (variant.includes("regular")) return "normal";
   return variant;
 };
-var toFontStyle = (variant) => (variant == null ? void 0 : variant.includes("italic")) ? "italic" : void 0;
-var backgroundStyle = (style) => ({
+const toFontStyle = (variant) => (variant == null ? void 0 : variant.includes("italic")) ? "italic" : void 0;
+const backgroundStyle = (style) => ({
   backgroundColor: bgColor(style),
   color: textColor(style)
 });
-var borderStyle = (style) => ({
+const borderStyle = (style) => ({
   borderColor: textColor(style)
 });
-var buttonStyle = (style) => {
+const buttonStyle = (style) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
   return {
     backgroundColor: ((_c = (_b = (_a = style == null ? void 0 : style.button) == null ? void 0 : _a.background) == null ? void 0 : _b.color) == null ? void 0 : _c.rgb) || textColor(style),
@@ -74,11 +73,15 @@ var buttonStyle = (style) => {
     color: ((_j = (_i = (_h = style == null ? void 0 : style.button) == null ? void 0 : _h.text) == null ? void 0 : _i.color) == null ? void 0 : _j.rgb) || bgColor(style)
   };
 };
-var closeStyle = (style) => ({
+const closeStyle = (style) => ({
   backgroundColor: textColor(style),
   color: bgColor(style)
 });
-var headerStyle = (style) => {
+const dotStyle = (style, active) => ({
+  backgroundColor: active ? textColor(style) : textColor(style).replace(")", ", 0.1)"),
+  borderColor: textColor(style)
+});
+const headerStyle = (style) => {
   var _a, _b, _c, _d;
   return {
     fontFamily: toFontFamily((_a = style == null ? void 0 : style.heading) == null ? void 0 : _a.family),
@@ -87,7 +90,7 @@ var headerStyle = (style) => {
     textTransform: (_d = style == null ? void 0 : style.heading) == null ? void 0 : _d.transform
   };
 };
-var inputStyle = (style) => {
+const inputStyle = (style) => {
   var _a;
   return {
     backgroundColor: bgColor(style),
@@ -96,21 +99,21 @@ var inputStyle = (style) => {
     color: textColor(style)
   };
 };
-var inputCheckboxStyle = (style) => {
+const inputCheckboxStyle = (style) => {
   var _a;
   return {
     ...inputStyle(style),
     borderRadius: ((_a = style == null ? void 0 : style.input) == null ? void 0 : _a.radius) != null ? Math.min(style.input.radius / 4, 6) + "px" : void 0
   };
 };
-var inputNameStyle = (style) => inputStyle(style);
-var inputPhoneStyle = (style) => inputStyle(style);
-var menuStyle = (style) => ({
+const inputNameStyle = (style) => inputStyle(style);
+const inputPhoneStyle = (style) => inputStyle(style);
+const menuStyle = (style) => ({
   backgroundColor: bgColor(style),
   borderColor: textColor(style),
   color: textColor(style)
 });
-var selectStyle = (style) => {
+const selectStyle = (style) => {
   var _a;
   return {
     borderColor: textColor(style).replace(")", ", 0.3)"),
@@ -118,7 +121,7 @@ var selectStyle = (style) => {
     color: textColor(style)
   };
 };
-var textStyle = (style) => ({
+const textStyle = (style) => ({
   color: textColor(style)
 });
 // Annotate the CommonJS export names for ESM import in node:
@@ -128,6 +131,7 @@ var textStyle = (style) => ({
   borderStyle,
   buttonStyle,
   closeStyle,
+  dotStyle,
   headerStyle,
   inputCheckboxStyle,
   inputNameStyle,

package/dist/styles.mjs

@@ -1,27 +1,98 @@
-import {
-  FONT_FALLBACK,
-  backgroundStyle,
-  borderStyle,
-  buttonStyle,
-  closeStyle,
-  headerStyle,
-  inputCheckboxStyle,
-  inputNameStyle,
-  inputPhoneStyle,
-  inputStyle,
-  menuStyle,
-  selectStyle,
-  textStyle,
-  toFontFamily,
-  toFontStyle,
-  toFontWeight
-} from "./chunk-6F23WKP2.mjs";
+const WHITE = "rgb( 255, 255, 255 )";
+const BLACK = "rgb( 0, 0, 0 )";
+const bgColor = (style) => {
+  var _a, _b;
+  return ((_b = (_a = style == null ? void 0 : style.background) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb) || WHITE;
+};
+const textColor = (style) => {
+  var _a, _b;
+  return ((_b = (_a = style == null ? void 0 : style.text) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb) || BLACK;
+};
+const DEFAULT_FAMILY = "Roboto Flex";
+const FONT_FALLBACK = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
+const toFontFamily = (family) => '"' + (family || DEFAULT_FAMILY) + '", ' + FONT_FALLBACK;
+const toFontWeight = (variant) => {
+  var _a;
+  if (!variant) return void 0;
+  if (variant.includes("italic")) return (_a = variant.match(/^\d+/)) == null ? void 0 : _a[0];
+  if (variant.includes("regular")) return "normal";
+  return variant;
+};
+const toFontStyle = (variant) => (variant == null ? void 0 : variant.includes("italic")) ? "italic" : void 0;
+const backgroundStyle = (style) => ({
+  backgroundColor: bgColor(style),
+  color: textColor(style)
+});
+const borderStyle = (style) => ({
+  borderColor: textColor(style)
+});
+const buttonStyle = (style) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+  return {
+    backgroundColor: ((_c = (_b = (_a = style == null ? void 0 : style.button) == null ? void 0 : _a.background) == null ? void 0 : _b.color) == null ? void 0 : _c.rgb) || textColor(style),
+    borderColor: ((_f = (_e = (_d = style == null ? void 0 : style.button) == null ? void 0 : _d.background) == null ? void 0 : _e.color) == null ? void 0 : _f.rgb) || textColor(style),
+    borderRadius: ((_g = style == null ? void 0 : style.button) == null ? void 0 : _g.radius) != null ? style.button.radius / 4 + "px" : void 0,
+    color: ((_j = (_i = (_h = style == null ? void 0 : style.button) == null ? void 0 : _h.text) == null ? void 0 : _i.color) == null ? void 0 : _j.rgb) || bgColor(style)
+  };
+};
+const closeStyle = (style) => ({
+  backgroundColor: textColor(style),
+  color: bgColor(style)
+});
+const dotStyle = (style, active) => ({
+  backgroundColor: active ? textColor(style) : textColor(style).replace(")", ", 0.1)"),
+  borderColor: textColor(style)
+});
+const headerStyle = (style) => {
+  var _a, _b, _c, _d;
+  return {
+    fontFamily: toFontFamily((_a = style == null ? void 0 : style.heading) == null ? void 0 : _a.family),
+    fontWeight: toFontWeight((_b = style == null ? void 0 : style.heading) == null ? void 0 : _b.weight),
+    fontStyle: toFontStyle((_c = style == null ? void 0 : style.heading) == null ? void 0 : _c.weight),
+    textTransform: (_d = style == null ? void 0 : style.heading) == null ? void 0 : _d.transform
+  };
+};
+const inputStyle = (style) => {
+  var _a;
+  return {
+    backgroundColor: bgColor(style),
+    borderColor: textColor(style),
+    borderRadius: ((_a = style == null ? void 0 : style.input) == null ? void 0 : _a.radius) != null ? style.input.radius / 4 + "px" : void 0,
+    color: textColor(style)
+  };
+};
+const inputCheckboxStyle = (style) => {
+  var _a;
+  return {
+    ...inputStyle(style),
+    borderRadius: ((_a = style == null ? void 0 : style.input) == null ? void 0 : _a.radius) != null ? Math.min(style.input.radius / 4, 6) + "px" : void 0
+  };
+};
+const inputNameStyle = (style) => inputStyle(style);
+const inputPhoneStyle = (style) => inputStyle(style);
+const menuStyle = (style) => ({
+  backgroundColor: bgColor(style),
+  borderColor: textColor(style),
+  color: textColor(style)
+});
+const selectStyle = (style) => {
+  var _a;
+  return {
+    borderColor: textColor(style).replace(")", ", 0.3)"),
+    borderRadius: ((_a = style == null ? void 0 : style.input) == null ? void 0 : _a.radius) != null ? style.input.radius / 4 + "px" : void 0,
+    color: textColor(style)
+  };
+};
+const textStyle = (style) => ({
+  color: textColor(style)
+});
 export {
   FONT_FALLBACK,
   backgroundStyle,
   borderStyle,
   buttonStyle,
   closeStyle,
+  dotStyle,
   headerStyle,
   inputCheckboxStyle,
   inputNameStyle,

package/dist/video.js

@@ -26,94 +26,24 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// components/video.js
 var video_exports = {};
 __export(video_exports, {
   default: () => video_default
 });
 module.exports = __toCommonJS(video_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_dynamic = __toESM(require("next/dynamic"));
 var import_react = require("react");
-
-// components/icons/loader.js
-var import_jsx_runtime = require("react/jsx-runtime");
-var Loader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-  "svg",
-  {
-    ...{
-      fill: "none",
-      stroke: "none",
-      strokeWidth: 0,
-      viewBox: "0 0 24 24",
-      className: ["animate-spin", className].filter(Boolean).join(" "),
-      ...props
-    },
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "circle",
-        {
-          ...{
-            className: "opacity-25",
-            cx: 12,
-            cy: 12,
-            r: 10,
-            stroke: "currentColor",
-            strokeWidth: 4
-          }
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "path",
-        {
-          ...{
-            className: "opacity-75",
-            fill: "currentColor",
-            d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-          }
-        }
-      )
-    ]
-  }
-);
-var loader_default = Loader;
-
-// components/icons/warning.js
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var Warning = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-  "svg",
-  {
-    ...{
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 1.5,
-      viewBox: "0 0 24 24",
-      ...props
-    },
-    children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "path",
-      {
-        ...{
-          d: "M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126ZM12 15.75h.007v.008H12v-.008Z",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      }
-    )
-  }
-);
-var warning_default = Warning;
-
-// components/video.js
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var ReactPlayer = (0, import_dynamic.default)(
+var import_loader = __toESM(require("./icons/loader"));
+var import_warning = __toESM(require("./icons/warning"));
+const ReactPlayer = (0, import_dynamic.default)(
   () => import("react-player/lazy"),
   {
     ssr: false
   }
 );
-var DEFER_FALLBACK_MS = 5e3;
-var Video = ({
+const DEFER_FALLBACK_MS = 5e3;
+const Video = ({
   className,
   controls = false,
   defer = false,
@@ -179,8 +109,8 @@ var Video = ({
     },
     [defer, mountPlayer, poster, posterPainted]
   );
-  const inner = /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react.Fragment, { children: [
-    mountPlayer && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  const inner = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react.Fragment, { children: [
+    mountPlayer && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       ReactPlayer,
       {
         ...{
@@ -253,7 +183,7 @@ var Video = ({
         }
       }
     ),
-    !videoPaintable && poster && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    !videoPaintable && poster && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "img",
       {
         ...{
@@ -274,7 +204,7 @@ var Video = ({
         }
       }
     ),
-    !videoPaintable && !poster && !failed && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    !videoPaintable && !poster && !failed && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
       {
         ...{
@@ -284,8 +214,8 @@ var Video = ({
           // already reserves its height) means removing it shifts nothing.
           className: "absolute inset-0 flex justify-center items-center pointer-events-none"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          loader_default,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_loader.default,
           {
             ...{
               className: "w-10 h-10 animate-spin",
@@ -297,14 +227,14 @@ var Video = ({
         )
       }
     ),
-    failed && !poster && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    failed && !poster && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
       {
         ...{
           className: "absolute inset-0 flex justify-center items-center pointer-events-none"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          warning_default,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_warning.default,
           {
             ...{
               "aria-label": "Video unavailable",
@@ -319,7 +249,7 @@ var Video = ({
       }
     )
   ] });
-  return className ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return className ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
       ...{

package/dist/video.mjs

@@ -1,23 +1,17 @@
 "use client";
-import {
-  loader_default
-} from "./chunk-2ZYGRSSA.mjs";
-import {
-  warning_default
-} from "./chunk-Q3UIVGPQ.mjs";
-
-// components/video.js
+import { jsx, jsxs } from "react/jsx-runtime";
 import dynamic from "next/dynamic";
 import { Fragment, useEffect, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var ReactPlayer = dynamic(
+import Loader from "./icons/loader";
+import Warning from "./icons/warning";
+const ReactPlayer = dynamic(
   () => import("react-player/lazy"),
   {
     ssr: false
   }
 );
-var DEFER_FALLBACK_MS = 5e3;
-var Video = ({
+const DEFER_FALLBACK_MS = 5e3;
+const Video = ({
   className,
   controls = false,
   defer = false,
@@ -189,7 +183,7 @@ var Video = ({
           className: "absolute inset-0 flex justify-center items-center pointer-events-none"
         },
         children: /* @__PURE__ */ jsx(
-          loader_default,
+          Loader,
           {
             ...{
               className: "w-10 h-10 animate-spin",
@@ -208,7 +202,7 @@ var Video = ({
           className: "absolute inset-0 flex justify-center items-center pointer-events-none"
         },
         children: /* @__PURE__ */ jsx(
-          warning_default,
+          Warning,
           {
             ...{
               "aria-label": "Video unavailable",

package/dist/wrapper-gradient.js

@@ -16,19 +16,17 @@ var __copyProps = (to, from, except, desc) => {
   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 = ({
+var import_react = require("react");
+const WrapperGradientContext = (0, import_react.createContext)(null);
+const useWrapperGradient = () => (0, import_react.useContext)(WrapperGradientContext);
+const WrapperGradient = ({
   children,
   className,
   classNameGradient,