npm - @gunkin/uiify - Versions diffs - 0.0.8-alpha → 0.0.10-alpha - Mend

@gunkin/uiify 0.0.8-alpha → 0.0.10-alpha

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (123) hide show

package/dist/components/enhance/sheet-swipe.js ADDED Viewed

@@ -0,0 +1,112 @@
+import { MODAL_DIALOG, isOutside, requestCloseDialog } from "./dialog-dismiss.js";
+import { readBox } from "./internal/read-box.js";
+const SHEET_QUERY = "(width < 40rem)";
+const HANDLE = '[data-uiify-modal][data-part="header"], [data-uiify-modal][data-part="grabber"]';
+const INTERACTIVE = "a, button, input, select, textarea, [contenteditable], [data-no-swipe]";
+const SLOP = 6;
+const DISMISS_RATIO = 0.25;
+const DISMISS_VELOCITY = 0.5;
+const FLING_WINDOW_MS = 80;
+const SWALLOW_MS = 300;
+function swallowNextClick(doc) {
+  const swallow = (event) => {
+    event.stopPropagation();
+    event.preventDefault();
+  };
+  doc.addEventListener("click", swallow, { capture: true, once: true });
+  const timer = setTimeout(() => doc.removeEventListener("click", swallow, true), SWALLOW_MS);
+  return () => {
+    clearTimeout(timer);
+    doc.removeEventListener("click", swallow, true);
+  };
+}
+function attachSheetSwipe(doc = document) {
+  const view = doc.defaultView ?? window;
+  let press = null;
+  let cancelSwallow = null;
+  const startOf = (event) => {
+    const origin = event.target instanceof Element ? event.target : null;
+    const dialog = origin?.closest(MODAL_DIALOG);
+    if (!origin || !dialog || !dialog.open) return null;
+    if (dialog.getAttribute("closedby") === "none" || dialog.getAttribute("data-size") === "full") {
+      return null;
+    }
+    const handle = origin === dialog ? null : origin.closest(HANDLE);
+    const onHandle = handle !== null && handle.closest(MODAL_DIALOG) === dialog && !origin.closest(INTERACTIVE);
+    if (origin !== dialog && !onHandle) return null;
+    if (!view.matchMedia(SHEET_QUERY).matches) return null;
+    const box = readBox(dialog);
+    const onBackdrop = origin === dialog && isOutside(box, event.clientX, event.clientY);
+    return onBackdrop || onHandle ? { dialog, height: box.height } : null;
+  };
+  const onDown = (event) => {
+    if (press || !event.isPrimary) return;
+    if (event.pointerType === "mouse" && event.button !== 0) return;
+    const start = startOf(event);
+    if (!start) return;
+    press = {
+      ...start,
+      dragging: false,
+      lastTime: event.timeStamp,
+      lastY: event.clientY,
+      pointerId: event.pointerId,
+      startY: event.clientY,
+      velocity: 0
+    };
+  };
+  const onMove = (event) => {
+    if (!press || event.pointerId !== press.pointerId) return;
+    const dy = event.clientY - press.startY;
+    if (!press.dragging) {
+      if (dy < SLOP) return;
+      press.dragging = true;
+      press.dialog.setPointerCapture(event.pointerId);
+      press.dialog.setAttribute("data-dragging", "");
+    }
+    const elapsed = event.timeStamp - press.lastTime;
+    if (elapsed > 0) press.velocity = (event.clientY - press.lastY) / elapsed;
+    press.lastY = event.clientY;
+    press.lastTime = event.timeStamp;
+    press.dialog.style.setProperty("--uiify-sheet-offset", `${Math.max(0, dy)}px`);
+  };
+  const onEnd = (event) => {
+    if (!press || event.pointerId !== press.pointerId) return;
+    const { dialog, dragging, height, lastTime, startY, velocity: lastVelocity } = press;
+    press = null;
+    if (!dragging) return;
+    cancelSwallow?.();
+    cancelSwallow = swallowNextClick(doc);
+    if (!dialog.open) {
+      dialog.removeAttribute("data-dragging");
+      dialog.style.removeProperty("--uiify-sheet-offset");
+      return;
+    }
+    const velocity = event.timeStamp - lastTime > FLING_WINDOW_MS ? 0 : lastVelocity;
+    const distance = event.clientY - startY;
+    const dismiss = event.type === "pointerup" && (distance > height * DISMISS_RATIO || velocity > DISMISS_VELOCITY);
+    dialog.removeAttribute("data-dragging");
+    dialog.style.removeProperty("--uiify-sheet-offset");
+    if (dismiss) requestCloseDialog(dialog);
+  };
+  doc.addEventListener("pointerdown", onDown);
+  doc.addEventListener("pointermove", onMove);
+  doc.addEventListener("pointerup", onEnd);
+  doc.addEventListener("pointercancel", onEnd);
+  return () => {
+    doc.removeEventListener("pointerdown", onDown);
+    doc.removeEventListener("pointermove", onMove);
+    doc.removeEventListener("pointerup", onEnd);
+    doc.removeEventListener("pointercancel", onEnd);
+    cancelSwallow?.();
+    if (press) {
+      press.dialog.removeAttribute("data-dragging");
+      press.dialog.style.removeProperty("--uiify-sheet-offset");
+      press = null;
+    }
+  };
+}
+export {
+  SHEET_QUERY,
+  attachSheetSwipe
+};
+//# sourceMappingURL=sheet-swipe.js.map

package/dist/components/enhance/sheet-swipe.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../src/components/enhance/sheet-swipe.ts"],"sourcesContent":["import { MODAL_DIALOG, isOutside, requestCloseDialog } from \"./dialog-dismiss.js\";\nimport { readBox } from \"./internal/read-box.js\";\n\n/** Below this width the modal is a bottom sheet. Keep in sync with the `@media` in modal.css. */\nexport const SHEET_QUERY = \"(width < 40rem)\";\n/** Where a press may start a swipe, besides the backdrop: the modal's own parts only. */\nconst HANDLE = '[data-uiify-modal][data-part=\"header\"], [data-uiify-modal][data-part=\"grabber\"]';\n/** Never start a swipe from these: the press is meant for them. */\nconst INTERACTIVE = \"a, button, input, select, textarea, [contenteditable], [data-no-swipe]\";\n/** Pixels a press must travel down before it becomes a drag; below it the tap reaches `click`. */\nconst SLOP = 6;\n/** Fraction of the sheet height that dismisses on release. */\nconst DISMISS_RATIO = 0.25;\n/** Downward release speed (px per ms) that dismisses regardless of distance. */\nconst DISMISS_VELOCITY = 0.5;\n/** A release this long after the last move is a pause, not a fling: its speed counts as zero. */\nconst FLING_WINDOW_MS = 80;\n/** How long the click that follows a drag is swallowed if it never arrives. */\nconst SWALLOW_MS = 300;\n\ninterface Press {\n readonly dialog: HTMLDialogElement;\n readonly height: number;\n readonly pointerId: number;\n readonly startY: number;\n dragging: boolean;\n lastY: number;\n lastTime: number;\n velocity: number;\n}\n\n/** Swallows the click that ends a drag; returns a function that removes the trap. */\nfunction swallowNextClick(doc: Document): () => void {\n const swallow = (event: Event): void => {\n event.stopPropagation();\n event.preventDefault();\n };\n doc.addEventListener(\"click\", swallow, { capture: true, once: true });\n const timer = setTimeout(() => doc.removeEventListener(\"click\", swallow, true), SWALLOW_MS);\n return () => {\n clearTimeout(timer);\n doc.removeEventListener(\"click\", swallow, true);\n };\n}\n\n/**\n * Swipe-down-to-close for the mobile sheet, driven by pointer events. It only moves the sheet\n * with `data-dragging` and `--uiify-sheet-offset`; the transition back or out is the CSS in\n * modal.css. Optional: without it the sheet still closes by icon, Escape and backdrop tap.\n */\nexport function attachSheetSwipe(doc: Document = document): () => void {\n const view = doc.defaultView ?? window;\n let press: Press | null = null;\n let cancelSwallow: (() => void) | null = null;\n\n const startOf = (event: PointerEvent): { dialog: HTMLDialogElement; height: number } | null => {\n const origin = event.target instanceof Element ? event.target : null;\n const dialog = origin?.closest<HTMLDialogElement>(MODAL_DIALOG);\n if (!origin || !dialog || !dialog.open) return null;\n if (dialog.getAttribute(\"closedby\") === \"none\" || dialog.getAttribute(\"data-size\") === \"full\") {\n return null;\n }\n const handle = origin === dialog ? null : origin.closest(HANDLE);\n const onHandle =\n handle !== null && handle.closest(MODAL_DIALOG) === dialog && !origin.closest(INTERACTIVE);\n // A press in the body or on a control never starts a swipe: skip the layout read for it.\n if (origin !== dialog && !onHandle) return null;\n if (!view.matchMedia(SHEET_QUERY).matches) return null;\n const box = readBox(dialog);\n const onBackdrop = origin === dialog && isOutside(box, event.clientX, event.clientY);\n return onBackdrop || onHandle ? { dialog, height: box.height } : null;\n };\n\n const onDown = (event: PointerEvent): void => {\n if (press || !event.isPrimary) return;\n if (event.pointerType === \"mouse\" && event.button !== 0) return;\n const start = startOf(event);\n if (!start) return;\n press = {\n ...start,\n dragging: false,\n lastTime: event.timeStamp,\n lastY: event.clientY,\n pointerId: event.pointerId,\n startY: event.clientY,\n velocity: 0,\n };\n };\n\n const onMove = (event: PointerEvent): void => {\n if (!press || event.pointerId !== press.pointerId) return;\n const dy = event.clientY - press.startY;\n if (!press.dragging) {\n if (dy < SLOP) return;\n press.dragging = true;\n press.dialog.setPointerCapture(event.pointerId);\n press.dialog.setAttribute(\"data-dragging\", \"\");\n }\n const elapsed = event.timeStamp - press.lastTime;\n if (elapsed > 0) press.velocity = (event.clientY - press.lastY) / elapsed;\n press.lastY = event.clientY;\n press.lastTime = event.timeStamp;\n press.dialog.style.setProperty(\"--uiify-sheet-offset\", `${Math.max(0, dy)}px`);\n };\n\n const onEnd = (event: PointerEvent): void => {\n if (!press || event.pointerId !== press.pointerId) return;\n const { dialog, dragging, height, lastTime, startY, velocity: lastVelocity } = press;\n press = null;\n if (!dragging) return;\n cancelSwallow?.();\n cancelSwallow = swallowNextClick(doc);\n if (!dialog.open) {\n // Closed by other means mid-drag (Escape, a programmatic close): just reset the drag state.\n dialog.removeAttribute(\"data-dragging\");\n dialog.style.removeProperty(\"--uiify-sheet-offset\");\n return;\n }\n const velocity = event.timeStamp - lastTime > FLING_WINDOW_MS ? 0 : lastVelocity;\n const distance = event.clientY - startY;\n const dismiss =\n event.type === \"pointerup\" &&\n (distance > height * DISMISS_RATIO || velocity > DISMISS_VELOCITY);\n // Hand the position back to CSS first: if the dialog closes it slides out from where the\n // finger left it, if a cancel handler vetoes it springs back to the resting position.\n dialog.removeAttribute(\"data-dragging\");\n dialog.style.removeProperty(\"--uiify-sheet-offset\");\n if (dismiss) requestCloseDialog(dialog);\n };\n\n doc.addEventListener(\"pointerdown\", onDown);\n doc.addEventListener(\"pointermove\", onMove);\n doc.addEventListener(\"pointerup\", onEnd);\n doc.addEventListener(\"pointercancel\", onEnd);\n return () => {\n doc.removeEventListener(\"pointerdown\", onDown);\n doc.removeEventListener(\"pointermove\", onMove);\n doc.removeEventListener(\"pointerup\", onEnd);\n doc.removeEventListener(\"pointercancel\", onEnd);\n cancelSwallow?.();\n if (press) {\n press.dialog.removeAttribute(\"data-dragging\");\n press.dialog.style.removeProperty(\"--uiify-sheet-offset\");\n press = null;\n }\n };\n}\n"],"mappings":"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","names":[]}

