@gridui/input 2.0.0 → 3.0.0

package/README.md

@@ -1,6 +1,6 @@
 # @gridui/input
 
-Core family. Public API: `Input`, `InputProps`, `Label`, `LabelProps`, `Textarea`, `TextareaProps`, `controlVariants`.
+Core family. Public API: `Input`, `InputProps`, `Label`, `LabelProps`, `Textarea`, `TextareaProps`, `controlVariants`, `InputGroup`, `InputGroupAddon`, `InputGroupButton`, `PasswordInput`, and `SearchInput`.
 
 Import components from `@gridui/input` and load `@gridui/input/styles.css` after Theme.
 Load styles for any composed dependency used by this family. Applications own routes, labels, state persistence, and branding.
@@ -15,3 +15,44 @@ See [Textarea](docs/textarea.md) for multiline input contracts and
 
 `Label` owns inline label alignment and an optional decorative `icon` slot.
 Icons use the standard 16px token size without an ancestor layout styling labels.
+
+[Component reference](docs/reference/README.md) contains focused API pages for each public component.
+
+## Text entry compositions
+
+`InputGroup` owns one outline around Input or Textarea and optional addons. Place
+`InputGroupAddon` after the control in the DOM; `align` selects `inline-start`,
+`inline-end`, `block-start`, or `block-end`. Logical alignment follows `dir`.
+`controlSize` on the group supplies the default density to its Input/Textarea and
+InputGroupButton children. An explicit child density wins. Each interactive child
+owns its disabled state; a native disabled fieldset also disables all controls.
+Decorative icons should be hidden from assistive technology. Interactive addons
+keep their own keyboard focus indicators. Load Button styles before Input styles
+when rendering InputGroupButton, PasswordInput, or SearchInput.
+
+```tsx
+<InputGroup>
+    <Input aria-label="Website" name="website" />
+    <InputGroupAddon>https://</InputGroupAddon>
+    <InputGroupAddon align="inline-end">
+        <InputGroupButton>Open</InputGroupButton>
+    </InputGroupAddon>
+</InputGroup>
+```
+
+PasswordInput requires localized `showLabel` and `hideLabel`. It starts concealed,
+preserves the native input element, and toggles its type with a non-submit button.
+Native autocomplete and password managers remain available; applications choose
+`current-password` or `new-password`. Read-only passwords can still be revealed.
+
+SearchInput requires a localized `clearLabel`. Its clear action emits
+`onValueChange("")`, focuses the input, and changes native uncontrolled values.
+Controlled callers may reject the request. As with NumberField step buttons, this
+explicit action does not synthesize a native onChange event. Use onValueChange
+when controlled clearing is needed. Native reset restores defaultValue.
+`loading` and `loadingLabel` provide status feedback without disabling typing.
+Fetching, debouncing, caching and form submission remain application-owned.
+
+For both compositions, ref, className, style, name and native attributes target
+the input; `rootClassName` styles the group. Standard and small densities remain
+available. `Field` and `useField` from Form can associate labels and help text.

package/dist/index.d.ts

@@ -6,8 +6,18 @@
  */
 export type { InputProps } from "./input/input";
 export { Input } from "./input/input";
+export type { InputGroupProps } from "./input-group/input-group";
+export { InputGroup } from "./input-group/input-group";
+export type { InputGroupAddonProps } from "./input-group-addon/input-group-addon";
+export { InputGroupAddon } from "./input-group-addon/input-group-addon";
+export type { InputGroupButtonProps } from "./input-group-button/input-group-button";
+export { InputGroupButton } from "./input-group-button/input-group-button";
 export type { LabelProps } from "./label/label";
 export { Label } from "./label/label";
+export type { PasswordInputProps } from "./password-input/password-input";
+export { PasswordInput } from "./password-input/password-input";
+export type { SearchInputProps } from "./search-input/search-input";
+export { SearchInput } from "./search-input/search-input";
 export { controlVariants } from "./shared/style";
 export type { TextareaProps } from "./textarea/textarea";
 export { Textarea } from "./textarea/textarea";

package/dist/index.js

@@ -1,3 +1,10 @@
+// src/shared/input-group-context.ts
+import { createContext, useContext } from "react";
+var inputGroupContext = createContext(null);
+var useInputGroupSize = () => {
+  return useContext(inputGroupContext);
+};
+
 // src/shared/style.ts
 import { cn } from "@gridui/style-utils";
 import { cva } from "class-variance-authority";
