@dimaan/ui 0.0.9 → 0.0.10

package/dist/index.cjs

@@ -7,6 +7,7 @@ var tailwindMerge = require('tailwind-merge');
 var jsxRuntime = require('react/jsx-runtime');
 var lucideReact = require('lucide-react');
 var reactHookForm = require('react-hook-form');
+var RadixRadioGroup = require('@radix-ui/react-radio-group');
 var RadixSelect = require('@radix-ui/react-select');
 var RadixSwitch = require('@radix-ui/react-switch');
 
@@ -28,6 +29,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
+var RadixRadioGroup__namespace = /*#__PURE__*/_interopNamespace(RadixRadioGroup);
 var RadixSelect__namespace = /*#__PURE__*/_interopNamespace(RadixSelect);
 var RadixSwitch__namespace = /*#__PURE__*/_interopNamespace(RadixSwitch);
 
@@ -934,86 +936,67 @@ var inputBaseClass = "group/input relative inline-flex w-full items-center text-
 var Input = react.forwardRef(function Input2({
   variant = "default",
   inputSize = "md",
-  label,
-  helperText,
-  error,
   leadingIcon,
   trailingIcon,
-  fullWidth = true,
   type = "text",
   id,
   className,
   wrapperClassName,
-  containerClassName,
-  "aria-invalid": ariaInvalidProp,
-  "aria-describedby": ariaDescribedByProp,
+  "aria-invalid": ariaInvalid,
+  "aria-describedby": ariaDescribedBy,
   disabled,
   ...props
 }, ref) {
   const generatedId = react.useId();
   const inputId = id ?? generatedId;
-  const helperId = `${inputId}-helper`;
-  const errorId = `${inputId}-error`;
-  const hasError = error !== void 0 && error !== null && error !== false;
-  const ariaInvalid = ariaInvalidProp ?? (hasError ? true : void 0);
-  const describedByIds = [
-    ariaDescribedByProp,
-    hasError ? errorId : null,
-    !hasError && helperText ? helperId : null
-  ].filter(Boolean).join(" ");
-  const ariaDescribedBy = describedByIds.length > 0 ? describedByIds : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-1.5", fullWidth && "w-full", containerClassName), children: [
-    label !== void 0 && label !== null && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: inputId, className: "text-sm font-medium text-foreground select-none", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        "data-slot": "input-wrapper",
-        className: cn(
-          inputBaseClass,
-          inputVariantClass[variant],
-          inputSizeClass[inputSize],
-          wrapperClassName
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "input-wrapper",
+      className: cn(
+        inputBaseClass,
+        inputVariantClass[variant],
+        inputSizeClass[inputSize],
+        wrapperClassName
+      ),
+      "aria-invalid": ariaInvalid,
+      "data-disabled": disabled ? "true" : void 0,
+      children: [
+        leadingIcon ? /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "inline-flex h-4 w-4 items-center justify-center text-muted-foreground",
+            children: leadingIcon
+          }
+        ) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            ref,
+            id: inputId,
+            type,
+            disabled,
+            "aria-invalid": ariaInvalid,
+            "aria-describedby": ariaDescribedBy,
+            className: cn(
+              "h-full w-full min-w-0 flex-1 bg-transparent outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed",
+              className
+            ),
+            ...props
+          }
         ),
