@godxjp/ui 5.0.2 → 6.0.1

package/dist/chunk-CDWPQ5RP.js

@@ -0,0 +1,187 @@
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
+import { Input } from './chunk-VOHTRR5X.js';
+import { Button } from './chunk-HJEBRCXL.js';
+import { useTranslation } from './chunk-3F2AKYRD.js';
+import { isValidHhmm, formatTimeOfDay, normalizeHhmm } from './chunk-YFCQKO3B.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import * as React from 'react';
+import { Clock } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function pad2(n) {
+  return String(n).padStart(2, "0");
+}
+function buildMinutes(step) {
+  const safe = Math.min(60, Math.max(1, step));
+  const items = [];
+  for (let m = 0; m < 60; m += safe) items.push(m);
+  return items;
+}
+function parseHhmm(value) {
+  const normalized = value ? normalizeHhmm(value) : null;
+  if (!normalized) return { hour: 9, minute: 0 };
+  const [h, m] = normalized.split(":").map(Number);
+  return { hour: h, minute: m };
+}
+function TimeColumn({
+  label,
+  items,
+  selected,
+  onSelect
+}) {
+  const listRef = React.useRef(null);
+  React.useEffect(() => {
+    listRef.current?.querySelector('[data-selected="true"]')?.scrollIntoView({ block: "center" });
+  }, [selected]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-muted-foreground border-b px-1 py-1.5 text-center text-xs font-medium", children: label }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: listRef,
+        className: "h-52 [scrollbar-width:thin] [scrollbar-gutter:stable] overflow-y-scroll overscroll-contain p-1",
+        children: items.map((item) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "data-selected": item === selected,
+            className: cn(
+              "hover:bg-accent flex w-full items-center justify-center rounded-md py-1.5 text-sm tabular-nums transition-colors",
+              item === selected && "bg-primary text-primary-foreground hover:bg-primary/90"
+            ),
+            onClick: () => {
+              onSelect(item);
+            },
+            children: pad2(item)
+          },
+          item
+        ))
+      }
+    )
+  ] });
+}
+function TimePickerPanel({ value, minuteStep, onChange, onDone }) {
+  const { t } = useTranslation();
+  const { hour, minute } = parseHhmm(value);
+  const minutes = buildMinutes(minuteStep);
+  const snappedMinute = minutes.includes(minute) ? minute : minutes[0];
+  const [draft, setDraft] = React.useState(value);
+  React.useEffect(() => {
+    setDraft(value);
+  }, [value]);
+  const commitDraft = () => {
+    const normalized = normalizeHhmm(draft);
+    if (!normalized) return;
+    onChange(normalized);
+    onDone?.();
+  };
+  const commit = (next) => {
+    onChange(next);
+    onDone?.();
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "w-36", children: [
+    /* @__PURE__ */ jsxs("div", { className: "divide-border flex divide-x", children: [
+      /* @__PURE__ */ jsx(
+        TimeColumn,
+        {
+          label: t("dataEntry.timePicker.hour"),
+          items: Array.from({ length: 24 }, (_, i) => i),
+          selected: hour,
+          onSelect: (h) => {
+            onChange(`${pad2(h)}:${pad2(snappedMinute)}`);
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        TimeColumn,
+        {
+          label: t("dataEntry.timePicker.minute"),
+          items: minutes,
+          selected: snappedMinute,
+          onSelect: (m) => {
+            commit(`${pad2(hour)}:${pad2(m)}`);
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "border-t p-2", children: /* @__PURE__ */ jsx(
+      Input,
+      {
+        value: draft,
+        onChange: (e) => {
+          setDraft(e.target.value);
+        },
+        inputMode: "numeric",
+        autoComplete: "off",
+        placeholder: t("dataEntry.timePicker.typeLabel"),
+        "aria-label": t("dataEntry.timePicker.typeLabel"),
+        className: "text-center tabular-nums",
+        onKeyDown: (e) => {
+          if (e.key === "Enter") {
+            e.preventDefault();
+            commitDraft();
+          }
+        },
+        onBlur: () => {
+          const normalized = normalizeHhmm(draft);
+          if (normalized) setDraft(normalized);
+        }
+      }
+    ) })
+  ] });
+}
+function TimePicker({
+  value: controlledValue,
+  defaultValue,
+  onChange,
+  placeholder,
+  disabled,
+  className,
+  id,
+  minuteStep = 5
+}) {
+  const { t } = useTranslation();
+  const [open, setOpen] = React.useState(false);
+  const [internal, setInternal] = React.useState(defaultValue ?? "");
+  const isControlled = controlledValue !== void 0;
+  const value = isControlled ? controlledValue : internal;
+  const resolvedPlaceholder = placeholder ?? t("dataEntry.timePicker.placeholder");
+  const setValue = (next) => {
+    if (!isControlled) setInternal(next);
+    onChange?.(next);
+  };
+  const display = value && isValidHhmm(value) ? formatTimeOfDay(value) : value || null;
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        id,
+        type: "button",
+        variant: "outline",
+        disabled,
+        className: cn(
+          "w-full justify-start text-left font-normal tabular-nums",
+          !display && "text-muted-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Clock, { className: "mr-2 size-4 shrink-0", "aria-hidden": "true" }),
+          display ?? resolvedPlaceholder
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx(
+      TimePickerPanel,
+      {
+        value: value || "09:00",
+        minuteStep,
+        onChange: setValue,
+        onDone: () => {
+          setOpen(false);
+        }
+      }
+    ) })
+  ] });
+}
+
+export { TimePicker };

package/dist/chunk-CP2LET6N.js

@@ -0,0 +1,244 @@
+import { normalizeTreeOptions, formatPathLabels, getNodeByPath, filterTreeOptions, pathsEqual, pathKey } from './chunk-SMLKNECP.js';
+import { Checkbox } from './chunk-E76QIYSY.js';
+import { Command, CommandInput } from './chunk-V6UWJKZF.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
+import { ScrollArea, ScrollBar } from './chunk-3KPEZ5CF.js';
+import { Button } from './chunk-HJEBRCXL.js';
+import { useTranslation } from './chunk-3F2AKYRD.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import * as React from 'react';
+import { X, ChevronsUpDown, Check, ChevronRight } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function pathInValues(path, values) {
+  return values.some((v) => pathsEqual(v, path));
+}
+function togglePath(values, path) {
+  if (pathInValues(path, values)) return values.filter((v) => !pathsEqual(v, path));
+  return [...values, path];
+}
+function Cascader({
+  options: optionsProp,
+  value,
+  defaultValue,
+  onChange,
+  multiple,
+  changeOnSelect,
+  showSearch,
+  placeholder,
+  disabled,
+  className,
+  id,
+  expandTrigger = "click",
+  fieldNames,
+  allowClear = true
+}) {
+  const { t } = useTranslation();
+  const options = React.useMemo(
+    () => normalizeTreeOptions(optionsProp, fieldNames),
+    [optionsProp, fieldNames]
+  );
+  const [open, setOpen] = React.useState(false);
+  const [activePath, setActivePath] = React.useState([]);
+  const [search, setSearch] = React.useState("");
+  const isControlledSingle = !multiple && value !== void 0;
+  const isControlledMulti = multiple && value !== void 0;
+  const [internalSingle, setInternalSingle] = React.useState(
+    multiple ? [] : defaultValue ?? []
+  );
+  const [internalMulti, setInternalMulti] = React.useState(
+    defaultValue ?? []
+  );
+  const singleValue = isControlledSingle ? value : internalSingle;
+  const multiValue = isControlledMulti ? value : internalMulti;
+  const resolvedPlaceholder = placeholder ?? t("dataEntry.cascader.placeholder");
+  const displayLabel = React.useMemo(() => {
+    if (multiple) {
+      if (!multiValue.length) return null;
+      return multiValue.map((path) => formatPathLabels(getNodeByPath(options, path))).join(", ");
+    }
+    if (!singleValue.length) return null;
+    return formatPathLabels(getNodeByPath(options, singleValue));
+  }, [multiple, multiValue, singleValue, options]);
+  const commitSingle = (path) => {
+    if (!isControlledSingle) setInternalSingle(path);
+    onChange?.(path, getNodeByPath(options, path));
+    setOpen(false);
+    setActivePath([]);
+    setSearch("");
+  };
+  const commitMulti = (paths) => {
+    if (!isControlledMulti) setInternalMulti(paths);
+    onChange?.(
+      paths,
+      paths.map((p) => getNodeByPath(options, p))
+    );
+  };
+  const columns = React.useMemo(() => {
+    const cols = [options];
+    for (const segment of activePath) {
+      const col = cols.at(-1);
+      const node = col?.find((n) => n.value === segment);
+      if (node?.children?.length) cols.push(node.children);
+      else break;
+    }
+    return cols;
+  }, [options, activePath]);
+  const handleSelectNode = (node, path) => {
+    const hasChildren = (node.children?.length ?? 0) > 0 && node.isLeaf !== true;
+    if (hasChildren && !changeOnSelect) {
+      setActivePath(path);
+      return;
+    }
+    if (multiple) {
+      commitMulti(togglePath(multiValue, path));
+      return;
+    }
+    commitSingle(path);
+  };
+  const isSearching = showSearch && search.trim().length > 0;
+  const searchResults = React.useMemo(
+    () => isSearching ? filterTreeOptions(options, search) : [],
+    [options, search, isSearching]
+  );
+  const handleOpenChange = (next) => {
+    setOpen(next);
+    if (!next) {
+      setSearch("");
+      setActivePath([]);
+    }
+  };
+  const clearValue = (e) => {
+    e.stopPropagation();
+    if (multiple) commitMulti([]);
+    else commitSingle([]);
+  };
+  const renderCascadeColumns = () => /* @__PURE__ */ jsxs(ScrollArea, { className: "w-full", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex max-h-[min(280px,50vh)]", children: columns.map((col, colIndex) => /* @__PURE__ */ jsx(
+      "ul",
+      {
+        className: "min-w-[9rem] border-r last:border-r-0",
+        onMouseLeave: expandTrigger === "hover" ? () => setActivePath(activePath.slice(0, colIndex)) : void 0,
+        children: col.map((node) => {
+          const path = [...activePath.slice(0, colIndex), node.value];
+          const hasChildren = (node.children?.length ?? 0) > 0 && node.isLeaf !== true;
+          const active = activePath[colIndex] === node.value;
+          const selected = multiple ? pathInValues(path, multiValue) : pathsEqual(path, singleValue);
+          return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              disabled: node.disabled,
+              className: cn(
+                "flex w-full items-center gap-1 px-3 py-2 text-sm outline-none",
+                "hover:bg-accent hover:text-accent-foreground",
+                active && "bg-accent/70 font-medium",
+                node.disabled && "pointer-events-none opacity-50"
+              ),
+              onMouseEnter: expandTrigger === "hover" && hasChildren ? () => setActivePath(path) : void 0,
+              onClick: () => !node.disabled && handleSelectNode(node, path),
+              children: [
+                multiple && /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    checked: selected,
+                    disabled: node.disabled,
+                    className: "mr-1",
+                    "aria-hidden": true,
+                    tabIndex: -1
+                  }
+                ),
+                !multiple && selected && /* @__PURE__ */ jsx(Check, { className: "mr-1 size-4 shrink-0", "aria-hidden": "true" }),
+                /* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-left", children: node.label }),
+                hasChildren && /* @__PURE__ */ jsx(ChevronRight, { className: "size-4 shrink-0 opacity-50", "aria-hidden": "true" })
+              ]
+            }
+          ) }, node.value);
+        })
+      },
+      colIndex
+    )) }),
+    /* @__PURE__ */ jsx(ScrollBar, { orientation: "horizontal" })
+  ] });
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        id,
+        type: "button",
+        variant: "outline",
+        role: "combobox",
+        "aria-expanded": open,
+        disabled,
+        className: cn(
+          "w-full justify-between font-normal",
+          !displayLabel && "text-muted-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate", children: displayLabel ?? resolvedPlaceholder }),
+          /* @__PURE__ */ jsxs("span", { className: "ml-2 flex shrink-0 items-center gap-1", children: [
+            allowClear && displayLabel && !disabled && /* @__PURE__ */ jsx(
+              X,
+              {
+                className: "size-4 opacity-50 hover:opacity-100",
+                "aria-hidden": "true",
+                onClick: clearValue
+              }
+            ),
+            /* @__PURE__ */ jsx(ChevronsUpDown, { className: "size-4 opacity-50", "aria-hidden": "true" })
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(
+      PopoverContent,
+      {
+        className: "w-auto min-w-[var(--radix-popover-trigger-width)] p-0",
+        align: "start",
+        children: [
+          showSearch && /* @__PURE__ */ jsx("div", { className: "border-b p-2", children: /* @__PURE__ */ jsx(Command, { shouldFilter: false, children: /* @__PURE__ */ jsx(
+            CommandInput,
+            {
+              placeholder: t("dataEntry.cascader.searchPlaceholder"),
+              value: search,
+              onValueChange: setSearch
+            }
+          ) }) }),
+          isSearching ? /* @__PURE__ */ jsx(ScrollArea, { className: "max-h-[min(300px,50vh)]", children: /* @__PURE__ */ jsx("div", { className: "p-1", children: searchResults.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground py-6 text-center text-sm", children: t("dataEntry.cascader.empty") }) : searchResults.map(({ path, labels }) => {
+            const label = labels.join(" / ");
+            const selected = multiple ? pathInValues(path, multiValue) : pathsEqual(path, singleValue);
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                className: cn(
+                  "flex w-full items-center rounded-sm px-2 py-1.5 text-sm outline-none",
+                  "hover:bg-accent hover:text-accent-foreground",
+                  selected && "bg-accent/60"
+                ),
+                onClick: () => handleSelectNode({ value: path.at(-1)}, path),
+                children: [
+                  multiple ? /* @__PURE__ */ jsx(Checkbox, { checked: selected, className: "mr-2", "aria-hidden": true, tabIndex: -1 }) : /* @__PURE__ */ jsx(
+                    Check,
+                    {
+                      className: cn(
+                        "mr-2 size-4 shrink-0",
+                        selected ? "opacity-100" : "opacity-0"
+                      ),
+                      "aria-hidden": "true"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "truncate text-left", children: label })
+                ]
+              },
+              pathKey(path)
+            );
+          }) }) }) : renderCascadeColumns()
+        ]
+      }
+    )
+  ] });
+}
+
+export { Cascader };

