@dimaan/ui 0.0.0 → 0.0.1

package/dist/index.cjs

@@ -752,6 +752,103 @@ var Checkbox = react.forwardRef(function Checkbox2({
     )
   ] });
 });
+
+// src/components/input/inputVariants.ts
+var inputVariantClass = {
+  default: "border border-input bg-background hover:border-ring",
+  filled: "border border-transparent bg-muted hover:bg-muted/80",
+  ghost: "border border-transparent bg-transparent hover:bg-accent"
+};
+var inputSizeClass = {
+  sm: "h-8 rounded-md px-2.5 text-sm gap-1.5",
+  md: "h-9 rounded-md px-3 text-sm gap-2",
+  lg: "h-11 rounded-md px-4 text-base gap-2.5"
+};
+var inputBaseClass = "group/input relative inline-flex w-full items-center text-foreground outline-none transition-[background-color,border-color,box-shadow] focus-within:ring-2 focus-within:ring-ring/40 focus-within:ring-offset-1 focus-within:ring-offset-background aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-within:ring-destructive/40 has-[input:disabled]:pointer-events-none has-[input:disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0";
+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,
+  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
+        ),
+        "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
+  ] });
+});
 function readDocumentDirection() {
   if (typeof document === "undefined") return "ltr";
   const dir = document.documentElement.getAttribute("dir");
@@ -1273,6 +1370,7 @@ exports.HeaderCollapseTrigger = HeaderCollapseTrigger;
 exports.HeaderMobileTrigger = HeaderMobileTrigger;
 exports.HeaderSearch = HeaderSearch;
 exports.HeaderTitle = HeaderTitle;
+exports.Input = Input;
 exports.Sidebar = Sidebar;
 exports.SidebarFooter = SidebarFooter;
 exports.SidebarGroup = SidebarGroup;
@@ -1285,6 +1383,9 @@ exports.buttonBaseClass = buttonBaseClass;
 exports.buttonSizeClass = buttonSizeClass;
 exports.buttonVariantClass = buttonVariantClass;
 exports.cn = cn;
+exports.inputBaseClass = inputBaseClass;
+exports.inputSizeClass = inputSizeClass;
+exports.inputVariantClass = inputVariantClass;
 exports.tableAlignClass = alignClass;
 exports.tableBaseClass = tableBaseClass;
 exports.tableSelectedRowClass = selectedRowClass;