@drawbridge/components 0.0.39 → 0.0.40

package/dist/input-select.js

@@ -0,0 +1,150 @@
+"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/input-select.js
+var input_select_exports = {};
+__export(input_select_exports, {
+  default: () => input_select_default
+});
+module.exports = __toCommonJS(input_select_exports);
+var import_react = require("react");
+
+// components/icons/chevron-down.js
+var import_jsx_runtime = require("react/jsx-runtime");
+var ChevronDown = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  "svg",
+  {
+    ...{
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 1.5,
+      viewBox: "0 0 24 24",
+      ...props
+    },
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "path",
+      {
+        ...{
+          d: "m19.5 8.25-7.5 7.5-7.5-7.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      }
+    )
+  }
+);
+var chevron_down_default = ChevronDown;
+
+// components/styles.js
+var inputStyle = (style) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  return {
+    backgroundColor: (_b = (_a = style == null ? void 0 : style.background) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb,
+    borderColor: (_d = (_c = style == null ? void 0 : style.text) == null ? void 0 : _c.color) == null ? void 0 : _d.rgb,
+    borderRadius: ((_e = style == null ? void 0 : style.input) == null ? void 0 : _e.radius) != null ? style.input.radius / 4 + "px" : void 0,
+    color: (_g = (_f = style == null ? void 0 : style.text) == null ? void 0 : _f.color) == null ? void 0 : _g.rgb
+  };
+};
+
+// components/input-select.js
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var InputSelect = ({
+  onChange,
+  options = [],
+  style,
+  value,
+  ...rest
+}) => {
+  const [keyboard, setKeyboard] = (0, import_react.useState)(false);
+  (0, import_react.useEffect)(() => {
+    const down = (e) => {
+      if (e.key === "Tab") setKeyboard(true);
+    };
+    const click = () => setKeyboard(false);
+    window.addEventListener("keydown", down);
+    window.addEventListener("mousedown", click);
+    return () => {
+      window.removeEventListener("keydown", down);
+      window.removeEventListener("mousedown", click);
+    };
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      ...{
+        className: "relative"
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          "select",
+          {
+            ...{
+              ...rest,
+              className: "input appearance-none " + (keyboard ? "focus-visible:!outline-1 focus-visible:!ring-1 focus-visible:!ring-blue-600" : "focus-visible:!outline-0 focus-visible:!ring-0"),
+              onChange: ({ target }) => onChange(target == null ? void 0 : target.value),
+              style: inputStyle(style),
+              value
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "option",
+                {
+                  ...{
+                    disabled: true,
+                    "aria-label": "Select option",
+                    value: ""
+                  },
+                  children: "Select"
+                }
+              ),
+              options.map(({ label, option, value: optValue }, key) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "option",
+                {
+                  ...{
+                    value: optValue ?? option
+                  },
+                  children: label ?? option
+                },
+                "input-select-option-" + key
+              ))
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "div",
+          {
+            ...{
+              "aria-hidden": true,
+              className: "h-full flex items-center absolute inset-y-0 right-0 pointer-events-none px-2.5"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              chevron_down_default,
+              {
+                ...{
+                  className: "w-5 h-5 text-inherit"
+                }
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+};
+var input_select_default = InputSelect;

package/dist/input-select.mjs

@@ -0,0 +1,9 @@
+"use client";
+import {
+  input_select_default
+} from "./chunk-BD3TDNJE.mjs";
+import "./chunk-FYA7EAMR.mjs";
+import "./chunk-FJXG3REN.mjs";
+export {
+  input_select_default as default
+};

package/dist/input-text.js

@@ -0,0 +1,65 @@
+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/input-text.js
+var input_text_exports = {};
+__export(input_text_exports, {
+  default: () => input_text_default
+});
+module.exports = __toCommonJS(input_text_exports);
+
+// components/styles.js
+var inputStyle = (style) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  return {
+    backgroundColor: (_b = (_a = style == null ? void 0 : style.background) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb,
+    borderColor: (_d = (_c = style == null ? void 0 : style.text) == null ? void 0 : _c.color) == null ? void 0 : _d.rgb,
+    borderRadius: ((_e = style == null ? void 0 : style.input) == null ? void 0 : _e.radius) != null ? style.input.radius / 4 + "px" : void 0,
+    color: (_g = (_f = style == null ? void 0 : style.text) == null ? void 0 : _f.color) == null ? void 0 : _g.rgb
+  };
+};
+
+// components/input-text.js
+var import_jsx_runtime = require("react/jsx-runtime");
+var InputText = ({
+  className,
+  max,
+  onChange,
+  style,
+  value,
+  ...rest
+}) => {
+  const classes = ["input"];
+  if (className) {
+    classes.push(className);
+  }
+  ;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "input",
+    {
+      ...{
+        ...rest,
+        className: classes.join(" "),
+        onChange: ({ target }) => onChange(target.value),
+        style: inputStyle(style),
+        value
+      }
+    }
+  );
+};
+var input_text_default = InputText;

package/dist/input-text.mjs

@@ -0,0 +1,36 @@
+import {
+  inputStyle
+} from "./chunk-FJXG3REN.mjs";
+
+// components/input-text.js
+import { jsx } from "react/jsx-runtime";
+var InputText = ({
+  className,
+  max,
+  onChange,
+  style,
+  value,
+  ...rest
+}) => {
+  const classes = ["input"];
+  if (className) {
+    classes.push(className);
+  }
+  ;
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      ...{
+        ...rest,
+        className: classes.join(" "),
+        onChange: ({ target }) => onChange(target.value),
+        style: inputStyle(style),
+        value
+      }
+    }
+  );
+};
+var input_text_default = InputText;
+export {
+  input_text_default as default
+};

package/dist/input-textarea.js

@@ -0,0 +1,69 @@
+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/input-textarea.js
+var input_textarea_exports = {};
+__export(input_textarea_exports, {
+  default: () => input_textarea_default
+});
+module.exports = __toCommonJS(input_textarea_exports);
+
+// components/styles.js
+var inputStyle = (style) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  return {
+    backgroundColor: (_b = (_a = style == null ? void 0 : style.background) == null ? void 0 : _a.color) == null ? void 0 : _b.rgb,
+    borderColor: (_d = (_c = style == null ? void 0 : style.text) == null ? void 0 : _c.color) == null ? void 0 : _d.rgb,
+    borderRadius: ((_e = style == null ? void 0 : style.input) == null ? void 0 : _e.radius) != null ? style.input.radius / 4 + "px" : void 0,
+    color: (_g = (_f = style == null ? void 0 : style.text) == null ? void 0 : _f.color) == null ? void 0 : _g.rgb
+  };
+};
+
+// components/input-textarea.js
+var import_jsx_runtime = require("react/jsx-runtime");
+var InputTextarea = ({
+  className,
+  max,
+  onChange,
+  rows,
+  style,
+  value,
+  ...rest
+}) => {
+  const classes = ["input resize-none whitespace-pre-line"];
+  if (className) {
+    classes.push(className);
+  }
+  ;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "textarea",
+    {
+      ...{
+        ...rest,
+        ...rows && {
+          rows
+        },
+        className: classes.join(" "),
+        onChange: ({ target }) => onChange(target.value),
+        style: inputStyle(style),
+        value
+      }
+    }
+  );
+};
+var input_textarea_default = InputTextarea;

package/dist/input-textarea.mjs

@@ -0,0 +1,40 @@
+import {
+  inputStyle
+} from "./chunk-FJXG3REN.mjs";
+
+// components/input-textarea.js
+import { jsx } from "react/jsx-runtime";
+var InputTextarea = ({
+  className,
+  max,
+  onChange,
+  rows,
+  style,
+  value,
+  ...rest
+}) => {
+  const classes = ["input resize-none whitespace-pre-line"];
+  if (className) {
+    classes.push(className);
+  }
+  ;
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ...{
+        ...rest,
+        ...rows && {
+          rows
+        },
+        className: classes.join(" "),
+        onChange: ({ target }) => onChange(target.value),
+        style: inputStyle(style),
+        value
+      }
+    }
+  );
+};
+var input_textarea_default = InputTextarea;
+export {
+  input_textarea_default as default
+};