-        "aria-invalid": ariaInvalid,
-        "data-disabled": disabled ? "true" : void 0,
-        children: [
-          leadingIcon ? /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
-            {
-              "aria-hidden": "true",
-              className: "inline-flex h-4 w-4 items-center justify-center text-muted-foreground",
-              children: leadingIcon
-            }
-          ) : null,
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "input",
-            {
-              ref,
-              id: inputId,
-              type,
-              disabled,
-              "aria-invalid": ariaInvalid,
-              "aria-describedby": ariaDescribedBy,
-              className: cn(
-                "h-full w-full min-w-0 flex-1 bg-transparent outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed",
-                className
-              ),
-              ...props
-            }
-          ),
-          trailingIcon ? /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
-            {
-              "aria-hidden": "true",
-              className: "inline-flex h-4 w-4 items-center justify-center text-muted-foreground",
-              children: trailingIcon
-            }
-          ) : null
-        ]
-      }
-    ),
-    hasError ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "text-xs text-destructive", children: error }) : helperText ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-xs text-muted-foreground", children: helperText }) : null
-  ] });
+        trailingIcon ? /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "inline-flex h-4 w-4 items-center justify-center text-muted-foreground",
+            children: trailingIcon
+          }
+        ) : null
+      ]
+    }
+  );
 });
 function LanguageSwitcher({
   languages,
@@ -1053,6 +1036,131 @@ function LanguageSwitcher({
   );
 }
 
+// src/components/radio-group/radioGroupVariants.ts
+var radioItemSizeClass = {
+  sm: "size-4",
+  md: "size-5",
+  lg: "size-6"
+};
+var radioIndicatorSizeClass = {
+  sm: "size-1.5",
+  md: "size-2",
+  lg: "size-2.5"
+};
+var radioLabelSizeClass = {
+  sm: "text-xs",
+  md: "text-sm",
+  lg: "text-base"
+};
+var radioItemBaseClass = "aspect-square shrink-0 rounded-full border border-input bg-background text-primary outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-offset-2 focus-visible:ring-offset-background hover:border-ring disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-visible:ring-destructive/40 data-[state=checked]:border-primary";
+var radioIndicatorBaseClass = "flex h-full w-full items-center justify-center";
+var radioIndicatorDotClass = "rounded-full bg-primary";
+var radioOptionRowClass = "flex cursor-pointer items-start gap-2 has-[button:disabled]:cursor-not-allowed";
+var radioGroupBaseClass = "flex gap-3";
+var radioGroupOrientationClass = {
+  vertical: "flex-col",
+  horizontal: "flex-row flex-wrap"
+};
+var RadioGroup = react.forwardRef(function RadioGroup2({
+  radioSize = "md",
+  orientation = "vertical",
+  value,
+  defaultValue,
+  onValueChange,
+  onChange,
+  onBlur,
+  name,
+  disabled,
+  required,
+  id,
+  options,
+  className,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-invalid": ariaInvalid,
+  children
+}, ref) {
+  const generatedId = react.useId();
+  const groupId = id ?? generatedId;
+  const handleValueChange = react.useCallback(
+    (next) => {
+      onValueChange?.(next);
+      if (onChange) {
+        const synthetic = {
+          target: { value: next, name },
+          currentTarget: { value: next, name },
+          type: "change"
+        };
+        onChange(synthetic);
+      }
+    },
+    [onValueChange, onChange, name]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadixRadioGroup__namespace.Root,
+    {
+      ref,
+      id: groupId,
+      value,
+      defaultValue,
+      onValueChange: handleValueChange,
+      onBlur,
+      disabled,
+      required,
+      name,
+      orientation,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-invalid": ariaInvalid,
+      "data-slot": "radio-group",
+      className: cn(radioGroupBaseClass, radioGroupOrientationClass[orientation], className),
+      children: children ?? options?.map((opt) => /* @__PURE__ */ jsxRuntime.jsx(
+        RadioGroupOptionRow,
+        {
+          option: opt,
+          radioSize,
+          groupId
+        },
+        opt.value
+      ))
+    }
+  );
+});
+function RadioGroupOptionRow({ option, radioSize, groupId }) {
+  const itemId = `${groupId}-${option.value}`;
+  return /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: itemId, className: radioOptionRowClass, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      RadixRadioGroup__namespace.Item,
+      {
+        id: itemId,
+        value: option.value,
+        disabled: option.disabled,
+        "data-slot": "radio-item",
+        className: cn(radioItemBaseClass, radioItemSizeClass[radioSize], "mt-0.5"),
+        children: /* @__PURE__ */ jsxRuntime.jsx(RadixRadioGroup__namespace.Indicator, { className: radioIndicatorBaseClass, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(radioIndicatorDotClass, radioIndicatorSizeClass[radioSize]) }) })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1 leading-tight", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("block font-medium text-foreground", radioLabelSizeClass[radioSize]), children: option.label }),
+      option.description ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-0.5 block text-xs text-muted-foreground", children: option.description }) : null
+    ] })
+  ] });
+}
+var RadioGroupItem = react.forwardRef(function RadioGroupItem2({ className, radioSize = "md", ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadixRadioGroup__namespace.Item,
+    {
+      ref,
+      "data-slot": "radio-item",
+      className: cn(radioItemBaseClass, radioItemSizeClass[radioSize], className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(RadixRadioGroup__namespace.Indicator, { className: radioIndicatorBaseClass, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(radioIndicatorDotClass, radioIndicatorSizeClass[radioSize]) }) })
+    }
+  );
+});
+
 // src/components/select/selectVariants.ts
 var selectVariantClass = {
   default: "border border-input bg-background hover:border-ring",
@@ -1763,67 +1871,48 @@ var Textarea = react.forwardRef(function Textarea2({
   variant = "default",
   textareaSize = "md",
   resize = "vertical",
-  label,
-  helperText,
-  error,
-  fullWidth = true,
   rows = 4,
   id,
   className,
   wrapperClassName,
-  containerClassName,
-  "aria-invalid": ariaInvalidProp,
-  "aria-describedby": ariaDescribedByProp,
+  "aria-invalid": ariaInvalid,
+  "aria-describedby": ariaDescribedBy,
   disabled,
   ...props
 }, ref) {
   const generatedId = react.useId();
   const textareaId = id ?? generatedId;
-  const helperId = `${textareaId}-helper`;
-  const errorId = `${textareaId}-error`;
-  const hasError = error !== void 0 && error !== null && error !== false;
-  const ariaInvalid = ariaInvalidProp ?? (hasError ? true : void 0);
-  const describedByIds = [
-    ariaDescribedByProp,
-    hasError ? errorId : null,
-    !hasError && helperText ? helperId : null
-  ].filter(Boolean).join(" ");
-  const ariaDescribedBy = describedByIds.length > 0 ? describedByIds : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-1.5", fullWidth && "w-full", containerClassName), children: [
-    label !== void 0 && label !== null && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: textareaId, className: "text-sm font-medium text-foreground select-none", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        "data-slot": "textarea-wrapper",
-        className: cn(
-          textareaBaseClass,
-          textareaVariantClass[variant],
-          textareaSizeClass[textareaSize],
-          wrapperClassName
-        ),
-        "aria-invalid": ariaInvalid,
-        "data-disabled": disabled ? "true" : void 0,
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          "textarea",
-          {
-            ref,
-            id: textareaId,
-            rows,
-            disabled,
-            "aria-invalid": ariaInvalid,
-            "aria-describedby": ariaDescribedBy,
-            className: cn(
-              "w-full min-w-0 flex-1 bg-transparent outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed",
-              textareaResizeClass[resize],
-              className
-            ),
-            ...props
-          }
-        )
-      }
-    ),
-    hasError ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "text-xs text-destructive", children: error }) : helperText ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-xs text-muted-foreground", children: helperText }) : null
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "textarea-wrapper",
+      className: cn(
+        textareaBaseClass,
+        textareaVariantClass[variant],
+        textareaSizeClass[textareaSize],
+        wrapperClassName
+      ),
+      "aria-invalid": ariaInvalid,
+      "data-disabled": disabled ? "true" : void 0,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          ref,
+          id: textareaId,
+          rows,
+          disabled,
+          "aria-invalid": ariaInvalid,
+          "aria-describedby": ariaDescribedBy,
+          className: cn(
+            "w-full min-w-0 flex-1 bg-transparent outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed",
+            textareaResizeClass[resize],
+            className
+          ),
+          ...props
+        }
+      )
+    }
+  );
 });
 
 exports.AppShell = AppShell;