package/dist/components/file-upload/FileUpload.js CHANGED Viewed

@@ -18,7 +18,7 @@ function FileUploadRootClient(props) {
     maxSize,
     minSize,
     multiple = false,
-    onChange,
+    onValueChange,
     onReject,
     value: controlledValue
   } = props;
@@ -27,7 +27,7 @@ function FileUploadRootClient(props) {
   const [files, setFiles] = useControllableState({
     defaultValue: [...defaultValue],
     ...controlledValue !== void 0 ? { value: [...controlledValue] } : {},
-    ...onChange ? { onChange } : {}
+    ...onValueChange ? { onChange: onValueChange } : {}
   });
   const storeRef = useRef(null);
   storeRef.current ??= createFileUploadStore(files);

package/dist/components/file-upload/FileUpload.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/file-upload/FileUpload.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useRef, useSyncExternalStore } from \"react\";\nimport type { ElementType, DragEvent, ReactElement, SyntheticEvent } from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { createFileUploadStore, validateFiles } from \"./file-upload-store.js\";\nimport type {\n FileUploadStore,\n FileUploadContextValue,\n FileUploadRootProps,\n FileUploadHiddenInputOwnProps,\n FileUploadTriggerProps,\n FileUploadDropzoneProps,\n FileUploadListOwnProps,\n FileUploadItemProps,\n FileUploadItemRemoveOwnProps,\n} from \"./types.js\";\n\nconst [FileUploadProvider, useFileUploadContext] =\n createPartContext<FileUploadContextValue>(\"FileUpload\");\n\nexport function FileUploadRootClient(props: FileUploadRootProps): ReactElement \| null {\n const {\n accept = [],\n className,\n children,\n defaultValue = [],\n disabled = false,\n maxFiles,\n maxSize,\n minSize,\n multiple = false,\n onChange,\n onReject,\n value: controlledValue,\n } = props;\n\n const inputId = useId();\n const hiddenInputRef = useRef<HTMLInputElement \| null>(null);\n const [files, setFiles] = useControllableState<File[]>({\n defaultValue: [...defaultValue],\n ...(controlledValue !== undefined ? { value: [...controlledValue] } : {}),\n ...(onChange ? { onChange } : {}),\n });\n\n const storeRef = useRef<FileUploadStore \| null>(null);\n storeRef.current ??= createFileUploadStore(files);\n const store = storeRef.current;\n\n const processFiles = useCallback(\n (list: FileList \| readonly File[]) => {\n if (disabled) return;\n const incoming = Array.from(list);\n const { accepted, rejected } = validateFiles(incoming, {\n accept,\n multiple,\n ...(maxFiles !== undefined ? { maxFiles } : {}),\n ...(maxSize !== undefined ? { maxSize } : {}),\n ...(minSize !== undefined ? { minSize } : {}),\n });\n if (rejected.length > 0) onReject?.(rejected);\n if (accepted.length === 0) return;\n const next = multiple ? [...store.getFiles(), ...accepted] : accepted;\n store.setFiles(next);\n setFiles(next);\n },\n [accept, disabled, maxFiles, maxSize, minSize, multiple, onReject, setFiles, store],\n );\n\n const openPicker = useCallback(() => {\n hiddenInputRef.current?.click();\n }, []);\n\n const removeAt = useCallback(\n (index: number) => {\n store.removeAt(index);\n setFiles(store.getFiles());\n },\n [setFiles, store],\n );\n\n const contextValue = useMemo(\n () => ({\n accept,\n disabled,\n hiddenInputRef,\n inputId,\n multiple,\n openPicker,\n processFiles,\n removeAt,\n store,\n }),\n [accept, disabled, inputId, multiple, openPicker, processFiles, removeAt, store],\n );\n\n return (\n <div className={className} data-uiify-file-upload=\"\">\n <FileUploadProvider value={contextValue}>{children}</FileUploadProvider>\n </div>\n );\n}\nFileUploadRootClient.displayName = \"FileUploadRootClient\";\n\nexport const FileUploadRoot = FileUploadRootClient;\n\nexport function FileUploadHiddenInput(props: FileUploadHiddenInputOwnProps): ReactElement \| null {\n const { className } = props;\n const { accept, disabled, hiddenInputRef, inputId, multiple, processFiles } =\n useFileUploadContext(\"HiddenInput\");\n\n return useRenderElement({\n defaultTag: \"input\",\n props: {\n ref: hiddenInputRef,\n id: inputId,\n type: \"file\",\n \"data-part\": \"input\",\n tabIndex: -1,\n accept: accept.length > 0 ? accept.join(\",\") : undefined,\n multiple: multiple \|\| undefined,\n style: {\n border: 0,\n clip: \"rect(0 0 0 0)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: 0,\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n disabled: disabled \|\| undefined,\n ...(className ? { className } : {}),\n onChange(event: SyntheticEvent<HTMLInputElement>) {\n const list = event.currentTarget.files;\n if (list) processFiles(list);\n event.currentTarget.value = \"\";\n },\n },\n state: { disabled },\n });\n}\n\nexport function FileUploadTrigger<TAs extends ElementType = \"label\">(\n props: FileUploadTriggerProps<TAs>,\n): ReactElement \| null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadTriggerProps<ElementType>;\n const { disabled, inputId, openPicker } = useFileUploadContext(\"Trigger\");\n const tag = typeof as === \"string\" ? as : undefined;\n const { onClick: consumerOnClick } = consumerProps as {\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n };\n const interactiveProps =\n tag === \"button\"\n ? {\n type: \"button\" as const,\n \"aria-controls\": inputId,\n disabled: disabled \|\| undefined,\n onClick: composeEventHandlers(consumerOnClick, openPicker),\n }\n : {\n htmlFor: inputId,\n \"aria-controls\": inputId,\n };\n\n return useRenderElement({\n as,\n defaultTag: \"label\",\n props: {\n ...consumerProps,\n ...interactiveProps,\n \"data-part\": \"trigger\",\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadDropzone<TAs extends ElementType = \"div\">(\n props: FileUploadDropzoneProps<TAs>,\n): ReactElement \| null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadDropzoneProps<\"div\">;\n const { disabled, processFiles } = useFileUploadContext(\"Dropzone\");\n const { onDragOver: consumerOnDragOver, onDrop: consumerOnDrop } = consumerProps as {\n onDragOver?: (event: DragEvent<HTMLElement>) => void;\n onDrop?: (event: DragEvent<HTMLElement>) => void;\n };\n\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n role: \"region\",\n \"data-part\": \"dropzone\",\n \"aria-label\": \"Drop files here\",\n \"data-disabled\": disabled ? \"\" : undefined,\n onDragOver: composeEventHandlers(consumerOnDragOver, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n }),\n onDrop: composeEventHandlers(consumerOnDrop, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n if (disabled) return;\n processFiles(event.dataTransfer.files);\n }),\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadList(props: FileUploadListOwnProps): ReactElement \| null {\n const { children, className } = props;\n return useRenderElement({\n defaultTag: \"ul\",\n props: { role: \"list\", \"data-part\": \"list\", ...(className ? { className } : {}), children },\n state: {},\n });\n}\n\nexport function FileUploadItem<TAs extends ElementType = \"li\">(\n props: FileUploadItemProps<TAs>,\n): ReactElement \| null {\n const { as, render, children, className, index, ...consumerProps } =\n props as FileUploadItemProps<\"li\">;\n const { store } = useFileUploadContext(\"Item\");\n const files = useSyncExternalStore(store.subscribe, store.getFiles, store.getFiles);\n const file = files[index];\n\n const element = useRenderElement({\n as,\n defaultTag: \"li\",\n props: {\n ...consumerProps,\n role: \"listitem\",\n \"data-part\": \"item\",\n \"data-name\": file?.name,\n ...(className ? { className } : {}),\n children: children ?? file?.name,\n },\n render,\n state: { index },\n });\n\n if (!file) return null;\n return element;\n}\n\nexport function FileUploadItemRemove(props: FileUploadItemRemoveOwnProps): ReactElement \| null {\n const { className, index } = props;\n const { disabled, removeAt } = useFileUploadContext(\"ItemRemove\");\n\n return useRenderElement({\n defaultTag: \"button\",\n props: {\n type: \"button\",\n \"aria-label\": \"Remove file\",\n \"data-part\": \"remove\",\n disabled: disabled \|\| undefined,\n ...(className ? { className } : {}),\n onClick: () => removeAt(index),\n },\n state: { disabled },\n });\n}\n\nexport const FileUpload = {\n Dropzone: FileUploadDropzone,\n HiddenInput: FileUploadHiddenInput,\n Item: FileUploadItem,\n ItemRemove: FileUploadItemRemove,\n List: FileUploadList,\n Root: FileUploadRoot,\n Trigger: FileUploadTrigger,\n};\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../src/components/file-upload/FileUpload.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useRef, useSyncExternalStore } from \"react\";\nimport type { ElementType, DragEvent, ReactElement, SyntheticEvent } from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { createFileUploadStore, validateFiles } from \"./file-upload-store.js\";\nimport type {\n FileUploadStore,\n FileUploadContextValue,\n FileUploadRootProps,\n FileUploadHiddenInputOwnProps,\n FileUploadTriggerProps,\n FileUploadDropzoneProps,\n FileUploadListOwnProps,\n FileUploadItemProps,\n FileUploadItemRemoveOwnProps,\n} from \"./types.js\";\n\nconst [FileUploadProvider, useFileUploadContext] =\n createPartContext<FileUploadContextValue>(\"FileUpload\");\n\nexport function FileUploadRootClient(props: FileUploadRootProps): ReactElement \| null {\n const {\n accept = [],\n className,\n children,\n defaultValue = [],\n disabled = false,\n maxFiles,\n maxSize,\n minSize,\n multiple = false,\n onValueChange,\n onReject,\n value: controlledValue,\n } = props;\n\n const inputId = useId();\n const hiddenInputRef = useRef<HTMLInputElement \| null>(null);\n const [files, setFiles] = useControllableState<File[]>({\n defaultValue: [...defaultValue],\n ...(controlledValue !== undefined ? { value: [...controlledValue] } : {}),\n ...(onValueChange ? { onChange: onValueChange } : {}),\n });\n\n const storeRef = useRef<FileUploadStore \| null>(null);\n storeRef.current ??= createFileUploadStore(files);\n const store = storeRef.current;\n\n const processFiles = useCallback(\n (list: FileList \| readonly File[]) => {\n if (disabled) return;\n const incoming = Array.from(list);\n const { accepted, rejected } = validateFiles(incoming, {\n accept,\n multiple,\n ...(maxFiles !== undefined ? { maxFiles } : {}),\n ...(maxSize !== undefined ? { maxSize } : {}),\n ...(minSize !== undefined ? { minSize } : {}),\n });\n if (rejected.length > 0) onReject?.(rejected);\n if (accepted.length === 0) return;\n const next = multiple ? [...store.getFiles(), ...accepted] : accepted;\n store.setFiles(next);\n setFiles(next);\n },\n [accept, disabled, maxFiles, maxSize, minSize, multiple, onReject, setFiles, store],\n );\n\n const openPicker = useCallback(() => {\n hiddenInputRef.current?.click();\n }, []);\n\n const removeAt = useCallback(\n (index: number) => {\n store.removeAt(index);\n setFiles(store.getFiles());\n },\n [setFiles, store],\n );\n\n const contextValue = useMemo(\n () => ({\n accept,\n disabled,\n hiddenInputRef,\n inputId,\n multiple,\n openPicker,\n processFiles,\n removeAt,\n store,\n }),\n [accept, disabled, inputId, multiple, openPicker, processFiles, removeAt, store],\n );\n\n return (\n <div className={className} data-uiify-file-upload=\"\">\n <FileUploadProvider value={contextValue}>{children}</FileUploadProvider>\n </div>\n );\n}\nFileUploadRootClient.displayName = \"FileUploadRootClient\";\n\nexport const FileUploadRoot = FileUploadRootClient;\n\nexport function FileUploadHiddenInput(props: FileUploadHiddenInputOwnProps): ReactElement \| null {\n const { className } = props;\n const { accept, disabled, hiddenInputRef, inputId, multiple, processFiles } =\n useFileUploadContext(\"HiddenInput\");\n\n return useRenderElement({\n defaultTag: \"input\",\n props: {\n ref: hiddenInputRef,\n id: inputId,\n type: \"file\",\n \"data-part\": \"input\",\n tabIndex: -1,\n accept: accept.length > 0 ? accept.join(\",\") : undefined,\n multiple: multiple \|\| undefined,\n style: {\n border: 0,\n clip: \"rect(0 0 0 0)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: 0,\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n disabled: disabled \|\| undefined,\n ...(className ? { className } : {}),\n onChange(event: SyntheticEvent<HTMLInputElement>) {\n const list = event.currentTarget.files;\n if (list) processFiles(list);\n event.currentTarget.value = \"\";\n },\n },\n state: { disabled },\n });\n}\n\nexport function FileUploadTrigger<TAs extends ElementType = \"label\">(\n props: FileUploadTriggerProps<TAs>,\n): ReactElement \| null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadTriggerProps<ElementType>;\n const { disabled, inputId, openPicker } = useFileUploadContext(\"Trigger\");\n const tag = typeof as === \"string\" ? as : undefined;\n const { onClick: consumerOnClick } = consumerProps as {\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n };\n const interactiveProps =\n tag === \"button\"\n ? {\n type: \"button\" as const,\n \"aria-controls\": inputId,\n disabled: disabled \|\| undefined,\n onClick: composeEventHandlers(consumerOnClick, openPicker),\n }\n : {\n htmlFor: inputId,\n \"aria-controls\": inputId,\n };\n\n return useRenderElement({\n as,\n defaultTag: \"label\",\n props: {\n ...consumerProps,\n ...interactiveProps,\n \"data-part\": \"trigger\",\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadDropzone<TAs extends ElementType = \"div\">(\n props: FileUploadDropzoneProps<TAs>,\n): ReactElement \| null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadDropzoneProps<\"div\">;\n const { disabled, processFiles } = useFileUploadContext(\"Dropzone\");\n const { onDragOver: consumerOnDragOver, onDrop: consumerOnDrop } = consumerProps as {\n onDragOver?: (event: DragEvent<HTMLElement>) => void;\n onDrop?: (event: DragEvent<HTMLElement>) => void;\n };\n\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n role: \"region\",\n \"data-part\": \"dropzone\",\n \"aria-label\": \"Drop files here\",\n \"data-disabled\": disabled ? \"\" : undefined,\n onDragOver: composeEventHandlers(consumerOnDragOver, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n }),\n onDrop: composeEventHandlers(consumerOnDrop, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n if (disabled) return;\n processFiles(event.dataTransfer.files);\n }),\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadList(props: FileUploadListOwnProps): ReactElement \| null {\n const { children, className } = props;\n return useRenderElement({\n defaultTag: \"ul\",\n props: { role: \"list\", \"data-part\": \"list\", ...(className ? { className } : {}), children },\n state: {},\n });\n}\n\nexport function FileUploadItem<TAs extends ElementType = \"li\">(\n props: FileUploadItemProps<TAs>,\n): ReactElement \| null {\n const { as, render, children, className, index, ...consumerProps } =\n props as FileUploadItemProps<\"li\">;\n const { store } = useFileUploadContext(\"Item\");\n const files = useSyncExternalStore(store.subscribe, store.getFiles, store.getFiles);\n const file = files[index];\n\n const element = useRenderElement({\n as,\n defaultTag: \"li\",\n props: {\n ...consumerProps,\n role: \"listitem\",\n \"data-part\": \"item\",\n \"data-name\": file?.name,\n ...(className ? { className } : {}),\n children: children ?? file?.name,\n },\n render,\n state: { index },\n });\n\n if (!file) return null;\n return element;\n}\n\nexport function FileUploadItemRemove(props: FileUploadItemRemoveOwnProps): ReactElement \| null {\n const { className, index } = props;\n const { disabled, removeAt } = useFileUploadContext(\"ItemRemove\");\n\n return useRenderElement({\n defaultTag: \"button\",\n props: {\n type: \"button\",\n \"aria-label\": \"Remove file\",\n \"data-part\": \"remove\",\n disabled: disabled \|\| undefined,\n ...(className ? { className } : {}),\n onClick: () => removeAt(index),\n },\n state: { disabled },\n });\n}\n\nexport const FileUpload = {\n Dropzone: FileUploadDropzone,\n HiddenInput: FileUploadHiddenInput,\n Item: FileUploadItem,\n ItemRemove: FileUploadItemRemove,\n List: FileUploadList,\n Root: FileUploadRoot,\n Trigger: FileUploadTrigger,\n};\n"],"mappings":"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","names":[]}

