@underverse-ui/underverse 1.0.178 → 1.0.179

package/api-reference.json

@@ -1,6 +1,6 @@
 {
   "package": "@underverse-ui/underverse",
-  "version": "1.0.178",
+  "version": "1.0.179",
   "sourceEntry": "src/index.ts",
   "totalExports": 248,
   "exports": [

package/dist/index.cjs

@@ -247,6 +247,26 @@ function cn(...inputs) {
 
 // src/components/Button.tsx
 var import_lucide_react = require("lucide-react");
+
+// src/utils/radius.ts
+var STANDARD_BORDER_MODES = ["none", "sm", "md", "lg", "xl", "2xl", "3xl", "full"];
+var CUSTOM_BORDER_MAP = {
+  daewoo: "rounded-2xl",
+  infiniq: "rounded-full"
+};
+var BORDER_MODE_DOCS_TYPE = `"${STANDARD_BORDER_MODES.join('" | "')}" | "${Object.keys(CUSTOM_BORDER_MAP).join('" | "')}"`;
+function getBorderRadiusClass(borderMode = "full") {
+  if (!borderMode) return "rounded-full";
+  if (borderMode in CUSTOM_BORDER_MAP) {
+    return CUSTOM_BORDER_MAP[borderMode];
+  }
+  if (STANDARD_BORDER_MODES.includes(borderMode)) {
+    return `rounded-${borderMode}`;
+  }
+  return borderMode;
+}
+
+// src/components/Button.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 var Button = (0, import_react.forwardRef)(
   ({
@@ -273,9 +293,10 @@ var Button = (0, import_react.forwardRef)(
     noWrap = true,
     noHoverOverlay = false,
     gradient = false,
+    borderMode,
     ...rest
   }, ref) => {
-    const baseStyles = asContainer ? "relative inline-flex justify-center rounded-full font-medium transition-colors duration-150 ease-soft outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background active:translate-y-px" : "relative inline-flex items-center justify-center gap-2 rounded-full font-medium overflow-hidden transition-colors duration-150 ease-soft outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background active:translate-y-px";
+    const baseStyles = asContainer ? "relative inline-flex justify-center font-medium transition-colors duration-150 ease-soft outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background active:translate-y-px" : "relative inline-flex items-center justify-center gap-2 font-medium overflow-hidden transition-colors duration-150 ease-soft outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background active:translate-y-px";
     const finalVariant = gradient ? "gradient" : variant;
     const variantStyle = VARIANT_STYLES_BTN[finalVariant] || VARIANT_STYLES_BTN.default;
     const sizeStyle = SIZE_STYLES_BTN[size] || SIZE_STYLES_BTN.md;
@@ -318,6 +339,7 @@ var Button = (0, import_react.forwardRef)(
         title,
         className: cn(
           baseStyles,
+          getBorderRadiusClass(borderMode ?? "full"),
           variantStyle,
           sizeStyle,
           "group",
@@ -2991,6 +3013,7 @@ var Input = (0, import_react4.forwardRef)(
     value,
     maxLength,
     rightAddon,
+    borderMode,
     ...rest
   }, ref) => {
     const [localError, setLocalError] = (0, import_react4.useState)(error);
@@ -3082,6 +3105,7 @@ var Input = (0, import_react4.forwardRef)(
       hint: _hint,
       counter: _counter,
       rightAddon: _rightAddon,
+      borderMode: _borderMode,
       ...restInput
     } = rest;
     const handleFocus = (e) => {
@@ -3092,7 +3116,7 @@ var Input = (0, import_react4.forwardRef)(
       setIsFocused(false);
       onBlurProp?.(e);
     };
-    const radiusClass = size === "sm" ? "rounded-full" : "rounded-full";
+    const radiusClass = getBorderRadiusClass(borderMode ?? "full");
     return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: cn("w-full group", containerSpacing), children: [
       label && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
@@ -3472,6 +3496,7 @@ var Textarea = (0, import_react4.forwardRef)(
     required,
     value,
     maxLength,
+    borderMode,
     ...props
   }, ref) => {
     const [isFocused, setIsFocused] = (0, import_react4.useState)(false);
@@ -3551,7 +3576,8 @@ var Textarea = (0, import_react4.forwardRef)(
           onFocus: () => setIsFocused(true),
           onBlur: () => setIsFocused(false),
           className: cn(
-            "w-full rounded-2xl md:rounded-3xl text-foreground transition-all duration-200",
+            "w-full text-foreground transition-all duration-200",
+            getBorderRadiusClass(borderMode ?? "full"),
             "placeholder:text-muted-foreground focus:outline-none",
             "disabled:cursor-not-allowed disabled:opacity-50",
             sizeStyles8[size],
@@ -5492,7 +5518,8 @@ var TagInput = (0, import_react10.forwardRef)(
     loading: loading2 = false,
     maxTags,
     maxVisibleTags,
-    labels
+    labels,
+    borderMode
   }, ref) => {
     const [inputValue, setInputValue] = (0, import_react10.useState)("");
     const gi18n = useGlobalI18n();
@@ -5511,21 +5538,21 @@ var TagInput = (0, import_react10.forwardRef)(
     const moreLabel = labels?.moreCount?.replace("{count}", String(hiddenCount)) ?? `+${hiddenCount} more`;
     const sizeStyles8 = {
       sm: {
-        container: "min-h-8 p-1.5 gap-1 rounded-full",
+        container: "min-h-8 p-1.5 gap-1",
         input: "text-xs",
         tag: "px-1.5 py-0.5 text-xs gap-1 rounded-full",
         tagIcon: "h-3 w-3",
         button: "h-7 text-xs px-2"
       },
       md: {
-        container: "min-h-10 p-2 gap-1.5 rounded-full",
+        container: "min-h-10 p-2 gap-1.5",
         input: "text-sm",
         tag: "px-2 py-1 text-sm gap-1.5 rounded-full",
         tagIcon: "h-3.5 w-3.5",
         button: "h-9 text-sm px-3"
       },
       lg: {
-        container: "min-h-12 p-2.5 gap-2 rounded-full",
+        container: "min-h-12 p-2.5 gap-2",
         input: "text-base",
         tag: "px-2.5 py-1.5 text-base gap-2 rounded-full",
         tagIcon: "h-4 w-4",
@@ -5621,6 +5648,7 @@ var TagInput = (0, import_react10.forwardRef)(
             "bg-background border border-input",
             "transition-all duration-200",
             "hover:border-accent-foreground/20",
+            getBorderRadiusClass(borderMode ?? "full"),
             isFocused && "ring-1 ring-ring ring-offset-1 ring-offset-background border-transparent shadow-md",
             disabled && "opacity-50 cursor-not-allowed",
             sizeStyles8[size].container
@@ -8779,6 +8807,7 @@ var Combobox = ({
   fontBold = false,
   loading: loading2 = false,
   loadingText: loadingTextProp,
+  borderMode,
   showSelectedIcon = true,
   maxHeight = 280,
   groupBy,
@@ -9149,7 +9178,7 @@ 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 radiusClass = "rounded-full";
+  const radiusClass = getBorderRadiusClass(borderMode ?? "full");
   const verticalGap = size === "sm" ? "space-y-1.5" : "space-y-2";
   const triggerButtonBaseProps = {
     ref: triggerRef,
@@ -10039,7 +10068,8 @@ var DatePicker = ({
   weekdayLabels,
   disablePastDates = false,
   minDate,
-  maxDate
+  maxDate,
+  borderMode
 }) => {
   const t = useSmartTranslations("DatePicker");
   const tv = useSmartTranslations("ValidationInput");
@@ -10577,7 +10607,7 @@ var DatePicker = ({
             "aria-invalid": !!effectiveError,
             className: cn(
               "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
-              "rounded-full",
+              getBorderRadiusClass(borderMode ?? "full"),
               sizeStyles8[size].trigger,
               disabled ? "border-border/40 opacity-50 cursor-not-allowed" : [
                 "border-border/60 hover:border-primary/40",
@@ -10687,7 +10717,8 @@ var DateRangePicker = ({
   minDate,
   maxDate,
   size = "md",
-  disabled = false
+  disabled = false,
+  borderMode
 }) => {
   const locale = useSmartLocale();
   const t = useSmartTranslations("DatePicker");
@@ -11327,7 +11358,8 @@ var DateRangePicker = ({
             "aria-required": required,
             "aria-invalid": !!effectiveError,
             className: cn(
-              "group flex w-full items-center justify-between rounded-full border bg-background/80 backdrop-blur-sm",
+              "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
+              getBorderRadiusClass(borderMode ?? "full"),
               sizeStyles8[size].trigger,
               disabled ? "border-border/40 opacity-50 cursor-not-allowed" : [
                 "border-border/60 hover:border-primary/40",
@@ -11707,7 +11739,8 @@ var LunarDatePicker = ({
   weekdayLabels,
   disablePastDates = false,
   minDate,
-  maxDate
+  maxDate,
+  borderMode
 }) => {
   const t = useSmartTranslations("DatePicker");
   const tv = useSmartTranslations("ValidationInput");
@@ -12256,7 +12289,7 @@ var LunarDatePicker = ({
             "aria-invalid": !!effectiveError,
             className: cn(
               "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
-              "rounded-full",
+              getBorderRadiusClass(borderMode ?? "full"),
               sizeStyles8[size].trigger,
               disabled ? "border-border/40 opacity-50 cursor-not-allowed" : [
                 "border-border/60 hover:border-primary/40",
@@ -12372,7 +12405,8 @@ var LunarDateRangePicker = ({
   minDate,
   maxDate,
   size = "md",
-  disabled = false
+  disabled = false,
+  borderMode
 }) => {
   const locale = useSmartLocale();
   const t = useSmartTranslations("DatePicker");
@@ -12875,7 +12909,8 @@ var LunarDateRangePicker = ({
             "aria-required": required,
             "aria-invalid": !!effectiveError,
             className: cn(
-              "group flex w-full items-center justify-between rounded-full border bg-background/80 backdrop-blur-sm",
+              "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
+              getBorderRadiusClass(borderMode ?? "full"),
               sizeStyles8[size].trigger,
               disabled ? "border-border/40 opacity-50 cursor-not-allowed" : [
                 "border-border/60 hover:border-primary/40",
@@ -13394,6 +13429,7 @@ function MonthYearPicker({
   showThisMonth = true,
   columnLabels = { month: "Month", year: "Year" },
   className,
+  borderMode,
   ...rest
 }) {
   const gi18n = useGlobalI18n();
@@ -13553,7 +13589,8 @@ function MonthYearPicker({
       "aria-required": required,
       "aria-invalid": !!effectiveError,
       className: cn(
-        "group flex w-full items-center justify-between rounded-full border bg-background/80 backdrop-blur-sm",
+        "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
+        getBorderRadiusClass(borderMode ?? "full"),
         sz.height,
         sz.padding,
         sz.text,
@@ -14918,6 +14955,7 @@ function TimePicker({
   onOpen,
   onClose,
   className,
+  borderMode,
   ...rest
 }) {
   const tv = useSmartTranslations("ValidationInput");
@@ -15258,7 +15296,8 @@ function TimePicker({
       "aria-required": required,
       "aria-invalid": !!effectiveError,
       className: cn(
-        "group flex w-full items-center justify-between rounded-full border bg-background/80 backdrop-blur-sm",
+        "group flex w-full items-center justify-between border bg-background/80 backdrop-blur-sm",
+        getBorderRadiusClass(borderMode ?? "full"),
         sz.height,
         sz.padding,
         sz.text,
@@ -15738,7 +15777,8 @@ var DateTimePicker = ({
   required,
   doneLabel,
   clearLabel,
-  size = "md"
+  size = "md",
+  borderMode
 }) => {
   const t = useSmartTranslations("DateTimePicker");
   const tv = useSmartTranslations("ValidationInput");
@@ -15918,7 +15958,8 @@ var DateTimePicker = ({
             "aria-required": required,
             "aria-invalid": !!effectiveError,
             className: cn(
-              "flex w-full items-center justify-between rounded-full border border-input bg-background",
+              "flex w-full items-center justify-between border border-input bg-background",
+              getBorderRadiusClass(borderMode ?? "full"),
               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",
@@ -18963,6 +19004,7 @@ var MultiCombobox = ({
   loading: loading2 = false,
   loadingText: loadingTextProp,
   emptyText: emptyTextProp,
+  borderMode,
   showSelectedIcons = true,
   maxHeight = 280,
   groupBy,
@@ -19376,7 +19418,8 @@ var MultiCombobox = ({
       "aria-required": required,
       "aria-invalid": !!effectiveError,
       className: cn(
-        "group flex w-full items-center gap-2 rounded-full transition-all duration-200",
+        "group flex w-full items-center gap-2 transition-all duration-200",
+        getBorderRadiusClass(borderMode ?? "full"),
         sizeStyles8[size].trigger,
         variantStyles6[variant],
         "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 focus-visible:border-primary",
@@ -19570,6 +19613,7 @@ var RadioGroup = React46.forwardRef(
     orientation = "vertical",
     size = "md",
     variant = "default",
+    borderMode,
     className,
     children,
     required = false,
@@ -19598,7 +19642,8 @@ var RadioGroup = React46.forwardRef(
           name: radioName,
           disabled,
           size,
-          variant
+          variant,
+          borderMode
         },
         children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "space-y-2", children: [
           /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
@@ -19647,7 +19692,7 @@ var sizeStyles7 = {
 };
 var RadioGroupItem = React46.forwardRef(
   ({ value, id, disabled, className, children, label, labelClassName, description, icon }, ref) => {
-    const { value: selectedValue, onValueChange, name, disabled: groupDisabled, size = "md", variant = "default" } = useRadioGroup();
+    const { value: selectedValue, onValueChange, name, disabled: groupDisabled, size = "md", variant = "default", borderMode } = useRadioGroup();
     const isDisabled = disabled || groupDisabled;
     const isSelected = selectedValue === value;
     const Icon = icon;
@@ -19657,7 +19702,8 @@ var RadioGroupItem = React46.forwardRef(
         "div",
         {
           className: cn(
-            "relative rounded-xl border transition-all duration-200 cursor-pointer",
+            "relative border transition-all duration-200 cursor-pointer",
+            getBorderRadiusClass(borderMode ?? "xl"),
             "hover:bg-accent/50 focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
             isSelected && "border-primary bg-primary/5 ring-1 ring-primary/20",
             isDisabled && "cursor-not-allowed opacity-50",
@@ -19732,7 +19778,8 @@ var RadioGroupItem = React46.forwardRef(
           id: radioId,
           disabled: isDisabled,
           className: cn(
-            "inline-flex items-center justify-center gap-2 rounded-lg border font-medium transition-all duration-200",
+            "inline-flex items-center justify-center gap-2 border font-medium transition-all duration-200",
+            getBorderRadiusClass(borderMode ?? "lg"),
             "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
             "disabled:cursor-not-allowed disabled:opacity-50",
             isSelected ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border/50 bg-background hover:bg-accent hover:text-accent-foreground",
@@ -20847,7 +20894,8 @@ function CategoryTreeSelect(props) {
     baseIndent = TREE_NODE_BASE_PADDING_REM,
     indentSize = TREE_NODE_INDENT_REM,
     renderItemActions,
-    singleSelect = false
+    singleSelect = false,
+    borderMode
   } = props;
   const [isOpen, setIsOpen] = (0, import_react26.useState)(false);
   const [expandedNodes, setExpandedNodes] = (0, import_react26.useState)(
@@ -21535,7 +21583,8 @@ function CategoryTreeSelect(props) {
               }
             },
             className: cn(
-              "group flex w-full items-center justify-between rounded-full transition-all duration-200",
+              "group flex w-full items-center justify-between transition-all duration-200",
+              getBorderRadiusClass(borderMode ?? "full"),
               "backdrop-blur-sm",
               triggerSizeStyles[size].button,
               triggerVariantStyles[variant],
@@ -24094,6 +24143,7 @@ function ColorPicker({
   showRecent = false,
   showHarmony = false,
   maxRecent = 8,
+  borderMode,
   ...rest
 }) {
   const gi18n = useGlobalI18n();
@@ -24192,7 +24242,8 @@ function ColorPicker({
       type: "button",
       disabled,
       className: cn(
-        "w-full px-3 rounded-full border border-input bg-background flex items-center justify-between",
+        "w-full px-3 border border-input bg-background flex items-center justify-between",
+        getBorderRadiusClass(borderMode ?? "full"),
         sizeClasses2[size],
         "hover:border-accent-foreground/30 transition-colors",
         disabled && "opacity-50 cursor-not-allowed",