@@ -1842,6 +1931,8 @@ exports.HeaderSearch = HeaderSearch;
 exports.HeaderTitle = HeaderTitle;
 exports.Input = Input;
 exports.LanguageSwitcher = LanguageSwitcher;
+exports.RadioGroup = RadioGroup;
+exports.RadioGroupItem = RadioGroupItem;
 exports.Select = Select;
 exports.Sidebar = Sidebar;
 exports.SidebarFooter = SidebarFooter;
@@ -1860,6 +1951,15 @@ exports.cn = cn;
 exports.inputBaseClass = inputBaseClass;
 exports.inputSizeClass = inputSizeClass;
 exports.inputVariantClass = inputVariantClass;
+exports.radioGroupBaseClass = radioGroupBaseClass;
+exports.radioGroupOrientationClass = radioGroupOrientationClass;
+exports.radioIndicatorBaseClass = radioIndicatorBaseClass;
+exports.radioIndicatorDotClass = radioIndicatorDotClass;
+exports.radioIndicatorSizeClass = radioIndicatorSizeClass;
+exports.radioItemBaseClass = radioItemBaseClass;
+exports.radioItemSizeClass = radioItemSizeClass;
+exports.radioLabelSizeClass = radioLabelSizeClass;
+exports.radioOptionRowClass = radioOptionRowClass;
 exports.selectBaseClass = selectBaseClass;
 exports.selectSizeClass = selectSizeClass;
 exports.selectVariantClass = selectVariantClass;