package/dist/components/file-upload/types.d.ts CHANGED Viewed

@@ -39,7 +39,7 @@ export interface FileUploadRootOwnProps {
     readonly maxSize?: number;
     readonly minSize?: number;
     readonly multiple?: boolean;
-    readonly onChange?: (files: File[]) => void;
+    readonly onValueChange?: (files: File[]) => void;
     readonly onReject?: (rejections: FileRejection[]) => void;
     readonly value?: readonly File[];
 }

package/dist/components/file-upload/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC;CACtD;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACpC,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,EAAE,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,IAAI,CAAC;CAC1D;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;IACnC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,cAAc,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,UAAU,EAAE,MAAM,IAAI,CAAC;IAChC,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,GAAG,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IAClE,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC;CACjC;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACpC,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,IAAI,EAAE,CAAC;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,~~QAAQ~~,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;~~IAC5C~~,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC1D,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,IAAI,EAAE,CAAC;CAClC;AAED,MAAM,WAAW,mBAAoB,SAAQ,sBAAsB;IACjE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;CAC/B;AAED,MAAM,WAAW,6BAA6B;IAC5C,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,yBAAyB;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,sBAAsB,CAAC,GAAG,SAAS,WAAW,GAAG,OAAO,IAAI,eAAe,CACrF,GAAG,EACH,yBAAyB,EACzB;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,WAAW,0BAA0B;IACzC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,uBAAuB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CACpF,GAAG,EACH,0BAA0B,EAC1B;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,mBAAmB,CAAC,GAAG,SAAS,WAAW,GAAG,IAAI,IAAI,eAAe,CAC/E,GAAG,EACH,sBAAsB,EACtB;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,EACjB,WAAW,CACZ,CAAC;AAEF,MAAM,WAAW,4BAA4B;IAC3C,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB"}
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC;CACtD;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACpC,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,EAAE,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,IAAI,CAAC;CAC1D;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;IACnC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,cAAc,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,UAAU,EAAE,MAAM,IAAI,CAAC;IAChC,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,GAAG,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IAClE,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC;CACjC;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACpC,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,IAAI,EAAE,CAAC;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC1D,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,IAAI,EAAE,CAAC;CAClC;AAED,MAAM,WAAW,mBAAoB,SAAQ,sBAAsB;IACjE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;CAC/B;AAED,MAAM,WAAW,6BAA6B;IAC5C,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,yBAAyB;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,sBAAsB,CAAC,GAAG,SAAS,WAAW,GAAG,OAAO,IAAI,eAAe,CACrF,GAAG,EACH,yBAAyB,EACzB;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,WAAW,0BAA0B;IACzC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,uBAAuB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CACpF,GAAG,EACH,0BAA0B,EAC1B;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,mBAAmB,CAAC,GAAG,SAAS,WAAW,GAAG,IAAI,IAAI,eAAe,CAC/E,GAAG,EACH,sBAAsB,EACtB;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,EACjB,WAAW,CACZ,CAAC;AAEF,MAAM,WAAW,4BAA4B;IAC3C,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB"}