package/dist/chunk-CQBADMFG.js

@@ -0,0 +1,20 @@
+import { Label } from './chunk-7PWBC4BY.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function ChoiceField({ id, label, description, className, children }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("ui-choice-field", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "ui-choice-control", children }),
+    /* @__PURE__ */ jsxs("div", { className: "ui-choice-content", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: id, className: "ui-choice-label", children: label }),
+      description ? /* @__PURE__ */ jsx("p", { className: "ui-choice-description", children: description }) : null
+    ] })
+  ] });
+}
+
+// src/components/data-entry/choice-option.ts
+function choiceGroupClassName(_orientation = "vertical", className) {
+  return cn("ui-choice-group", className);
+}
+
+export { ChoiceField, choiceGroupClassName };

package/dist/chunk-CRERCLIZ.js

@@ -0,0 +1,33 @@
+import { cn } from './chunk-U7N2A7A3.js';
+import * as React from 'react';
+import * as SliderPrimitive from '@radix-ui/react-slider';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Slider = React.forwardRef(
+  ({ className, defaultValue, value, min = 0, max = 100, ...props }, ref) => {
+    const values = React.useMemo(
+      () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
+      [defaultValue, max, min, value]
+    );
+    return /* @__PURE__ */ jsxs(
+      SliderPrimitive.Root,
+      {
+        ref,
+        "data-slot": "slider",
+        className: cn("ui-slider", className),
+        defaultValue,
+        min,
+        max,
+        value,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(SliderPrimitive.Track, { "data-slot": "slider-track", className: "ui-slider-track", children: /* @__PURE__ */ jsx(SliderPrimitive.Range, { "data-slot": "slider-range", className: "ui-slider-range" }) }),
+          values.map((_, index) => /* @__PURE__ */ jsx(SliderPrimitive.Thumb, { "data-slot": "slider-thumb", className: "ui-slider-thumb" }, index))
+        ]
+      }
+    );
+  }
+);
+Slider.displayName = SliderPrimitive.Root.displayName;
+
+export { Slider };