@ui-sdk/react 0.0.0-stage → 0.1.0-beta.1

package/dist/file-input.js

@@ -0,0 +1,170 @@
+"use client";
+// src/file-input.tsx
+import {
+  fileInput
+} from "@ui-sdk/core/file-input";
+import { fileKey } from "@ui-sdk/core/renderer";
+import * as React from "react";
+import { useControllerEntry } from "./controller-target.js";
+import { controlRender, useFieldControl } from "./field-context.js";
+import { Connected } from "./popup.js";
+import {
+  createParts,
+  renderElement,
+  usePart,
+  usePrimitive
+} from "./use-primitive.js";
+import {
+  createFileInputController,
+  formatFileSize,
+  relativePath
+} from "@ui-sdk/core/file-input";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var parts = createParts(fileInput, { trigger: "button", dropzone: "div" });
+var FileContext = React.createContext(null);
+function useItemFile(part, own) {
+  const listed = React.useContext(FileContext);
+  const file = own ?? listed;
+  if (!file) {
+    throw new Error(
+      `${part} must be used inside <FileInputList>, or be given a file.`
+    );
+  }
+  return file;
+}
+function FileInput({
+  value,
+  defaultValue,
+  onValueChange,
+  onReject,
+  accept,
+  multiple,
+  directory,
+  capture,
+  maxFiles,
+  maxSize,
+  minSize,
+  validate,
+  name,
+  form,
+  required,
+  disabled,
+  announcement,
+  controller,
+  debug,
+  children,
+  ...props
+}) {
+  const field = useFieldControl();
+  const handle = usePrimitive(fileInput, {
+    value,
+    defaultValue,
+    onValueChange,
+    onReject,
+    accept,
+    multiple,
+    directory,
+    capture,
+    maxFiles,
+    maxSize,
+    minSize,
+    validate,
+    name: name ?? field?.name,
+    form,
+    required,
+    disabled: disabled || field?.disabled,
+    announcement,
+    controller,
+    debug
+  });
+  useControllerEntry(controller, handle);
+  const content = (current) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    typeof children === "function" ? children(current) : children,
+    /* @__PURE__ */ jsx(HiddenInput, {})
+  ] });
+  return usePart(handle, "root", {}, { ...props, children: content });
+}
+function HiddenInput() {
+  return usePart(fileInput, "input", {}, {}, "input");
+}
+function FileInputTrigger({
+  controller,
+  render,
+  ...props
+}) {
+  const unconnected = () => renderElement(
+    "button",
+    { type: "button", ...props },
+    render,
+    unconnectedState
+  );
+  return /* @__PURE__ */ jsx(
+    Connected,
+    {
+      primitive: fileInput,
+      controller,
+      fallback: unconnected,
+      children: /* @__PURE__ */ jsx(TriggerPart, { ...props, render })
+    }
+  );
+}
+var unconnectedState = {
+  value: [],
+  disabled: false,
+  required: false,
+  dragging: false
+};
+function TriggerPart({ render, ...props }) {
+  return /* @__PURE__ */ jsx(
+    parts.Trigger,
+    {
+      ...props,
+      render: controlRender(useFieldControl(), "button", render)
+    }
+  );
+}
+var FileInputDropzone = parts.Dropzone;
+function FileInputList({
+  children,
+  ...props
+}) {
+  const items = (state) => state.value.map((file) => /* @__PURE__ */ jsx(FileContext.Provider, { value: file, children }, fileKey(file)));
+  return usePart(fileInput, "list", {}, { ...props, children: items });
+}
+function FileInputItem({
+  file: own,
+  ...props
+}) {
+  const file = useItemFile("FileInputItem", own);
+  const element = usePart(
+    fileInput,
+    "item",
+    { file, value: fileKey(file) },
+    props
+  );
+  return /* @__PURE__ */ jsx(FileContext.Provider, { value: file, children: element });
+}
+function FileInputItemRemove({
+  file: own,
+  ...props
+}) {
+  const file = useItemFile("FileInputItemRemove", own);
+  return usePart(
+    fileInput,
+    "item-remove",
+    { file, value: fileKey(file) },
+    props,
+    "button"
+  );
+}
+export {
+  FileInput,
+  FileInputDropzone,
+  FileInputItem,
+  FileInputItemRemove,
+  FileInputList,
+  FileInputTrigger,
+  createFileInputController,
+  formatFileSize,
+  relativePath
+};

package/dist/form-inputs.d.ts

@@ -0,0 +1,5 @@
+import { type PrimitiveHandle } from "./use-primitive.js";
+declare function FormInputs({ handle }: {
+    handle: PrimitiveHandle<any>;
+}): import("react").JSX.Element | null;
+export { FormInputs };

package/dist/form-inputs.js

@@ -0,0 +1,22 @@
+"use client";
+// src/form-inputs.tsx
+import { readIn, slotIn, usePart } from "./use-primitive.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function FormInputs({ handle }) {
+  const inputs = ({ value, ...input }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("input", { ...input, defaultValue: value }),
+    handle.state.multiple && readIn(handle, () => handle.api.internal.serialized()).map(
+      (key) => {
+        const { value: value2, ...hidden } = slotIn(handle, "value-input", {
+          id: key,
+          value: key
+        });
+        return /* @__PURE__ */ jsx("input", { ...hidden, defaultValue: value2 }, key);
+      }
+    )
+  ] });
+  return usePart(handle, "form-input", {}, { render: inputs }, "input");
+}
+export {
+  FormInputs
+};

package/dist/gesture.d.ts

@@ -0,0 +1 @@
+export { createVelocityTracker, projectDistance, rubberBand, sectorOf, solveSpring, } from "@ui-sdk/core/gesture";