package/dist/components/header/Header.js CHANGED Viewed

@@ -91,7 +91,7 @@ function HeaderRoot(props) {
       "data-hidden": hiddenProp ? "" : void 0,
       "data-lock-scroll": lockScroll && header.open && isDrawerMode(mobileMode) ? "" : void 0,
       "data-mobile-mode": mobileMode,
-      "data-open": header.open ? "" : void 0,
+      "data-state": header.open ? "open" : "closed",
       "data-placement": placement,
       "data-scrolled": scrolledProp ? "" : void 0,
       children
@@ -176,7 +176,7 @@ function HeaderMobileNav(props) {
       ...consumerProps,
       ...getMobileNavProps({
         "data-mobile-mode": mobileMode,
-        "data-open": open ? "" : void 0,
+        "data-state": open ? "open" : "closed",
         onClick
       }),
       children
@@ -190,7 +190,7 @@ function HeaderMobileNav(props) {
       ...getMobileNavProps({
         "aria-hidden": open ? void 0 : true,
         "data-mobile-mode": mobileMode,
-        "data-open": open ? "" : void 0,
+        "data-state": open ? "open" : "closed",
         hidden: open ? void 0 : true,
         onClick
       }),

package/dist/components/header/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/header/Header.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n useCallback,\n useMemo,\n useRef,\n type MouseEvent,\n type ReactElement,\n type SyntheticEvent,\n} from \"react\";\nimport { useIsomorphicLayoutEffect, useMergedRefs } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { Drawer } from \"../drawer/Drawer.js\";\nimport type { DrawerSide } from \"../drawer/types.js\";\nimport { useHeader } from \"./use-header.js\";\nimport { useHeaderScrollState } from \"./use-header-scroll-state.js\";\nimport type {\n HeaderMobileMode,\n HeaderRootProps,\n HeaderContextValue,\n HeaderToggleProps,\n HeaderMobileNavProps,\n HeaderCloseProps,\n} from \"./types.js\";\n\nexport type {\n HeaderBehavior,\n HeaderCloseProps,\n HeaderMobileNavProps,\n HeaderMobileMode,\n HeaderPlacement,\n HeaderRootProps,\n HeaderToggleProps,\n UseHeaderOptions,\n UseHeaderReturn,\n UseHeaderScrollStateOptions,\n UseHeaderScrollStateReturn,\n} from \"./types.js\";\n\nconst [HeaderProvider, useHeaderContext] = createPartContext<HeaderContextValue>(\"Header\");\n\nfunction isDrawerMode(mobileMode: HeaderMobileMode): boolean {\n return mobileMode === \"drawer\" \|\| mobileMode === \"sheet\" \|\| mobileMode === \"fullscreen\";\n}\n\nfunction drawerSide(mobileMode: HeaderMobileMode): DrawerSide {\n if (mobileMode === \"sheet\") return \"bottom\";\n return \"left\";\n}\n\nfunction defaultModal(mobileMode: HeaderMobileMode): boolean {\n return isDrawerMode(mobileMode);\n}\n\nfunction defaultLockScroll(mobileMode: HeaderMobileMode, modal: boolean): boolean {\n return isDrawerMode(mobileMode) && modal;\n}\n\nfunction defaultCloseOnSelect(mobileMode: HeaderMobileMode): boolean {\n return mobileMode !== \"none\";\n}\n\nfunction handleCloseOnSelect(\n event: SyntheticEvent<HTMLElement>,\n closeOnSelect: boolean,\n close: () => void,\n): void {\n if (!closeOnSelect) return;\n const target = event.target;\n if (!(target instanceof Element)) return;\n const activator = target.closest(\"a[href], button:not([disabled])\");\n if (!activator \|\| !event.currentTarget.contains(activator)) return;\n close();\n}\n\nexport function HeaderRoot(props: HeaderRootProps): ReactElement \| null {\n const {\n behavior = \"none\",\n children,\n closeOnSelect: closeOnSelectProp,\n defaultOpen,\n hidden: hiddenProp,\n lockScroll: lockScrollProp,\n mobileMode = \"none\",\n modal: modalProp,\n onOpenChange,\n open,\n placement = \"static\",\n scrolled: scrolledProp,\n ...consumerProps\n } = props;\n\n const modal = modalProp ?? defaultModal(mobileMode);\n const lockScroll = lockScrollProp ?? defaultLockScroll(mobileMode, modal);\n const closeOnSelect = closeOnSelectProp ?? defaultCloseOnSelect(mobileMode);\n const toggleRef = useRef<HTMLButtonElement \| null>(null);\n const wasOpenRef = useRef(false);\n\n const header = useHeader({\n closeOnSelect,\n mobileMode,\n ...(defaultOpen !== undefined ? { defaultOpen } : {}),\n ...(onOpenChange ? { onOpenChange } : {}),\n ...(open !== undefined ? { open } : {}),\n });\n\n useIsomorphicLayoutEffect(() => {\n if (wasOpenRef.current && !header.open && isDrawerMode(mobileMode)) {\n queueMicrotask(() => toggleRef.current?.focus({ preventScroll: true }));\n }\n wasOpenRef.current = header.open;\n }, [header.open, mobileMode]);\n\n const contextValue = useMemo<HeaderContextValue>(\n () => ({\n ...header,\n behavior,\n hidden: hiddenProp ?? false,\n lockScroll,\n modal,\n placement,\n scrolled: scrolledProp ?? false,\n toggleRef,\n }),\n [behavior, header, hiddenProp, lockScroll, modal, placement, scrolledProp],\n );\n\n const rootElement = useRenderElement({\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n \"data-behavior\": behavior,\n \"data-hidden\": hiddenProp ? \"\" : undefined,\n \"data-lock-scroll\": lockScroll && header.open && isDrawerMode(mobileMode) ? \"\" : undefined,\n \"data-mobile-mode\": mobileMode,\n \"data-open\": header.open ? \"\" : undefined,\n \"data-placement\": placement,\n \"data-scrolled\": scrolledProp ? \"\" : undefined,\n children,\n },\n state: {\n open: header.open,\n placement,\n behavior,\n mobileMode,\n scrolled: scrolledProp ?? false,\n hidden: hiddenProp ?? false,\n },\n });\n\n const tree = <HeaderProvider value={contextValue}>{rootElement}</HeaderProvider>;\n\n if (isDrawerMode(mobileMode)) {\n return (\n <Drawer.Root\n modal={modal}\n onOpenChange={header.setOpen}\n open={header.open}\n side={drawerSide(mobileMode)}\n >\n {tree}\n </Drawer.Root>\n );\n }\n\n return tree;\n}\nHeaderRoot.displayName = \"HeaderRoot\";\n\nexport function HeaderToggle(props: HeaderToggleProps): ReactElement \| null {\n const {\n closeLabel = \"Close navigation\",\n openLabel = \"Open navigation\",\n ref,\n onClick,\n ...consumerProps\n } = props;\n const { getToggleProps, mobileMode, open, toggle, toggleRef } = useHeaderContext(\"Toggle\");\n const mergedRef = useMergedRefs(toggleRef, ref);\n const dialogMode = isDrawerMode(mobileMode);\n\n const toggleProps = getToggleProps({\n type: \"button\",\n \"aria-haspopup\": dialogMode ? \"dialog\" : undefined,\n \"aria-label\": open ? closeLabel : openLabel,\n onClick(event: MouseEvent<HTMLButtonElement>) {\n toggle();\n onClick?.(event);\n },\n });\n\n return useRenderElement({\n defaultTag: \"button\",\n props: {\n ...consumerProps,\n ref: mergedRef,\n ...toggleProps,\n },\n state: { open },\n });\n}\n\nexport function HeaderMobileNav(props: HeaderMobileNavProps): ReactElement \| null {\n const { children, forceMount, onClick: consumerOnClick, ...consumerProps } = props;\n const { close, closeOnSelect, getMobileNavProps, mobileMode, open } =\n useHeaderContext(\"MobileNav\");\n\n const onClick = useCallback(\n (event: SyntheticEvent<HTMLElement>) => {\n handleCloseOnSelect(event, closeOnSelect, close);\n consumerOnClick?.(event as React.MouseEvent<HTMLElement>);\n },\n [close, closeOnSelect, consumerOnClick],\n );\n\n const noneNav = useRenderElement({\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n ...getMobileNavProps({ onClick }),\n children,\n },\n state: { open },\n });\n\n const drawerNav = useRenderElement({\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n ...getMobileNavProps({\n \"data-mobile-mode\": mobileMode,\n \"data-open\": open ? \"\" : undefined,\n onClick,\n }),\n children,\n },\n state: { open, mobileMode },\n });\n\n const collapseNav = useRenderElement({\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n ...getMobileNavProps({\n \"aria-hidden\": open ? undefined : true,\n \"data-mobile-mode\": mobileMode,\n \"data-open\": open ? \"\" : undefined,\n hidden: open ? undefined : true,\n onClick,\n }),\n children,\n },\n state: { open, mobileMode },\n });\n\n if (mobileMode === \"none\") {\n return noneNav;\n }\n\n if (mobileMode === \"collapse\") {\n if (!open && !forceMount) {\n return null;\n }\n\n return collapseNav;\n }\n\n return <Drawer.Content>{drawerNav}</Drawer.Content>;\n}\nHeaderMobileNav.displayName = \"HeaderMobileNav\";\n\nexport function HeaderClose(props: HeaderCloseProps): ReactElement \| null {\n const { children, className, onClick, ...consumerProps } = props;\n const { close, mobileMode } = useHeaderContext(\"Close\");\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n close();\n onClick?.(event);\n };\n\n const closeButton = useRenderElement({\n defaultTag: \"button\",\n props: {\n ...consumerProps,\n type: \"button\",\n onClick: handleClick,\n ...(className !== undefined ? { className } : {}),\n children,\n },\n state: {},\n });\n\n if (isDrawerMode(mobileMode)) {\n return (\n <Drawer.Close\n {...consumerProps}\n {...(className !== undefined ? { className } : {})}\n {...(onClick !== undefined ? { onClick } : {})}\n >\n {children}\n </Drawer.Close>\n );\n }\n\n return closeButton;\n}\nHeaderClose.displayName = \"HeaderClose\";\n\nexport const Header = {\n Close: HeaderClose,\n MobileNav: HeaderMobileNav,\n Root: HeaderRoot,\n Toggle: HeaderToggle,\n};\n\nexport { useHeader, useHeaderScrollState };\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../src/components/header/Header.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n useCallback,\n useMemo,\n useRef,\n type MouseEvent,\n type ReactElement,\n type SyntheticEvent,\n} from \"react\";\nimport { useIsomorphicLayoutEffect, useMergedRefs } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { Drawer } from \"../drawer/Drawer.js\";\nimport type { DrawerSide } from \"../drawer/types.js\";\nimport { useHeader } from \"./use-header.js\";\nimport { useHeaderScrollState } from \"./use-header-scroll-state.js\";\nimport type {\n HeaderMobileMode,\n HeaderRootProps,\n HeaderContextValue,\n HeaderToggleProps,\n HeaderMobileNavProps,\n HeaderCloseProps,\n} from \"./types.js\";\n\nexport type {\n HeaderBehavior,\n HeaderCloseProps,\n HeaderMobileNavProps,\n HeaderMobileMode,\n HeaderPlacement,\n HeaderRootProps,\n HeaderToggleProps,\n UseHeaderOptions,\n UseHeaderReturn,\n UseHeaderScrollStateOptions,\n UseHeaderScrollStateReturn,\n} from \"./types.js\";\n\nconst [HeaderProvider, useHeaderContext] = createPartContext<HeaderContextValue>(\"Header\");\n\nfunction isDrawerMode(mobileMode: HeaderMobileMode): boolean {\n return mobileMode === \"drawer\" \|\| mobileMode === \"sheet\" \|\| mobileMode === \"fullscreen\";\n}\n\nfunction drawerSide(mobileMode: HeaderMobileMode): DrawerSide {\n if (mobileMode === \"sheet\") return \"bottom\";\n return \"left\";\n}\n\nfunction defaultModal(mobileMode: HeaderMobileMode): boolean {\n return isDrawerMode(mobileMode);\n}\n\nfunction defaultLockScroll(mobileMode: HeaderMobileMode, modal: boolean): boolean {\n return isDrawerMode(mobileMode) && modal;\n}\n\nfunction defaultCloseOnSelect(mobileMode: HeaderMobileMode): boolean {\n return mobileMode !== \"none\";\n}\n\nfunction handleCloseOnSelect(\n event: SyntheticEvent<HTMLElement>,\n closeOnSelect: boolean,\n close: () => void,\n): void {\n if (!closeOnSelect) return;\n const target = event.target;\n if (!(target instanceof Element)) return;\n const activator = target.closest(\"a[href], button:not([disabled])\");\n if (!activator \|\| !event.currentTarget.contains(activator)) return;\n close();\n}\n\nexport function HeaderRoot(props: HeaderRootProps): ReactElement \| null {\n const {\n behavior = \"none\",\n children,\n closeOnSelect: closeOnSelectProp,\n defaultOpen,\n hidden: hiddenProp,\n lockScroll: lockScrollProp,\n mobileMode = \"none\",\n modal: modalProp,\n onOpenChange,\n open,\n placement = \"static\",\n scrolled: scrolledProp,\n ...consumerProps\n } = props;\n\n const modal = modalProp ?? defaultModal(mobileMode);\n const lockScroll = lockScrollProp ?? defaultLockScroll(mobileMode, modal);\n const closeOnSelect = closeOnSelectProp ?? defaultCloseOnSelect(mobileMode);\n const toggleRef = useRef<HTMLButtonElement \| null>(null);\n const wasOpenRef = useRef(false);\n\n const header = useHeader({\n closeOnSelect,\n mobileMode,\n ...(defaultOpen !== undefined ? { defaultOpen } : {}),\n ...(onOpenChange ? { onOpenChange } : {}),\n ...(open !== undefined ? { open } : {}),\n });\n\n useIsomorphicLayoutEffect(() => {\n if (wasOpenRef.current && !header.open && isDrawerMode(mobileMode)) {\n queueMicrotask(() => toggleRef.current?.focus({ preventScroll: true }));\n }\n wasOpenRef.current = header.open;\n }, [header.open, mobileMode]);\n\n const contextValue = useMemo<HeaderContextValue>(\n () => ({\n ...header,\n behavior,\n hidden: hiddenProp ?? false,\n lockScroll,\n modal,\n placement,\n scrolled: scrolledProp ?? false,\n toggleRef,\n }),\n [behavior, header, hiddenProp, lockScroll, modal, placement, scrolledProp],\n );\n\n const rootElement = useRenderElement({\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n \"data-behavior\": behavior,\n \"data-hidden\": hiddenProp ? \"\" : undefined,\n \"data-lock-scroll\": lockScroll && header.open && isDrawerMode(mobileMode) ? \"\" : undefined,\n \"data-mobile-mode\": mobileMode,\n \"data-state\": header.open ? \"open\" : \"closed\",\n \"data-placement\": placement,\n \"data-scrolled\": scrolledProp ? \"\" : undefined,\n children,\n },\n state: {\n open: header.open,\n placement,\n behavior,\n mobileMode,\n scrolled: scrolledProp ?? false,\n hidden: hiddenProp ?? false,\n },\n });\n\n const tree = <HeaderProvider value={contextValue}>{rootElement}</HeaderProvider>;\n\n if (isDrawerMode(mobileMode)) {\n return (\n <Drawer.Root\n modal={modal}\n onOpenChange={header.setOpen}\n open={header.open}\n side={drawerSide(mobileMode)}\n >\n {tree}\n </Drawer.Root>\n );\n }\n\n return tree;\n}\nHeaderRoot.displayName = \"HeaderRoot\";\n\nexport function HeaderToggle(props: HeaderToggleProps): ReactElement \| null {\n const {\n closeLabel = \"Close navigation\",\n openLabel = \"Open navigation\",\n ref,\n onClick,\n ...consumerProps\n } = props;\n const { getToggleProps, mobileMode, open, toggle, toggleRef } = useHeaderContext(\"Toggle\");\n const mergedRef = useMergedRefs(toggleRef, ref);\n const dialogMode = isDrawerMode(mobileMode);\n\n const toggleProps = getToggleProps({\n type: \"button\",\n \"aria-haspopup\": dialogMode ? \"dialog\" : undefined,\n \"aria-label\": open ? closeLabel : openLabel,\n onClick(event: MouseEvent<HTMLButtonElement>) {\n toggle();\n onClick?.(event);\n },\n });\n\n return useRenderElement({\n defaultTag: \"button\",\n props: {\n ...consumerProps,\n ref: mergedRef,\n ...toggleProps,\n },\n state: { open },\n });\n}\n\nexport function HeaderMobileNav(props: HeaderMobileNavProps): ReactElement \| null {\n const { children, forceMount, onClick: consumerOnClick, ...consumerProps } = props;\n const { close, closeOnSelect, getMobileNavProps, mobileMode, open } =\n useHeaderContext(\"MobileNav\");\n\n const onClick = useCallback(\n (event: SyntheticEvent<HTMLElement>) => {\n handleCloseOnSelect(event, closeOnSelect, close);\n consumerOnClick?.(event as React.MouseEvent<HTMLElement>);\n },\n [close, closeOnSelect, consumerOnClick],\n );\n\n const noneNav = useRenderElement({\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n ...getMobileNavProps({ onClick }),\n children,\n },\n state: { open },\n });\n\n const drawerNav = useRenderElement({\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n ...getMobileNavProps({\n \"data-mobile-mode\": mobileMode,\n \"data-state\": open ? \"open\" : \"closed\",\n onClick,\n }),\n children,\n },\n state: { open, mobileMode },\n });\n\n const collapseNav = useRenderElement({\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n ...getMobileNavProps({\n \"aria-hidden\": open ? undefined : true,\n \"data-mobile-mode\": mobileMode,\n \"data-state\": open ? \"open\" : \"closed\",\n hidden: open ? undefined : true,\n onClick,\n }),\n children,\n },\n state: { open, mobileMode },\n });\n\n if (mobileMode === \"none\") {\n return noneNav;\n }\n\n if (mobileMode === \"collapse\") {\n if (!open && !forceMount) {\n return null;\n }\n\n return collapseNav;\n }\n\n return <Drawer.Content>{drawerNav}</Drawer.Content>;\n}\nHeaderMobileNav.displayName = \"HeaderMobileNav\";\n\nexport function HeaderClose(props: HeaderCloseProps): ReactElement \| null {\n const { children, className, onClick, ...consumerProps } = props;\n const { close, mobileMode } = useHeaderContext(\"Close\");\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n close();\n onClick?.(event);\n };\n\n const closeButton = useRenderElement({\n defaultTag: \"button\",\n props: {\n ...consumerProps,\n type: \"button\",\n onClick: handleClick,\n ...(className !== undefined ? { className } : {}),\n children,\n },\n state: {},\n });\n\n if (isDrawerMode(mobileMode)) {\n return (\n <Drawer.Close\n {...consumerProps}\n {...(className !== undefined ? { className } : {})}\n {...(onClick !== undefined ? { onClick } : {})}\n >\n {children}\n </Drawer.Close>\n );\n }\n\n return closeButton;\n}\nHeaderClose.displayName = \"HeaderClose\";\n\nexport const Header = {\n Close: HeaderClose,\n MobileNav: HeaderMobileNav,\n Root: HeaderRoot,\n Toggle: HeaderToggle,\n};\n\nexport { useHeader, useHeaderScrollState };\n"],"mappings":"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","names":[]}

