@godxjp/ui 21.0.0 → 23.0.0

package/dist/components/data-entry/checkbox.js

@@ -6,6 +6,7 @@ import { Check, Minus } from "lucide-react";
 import { cn } from "../../lib/utils.js";
 import { useFieldIdentity } from "../../lib/field-a11y.js";
 import { CheckboxGroup } from "./checkbox-group.js";
+import { withOwnHitTarget } from "./choice-hit-target.js";
 function CheckboxGlyph({ state }) {
   return state === "indeterminate" ? /* @__PURE__ */ jsx(Minus, { className: "ui-checkbox-icon", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Check, { className: "ui-checkbox-icon", "aria-hidden": "true" });
 }
@@ -96,6 +97,7 @@ const CheckboxRoot = React.forwardRef((props, ref) => {
         "peer ui-checkbox data-[invalid]:border-destructive data-[state=checked]:border-primary data-[state=checked]:text-primary-foreground inline-flex shrink-0 items-center justify-center shadow-xs transition-shadow outline-none",
         className
       ),
+      render: (domProps) => /* @__PURE__ */ jsx("label", { ...domProps, children: withOwnHitTarget(domProps.children) }),
       onChange: (next) => {
         setUncontrolled(next);
         onCheckedChange?.(next);

package/dist/components/data-entry/choice-hit-target.d.ts

@@ -0,0 +1,24 @@
+import * as React from "react";
+/**
+ * THE PAINTED BOX OF A CHOICE CONTROL IS ITS OWN HIT TARGET (gh#476).
+ *
+ * react-aria-components renders the real `<input>` inside a `VisuallyHidden` span, and that span
+ * carries its geometry as an INLINE style: `position:absolute; width:1px; height:1px;
+ * clip:rect(0 0 0 0); clip-path:inset(50%)`, pinned at the label's top-left. The thing a user
+ * sees and aims at is the `<label>` wrapped around it, so every pointer landing on the control
+ * hits the LABEL, and the input's own hit area is a 13x13 box at a different origin than the
+ * 16x16 one that is painted.
+ *
+ * Measured on `data-entry-checkbox` before this helper existed: of 49 points scanned across the
+ * box, **0** reached the input, 46 reached the label; Playwright `check()` / `uncheck()` without
+ * `force` timed out on `<label data-slot="checkbox"> intercepts pointer events`, the same check a
+ * browser applies to a real pointer. `force: true` passed, which is the tell: the control is
+ * functional, it is simply covered.
+ *
+ * An inline style can only be beaten with `!important`, so the WRAPPER is replaced instead of
+ * fought. The `render` prop hands over the DOM children react-aria built; the VisuallyHidden
+ * element among them becomes a `.ui-choice-input` span that control.css sizes to the painted box.
+ * The `<input>` itself — its props, its ref, its keyboard handling, its place in the a11y tree —
+ * is passed through untouched, so this is a geometry change and nothing else.
+ */
+export declare function withOwnHitTarget(children: React.ReactNode): React.ReactNode;

package/dist/components/data-entry/choice-hit-target.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { VisuallyHidden } from "react-aria-components";
+function withOwnHitTarget(children) {
+  return React.Children.map(
+    children,
+    (child) => React.isValidElement(child) && child.type === VisuallyHidden ? /* @__PURE__ */ jsx("span", { "data-slot": "choice-input", className: "ui-choice-input", children: child.props.children }) : child
+  );
+}
+export {
+  withOwnHitTarget
+};

package/dist/components/data-entry/control-surface.d.ts

@@ -59,3 +59,11 @@ export declare function applyMaxTagCount<T extends {
     omitted: T[];
     overflow: React.ReactNode | undefined;
 };
+/**
+ * Split a run of text on antd's `tokenSeparators` — the contract behind "paste a column out of a
+ * spreadsheet and get one value per line".
+ *
+ * Shared by `TagInput` and the tags/multiple `Select`: they are the two controls that turn typing
+ * into several values, and two copies of this would be two answers to "what is a separator".
+ */
+export declare function splitByTokenSeparators(text: string, separators: string[]): string[];

package/dist/components/data-entry/control-surface.js

@@ -31,9 +31,18 @@ function applyMaxTagCount(items, maxTagCount, maxTagPlaceholder) {
   const overflow = typeof maxTagPlaceholder === "function" ? maxTagPlaceholder(omitted.map(({ value, label }) => ({ value, label }))) : maxTagPlaceholder;
   return { visible, omitted, overflow };
 }
+function escapeForCharClass(character) {
+  return character.replace(/[\\\]^-]/g, "\\$&");
+}
+function splitByTokenSeparators(text, separators) {
+  if (!separators.length) return [text];
+  const pattern = new RegExp(`[${separators.map(escapeForCharClass).join("")}]`);
+  return text.split(pattern);
+}
 export {
   applyMaxTagCount,
   controlSurfaceAttrs,
   resolveAllowClear,
-  resolveAriaInvalid
+  resolveAriaInvalid,
+  splitByTokenSeparators
 };

package/dist/components/data-entry/date-picker.d.ts

@@ -2,8 +2,15 @@ import * as React from "react";
 import type { DatePickerProp } from "../../props/components/data-entry.prop.js";
 export type { DatePickerProp, DatePickerProp as DatePickerProps, } from "../../props/components/data-entry.prop.js";
 /**
- * DatePicker — WAI-ARIA date combobox. A real, typeable `<input>` holds the value as an ISO-8601
- * `yyyy-MM-dd` string (the international standard): it is form-submittable (give it a `name`),
- * screen-reader friendly, and e2e-testable by simply filling the input.
+ * DatePicker — ONE date control, WAI-ARIA date combobox. A real, typeable `<input>` holds the
+ * value (form-submittable via `name`, screen-reader friendly, e2e-testable by filling the input);
+ * the panel is the visual affordance.
+ *
+ * Two axes: `picker` sets the GRANULARITY (day · week · month · quarter · year), `range` sets the
+ * CARDINALITY (one date, `multiple` dates, or a two-endpoint `DateRange`). This replaces the four
+ * components this package used to ship — `DateRangePicker`, `MonthPicker`, `MonthRangePicker` were
+ * separate copies of this same machine, and every one of them had drifted: a disabled picker that
+ * still opened, bounds that greyed a chevron and clamped nothing, an unhandled Enter key, and a
+ * `name` that submitted `2026/03`. Written once, those are fixed on all eight combinations.
  */
 export declare function DatePicker(props: DatePickerProp): React.JSX.Element;