bj-web-components 0.2.26 → 0.2.28

package/dist/vercel.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>

package/dist/web/BasicInput/BInput.js

@@ -0,0 +1,208 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const utils = require("./utils.js");
+;/* empty css             */
+function classNames(...values) {
+  return values.filter(Boolean).join(" ");
+}
+function BaseInput({
+  addonAfter,
+  addonBefore,
+  allowClear,
+  children,
+  className,
+  disabled,
+  focused,
+  handleReset,
+  onClear,
+  prefix,
+  readOnly,
+  size,
+  status,
+  suffix,
+  triggerInputFocus,
+  value
+}) {
+  const containerRef = react.useRef(null);
+  const hasAffix = utils.hasPrefixSuffix({ prefix, suffix, allowClear });
+  const inputElement = react.cloneElement(children, { value });
+  let element = inputElement;
+  if (hasAffix) {
+    const needClear = Boolean(allowClear && !disabled && !readOnly && value);
+    const clearIcon = typeof allowClear === "object" && allowClear.clearIcon ? allowClear.clearIcon : "×";
+    element = /* @__PURE__ */ jsxRuntime.jsxs(
+      "span",
+      {
+        className: classNames(
+          "bj-input__affix-wrapper",
+          disabled && "bj-input__affix-wrapper--disabled",
+          focused && "bj-input__affix-wrapper--focused",
+          readOnly && "bj-input__affix-wrapper--readonly",
+          size && `bj-input__affix-wrapper--${size}`,
+          status && `bj-input__affix-wrapper--${status}`
+        ),
+        onClick: triggerInputFocus,
+        ref: containerRef,
+        children: [
+          prefix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bj-input__prefix", children: prefix }),
+          inputElement,
+          (suffix || allowClear) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "bj-input__suffix", children: [
+            allowClear && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                "aria-label": "清除输入内容",
+                className: classNames("bj-input__clear-icon", !needClear && "bj-input__clear-icon--hidden"),
+                onClick: (event) => {
+                  handleReset(event);
+                  onClear == null ? void 0 : onClear();
+                },
+                onMouseDown: (event) => event.preventDefault(),
+                tabIndex: -1,
+                type: "button",
+                children: clearIcon
+              }
+            ),
+            suffix
+          ] })
+        ]
+      }
+    );
+  }
+  if (utils.hasAddon({ addonBefore, addonAfter })) {
+    element = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bj-input__group-wrapper", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "bj-input__group", children: [
+      addonBefore && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bj-input__group-addon", children: addonBefore }),
+      element,
+      addonAfter && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bj-input__group-addon", children: addonAfter })
+    ] }) });
+  }
+  return react.cloneElement(element, { className: classNames(element.props.className, className) });
+}
+const BInput = react.forwardRef((props, ref) => {
+  const {
+    addonAfter,
+    addonBefore,
+    allowClear,
+    bordered = true,
+    className,
+    defaultValue,
+    disabled,
+    htmlSize,
+    onBlur,
+    onChange,
+    onClear,
+    onCompositionEnd,
+    onCompositionStart,
+    onFocus,
+    onKeyDown,
+    onKeyUp,
+    onPressEnter,
+    prefix,
+    readOnly,
+    size = "middle",
+    status,
+    suffix,
+    type = "text",
+    value: controlledValue,
+    ...restProps
+  } = props;
+  const [focused, setFocused] = react.useState(false);
+  const [innerValue, setInnerValue] = react.useState(defaultValue);
+  const inputRef = react.useRef(null);
+  const compositionRef = react.useRef(false);
+  const keyLockRef = react.useRef(false);
+  const hasAffix = utils.hasPrefixSuffix({ prefix, suffix, allowClear });
+  const value = controlledValue === void 0 ? innerValue : controlledValue;
+  const formattedValue = value === void 0 || value === null ? "" : String(value);
+  react.useImperativeHandle(ref, () => ({
+    focus: (option) => utils.triggerFocus(inputRef.current, option),
+    blur: () => {
+      var _a;
+      return (_a = inputRef.current) == null ? void 0 : _a.blur();
+    },
+    setSelectionRange: (...argumentsList) => {
+      var _a;
+      return (_a = inputRef.current) == null ? void 0 : _a.setSelectionRange(...argumentsList);
+    },
+    select: () => {
+      var _a;
+      return (_a = inputRef.current) == null ? void 0 : _a.select();
+    },
+    input: inputRef.current,
+    nativeElement: inputRef.current
+  }));
+  react.useEffect(() => setFocused((previous) => previous && !disabled), [disabled]);
+  const triggerChange = (event, nextValue, source) => {
+    if (source === "compositionEnd") return;
+    if (controlledValue === void 0) setInnerValue(nextValue);
+    if (inputRef.current) utils.resolveOnChange(inputRef.current, event, onChange, nextValue);
+  };
+  const input = /* @__PURE__ */ jsxRuntime.jsx(
+    "input",
+    {
+      ...restProps,
+      className: classNames("bj-input", `bj-input--${size}`, focused && !hasAffix && "bj-input--focused", status && `bj-input--${status}`, !bordered && "bj-input--borderless", disabled && "bj-input--disabled"),
+      disabled,
+      onBlur: (event) => {
+        keyLockRef.current = false;
+        setFocused(false);
+        onBlur == null ? void 0 : onBlur(event);
+      },
+      onChange: (event) => triggerChange(event, event.target.value, "change"),
+      onCompositionEnd: (event) => {
+        compositionRef.current = false;
+        triggerChange(event, event.currentTarget.value, "compositionEnd");
+        onCompositionEnd == null ? void 0 : onCompositionEnd(event);
+      },
+      onCompositionStart: (event) => {
+        compositionRef.current = true;
+        onCompositionStart == null ? void 0 : onCompositionStart(event);
+      },
+      onFocus: (event) => {
+        setFocused(true);
+        onFocus == null ? void 0 : onFocus(event);
+      },
+      onKeyDown: (event) => {
+        if (onPressEnter && event.key === "Enter" && !keyLockRef.current) {
+          keyLockRef.current = true;
+          onPressEnter(event);
+        }
+        onKeyDown == null ? void 0 : onKeyDown(event);
+      },
+      onKeyUp: (event) => {
+        if (event.key === "Enter") keyLockRef.current = false;
+        onKeyUp == null ? void 0 : onKeyUp(event);
+      },
+      ref: inputRef,
+      size: htmlSize,
+      type
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    BaseInput,
+    {
+      addonAfter,
+      addonBefore,
+      allowClear,
+      className,
+      disabled,
+      focused,
+      handleReset: (event) => {
+        if (controlledValue === void 0) setInnerValue("");
+        utils.triggerFocus(inputRef.current);
+        if (inputRef.current) utils.resolveOnChange(inputRef.current, event, onChange);
+      },
+      onClear,
+      prefix,
+      readOnly,
+      size,
+      status,
+      suffix,
+      triggerInputFocus: () => utils.triggerFocus(inputRef.current),
+      value: formattedValue,
+      children: input
+    }
+  );
+});
+BInput.displayName = "BInput";
+module.exports = BInput;

package/dist/web/BasicInput/BInput.mjs

@@ -0,0 +1,209 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, useState, useRef, useImperativeHandle, useEffect, cloneElement } from "react";
+import { triggerFocus, resolveOnChange, hasPrefixSuffix, hasAddon } from "./utils.mjs";
+/* empty css             */
+function classNames(...values) {
+  return values.filter(Boolean).join(" ");
+}
+function BaseInput({
+  addonAfter,
+  addonBefore,
+  allowClear,
+  children,
+  className,
+  disabled,
+  focused,
+  handleReset,
+  onClear,
+  prefix,
+  readOnly,
+  size,
+  status,
+  suffix,
+  triggerInputFocus,
+  value
+}) {
+  const containerRef = useRef(null);
+  const hasAffix = hasPrefixSuffix({ prefix, suffix, allowClear });
+  const inputElement = cloneElement(children, { value });
+  let element = inputElement;
+  if (hasAffix) {
+    const needClear = Boolean(allowClear && !disabled && !readOnly && value);
+    const clearIcon = typeof allowClear === "object" && allowClear.clearIcon ? allowClear.clearIcon : "×";
+    element = /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: classNames(
+          "bj-input__affix-wrapper",
+          disabled && "bj-input__affix-wrapper--disabled",
+          focused && "bj-input__affix-wrapper--focused",
+          readOnly && "bj-input__affix-wrapper--readonly",
+          size && `bj-input__affix-wrapper--${size}`,
+          status && `bj-input__affix-wrapper--${status}`
+        ),
+        onClick: triggerInputFocus,
+        ref: containerRef,
+        children: [
+          prefix && /* @__PURE__ */ jsx("span", { className: "bj-input__prefix", children: prefix }),
+          inputElement,
+          (suffix || allowClear) && /* @__PURE__ */ jsxs("span", { className: "bj-input__suffix", children: [
+            allowClear && /* @__PURE__ */ jsx(
+              "button",
+              {
+                "aria-label": "清除输入内容",
+                className: classNames("bj-input__clear-icon", !needClear && "bj-input__clear-icon--hidden"),
+                onClick: (event) => {
+                  handleReset(event);
+                  onClear == null ? void 0 : onClear();
+                },
+                onMouseDown: (event) => event.preventDefault(),
+                tabIndex: -1,
+                type: "button",
+                children: clearIcon
+              }
+            ),
+            suffix
+          ] })
+        ]
+      }
+    );
+  }
+  if (hasAddon({ addonBefore, addonAfter })) {
+    element = /* @__PURE__ */ jsx("span", { className: "bj-input__group-wrapper", children: /* @__PURE__ */ jsxs("span", { className: "bj-input__group", children: [
+      addonBefore && /* @__PURE__ */ jsx("span", { className: "bj-input__group-addon", children: addonBefore }),
+      element,
+      addonAfter && /* @__PURE__ */ jsx("span", { className: "bj-input__group-addon", children: addonAfter })
+    ] }) });
+  }
+  return cloneElement(element, { className: classNames(element.props.className, className) });
+}
+const BInput = forwardRef((props, ref) => {
+  const {
+    addonAfter,
+    addonBefore,
+    allowClear,
+    bordered = true,
+    className,
+    defaultValue,
+    disabled,
+    htmlSize,
+    onBlur,
+    onChange,
+    onClear,
+    onCompositionEnd,
+    onCompositionStart,
+    onFocus,
+    onKeyDown,
+    onKeyUp,
+    onPressEnter,
+    prefix,
+    readOnly,
+    size = "middle",
+    status,
+    suffix,
+    type = "text",
+    value: controlledValue,
+    ...restProps
+  } = props;
+  const [focused, setFocused] = useState(false);
+  const [innerValue, setInnerValue] = useState(defaultValue);
+  const inputRef = useRef(null);
+  const compositionRef = useRef(false);
+  const keyLockRef = useRef(false);
+  const hasAffix = hasPrefixSuffix({ prefix, suffix, allowClear });
+  const value = controlledValue === void 0 ? innerValue : controlledValue;
+  const formattedValue = value === void 0 || value === null ? "" : String(value);
+  useImperativeHandle(ref, () => ({
+    focus: (option) => triggerFocus(inputRef.current, option),
+    blur: () => {
+      var _a;
+      return (_a = inputRef.current) == null ? void 0 : _a.blur();
+    },
+    setSelectionRange: (...argumentsList) => {
+      var _a;
+      return (_a = inputRef.current) == null ? void 0 : _a.setSelectionRange(...argumentsList);
+    },
+    select: () => {
+      var _a;
+      return (_a = inputRef.current) == null ? void 0 : _a.select();
+    },
+    input: inputRef.current,
+    nativeElement: inputRef.current
+  }));
+  useEffect(() => setFocused((previous) => previous && !disabled), [disabled]);
+  const triggerChange = (event, nextValue, source) => {
+    if (source === "compositionEnd") return;
+    if (controlledValue === void 0) setInnerValue(nextValue);
+    if (inputRef.current) resolveOnChange(inputRef.current, event, onChange, nextValue);
+  };
+  const input = /* @__PURE__ */ jsx(
+    "input",
+    {
+      ...restProps,
+      className: classNames("bj-input", `bj-input--${size}`, focused && !hasAffix && "bj-input--focused", status && `bj-input--${status}`, !bordered && "bj-input--borderless", disabled && "bj-input--disabled"),
+      disabled,
+      onBlur: (event) => {
+        keyLockRef.current = false;
+        setFocused(false);
+        onBlur == null ? void 0 : onBlur(event);
+      },
+      onChange: (event) => triggerChange(event, event.target.value, "change"),
+      onCompositionEnd: (event) => {
+        compositionRef.current = false;
+        triggerChange(event, event.currentTarget.value, "compositionEnd");
+        onCompositionEnd == null ? void 0 : onCompositionEnd(event);
+      },
+      onCompositionStart: (event) => {
+        compositionRef.current = true;
+        onCompositionStart == null ? void 0 : onCompositionStart(event);
+      },
+      onFocus: (event) => {
+        setFocused(true);
+        onFocus == null ? void 0 : onFocus(event);
+      },
+      onKeyDown: (event) => {
+        if (onPressEnter && event.key === "Enter" && !keyLockRef.current) {
+          keyLockRef.current = true;
+          onPressEnter(event);
+        }
+        onKeyDown == null ? void 0 : onKeyDown(event);
+      },
+      onKeyUp: (event) => {
+        if (event.key === "Enter") keyLockRef.current = false;
+        onKeyUp == null ? void 0 : onKeyUp(event);
+      },
+      ref: inputRef,
+      size: htmlSize,
+      type
+    }
+  );
+  return /* @__PURE__ */ jsx(
+    BaseInput,
+    {
+      addonAfter,
+      addonBefore,
+      allowClear,
+      className,
+      disabled,
+      focused,
+      handleReset: (event) => {
+        if (controlledValue === void 0) setInnerValue("");
+        triggerFocus(inputRef.current);
+        if (inputRef.current) resolveOnChange(inputRef.current, event, onChange);
+      },
+      onClear,
+      prefix,
+      readOnly,
+      size,
+      status,
+      suffix,
+      triggerInputFocus: () => triggerFocus(inputRef.current),
+      value: formattedValue,
+      children: input
+    }
+  );
+});
+BInput.displayName = "BInput";
+export {
+  BInput as default
+};