package/dist/components/modal/Modal.d.ts CHANGED Viewed

@@ -1,11 +1,12 @@
 import type { ReactElement } from "react";
 import type { ModalProps } from "./types.js";
 /**
- * Convenience shell over the native parts: one trigger, one modal `<dialog>`
- * with title/description ids, one close button. Controlled or initially open
- * dialogs use `ModalClientContent` from `@gunkin/uiify/components/modal/client`.
+ * Convenience shell over the native parts: one trigger and one modal `<dialog>`
+ * with a header (title, description, close icon), a body and an optional footer.
+ * Controlled or initially open dialogs use `ModalClientContent` from
+ * `@gunkin/uiify/components/modal/client`.
  */
-export declare function Modal({ id, trigger, title, description, children, closeLabel, className, }: ModalProps): ReactElement;
+export declare function Modal({ id, trigger, title, description, children, closeLabel, footer, className, align, backdrop, dismiss, size, }: ModalProps): ReactElement;
 export declare namespace Modal {
     var displayName: string;
 }

package/dist/components/modal/Modal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,~~EAAE~~,MAAM,OAAO,CAAC;~~AAE1C~~,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;~~AAE7C;;;;GAIG~~;AACH,wBAAgB,KAAK,CAAC,EACpB,EAAE,EACF,OAAO,EACP,KAAK,EACL,WAAW,EACX,QAAQ,EACR,UAAoB,EACpB,SAAS,~~GACV~~,EAAE,UAAU,GAAG,YAAY,~~CAoB3B~~;~~yBA5Be~~,KAAK"}
1	+ {"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAa,MAAM,OAAO,CAAC;AAYrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAuB7C;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,EACpB,EAAE,EACF,OAAO,EACP,KAAK,EACL,WAAW,EACX,QAAQ,EACR,UAAoB,EACpB,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,EACP,IAAI,GACL,EAAE,UAAU,GAAG,YAAY,CAgC3B;yBA7Ce,KAAK"}

