@fileverse-dev/fortune-react 1.0.26 → 1.1.0

package/es/components/SplitColumn/index.css

@@ -1,121 +0,0 @@
-#fortune-split-column {
-  /* position: absolute;
-    padding: 30px 42px;
-    z-index: 1002; */
-  /* min-width: 500px; */
-  width: 464px;
-
-  input[type="checkbox"] {
-    accent-color: black;
-    appearance: none;
-    -webkit-appearance: none;
-    width: 16px;
-    height: 16px;
-    border: 1.5px solid black;
-    border-radius: 3px;
-    position: relative;
-    cursor: pointer;
-  }
-  
-  input[type="checkbox"]:checked {
-    background-color: black;
-    border-color: black;
-  }
-  
-  /* Smaller tick mark */
-  input[type="checkbox"]:checked::before {
-    content: '';
-    position: absolute;
-    top: 2px;
-    left: 4px;
-    width: 4px;      /* Reduced from default */
-    height: 7px;     /* Reduced from default */
-    border: solid white;
-    border-width: 0 1px 1px 0;
-    transform: rotate(45deg);
-  }
-}
-#fortune-split-column label {
-  user-select: none;
-}
-#fortune-split-column .title {
-  font-size: 16px;
-}
-#fortune-split-column .splitDelimiters {
-  margin-top: 20px;
-}
-.splitSymbols {
-  width: 464px
-}
-#fortune-split-column .splitSymbols {
-  position: relative;
-  /* border: 1px solid #dfdfdf; */
-  padding: 5px 5px 5px 0;
-  margin: 5px 0px;
-}
-#fortune-split-column .splitSymbol {
-  font-size: 14px;
-}
-#fortune-split-column .splitSimple {
-  position: absolute;
-  top: 114px;
-  left: 0px;
-}
-#fortune-split-column #otherValue {
-  margin-left: 5px;
-  width: 50px;
-  padding: 0 5px;
-}
-#fortune-split-column .splitDataPreview {
-  font-size: 14px;
-  /* margin-top: 26px; */
-  margin-bottom: 12px;
-}
-#fortune-split-column .splitColumnData {
-  border: 1px solid #dfdfdf;
-  border-radius: 4px;
-  background-color: #F8F9FA;
-  padding: 5px;
-  margin: 5px 0px;
-  height: 100px;
-  overflow-y: scroll;
-}
-#fortune-split-column .button-basic {
-  display: inline-block;
-  margin-bottom: 0;
-  font-weight: 400;
-  text-align: center;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  white-space: nowrap;
-  padding: 4px 8px;
-  font-size: 14px;
-  line-height: 1.42857143;
-  border-radius: 2px;
-  user-select: none;
-}
-#fortune-split-column .button-primary {
-  background: #0188fb;
-  border: 1px solid #0188fb;
-  color: #fff;
-  margin-right: 10px;
-}
-#fortune-split-column .button-close {
-  color: #333;
-  background-color: #fff;
-  border: 1px solid #ccc;
-}
-#fortune-split-column table {
-  border-collapse: collapse;
-}
-#fortune-split-column tr {
-  display: table-row;
-  vertical-align: inherit;
-  border-color: inherit;
-}
-#fortune-split-column td {
-  border: 1px solid #333;
-  display: table-cell;
-  vertical-align: inherit;
-}

package/es/components/SplitColumn/index.js