package/dist/web/BasicInput/utils.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+function hasAddon(props) {
+  return Boolean(props.addonBefore || props.addonAfter);
+}
+function hasPrefixSuffix(props) {
+  return Boolean(props.prefix || props.suffix || props.allowClear);
+}
+function cloneEvent(event, target, value) {
+  const currentTarget = target.cloneNode(true);
+  const nextEvent = Object.create(event, {
+    target: { value: currentTarget },
+    currentTarget: { value: currentTarget }
+  });
+  currentTarget.value = value;
+  if (typeof target.selectionStart === "number" && typeof target.selectionEnd === "number") {
+    currentTarget.selectionStart = target.selectionStart;
+    currentTarget.selectionEnd = target.selectionEnd;
+  }
+  currentTarget.setSelectionRange = (...argumentsList) => target.setSelectionRange(...argumentsList);
+  return nextEvent;
+}
+function resolveOnChange(target, event, onChange, targetValue) {
+  if (!onChange) return;
+  if (event.type === "click") {
+    onChange(cloneEvent(event, target, ""));
+    return;
+  }
+  if (target.type !== "file" && targetValue !== void 0) {
+    onChange(cloneEvent(event, target, targetValue));
+    return;
+  }
+  onChange(event);
+}
+function triggerFocus(element, option) {
+  if (!element) return;
+  element.focus(option);
+  if (!(option == null ? void 0 : option.cursor)) return;
+  const length = element.value.length;
+  if (option.cursor === "start") element.setSelectionRange(0, 0);
+  else if (option.cursor === "end") element.setSelectionRange(length, length);
+  else element.setSelectionRange(0, length);
+}
+exports.hasAddon = hasAddon;
+exports.hasPrefixSuffix = hasPrefixSuffix;
+exports.resolveOnChange = resolveOnChange;
+exports.triggerFocus = triggerFocus;

