@godxjp/ui 21.0.0 → 23.0.0

package/dist/lib/select-options.js

@@ -0,0 +1,46 @@
+function text(value) {
+  if (typeof value === "string" || typeof value === "number" || typeof value === "bigint") {
+    return String(value);
+  }
+  return "";
+}
+function groupChildren(option, optionsKey) {
+  const children = option[optionsKey];
+  return Array.isArray(children) ? children : void 0;
+}
+function normalizeSelectOptions(options, fieldNames) {
+  if (!options?.length) return [];
+  const labelKey = fieldNames?.label ?? "label";
+  const valueKey = fieldNames?.value ?? "value";
+  const optionsKey = fieldNames?.options ?? "options";
+  const groupLabelKey = fieldNames?.groupLabel ?? labelKey;
+  const disabledKey = fieldNames?.disabled ?? "disabled";
+  const flat = [];
+  const push = (raw, group) => {
+    const value = text(raw[valueKey]);
+    const label = text(raw[labelKey]);
+    flat.push({
+      ...raw,
+      value,
+      // A row with no label reads as its own value — the id is at least identifiable, where an
+      // empty row is not selectable by sight or by type-to-select.
+      label: label || value,
+      disabled: raw[disabledKey] === true || void 0,
+      // A row inside a group takes the group's heading; a flat row keeps the `group` it declared.
+      group: group ?? (typeof raw.group === "string" ? raw.group : void 0)
+    });
+  };
+  for (const entry of options) {
+    const children = groupChildren(entry, optionsKey);
+    if (children) {
+      const heading = text(entry[groupLabelKey]) || void 0;
+      for (const child of children) push(child, heading);
+      continue;
+    }
+    push(entry, void 0);
+  }
+  return flat;
+}
+export {
+  normalizeSelectOptions
+};

package/dist/props/components/data-display.prop.d.ts

@@ -187,6 +187,13 @@ export type BadgeProp = {
     icon?: React.ComponentType<{
         className?: string;
     }> | null;
+    /**
+     * Lining, fixed-width figures — for a chip whose content is a COUNT sitting in a column with
+     * other counts. The same axis `Text`, `TableCell` and `StatCard` already carry; its absence here
+     * was an asymmetry, not a decision. Off by default, because tabular figures are wider and a chip
+     * carrying words should not pay for them.
+     */
+    tabular?: boolean;
     className?: ClassNameProp;
     children?: ChildrenProp;
 };
@@ -396,9 +403,10 @@ export type PermissionMatrixProp = {
 export type ScrollAreaAnchorProp = "none" | "bottom";
 /** @see ScrollArea */
 /**
- * @see ScrollArea — which AXES scroll. This is not decoration: Radix sets the viewport's
- * `overflowX`/`overflowY` inline from which scrollbars are mounted, so an axis with no `ScrollBar`
- * is `overflow: hidden` and its content is CLIPPED, not merely un-barred.
+ * @see ScrollArea — which AXES scroll. This is not decoration: it IS the `overflow` the element
+ * carries, so an axis this does not name is `hidden` and its content is CLIPPED, not merely
+ * un-barred. It is also the whole replacement for mounting a `<ScrollBar>`, which was how the
+ * Radix-era component was told to open a second axis.
  *
  * `both` is a third value rather than an array or a pair of booleans because the axes are one
  * decision — a pane scrolls down, across, or freely — and a closed union is what `check:prop-vocabulary`
@@ -412,12 +420,14 @@ export type ScrollAreaProp = {
      *
      * Reach for `horizontal` for a strip of non-shrinking columns (a board, a lane of cards): the
      * viewport keeps its tab stop, so the strip is scrollable from the keyboard, and the consumer
-     * writes no overflow styling of its own.
+     * writes no overflow styling of its own. `both` is what replaces a vertical area that also
+     * mounted `<ScrollBar orientation="horizontal" />`.
      */
     orientation?: ScrollAreaOrientationProp;
     /**
-     * Ref to the element that actually SCROLLS — the Radix viewport — not the root. The root is
-     * `overflow: hidden` and never scrolls, so the component's own `ref` cannot serve.
+     * Ref to the element that actually SCROLLS. Since v23 that is the component's own element, so
+     * this and `ref` hand back the SAME node — it is kept because it names the thing precisely, and
+     * because the Radix-era shape (a root wrapping a separate viewport) made `ref` the wrong handle.
      */
     viewportRef?: React.Ref<HTMLDivElement>;
     /** Edge the viewport sticks to as content grows. Default `none` (inert). */