package/dist/components/modal/Modal.js CHANGED Viewed

@@ -1,5 +1,33 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ModalClose, ModalContent, ModalTrigger } from "./ModalParts.js";
+import {
+  ModalBody,
+  ModalClose,
+  ModalContent,
+  ModalDescription,
+  ModalFooter,
+  ModalGrabber,
+  ModalHeader,
+  ModalTitle,
+  ModalTrigger
+} from "./ModalParts.js";
+const CLOSE_ICON = /* @__PURE__ */ jsx(
+  "svg",
+  {
+    "aria-hidden": "true",
+    fill: "none",
+    focusable: "false",
+    height: "16",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeWidth: "2",
+    viewBox: "0 0 16 16",
+    width: "16",
+    children: /* @__PURE__ */ jsx("path", { d: "M3 3l10 10M13 3L3 13" })
+  }
+);
+function isAbsent(node) {
+  return node === null || node === void 0;
+}
 function Modal({
   id,
   trigger,
@@ -7,7 +35,12 @@ function Modal({
   description,
   children,
   closeLabel = "Close",
-  className
+  footer,
+  className,
+  align,
+  backdrop,
+  dismiss,
+  size
 }) {
   const titleId = `${id}-title`;
   const descriptionId = `${id}-description`;
@@ -16,15 +49,23 @@ function Modal({
     /* @__PURE__ */ jsxs(
       ModalContent,
       {
-        "aria-describedby": description === void 0 ? void 0 : descriptionId,
+        align,
+        "aria-describedby": isAbsent(description) ? void 0 : descriptionId,
         "aria-labelledby": titleId,
+        backdrop,
         className,
+        dismiss,
         id,
+        size,
         children: [
-          /* @__PURE__ */ jsx("h2", { id: titleId, children: title }),
-          description === void 0 ? null : /* @__PURE__ */ jsx("p", { id: descriptionId, children: description }),
-          children,
-          /* @__PURE__ */ jsx(ModalClose, { target: id, children: closeLabel })
+          /* @__PURE__ */ jsx(ModalGrabber, {}),
+          /* @__PURE__ */ jsxs(ModalHeader, { children: [
+            /* @__PURE__ */ jsx(ModalTitle, { id: titleId, children: title }),
+            isAbsent(description) ? null : /* @__PURE__ */ jsx(ModalDescription, { id: descriptionId, children: description }),
+            /* @__PURE__ */ jsx(ModalClose, { "aria-label": closeLabel, target: id, children: CLOSE_ICON })
+          ] }),
+          isAbsent(children) ? null : /* @__PURE__ */ jsx(ModalBody, { children }),
+          isAbsent(footer) ? null : /* @__PURE__ */ jsx(ModalFooter, { children: footer })
         ]
       }
     )

package/dist/components/modal/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/modal/Modal.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ModalClose, ModalContent, ModalTrigger } from \"./ModalParts.js\";\nimport type { ModalProps } from \"./types.js\";\n\n/*\n Convenience shell over the native parts: one trigger, one modal `<dialog>`\n * with title/description ~~ids~~, ~~one~~ ~~close~~ ~~button.~~ Controlled or initially open\n * dialogs use `ModalClientContent` from `@gunkin/uiify/components/modal/client`.\n */\nexport function Modal({\n id,\n trigger,\n title,\n description,\n children,\n closeLabel = \"Close\",\n className,\n}: ModalProps): ReactElement {\n const titleId = `${id}-title`;\n const descriptionId = `${id}-description`;\n\n return (\n <div data-part=\"root\" data-uiify-modal=\"\">\n <ModalTrigger target={id}>{trigger}</ModalTrigger>\n <ModalContent\n aria-describedby={description ~~=== undefined~~ ? undefined : descriptionId}\n aria-labelledby={titleId}\n className={className}\n id={id}\n >\n <h2 id={titleId}>{title}</h2>\n {description ~~=== undefined~~ ? null : <p id={descriptionId}>{description}</~~p>}\~~n ~~{children~~}\n <ModalClose target={id}>{~~closeLabel~~}</ModalClose>\n </ModalContent>\n </div>\n );\n}\nModal.displayName = \"Modal\";\n"],"mappings":"~~AAuBM~~,~~cACA~~,~~YADA~~;~~AAtBN~~,SAAS,~~YAAY~~,~~cAAc~~,~~oBAAoB~~;~~AAQhD~~,SAAS,MAAM;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AACF,GAA6B;AAC3B,QAAM,UAAU,GAAG,EAAE;AACrB,QAAM,gBAAgB,GAAG,EAAE;AAE3B,SACE,qBAAC,SAAI,aAAU,QAAO,oBAAiB,IACrC;AAAA,wBAAC,gBAAa,QAAQ,IAAK,mBAAQ;AAAA,IACnC;AAAA,MAAC;AAAA;AAAA,QACC,oBAAkB,~~gBAAgB~~,~~SAAY~~,SAAY;AAAA,~~QAC1D~~,mBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QAEA;AAAA,8BAAC,~~QAAG~~,IAAI,SAAU,iBAAM;AAAA,~~UACvB~~,~~gBAAgB~~,~~SAAY~~,~~OAAO~~,oBAAC,~~OAAE~~,IAAI,eAAgB,uBAAY;AAAA,~~UACtE~~;AAAA,~~UACD~~,~~oBAAC~~,~~cAAW~~,QAAQ,~~IAAK~~,~~sBAAW~~;AAAA;AAAA;AAAA,~~IACtC~~;AAAA,KACF;AAEJ;AACA,MAAM,cAAc;","names":[]}
1	+ {"version":3,"sources":["../../../src/components/modal/Modal.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from \"react\";\nimport {\n ModalBody,\n ModalClose,\n ModalContent,\n ModalDescription,\n ModalFooter,\n ModalGrabber,\n ModalHeader,\n ModalTitle,\n ModalTrigger,\n} from \"./ModalParts.js\";\nimport type { ModalProps } from \"./types.js\";\n\nconst CLOSE_ICON = (\n <svg\n aria-hidden=\"true\"\n fill=\"none\"\n focusable=\"false\"\n height=\"16\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeWidth=\"2\"\n viewBox=\"0 0 16 16\"\n width=\"16\"\n >\n <path d=\"M3 3l10 10M13 3L3 13\" />\n </svg>\n);\n\n/** `null` and `undefined` both mean \"not given\": no empty part, no dangling `aria-describedby`. /\nfunction isAbsent(node: ReactNode): node is null \| undefined {\n return node === null \|\| node === undefined;\n}\n\n/\n Convenience shell over the native parts: one trigger and one modal `<dialog>`\n * with a header (title, description, close icon), a body and an optional footer.\n * Controlled or initially open dialogs use `ModalClientContent` from\n * `@gunkin/uiify/components/modal/client`.\n */\nexport function Modal({\n id,\n trigger,\n title,\n description,\n children,\n closeLabel = \"Close\",\n footer,\n className,\n align,\n backdrop,\n dismiss,\n size,\n}: ModalProps): ReactElement {\n const titleId = `${id}-title`;\n const descriptionId = `${id}-description`;\n\n return (\n <div data-part=\"root\" data-uiify-modal=\"\">\n <ModalTrigger target={id}>{trigger}</ModalTrigger>\n <ModalContent\n align={align}\n aria-describedby={isAbsent(description) ? undefined : descriptionId}\n aria-labelledby={titleId}\n backdrop={backdrop}\n className={className}\n dismiss={dismiss}\n id={id}\n size={size}\n >\n <ModalGrabber />\n <ModalHeader>\n <ModalTitle id={titleId}>{title}</ModalTitle>\n {isAbsent(description) ? null : (\n <ModalDescription id={descriptionId}>{description}</ModalDescription>\n )}\n <ModalClose aria-label={closeLabel} target={id}>\n {CLOSE_ICON}\n </ModalClose>\n </ModalHeader>\n {isAbsent(children) ? null : <ModalBody>{children}</ModalBody>}\n {isAbsent(footer) ? null : <ModalFooter>{footer}</ModalFooter>}\n </ModalContent>\n </div>\n );\n}\nModal.displayName = \"Modal\";\n"],"mappings":"AA0BI,cA8CI,YA9CJ;AAzBJ;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,MAAM,aACJ;AAAA,EAAC;AAAA;AAAA,IACC,eAAY;AAAA,IACZ,MAAK;AAAA,IACL,WAAU;AAAA,IACV,QAAO;AAAA,IACP,QAAO;AAAA,IACP,eAAc;AAAA,IACd,aAAY;AAAA,IACZ,SAAQ;AAAA,IACR,OAAM;AAAA,IAEN,8BAAC,UAAK,GAAE,wBAAuB;AAAA;AACjC;AAIF,SAAS,SAAS,MAA2C;AAC3D,SAAO,SAAS,QAAQ,SAAS;AACnC;AAQO,SAAS,MAAM;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA6B;AAC3B,QAAM,UAAU,GAAG,EAAE;AACrB,QAAM,gBAAgB,GAAG,EAAE;AAE3B,SACE,qBAAC,SAAI,aAAU,QAAO,oBAAiB,IACrC;AAAA,wBAAC,gBAAa,QAAQ,IAAK,mBAAQ;AAAA,IACnC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,oBAAkB,SAAS,WAAW,IAAI,SAAY;AAAA,QACtD,mBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,8BAAC,gBAAa;AAAA,UACd,qBAAC,eACC;AAAA,gCAAC,cAAW,IAAI,SAAU,iBAAM;AAAA,YAC/B,SAAS,WAAW,IAAI,OACvB,oBAAC,oBAAiB,IAAI,eAAgB,uBAAY;AAAA,YAEpD,oBAAC,cAAW,cAAY,YAAY,QAAQ,IACzC,sBACH;AAAA,aACF;AAAA,UACC,SAAS,QAAQ,IAAI,OAAO,oBAAC,aAAW,UAAS;AAAA,UACjD,SAAS,MAAM,IAAI,OAAO,oBAAC,eAAa,kBAAO;AAAA;AAAA;AAAA,IAClD;AAAA,KACF;AAEJ;AACA,MAAM,cAAc;","names":[]}

package/dist/components/modal/ModalAnatomy.d.ts ADDED Viewed

@@ -0,0 +1,33 @@
+import type { ReactElement } from "react";
+import type { ModalBodyProps, ModalDescriptionProps, ModalFooterProps, ModalGrabberProps, ModalHeaderProps, ModalTitleProps } from "./types.js";
+/** Pinned top row: title, description and the close control. */
+export declare function ModalHeader(props: ModalHeaderProps): ReactElement;
+export declare namespace ModalHeader {
+    var displayName: string;
+}
+/** Accessible name of the dialog; reference its `id` from `aria-labelledby`. */
+export declare function ModalTitle(props: ModalTitleProps): ReactElement;
+export declare namespace ModalTitle {
+    var displayName: string;
+}
+/** Supporting text; reference its `id` from `aria-describedby`. */
+export declare function ModalDescription(props: ModalDescriptionProps): ReactElement;
+export declare namespace ModalDescription {
+    var displayName: string;
+}
+/** The scrolling region between header and footer. */
+export declare function ModalBody(props: ModalBodyProps): ReactElement;
+export declare namespace ModalBody {
+    var displayName: string;
+}
+/** Actions row pinned under the body. */
+export declare function ModalFooter(props: ModalFooterProps): ReactElement;
+export declare namespace ModalFooter {
+    var displayName: string;
+}
+/** Decorative drag handle shown on the mobile sheet; the swipe enhancement starts here. */
+export declare function ModalGrabber(props: ModalGrabberProps): ReactElement;
+export declare namespace ModalGrabber {
+    var displayName: string;
+}
+//# sourceMappingURL=ModalAnatomy.d.ts.map

package/dist/components/modal/ModalAnatomy.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ModalAnatomy.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ModalAnatomy.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EACV,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EAChB,MAAM,YAAY,CAAC;AAOpB,gEAAgE;AAChE,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAEjE;yBAFe,WAAW;;;AAK3B,gFAAgF;AAChF,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAE/D;yBAFe,UAAU;;;AAK1B,mEAAmE;AACnE,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,YAAY,CAE3E;yBAFe,gBAAgB;;;AAKhC,sDAAsD;AACtD,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,GAAG,YAAY,CAE7D;yBAFe,SAAS;;;AAKzB,yCAAyC;AACzC,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAEjE;yBAFe,WAAW;;;AAK3B,2FAA2F;AAC3F,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAEnE;yBAFe,YAAY"}

package/dist/components/modal/ModalAnatomy.js ADDED Viewed

@@ -0,0 +1,34 @@
+import { jsx } from "react/jsx-runtime";
+function ModalHeader(props) {
+  return /* @__PURE__ */ jsx("div", { ...props, "data-part": "header", "data-uiify-modal": "" });
+}
+ModalHeader.displayName = "ModalHeader";
+function ModalTitle(props) {
+  return /* @__PURE__ */ jsx("h2", { ...props, "data-part": "title", "data-uiify-modal": "" });
+}
+ModalTitle.displayName = "ModalTitle";
+function ModalDescription(props) {
+  return /* @__PURE__ */ jsx("p", { ...props, "data-part": "description", "data-uiify-modal": "" });
+}
+ModalDescription.displayName = "ModalDescription";
+function ModalBody(props) {
+  return /* @__PURE__ */ jsx("div", { ...props, "data-part": "body", "data-uiify-modal": "" });
+}
+ModalBody.displayName = "ModalBody";
+function ModalFooter(props) {
+  return /* @__PURE__ */ jsx("div", { ...props, "data-part": "footer", "data-uiify-modal": "" });
+}
+ModalFooter.displayName = "ModalFooter";
+function ModalGrabber(props) {
+  return /* @__PURE__ */ jsx("div", { ...props, "aria-hidden": "true", "data-part": "grabber", "data-uiify-modal": "" });
+}
+ModalGrabber.displayName = "ModalGrabber";
+export {
+  ModalBody,
+  ModalDescription,
+  ModalFooter,
+  ModalGrabber,
+  ModalHeader,
+  ModalTitle
+};
+//# sourceMappingURL=ModalAnatomy.js.map

package/dist/components/modal/ModalAnatomy.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../src/components/modal/ModalAnatomy.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport type {\n ModalBodyProps,\n ModalDescriptionProps,\n ModalFooterProps,\n ModalGrabberProps,\n ModalHeaderProps,\n ModalTitleProps,\n} from \"./types.js\";\n\n// Kept apart from ModalParts.tsx: each `displayName` assignment is a top-level side effect, so\n// parts sharing a module with ModalTrigger/ModalContent/ModalClose would ship with them even\n// when unused. As their own module, a bundler drops them whole, because package.json declares\n// `\"sideEffects\": [\"**/*.css\"]`; widening that field would bring the unused parts back.\n\n/** Pinned top row: title, description and the close control. */\nexport function ModalHeader(props: ModalHeaderProps): ReactElement {\n return <div {...props} data-part=\"header\" data-uiify-modal=\"\" />;\n}\nModalHeader.displayName = \"ModalHeader\";\n\n/** Accessible name of the dialog; reference its `id` from `aria-labelledby`. */\nexport function ModalTitle(props: ModalTitleProps): ReactElement {\n return <h2 {...props} data-part=\"title\" data-uiify-modal=\"\" />;\n}\nModalTitle.displayName = \"ModalTitle\";\n\n/** Supporting text; reference its `id` from `aria-describedby`. */\nexport function ModalDescription(props: ModalDescriptionProps): ReactElement {\n return <p {...props} data-part=\"description\" data-uiify-modal=\"\" />;\n}\nModalDescription.displayName = \"ModalDescription\";\n\n/** The scrolling region between header and footer. */\nexport function ModalBody(props: ModalBodyProps): ReactElement {\n return <div {...props} data-part=\"body\" data-uiify-modal=\"\" />;\n}\nModalBody.displayName = \"ModalBody\";\n\n/** Actions row pinned under the body. */\nexport function ModalFooter(props: ModalFooterProps): ReactElement {\n return <div {...props} data-part=\"footer\" data-uiify-modal=\"\" />;\n}\nModalFooter.displayName = \"ModalFooter\";\n\n/** Decorative drag handle shown on the mobile sheet; the swipe enhancement starts here. */\nexport function ModalGrabber(props: ModalGrabberProps): ReactElement {\n return <div {...props} aria-hidden=\"true\" data-part=\"grabber\" data-uiify-modal=\"\" />;\n}\nModalGrabber.displayName = \"ModalGrabber\";\n"],"mappings":"AAiBS;AADF,SAAS,YAAY,OAAuC;AACjE,SAAO,oBAAC,SAAK,GAAG,OAAO,aAAU,UAAS,oBAAiB,IAAG;AAChE;AACA,YAAY,cAAc;AAGnB,SAAS,WAAW,OAAsC;AAC/D,SAAO,oBAAC,QAAI,GAAG,OAAO,aAAU,SAAQ,oBAAiB,IAAG;AAC9D;AACA,WAAW,cAAc;AAGlB,SAAS,iBAAiB,OAA4C;AAC3E,SAAO,oBAAC,OAAG,GAAG,OAAO,aAAU,eAAc,oBAAiB,IAAG;AACnE;AACA,iBAAiB,cAAc;AAGxB,SAAS,UAAU,OAAqC;AAC7D,SAAO,oBAAC,SAAK,GAAG,OAAO,aAAU,QAAO,oBAAiB,IAAG;AAC9D;AACA,UAAU,cAAc;AAGjB,SAAS,YAAY,OAAuC;AACjE,SAAO,oBAAC,SAAK,GAAG,OAAO,aAAU,UAAS,oBAAiB,IAAG;AAChE;AACA,YAAY,cAAc;AAGnB,SAAS,aAAa,OAAwC;AACnE,SAAO,oBAAC,SAAK,GAAG,OAAO,eAAY,QAAO,aAAU,WAAU,oBAAiB,IAAG;AACpF;AACA,aAAa,cAAc;","names":[]}

