@underverse-ui/underverse 1.0.191 → 1.0.193

package/dist/index.js

@@ -910,6 +910,19 @@ var en_default = {
       borderStyle: "Border Style",
       borderWidth: "Border Width",
       borderColor: "Border Color",
+      borderPosition: "Border placement",
+      borderMode: "Border mode",
+      borderDraw: "Draw borders",
+      borderErase: "Hide borders",
+      borderAll: "All borders",
+      borderOuter: "Outer borders",
+      borderInner: "Inner borders",
+      borderHorizontal: "Inner horizontal borders",
+      borderVertical: "Inner vertical borders",
+      borderTop: "Top border",
+      borderRight: "Right border",
+      borderBottom: "Bottom border",
+      borderLeft: "Left border",
       clearBorder: "Clear Border",
       formula: "Formula",
       formulaBar: "Formula bar",
@@ -1343,6 +1356,19 @@ var vi_default = {
       borderStyle: "Ki\u1EC3u vi\u1EC1n",
       borderWidth: "\u0110\u1ED9 d\xE0y vi\u1EC1n",
       borderColor: "M\xE0u vi\u1EC1n",
+      borderPosition: "V\u1ECB tr\xED vi\u1EC1n",
+      borderMode: "Ch\u1EBF \u0111\u1ED9 vi\u1EC1n",
+      borderDraw: "V\u1EBD vi\u1EC1n",
+      borderErase: "\u1EA8n c\u1EA1nh",
+      borderAll: "T\u1EA5t c\u1EA3 vi\u1EC1n",
+      borderOuter: "Vi\u1EC1n ngo\xE0i",
+      borderInner: "Vi\u1EC1n trong",
+      borderHorizontal: "Vi\u1EC1n ngang b\xEAn trong",
+      borderVertical: "Vi\u1EC1n d\u1ECDc b\xEAn trong",
+      borderTop: "Vi\u1EC1n tr\xEAn",
+      borderRight: "Vi\u1EC1n ph\u1EA3i",
+      borderBottom: "Vi\u1EC1n d\u01B0\u1EDBi",
+      borderLeft: "Vi\u1EC1n tr\xE1i",
       clearBorder: "X\xF3a vi\u1EC1n",
       formula: "C\xF4ng th\u1EE9c",
       formulaBar: "Thanh c\xF4ng th\u1EE9c",
@@ -1776,6 +1802,19 @@ var ko_default = {
       borderStyle: "\uD14C\uB450\uB9AC \uC2A4\uD0C0\uC77C",
       borderWidth: "\uD14C\uB450\uB9AC \uB450\uAED8",
       borderColor: "\uD14C\uB450\uB9AC \uC0C9\uC0C1",
+      borderPosition: "\uD14C\uB450\uB9AC \uC704\uCE58",
+      borderMode: "\uD14C\uB450\uB9AC \uBAA8\uB4DC",
+      borderDraw: "\uD14C\uB450\uB9AC \uADF8\uB9AC\uAE30",
+      borderErase: "\uD14C\uB450\uB9AC \uC228\uAE30\uAE30",
+      borderAll: "\uBAA8\uB4E0 \uD14C\uB450\uB9AC",
+      borderOuter: "\uBC14\uAE65\uCABD \uD14C\uB450\uB9AC",
+      borderInner: "\uC548\uCABD \uD14C\uB450\uB9AC",
+      borderHorizontal: "\uC548\uCABD \uAC00\uB85C \uD14C\uB450\uB9AC",
+      borderVertical: "\uC548\uCABD \uC138\uB85C \uD14C\uB450\uB9AC",
+      borderTop: "\uC704\uCABD \uD14C\uB450\uB9AC",
+      borderRight: "\uC624\uB978\uCABD \uD14C\uB450\uB9AC",
+      borderBottom: "\uC544\uB798\uCABD \uD14C\uB450\uB9AC",
+      borderLeft: "\uC67C\uCABD \uD14C\uB450\uB9AC",
       clearBorder: "\uD14C\uB450\uB9AC \uC9C0\uC6B0\uAE30",
       formula: "\uC218\uC2DD",
       formulaBar: "\uC218\uC2DD \uC785\uB825\uC904",
@@ -2209,6 +2248,19 @@ var ja_default = {
       borderStyle: "\u67A0\u7DDA\u30B9\u30BF\u30A4\u30EB",
       borderWidth: "\u67A0\u7DDA\u306E\u592A\u3055",
       borderColor: "\u67A0\u7DDA\u306E\u8272",
+      borderPosition: "\u67A0\u7DDA\u306E\u4F4D\u7F6E",
+      borderMode: "\u67A0\u7DDA\u30E2\u30FC\u30C9",
+      borderDraw: "\u67A0\u7DDA\u3092\u5F15\u304F",
+      borderErase: "\u67A0\u7DDA\u3092\u975E\u8868\u793A",
+      borderAll: "\u3059\u3079\u3066\u306E\u67A0\u7DDA",
+      borderOuter: "\u5916\u67A0",
+      borderInner: "\u5185\u5074\u306E\u67A0\u7DDA",
+      borderHorizontal: "\u5185\u5074\u306E\u6A2A\u7F6B\u7DDA",
+      borderVertical: "\u5185\u5074\u306E\u7E26\u7F6B\u7DDA",
+      borderTop: "\u4E0A\u7F6B\u7DDA",
+      borderRight: "\u53F3\u7F6B\u7DDA",
+      borderBottom: "\u4E0B\u7F6B\u7DDA",
+      borderLeft: "\u5DE6\u7F6B\u7DDA",
       clearBorder: "\u67A0\u7DDA\u3092\u30AF\u30EA\u30A2",
       formula: "\u6570\u5F0F",
       formulaBar: "\u6570\u5F0F\u30D0\u30FC",
@@ -3365,7 +3417,7 @@ var Textarea = forwardRef3(
     required,
     value,
     maxLength,
-    borderMode = "2xl",
+    borderMode,
     ...props
   }, ref) => {
     const [isFocused, setIsFocused] = useState4(false);
@@ -6774,9 +6826,12 @@ var Modal = ({
   noPadding = false,
   fullWidth = false,
   width,
-  height
+  height,
+  borderMode
 }) => {
   const gi18n = useGlobalI18n();
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.borderMode;
   const [isMounted, setIsMounted] = React22.useState(false);
   const [isVisible, setIsVisible] = React22.useState(false);
   const [isAnimating, setIsAnimating] = React22.useState(true);
@@ -6882,7 +6937,8 @@ var Modal = ({
           {
             ref: modalContentRef,
             className: cn(
-              "relative w-full rounded-2xl md:rounded-3xl border border-border/40 bg-card text-card-foreground shadow-xl",
+              "relative w-full border border-border/40 bg-card text-card-foreground shadow-xl",
+              resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-2xl md:rounded-3xl",
               "transition-all duration-200 ease-out",
               maxWidthClass,
               fullWidth && "mx-0",
@@ -7390,7 +7446,8 @@ var Popover = ({
   open,
   onOpenChange,
   matchTriggerWidth = false,
-  contentWidth
+  contentWidth,
+  borderMode
 }) => {
   const isControlled = open !== void 0;
   const [internalOpen, setInternalOpen] = React24.useState(false);
@@ -7399,6 +7456,8 @@ var Popover = ({
   const panelRef = React24.useRef(null);
   const lastAppliedRef = React24.useRef(null);
   useShadCNAnimations();
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.popover?.borderMode ?? globalConfig.borderMode;
   const isOpen = isControlled ? open : internalOpen;
   const setIsOpen = React24.useCallback(
     (next) => {
@@ -7579,7 +7638,8 @@ var Popover = ({
               {
                 ...contentProps,
                 className: cn(
-                  "rounded-2xl md:rounded-3xl border bg-popover text-popover-foreground shadow-md",
+                  resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-2xl md:rounded-3xl",
+                  "border bg-popover text-popover-foreground shadow-md",
                   "backdrop-blur-sm bg-popover/95 border-border/60 p-4",
                   contentProps?.className,
                   contentClassName
@@ -7918,7 +7978,9 @@ var SlideOver = (props) => {
   return /* @__PURE__ */ jsx27(Sheet, { ...props, side: "right", variant: "overlay", size: "lg" });
 };
 var BottomSheet = ({ snapPoints = ["25%", "50%", "90%"], defaultSnap = 1, ...props }) => {
-  return /* @__PURE__ */ jsx27(Sheet, { ...props, side: "bottom", variant: "overlay", className: cn("rounded-t-3xl", props.className) });
+  const globalConfig = useUnderverseUIConfig();
+  const isSquare = globalConfig.borderMode === "daewoo" || globalConfig.borderMode === "none";
+  return /* @__PURE__ */ jsx27(Sheet, { ...props, side: "bottom", variant: "overlay", className: cn(isSquare ? "" : "rounded-t-3xl", props.className) });
 };
 var SidebarSheet = ({ navigation, children, ...props }) => {
   return /* @__PURE__ */ jsxs17(Sheet, { ...props, side: "left", variant: "push", size: "md", children: [
@@ -8590,7 +8652,8 @@ var DropdownMenu = ({
   disabled = false,
   isOpen,
   onOpenChange,
-  items
+  items,
+  borderMode
 }) => {
   const [internalOpen, setInternalOpen] = useState18(false);
   const open = isOpen !== void 0 ? isOpen : internalOpen;
@@ -8626,6 +8689,8 @@ var DropdownMenu = ({
     item.scrollIntoView({ block: "nearest" });
   }, [getEnabledMenuItems, setActiveIndex]);
   useShadCNAnimations();
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.dropdownMenu?.borderMode ?? globalConfig.borderMode;
   React29.useEffect(() => {
     if (!open) return;
     const handleKeyNav = (e) => {
@@ -8693,7 +8758,8 @@ var DropdownMenu = ({
           animationDelay: open ? `${Math.min(index * 20, 200)}ms` : "0ms"
         },
         className: cn(
-          "dropdown-item flex w-full items-center gap-2 px-2.5 py-1.5 text-sm rounded-lg",
+          "dropdown-item flex w-full items-center gap-2 px-2.5 py-1.5 text-sm",
+          resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-lg",
           "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
           "hover:bg-accent hover:text-accent-foreground",
           "focus:bg-accent focus:text-accent-foreground",
@@ -8749,6 +8815,7 @@ var DropdownMenu = ({
       trigger: enhancedTrigger,
       placement,
       disabled,
+      borderMode: resolvedBorderMode,
       contentClassName: cn("p-1", contentClassName),
       children: menuBody
     }
@@ -8765,10 +8832,13 @@ var DropdownMenuItem = ({
   active,
   shortcut,
   className,
-  closeOnSelect
+  closeOnSelect,
+  borderMode
 }) => {
   const menu = React29.useContext(DropdownMenuContext);
   const shouldCloseOnSelect = closeOnSelect ?? menu?.closeOnSelect ?? false;
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.dropdownMenu?.borderMode ?? globalConfig.borderMode;
   return /* @__PURE__ */ jsxs22(
     "button",
     {
@@ -8783,7 +8853,8 @@ var DropdownMenuItem = ({
       "data-dropdown-menu-item": "",
       tabIndex: -1,
       className: cn(
-        "flex w-full items-center gap-2 px-3 py-2 text-sm rounded-lg transition-colors group cursor-pointer",
+        "flex w-full items-center gap-2 px-3 py-2 text-sm transition-colors group cursor-pointer",
+        resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-lg",
         "hover:bg-accent hover:text-accent-foreground",
         "focus:bg-accent focus:text-accent-foreground focus:outline-none",
         "disabled:opacity-50 disabled:cursor-not-allowed",
@@ -8805,56 +8876,67 @@ var DropdownMenuItem = ({
   );
 };
 var DropdownMenuSeparator = ({ className }) => /* @__PURE__ */ jsx32("div", { className: cn("h-px bg-border my-1", className) });
-var DropdownMenuSub = ({ label, icon: Icon, disabled, children }) => /* @__PURE__ */ jsx32(
-  DropdownMenu,
-  {
-    trigger: /* @__PURE__ */ jsxs22(
-      "button",
-      {
-        type: "button",
-        disabled,
-        onMouseDown: (e) => e.preventDefault(),
-        className: cn(
-          "flex w-full items-center gap-2 px-3 py-2 text-sm rounded-lg transition-colors cursor-pointer",
-          "hover:bg-accent hover:text-accent-foreground",
-          "focus:bg-accent focus:text-accent-foreground focus:outline-none",
-          "disabled:opacity-50 disabled:cursor-not-allowed"
-        ),
-        children: [
-          Icon && /* @__PURE__ */ jsx32(Icon, { className: "w-4 h-4 shrink-0 opacity-60" }),
-          /* @__PURE__ */ jsx32("span", { className: "flex-1 text-left", children: label }),
-          /* @__PURE__ */ jsx32(ChevronRight2, { className: "w-3 h-3 opacity-50" })
-        ]
-      }
-    ),
-    placement: "right",
-    children
-  }
-);
-var SelectDropdown = ({ options, value, onChange, placeholder = "Select...", className }) => /* @__PURE__ */ jsx32(
-  DropdownMenu,
-  {
-    trigger: /* @__PURE__ */ jsxs22(
-      "button",
-      {
-        className: cn(
-          "inline-flex items-center justify-between gap-2 px-3 py-2 text-sm rounded-2xl border bg-background border-border/60",
-          "hover:bg-accent/50",
-          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
-          className
-        ),
-        children: [
-          /* @__PURE__ */ jsx32("span", { className: "truncate max-w-64 text-foreground/90", children: value || placeholder }),
-          /* @__PURE__ */ jsx32("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", className: "opacity-70", children: /* @__PURE__ */ jsx32("path", { d: "M6 8l4 4 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })
-        ]
-      }
-    ),
-    items: options.map((option) => ({
-      label: option,
-      onClick: () => onChange(option)
-    }))
-  }
-);
+var DropdownMenuSub = ({ label, icon: Icon, disabled, borderMode, children }) => {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.dropdownMenu?.borderMode ?? globalConfig.borderMode;
+  return /* @__PURE__ */ jsx32(
+    DropdownMenu,
+    {
+      trigger: /* @__PURE__ */ jsxs22(
+        "button",
+        {
+          type: "button",
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          className: cn(
+            "flex w-full items-center gap-2 px-3 py-2 text-sm transition-colors cursor-pointer",
+            resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-lg",
+            "hover:bg-accent hover:text-accent-foreground",
+            "focus:bg-accent focus:text-accent-foreground focus:outline-none",
+            "disabled:opacity-50 disabled:cursor-not-allowed"
+          ),
+          children: [
+            Icon && /* @__PURE__ */ jsx32(Icon, { className: "w-4 h-4 shrink-0 opacity-60" }),
+            /* @__PURE__ */ jsx32("span", { className: "flex-1 text-left", children: label }),
+            /* @__PURE__ */ jsx32(ChevronRight2, { className: "w-3 h-3 opacity-50" })
+          ]
+        }
+      ),
+      placement: "right",
+      children
+    }
+  );
+};
+var SelectDropdown = ({ options, value, onChange, placeholder = "Select...", className, borderMode }) => {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.dropdownMenu?.borderMode ?? globalConfig.borderMode;
+  return /* @__PURE__ */ jsx32(
+    DropdownMenu,
+    {
+      trigger: /* @__PURE__ */ jsxs22(
+        "button",
+        {
+          className: cn(
+            "inline-flex items-center justify-between gap-2 px-3 py-2 text-sm border bg-background border-border/60",
+            resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-2xl",
+            "hover:bg-accent/50",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsx32("span", { className: "truncate max-w-64 text-foreground/90", children: value || placeholder }),
+            /* @__PURE__ */ jsx32("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", className: "opacity-70", children: /* @__PURE__ */ jsx32("path", { d: "M6 8l4 4 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })
+          ]
+        }
+      ),
+      items: options.map((option) => ({
+        label: option,
+        onClick: () => onChange(option)
+      })),
+      borderMode: resolvedBorderMode
+    }
+  );
+};
 var DropdownMenu_default = DropdownMenu;
 
 // src/components/Pagination.tsx
@@ -8939,6 +9021,9 @@ var Combobox = ({
   maxInitialOptions,
   showSearchPromptWhenEmptyQuery = false
 }) => {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.borderMode ?? "full";
+  const radiusClass = getBorderRadiusClass(resolvedBorderMode);
   const tv = useSmartTranslations("ValidationInput");
   const gi18n = useGlobalI18n();
   const placeholder = placeholderProp ?? gi18n.selectPlaceholder ?? "Select\u2026";
@@ -9148,7 +9233,7 @@ var Combobox = ({
     {
       "data-combobox-dropdown": true,
       "data-state": open ? "open" : "closed",
-      className: "w-full rounded-2xl md:rounded-3xl overflow-hidden",
+      className: cn("w-full overflow-hidden", getBorderRadiusClass(resolvedBorderMode)),
       children: [
         enableSearch && /* @__PURE__ */ jsx33("div", { className: cn("relative border-b border-border/30", size === "sm" ? "p-2" : size === "lg" ? "p-3" : "p-2.5"), children: /* @__PURE__ */ jsxs23("div", { className: "relative", children: [
           /* @__PURE__ */ jsx33(
@@ -9290,9 +9375,6 @@ var Combobox = ({
     filled: "border-0 bg-muted/50 hover:bg-muted/80"
   };
   const labelSize = size === "sm" ? "text-xs" : size === "lg" ? "text-base" : "text-sm";
-  const globalConfig = useUnderverseUIConfig();
-  const resolvedBorderMode = borderMode ?? globalConfig.borderMode ?? "full";
-  const radiusClass = getBorderRadiusClass(resolvedBorderMode);
   const verticalGap = size === "sm" ? "space-y-1.5" : "space-y-2";
   const triggerButtonBaseProps = {
     ref: triggerRef,
@@ -9423,12 +9505,13 @@ var Combobox = ({
         placement: "bottom-start",
         matchTriggerWidth: true,
         className: "z-9999",
-        contentClassName: "p-0 overflow-hidden rounded-2xl md:rounded-3xl",
+        borderMode: resolvedBorderMode,
+        contentClassName: "p-0 overflow-hidden",
         children: dropdownBody
       }
     ) : /* @__PURE__ */ jsxs23("div", { className: "relative", children: [
       triggerButtonInline,
-      open && /* @__PURE__ */ jsx33("div", { className: "absolute left-0 top-full mt-1 z-50 w-full", children: /* @__PURE__ */ jsx33("div", { className: "rounded-2xl md:rounded-3xl overflow-hidden border text-popover-foreground shadow-md backdrop-blur-sm bg-popover/95 border-border/60", children: dropdownBody }) })
+      open && /* @__PURE__ */ jsx33("div", { className: "absolute left-0 top-full mt-1 z-50 w-full", children: /* @__PURE__ */ jsx33("div", { className: cn("overflow-hidden border text-popover-foreground shadow-md backdrop-blur-sm bg-popover/95 border-border/60", getBorderRadiusClass(resolvedBorderMode)), children: dropdownBody }) })
     ] }),
     (helperText || effectiveError) && /* @__PURE__ */ jsxs23(
       "p",
@@ -10702,10 +10785,10 @@ var DatePicker = ({
         placement: "bottom-start",
         disabled,
         contentWidth: sizeStyles8[size].contentWidth,
+        borderMode: resolvedBorderMode,
         contentClassName: cn(
           "p-0",
           "backdrop-blur-xl bg-popover/95 border-border/40 shadow-2xl",
-          "rounded-2xl md:rounded-3xl",
           // Keep usable on small viewports (wheel scroll should stay within the popover if it overflows)
           "max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto overscroll-contain",
           sizeStyles8[size].contentPadding,
@@ -11457,10 +11540,10 @@ var DateRangePicker = ({
         placement: "bottom-start",
         disabled,
         contentWidth: sizeStyles8[size].contentWidth,
+        borderMode: resolvedBorderMode,
         contentClassName: cn(
           "p-0",
           "backdrop-blur-xl bg-popover/95 border-border/40 shadow-2xl",
-          "rounded-2xl md:rounded-3xl",
           "max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto overscroll-contain",
           sizeStyles8[size].contentPadding,
           "animate-in fade-in-0 zoom-in-95 slide-in-from-top-2 duration-300"
@@ -11860,6 +11943,8 @@ var LunarDatePicker = ({
   maxDate,
   borderMode
 }) => {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
   const t = useSmartTranslations("DatePicker");
   const tv = useSmartTranslations("ValidationInput");
   const locale = useSmartLocale();
@@ -12384,12 +12469,12 @@ var LunarDatePicker = ({
         open: isOpen,
         onOpenChange: setIsOpen,
         placement: "bottom-start",
+        borderMode: resolvedBorderMode,
         disabled,
         contentWidth: sizeStyles8[size].contentWidth,
         contentClassName: cn(
           "p-0",
           "backdrop-blur-xl bg-popover/95 border-border/40 shadow-2xl",
-          "rounded-2xl md:rounded-3xl",
           // Keep usable on small viewports (wheel scroll should stay within the popover if it overflows)
           "max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto overscroll-contain",
           sizeStyles8[size].contentPadding,
@@ -12407,7 +12492,7 @@ var LunarDatePicker = ({
             "aria-invalid": !!effectiveError,
             className: cn(
               "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
-              getBorderRadiusClass(borderMode ?? "full"),
+              getBorderRadiusClass(resolvedBorderMode),
               sizeStyles8[size].trigger,
               disabled ? "border-border/40 opacity-50 cursor-not-allowed" : [
                 "border-border/60 hover:border-primary/40",
@@ -13550,6 +13635,8 @@ function MonthYearPicker({
   borderMode,
   ...rest
 }) {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
   const gi18n = useGlobalI18n();
   const tv = useSmartTranslations("ValidationInput");
   const now = /* @__PURE__ */ new Date();
@@ -13708,7 +13795,7 @@ function MonthYearPicker({
       "aria-invalid": !!effectiveError,
       className: cn(
         "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
-        getBorderRadiusClass(borderMode ?? "full"),
+        getBorderRadiusClass(resolvedBorderMode),
         sz.height,
         sz.padding,
         sz.text,
@@ -13890,7 +13977,8 @@ function MonthYearPicker({
         {
           className: cn(
             panelSz.contentPadding,
-            "rounded-2xl border bg-background/80 backdrop-blur-sm",
+            resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-2xl md:rounded-3xl",
+            "border bg-background/80 backdrop-blur-sm",
             effectiveError ? "border-destructive/60 bg-destructive/5" : "border-border/50"
           ),
           children: pickerContent
@@ -13931,7 +14019,8 @@ function MonthYearPicker({
         contentWidth,
         matchTriggerWidth,
         disabled,
-        contentClassName: cn(panelSz.contentPadding, compactPanel && "max-w-[calc(100vw-2rem)] p-4 rounded-2xl", "rounded-2xl"),
+        borderMode: resolvedBorderMode,
+        contentClassName: cn(panelSz.contentPadding, compactPanel && "max-w-[calc(100vw-2rem)] p-4"),
         children: pickerContent
       }
     ),
@@ -15078,6 +15167,8 @@ function TimePicker({
 }) {
   const tv = useSmartTranslations("ValidationInput");
   const gi18n = useGlobalI18n();
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
   const autoId = React38.useId();
   const isControlled = value !== void 0;
   const now = /* @__PURE__ */ new Date();
@@ -15415,7 +15506,7 @@ function TimePicker({
       "aria-invalid": !!effectiveError,
       className: cn(
         "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
-        getBorderRadiusClass(borderMode ?? "full"),
+        getBorderRadiusClass(resolvedBorderMode),
         sz.height,
         sz.padding,
         sz.text,
@@ -15796,7 +15887,8 @@ function TimePicker({
         {
           className: cn(
             panelSz.contentPadding,
-            "rounded-2xl md:rounded-3xl border bg-card/95 backdrop-blur-sm shadow-xl",
+            resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-2xl md:rounded-3xl",
+            "border bg-card/95 backdrop-blur-sm shadow-xl",
             effectiveError ? "border-destructive/60 bg-destructive/5" : "border-border/60",
             className
           ),
@@ -15852,10 +15944,11 @@ function TimePicker({
         placement: "bottom-start",
         matchTriggerWidth: shouldMatchTriggerWidth,
         contentWidth: shouldMatchTriggerWidth ? void 0 : contentWidth,
+        borderMode: resolvedBorderMode,
         contentClassName: cn(
           panelSz.contentPadding,
-          compactPanel && "max-w-[calc(100vw-2rem)] p-4 rounded-2xl",
-          "rounded-2xl md:rounded-3xl border bg-popover/98 backdrop-blur-md shadow-2xl",
+          compactPanel && "max-w-[calc(100vw-2rem)] p-4",
+          "border bg-popover/98 backdrop-blur-md shadow-2xl",
           effectiveError && "border-destructive/40",
           success && !effectiveError && "border-success/40",
           !effectiveError && !success && "border-border/60",
@@ -15898,6 +15991,8 @@ var DateTimePicker = ({
   size = "md",
   borderMode
 }) => {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
   const t = useSmartTranslations("DateTimePicker");
   const tv = useSmartTranslations("ValidationInput");
   const locale = useSmartLocale();
@@ -16077,7 +16172,7 @@ var DateTimePicker = ({
             "aria-invalid": !!effectiveError,
             className: cn(
               "flex w-full items-center justify-between border border-input bg-background",
-              getBorderRadiusClass(borderMode ?? "full"),
+              getBorderRadiusClass(resolvedBorderMode),
               sizeStyles8[size].trigger,
               "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
               disabled && "opacity-50 cursor-not-allowed",
@@ -16106,12 +16201,9 @@ var DateTimePicker = ({
             ]
           }
         ),
-        contentClassName: cn(
-          "w-auto p-0 rounded-2xl md:rounded-3xl",
-          // Keep the popover usable on small viewports
-          "max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto"
-        ),
-        placement: "bottom-end",
+        placement: "bottom-start",
+        borderMode: resolvedBorderMode,
+        contentClassName: "p-0 overflow-hidden w-auto flex flex-col md:flex-row max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto",
         children: [
           /* @__PURE__ */ jsxs30("div", { className: "flex flex-col lg:flex-row divide-y lg:divide-y-0 lg:divide-x divide-border", children: [
             /* @__PURE__ */ jsx43("div", { className: sizeStyles8[size].padding, children: /* @__PURE__ */ jsx43(
@@ -19143,6 +19235,8 @@ var MultiCombobox = ({
   maxInitialOptions,
   showSearchPromptWhenEmptyQuery = false
 }) => {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.borderMode ?? "full";
   const tv = useSmartTranslations("ValidationInput");
   const gi18n = useGlobalI18n();
   const placeholder = placeholderProp ?? gi18n.selectPlaceholder ?? "Select...";
@@ -19403,7 +19497,7 @@ var MultiCombobox = ({
       item.value
     );
   };
-  const dropdownBody = /* @__PURE__ */ jsxs37("div", { "data-combobox-dropdown": true, "data-state": open ? "open" : "closed", className: "w-full rounded-2xl md:rounded-3xl overflow-hidden", children: [
+  const dropdownBody = /* @__PURE__ */ jsxs37("div", { "data-combobox-dropdown": true, "data-state": open ? "open" : "closed", className: cn("w-full overflow-hidden", getBorderRadiusClass(resolvedBorderMode)), children: [
     value.length > 0 && /* @__PURE__ */ jsxs37("div", { className: "px-3 py-2 border-b border-border/40 flex items-center justify-between bg-muted/30", children: [
       /* @__PURE__ */ jsx50("span", { className: "text-xs font-medium text-muted-foreground", children: maxSelected ? gi18n.selectedCountWithMax ? gi18n.selectedCountWithMax(value.length, maxSelected) : `${value.length} / ${maxSelected} max` : gi18n.itemSelectedCount ? gi18n.itemSelectedCount(value.length) : `${value.length} selected` }),
       showClear && /* @__PURE__ */ jsxs37(
@@ -19521,8 +19615,6 @@ var MultiCombobox = ({
   const selectedOptions = value.map((v) => normalizedOptions.find((o) => o.value === v) ?? selectedOptionFallbackMap.get(v)).filter(Boolean);
   const visibleTags = maxTagsVisible ? selectedOptions.slice(0, maxTagsVisible) : selectedOptions;
   const hiddenCount = maxTagsVisible ? Math.max(0, selectedOptions.length - maxTagsVisible) : 0;
-  const globalConfig = useUnderverseUIConfig();
-  const resolvedBorderMode = borderMode ?? globalConfig.borderMode ?? "full";
   const triggerButton = /* @__PURE__ */ jsxs37(
     "button",
     {
@@ -19685,7 +19777,8 @@ var MultiCombobox = ({
         placement: "bottom-start",
         matchTriggerWidth: true,
         className: "z-9999",
-        contentClassName: "p-0 overflow-hidden rounded-2xl md:rounded-3xl",
+        borderMode: resolvedBorderMode,
+        contentClassName: "p-0 overflow-hidden",
         children: dropdownBody
       }
     ),
@@ -19740,6 +19833,8 @@ var RadioGroup = React47.forwardRef(
     error = false,
     errorMessage
   }, ref) => {
+    const globalConfig = useUnderverseUIConfig();
+    const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
     const [internalValue, setInternalValue] = React47.useState(defaultValue || "");
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : internalValue;
@@ -19763,7 +19858,7 @@ var RadioGroup = React47.forwardRef(
           disabled,
           size,
           variant,
-          borderMode
+          borderMode: resolvedBorderMode
         },
         children: /* @__PURE__ */ jsxs38("div", { className: "space-y-2", children: [
           /* @__PURE__ */ jsx51(
@@ -21017,6 +21112,8 @@ function CategoryTreeSelect(props) {
     singleSelect = false,
     borderMode
   } = props;
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
   const [isOpen, setIsOpen] = useState33(false);
   const [expandedNodes, setExpandedNodes] = useState33(
     () => getInitialExpandedNodes(categories, { defaultExpanded, defaultExpandedIds, expandToId, viewOnly, inline })
@@ -21674,10 +21771,11 @@ function CategoryTreeSelect(props) {
         matchTriggerWidth: true,
         className: "z-9999",
         contentClassName: cn(
-          "p-0 overflow-hidden rounded-2xl md:rounded-3xl",
+          "p-0 overflow-hidden",
           "border-border/40 bg-popover/95 text-popover-foreground",
           "shadow-2xl backdrop-blur-xl"
         ),
+        borderMode: resolvedBorderMode,
         trigger: /* @__PURE__ */ jsxs41(
           "div",
           {
@@ -21704,7 +21802,7 @@ function CategoryTreeSelect(props) {
             },
             className: cn(
               "group flex w-full items-center justify-between transition-all duration-200",
-              getBorderRadiusClass(borderMode ?? "full"),
+              getBorderRadiusClass(resolvedBorderMode ?? "full"),
               "backdrop-blur-sm",
               triggerSizeStyles[size].button,
               triggerVariantStyles[variant],
@@ -24311,6 +24409,8 @@ function ColorPicker({
   borderMode,
   ...rest
 }) {
+  const globalConfig = useUnderverseUIConfig();
+  const resolvedBorderMode = borderMode ?? globalConfig.input?.borderMode ?? globalConfig.borderMode ?? "full";
   const gi18n = useGlobalI18n();
   const isControlled = value !== void 0;
   const initial = parseAnyColor(isControlled ? value : defaultValue) || { r: 79, g: 70, b: 229, a: 1 };
@@ -24408,7 +24508,7 @@ function ColorPicker({
       disabled,
       className: cn(
         "w-full px-3 border border-input bg-background flex items-center justify-between",
-        getBorderRadiusClass(borderMode ?? "full"),
+        getBorderRadiusClass(resolvedBorderMode),
         sizeClasses2[size],
         "hover:border-accent-foreground/30 transition-colors",
         disabled && "opacity-50 cursor-not-allowed",
@@ -24444,8 +24544,9 @@ function ColorPicker({
       onOpenChange: setOpen,
       placement: "bottom-start",
       matchTriggerWidth: variant === "minimal",
+      borderMode: resolvedBorderMode,
       contentWidth: contentWidthByVariant[variant],
-      contentClassName: cn("p-3 rounded-2xl md:rounded-3xl border border-border/50 bg-card shadow-lg", contentClassName),
+      contentClassName: cn("p-3 border border-border/50 bg-card shadow-lg", contentClassName),
       children: /* @__PURE__ */ jsxs49("div", { className: "space-y-3", children: [
         variant !== "minimal" && /* @__PURE__ */ jsxs49("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx62(
@@ -31767,7 +31868,7 @@ var CustomTableCell = TableCell2.extend({
       },
       textDirection: {
         default: null,
-        parseHTML: (element) => element.getAttribute("data-text-direction") === "vertical" || element.style.writingMode === "vertical-rl" ? "vertical" : null,
+        parseHTML: (element) => element.getAttribute("data-text-direction") === "vertical" || ["sideways-lr", "vertical-lr", "vertical-rl"].includes(element.style.writingMode) ? "vertical" : null,
         renderHTML: (attributes) => attributes.textDirection === "vertical" ? { "data-text-direction": "vertical" } : {}
       }
     };
@@ -31786,7 +31887,7 @@ var CustomTableCell = TableCell2.extend({
     if (borderStyle) mergedStyle += `; border-style: ${borderStyle}`;
     if (borderWidth) mergedStyle += `; border-width: ${borderWidth}`;
     if (verticalAlign) mergedStyle += `; vertical-align: ${verticalAlign}`;
-    if (textDirection === "vertical") mergedStyle += "; writing-mode: vertical-rl; text-orientation: mixed";
+    if (textDirection === "vertical") mergedStyle += "; writing-mode: sideways-lr; text-orientation: mixed";
     mergedStyle = mergedStyle.replace(/^;/, "").trim();
     return [
       "td",
@@ -31893,7 +31994,7 @@ var CustomTableHeader = TableHeader2.extend({
       },
       textDirection: {
         default: null,
-        parseHTML: (element) => element.getAttribute("data-text-direction") === "vertical" || element.style.writingMode === "vertical-rl" ? "vertical" : null,
+        parseHTML: (element) => element.getAttribute("data-text-direction") === "vertical" || ["sideways-lr", "vertical-lr", "vertical-rl"].includes(element.style.writingMode) ? "vertical" : null,
         renderHTML: (attributes) => attributes.textDirection === "vertical" ? { "data-text-direction": "vertical" } : {}
       }
     };
@@ -31912,7 +32013,7 @@ var CustomTableHeader = TableHeader2.extend({
     if (borderStyle) mergedStyle += `; border-style: ${borderStyle}`;
     if (borderWidth) mergedStyle += `; border-width: ${borderWidth}`;
     if (verticalAlign) mergedStyle += `; vertical-align: ${verticalAlign}`;
-    if (textDirection === "vertical") mergedStyle += "; writing-mode: vertical-rl; text-orientation: mixed";
+    if (textDirection === "vertical") mergedStyle += "; writing-mode: sideways-lr; text-orientation: mixed";
     mergedStyle = mergedStyle.replace(/^;/, "").trim();
     return [
       "th",
@@ -34165,6 +34266,7 @@ import {
   Underline as UnderlineIcon2,
   Strikethrough as StrikethroughIcon2,
   Edit2,
+  Eraser,
   Unlink,
   ExternalLink as ExternalLink3,
   Sigma as Sigma2,
@@ -34175,9 +34277,137 @@ import {
   ArrowRight as ArrowRight2
 } from "lucide-react";
 
+// src/components/UEditor/table-border-commands.ts
+import { selectedRect as selectedRect2 } from "@tiptap/pm/tables";
+var SIDES = ["top", "right", "bottom", "left"];
+var OPPOSITE_SIDE = {
+  top: "bottom",
+  right: "left",
+  bottom: "top",
+  left: "right"
+};
+function splitCssValues(value) {
+  const values = [];
+  let token = "";
+  let parentheses = 0;
+  for (const character of value.trim()) {
+    if (/\s/.test(character) && parentheses === 0) {
+      if (token) values.push(token);
+      token = "";
+      continue;
+    }
+    if (character === "(") parentheses += 1;
+    if (character === ")") parentheses = Math.max(0, parentheses - 1);
+    token += character;
+  }
+  if (token) values.push(token);
+  return values;
+}
+function expandCssQuad(value, fallback) {
+  const values = typeof value === "string" ? splitCssValues(value) : [];
+  const [top = fallback, right = top, bottom = top, left = right] = values;
+  return { top, right, bottom, left };
+}
+function serializeCssQuad({ top, right, bottom, left }) {
+  if (top === right && top === bottom && top === left) return top;
+  if (top === bottom && right === left) return `${top} ${right}`;
+  if (right === left) return `${top} ${right} ${bottom}`;
+  return `${top} ${right} ${bottom} ${left}`;
+}
+function getAppliedSides(position, cell, selection) {
+  const outer = {
+    top: cell.top === selection.top,
+    right: cell.right === selection.right,
+    bottom: cell.bottom === selection.bottom,
+    left: cell.left === selection.left
+  };
+  const inner = {
+    top: cell.top > selection.top,
+    right: cell.right < selection.right,
+    bottom: cell.bottom < selection.bottom,
+    left: cell.left > selection.left
+  };
+  switch (position) {
+    case "all":
+      return { top: true, right: true, bottom: true, left: true };
+    case "outer":
+      return outer;
+    case "inner":
+      return inner;
+    case "horizontal":
+      return { top: inner.top, right: false, bottom: inner.bottom, left: false };
+    case "vertical":
+      return { top: false, right: inner.right, bottom: false, left: inner.left };
+    default:
+      return {
+        top: position === "top" && outer.top,
+        right: position === "right" && outer.right,
+        bottom: position === "bottom" && outer.bottom,
+        left: position === "left" && outer.left
+      };
+  }
+}
+function applyTableCellBorders(editor, position, format, options = {}) {
+  const { state, view } = editor;
+  const selection = selectedRect2(state);
+  const transaction = state.tr;
+  const cellPositions = new Set(selection.map.cellsInRect(selection));
+  const sidesByCell = /* @__PURE__ */ new Map();
+  const addSide = (cellPos, side) => {
+    const sides = sidesByCell.get(cellPos) ?? /* @__PURE__ */ new Set();
+    sides.add(side);
+    sidesByCell.set(cellPos, sides);
+  };
+  const addAdjacentSides = (cell, side) => {
+    const adjacentPositions = /* @__PURE__ */ new Set();
+    if (side === "top" && cell.top > 0) {
+      for (let col = cell.left; col < cell.right; col += 1) adjacentPositions.add(selection.map.map[(cell.top - 1) * selection.map.width + col]);
+    } else if (side === "bottom" && cell.bottom < selection.map.height) {
+      for (let col = cell.left; col < cell.right; col += 1) adjacentPositions.add(selection.map.map[cell.bottom * selection.map.width + col]);
+    } else if (side === "left" && cell.left > 0) {
+      for (let row = cell.top; row < cell.bottom; row += 1) adjacentPositions.add(selection.map.map[row * selection.map.width + cell.left - 1]);
+    } else if (side === "right" && cell.right < selection.map.width) {
+      for (let row = cell.top; row < cell.bottom; row += 1) adjacentPositions.add(selection.map.map[row * selection.map.width + cell.right]);
+    }
+    for (const adjacentPos of adjacentPositions) addSide(adjacentPos, OPPOSITE_SIDE[side]);
+  };
+  for (const relativePos of cellPositions) {
+    const cell = selection.map.findCell(relativePos);
+    const appliedSides = getAppliedSides(position, cell, selection);
+    for (const side of SIDES) {
+      if (!appliedSides[side]) continue;
+      addSide(relativePos, side);
+      addAdjacentSides(cell, side);
+    }
+  }
+  for (const [relativePos, appliedSides] of sidesByCell) {
+    const absolutePos = selection.tableStart + relativePos;
+    const node = state.doc.nodeAt(absolutePos);
+    if (!node) continue;
+    const styles = expandCssQuad(node.attrs.borderStyle, "solid");
+    const widths = expandCssQuad(node.attrs.borderWidth, "1px");
+    const colors = expandCssQuad(node.attrs.borderColor, "#000000");
+    for (const side of SIDES) {
+      if (!appliedSides.has(side)) continue;
+      styles[side] = format.style;
+      widths[side] = format.width;
+      colors[side] = format.color || "currentColor";
+    }
+    transaction.setNodeMarkup(absolutePos, void 0, {
+      ...node.attrs,
+      borderStyle: serializeCssQuad(styles),
+      borderWidth: serializeCssQuad(widths),
+      borderColor: serializeCssQuad(colors)
+    });
+  }
+  if (transaction.docChanged) view.dispatch(transaction);
+  if (options.focus ?? true) view.focus();
+  return transaction.docChanged;
+}
+
 // src/components/UEditor/table-formula-commands.ts
 import { TextSelection as TextSelection4 } from "@tiptap/pm/state";
-import { selectedRect as selectedRect2, setCellAttr as setCellAttr2, TableMap as TableMap3 } from "@tiptap/pm/tables";
+import { selectedRect as selectedRect3, setCellAttr as setCellAttr2, TableMap as TableMap3 } from "@tiptap/pm/tables";
 
 // src/components/UEditor/table-formula.ts
 var CELL_ADDRESS_RE = /^([A-Z]+)([1-9]\d*)$/i;
@@ -35066,7 +35296,7 @@ function recalculateTableNode(tableNode, options) {
   return tableNode.type.create(tableNode.attrs, rows);
 }
 function recalculateSelectedTable(editor) {
-  const rect = selectedRect2(editor.state);
+  const rect = selectedRect3(editor.state);
   const tableNode = rect.table;
   const nextTable = recalculateTableNode(tableNode);
   if (!nextTable) return false;
@@ -35210,6 +35440,32 @@ function BorderStylePreviewIcon({ style }) {
     }
   );
 }
+function BorderPositionPreviewIcon({ position }) {
+  const showTop = position === "all" || position === "outer" || position === "top";
+  const showRight = position === "all" || position === "outer" || position === "right";
+  const showBottom = position === "all" || position === "outer" || position === "bottom";
+  const showLeft = position === "all" || position === "outer" || position === "left";
+  const showHorizontal = position === "all" || position === "inner" || position === "horizontal";
+  const showVertical = position === "all" || position === "inner" || position === "vertical";
+  return /* @__PURE__ */ jsxs76("svg", { "aria-hidden": "true", viewBox: "0 0 20 20", className: "h-5 w-5 fill-none stroke-current", children: [
+    /* @__PURE__ */ jsx93(
+      "path",
+      {
+        d: "M2 2H18V18H2Z M2 10H18 M10 2V18",
+        className: "text-foreground opacity-70",
+        stroke: "currentColor",
+        strokeDasharray: "2 1.5",
+        strokeWidth: "1.25"
+      }
+    ),
+    showTop && /* @__PURE__ */ jsx93("path", { d: "M2 2H18", strokeWidth: "2" }),
+    showRight && /* @__PURE__ */ jsx93("path", { d: "M18 2V18", strokeWidth: "2" }),
+    showBottom && /* @__PURE__ */ jsx93("path", { d: "M2 18H18", strokeWidth: "2" }),
+    showLeft && /* @__PURE__ */ jsx93("path", { d: "M2 2V18", strokeWidth: "2" }),
+    showHorizontal && /* @__PURE__ */ jsx93("path", { d: "M2 10H18", strokeWidth: "2" }),
+    showVertical && /* @__PURE__ */ jsx93("path", { d: "M10 2V18", strokeWidth: "2" })
+  ] });
+}
 var BubbleMenuContent = ({
   editor,
   onKeepOpenChange,
@@ -35217,7 +35473,8 @@ var BubbleMenuContent = ({
   onRequestClose,
   fontSizes,
   lineHeights,
-  initialShowLinkInput = false
+  initialShowLinkInput = false,
+  cellBorderOpenRequest = 0
 }) => {
   const t = useSmartTranslations("UEditor");
   useEditorState2({
@@ -35230,6 +35487,11 @@ var BubbleMenuContent = ({
   useEffect37(() => {
     setShowLinkInput(initialShowLinkInput);
   }, [initialShowLinkInput]);
+  useEffect37(() => {
+    if (!cellBorderOpenRequest) return;
+    setActiveColorPalette("cell-border");
+    onKeepOpenChange?.(true);
+  }, [cellBorderOpenRequest, onKeepOpenChange]);
   const [showTypographyPanel, setShowTypographyPanel] = useState50(false);
   const [showFormulaPanel, setShowFormulaPanel] = useState50(false);
   const [formulaDraft, setFormulaDraft] = useState50("");
@@ -35247,6 +35509,14 @@ var BubbleMenuContent = ({
   const currentCellNumberFormat = normalizeStyleValue(editor.getAttributes("tableCell").numberFormat || editor.getAttributes("tableHeader").numberFormat) || "text";
   const currentCellBorderStyle = editor.getAttributes("tableCell").borderStyle || editor.getAttributes("tableHeader").borderStyle || "solid";
   const currentCellBorderWidth = editor.getAttributes("tableCell").borderWidth || editor.getAttributes("tableHeader").borderWidth || "1px";
+  const currentCellBorderColor = normalizeStyleValue(editor.getAttributes("tableCell").borderColor || editor.getAttributes("tableHeader").borderColor) || "#000000";
+  const [borderStyleDraft, setBorderStyleDraft] = useState50(
+    ["solid", "dashed", "dotted", "double"].includes(currentCellBorderStyle) ? currentCellBorderStyle : "solid"
+  );
+  const [borderWidthDraft, setBorderWidthDraft] = useState50(currentCellBorderWidth);
+  const [borderColorDraft, setBorderColorDraft] = useState50(currentCellBorderColor);
+  const [borderEditMode, setBorderEditMode] = useState50("draw");
+  const [activeBorderPosition, setActiveBorderPosition] = useState50("all");
   const currentCellVerticalAlign = normalizeStyleValue(editor.getAttributes("tableCell").verticalAlign || editor.getAttributes("tableHeader").verticalAlign) || "";
   const currentCellTextDirection = normalizeStyleValue(editor.getAttributes("tableCell").textDirection || editor.getAttributes("tableHeader").textDirection) || "horizontal";
   const isInTable2 = isSelectionInTable(editor.state);
@@ -35303,21 +35573,60 @@ var BubbleMenuContent = ({
     onLinkInputOpenChange?.(false);
     onRequestClose?.();
   }, [onKeepOpenChange, onLinkInputOpenChange, onRequestClose]);
-  const applyTableCellAttributeAndClose = useCallback23((name, value) => {
-    applyTableCellAttribute2(editor, name, value, { focus: false });
-    closeTransientPanels();
-  }, [closeTransientPanels, editor]);
-  const clearTableCellBorderAndClose = useCallback23(() => {
-    applyTableCellAttribute2(editor, "borderColor", null, { focus: false });
-    applyTableCellAttribute2(editor, "borderStyle", null, { focus: false });
-    applyTableCellAttribute2(editor, "borderWidth", null, { focus: false });
-    closeTransientPanels();
-  }, [closeTransientPanels, editor]);
-  const applyTableCellBorderColorAndClose = useCallback23((color) => {
-    const value = color || null;
-    applyTableCellAttribute2(editor, "borderColor", value, { focus: false });
-    closeTransientPanels();
-  }, [closeTransientPanels, editor]);
+  const selectTableCellBorderColor = useCallback23((color) => {
+    const value = color || "currentColor";
+    setBorderColorDraft(value);
+    setBorderEditMode("draw");
+    setActiveBorderPosition("all");
+    applyTableCellBorders(editor, "all", {
+      color: value,
+      style: borderStyleDraft,
+      width: borderWidthDraft
+    }, { focus: false });
+    setActiveColorPalette("cell-border");
+    onKeepOpenChange?.(true);
+  }, [borderStyleDraft, borderWidthDraft, editor, onKeepOpenChange]);
+  const applyTableCellBorderPosition = useCallback23((position) => {
+    setActiveBorderPosition(position);
+    applyTableCellBorders(editor, position, {
+      color: borderColorDraft,
+      style: borderEditMode === "erase" ? "none" : borderStyleDraft,
+      width: borderWidthDraft
+    }, { focus: false });
+    onKeepOpenChange?.(true);
+  }, [borderColorDraft, borderEditMode, borderStyleDraft, borderWidthDraft, editor, onKeepOpenChange]);
+  const applyTableCellBorderStyle = useCallback23((style) => {
+    setBorderStyleDraft(style);
+    setBorderEditMode("draw");
+    setActiveBorderPosition("all");
+    applyTableCellBorders(editor, "all", {
+      color: borderColorDraft,
+      style,
+      width: borderWidthDraft
+    }, { focus: false });
+    onKeepOpenChange?.(true);
+  }, [borderColorDraft, borderWidthDraft, editor, onKeepOpenChange]);
+  const applyTableCellBorderWidth = useCallback23((width) => {
+    setBorderWidthDraft(width);
+    setBorderEditMode("draw");
+    setActiveBorderPosition("all");
+    applyTableCellBorders(editor, "all", {
+      color: borderColorDraft,
+      style: borderStyleDraft,
+      width
+    }, { focus: false });
+    onKeepOpenChange?.(true);
+  }, [borderColorDraft, borderStyleDraft, editor, onKeepOpenChange]);
+  const clearTableCellBorders = useCallback23(() => {
+    setActiveBorderPosition("all");
+    setBorderEditMode("erase");
+    applyTableCellBorders(editor, "all", {
+      color: borderColorDraft,
+      style: "none",
+      width: borderWidthDraft
+    }, { focus: false });
+    onKeepOpenChange?.(true);
+  }, [borderColorDraft, borderWidthDraft, editor, onKeepOpenChange]);
   const closeColorPalette = useCallback23(() => {
     setActiveColorPalette(null);
     onKeepOpenChange?.(false);
@@ -35371,27 +35680,104 @@ var BubbleMenuContent = ({
     const isTextPalette = activeColorPalette === "text";
     const isHighlightPalette = activeColorPalette === "highlight";
     if (activeColorPalette === "cell-border") {
-      const currentBorderColor = editor.getAttributes("tableCell").borderColor || editor.getAttributes("tableHeader").borderColor || "currentColor";
-      return /* @__PURE__ */ jsxs76("div", { className: "flex flex-col gap-2 p-2 w-56 text-sm", "data-ueditor-keep-open": true, children: [
+      return /* @__PURE__ */ jsxs76("div", { className: "flex w-72 flex-col gap-2 p-2 text-sm", "data-ueditor-keep-open": true, children: [
         /* @__PURE__ */ jsx93("div", { className: "font-semibold text-xs text-muted-foreground uppercase tracking-wider mb-1", children: t("tableMenu.cellBorder") || "Cell Borders" }),
+        /* @__PURE__ */ jsxs76("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsxs76("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx93("label", { className: "mb-1 block text-xs text-muted-foreground", children: t("tableMenu.borderPosition") || "Border placement" }),
+            /* @__PURE__ */ jsxs76("div", { className: "grid grid-cols-5 gap-1", role: "group", "aria-label": t("tableMenu.borderPosition") || "Border placement", children: [
+              [
+                ["all", "borderAll"],
+                ["outer", "borderOuter"],
+                ["inner", "borderInner"],
+                ["horizontal", "borderHorizontal"],
+                ["vertical", "borderVertical"],
+                ["top", "borderTop"],
+                ["right", "borderRight"],
+                ["bottom", "borderBottom"],
+                ["left", "borderLeft"]
+              ].map(([position, labelKey]) => {
+                const label = t(`tableMenu.${labelKey}`) || position;
+                return /* @__PURE__ */ jsx93(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": label,
+                    title: label,
+                    onMouseDown: (event) => event.preventDefault(),
+                    onClick: () => applyTableCellBorderPosition(position),
+                    className: cn(
+                      "inline-flex h-8 items-center justify-center rounded-md text-foreground transition-colors hover:bg-muted hover:text-primary",
+                      activeBorderPosition === position ? "bg-primary/10 text-primary" : "bg-muted/40"
+                    ),
+                    children: /* @__PURE__ */ jsx93(BorderPositionPreviewIcon, { position })
+                  },
+                  position
+                );
+              }),
+              /* @__PURE__ */ jsx93(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": t("tableMenu.clearBorder") || "Clear borders",
+                  title: t("tableMenu.clearBorder") || "Clear borders",
+                  onMouseDown: (event) => event.preventDefault(),
+                  onClick: clearTableCellBorders,
+                  className: "inline-flex h-8 items-center justify-center rounded-md bg-muted/40 text-destructive transition-colors hover:bg-destructive/10",
+                  children: /* @__PURE__ */ jsx93(BorderStylePreviewIcon, { style: "none" })
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs76("div", { className: "flex flex-col gap-1 border-l border-border pl-2 pt-5", role: "group", "aria-label": t("tableMenu.borderMode") || "Border mode", children: [
+            /* @__PURE__ */ jsx93(
+              "button",
+              {
+                type: "button",
+                "aria-label": t("tableMenu.borderDraw") || "Draw borders",
+                title: t("tableMenu.borderDraw") || "Draw borders",
+                onMouseDown: (event) => event.preventDefault(),
+                onClick: () => setBorderEditMode("draw"),
+                className: cn(
+                  "inline-flex h-8 w-8 items-center justify-center rounded-md transition-colors hover:bg-muted",
+                  borderEditMode === "draw" ? "bg-primary/10 text-primary" : "text-muted-foreground"
+                ),
+                children: /* @__PURE__ */ jsx93(Edit2, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx93(
+              "button",
+              {
+                type: "button",
+                "aria-label": t("tableMenu.borderErase") || "Hide borders",
+                title: t("tableMenu.borderErase") || "Hide borders",
+                onMouseDown: (event) => event.preventDefault(),
+                onClick: () => setBorderEditMode("erase"),
+                className: cn(
+                  "inline-flex h-8 w-8 items-center justify-center rounded-md transition-colors hover:bg-muted",
+                  borderEditMode === "erase" ? "bg-destructive/10 text-destructive" : "text-muted-foreground"
+                ),
+                children: /* @__PURE__ */ jsx93(Eraser, { className: "h-4 w-4" })
+              }
+            )
+          ] })
+        ] }),
         /* @__PURE__ */ jsxs76("div", { className: "flex flex-col gap-1", children: [
           /* @__PURE__ */ jsx93("label", { className: "text-xs text-muted-foreground", children: t("tableMenu.borderStyle") || "Border Style" }),
-          /* @__PURE__ */ jsx93("div", { className: "grid grid-cols-3 gap-1", role: "group", "aria-label": t("tableMenu.borderStyle") || "Border Style", children: [
+          /* @__PURE__ */ jsx93("div", { className: "grid grid-cols-4 gap-1.5", role: "group", "aria-label": t("tableMenu.borderStyle") || "Border Style", children: [
             ["solid", "Solid"],
             ["dashed", "Dashed"],
             ["dotted", "Dotted"],
-            ["double", "Double"],
-            ["none", "None"]
+            ["double", "Double"]
           ].map(([style, label]) => /* @__PURE__ */ jsxs76(
             "button",
             {
               type: "button",
-              "data-ueditor-close-on-select": true,
               onMouseDown: (event) => event.preventDefault(),
-              onClick: () => applyTableCellAttributeAndClose("borderStyle", style),
+              onClick: () => applyTableCellBorderStyle(style),
               className: cn(
-                "inline-flex h-8 items-center justify-center gap-1.5 rounded-md px-2 text-xs font-medium transition-colors hover:bg-muted",
-                currentCellBorderStyle === style ? "bg-primary/10 text-primary" : "bg-muted/40 text-foreground"
+                "inline-flex h-8 min-w-0 items-center justify-center gap-1.5 rounded-md px-2.5 text-xs font-medium transition-colors hover:bg-muted",
+                borderStyleDraft === style ? "bg-primary/10 text-primary" : "bg-muted/40 text-foreground"
               ),
               children: [
                 /* @__PURE__ */ jsx93(BorderStylePreviewIcon, { style }),
@@ -35407,12 +35793,11 @@ var BubbleMenuContent = ({
             "button",
             {
               type: "button",
-              "data-ueditor-close-on-select": true,
               onMouseDown: (event) => event.preventDefault(),
-              onClick: () => applyTableCellAttributeAndClose("borderWidth", width),
+              onClick: () => applyTableCellBorderWidth(width),
               className: cn(
                 "h-8 rounded-md px-2 text-xs font-medium transition-colors hover:bg-muted",
-                currentCellBorderWidth === width ? "bg-primary/10 text-primary" : "bg-muted/40 text-foreground"
+                borderWidthDraft === width ? "bg-primary/10 text-primary" : "bg-muted/40 text-foreground"
               ),
               children: width
             },
@@ -35432,33 +35817,22 @@ var BubbleMenuContent = ({
                 {
                   className: "w-4 h-4 rounded-full border border-border",
                   style: {
-                    backgroundColor: currentBorderColor
+                    backgroundColor: borderColorDraft
                   }
                 }
               )
             ]
           }
-        ),
-        /* @__PURE__ */ jsx93("div", { className: "flex items-center justify-between gap-2 mt-2 pt-2 border-t border-border", children: /* @__PURE__ */ jsx93(
-          "button",
-          {
-            type: "button",
-            "data-ueditor-close-on-select": true,
-            onClick: clearTableCellBorderAndClose,
-            className: "text-xs text-destructive hover:underline",
-            children: t("tableMenu.clearBorder") || "Clear Border"
-          }
-        ) })
+        )
       ] });
     }
     if (activeColorPalette === "cell-border-color") {
-      const currentBorderColor = normalizeStyleValue(editor.getAttributes("tableCell").borderColor || editor.getAttributes("tableHeader").borderColor) || "";
       return /* @__PURE__ */ jsx93("div", { className: "w-56", "data-ueditor-keep-open": true, children: /* @__PURE__ */ jsx93(
         EditorColorPalette,
         {
           colors: borderColors,
-          currentColor: currentBorderColor,
-          onSelect: applyTableCellBorderColorAndClose,
+          currentColor: borderColorDraft,
+          onSelect: selectTableCellBorderColor,
           label: t("tableMenu.borderColor") || "Border Color"
         }
       ) });
@@ -35976,6 +36350,7 @@ var CustomBubbleMenu = ({
   const BUBBLE_MENU_ESTIMATED_HEIGHT = 44;
   const [isVisible, setIsVisible] = useState50(false);
   const [linkInputOpen, setLinkInputOpen] = useState50(false);
+  const [cellBorderOpenRequest, setCellBorderOpenRequest] = useState50(0);
   const [position, setPosition2] = useState50({
     top: 0,
     left: 0,
@@ -35992,8 +36367,8 @@ var CustomBubbleMenu = ({
     if (!next) setLinkInputOpen(false);
     if (next) setIsVisible(true);
   }, []);
-  const closeBubbleMenu = useCallback23(() => {
-    suppressShowUntilRef.current = Date.now() + 1e3;
+  const closeBubbleMenu = useCallback23((suppressShow = true) => {
+    suppressShowUntilRef.current = suppressShow ? Date.now() + 1e3 : 0;
     keepOpenRef.current = false;
     setKeepOpenState(false);
     setLinkInputOpen(false);
@@ -36085,6 +36460,41 @@ var CustomBubbleMenu = ({
       editor.off("update", updatePosition);
     };
   }, [editor]);
+  useEffect37(() => {
+    if (!isVisible) return;
+    const handlePointerDown = (event) => {
+      const target = event.target;
+      if (target && (menuRef.current?.contains(target) || target.closest("[data-ueditor-keep-open]"))) return;
+      const table = target?.closest("table");
+      if (table && editor.view.dom.contains(table)) return;
+      closeBubbleMenu(false);
+    };
+    const handleKeyDown2 = (event) => {
+      if (event.key === "Escape") closeBubbleMenu();
+    };
+    document.addEventListener("pointerdown", handlePointerDown, true);
+    document.addEventListener("keydown", handleKeyDown2);
+    return () => {
+      document.removeEventListener("pointerdown", handlePointerDown, true);
+      document.removeEventListener("keydown", handleKeyDown2);
+    };
+  }, [closeBubbleMenu, editor, isVisible]);
+  useEffect37(() => {
+    const handleTableDoubleClick = (event) => {
+      const target = event.target;
+      const cell = target?.closest("td,th");
+      if (!cell || !editor.view.dom.contains(cell)) return;
+      suppressShowUntilRef.current = 0;
+      keepOpenRef.current = true;
+      setKeepOpenState(true);
+      setLinkInputOpen(false);
+      setCellBorderOpenRequest((request) => request + 1);
+      setIsVisible(true);
+      requestAnimationFrame(() => editor.view.focus());
+    };
+    editor.view.dom.addEventListener("dblclick", handleTableDoubleClick);
+    return () => editor.view.dom.removeEventListener("dblclick", handleTableDoubleClick);
+  }, [editor]);
   if (!isVisible) return null;
   return createPortal8(
     /* @__PURE__ */ jsx93(
@@ -36125,7 +36535,8 @@ var CustomBubbleMenu = ({
             onRequestClose: closeBubbleMenu,
             fontSizes,
             lineHeights,
-            initialShowLinkInput: linkInputOpen
+            initialShowLinkInput: linkInputOpen,
+            cellBorderOpenRequest
           }
         )
       }
@@ -40577,7 +40988,7 @@ function moveTableRow$1(table, indexesOrigin, indexesTarget, direction) {
   rows = moveRowInArrayOfRows(rows, indexesOrigin, indexesTarget, direction);
   return convertArrayOfRowsToTableNode(table, rows);
 }
-function selectedRect3(state) {
+function selectedRect4(state) {
   const sel = state.selection;
   const $pos = selectionCell(state);
   const table = $pos.node(-1);
@@ -40595,7 +41006,7 @@ function deprecated_toggleHeader(type) {
     if (!isInTable(state)) return false;
     if (dispatch) {
       const types = tableNodeTypes2(state.schema);
-      const rect = selectedRect3(state), tr = state.tr;
+      const rect = selectedRect4(state), tr = state.tr;
       const cells = rect.map.cellsInRect(type == "column" ? {
         left: rect.left,
         top: 0,
@@ -40635,7 +41046,7 @@ function toggleHeader(type, options) {
     if (!isInTable(state)) return false;
     if (dispatch) {
       const types = tableNodeTypes2(state.schema);
-      const rect = selectedRect3(state), tr = state.tr;
+      const rect = selectedRect4(state), tr = state.tr;
       const isHeaderRowEnabled = isHeaderEnabledByType("row", rect, types);
       const isHeaderColumnEnabled = isHeaderEnabledByType("column", rect, types);
       const selectionStartsAt = (type === "column" ? isHeaderRowEnabled : type === "row" ? isHeaderColumnEnabled : false) ? 1 : 0;