package/dist/gesture.js

@@ -0,0 +1,16 @@
+"use client";
+// src/gesture.ts
+import {
+  createVelocityTracker,
+  projectDistance,
+  rubberBand,
+  sectorOf,
+  solveSpring
+} from "@ui-sdk/core/gesture";
+export {
+  createVelocityTracker,
+  projectDistance,
+  rubberBand,
+  sectorOf,
+  solveSpring
+};

package/dist/history.d.ts

@@ -0,0 +1,2 @@
+export { createHistory, describeEntry, stageChanges, } from "@ui-sdk/core/history";
+export type { HistoryEntry, HistoryOptions, StagedChange, } from "@ui-sdk/core/history";

package/dist/history.js

@@ -0,0 +1,12 @@
+"use client";
+// src/history.ts
+import {
+  createHistory,
+  describeEntry,
+  stageChanges
+} from "@ui-sdk/core/history";
+export {
+  createHistory,
+  describeEntry,
+  stageChanges
+};

package/dist/hover-card.d.ts

@@ -0,0 +1,33 @@
+import { type HoverCardContentProps, type HoverCardContentState, type HoverCardOptions, type HoverCardTriggerProps, type HoverCardTriggerState } from "@ui-sdk/core/hover-card";
+import * as React from "react";
+import { type PartProps } from "./use-primitive.js";
+/**
+ * The props of `HoverCard`.
+ * @stable
+ */
+type HoverCardProps = HoverCardOptions & {
+    children?: React.ReactNode;
+};
+/**
+ * A preview of what a link points to, shown when the pointer rests on the link or keyboard focus stays on it.
+ * @stable
+ */
+declare function HoverCard({ children, container, ...options }: HoverCardProps): React.JSX.Element;
+/**
+ * A link by default: pressing it follows the link, and hover or focus opens the card.
+ * @stable
+ */
+declare function HoverCardTrigger({ controller, ...props }: PartProps<"a", HoverCardTriggerState> & HoverCardTriggerProps): React.JSX.Element;
+/**
+ * The card itself, positioned against its trigger.
+ * @stable
+ */
+declare function HoverCardContent<Payload = unknown>({ side, align, sideOffset, alignOffset, collisionPadding, arrowPadding, anchor, keepMounted, container, ...props }: PartProps<"div", HoverCardContentState<Payload>> & HoverCardContentProps): React.JSX.Element | null;
+/**
+ * An arrow on the card's edge that points at its trigger.
+ * @stable
+ */
+declare const HoverCardArrow: import("./use-primitive.js").PartComponent<import("@ui-sdk/core/hover-card").HoverCardPrimitive, "arrow", "div">;
+export { createHoverCardController } from "@ui-sdk/core/hover-card";
+export type { HoverCardApi, HoverCardArrowState, HoverCardContentProps, HoverCardContentState, HoverCardController, HoverCardOpenChangeReason, HoverCardOptions, HoverCardPayloadChangeReason, HoverCardPrimitive, HoverCardTriggerProps, HoverCardTriggerState, } from "@ui-sdk/core/hover-card";
+export { HoverCard, HoverCardArrow, HoverCardContent, type HoverCardProps, HoverCardTrigger, };

package/dist/hover-card.js

@@ -0,0 +1,84 @@
+"use client";
+// src/hover-card.tsx
+import {
+  hoverCard
+} from "@ui-sdk/core/hover-card";
+import * as React from "react";
+import {
+  Connected,
+  renderPopup,
+  useControllerEntry,
+  useOwnContainer,
+  usePopupContainer
+} from "./popup.js";
+import {
+  createParts,
+  HandleScope,
+  renderElement,
+  usePart,
+  usePrimitive
+} from "./use-primitive.js";
+import { createHoverCardController } from "@ui-sdk/core/hover-card";
+import { jsx } from "react/jsx-runtime";
+var parts = createParts(hoverCard, { trigger: "a", arrow: "div" });
+var ContainerContext = React.createContext(void 0);
+function HoverCard({ children, container, ...options }) {
+  const handle = usePrimitive(hoverCard, options);
+  useControllerEntry(options.controller, handle);
+  return /* @__PURE__ */ jsx(HandleScope, { handle, children: /* @__PURE__ */ jsx(ContainerContext.Provider, { value: container, children }) });
+}
+function HoverCardTrigger({
+  controller,
+  ...props
+}) {
+  const { payload: _, render, ...rest } = props;
+  const unconnected = () => renderElement("a", rest, render, { open: false });
+  return /* @__PURE__ */ jsx(
+    Connected,
+    {
+      primitive: hoverCard,
+      controller,
+      fallback: unconnected,
+      children: /* @__PURE__ */ jsx(parts.Trigger, { ...props })
+    }
+  );
+}
+function HoverCardContent({
+  side,
+  align,
+  sideOffset,
+  alignOffset,
+  collisionPadding,
+  arrowPadding,
+  anchor,
+  keepMounted,
+  container,
+  ...props
+}) {
+  const target = usePopupContainer(useOwnContainer(container, ContainerContext));
+  const content = {
+    side,
+    align,
+    sideOffset,
+    alignOffset,
+    collisionPadding,
+    arrowPadding,
+    anchor,
+    keepMounted
+  };
+  const element = usePart(
+    hoverCard,
+    "content",
+    content,
+    props
+  );
+  return element && renderPopup(element, target);
+}
+var HoverCardArrow = parts.Arrow;
+export {
+  HoverCard,
+  HoverCardArrow,
+  HoverCardContent,
+  HoverCardTrigger,
+  createHoverCardController
+};