@@ -1,167 +0,0 @@
-import { getDataArr, getFlowdata, getRegStr, locale, updateMoreCell } from "@fileverse-dev/fortune-core";
-import { Button, TextField } from "@fileverse/ui";
-import _ from "lodash";
-import React, { useContext, useEffect, useState, useCallback, useRef } from "react";
-import WorkbookContext from "../../context";
-import { useDialog } from "../../hooks/useDialog";
-import "./index.css";
-export var SplitColumn = function SplitColumn() {
-  var _a = useContext(WorkbookContext),
-    context = _a.context,
-    setContext = _a.setContext;
-  var _b = locale(context),
-    splitText = _b.splitText,
-    button = _b.button;
-  var _c = useState(""),
-    splitOperate = _c[0],
-    setSplitOperate = _c[1];
-  var _d = useState(false),
-    otherFlag = _d[0],
-    setOtherFlag = _d[1];
-  var _e = useState([]),
-    tableData = _e[0],
-    setTableData = _e[1];
-  var splitSymbols = useRef(null);
-  var _f = useDialog(),
-    showDialog = _f.showDialog,
-    hideDialog = _f.hideDialog;
-  var certainBtn = useCallback(function () {
-    hideDialog();
-    var dataArr = getDataArr(splitOperate, context);
-    var r = context.luckysheet_select_save[0].row[0];
-    var c = context.luckysheet_select_save[0].column[0];
-    if (dataArr[0].length === 1) {
-      return;
-    }
-    var dataCover = false;
-    var data = getFlowdata(context);
-    for (var i = 0; i < dataArr.length; i += 1) {
-      for (var j = 1; j < dataArr[0].length; j += 1) {
-        var cell = data[r + i][c + j];
-        if (!_.isNull(cell) && !_.isNull(cell.v)) {
-          dataCover = true;
-          break;
-        }
-      }
-    }
-    if (dataCover) {
-      showDialog(splitText.splitConfirmToExe, "yesno", undefined, undefined, undefined, function () {
-        hideDialog();
-        setContext(function (ctx) {
-          updateMoreCell(r, c, dataArr, ctx);
-        });
-      });
-    } else {
-      setContext(function (ctx) {
-        updateMoreCell(r, c, dataArr, ctx);
-      });
-    }
-  }, [context, hideDialog, setContext, showDialog, splitOperate, splitText.splitConfirmToExe]);
-  useEffect(function () {
-    setTableData(function (table) {
-      table = getDataArr(splitOperate, context);
-      return table;
-    });
-  }, [context, splitOperate]);
-  return /*#__PURE__*/React.createElement("div", {
-    id: "fortune-split-column"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "splitDataPreview text-heading-xsm"
-  }, splitText.splitDataPreview), /*#__PURE__*/React.createElement("div", {
-    className: "splitColumnData"
-  }, /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("tbody", null, tableData.map(function (o, index) {
-    if (o.length >= 1) {
-      return /*#__PURE__*/React.createElement("tr", {
-        key: index
-      }, o.map(function (o1) {
-        return /*#__PURE__*/React.createElement("td", {
-          key: o + o1
-        }, o1);
-      }));
-    }
-    return /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null));
-  })))), /*#__PURE__*/React.createElement("div", {
-    className: "splitDelimiters text-heading-xsm !mt-4"
-  }, "Separator"), /*#__PURE__*/React.createElement("div", {
-    className: "splitSymbols flex gap-3 flex-wrap",
-    ref: splitSymbols
-  }, splitText.splitSymbols.map(function (o) {
-    return /*#__PURE__*/React.createElement("div", {
-      key: o.value,
-      className: "splitSymbol flex gap-2 items-center"
-    }, /*#__PURE__*/React.createElement("input", {
-      id: o.value,
-      name: o.value,
-      type: "checkbox",
-      onClick: function onClick() {
-        setSplitOperate(function (regStr) {
-          var _a;
-          return getRegStr(regStr, (_a = splitSymbols.current) === null || _a === void 0 ? void 0 : _a.childNodes);
-        });
-      },
-      tabIndex: 0
-    }), /*#__PURE__*/React.createElement("label", {
-      htmlFor: o.value,
-      className: "text-body-sm"
-    }, o.name));
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "splitSymbol flex gap-2 items-center pb-4 mb-4  border-b"
-  }, /*#__PURE__*/React.createElement("input", {
-    id: "other",
-    name: "other",
-    type: "checkbox",
-    onClick: function onClick() {
-      setOtherFlag(!otherFlag);
-      setSplitOperate(function (regStr) {
-        var _a;
-        return getRegStr(regStr, (_a = splitSymbols.current) === null || _a === void 0 ? void 0 : _a.childNodes);
-      });
-    },
-    tabIndex: 0
-  }), /*#__PURE__*/React.createElement("label", {
-    htmlFor: "other"
-  }, "Custom"), /*#__PURE__*/React.createElement(TextField, {
-    placeholder: "Custom separator",
-    id: "otherValue",
-    name: "otherValue",
-    type: "text",
-    onBlur: function onBlur() {
-      if (otherFlag) {
-        setSplitOperate(function (regStr) {
-          var _a;
-          return getRegStr(regStr, (_a = splitSymbols.current) === null || _a === void 0 ? void 0 : _a.childNodes);
-        });
-      }
-    }
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "splitSymbol flex gap-2 mb-4 items-center"
-  }, /*#__PURE__*/React.createElement("input", {
-    id: "splitsimple",
-    name: "splitsimple",
-    type: "checkbox",
-    onClick: function onClick() {
-      setSplitOperate(function (regStr) {
-        var _a;
-        return getRegStr(regStr, (_a = splitSymbols.current) === null || _a === void 0 ? void 0 : _a.childNodes);
-      });
-    },
-    tabIndex: 0
-  }), /*#__PURE__*/React.createElement("label", {
-    htmlFor: "splitsimple"
-  }, splitText.splitContinueSymbol)), /*#__PURE__*/React.createElement("div", {
-    className: "flex justify-end gap-2"
-  }, /*#__PURE__*/React.createElement(Button, {
-    className: "",
-    variant: "secondary",
-    onClick: function onClick() {
-      hideDialog();
-    },
-    tabIndex: 0
-  }, button.cancel), /*#__PURE__*/React.createElement(Button, {
-    className: "",
-    onClick: function onClick() {
-      certainBtn();
-    },
-    tabIndex: 0
-  }, "Split")));
-};