package/dist/web/BasicInput/utils.mjs

@@ -0,0 +1,47 @@
+function hasAddon(props) {
+  return Boolean(props.addonBefore || props.addonAfter);
+}
+function hasPrefixSuffix(props) {
+  return Boolean(props.prefix || props.suffix || props.allowClear);
+}
+function cloneEvent(event, target, value) {
+  const currentTarget = target.cloneNode(true);
+  const nextEvent = Object.create(event, {
+    target: { value: currentTarget },
+    currentTarget: { value: currentTarget }
+  });
+  currentTarget.value = value;
+  if (typeof target.selectionStart === "number" && typeof target.selectionEnd === "number") {
+    currentTarget.selectionStart = target.selectionStart;
+    currentTarget.selectionEnd = target.selectionEnd;
+  }
+  currentTarget.setSelectionRange = (...argumentsList) => target.setSelectionRange(...argumentsList);
+  return nextEvent;
+}
+function resolveOnChange(target, event, onChange, targetValue) {
+  if (!onChange) return;
+  if (event.type === "click") {
+    onChange(cloneEvent(event, target, ""));
+    return;
+  }
+  if (target.type !== "file" && targetValue !== void 0) {
+    onChange(cloneEvent(event, target, targetValue));
+    return;
+  }
+  onChange(event);
+}
+function triggerFocus(element, option) {
+  if (!element) return;
+  element.focus(option);
+  if (!(option == null ? void 0 : option.cursor)) return;
+  const length = element.value.length;
+  if (option.cursor === "start") element.setSelectionRange(0, 0);
+  else if (option.cursor === "end") element.setSelectionRange(length, length);
+  else element.setSelectionRange(0, length);
+}
+export {
+  hasAddon,
+  hasPrefixSuffix,
+  resolveOnChange,
+  triggerFocus
+};