@jcsoftdev/ui 0.1.6 → 0.2.0

package/dist/primitives/index.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Unstyled, headless behaviour primitives. No Tailwind classes or tokens live here:
+ * parts forward props and refs, expose `data-state`, and take `asChild` where a
+ * trigger makes sense. Styled components in `overlays/` are built on top of them.
+ *
+ * Only the building blocks meant for consumers are exported. Internals (layer
+ * stack singleton, scroll lock, `hideOthers`, tab helpers) are imported by file
+ * from inside the package. The package `./*` wildcard export already resolves
+ * `@jcsoftdev/ui/primitives` to this barrel (built as `dist/primitives/index.js`);
+ * deep paths such as `primitives/hide-others` do not resolve. The documented,
+ * explicit entry is defined in T14.
+ */
+export * as CommandPrimitive from "./command/command.js";
+export { type CommandFilter, commandScore } from "./command/score.js";
+export * as DialogPrimitive from "./dialog/dialog.js";
+export * as MenuPrimitive from "./menu/menu.js";
+export * as PopoverPrimitive from "./popover/popover.js";
+export type { Align, ArrowGeometry, Direction, Padding, Placement, PlacementInput, Rect, Side, Size, } from "./popper/geometry.js";
+export { computePlacement } from "./popper/geometry.js";
+export * as PopperPrimitive from "./popper/popper.js";
+export { Portal } from "./portal.js";
+export { type DismissableLayerOptions, type FocusOutsideEvent, type InteractOutsideEvent, LAYER_BRANCH_ATTRIBUTE, type PointerDownOutsideEvent, useDismissableLayer, } from "./use-dismissable-layer.js";
+export { type FocusScopeOptions, useFocusScope } from "./use-focus-scope.js";
+export { useLayer } from "./use-layer.js";
+export { usePresence } from "./use-presence.js";

package/dist/primitives/index.js

@@ -0,0 +1,30 @@
+import * as CommandPrimitive from "./command/command.js";
+import { commandScore } from "./command/score.js";
+import * as DialogPrimitive from "./dialog/dialog.js";
+import * as MenuPrimitive from "./menu/menu.js";
+import * as PopoverPrimitive from "./popover/popover.js";
+import { computePlacement } from "./popper/geometry.js";
+import * as PopperPrimitive from "./popper/popper.js";
+import { Portal } from "./portal.js";
+import {
+  LAYER_BRANCH_ATTRIBUTE,
+  useDismissableLayer
+} from "./use-dismissable-layer.js";
+import { useFocusScope } from "./use-focus-scope.js";
+import { useLayer } from "./use-layer.js";
+import { usePresence } from "./use-presence.js";
+export {
+  CommandPrimitive,
+  DialogPrimitive,
+  LAYER_BRANCH_ATTRIBUTE,
+  MenuPrimitive,
+  PopoverPrimitive,
+  PopperPrimitive,
+  Portal,
+  commandScore,
+  computePlacement,
+  useDismissableLayer,
+  useFocusScope,
+  useLayer,
+  usePresence
+};

package/dist/primitives/layer-stack.d.ts

@@ -0,0 +1,8 @@
+/** Ordered stack of open overlay layers; only the topmost reacts to Escape and outside presses. */
+export interface LayerStack<T extends object = object> {
+    push(layer: T): () => void;
+    isTop(layer: T): boolean;
+    size(): number;
+}
+export declare function createLayerStack<T extends object = object>(): LayerStack<T>;
+export declare const overlayLayers: LayerStack<object>;

package/dist/primitives/layer-stack.js

@@ -0,0 +1,23 @@
+import { globalSingleton } from "./global-singleton.js";
+function createLayerStack() {
+  const layers = [];
+  return {
+    push(layer) {
+      layers.push(layer);
+      return () => {
+        const index = layers.indexOf(layer);
+        if (index !== -1) layers.splice(index, 1);
+      };
+    },
+    isTop: (layer) => layers[layers.length - 1] === layer,
+    size: () => layers.length
+  };
+}
+const overlayLayers = globalSingleton(
+  "@jcsoftdev/ui/overlay-layers",
+  () => createLayerStack()
+);
+export {
+  createLayerStack,
+  overlayLayers
+};

package/dist/primitives/menu/grace.d.ts

@@ -0,0 +1,17 @@
+export interface Point {
+    x: number;
+    y: number;
+}
+export interface BoxEdges {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+}
+/**
+ * Triangle-like area between the pointer leaving a submenu trigger and the submenu,
+ * so the pointer can cross other items on its way without closing the submenu.
+ */
+export declare function graceArea(exit: Point, side: "left" | "right", box: BoxEdges): Point[];
+/** Ray-casting point-in-polygon test. */
+export declare function isPointInPolygon(point: Point, polygon: readonly Point[]): boolean;

package/dist/primitives/menu/grace.js

@@ -0,0 +1,27 @@
+function graceArea(exit, side, box) {
+  const rightSide = side === "right";
+  const bleed = rightSide ? -5 : 5;
+  const near = rightSide ? box.left : box.right;
+  const far = rightSide ? box.right : box.left;
+  return [
+    { x: exit.x + bleed, y: exit.y },
+    { x: near, y: box.top },
+    { x: far, y: box.top },
+    { x: far, y: box.bottom },
+    { x: near, y: box.bottom }
+  ];
+}
+function isPointInPolygon(point, polygon) {
+  const { x, y } = point;
+  let inside = false;
+  for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
+    const a = polygon[i];
+    const b = polygon[j];
+    if (a.y > y !== b.y > y && x < (b.x - a.x) * (y - a.y) / (b.y - a.y) + a.x) inside = !inside;
+  }
+  return inside;
+}
+export {
+  graceArea,
+  isPointInPolygon
+};