package/es/components/Toolbar/Button.d.ts

@@ -1,12 +0,0 @@
-import React from "react";
-type Props = {
-    tooltip: string;
-    iconId: string;
-    onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
-    disabled?: boolean;
-    selected?: boolean;
-    children?: React.ReactNode;
-    style?: React.CSSProperties;
-};
-declare const Button: React.FC<Props>;
-export default Button;

package/es/components/Toolbar/Button.js

@@ -1,32 +0,0 @@
-import React from "react";
-import { LucideIcon, Tooltip } from "@fileverse/ui";
-import { getLucideIcon } from ".";
-var Button = function Button(_a) {
-  var tooltip = _a.tooltip,
-    onClick = _a.onClick,
-    iconId = _a.iconId,
-    disabled = _a.disabled,
-    selected = _a.selected,
-    children = _a.children,
-    style = _a.style;
-  return /*#__PURE__*/React.createElement(Tooltip, {
-    text: tooltip,
-    placement: "bottom"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "fortune-toolbar-button fortune-toolbar-item",
-    onClick: onClick,
-    tabIndex: 0,
-    role: "button",
-    style: selected ? {
-      backgroundColor: "#FFDF0A"
-    } : style
-  }, /*#__PURE__*/React.createElement(LucideIcon, {
-    name: getLucideIcon(iconId),
-    width: 16,
-    height: 16,
-    style: disabled ? {
-      opacity: 0.3
-    } : {}
-  }), children));
-};
-export default Button;

package/es/components/Toolbar/ColorPicker.js

@@ -1,27 +0,0 @@
-import React from "react";
-var palette = [["#000000", "#444444", "#666666", "#999999", "#B7B7B7", "#cccccc", "#D9D9D9", "#EFEFEF", "#f3f3f3", "#ffffff"], ["#970007", "#FE0012", "#FE9728", "#FFFD40", "#27FD3C", "#21FFFF", "#4A89E4", "#0027F9", "#9726FA", "#FD23FA"], ["#E6B8B0", "#f4cccc", "#FCE5CF", "#FFF1CF", "#DAEAD4", "#D0E0E3", "#C9DBF7", "#CFE3F2", "#D9D3E8", "#EAD1DC"], ["#DC7D6D", "#E9999A", "#F9CAA0", "#FFE49F", "#B7D6AB", "#A3C4C9", "#A4C3F2", "#A0C6E6", "#B4A8D4", "#D5A7BC"], ["#CB402B", "#DF6668", "#F6B171", "#FFD871", "#95C382", "#77A6AF", "#6DA0E8", "#70AADA", "#8E7EC0", "#C17C9F"], ["#A51A0A", "#CB000C", "#E59043", "#F1C046", "#6CA756", "#46828D", "#3C7BD4", "#3E87C3", "#6651A4", "#A54E78"], ["#841F11", "#980007", "#B35E19", "#BF8F22", "#3A7527", "#15505B", "#0E5AC8", "#0B5592", "#0B5592", "#731C46"], ["#5B0E03", "#660003", "#783E0E", "#7F5F13", "#284E19", "#0D343D", "#1C4785", "#073961", "#1F154B", "#4C112F"]];
-var ColorPicker = function ColorPicker(_a) {
-  var onPick = _a.onPick;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "fortune-toolbar-color-picker"
-  }, palette.map(function (rows, i) {
-    return /*#__PURE__*/React.createElement("div", {
-      key: i,
-      className: "fortune-toolbar-color-picker-row"
-    }, rows.map(function (c) {
-      return /*#__PURE__*/React.createElement("div", {
-        key: c,
-        className: "fortune-toolbar-color-picker-item",
-        onClick: function onClick() {
-          return onPick(c);
-        },
-        tabIndex: 0,
-        style: {
-          backgroundColor: c,
-          border: c === "#ffffff" ? "1px solid #E8EBEC" : "none"
-        }
-      });
-    }));
-  }));
-};
-export default ColorPicker;

