@yahoo/uds-v5-wip 1.60.0 → 1.62.0

package/dist/components/dist/modal.d.ts

@@ -1,433 +0,0 @@
-import { ComponentConfig } from "../../config/dist/createConfig.js";
-import * as _$react from "react";
-import { ReactNode } from "react";
-import * as _$_uds_types0 from "@uds/types";
-
-//#region ../components/dist/modal.d.ts
-/**
- * @description A modal overlay that requires user interaction before returning to the main content. Controlled via open prop bound to state; use on.openChange with setState (value: false) to close, and a Button on.press with setState (value: true) to open. Must be placed in a parent element's children array to render.
- */
-declare const Modal: _$react.FC<_$_uds_types0.CreateComponentProps<ComponentConfig<{
-  Modal: {
-    readonly base: {
-      readonly overlay: {
-        readonly position: "fixed";
-        readonly inset: "0";
-        readonly zIndex: "50";
-        readonly display: "flex";
-        readonly alignItems: "center";
-        readonly justifyContent: "center";
-        readonly backgroundColor: "rgba(0,0,0,0.5)";
-        readonly motion: {
-          readonly initial: {
-            readonly opacity: 0;
-          };
-          readonly animate: {
-            readonly opacity: 1;
-          };
-          readonly exit: {
-            readonly opacity: 0;
-          };
-          readonly transition: {
-            readonly duration: 0.15;
-          };
-        };
-      };
-      readonly trigger: {
-        readonly display: "inline-block";
-        readonly cursor: "pointer";
-      };
-      readonly dismiss: {
-        readonly position: "absolute";
-        readonly inset: "0";
-        readonly background: "none";
-        readonly border: "none";
-        readonly padding: "0";
-        readonly cursor: "default";
-      };
-      readonly panel: {
-        readonly position: "relative";
-        readonly zIndex: "1";
-        readonly backgroundColor: string;
-        readonly borderRadius: string;
-        readonly padding: string;
-        readonly minWidth: "24rem";
-        readonly maxWidth: "32rem";
-        readonly display: "flex";
-        readonly flexDirection: "column";
-        readonly gap: string;
-        readonly borderWidth: string;
-        readonly borderColor: string;
-        readonly motion: {
-          readonly initial: {
-            readonly opacity: 0;
-            readonly scale: 0.95;
-            readonly y: 10;
-          };
-          readonly animate: {
-            readonly opacity: 1;
-            readonly scale: 1;
-            readonly y: 0;
-          };
-          readonly exit: {
-            readonly opacity: 0;
-            readonly scale: 0.95;
-            readonly y: 10;
-          };
-          readonly transition: {
-            readonly duration: 0.2;
-            readonly ease: [0.16, 1, 0.3, 1];
-          };
-        };
-      };
-      readonly title: {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: "1";
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly fontSize: "1.125rem";
-        readonly color: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      };
-      readonly description: {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: "1";
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly maxInlineSize: "65ch";
-        readonly textWrap: "pretty";
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      };
-      readonly actions: {
-        readonly display: "flex";
-        readonly justifyContent: "flex-end";
-        readonly gap: string;
-        readonly paddingTop: string;
-      };
-    };
-  };
-}, {}>, {
-  open?: boolean;
-  onOpenChange?: (open: boolean) => void;
-  title?: ReactNode;
-  description?: ReactNode;
-  actions?: ReactNode;
-  trigger?: ReactNode;
-  children?: ReactNode;
-}, {
-  trigger: "div";
-  overlay: "div";
-  dismiss: "button";
-  panel: "div";
-  title: "div";
-  description: "div";
-  actions: "div";
-}>>;
-interface ImperativeModalOptions {
-  title?: ReactNode;
-  description?: ReactNode;
-  actions?: ReactNode;
-  onClose?: () => void;
-}
-interface ModalContextValue {
-  open: (content?: ReactNode, options?: ImperativeModalOptions) => string;
-  close: (id?: string) => void;
-  closeAll: () => void;
-}
-declare const ModalProvider: _$react.FC<{
-    children: React.ReactNode;
-  } & Record<never, never>>, useModal: () => ModalContextValue;
-//#endregion
-export { Modal, ModalContextValue, ModalProvider, useModal };

package/dist/components/dist/modal.js

