@ldkj/web-ui 0.11.1 → 0.13.0

package/components/form/checkbox/CheckboxGroup.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import { type SxProps } from "@/styling";
+import { type CheckboxProps } from "./Checkbox";
+type CheckboxGroupGapPreset = "xs" | "sm" | "md" | "lg";
+type CheckboxGroupGap = CheckboxGroupGapPreset | number | string;
+export type CheckboxGroupOption = {
+    label: React.ReactNode;
+    value: string;
+    disabled?: boolean;
+    description?: React.ReactNode;
+    className?: string;
+    checkboxProps?: Omit<CheckboxProps, "checked" | "defaultChecked" | "disabled" | "name" | "onCheckedChange" | "value">;
+};
+type CheckboxGroupBaseProps = Omit<React.ComponentPropsWithoutRef<"div">, "defaultValue" | "onChange"> & {
+    class?: string;
+    disabled?: boolean;
+    direction?: "horizontal" | "vertical";
+    gap?: CheckboxGroupGap;
+    name?: string;
+    options?: CheckboxGroupOption[];
+    sx?: SxProps;
+};
+export type CheckboxGroupMultipleProps = CheckboxGroupBaseProps & {
+    type?: "multiple";
+    value?: string[];
+    defaultValue?: string[];
+    onChange?: (value: string[]) => void;
+};
+export type CheckboxGroupSingleProps = CheckboxGroupBaseProps & {
+    type: "single";
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string | undefined) => void;
+};
+export type CheckboxGroupProps = CheckboxGroupMultipleProps | CheckboxGroupSingleProps;
+/**
+ * CheckboxGroup 管理一组选项的选择状态，支持多选、单选和原生表单提交。
+ */
+export declare function CheckboxGroup(props: CheckboxGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace CheckboxGroup {
+    var displayName: string;
+}
+export {};

package/components/form/checkbox/context.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+export type CheckboxGroupContextValue = {
+    disabled: boolean;
+    name?: string;
+    selectedValues: ReadonlySet<string>;
+    toggleValue: (value: string, checked: boolean) => void;
+};
+export declare function CheckboxGroupProvider(props: {
+    children: React.ReactNode;
+    value: CheckboxGroupContextValue;
+}): React.FunctionComponentElement<React.ProviderProps<CheckboxGroupContextValue | null>>;
+export declare function useCheckboxGroupContext(): CheckboxGroupContextValue | null;

package/components/form/checkbox/index.d.ts

@@ -1 +1,2 @@
 export * from "./Checkbox";
+export * from "./CheckboxGroup";

package/components/form/input/index.d.ts

@@ -0,0 +1 @@
+export * from "./input";

package/components/form/input/input.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { type SxProps } from "@/styling";
+export type InputProps = React.ComponentPropsWithoutRef<"input"> & {
+    class?: string;
+    sx?: SxProps;
+};
+/**
+ * Input 是基础文本输入框组件，支持原生 input 属性、`class` 别名与本库 `sx` 样式系统。
+ */
+declare const Input: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+    class?: string;
+    sx?: SxProps;
+} & React.RefAttributes<HTMLInputElement>>;
+export { Input };

package/components/form/label/Label.d.ts

@@ -0,0 +1,41 @@
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { type SxProps } from "@/styling";
+type LabelAlign = "left" | "center" | "right";
+type LabelPosition = "left" | "top";
+export type LabelProps = Omit<React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, "className" | "style"> & {
+    className?: string;
+    class?: string;
+    colon?: boolean | React.ReactNode;
+    containerClass?: string;
+    containerClassName?: string;
+    containerStyle?: React.CSSProperties;
+    containerSx?: SxProps;
+    label?: React.ReactNode;
+    labelAlign?: LabelAlign;
+    labelWidth?: number | string;
+    position?: LabelPosition;
+    required?: boolean;
+    sx?: SxProps;
+    style?: React.CSSProperties;
+};
+/**
+ * Label 用于表单字段标注，支持原生 label 语义、必填标记、冒号、宽度对齐和本库 `sx` 样式系统。
+ */
+declare const Label: React.ForwardRefExoticComponent<Omit<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref">, "className" | "style"> & {
+    className?: string;
+    class?: string;
+    colon?: boolean | React.ReactNode;
+    containerClass?: string;
+    containerClassName?: string;
+    containerStyle?: React.CSSProperties;
+    containerSx?: SxProps;
+    label?: React.ReactNode;
+    labelAlign?: LabelAlign;
+    labelWidth?: number | string;
+    position?: LabelPosition;
+    required?: boolean;
+    sx?: SxProps;
+    style?: React.CSSProperties;
+} & React.RefAttributes<HTMLLabelElement>>;
+export { Label };

package/components/form/label/index.d.ts

@@ -0,0 +1 @@
+export * from "./Label";

package/components/form/radio/Radio.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { type SxProps } from "@/styling";
+export type RadioProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item> & {
+    class?: string;
+    sx?: SxProps;
+};
+/**
+ * Radio 是基于 Radix RadioGroup Item 的单选按钮，需放在 RadioGroup 中使用。
+ */
+declare const Radio: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+    class?: string;
+    sx?: SxProps;
+} & React.RefAttributes<HTMLButtonElement>>;
+export { Radio };

package/components/form/radio/RadioGroup.d.ts

@@ -0,0 +1,38 @@
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { type SxProps } from "@/styling";
+import { type RadioProps } from "./Radio";
+type RadioGroupGapPreset = "xs" | "sm" | "md" | "lg";
+type RadioGroupGap = RadioGroupGapPreset | number | string;
+export type RadioGroupOption = {
+    label: React.ReactNode;
+    value: string;
+    disabled?: boolean;
+    description?: React.ReactNode;
+    className?: string;
+    radioProps?: Omit<RadioProps, "checked" | "defaultChecked" | "disabled" | "name" | "value">;
+};
+export type RadioGroupProps = Omit<React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>, "children" | "className" | "style"> & {
+    children?: React.ReactNode;
+    className?: string;
+    class?: string;
+    direction?: "horizontal" | "vertical";
+    gap?: RadioGroupGap;
+    options?: RadioGroupOption[];
+    sx?: SxProps;
+    style?: React.CSSProperties;
+};
+/**
+ * RadioGroup 管理一组互斥选项，支持受控/非受控、原生表单提交和本库 `sx` 样式系统。
+ */
+declare const RadioGroup: React.ForwardRefExoticComponent<Omit<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref">, "className" | "children" | "style"> & {
+    children?: React.ReactNode;
+    className?: string;
+    class?: string;
+    direction?: "horizontal" | "vertical";
+    gap?: RadioGroupGap;
+    options?: RadioGroupOption[];
+    sx?: SxProps;
+    style?: React.CSSProperties;
+} & React.RefAttributes<HTMLDivElement>>;
+export { RadioGroup };

package/components/form/radio/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Radio";
+export * from "./RadioGroup";

package/components/ui/label.d.ts

@@ -0,0 +1,2 @@
+export { Label } from "@/components/form/label";
+export type { LabelProps } from "@/components/form/label";

package/components/ui/radio-group.d.ts

@@ -0,0 +1,2 @@
+export { RadioGroup } from "@/components/form/radio";
+export { Radio as RadioGroupItem } from "@/components/form/radio";