package/es/components/Toolbar/Combo.js

@@ -1,102 +0,0 @@
-import React, { useMemo, useRef, useState } from "react";
-import { IconButton, Tooltip, Popover, PopoverContent, PopoverTrigger, cn, Button } from "@fileverse/ui";
-import SVGIcon from "../SVGIcon";
-import { getLucideIcon } from ".";
-var Combo = function Combo(_a) {
-  var tooltip = _a.tooltip,
-    _onClick = _a.onClick,
-    text = _a.text,
-    iconId = _a.iconId,
-    _b = _a.showArrow,
-    showArrow = _b === void 0 ? true : _b,
-    children = _a.children,
-    fillColor = _a.fillColor;
-  var style = {
-    userSelect: "none"
-  };
-  var _c = useState(false),
-    open = _c[0],
-    setOpen = _c[1];
-  var buttonRef = useRef(null);
-  var isLucideIcon = useMemo(function () {
-    return (iconId === null || iconId === void 0 ? void 0 : iconId.startsWith("align-")) || ["text-overflow", "text-wrap", "text-clip", "font-color", "background", "border-all", "merge-all", "format", "conditionFormat", "filter", "comment", "image", "formula-sum", "dune", "template", "font-color", "background"].includes(iconId);
-  }, [iconId]);
-  var trigger = !isLucideIcon ? (/*#__PURE__*/React.createElement(Tooltip, {
-    text: tooltip,
-    placement: "bottom"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "fortune-toolbar-combo-button",
-    onClick: function onClick(e) {
-      if (_onClick) {
-        _onClick(e);
-        if (!showArrow) setOpen(!open);
-      }
-    },
-    tabIndex: 0,
-    role: "button",
-    style: style
-  }, iconId ? (/*#__PURE__*/React.createElement(SVGIcon, {
-    name: iconId,
-    width: 16,
-    height: 16
-  })) : (/*#__PURE__*/React.createElement("span", {
-    className: "fortune-toolbar-combo-text"
-  }, text !== undefined ? text : ""))))) : (/*#__PURE__*/React.createElement("span", null, iconId === "font-color" ? (/*#__PURE__*/React.createElement(Tooltip, {
-    text: tooltip,
-    placement: "bottom"
-  }, /*#__PURE__*/React.createElement(Button, {
-    variant: "ghost",
-    onClick: function onClick() {
-      return setOpen(!open);
-    },
-    className: cn("fortune-toolbar-combo-button !min-w-fit !px-0", {}),
-    style: {
-      width: 30,
-      height: 30
-    }
-  }, /*#__PURE__*/React.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "16",
-    height: "16",
-    viewBox: "0 0 24 24",
-    fill: fillColor
-  }, /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M11.9997 3C12.3784 3 12.7248 3.21402 12.8942 3.55273L20.8942 19.5527L20.9352 19.6465C21.115 20.1204 20.9101 20.663 20.447 20.8945C19.9839 21.1259 19.4272 20.9642 19.1559 20.5361L19.1052 20.4473L16.8815 16H7.11786L4.89422 20.4473C4.64719 20.9412 4.04636 21.1415 3.55243 20.8945C3.05867 20.6475 2.85831 20.0466 3.10516 19.5527L11.1052 3.55273L11.1764 3.43164C11.3613 3.16376 11.6684 3.0001 11.9997 3ZM8.11786 14H15.8815L11.9997 6.23633L8.11786 14Z",
-    fill: fillColor
-  }))))) : (/*#__PURE__*/React.createElement(Tooltip, {
-    text: tooltip,
-    placement: "bottom"
-  }, /*#__PURE__*/React.createElement(IconButton, {
-    icon: getLucideIcon(iconId),
-    variant: "ghost",
-    onClick: function onClick() {
-      return setOpen(!open);
-    },
-    className: cn("fortune-toolbar-combo-button", {
-      "custom-color-button": iconId === "font-color" && fillColor
-    }),
-    style: {
-      color: iconId === "font-color" ? fillColor : undefined
-    }
-  })))));
-  return /*#__PURE__*/React.createElement("div", {
-    ref: buttonRef,
-    className: "fortune-toolbar-item"
-  }, /*#__PURE__*/React.createElement(Popover, {
-    open: open,
-    onOpenChange: setOpen
-  }, /*#__PURE__*/React.createElement(PopoverTrigger, {
-    asChild: true
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex items-center"
-  }, trigger)), /*#__PURE__*/React.createElement(PopoverContent, {
-    align: "start",
-    side: "bottom",
-    sideOffset: 4,
-    alignOffset: -16,
-    className: "fortune-toolbar-combo-popup border-none"
-  }, children === null || children === void 0 ? void 0 : children(setOpen))));
-};
-export default Combo;

