@pycolors/ui 1.4.0 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,7 +1,12 @@
|
|
|
1
|
-
import * as React from
|
|
2
|
-
import * as CheckboxPrimitive from
|
|
3
|
-
export
|
|
4
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
3
|
+
export interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
|
|
4
|
+
/**
|
|
5
|
+
* Error message rendered below the Checkbox field.
|
|
6
|
+
*/
|
|
7
|
+
error?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
|
|
5
10
|
export type CheckboxFieldProps = React.HTMLAttributes<HTMLDivElement>;
|
|
6
11
|
declare function CheckboxField({ className, ...props }: Readonly<CheckboxFieldProps>): import("react/jsx-runtime").JSX.Element;
|
|
7
12
|
export type CheckboxContentProps = React.HTMLAttributes<HTMLDivElement>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAS9D,MAAM,
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAS9D,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,wBAAwB,CACnE,OAAO,iBAAiB,CAAC,IAAI,CAC9B;IACC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,QAAQ,yFA0Eb,CAAC;AAOF,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AAEtE,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,CAAC,kBAAkB,CAAC,2CAW3E;AAED,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AAExE,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,QAAQ,CAAC,oBAAoB,CAAC,2CAQhC;AAED,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;AAE7E,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,CAAC,kBAAkB,CAAC,2CAa3E;AAED,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AAE5E,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,QAAQ,CAAC,wBAAwB,CAAC,2CAYpC;AAMD,OAAO,EACL,QAAQ,EACR,aAAa,EACb,eAAe,EACf,aAAa,EACb,mBAAmB,GACpB,CAAC"}
|
|
@@ -1,22 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import * as React from
|
|
4
|
-
import * as CheckboxPrimitive from
|
|
5
|
-
import { Check, Minus } from
|
|
6
|
-
import { cn } from
|
|
7
|
-
const Checkbox = React.forwardRef(({ className, checked,
|
|
8
|
-
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
5
|
+
import { Check, Minus } from "lucide-react";
|
|
6
|
+
import { cn } from "../../lib/utils.js";
|
|
7
|
+
const Checkbox = React.forwardRef(({ className, checked, error, id, "aria-describedby": consumerDescribedBy, "aria-invalid": consumerAriaInvalid, "aria-errormessage": consumerErrorMessage, ...props }, ref) => {
|
|
8
|
+
const generatedId = React.useId();
|
|
9
|
+
const checkboxId = error ? (id ?? generatedId) : id;
|
|
10
|
+
const errorId = error ? `${checkboxId}-error` : undefined;
|
|
11
|
+
const describedBy = [...(errorId ? [errorId] : []), consumerDescribedBy]
|
|
12
|
+
.filter(Boolean)
|
|
13
|
+
.join(" ") || undefined;
|
|
14
|
+
const checkbox = (_jsx(CheckboxPrimitive.Root, { ref: ref, "data-slot": "checkbox", id: checkboxId, checked: checked, className: cn("peer mt-0.5 size-4 shrink-0 rounded-sm border border-input bg-background shadow-xs transition-colors", "hover:border-foreground/30", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background", "disabled:cursor-not-allowed disabled:opacity-50", "data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground", "data-[state=indeterminate]:border-primary data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground", "aria-invalid:border-destructive aria-invalid:ring-destructive/20", className), ...props, "aria-invalid": error ? true : consumerAriaInvalid, "aria-describedby": error ? describedBy : consumerDescribedBy, "aria-errormessage": error ? errorId : consumerErrorMessage, children: _jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "flex items-center justify-center text-current", children: checked === "indeterminate" ? (_jsx(Minus, { className: "size-3", "aria-hidden": "true" })) : (_jsx(Check, { className: "size-3", "aria-hidden": "true" })) }) }));
|
|
15
|
+
if (!error)
|
|
16
|
+
return checkbox;
|
|
17
|
+
return (_jsxs(_Fragment, { children: [checkbox, _jsx("p", { id: errorId, role: "alert", className: "col-start-2 row-start-2 mt-1 text-xs text-destructive", children: error })] }));
|
|
18
|
+
});
|
|
19
|
+
Checkbox.displayName = "Checkbox";
|
|
9
20
|
function CheckboxField({ className, ...props }) {
|
|
10
|
-
return (_jsx("div", { "data-slot": "checkbox-field", className: cn(
|
|
21
|
+
return (_jsx("div", { "data-slot": "checkbox-field", className: cn("grid grid-cols-[auto_minmax(0,1fr)] items-start gap-x-3", className), ...props }));
|
|
11
22
|
}
|
|
12
23
|
function CheckboxContent({ className, ...props }) {
|
|
13
|
-
return (_jsx("div", { "data-slot": "checkbox-content", className: cn(
|
|
24
|
+
return (_jsx("div", { "data-slot": "checkbox-content", className: cn("col-start-2 row-start-1 grid min-w-0 gap-1", className), ...props }));
|
|
14
25
|
}
|
|
15
26
|
function CheckboxLabel({ className, ...props }) {
|
|
16
|
-
return (_jsx("label", { "data-slot": "checkbox-label", className: cn(
|
|
27
|
+
return (_jsx("label", { "data-slot": "checkbox-label", className: cn("block cursor-pointer text-sm font-medium leading-5 text-foreground", "peer-disabled:cursor-not-allowed peer-disabled:opacity-50", "[&_p]:m-0 [&_p]:text-sm [&_p]:font-medium [&_p]:leading-5 [&_p]:text-foreground", className), ...props }));
|
|
17
28
|
}
|
|
18
29
|
function CheckboxDescription({ className, ...props }) {
|
|
19
|
-
return (_jsx("div", { "data-slot": "checkbox-description", className: cn(
|
|
30
|
+
return (_jsx("div", { "data-slot": "checkbox-description", className: cn("text-sm leading-5 text-muted-foreground", "[&_p]:m-0 [&_p]:text-sm [&_p]:leading-5 [&_p]:text-muted-foreground", className), ...props }));
|
|
20
31
|
}
|
|
21
32
|
/* -----------------------------------------------------------------------------
|
|
22
33
|
* Exports
|