@@ -29,9 +36,10 @@ var controlVariants = cva(controlStyles(), {
 import { cn as cn2 } from "@gridui/style-utils";
 import { jsx } from "react/jsx-runtime";
 var Input = (props) => {
+  const groupSize = useInputGroupSize();
   const {
     size,
-    controlSize = "standard",
+    controlSize = groupSize ?? "standard",
     className,
     onChange,
     onValueChange,
@@ -46,32 +54,88 @@ var Input = (props) => {
         onChange?.(event);
         onValueChange?.(event.currentTarget.value);
       },
-      className: cn2(controlVariants({ size: controlSize }), className)
+      className: cn2(controlVariants({ size: controlSize }), groupSize && "gridui-u-input--flex-1 gridui-u-input--w-0 gridui-u-input--border-0 gridui-u-input--bg-transparent", className)
     }
   );
 };
 
-// src/label/style.ts
+// src/input-group/input-group.tsx
 import { cn as cn3 } from "@gridui/style-utils";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var InputGroup = (props) => {
+  const { controlSize = "standard", className, children, ...restProps } = props;
+  return /* @__PURE__ */ jsx2(
+    inputGroupContext.Provider,
+    {
+      value: controlSize,
+      children: /* @__PURE__ */ jsx2(
+        "div",
+        {
+          ...restProps,
+          "data-control-size": controlSize,
+          "data-gridui-outline-target": "",
+          className: cn3("gridui-input-group", className),
+          children
+        }
+      )
+    }
+  );
+};
+
+// src/input-group-addon/input-group-addon.tsx
+import { cn as cn4 } from "@gridui/style-utils";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var InputGroupAddon = (props) => {
+  const { align = "inline-start", className, ...restProps } = props;
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      ...restProps,
+      "data-align": align,
+      className: cn4("gridui-input-group-addon", className)
+    }
+  );
+};
+
+// src/input-group-button/input-group-button.tsx
+import { Button } from "@gridui/button";
+import { cn as cn5 } from "@gridui/style-utils";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var InputGroupButton = (props) => {
+  const size = useInputGroupSize() ?? "standard";
+  const { className, ...restProps } = props;
+  return /* @__PURE__ */ jsx4(
+    Button,
+    {
+      variant: "quiet",
+      size,
+      ...restProps,
+      className: cn5("gridui-input-group-button", className)
+    }
+  );
+};
+
+// src/label/style.ts
+import { cn as cn6 } from "@gridui/style-utils";
 import { cva as cva2 } from "class-variance-authority";