package/dist/primitives/menu/menu.d.ts

@@ -0,0 +1,97 @@
+import { type ComponentProps, type ReactNode } from "react";
+import * as PopperPrimitive from "../popper/popper.js";
+import { Portal } from "../portal.js";
+import { type FocusOutsideEvent, type InteractOutsideEvent, type PointerDownOutsideEvent } from "../use-dismissable-layer.js";
+/**
+ * In-house menu primitive (WAI-ARIA menu button pattern), same part names, callbacks and
+ * data attributes as the Radix dropdown menu it replaced, on the in-house popper.
+ * Unstyled. Parts: Root, Trigger, Anchor, Portal, Content, Item, CheckboxItem, RadioGroup,
+ * RadioItem, ItemIndicator, Label, Separator, Group, Sub, SubTrigger, SubContent, Arrow.
+ *
+ * Highlight is DOM focus: the focused item carries `data-highlighted`. Items that
+ * are disabled carry `data-disabled` and are skipped by arrows and typeahead.
+ */
+type Direction = "ltr" | "rtl";
+export interface MenuRootProps {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Blocks the page (pointer, scroll, assistive tech) while open. Defaults to true. */
+    modal?: boolean;
+    /** Reading direction for submenu keys; read from the trigger when omitted. */
+    dir?: Direction;
+    children?: ReactNode;
+}
+export declare function Root({ open: openProp, defaultOpen, onOpenChange, modal, dir, children, }: MenuRootProps): import("react").JSX.Element;
+type ButtonProps = ComponentProps<"button"> & {
+    asChild?: boolean;
+};
+/** Positions the content against this element instead of the trigger (a point, for a context menu). */
+export declare function Anchor({ ref, ...props }: PopperPrimitive.PopperAnchorProps): import("react").JSX.Element;
+export interface MenuTriggerProps extends ButtonProps {
+}
+export declare function Trigger({ asChild, disabled, onPointerDown, onKeyDown, ref, ...props }: MenuTriggerProps): import("react").JSX.Element;
+export { Portal };
+export declare const Arrow: typeof PopperPrimitive.Arrow;
+type EventHooks = {
+    onOpenAutoFocus?: (event: Event) => void;
+    onCloseAutoFocus?: (event: Event) => void;
+    onEscapeKeyDown?: (event: KeyboardEvent) => void;
+    onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;
+    onFocusOutside?: (event: FocusOutsideEvent) => void;
+    onInteractOutside?: (event: InteractOutsideEvent) => void;
+};
+export interface MenuContentProps extends PopperPrimitive.PopperContentProps, EventHooks {
+    /** Keep mounted while closed, for your own animation or measurement. */
+    forceMount?: boolean;
+}
+export declare function Content({ forceMount, ref, ...props }: MenuContentProps): import("react").JSX.Element | null;
+export interface MenuItemImplProps extends Omit<ComponentProps<"div">, "onSelect"> {
+    asChild?: boolean;
+    disabled?: boolean;
+    /** Text used by typeahead. Defaults to the item's text content. */
+    textValue?: string;
+}
+export interface MenuItemProps extends MenuItemImplProps {
+    /** Runs when the item is chosen. `preventDefault()` keeps the menu open. */
+    onSelect?: (event: Event) => void;
+}
+export declare function Item({ disabled, onSelect, onClick, onPointerDown, onPointerUp, onKeyDown, ...props }: MenuItemProps): import("react").JSX.Element;
+type CheckedState = boolean | "indeterminate";
+export interface MenuCheckboxItemProps extends MenuItemProps {
+    checked?: CheckedState;
+    onCheckedChange?: (checked: boolean) => void;
+}
+export declare function CheckboxItem({ checked, onCheckedChange, onSelect, ...props }: MenuCheckboxItemProps): import("react").JSX.Element;
+export interface MenuRadioGroupProps extends ComponentProps<"div"> {
+    value?: string;
+    onValueChange?: (value: string) => void;
+}
+export declare function RadioGroup({ value, onValueChange, ...props }: MenuRadioGroupProps): import("react").JSX.Element;
+export interface MenuRadioItemProps extends MenuItemProps {
+    value: string;
+}
+export declare function RadioItem({ value, onSelect, ...props }: MenuRadioItemProps): import("react").JSX.Element;
+export interface MenuItemIndicatorProps extends ComponentProps<"span"> {
+    asChild?: boolean;
+    /** Render even when unchecked, for your own transition. */
+    forceMount?: boolean;
+}
+/** Renders only while its checkbox or radio item is checked. */
+export declare function ItemIndicator({ asChild, forceMount, ...props }: MenuItemIndicatorProps): import("react").JSX.Element | null;
+export declare function Label(props: ComponentProps<"div">): import("react").JSX.Element;
+export declare function Group(props: ComponentProps<"div">): import("react").JSX.Element;
+export declare function Separator(props: ComponentProps<"div">): import("react").JSX.Element;
+export interface MenuSubProps {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children?: ReactNode;
+}
+export declare function Sub({ open: openProp, defaultOpen, onOpenChange, children }: MenuSubProps): import("react").JSX.Element;
+export type MenuSubTriggerProps = MenuItemImplProps;
+export declare function SubTrigger({ disabled, onClick, onKeyDown, onPointerMove, onPointerLeave, ref, ...props }: MenuSubTriggerProps): import("react").JSX.Element;
+export interface MenuSubContentProps extends PopperPrimitive.PopperContentProps, EventHooks {
+    forceMount?: boolean;
+}
+export declare function SubContent({ forceMount, ref, ...props }: MenuSubContentProps): import("react").JSX.Element | null;