@@ -1,125 +0,0 @@
-"use client";
-import { createComponent } from "../../core/dist/createComponent.js";
-import { createProvider } from "../../core/dist/createProvider.js";
-import "../../core/dist/index.js";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-//#region ../components/dist/modal.js
-let modalIdCounter = 0;
-/**
-* @description A modal overlay that requires user interaction before returning to the main content. Controlled via open prop bound to state; use on.openChange with setState (value: false) to close, and a Button on.press with setState (value: true) to open. Must be placed in a parent element's children array to render.
-*/
-const Modal = createComponent(({ props, children, open: controlledOpen, onOpenChange, title, description, actions, trigger }) => {
-	const [internalOpen, setInternalOpen] = useState(false);
-	const open = controlledOpen ?? internalOpen;
-	const setOpen = onOpenChange ?? setInternalOpen;
-	const panelRef = useRef(null);
-	const setOpenRef = useRef(setOpen);
-	setOpenRef.current = setOpen;
-	useEffect(() => {
-		if (!open) return;
-		const handleKeyDown = (e) => {
-			if (e.key === "Escape") setOpenRef.current(false);
-		};
-		document.addEventListener("keydown", handleKeyDown);
-		document.body.style.overflow = "hidden";
-		panelRef.current?.focus();
-		return () => {
-			document.removeEventListener("keydown", handleKeyDown);
-			document.body.style.overflow = "";
-		};
-	}, [open]);
-	return jsxs(Fragment, { children: [trigger && jsx("div", {
-		role: "button",
-		tabIndex: 0,
-		onClick: () => setOpen(true),
-		onKeyDown: (e) => {
-			if (e.key === "Enter" || e.key === " ") setOpen(true);
-		},
-		...props.trigger,
-		children: trigger
-	}), open && jsxs("div", {
-		...props.overlay,
-		children: [jsx("button", {
-			type: "button",
-			"aria-label": "Close modal",
-			tabIndex: -1,
-			onClick: () => setOpen(false),
-			...props.dismiss
-		}), jsxs("div", {
-			ref: panelRef,
-			role: "dialog",
-			"aria-modal": "true",
-			tabIndex: -1,
-			...props.panel,
-			children: [
-				title ? jsx("div", {
-					...props.title,
-					children: title
-				}) : null,
-				description ? jsx("div", {
-					...props.description,
-					children: description
-				}) : null,
-				children ?? null,
-				actions ? jsx("div", {
-					...props.actions,
-					children: actions
-				}) : null
-			]
-		})]
-	})] });
-});
-const [ModalProvider, useModal] = createProvider("Modal", ({ children }) => {
-	const [modals, setModals] = useState([]);
-	const onCloseCallbacks = useRef(/* @__PURE__ */ new Map());
-	const close = useCallback((id) => {
-		setModals((prev) => {
-			if (!id) {
-				const last = prev[prev.length - 1];
-				if (last) {
-					onCloseCallbacks.current.get(last.id)?.();
-					onCloseCallbacks.current.delete(last.id);
-					return prev.slice(0, -1);
-				}
-				return prev;
-			}
-			onCloseCallbacks.current.get(id)?.();
-			onCloseCallbacks.current.delete(id);
-			return prev.filter((m) => m.id !== id);
-		});
-	}, []);
-	const closeAll = useCallback(() => {
-		for (const cb of onCloseCallbacks.current.values()) cb();
-		onCloseCallbacks.current.clear();
-		setModals([]);
-	}, []);
-	return {
-		context: {
-			open: useCallback((content, options) => {
-				const id = `modal-${++modalIdCounter}`;
-				if (options?.onClose) onCloseCallbacks.current.set(id, options.onClose);
-				setModals((prev) => [...prev, {
-					id,
-					content,
-					...options
-				}]);
-				return id;
-			}, []),
-			close,
-			closeAll
-		},
-		render: jsxs(Fragment, { children: [children, modals.map(({ id, content, title, description, actions }) => jsx(Modal, {
-			open: true,
-			onOpenChange: (isOpen) => {
-				if (!isOpen) close(id);
-			},
-			title,
-			description,
-			actions,
-			children: content
-		}, id))] })
-	};
-});
-//#endregion
-export { Modal, ModalProvider, useModal };

package/dist/components/dist/nav-header.config.d.ts

@@ -1,158 +0,0 @@
-import { ComponentConfig } from "../../config/dist/createConfig.js";
-//#region ../components/dist/nav-header.config.d.ts
-declare const navHeaderConfig: ComponentConfig<{
-  NavHeader: {
-    readonly base: {
-      readonly root: {
-        readonly display: "flex";
-        readonly alignItems: "center";
-        readonly justifyContent: "space-between";
-        readonly padding: `${string} ${string}`;
-        readonly borderBottomWidth: string;
-        readonly borderColor: string;
-        readonly backgroundColor: string;
-      };
-      readonly title: {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: "1";
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: "450";
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      } | {
-        readonly color: string;
-        readonly fontSize: string;
-        readonly fontWeight: string;
-        readonly lineHeight: string;
-        readonly fontFamily: string;
-      };
-      readonly actions: {
-        readonly display: "flex";
-        readonly alignItems: "center";
-        readonly gap: string;
-      };
-    };
-  };
-}, {}>;
-type NavHeaderConfig = typeof navHeaderConfig;
-//#endregion
-export { NavHeaderConfig, navHeaderConfig };