-var labelStyles = cva2(cn3(
+var labelStyles = cva2(cn6(
   "gridui-label",
   "gridui-u-input--inline-flex gridui-u-input--items-center gridui-u-input--gap-gridui-4 gridui-u-input--type-ui"
 ));
 var labelIconStyles = cva2("gridui-u-input--inline-flex gridui-u-input--shrink-0 gridui-u-input--text-foreground gridui-u-input--[&>svg]:size-gridui-16");
 
 // src/label/label.tsx
-import { cn as cn4 } from "@gridui/style-utils";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { cn as cn7 } from "@gridui/style-utils";
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
 var Label = (props) => {
   const { icon, children, className, ...restProps } = props;
   return /* @__PURE__ */ jsxs(
     "label",
     {
       ...restProps,
-      className: cn4(labelStyles(), className),
+      className: cn7(labelStyles(), className),
       children: [
-        icon && /* @__PURE__ */ jsx2(
+        icon && /* @__PURE__ */ jsx5(
           "span",
           {
             "aria-hidden": "true",
@@ -85,132 +149,223 @@ var Label = (props) => {
   );
 };
 
-// src/textarea/use-textarea-autosize.ts
-import { useCallback, useEffect, useLayoutEffect } from "react";
-var useTextareaAutosize = (ref, enabled, maxHeight) => {
-  if (maxHeight !== void 0 && (!Number.isFinite(maxHeight) || maxHeight <= 0)) {
-    throw new Error("Textarea maxHeight must be finite and positive.");
-  }
-  const resize = useCallback(() => {
-    const element = ref.current;
-    if (!enabled || !element || element.clientWidth === 0) {
-      return;
-    }
-    const style = getComputedStyle(element);
-    const borders = parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
-    const padding = parseFloat(style.paddingTop) + parseFloat(style.paddingBottom);
-    element.style.height = "auto";
-    const contentHeight = element.scrollHeight;
-    const height = style.boxSizing === "border-box" ? contentHeight + borders : contentHeight - padding;
-    const boundedHeight = Math.min(height, maxHeight ?? Number.POSITIVE_INFINITY);
-    element.style.height = `${boundedHeight}px`;
-    element.style.overflowY = height > boundedHeight ? "auto" : "hidden";
-  }, [
-    ref,
-    enabled,
-    maxHeight
-  ]);
-  useLayoutEffect(() => {
-    const element = ref.current;
-    if (!enabled || !element) {
-      return;
+// src/password-input/password-input.tsx
+import { Eye, EyeOff } from "lucide-react";
+import { useState } from "react";
+import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
+var PasswordInput = (props) => {
+  const { showLabel, hideLabel, rootClassName, controlSize = "standard", ...restProps } = props;
+  const [
+    visible,
+    setVisible
+  ] = useState(false);
+  return /* @__PURE__ */ jsxs2(
+    InputGroup,
+    {
+      controlSize,
+      dir: restProps.dir,
+      className: rootClassName,
+      children: [
+        /* @__PURE__ */ jsx6(
+          Input,
+          {
+            ...restProps,
+            type: visible ? "text" : "password"
+          }
+        ),
+        /* @__PURE__ */ jsx6(
+          InputGroupAddon,
+          {
+            align: "inline-end",
+            children: /* @__PURE__ */ jsx6(
+              InputGroupButton,
+              {
+                layout: "icon",
+                "aria-label": visible ? hideLabel : showLabel,
+                disabled: restProps.disabled,
+                onClick: () => {
+                  setVisible((current) => {
+                    return !current;
+                  });
+                },
+                children: visible ? /* @__PURE__ */ jsx6(
+                  EyeOff,
+                  {
+                    "aria-hidden": "true"
+                  }
+                ) : /* @__PURE__ */ jsx6(
+                  Eye,
+                  {
+                    "aria-hidden": "true"
+                  }
+                )
+              }
+            )
+          }
+        )
+      ]
     }
-    const originalHeight = element.style.height;
-    const originalOverflow = element.style.overflowY;
-    return () => {
-      element.style.height = originalHeight;
-      element.style.overflowY = originalOverflow;
-    };
-  }, [
+  );
+};
+
+// src/search-input/search-input.tsx
+import { Search, X } from "lucide-react";
+import { useImperativeHandle, useRef } from "react";
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+var SearchInput = (props) => {
+  const {
+    clearLabel,
+    loading = false,
+    loadingLabel,
+    rootClassName,
+    controlSize = "standard",
     ref,
-    enabled
-  ]);
-  useLayoutEffect(() => {
-    resize();
+    onValueChange,
+    ...restProps
+  } = props;
+  const input = useRef(null);
+  useImperativeHandle(ref, () => {
+    return input.current;
   });
-  useEffect(() => {
-    const element = ref.current;
-    if (!enabled || !element) {
-      return;
+  return /* @__PURE__ */ jsxs3(
+    InputGroup,
+    {
+      controlSize,
+      dir: restProps.dir,
+      className: rootClassName,
+      children: [
+        /* @__PURE__ */ jsx7(
+          Input,
+          {
+            ...restProps,
+            ref: input,
+            type: "search",
+            "aria-busy": loading || restProps["aria-busy"],
+            onValueChange: (next) => {
+              onValueChange?.(next);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx7(
+          InputGroupAddon,
+          {
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ jsx7(
+              Search,
+              {
+                size: 16
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxs3(
+          InputGroupAddon,
+          {
+            align: "inline-end",
+            children: [
+              loading && /* @__PURE__ */ jsx7(
+                "span",
+                {
+                  role: "status",
+                  children: loadingLabel
+                }
+              ),
+              /* @__PURE__ */ jsx7(
+                InputGroupButton,
+                {
+                  layout: "icon",
+                  "aria-label": clearLabel,
+                  disabled: restProps.disabled || restProps.readOnly,
+                  onClick: () => {
+                    const element = input.current;
+                    if (!element || element.matches(":disabled") || element.readOnly) {
+                      return;
+                    }
+                    if (element.value !== "") {
+                      if (restProps.value === void 0) {
+                        element.value = "";
+                      }
+                      onValueChange?.("");
+                    }
+                    element.focus();
+                  },
+                  children: /* @__PURE__ */ jsx7(
+                    X,
+                    {
+                      "aria-hidden": "true"
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        )
+      ]
     }
-    let frame = 0;
-    let width = element.clientWidth;
-    const schedule = () => {
-      cancelAnimationFrame(frame);
-      frame = requestAnimationFrame(resize);
-    };
-    const observer = typeof ResizeObserver === "undefined" ? void 0 : new ResizeObserver(() => {
-      if (element.clientWidth !== width) {
-        width = element.clientWidth;
-        schedule();
-      }
-    });
-    observer?.observe(element);
-    const reset = (event) => {
-      if (event.target === element.form) {
-        schedule();
-      }
-    };
-    const document = element.ownerDocument;
-    document.addEventListener("reset", reset, true);
-    return () => {
-      cancelAnimationFrame(frame);
-      observer?.disconnect();
-      document.removeEventListener("reset", reset, true);
-    };
-  }, [
-    ref,
-    enabled,
-    resize
-  ]);
-  return resize;
+  );
 };
 
 // src/textarea/textarea.tsx
 import { useScrollbars } from "@gridui/overlay";
-import { cn as cn5 } from "@gridui/style-utils";
-import { useImperativeHandle, useRef } from "react";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { cn as cn8 } from "@gridui/style-utils";
+import "react";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var Textarea = (props) => {
+  const groupSize = useInputGroupSize();
   const {
-    controlSize = "standard",
+    controlSize = groupSize ?? "standard",
     className,
     onChange,
-    onInput,
     onValueChange,
     ref,
     autoSize = false,
     maxHeight,
+    maxRows,
+    rows = 2,
     style,
     ...restProps
   } = props;
-  const element = useRef(null);
-  useImperativeHandle(ref, () => {
-    return element.current;
-  });
-  const scrollRef = useScrollbars({ ref: element });
-  const resize = useTextareaAutosize(element, autoSize, maxHeight);
-  return /* @__PURE__ */ jsx3(
+  if (maxHeight !== void 0 && (!Number.isFinite(maxHeight) || maxHeight <= 0)) {
+    throw new RangeError("Textarea maxHeight must be finite and positive.");
+  }
+  if (maxRows !== void 0 && (!Number.isSafeInteger(maxRows) || maxRows < rows)) {
+    throw new RangeError("Textarea maxRows must be an integer at least as large as rows.");
+  }
+  if (maxHeight !== void 0 && maxRows !== void 0) {
+    throw new RangeError("Textarea accepts either maxRows or maxHeight, not both.");
+  }
+  const scrollRef = useScrollbars({ ref });
+  const sizing = {
+    "--_gridui-textarea-rows": rows,
+    "--_gridui-textarea-max-rows": maxRows,
+    ...style,
+    ...autoSize && maxHeight !== void 0 ? { maxHeight } : {}
+  };
+  return /* @__PURE__ */ jsx8(
     "textarea",
     {
       ...restProps,
       ref: scrollRef,
-      style,
-      onInput: (event) => {
-        resize();
-        onInput?.(event);
-      },
+      rows,
+      style: sizing,
+      "data-autosize": autoSize || void 0,
+      "data-max-rows": maxRows !== void 0 || void 0,
       onChange: (event) => {
         onChange?.(event);
         onValueChange?.(event.currentTarget.value);
       },
-      className: cn5(controlVariants({ size: controlSize }), "gridui-u-input--overflow-auto", autoSize ? "gridui-u-input--resize-none" : "gridui-u-input--resize-y", className)
+      className: cn8(controlVariants({ size: controlSize }), "gridui-textarea gridui-u-input--overflow-auto", groupSize && "gridui-u-input--border-0 gridui-u-input--bg-transparent", autoSize ? "gridui-u-input--resize-none gridui-u-input--min-h-(--_gridui-textarea-min-height)" : "gridui-u-input--resize-y", className)
     }
   );
 };
 export {
   Input,
+  InputGroup,
+  InputGroupAddon,
+  InputGroupButton,
   Label,
+  PasswordInput,
+  SearchInput,
   Textarea,
   controlVariants
 };

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/shared/style.ts", "../src/input/input.tsx", "../src/label/style.ts", "../src/label/label.tsx", "../src/textarea/use-textarea-autosize.ts", "../src/textarea/textarea.tsx"],
-  "sourcesContent": ["/**\n * @author WMXPY\n * @package Input\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const controlStyles = cva(cn(\n    \"gridui-control\",\n    \"gridui-u-input--min-w-0 gridui-u-input--w-full gridui-u-input--box-border gridui-u-input--border gridui-u-input--border-solid gridui-u-input--border-border gridui-u-input--rounded-control gridui-u-input--text-foreground gridui-u-input--bg-background gridui-u-input--type-input\",\n    \"gridui-u-input--disabled:opacity-50 gridui-u-input--disabled:cursor-not-allowed\",\n    \"gridui-u-input--aria-invalid:border-danger-foreground\",\n));\n\nexport const controlStandardStyles = cva(cn(\n    \"gridui-control-standard\",\n    \"gridui-u-input--p-gridui-8 gridui-u-input--min-h-gridui-control\",\n));\n\nexport const controlSmallStyles = cva(cn(\n    \"gridui-control-small\",\n    \"gridui-u-input--py-gridui-4 gridui-u-input--px-gridui-8 gridui-u-input--min-h-gridui-control-small\",\n));\n\nexport const controlVariants = cva(controlStyles(), {\n    variants: {\n        size: {\n            standard: controlStandardStyles(),\n            small: controlSmallStyles(),\n        },\n    },\n    defaultVariants: { size: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Input\n * @description Input\n */\n\nimport { controlVariants } from \"../shared/style\";\nimport type { TextControlOptions } from \"../shared/text-control-options\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type InputProps = ComponentPropsWithRef<\"input\"> & TextControlOptions;\n\nexport const Input: FC<InputProps> = (props: InputProps) => {\n    const {\n        size,\n        controlSize = \"standard\",\n        className,\n        onChange,\n        onValueChange,\n        ...restProps\n    } = props;\n    return (<input\n        {...restProps}\n        size={size}\n        onChange={(event) => {\n            onChange?.(event);\n            onValueChange?.(event.currentTarget.value);\n        }}\n        className={cn(controlVariants({ size: controlSize }), className)}\n    />);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Label\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const labelStyles = cva(cn(\n    \"gridui-label\",\n    \"gridui-u-input--inline-flex gridui-u-input--items-center gridui-u-input--gap-gridui-4 gridui-u-input--type-ui\",\n));\n\nexport const labelIconStyles = cva(\"gridui-u-input--inline-flex gridui-u-input--shrink-0 gridui-u-input--text-foreground gridui-u-input--[&>svg]:size-gridui-16\");\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Label\n * @description Label\n */\n\nimport { labelIconStyles, labelStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type LabelProps = ComponentPropsWithRef<\"label\"> & {\n    readonly icon?: ReactNode;\n};\n\nexport const Label: FC<LabelProps> = (props: LabelProps) => {\n    const { icon, children, className, ...restProps } = props;\n    return (<label\n        {...restProps}\n        className={cn(labelStyles(), className)}\n    >\n        {icon && (<span\n            aria-hidden=\"true\"\n            className={labelIconStyles()}\n        >\n            {icon}\n        </span>)}\n        {children}\n    </label>);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Textarea\n * @description Use Textarea Autosize\n */\n\nimport { type RefObject, useCallback, useEffect, useLayoutEffect } from \"react\";\n\nexport const useTextareaAutosize = (ref: RefObject<HTMLTextAreaElement | null>, enabled: boolean, maxHeight?: number) => {\n    if (maxHeight !== undefined && (!Number.isFinite(maxHeight) || maxHeight <= 0)) {\n        throw new Error(\"Textarea maxHeight must be finite and positive.\");\n    }\n    const resize = useCallback(() => {\n        const element = ref.current;\n        if (!enabled || !element || element.clientWidth === 0) {\n            return;\n        }\n        const style = getComputedStyle(element);\n        const borders = parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);\n        const padding = parseFloat(style.paddingTop) + parseFloat(style.paddingBottom);\n        element.style.height = \"auto\";\n        const contentHeight = element.scrollHeight;\n        const height = style.boxSizing === \"border-box\" ? contentHeight + borders : contentHeight - padding;\n        const boundedHeight = Math.min(height, maxHeight ?? Number.POSITIVE_INFINITY);\n        element.style.height = `${boundedHeight}px`;\n        element.style.overflowY = height > boundedHeight ? \"auto\" : \"hidden\";\n    }, [\n        ref,\n        enabled,\n        maxHeight,\n    ]);\n    useLayoutEffect(() => {\n        const element = ref.current;\n        if (!enabled || !element) {\n            return;\n        }\n        const originalHeight = element.style.height;\n        const originalOverflow = element.style.overflowY;\n        return () => {\n            element.style.height = originalHeight;\n            element.style.overflowY = originalOverflow;\n        };\n    }, [\n        ref,\n        enabled,\n    ]);\n    useLayoutEffect(() => {\n        resize();\n    });\n    useEffect(() => {\n        const element = ref.current;\n        if (!enabled || !element) {\n            return;\n        }\n        let frame = 0;\n        let width = element.clientWidth;\n        const schedule = () => {\n            cancelAnimationFrame(frame);\n            frame = requestAnimationFrame(resize);\n        };\n        const observer = typeof ResizeObserver === \"undefined\" ? undefined : new ResizeObserver(() => {\n            if (element.clientWidth !== width) {\n                width = element.clientWidth;\n                schedule();\n            }\n        });\n        observer?.observe(element);\n        // A capture listener follows the live form owner, including DOM reassociation.\n        const reset = (event: Event): void => {\n            if (event.target === element.form) {\n                schedule();\n            }\n        };\n        const document = element.ownerDocument;\n        document.addEventListener(\"reset\", reset, true);\n        return () => {\n            cancelAnimationFrame(frame);\n            observer?.disconnect();\n            document.removeEventListener(\"reset\", reset, true);\n        };\n    }, [\n        ref,\n        enabled,\n        resize,\n    ]);\n    return resize;\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Textarea\n * @description Textarea\n */\n\nimport { controlVariants } from \"../shared/style\";\nimport type { TextControlOptions } from \"../shared/text-control-options\";\nimport { useTextareaAutosize } from \"./use-textarea-autosize\";\nimport { useScrollbars } from \"@gridui/overlay\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type ComponentPropsWithRef, type FC, useImperativeHandle, useRef } from \"react\";\n\nexport type TextareaProps = ComponentPropsWithRef<\"textarea\"> & TextControlOptions & {\n    readonly autoSize?: boolean;\n    readonly maxHeight?: number;\n};\n\nexport const Textarea: FC<TextareaProps> = (props: TextareaProps) => {\n    const {\n        controlSize = \"standard\",\n        className,\n        onChange,\n        onInput,\n        onValueChange,\n        ref,\n        autoSize = false,\n        maxHeight,\n        style,\n        ...restProps\n    } = props;\n    const element = useRef<HTMLTextAreaElement>(null);\n    // React attaches the native element before assigning imperative handles.\n    useImperativeHandle(ref, () => {\n        return element.current!;\n    });\n    const scrollRef = useScrollbars({ ref: element });\n    const resize = useTextareaAutosize(element, autoSize, maxHeight);\n    return (<textarea\n        {...restProps}\n        ref={scrollRef}\n        style={style}\n        onInput={(event) => {\n            resize();\n            onInput?.(event);\n        }}\n        onChange={(event) => {\n            onChange?.(event);\n            onValueChange?.(event.currentTarget.value);\n        }}\n        className={cn(controlVariants({ size: controlSize }), \"gridui-u-input--overflow-auto\", autoSize ? \"gridui-u-input--resize-none\" : \"gridui-u-input--resize-y\", className)}\n    />);\n};\n"],
-  "mappings": "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",
-  "names": ["cn", "cn", "cva", "cn", "jsx", "cn", "jsx"]
+  "sources": ["../src/shared/input-group-context.ts", "../src/shared/style.ts", "../src/input/input.tsx", "../src/input-group/input-group.tsx", "../src/input-group-addon/input-group-addon.tsx", "../src/input-group-button/input-group-button.tsx", "../src/label/style.ts", "../src/label/label.tsx", "../src/password-input/password-input.tsx", "../src/search-input/search-input.tsx", "../src/textarea/textarea.tsx"],
+  "sourcesContent": ["/**\n * @author WMXPY\n * @package Input\n * @namespace Shared\n * @description Input Group Context\n */\n\nimport { createContext, useContext } from \"react\";\n\nexport const inputGroupContext = createContext<\"standard\" | \"small\" | null>(null);\nexport const useInputGroupSize = () => {\n    return useContext(inputGroupContext);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const controlStyles = cva(cn(\n    \"gridui-control\",\n    \"gridui-u-input--min-w-0 gridui-u-input--w-full gridui-u-input--box-border gridui-u-input--border gridui-u-input--border-solid gridui-u-input--border-border gridui-u-input--rounded-control gridui-u-input--text-foreground gridui-u-input--bg-background gridui-u-input--type-input\",\n    \"gridui-u-input--disabled:opacity-50 gridui-u-input--disabled:cursor-not-allowed\",\n    \"gridui-u-input--aria-invalid:border-danger-foreground\",\n));\n\nexport const controlStandardStyles = cva(cn(\n    \"gridui-control-standard\",\n    \"gridui-u-input--p-gridui-8 gridui-u-input--min-h-gridui-control\",\n));\n\nexport const controlSmallStyles = cva(cn(\n    \"gridui-control-small\",\n    \"gridui-u-input--py-gridui-4 gridui-u-input--px-gridui-8 gridui-u-input--min-h-gridui-control-small\",\n));\n\nexport const controlVariants = cva(controlStyles(), {\n    variants: {\n        size: {\n            standard: controlStandardStyles(),\n            small: controlSmallStyles(),\n        },\n    },\n    defaultVariants: { size: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Input\n * @description Input\n */\n\nimport { useInputGroupSize } from \"../shared/input-group-context\";\nimport { controlVariants } from \"../shared/style\";\nimport type { TextControlOptions } from \"../shared/text-control-options\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type InputProps = ComponentPropsWithRef<\"input\"> & TextControlOptions;\n\nexport const Input: FC<InputProps> = (props: InputProps) => {\n    const groupSize = useInputGroupSize();\n    const {\n        size,\n        controlSize = groupSize ?? \"standard\",\n        className,\n        onChange,\n        onValueChange,\n        ...restProps\n    } = props;\n    return (<input\n        {...restProps}\n        size={size}\n        onChange={(event) => {\n            onChange?.(event);\n            onValueChange?.(event.currentTarget.value);\n        }}\n        className={cn(controlVariants({ size: controlSize }), groupSize && \"gridui-u-input--flex-1 gridui-u-input--w-0 gridui-u-input--border-0 gridui-u-input--bg-transparent\", className)}\n    />);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace InputGroup\n * @description Input Group\n */\n\nimport { inputGroupContext } from \"../shared/input-group-context\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type InputGroupProps = ComponentPropsWithRef<\"div\"> & {\n    readonly controlSize?: \"standard\" | \"small\";\n};\nexport const InputGroup: FC<InputGroupProps> = (props: InputGroupProps) => {\n    const { controlSize = \"standard\", className, children, ...restProps } = props;\n    return (<inputGroupContext.Provider\n        value={controlSize}\n    >\n        <div\n            {...restProps}\n            data-control-size={controlSize}\n            data-gridui-outline-target=\"\"\n            className={cn(\"gridui-input-group\", className)}\n        >\n            {children}\n        </div>\n    </inputGroupContext.Provider>);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace InputGroupAddon\n * @description Input Group Addon\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type InputGroupAddonProps = ComponentPropsWithRef<\"div\"> & {\n    readonly align?: \"inline-start\" | \"inline-end\" | \"block-start\" | \"block-end\";\n};\nexport const InputGroupAddon: FC<InputGroupAddonProps> = (props: InputGroupAddonProps) => {\n    const { align = \"inline-start\", className, ...restProps } = props;\n    return (<div\n        {...restProps}\n        data-align={align}\n        className={cn(\"gridui-input-group-addon\", className)}\n    />);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace InputGroupButton\n * @description Input Group Button\n */\n\nimport { useInputGroupSize } from \"../shared/input-group-context\";\nimport { Button, type ButtonProps } from \"@gridui/button\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { FC } from \"react\";\n\nexport type InputGroupButtonProps = ButtonProps;\nexport const InputGroupButton: FC<InputGroupButtonProps> = (props: InputGroupButtonProps) => {\n    const size = useInputGroupSize() ?? \"standard\";\n    const { className, ...restProps } = props;\n    return (<Button\n        variant=\"quiet\"\n        size={size}\n        {...restProps}\n        className={cn(\"gridui-input-group-button\", className)}\n    />);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Label\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const labelStyles = cva(cn(\n    \"gridui-label\",\n    \"gridui-u-input--inline-flex gridui-u-input--items-center gridui-u-input--gap-gridui-4 gridui-u-input--type-ui\",\n));\n\nexport const labelIconStyles = cva(\"gridui-u-input--inline-flex gridui-u-input--shrink-0 gridui-u-input--text-foreground gridui-u-input--[&>svg]:size-gridui-16\");\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Label\n * @description Label\n */\n\nimport { labelIconStyles, labelStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type LabelProps = ComponentPropsWithRef<\"label\"> & {\n    readonly icon?: ReactNode;\n};\n\nexport const Label: FC<LabelProps> = (props: LabelProps) => {\n    const { icon, children, className, ...restProps } = props;\n    return (<label\n        {...restProps}\n        className={cn(labelStyles(), className)}\n    >\n        {icon && (<span\n            aria-hidden=\"true\"\n            className={labelIconStyles()}\n        >\n            {icon}\n        </span>)}\n        {children}\n    </label>);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace PasswordInput\n * @description Password Input\n */\n\nimport { Input, type InputProps } from \"../input/input\";\nimport { InputGroup } from \"../input-group/input-group\";\nimport { InputGroupAddon } from \"../input-group-addon/input-group-addon\";\nimport { InputGroupButton } from \"../input-group-button/input-group-button\";\nimport { Eye, EyeOff } from \"lucide-react\";\nimport { type FC, useState } from \"react\";\n\nexport type PasswordInputProps = Omit<InputProps, \"type\"> & {\n    readonly showLabel: string;\n    readonly hideLabel: string;\n    readonly rootClassName?: string;\n};\nexport const PasswordInput: FC<PasswordInputProps> = (props: PasswordInputProps) => {\n    const { showLabel, hideLabel, rootClassName, controlSize = \"standard\", ...restProps } = props;\n    const [\n        visible,\n        setVisible,\n    ] = useState(false);\n    return (<InputGroup\n        controlSize={controlSize}\n        dir={restProps.dir}\n        className={rootClassName}\n    >\n        <Input\n            {...restProps}\n            type={visible ? \"text\" : \"password\"}\n        />\n        <InputGroupAddon\n            align=\"inline-end\"\n        >\n            <InputGroupButton\n                layout=\"icon\"\n                aria-label={visible ? hideLabel : showLabel}\n                disabled={restProps.disabled}\n                onClick={() => {\n                    setVisible(current => {\n                        return !current;\n                    });\n                }}\n            >\n                {visible ? (<EyeOff\n                    aria-hidden=\"true\"\n                />) : (<Eye\n                    aria-hidden=\"true\"\n                />)}\n            </InputGroupButton>\n        </InputGroupAddon>\n    </InputGroup>);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace SearchInput\n * @description Search Input\n */\n\nimport { Input, type InputProps } from \"../input/input\";\nimport { InputGroup } from \"../input-group/input-group\";\nimport { InputGroupAddon } from \"../input-group-addon/input-group-addon\";\nimport { InputGroupButton } from \"../input-group-button/input-group-button\";\nimport { Search, X } from \"lucide-react\";\nimport { type FC, useImperativeHandle, useRef } from \"react\";\n\nexport type SearchInputProps = Omit<InputProps, \"type\"> & {\n    readonly clearLabel: string;\n    readonly loading?: boolean;\n    readonly loadingLabel?: string;\n    readonly rootClassName?: string;\n};\nexport const SearchInput: FC<SearchInputProps> = (props: SearchInputProps) => {\n    const { clearLabel, loading = false, loadingLabel, rootClassName, controlSize = \"standard\", ref,\n        onValueChange, ...restProps } = props;\n    const input = useRef<HTMLInputElement>(null);\n    useImperativeHandle(ref, () => {\n        return input.current!;\n    });\n    return (<InputGroup\n        controlSize={controlSize}\n        dir={restProps.dir}\n        className={rootClassName}\n    >\n        <Input\n            {...restProps}\n            ref={input}\n            type=\"search\"\n            aria-busy={loading || restProps[\"aria-busy\"]}\n            onValueChange={(next) => {\n                onValueChange?.(next);\n            }}\n        />\n        <InputGroupAddon\n            aria-hidden=\"true\"\n        >\n            <Search\n                size={16}\n            />\n        </InputGroupAddon>\n        <InputGroupAddon\n            align=\"inline-end\"\n        >\n            {loading && (<span\n                role=\"status\"\n            >\n                {loadingLabel}\n            </span>)}\n            <InputGroupButton\n                layout=\"icon\"\n                aria-label={clearLabel}\n                disabled={restProps.disabled || restProps.readOnly}\n                onClick={() => {\n                    const element = input.current;\n                    if (!element || element.matches(\":disabled\") || element.readOnly) {\n                        return;\n                    }\n                    if (element.value !== \"\") {\n                        if (restProps.value === undefined) {\n                            element.value = \"\";\n                        }\n                        onValueChange?.(\"\");\n                    }\n                    element.focus();\n                }}\n            >\n                <X\n                    aria-hidden=\"true\"\n                />\n            </InputGroupButton>\n        </InputGroupAddon>\n    </InputGroup>);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Textarea\n * @description Textarea\n */\n\nimport { useInputGroupSize } from \"../shared/input-group-context\";\nimport { controlVariants } from \"../shared/style\";\nimport type { TextControlOptions } from \"../shared/text-control-options\";\nimport { useScrollbars } from \"@gridui/overlay\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type ComponentPropsWithRef, type CSSProperties, type FC } from \"react\";\n\nexport type TextareaProps = ComponentPropsWithRef<\"textarea\"> & TextControlOptions & {\n    readonly autoSize?: boolean;\n    readonly maxHeight?: number;\n    readonly maxRows?: number;\n};\nexport const Textarea: FC<TextareaProps> = (props: TextareaProps) => {\n    const groupSize = useInputGroupSize();\n    const { controlSize = groupSize ?? \"standard\", className, onChange, onValueChange, ref, autoSize = false,\n        maxHeight, maxRows, rows = 2, style, ...restProps } = props;\n    if (maxHeight !== undefined && (!Number.isFinite(maxHeight) || maxHeight <= 0)) {\n        throw new RangeError(\"Textarea maxHeight must be finite and positive.\");\n    }\n    if (maxRows !== undefined && (!Number.isSafeInteger(maxRows) || maxRows < rows)) {\n        throw new RangeError(\"Textarea maxRows must be an integer at least as large as rows.\");\n    }\n    if (maxHeight !== undefined && maxRows !== undefined) {\n        throw new RangeError(\"Textarea accepts either maxRows or maxHeight, not both.\");\n    }\n    const scrollRef = useScrollbars<HTMLTextAreaElement>({ ref });\n    const sizing: CSSProperties & Record<`--${string}`, string | number | undefined> = {\n        \"--_gridui-textarea-rows\": rows,\n        \"--_gridui-textarea-max-rows\": maxRows,\n        ...style,\n        ...(autoSize && maxHeight !== undefined ? { maxHeight } : {}),\n    };\n    return (<textarea\n        {...restProps}\n        ref={scrollRef}\n        rows={rows}\n        style={sizing}\n        data-autosize={autoSize || undefined}\n        data-max-rows={maxRows !== undefined || undefined}\n        onChange={(event) => {\n            onChange?.(event);\n            onValueChange?.(event.currentTarget.value);\n        }}\n        className={cn(controlVariants({ size: controlSize }), \"gridui-textarea gridui-u-input--overflow-auto\", groupSize && \"gridui-u-input--border-0 gridui-u-input--bg-transparent\", autoSize ? \"gridui-u-input--resize-none gridui-u-input--min-h-(--_gridui-textarea-min-height)\" : \"gridui-u-input--resize-y\", className)}\n    />);\n};\n"],
+  "mappings": "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",
+  "names": ["cn", "cn", "jsx", "cn", "jsx", "cn", "jsx", "cn", "cva", "cn", "jsx", "jsx", "jsxs", "jsx", "jsxs", "cn", "jsx"]
 }

package/dist/input-group/input-group.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @author WMXPY
+ * @package Input
+ * @namespace InputGroup
+ * @description Input Group
+ */
+import type { ComponentPropsWithRef, FC } from "react";
+export type InputGroupProps = ComponentPropsWithRef<"div"> & {
+    readonly controlSize?: "standard" | "small";
+};
+export declare const InputGroup: FC<InputGroupProps>;

package/dist/input-group-addon/input-group-addon.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @author WMXPY
+ * @package Input
+ * @namespace InputGroupAddon
+ * @description Input Group Addon
+ */
+import type { ComponentPropsWithRef, FC } from "react";
+export type InputGroupAddonProps = ComponentPropsWithRef<"div"> & {
+    readonly align?: "inline-start" | "inline-end" | "block-start" | "block-end";
+};
+export declare const InputGroupAddon: FC<InputGroupAddonProps>;

package/dist/input-group-button/input-group-button.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @author WMXPY
+ * @package Input
+ * @namespace InputGroupButton
+ * @description Input Group Button
+ */
+import { type ButtonProps } from "@gridui/button";
+import type { FC } from "react";
+export type InputGroupButtonProps = ButtonProps;
+export declare const InputGroupButton: FC<InputGroupButtonProps>;