package/dist/components/modal/ModalParts.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import type { ElementType, ReactElement } from "react";
 import type { ModalCloseProps, ModalContentProps, ModalTriggerProps } from "./types.js";
+export { ModalBody, ModalDescription, ModalFooter, ModalGrabber, ModalHeader, ModalTitle, } from "./ModalAnatomy.js";
 /** Native modal invoker with modal identity and trigger anatomy. */
 export declare function ModalTrigger<TAs extends ElementType = "button">(props: ModalTriggerProps<TAs>): ReactElement;
 export declare namespace ModalTrigger {

package/dist/components/modal/ModalParts.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalParts.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ModalParts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;~~AAEvD~~,OAAO,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAExF,oEAAoE;AACpE,wBAAgB,YAAY,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC7D,KAAK,EAAE,iBAAiB,CAAC,GAAG,CAAC,GAC5B,YAAY,CAWd;yBAbe,YAAY;;;AAgB5B,2EAA2E;AAC3E,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,~~CAOnE~~;~~yBAPe~~,YAAY;;;~~AAU5B~~,kCAAkC;AAClC,wBAAgB,UAAU,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC3D,KAAK,EAAE,eAAe,CAAC,GAAG,CAAC,GAC1B,YAAY,CAWd;yBAbe,UAAU"}
1	+ {"version":3,"file":"ModalParts.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ModalParts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAExF,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,WAAW,EACX,YAAY,EACZ,WAAW,EACX,UAAU,GACX,MAAM,mBAAmB,CAAC;AAE3B,oEAAoE;AACpE,wBAAgB,YAAY,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC7D,KAAK,EAAE,iBAAiB,CAAC,GAAG,CAAC,GAC5B,YAAY,CAWd;yBAbe,YAAY;;;AAgB5B,2EAA2E;AAC3E,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAYnE;yBAZe,YAAY;;;AAe5B,kCAAkC;AAClC,wBAAgB,UAAU,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC3D,KAAK,EAAE,eAAe,CAAC,GAAG,CAAC,GAC1B,YAAY,CAWd;yBAbe,UAAU"}

package/dist/components/modal/ModalParts.js CHANGED Viewed

@@ -1,5 +1,14 @@
 import { jsx } from "react/jsx-runtime";
 import { renderNativeInvoker } from "@gunkin/uiify/core/render";
+import { modalAppearanceAttributes } from "./attributes.js";
+import {
+  ModalBody,
+  ModalDescription,
+  ModalFooter,
+  ModalGrabber,
+  ModalHeader,
+  ModalTitle
+} from "./ModalAnatomy.js";
 function ModalTrigger(props) {
   const { as, target, ...consumerProps } = props;
   return renderNativeInvoker(
@@ -14,8 +23,17 @@ function ModalTrigger(props) {
 }
 ModalTrigger.displayName = "ModalTrigger";
 function ModalContent(props) {
-  const { children, ...dialogProps } = props;
-  return /* @__PURE__ */ jsx("dialog", { ...dialogProps, "data-part": "content", "data-uiify-modal": "", children });
+  const { align, backdrop, children, dismiss, size, ...dialogProps } = props;
+  return /* @__PURE__ */ jsx(
+    "dialog",
+    {
+      ...dialogProps,
+      ...modalAppearanceAttributes({ align, backdrop, dismiss, size }),
+      "data-part": "content",
+      "data-uiify-modal": "",
+      children
+    }
+  );
 }
 ModalContent.displayName = "ModalContent";
 function ModalClose(props) {
@@ -32,8 +50,14 @@ function ModalClose(props) {
 }
 ModalClose.displayName = "ModalClose";
 export {
+  ModalBody,
   ModalClose,
   ModalContent,
+  ModalDescription,
+  ModalFooter,
+  ModalGrabber,
+  ModalHeader,
+  ModalTitle,
   ModalTrigger
 };
 //# sourceMappingURL=ModalParts.js.map