package/es/components/Toolbar/CustomBorder.js

@@ -1,211 +0,0 @@
-import React, { useCallback, useContext, useRef, useState } from "react";
-import "./index.css";
-import { locale } from "@fileverse-dev/fortune-core";
-import _ from "lodash";
-import WorkbookContext from "../../context";
-import SVGIcon from "../SVGIcon";
-import { CustomColor } from "./CustomColor";
-var size = [{
-  Text: "1",
-  value: "Thin",
-  strokeDasharray: "1,0",
-  strokeWidth: "1"
-}, {
-  Text: "2",
-  value: "Hair",
-  strokeDasharray: "1,5",
-  strokeWidth: "1"
-}, {
-  Text: "3",
-  value: "Dotted",
-  strokeDasharray: "2,5",
-  strokeWidth: "2"
-}, {
-  Text: "4",
-  value: "Dashed",
-  strokeDasharray: "5,5",
-  strokeWidth: "2"
-}, {
-  Text: "5",
-  value: "DashDot",
-  strokeDasharray: "20,5,5,10,5,5",
-  strokeWidth: "2"
-}, {
-  Text: "6",
-  value: "DashDotDot",
-  strokeDasharray: "20,5,5,5,5,10,5,5,5,5",
-  strokeWidth: "2"
-}, {
-  Text: "8",
-  value: "Medium",
-  strokeDasharray: "2,0",
-  strokeWidth: "2"
-}, {
-  Text: "9",
-  value: "MediumDashed",
-  strokeDasharray: "3,5",
-  strokeWidth: "3"
-}, {
-  Text: "10",
-  value: "MediumDashDot",
-  strokeDasharray: "20,5,5,10,5,5",
-  strokeWidth: "3"
-}, {
-  Text: "11",
-  value: "MediumDashDotDot",
-  strokeDasharray: "5,5,5,5,20,5,5,5,5,10",
-  strokeWidth: "3"
-}, {
-  Text: "13",
-  value: "Thick",
-  strokeDasharray: "2,0",
-  strokeWidth: "3"
-}];
-var CustomBorder = function CustomBorder(_a) {
-  var onPick = _a.onPick;
-  var _b = useContext(WorkbookContext),
-    context = _b.context,
-    refs = _b.refs;
-  var border = locale(context).border;
-  var _c = useState("#000000"),
-    changeColor = _c[0],
-    setchangeColor = _c[1];
-  var _d = useState("1"),
-    changeStyle = _d[0],
-    setchangeStyle = _d[1];
-  var colorRef = useRef(null);
-  var styleRef = useRef(null);
-  var colorPreviewRef = useRef(null);
-  var _e = useState(""),
-    previewWith = _e[0],
-    setPreviewWith = _e[1];
-  var _f = useState(""),
-    previewdasharry = _f[0],
-    setPreviewdasharray = _f[1];
-  var showBorderSubMenu = useCallback(function (e) {
-    var target = e.target;
-    var menuItemRect = target.getBoundingClientRect();
-    var subMenuItem = target.querySelector(".fortune-border-select-menu");
-    if (_.isNil(subMenuItem)) return;
-    subMenuItem.style.display = "block";
-    var workbookContainerRect = refs.workbookContainer.current.getBoundingClientRect();
-    if (workbookContainerRect.width - menuItemRect.right > parseFloat(subMenuItem.style.width.replace("px", ""))) {
-      subMenuItem.style.left = "".concat(menuItemRect === null || menuItemRect === void 0 ? void 0 : menuItemRect.width, "px");
-    } else {
-      subMenuItem.style.left = "-".concat(subMenuItem.style.width);
-    }
-  }, [refs.workbookContainer]);
-  var hideBorderSubMenu = useCallback(function () {
-    styleRef.current.style.display = "none";
-    colorRef.current.style.display = "none";
-  }, []);
-  var changePreviewStyle = useCallback(function (width, dasharray) {
-    setPreviewWith(width);
-    setPreviewdasharray(dasharray);
-  }, []);
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
-    className: "fortune-border-select-option",
-    key: "borderColor",
-    onMouseEnter: function onMouseEnter(e) {
-      showBorderSubMenu(e);
-    },
-    onMouseLeave: function onMouseLeave() {
-      hideBorderSubMenu();
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "fortune-toolbar-menu-line"
-  }, border.borderColor, /*#__PURE__*/React.createElement(SVGIcon, {
-    name: "rightArrow",
-    style: {
-      width: "14px"
-    }
-  })), /*#__PURE__*/React.createElement("div", {
-    ref: colorPreviewRef,
-    className: "fortune-border-color-preview",
-    style: {
-      backgroundColor: changeColor
-    }
-  }), /*#__PURE__*/React.createElement("div", {
-    ref: colorRef,
-    className: "fortune-border-select-menu",
-    style: {
-      display: "none",
-      width: "166px"
-    }
-  }, /*#__PURE__*/React.createElement(CustomColor, {
-    onCustomPick: function onCustomPick(color) {
-      onPick(color, changeStyle);
-      colorPreviewRef.current.style.backgroundColor = changeColor;
-      setchangeColor(color);
-    },
-    onColorPick: function onColorPick(color) {
-      onPick(color, changeStyle);
-      setchangeColor(color);
-    }
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: "fortune-border-select-option",
-    key: "borderStyle",
-    onMouseEnter: function onMouseEnter(e) {
-      showBorderSubMenu(e);
-    },
-    onMouseLeave: function onMouseLeave() {
-      hideBorderSubMenu();
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "fortune-toolbar-menu-line"
-  }, border.borderStyle, /*#__PURE__*/React.createElement(SVGIcon, {
-    name: "rightArrow",
-    style: {
-      width: "14px"
-    }
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "fortune-border-style-preview"
-  }, /*#__PURE__*/React.createElement("svg", {
-    width: "90"
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    stroke: "black",
-    strokeWidth: previewWith
-  }, /*#__PURE__*/React.createElement("path", {
-    strokeDasharray: previewdasharry,
-    d: "M0 0 l90 0"
-  })))), /*#__PURE__*/React.createElement("div", {
-    ref: styleRef,
-    className: "fortune-border-select-menu fortune-toolbar-select",
-    style: {
-      display: "none",
-      width: "110px"
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "fortune-border-style-picker-menu fortune-border-style-reset",
-    onClick: function onClick() {
-      onPick(changeColor, "1");
-      changePreviewStyle("1", "1,0");
-    },
-    tabIndex: 0
-  }, border.borderDefault), /*#__PURE__*/React.createElement("div", {
-    className: "fortune-boder-style-picker"
-  }, size.map(function (items, i) {
-    return /*#__PURE__*/React.createElement("div", {
-      key: i,
-      className: "fortune-border-style-picker-menu",
-      onClick: function onClick() {
-        onPick(changeColor, items.Text);
-        setchangeStyle(items.Text);
-        changePreviewStyle(items.strokeWidth, items.strokeDasharray);
-      },
-      tabIndex: 0
-    }, /*#__PURE__*/React.createElement("svg", {
-      height: "10",
-      width: "90"
-    }, /*#__PURE__*/React.createElement("g", {
-      fill: "none",
-      stroke: "black",
-      strokeWidth: items.strokeWidth
-    }, /*#__PURE__*/React.createElement("path", {
-      strokeDasharray: items.strokeDasharray,
-      d: "M0 5 l85 0"
-    }))));
-  })))));
-};
-export default CustomBorder;

package/es/components/Toolbar/CustomButton.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-type Props = {
-    tooltip?: string;
-    onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
-    selected?: boolean;
-    children?: React.ReactNode;
-    iconName?: string;
-    icon?: React.ReactNode;
-};
-declare const CustomButton: React.FC<Props>;
-export default CustomButton;