@gunkin/uiify 0.0.22-alpha → 0.0.25-alpha

package/dist/core/slot-props.js

@@ -0,0 +1,59 @@
+function mergeRepeatedSlotProps(common, byItemValue) {
+  const commonRecord = common;
+  const itemRecord = byItemValue;
+  const merged = { ...commonRecord, ...itemRecord };
+  if (commonRecord?.className !== void 0 || itemRecord?.className !== void 0) {
+    merged.className = [commonRecord?.className, itemRecord?.className].filter(Boolean).join(" ");
+  }
+  if (commonRecord?.style !== void 0 || itemRecord?.style !== void 0) {
+    merged.style = { ...commonRecord?.style, ...itemRecord?.style };
+  }
+  for (const [key, first] of Object.entries(commonRecord ?? {})) {
+    const second = itemRecord?.[key];
+    if (key.startsWith("on") && typeof first === "function" && typeof second === "function") {
+      merged[key] = (...args) => {
+        first(...args);
+        second(...args);
+      };
+    }
+  }
+  if (commonRecord?.ref !== void 0 && itemRecord?.ref !== void 0) {
+    const refs = [commonRecord.ref, itemRecord.ref];
+    merged.ref = (node) => {
+      const cleanups = refs.map((ref) => {
+        if (typeof ref === "function") {
+          const cleanup = ref(node);
+          return typeof cleanup === "function" ? cleanup : () => ref(null);
+        }
+        if (ref !== null) ref.current = node;
+        return () => {
+          if (ref !== null) ref.current = null;
+        };
+      });
+      return () => {
+        for (const cleanup of cleanups.reverse()) cleanup();
+      };
+    };
+  }
+  return merged;
+}
+function resolveRepeatedSlotProps(props, itemValue, protectedKeys = []) {
+  const { byItemValue, ...common } = props ?? {};
+  const itemProps = byItemValue?.[itemValue];
+  return omitProps(mergeRepeatedSlotProps(common, itemProps), [
+    "children",
+    "dangerouslySetInnerHTML",
+    ...protectedKeys
+  ]);
+}
+function omitProps(props, omittedKeys) {
+  const result = { ...props };
+  for (const key of omittedKeys) delete result[key];
+  return result;
+}
+export {
+  mergeRepeatedSlotProps,
+  omitProps,
+  resolveRepeatedSlotProps
+};
+//# sourceMappingURL=slot-props.js.map

package/dist/core/slot-props.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/core/slot-props.ts"],"sourcesContent":["import type { Ref } from \"react\";\n\n/** Native custom data attributes are accepted by slot objects as well as JSX. */\nexport interface ConsumerDataAttributes {\n  readonly [attribute: `data-${string}`]: string | number | boolean | undefined;\n}\n\ntype NativeSlotObject = Record<string, unknown> & {\n  readonly className?: string;\n  readonly style?: object;\n};\n\n/**\n * Props for a repeated internal part. Common props apply to each instance;\n * `byItemValue` adds props to the item with the matching stable `value`.\n */\nexport type RepeatedSlotProps<TProps extends object, TProtected extends object = object> = Omit<\n  TProps,\n  \"children\" | \"dangerouslySetInnerHTML\"\n> &\n  TProtected & {\n    readonly byItemValue?: Readonly<\n      Record<\n        string,\n        Omit<TProps, \"children\" | \"dangerouslySetInnerHTML\"> & ConsumerDataAttributes & TProtected\n      >\n    >;\n  } & ConsumerDataAttributes;\n\n/** Merge consumer props without losing common/item classes, styles, or event handlers. */\nexport function mergeRepeatedSlotProps<TProps extends object>(\n  common: TProps | undefined,\n  byItemValue: TProps | undefined,\n): TProps {\n  const commonRecord = common as NativeSlotObject | undefined;\n  const itemRecord = byItemValue as NativeSlotObject | undefined;\n  const merged: Record<string, unknown> = { ...commonRecord, ...itemRecord };\n\n  if (commonRecord?.className !== undefined || itemRecord?.className !== undefined) {\n    merged.className = [commonRecord?.className, itemRecord?.className].filter(Boolean).join(\" \");\n  }\n  if (commonRecord?.style !== undefined || itemRecord?.style !== undefined) {\n    merged.style = { ...commonRecord?.style, ...itemRecord?.style };\n  }\n\n  for (const [key, first] of Object.entries(commonRecord ?? {})) {\n    const second = itemRecord?.[key];\n    if (key.startsWith(\"on\") && typeof first === \"function\" && typeof second === \"function\") {\n      merged[key] = (...args: unknown[]) => {\n        (first as (...values: unknown[]) => unknown)(...args);\n        (second as (...values: unknown[]) => unknown)(...args);\n      };\n    }\n  }\n\n  if (commonRecord?.ref !== undefined && itemRecord?.ref !== undefined) {\n    const refs = [commonRecord.ref, itemRecord.ref] as Array<Ref<unknown>>;\n    merged.ref = (node: unknown) => {\n      const cleanups = refs.map((ref) => {\n        if (typeof ref === \"function\") {\n          const cleanup = ref(node);\n          return typeof cleanup === \"function\" ? cleanup : () => ref(null);\n        }\n        if (ref !== null) ref.current = node;\n        return () => {\n          if (ref !== null) ref.current = null;\n        };\n      });\n      return () => {\n        for (const cleanup of cleanups.reverse()) cleanup();\n      };\n    };\n  }\n\n  return merged as TProps;\n}\n\nexport function resolveRepeatedSlotProps<TProps extends object>(\n  props:\n    | (TProps & {\n        readonly byItemValue?: Readonly<Record<string, TProps>>;\n      })\n    | undefined,\n  itemValue: string,\n  protectedKeys: readonly string[] = [],\n): TProps {\n  const { byItemValue, ...common } = props ?? {};\n  const itemProps = byItemValue?.[itemValue];\n  return omitProps(mergeRepeatedSlotProps(common as TProps, itemProps as TProps | undefined), [\n    \"children\",\n    \"dangerouslySetInnerHTML\",\n    ...protectedKeys,\n  ]);\n}\n\n/** Remove generated content and behavior-owned properties, including values from JS callers. */\nexport function omitProps<TProps extends object>(\n  props: TProps | undefined,\n  omittedKeys: readonly string[],\n): TProps {\n  const result = { ...props } as Record<string, unknown>;\n  for (const key of omittedKeys) delete result[key];\n  return result as TProps;\n}\n"],"mappings":"AA8BO,SAAS,uBACd,QACA,aACQ;AACR,QAAM,eAAe;AACrB,QAAM,aAAa;AACnB,QAAM,SAAkC,EAAE,GAAG,cAAc,GAAG,WAAW;AAEzE,MAAI,cAAc,cAAc,UAAa,YAAY,cAAc,QAAW;AAChF,WAAO,YAAY,CAAC,cAAc,WAAW,YAAY,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,EAC9F;AACA,MAAI,cAAc,UAAU,UAAa,YAAY,UAAU,QAAW;AACxE,WAAO,QAAQ,EAAE,GAAG,cAAc,OAAO,GAAG,YAAY,MAAM;AAAA,EAChE;AAEA,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,gBAAgB,CAAC,CAAC,GAAG;AAC7D,UAAM,SAAS,aAAa,GAAG;AAC/B,QAAI,IAAI,WAAW,IAAI,KAAK,OAAO,UAAU,cAAc,OAAO,WAAW,YAAY;AACvF,aAAO,GAAG,IAAI,IAAI,SAAoB;AACpC,QAAC,MAA4C,GAAG,IAAI;AACpD,QAAC,OAA6C,GAAG,IAAI;AAAA,MACvD;AAAA,IACF;AAAA,EACF;AAEA,MAAI,cAAc,QAAQ,UAAa,YAAY,QAAQ,QAAW;AACpE,UAAM,OAAO,CAAC,aAAa,KAAK,WAAW,GAAG;AAC9C,WAAO,MAAM,CAAC,SAAkB;AAC9B,YAAM,WAAW,KAAK,IAAI,CAAC,QAAQ;AACjC,YAAI,OAAO,QAAQ,YAAY;AAC7B,gBAAM,UAAU,IAAI,IAAI;AACxB,iBAAO,OAAO,YAAY,aAAa,UAAU,MAAM,IAAI,IAAI;AAAA,QACjE;AACA,YAAI,QAAQ,KAAM,KAAI,UAAU;AAChC,eAAO,MAAM;AACX,cAAI,QAAQ,KAAM,KAAI,UAAU;AAAA,QAClC;AAAA,MACF,CAAC;AACD,aAAO,MAAM;AACX,mBAAW,WAAW,SAAS,QAAQ,EAAG,SAAQ;AAAA,MACpD;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;AAEO,SAAS,yBACd,OAKA,WACA,gBAAmC,CAAC,GAC5B;AACR,QAAM,EAAE,aAAa,GAAG,OAAO,IAAI,SAAS,CAAC;AAC7C,QAAM,YAAY,cAAc,SAAS;AACzC,SAAO,UAAU,uBAAuB,QAAkB,SAA+B,GAAG;AAAA,IAC1F;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,CAAC;AACH;AAGO,SAAS,UACd,OACA,aACQ;AACR,QAAM,SAAS,EAAE,GAAG,MAAM;AAC1B,aAAW,OAAO,YAAa,QAAO,OAAO,GAAG;AAChD,SAAO;AACT;","names":[]}

package/dist/core/use-popover.d.ts

@@ -3,6 +3,7 @@ import { type UseControllableOpenChangeOptions } from "./use-controllable-open-c
 export type PopoverMode = "auto" | "manual" | "hint";
 export type PopoverChangeHandler = UseControllableOpenChangeOptions["onOpenChange"];
 export interface UsePopoverOptions extends UseControllableOpenChangeOptions {
+    readonly id?: string;
     readonly mode?: PopoverMode;
 }
 export interface UsePopoverReturn {
@@ -16,5 +17,5 @@ export interface UsePopoverReturn {
     readonly triggerProps: ButtonHTMLAttributes<HTMLButtonElement>;
     readonly triggerRef: RefCallback<HTMLButtonElement>;
 }
-export declare function usePopover({ defaultOpen, mode, onOpenChange, open: controlledOpen, }?: UsePopoverOptions): UsePopoverReturn;
+export declare function usePopover({ defaultOpen, id: requestedId, mode, onOpenChange, open: controlledOpen, }?: UsePopoverOptions): UsePopoverReturn;
 //# sourceMappingURL=use-popover.d.ts.map

package/dist/core/use-popover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-popover.d.ts","sourceRoot":"","sources":["../../src/core/use-popover.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,oBAAoB,EACpB,cAAc,EAEd,WAAW,EACZ,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,KAAK,gCAAgC,EACtC,MAAM,mCAAmC,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AACrD,MAAM,MAAM,oBAAoB,GAAG,gCAAgC,CAAC,cAAc,CAAC,CAAC;AAEpF,MAAM,WAAW,iBAAkB,SAAQ,gCAAgC;IACzE,QAAQ,CAAC,IAAI,CAAC,EAAE,WAAW,CAAC;CAC7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,WAAW,EAAE,MAAM,IAAI,CAAC;IACjC,QAAQ,CAAC,UAAU,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACjD,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAC5C,QAAQ,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,YAAY,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IAC/D,QAAQ,CAAC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAC;CACrD;AAMD,wBAAgB,UAAU,CAAC,EACzB,WAAmB,EACnB,IAAa,EACb,YAAY,EACZ,IAAI,EAAE,cAAc,GACrB,GAAE,iBAAsB,GAAG,gBAAgB,CA4E3C"}
+{"version":3,"file":"use-popover.d.ts","sourceRoot":"","sources":["../../src/core/use-popover.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,oBAAoB,EACpB,cAAc,EAEd,WAAW,EACZ,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,KAAK,gCAAgC,EACtC,MAAM,mCAAmC,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AACrD,MAAM,MAAM,oBAAoB,GAAG,gCAAgC,CAAC,cAAc,CAAC,CAAC;AAEpF,MAAM,WAAW,iBAAkB,SAAQ,gCAAgC;IACzE,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,IAAI,CAAC,EAAE,WAAW,CAAC;CAC7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,WAAW,EAAE,MAAM,IAAI,CAAC;IACjC,QAAQ,CAAC,UAAU,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACjD,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAC5C,QAAQ,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,YAAY,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IAC/D,QAAQ,CAAC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAC;CACrD;AAMD,wBAAgB,UAAU,CAAC,EACzB,WAAmB,EACnB,EAAE,EAAE,WAAW,EACf,IAAa,EACb,YAAY,EACZ,IAAI,EAAE,cAAc,GACrB,GAAE,iBAAsB,GAAG,gBAAgB,CA6E3C"}

package/dist/core/use-popover.js

@@ -7,11 +7,13 @@ import {
 } from "./use-controllable-open-change.js";
 function usePopover({
   defaultOpen = false,
+  id: requestedId,
   mode = "auto",
   onOpenChange,
   open: controlledOpen
 } = {}) {
-  const id = useId();
+  const generatedId = useId();
+  const id = requestedId ?? generatedId;
   const [popup, setPopup] = useState(null);
   const { open, requestChange } = useControllableOpenChange({
     defaultOpen,

package/dist/core/use-popover.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/use-popover.ts"],"sourcesContent":["\"use client\";\n\nimport { useRef, useState, useSyncExternalStore } from \"react\";\nimport type {\n  ButtonHTMLAttributes,\n  HTMLAttributes,\n  MouseEvent as ReactMouseEvent,\n  RefCallback,\n} from \"react\";\nimport { useId, useIsomorphicLayoutEffect } from \"@gunkin/uiify/hooks\";\nimport { supportsPopover } from \"./platform.js\";\nimport {\n  useControllableOpenChange,\n  type UseControllableOpenChangeOptions,\n} from \"./use-controllable-open-change.js\";\n\nexport type PopoverMode = \"auto\" | \"manual\" | \"hint\";\nexport type PopoverChangeHandler = UseControllableOpenChangeOptions[\"onOpenChange\"];\n\nexport interface UsePopoverOptions extends UseControllableOpenChangeOptions {\n  readonly mode?: PopoverMode;\n}\n\nexport interface UsePopoverReturn {\n  readonly close: () => void;\n  readonly isNative: boolean;\n  readonly open: boolean;\n  readonly openPopover: () => void;\n  readonly popupProps: HTMLAttributes<HTMLElement>;\n  readonly popupRef: RefCallback<HTMLElement>;\n  readonly toggle: () => void;\n  readonly triggerProps: ButtonHTMLAttributes<HTMLButtonElement>;\n  readonly triggerRef: RefCallback<HTMLButtonElement>;\n}\n\ninterface ToggleEventLike extends Event {\n  readonly newState?: \"closed\" | \"open\";\n}\n\nexport function usePopover({\n  defaultOpen = false,\n  mode = \"auto\",\n  onOpenChange,\n  open: controlledOpen,\n}: UsePopoverOptions = {}): UsePopoverReturn {\n  const id = useId();\n  const [popup, setPopup] = useState<HTMLElement | null>(null);\n  const { open, requestChange } = useControllableOpenChange({\n    defaultOpen,\n    onOpenChange,\n    open: controlledOpen,\n  });\n  const openRef = useRef(open);\n  openRef.current = open;\n  // SSR markup matches the initial open state so pre-hydration toggling works.\n  const isNative = useSyncExternalStore(\n    () => () => {},\n    () => supportsPopover(),\n    () => true,\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (!popup || !isNative) return;\n\n    const onBeforeToggle = (event: Event) => {\n      const next = (event as ToggleEventLike).newState === \"open\";\n      if (next !== openRef.current && !requestChange(next, \"native-toggle\", event)) {\n        event.preventDefault();\n      }\n    };\n    popup.addEventListener(\"beforetoggle\", onBeforeToggle);\n    return () => popup.removeEventListener(\"beforetoggle\", onBeforeToggle);\n  }, [isNative, popup, requestChange]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!popup || !isNative) return;\n    try {\n      if (open && !popup.matches(\":popover-open\")) popup.showPopover();\n      if (!open && popup.matches(\":popover-open\")) popup.hidePopover();\n    } catch {\n      // The node may have disconnected between render and layout effect.\n    }\n  }, [isNative, open, popup]);\n\n  const triggerProps = {\n    \"aria-controls\": id,\n    \"aria-expanded\": open,\n    onClick(event: ReactMouseEvent<HTMLButtonElement>) {\n      const accepted = requestChange(\n        !open,\n        isNative ? \"native-toggle\" : \"trigger-press\",\n        event.nativeEvent,\n      );\n      // Commit the React state first, then open from the layout effect. Letting\n      // the invoker open it first exposes the surface before its state/styles settle.\n      if (isNative || !accepted) event.preventDefault();\n    },\n    type: \"button\",\n    ...(isNative ? { command: \"toggle-popover\", commandfor: id } : {}),\n  } as ButtonHTMLAttributes<HTMLButtonElement>;\n\n  const popupProps = {\n    \"data-native\": isNative ? \"\" : undefined,\n    hidden: isNative ? undefined : !open,\n    id,\n    ...(isNative ? { popover: mode } : {}),\n    ...(isNative && open ? { open: true } : {}),\n  } as HTMLAttributes<HTMLElement>;\n\n  return {\n    close: () => requestChange(false, \"programmatic\"),\n    isNative,\n    open,\n    openPopover: () => requestChange(true, \"programmatic\"),\n    popupProps,\n    popupRef: setPopup,\n    toggle: () => requestChange(!open, \"programmatic\"),\n    triggerProps,\n    triggerRef() {},\n  };\n}\n"],"mappings":";AAEA,SAAS,QAAQ,UAAU,4BAA4B;AAOvD,SAAS,OAAO,iCAAiC;AACjD,SAAS,uBAAuB;AAChC;AAAA,EACE;AAAA,OAEK;AAyBA,SAAS,WAAW;AAAA,EACzB,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AAAA,EACA,MAAM;AACR,IAAuB,CAAC,GAAqB;AAC3C,QAAM,KAAK,MAAM;AACjB,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA6B,IAAI;AAC3D,QAAM,EAAE,MAAM,cAAc,IAAI,0BAA0B;AAAA,IACxD;AAAA,IACA;AAAA,IACA,MAAM;AAAA,EACR,CAAC;AACD,QAAM,UAAU,OAAO,IAAI;AAC3B,UAAQ,UAAU;AAElB,QAAM,WAAW;AAAA,IACf,MAAM,MAAM;AAAA,IAAC;AAAA,IACb,MAAM,gBAAgB;AAAA,IACtB,MAAM;AAAA,EACR;AAEA,4BAA0B,MAAM;AAC9B,QAAI,CAAC,SAAS,CAAC,SAAU;AAEzB,UAAM,iBAAiB,CAAC,UAAiB;AACvC,YAAM,OAAQ,MAA0B,aAAa;AACrD,UAAI,SAAS,QAAQ,WAAW,CAAC,cAAc,MAAM,iBAAiB,KAAK,GAAG;AAC5E,cAAM,eAAe;AAAA,MACvB;AAAA,IACF;AACA,UAAM,iBAAiB,gBAAgB,cAAc;AACrD,WAAO,MAAM,MAAM,oBAAoB,gBAAgB,cAAc;AAAA,EACvE,GAAG,CAAC,UAAU,OAAO,aAAa,CAAC;AAEnC,4BAA0B,MAAM;AAC9B,QAAI,CAAC,SAAS,CAAC,SAAU;AACzB,QAAI;AACF,UAAI,QAAQ,CAAC,MAAM,QAAQ,eAAe,EAAG,OAAM,YAAY;AAC/D,UAAI,CAAC,QAAQ,MAAM,QAAQ,eAAe,EAAG,OAAM,YAAY;AAAA,IACjE,QAAQ;AAAA,IAER;AAAA,EACF,GAAG,CAAC,UAAU,MAAM,KAAK,CAAC;AAE1B,QAAM,eAAe;AAAA,IACnB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,QAAQ,OAA2C;AACjD,YAAM,WAAW;AAAA,QACf,CAAC;AAAA,QACD,WAAW,kBAAkB;AAAA,QAC7B,MAAM;AAAA,MACR;AAGA,UAAI,YAAY,CAAC,SAAU,OAAM,eAAe;AAAA,IAClD;AAAA,IACA,MAAM;AAAA,IACN,GAAI,WAAW,EAAE,SAAS,kBAAkB,YAAY,GAAG,IAAI,CAAC;AAAA,EAClE;AAEA,QAAM,aAAa;AAAA,IACjB,eAAe,WAAW,KAAK;AAAA,IAC/B,QAAQ,WAAW,SAAY,CAAC;AAAA,IAChC;AAAA,IACA,GAAI,WAAW,EAAE,SAAS,KAAK,IAAI,CAAC;AAAA,IACpC,GAAI,YAAY,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;AAAA,EAC3C;AAEA,SAAO;AAAA,IACL,OAAO,MAAM,cAAc,OAAO,cAAc;AAAA,IAChD;AAAA,IACA;AAAA,IACA,aAAa,MAAM,cAAc,MAAM,cAAc;AAAA,IACrD;AAAA,IACA,UAAU;AAAA,IACV,QAAQ,MAAM,cAAc,CAAC,MAAM,cAAc;AAAA,IACjD;AAAA,IACA,aAAa;AAAA,IAAC;AAAA,EAChB;AACF;","names":[]}
+{"version":3,"sources":["../../src/core/use-popover.ts"],"sourcesContent":["\"use client\";\n\nimport { useRef, useState, useSyncExternalStore } from \"react\";\nimport type {\n  ButtonHTMLAttributes,\n  HTMLAttributes,\n  MouseEvent as ReactMouseEvent,\n  RefCallback,\n} from \"react\";\nimport { useId, useIsomorphicLayoutEffect } from \"@gunkin/uiify/hooks\";\nimport { supportsPopover } from \"./platform.js\";\nimport {\n  useControllableOpenChange,\n  type UseControllableOpenChangeOptions,\n} from \"./use-controllable-open-change.js\";\n\nexport type PopoverMode = \"auto\" | \"manual\" | \"hint\";\nexport type PopoverChangeHandler = UseControllableOpenChangeOptions[\"onOpenChange\"];\n\nexport interface UsePopoverOptions extends UseControllableOpenChangeOptions {\n  readonly id?: string;\n  readonly mode?: PopoverMode;\n}\n\nexport interface UsePopoverReturn {\n  readonly close: () => void;\n  readonly isNative: boolean;\n  readonly open: boolean;\n  readonly openPopover: () => void;\n  readonly popupProps: HTMLAttributes<HTMLElement>;\n  readonly popupRef: RefCallback<HTMLElement>;\n  readonly toggle: () => void;\n  readonly triggerProps: ButtonHTMLAttributes<HTMLButtonElement>;\n  readonly triggerRef: RefCallback<HTMLButtonElement>;\n}\n\ninterface ToggleEventLike extends Event {\n  readonly newState?: \"closed\" | \"open\";\n}\n\nexport function usePopover({\n  defaultOpen = false,\n  id: requestedId,\n  mode = \"auto\",\n  onOpenChange,\n  open: controlledOpen,\n}: UsePopoverOptions = {}): UsePopoverReturn {\n  const generatedId = useId();\n  const id = requestedId ?? generatedId;\n  const [popup, setPopup] = useState<HTMLElement | null>(null);\n  const { open, requestChange } = useControllableOpenChange({\n    defaultOpen,\n    onOpenChange,\n    open: controlledOpen,\n  });\n  const openRef = useRef(open);\n  openRef.current = open;\n  // SSR markup matches the initial open state so pre-hydration toggling works.\n  const isNative = useSyncExternalStore(\n    () => () => {},\n    () => supportsPopover(),\n    () => true,\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (!popup || !isNative) return;\n\n    const onBeforeToggle = (event: Event) => {\n      const next = (event as ToggleEventLike).newState === \"open\";\n      if (next !== openRef.current && !requestChange(next, \"native-toggle\", event)) {\n        event.preventDefault();\n      }\n    };\n    popup.addEventListener(\"beforetoggle\", onBeforeToggle);\n    return () => popup.removeEventListener(\"beforetoggle\", onBeforeToggle);\n  }, [isNative, popup, requestChange]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!popup || !isNative) return;\n    try {\n      if (open && !popup.matches(\":popover-open\")) popup.showPopover();\n      if (!open && popup.matches(\":popover-open\")) popup.hidePopover();\n    } catch {\n      // The node may have disconnected between render and layout effect.\n    }\n  }, [isNative, open, popup]);\n\n  const triggerProps = {\n    \"aria-controls\": id,\n    \"aria-expanded\": open,\n    onClick(event: ReactMouseEvent<HTMLButtonElement>) {\n      const accepted = requestChange(\n        !open,\n        isNative ? \"native-toggle\" : \"trigger-press\",\n        event.nativeEvent,\n      );\n      // Commit the React state first, then open from the layout effect. Letting\n      // the invoker open it first exposes the surface before its state/styles settle.\n      if (isNative || !accepted) event.preventDefault();\n    },\n    type: \"button\",\n    ...(isNative ? { command: \"toggle-popover\", commandfor: id } : {}),\n  } as ButtonHTMLAttributes<HTMLButtonElement>;\n\n  const popupProps = {\n    \"data-native\": isNative ? \"\" : undefined,\n    hidden: isNative ? undefined : !open,\n    id,\n    ...(isNative ? { popover: mode } : {}),\n    ...(isNative && open ? { open: true } : {}),\n  } as HTMLAttributes<HTMLElement>;\n\n  return {\n    close: () => requestChange(false, \"programmatic\"),\n    isNative,\n    open,\n    openPopover: () => requestChange(true, \"programmatic\"),\n    popupProps,\n    popupRef: setPopup,\n    toggle: () => requestChange(!open, \"programmatic\"),\n    triggerProps,\n    triggerRef() {},\n  };\n}\n"],"mappings":";AAEA,SAAS,QAAQ,UAAU,4BAA4B;AAOvD,SAAS,OAAO,iCAAiC;AACjD,SAAS,uBAAuB;AAChC;AAAA,EACE;AAAA,OAEK;AA0BA,SAAS,WAAW;AAAA,EACzB,cAAc;AAAA,EACd,IAAI;AAAA,EACJ,OAAO;AAAA,EACP;AAAA,EACA,MAAM;AACR,IAAuB,CAAC,GAAqB;AAC3C,QAAM,cAAc,MAAM;AAC1B,QAAM,KAAK,eAAe;AAC1B,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA6B,IAAI;AAC3D,QAAM,EAAE,MAAM,cAAc,IAAI,0BAA0B;AAAA,IACxD;AAAA,IACA;AAAA,IACA,MAAM;AAAA,EACR,CAAC;AACD,QAAM,UAAU,OAAO,IAAI;AAC3B,UAAQ,UAAU;AAElB,QAAM,WAAW;AAAA,IACf,MAAM,MAAM;AAAA,IAAC;AAAA,IACb,MAAM,gBAAgB;AAAA,IACtB,MAAM;AAAA,EACR;AAEA,4BAA0B,MAAM;AAC9B,QAAI,CAAC,SAAS,CAAC,SAAU;AAEzB,UAAM,iBAAiB,CAAC,UAAiB;AACvC,YAAM,OAAQ,MAA0B,aAAa;AACrD,UAAI,SAAS,QAAQ,WAAW,CAAC,cAAc,MAAM,iBAAiB,KAAK,GAAG;AAC5E,cAAM,eAAe;AAAA,MACvB;AAAA,IACF;AACA,UAAM,iBAAiB,gBAAgB,cAAc;AACrD,WAAO,MAAM,MAAM,oBAAoB,gBAAgB,cAAc;AAAA,EACvE,GAAG,CAAC,UAAU,OAAO,aAAa,CAAC;AAEnC,4BAA0B,MAAM;AAC9B,QAAI,CAAC,SAAS,CAAC,SAAU;AACzB,QAAI;AACF,UAAI,QAAQ,CAAC,MAAM,QAAQ,eAAe,EAAG,OAAM,YAAY;AAC/D,UAAI,CAAC,QAAQ,MAAM,QAAQ,eAAe,EAAG,OAAM,YAAY;AAAA,IACjE,QAAQ;AAAA,IAER;AAAA,EACF,GAAG,CAAC,UAAU,MAAM,KAAK,CAAC;AAE1B,QAAM,eAAe;AAAA,IACnB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,QAAQ,OAA2C;AACjD,YAAM,WAAW;AAAA,QACf,CAAC;AAAA,QACD,WAAW,kBAAkB;AAAA,QAC7B,MAAM;AAAA,MACR;AAGA,UAAI,YAAY,CAAC,SAAU,OAAM,eAAe;AAAA,IAClD;AAAA,IACA,MAAM;AAAA,IACN,GAAI,WAAW,EAAE,SAAS,kBAAkB,YAAY,GAAG,IAAI,CAAC;AAAA,EAClE;AAEA,QAAM,aAAa;AAAA,IACjB,eAAe,WAAW,KAAK;AAAA,IAC/B,QAAQ,WAAW,SAAY,CAAC;AAAA,IAChC;AAAA,IACA,GAAI,WAAW,EAAE,SAAS,KAAK,IAAI,CAAC;AAAA,IACpC,GAAI,YAAY,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;AAAA,EAC3C;AAEA,SAAO;AAAA,IACL,OAAO,MAAM,cAAc,OAAO,cAAc;AAAA,IAChD;AAAA,IACA;AAAA,IACA,aAAa,MAAM,cAAc,MAAM,cAAc;AAAA,IACrD;AAAA,IACA,UAAU;AAAA,IACV,QAAQ,MAAM,cAAc,CAAC,MAAM,cAAc;AAAA,IACjD;AAAA,IACA,aAAa;AAAA,IAAC;AAAA,EAChB;AACF;","names":[]}

package/dist/elements/choice/Choice.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Choice.d.ts","sourceRoot":"","sources":["../../../src/elements/choice/Choice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEpE;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAajE;yBAbe,WAAW;;;AAgB3B;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAsD/D;yBAtDe,UAAU;;;AAyD1B,eAAO,MAAM,MAAM;;;CAGlB,CAAC"}
+{"version":3,"file":"Choice.d.ts","sourceRoot":"","sources":["../../../src/elements/choice/Choice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAWpE;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAcjE;yBAde,WAAW;;;AAiB3B;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CA0F/D;yBA1Fe,UAAU;;;AA6F1B,eAAO,MAAM,MAAM;;;CAGlB,CAAC"}

package/dist/elements/choice/Choice.js

@@ -1,5 +1,10 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { choiceGroupName, choiceIds } from "./ids.js";
+function omitOwnedProps(props, keys) {
+  const result = { ...props };
+  for (const key of keys) delete result[key];
+  return result;
+}
 function ChoiceGroup(props) {
   const {
     children,
@@ -8,7 +13,8 @@ function ChoiceGroup(props) {
     orientation = "horizontal",
     ...consumerProps
   } = props;
-  return /* @__PURE__ */ jsx("div", { ...consumerProps, "data-orientation": orientation, "data-uiify-choice": "", children });
+  const nativeProps = omitOwnedProps(consumerProps, ["children", "dangerouslySetInnerHTML"]);
+  return /* @__PURE__ */ jsx("div", { ...nativeProps, "data-orientation": orientation, "data-uiify-choice": "", children });
 }
 ChoiceGroup.displayName = "ChoiceGroup";
 function ChoiceItem(props) {
@@ -17,24 +23,53 @@ function ChoiceItem(props) {
     checked,
     disabled = false,
     groupId,
-    inputProps,
     kind,
     label,
     labelPart = false,
-    labelProps,
     name,
     onValueChange,
     panel,
-    panelProps,
+    slotProps,
     part = "item",
     value,
     ...consumerProps
   } = props;
   const isControlled = checked !== void 0;
+  const wrapperProps = omitOwnedProps(consumerProps, [
+    "children",
+    "dangerouslySetInnerHTML",
+    "data-part",
+    "data-uiify-choice"
+  ]);
+  const inputProps = omitOwnedProps(slotProps?.input, [
+    "children",
+    "dangerouslySetInnerHTML",
+    "aria-labelledby",
+    "checked",
+    "defaultChecked",
+    "disabled",
+    "id",
+    "name",
+    "type",
+    "value"
+  ]);
+  const labelProps = omitOwnedProps(slotProps?.label, [
+    "children",
+    "dangerouslySetInnerHTML",
+    "htmlFor",
+    "id",
+    "data-part"
+  ]);
+  const panelProps = omitOwnedProps(slotProps?.panel, [
+    "children",
+    "dangerouslySetInnerHTML",
+    "id",
+    "data-part"
+  ]);
   const { controlId, labelId, panelId } = choiceIds(groupId, value);
   const groupName = name ?? choiceGroupName(groupId, kind);
   const inputType = kind === "single" ? "radio" : "checkbox";
-  return /* @__PURE__ */ jsxs("div", { ...consumerProps, "data-part": part, "data-uiify-choice": "", children: [
+  return /* @__PURE__ */ jsxs("div", { ...wrapperProps, "data-part": part, "data-uiify-choice": "", children: [
     /* @__PURE__ */ jsx(
       "input",
       {
@@ -46,7 +81,12 @@ function ChoiceItem(props) {
         name: groupName,
         type: inputType,
         value,
-        ...onValueChange ? { onChange: () => onValueChange(value) } : {}
+        ...onValueChange ? {
+          onChange: (event) => {
+            slotProps?.input?.onChange?.(event);
+            if (!event.defaultPrevented) onValueChange(event.currentTarget.value);
+          }
+        } : {}
       }
     ),
     /* @__PURE__ */ jsx(
@@ -55,7 +95,7 @@ function ChoiceItem(props) {
         ...labelProps,
         htmlFor: controlId,
         id: labelId,
-        ...labelPart ? { "data-part": "label" } : {},
+        ...labelPart ? { "data-part": labelPart === true ? "label" : labelPart } : {},
         children: label
       }
     ),

package/dist/elements/choice/Choice.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/choice/Choice.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { choiceGroupName, choiceIds } from \"./ids.js\";\nimport type { ChoiceGroupProps, ChoiceItemProps } from \"./types.js\";\n\n/**\n * A group of `Choice.Item`s. Purely a marked, oriented `<div>` — the actual `<input>`s are\n * siblings-by-id, not parent/child data flow (no `useContext`, no `cloneElement`: Tier 0 bans\n * both). Emits `data-orientation` and `data-uiify-choice`.\n */\nexport function ChoiceGroup(props: ChoiceGroupProps): ReactElement {\n  const {\n    children,\n    kind: _kind,\n    name: _name,\n    orientation = \"horizontal\",\n    ...consumerProps\n  } = props;\n  return (\n    <div {...consumerProps} data-orientation={orientation} data-uiify-choice=\"\">\n      {children}\n    </div>\n  );\n}\nChoiceGroup.displayName = \"ChoiceGroup\";\n\n/**\n * One radio/checkbox choice: an `<input>`, its `<label>`, and an optional panel. `groupId` and\n * `kind` are explicit (see `ChoiceGroupOwnProps.id`) — this part does not read them from its\n * `Choice.Group` ancestor. Emits `data-uiify-choice` and `data-part` (default `\"item\"`) on the\n * wrapper.\n */\nexport function ChoiceItem(props: ChoiceItemProps): ReactElement {\n  const {\n    defaultChecked = false,\n    checked,\n    disabled = false,\n    groupId,\n    inputProps,\n    kind,\n    label,\n    labelPart = false,\n    labelProps,\n    name,\n    onValueChange,\n    panel,\n    panelProps,\n    part = \"item\",\n    value,\n    ...consumerProps\n  } = props;\n\n  const isControlled = checked !== undefined;\n\n  const { controlId, labelId, panelId } = choiceIds(groupId, value);\n  const groupName = name ?? choiceGroupName(groupId, kind);\n  const inputType = kind === \"single\" ? \"radio\" : \"checkbox\";\n\n  return (\n    <div {...consumerProps} data-part={part} data-uiify-choice=\"\">\n      <input\n        {...inputProps}\n        aria-labelledby={labelId}\n        {...(isControlled ? { checked } : { defaultChecked })}\n        disabled={disabled}\n        id={controlId}\n        name={groupName}\n        type={inputType}\n        value={value}\n        {...(onValueChange ? { onChange: () => onValueChange(value) } : {})}\n      />\n      <label\n        {...labelProps}\n        htmlFor={controlId}\n        id={labelId}\n        {...(labelPart ? { \"data-part\": \"label\" } : {})}\n      >\n        {label}\n      </label>\n      {panel === undefined ? null : (\n        <div {...panelProps} data-part=\"panel\" id={panelId}>\n          {panel}\n        </div>\n      )}\n    </div>\n  );\n}\nChoiceItem.displayName = \"ChoiceItem\";\n\nexport const Choice = {\n  Group: ChoiceGroup,\n  Item: ChoiceItem,\n};\n"],"mappings":"AAkBI,cAwCA,YAxCA;AAjBJ,SAAS,iBAAiB,iBAAiB;AAQpC,SAAS,YAAY,OAAuC;AACjE,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,IACN,MAAM;AAAA,IACN,cAAc;AAAA,IACd,GAAG;AAAA,EACL,IAAI;AACJ,SACE,oBAAC,SAAK,GAAG,eAAe,oBAAkB,aAAa,qBAAkB,IACtE,UACH;AAEJ;AACA,YAAY,cAAc;AAQnB,SAAS,WAAW,OAAsC;AAC/D,QAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,eAAe,YAAY;AAEjC,QAAM,EAAE,WAAW,SAAS,QAAQ,IAAI,UAAU,SAAS,KAAK;AAChE,QAAM,YAAY,QAAQ,gBAAgB,SAAS,IAAI;AACvD,QAAM,YAAY,SAAS,WAAW,UAAU;AAEhD,SACE,qBAAC,SAAK,GAAG,eAAe,aAAW,MAAM,qBAAkB,IACzD;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,mBAAiB;AAAA,QAChB,GAAI,eAAe,EAAE,QAAQ,IAAI,EAAE,eAAe;AAAA,QACnD;AAAA,QACA,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,MAAM;AAAA,QACN;AAAA,QACC,GAAI,gBAAgB,EAAE,UAAU,MAAM,cAAc,KAAK,EAAE,IAAI,CAAC;AAAA;AAAA,IACnE;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACH,GAAI,YAAY,EAAE,aAAa,QAAQ,IAAI,CAAC;AAAA,QAE5C;AAAA;AAAA,IACH;AAAA,IACC,UAAU,SAAY,OACrB,oBAAC,SAAK,GAAG,YAAY,aAAU,SAAQ,IAAI,SACxC,iBACH;AAAA,KAEJ;AAEJ;AACA,WAAW,cAAc;AAElB,MAAM,SAAS;AAAA,EACpB,OAAO;AAAA,EACP,MAAM;AACR;","names":[]}
+{"version":3,"sources":["../../../src/elements/choice/Choice.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { choiceGroupName, choiceIds } from \"./ids.js\";\nimport type { ChoiceGroupProps, ChoiceItemProps } from \"./types.js\";\n\nfunction omitOwnedProps<TProps extends object>(\n  props: TProps | undefined,\n  keys: readonly string[],\n): TProps {\n  const result = { ...props } as Record<string, unknown>;\n  for (const key of keys) delete result[key];\n  return result as TProps;\n}\n\n/**\n * A group of `Choice.Item`s. Purely a marked, oriented `<div>` — the actual `<input>`s are\n * siblings-by-id, not parent/child data flow (no `useContext`, no `cloneElement`: Tier 0 bans\n * both). Emits `data-orientation` and `data-uiify-choice`.\n */\nexport function ChoiceGroup(props: ChoiceGroupProps): ReactElement {\n  const {\n    children,\n    kind: _kind,\n    name: _name,\n    orientation = \"horizontal\",\n    ...consumerProps\n  } = props;\n  const nativeProps = omitOwnedProps(consumerProps, [\"children\", \"dangerouslySetInnerHTML\"]);\n  return (\n    <div {...nativeProps} data-orientation={orientation} data-uiify-choice=\"\">\n      {children}\n    </div>\n  );\n}\nChoiceGroup.displayName = \"ChoiceGroup\";\n\n/**\n * One radio/checkbox choice: an `<input>`, its `<label>`, and an optional panel. `groupId` and\n * `kind` are explicit (see `ChoiceGroupOwnProps.id`) — this part does not read them from its\n * `Choice.Group` ancestor. Emits `data-uiify-choice` and `data-part` (default `\"item\"`) on the\n * wrapper.\n */\nexport function ChoiceItem(props: ChoiceItemProps): ReactElement {\n  const {\n    defaultChecked = false,\n    checked,\n    disabled = false,\n    groupId,\n    kind,\n    label,\n    labelPart = false,\n    name,\n    onValueChange,\n    panel,\n    slotProps,\n    part = \"item\",\n    value,\n    ...consumerProps\n  } = props;\n\n  const isControlled = checked !== undefined;\n  const wrapperProps = omitOwnedProps(consumerProps, [\n    \"children\",\n    \"dangerouslySetInnerHTML\",\n    \"data-part\",\n    \"data-uiify-choice\",\n  ]);\n  const inputProps = omitOwnedProps(slotProps?.input, [\n    \"children\",\n    \"dangerouslySetInnerHTML\",\n    \"aria-labelledby\",\n    \"checked\",\n    \"defaultChecked\",\n    \"disabled\",\n    \"id\",\n    \"name\",\n    \"type\",\n    \"value\",\n  ]);\n  const labelProps = omitOwnedProps(slotProps?.label, [\n    \"children\",\n    \"dangerouslySetInnerHTML\",\n    \"htmlFor\",\n    \"id\",\n    \"data-part\",\n  ]);\n  const panelProps = omitOwnedProps(slotProps?.panel, [\n    \"children\",\n    \"dangerouslySetInnerHTML\",\n    \"id\",\n    \"data-part\",\n  ]);\n\n  const { controlId, labelId, panelId } = choiceIds(groupId, value);\n  const groupName = name ?? choiceGroupName(groupId, kind);\n  const inputType = kind === \"single\" ? \"radio\" : \"checkbox\";\n\n  return (\n    <div {...wrapperProps} data-part={part} data-uiify-choice=\"\">\n      <input\n        {...inputProps}\n        aria-labelledby={labelId}\n        {...(isControlled ? { checked } : { defaultChecked })}\n        disabled={disabled}\n        id={controlId}\n        name={groupName}\n        type={inputType}\n        value={value}\n        {...(onValueChange\n          ? {\n              onChange: (event) => {\n                slotProps?.input?.onChange?.(event);\n                if (!event.defaultPrevented) onValueChange(event.currentTarget.value);\n              },\n            }\n          : {})}\n      />\n      <label\n        {...labelProps}\n        htmlFor={controlId}\n        id={labelId}\n        {...(labelPart ? { \"data-part\": labelPart === true ? \"label\" : labelPart } : {})}\n      >\n        {label}\n      </label>\n      {panel === undefined ? null : (\n        <div {...panelProps} data-part=\"panel\" id={panelId}>\n          {panel}\n        </div>\n      )}\n    </div>\n  );\n}\nChoiceItem.displayName = \"ChoiceItem\";\n\nexport const Choice = {\n  Group: ChoiceGroup,\n  Item: ChoiceItem,\n};\n"],"mappings":"AA4BI,cAqEA,YArEA;AA3BJ,SAAS,iBAAiB,iBAAiB;AAG3C,SAAS,eACP,OACA,MACQ;AACR,QAAM,SAAS,EAAE,GAAG,MAAM;AAC1B,aAAW,OAAO,KAAM,QAAO,OAAO,GAAG;AACzC,SAAO;AACT;AAOO,SAAS,YAAY,OAAuC;AACjE,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,IACN,MAAM;AAAA,IACN,cAAc;AAAA,IACd,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,cAAc,eAAe,eAAe,CAAC,YAAY,yBAAyB,CAAC;AACzF,SACE,oBAAC,SAAK,GAAG,aAAa,oBAAkB,aAAa,qBAAkB,IACpE,UACH;AAEJ;AACA,YAAY,cAAc;AAQnB,SAAS,WAAW,OAAsC;AAC/D,QAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,eAAe,YAAY;AACjC,QAAM,eAAe,eAAe,eAAe;AAAA,IACjD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,aAAa,eAAe,WAAW,OAAO;AAAA,IAClD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,aAAa,eAAe,WAAW,OAAO;AAAA,IAClD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,aAAa,eAAe,WAAW,OAAO;AAAA,IAClD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,EAAE,WAAW,SAAS,QAAQ,IAAI,UAAU,SAAS,KAAK;AAChE,QAAM,YAAY,QAAQ,gBAAgB,SAAS,IAAI;AACvD,QAAM,YAAY,SAAS,WAAW,UAAU;AAEhD,SACE,qBAAC,SAAK,GAAG,cAAc,aAAW,MAAM,qBAAkB,IACxD;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,mBAAiB;AAAA,QAChB,GAAI,eAAe,EAAE,QAAQ,IAAI,EAAE,eAAe;AAAA,QACnD;AAAA,QACA,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,MAAM;AAAA,QACN;AAAA,QACC,GAAI,gBACD;AAAA,UACE,UAAU,CAAC,UAAU;AACnB,uBAAW,OAAO,WAAW,KAAK;AAClC,gBAAI,CAAC,MAAM,iBAAkB,eAAc,MAAM,cAAc,KAAK;AAAA,UACtE;AAAA,QACF,IACA,CAAC;AAAA;AAAA,IACP;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACH,GAAI,YAAY,EAAE,aAAa,cAAc,OAAO,UAAU,UAAU,IAAI,CAAC;AAAA,QAE7E;AAAA;AAAA,IACH;AAAA,IACC,UAAU,SAAY,OACrB,oBAAC,SAAK,GAAG,YAAY,aAAU,SAAQ,IAAI,SACxC,iBACH;AAAA,KAEJ;AAEJ;AACA,WAAW,cAAc;AAElB,MAAM,SAAS;AAAA,EACpB,OAAO;AAAA,EACP,MAAM;AACR;","names":[]}

package/dist/elements/choice/index.d.ts

@@ -1,4 +1,4 @@
 export { Choice, ChoiceGroup, ChoiceItem } from "./Choice.js";
 export { choiceGroupName, choiceIds } from "./ids.js";
-export type { ChoiceGroupOwnProps, ChoiceGroupProps, ChoiceItemOwnProps, ChoiceItemProps, ChoiceKind, ChoiceOrientation, } from "./types.js";
+export type { ChoiceGroupOwnProps, ChoiceGroupProps, ChoiceInputSlotProps, ChoiceItemOwnProps, ChoiceItemProps, ChoiceItemSlotProps, ChoiceKind, ChoiceLabelSlotProps, ChoiceOrientation, ChoicePanelSlotProps, } from "./types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/choice/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/choice/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACtD,YAAY,EACV,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,eAAe,EACf,UAAU,EACV,iBAAiB,GAClB,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/choice/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACtD,YAAY,EACV,mBAAmB,EACnB,gBAAgB,EAChB,oBAAoB,EACpB,kBAAkB,EAClB,eAAe,EACf,mBAAmB,EACnB,UAAU,EACV,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,GACrB,MAAM,YAAY,CAAC"}

package/dist/elements/choice/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/choice/index.ts"],"sourcesContent":["export { Choice, ChoiceGroup, ChoiceItem } from \"./Choice.js\";\nexport { choiceGroupName, choiceIds } from \"./ids.js\";\nexport type {\n  ChoiceGroupOwnProps,\n  ChoiceGroupProps,\n  ChoiceItemOwnProps,\n  ChoiceItemProps,\n  ChoiceKind,\n  ChoiceOrientation,\n} from \"./types.js\";\n"],"mappings":"AAAA,SAAS,QAAQ,aAAa,kBAAkB;AAChD,SAAS,iBAAiB,iBAAiB;","names":[]}
+{"version":3,"sources":["../../../src/elements/choice/index.ts"],"sourcesContent":["export { Choice, ChoiceGroup, ChoiceItem } from \"./Choice.js\";\nexport { choiceGroupName, choiceIds } from \"./ids.js\";\nexport type {\n  ChoiceGroupOwnProps,\n  ChoiceGroupProps,\n  ChoiceInputSlotProps,\n  ChoiceItemOwnProps,\n  ChoiceItemProps,\n  ChoiceItemSlotProps,\n  ChoiceKind,\n  ChoiceLabelSlotProps,\n  ChoiceOrientation,\n  ChoicePanelSlotProps,\n} from \"./types.js\";\n"],"mappings":"AAAA,SAAS,QAAQ,aAAa,kBAAkB;AAChD,SAAS,iBAAiB,iBAAiB;","names":[]}

package/dist/elements/choice/types.d.ts

@@ -1,4 +1,7 @@
 import type { ComponentPropsWithRef, ReactNode } from "react";
+export interface ConsumerDataAttributes {
+    readonly [attribute: `data-${string}`]: string | number | boolean | undefined;
+}
 /** `"single"` renders `type="radio"`; `"multiple"` renders `type="checkbox"`. */
 export type ChoiceKind = "single" | "multiple";
 export type ChoiceOrientation = "horizontal" | "vertical";
@@ -21,7 +24,23 @@ export interface ChoiceGroupOwnProps {
      */
     readonly name?: string;
 }
-export type ChoiceGroupProps = ChoiceGroupOwnProps & Omit<ComponentPropsWithRef<"div">, keyof ChoiceGroupOwnProps>;
+export type ChoiceGroupProps = ChoiceGroupOwnProps & Omit<ComponentPropsWithRef<"div">, keyof ChoiceGroupOwnProps | "dangerouslySetInnerHTML">;
+export type ChoiceInputSlotProps = Omit<ComponentPropsWithRef<"input">, "children" | "dangerouslySetInnerHTML" | "aria-labelledby" | "checked" | "defaultChecked" | "disabled" | "id" | "name" | "type" | "value" | "data-part" | "data-uiify-choice" | "data-uiify-radio"> & ConsumerDataAttributes & {
+    readonly "data-part"?: never;
+    readonly "data-uiify-choice"?: never;
+    readonly "data-uiify-radio"?: never;
+};
+export type ChoiceLabelSlotProps = Omit<ComponentPropsWithRef<"label">, "children" | "dangerouslySetInnerHTML" | "htmlFor" | "id" | "data-part"> & ConsumerDataAttributes & {
+    readonly "data-part"?: never;
+};
+export type ChoicePanelSlotProps = Omit<ComponentPropsWithRef<"div">, "children" | "dangerouslySetInnerHTML" | "id" | "data-part"> & ConsumerDataAttributes & {
+    readonly "data-part"?: never;
+};
+export interface ChoiceItemSlotProps {
+    readonly input?: ChoiceInputSlotProps;
+    readonly label?: ChoiceLabelSlotProps;
+    readonly panel?: ChoicePanelSlotProps;
+}
 export interface ChoiceItemOwnProps {
     readonly value: string;
     /** Rendered inside the `<label>`. */
@@ -40,14 +59,10 @@ export interface ChoiceItemOwnProps {
     readonly disabled?: boolean;
     /** Wrapper `data-part`. Defaults to `"item"`. */
     readonly part?: string;
-    /** Adds `data-part="label"` to the `<label>`. */
-    readonly labelPart?: boolean;
-    /** Escape hatch: extra attributes spread onto the `<input>` (for example, `data-part="control"`). */
-    readonly inputProps?: Record<string, unknown>;
-    /** Escape hatch: extra attributes spread onto the `<label>`. */
-    readonly labelProps?: Record<string, unknown>;
-    /** Escape hatch: extra attributes spread onto the panel `<div>`. */
-    readonly panelProps?: Record<string, unknown>;
+    /** Adds an owned `data-part` marker to the `<label>`; `true` means `"label"`. */
+    readonly labelPart?: boolean | string;
+    /** Native props for the generated input, label and optional panel. */
+    readonly slotProps?: ChoiceItemSlotProps;
     /**
      * Client-only: attaches to the input's native `change`. Passing it does not make this
      * element a client component — the *caller* must already be one. Omitted by every
@@ -55,5 +70,5 @@ export interface ChoiceItemOwnProps {
      */
     readonly onValueChange?: (value: string) => void;
 }
-export type ChoiceItemProps = ChoiceItemOwnProps & Omit<ComponentPropsWithRef<"div">, keyof ChoiceItemOwnProps | "children">;
+export type ChoiceItemProps = ChoiceItemOwnProps & Omit<ComponentPropsWithRef<"div">, keyof ChoiceItemOwnProps | "children" | "dangerouslySetInnerHTML">;
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/choice/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/choice/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,iFAAiF;AACjF,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE/C,MAAM,MAAM,iBAAiB,GAAG,YAAY,GAAG,UAAU,CAAC;AAE1D,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAC;IAC1B,QAAQ,CAAC,WAAW,CAAC,EAAE,iBAAiB,CAAC;IACzC;;;;;OAKG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,gBAAgB,GAAG,mBAAmB,GAChD,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,mBAAmB,CAAC,CAAC;AAEhE,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,oFAAoF;IACpF,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,iFAAiF;IACjF,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAC;IAC1B,gFAAgF;IAChF,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,qDAAqD;IACrD,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClC,kEAAkE;IAClE,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,iDAAiD;IACjD,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,iDAAiD;IACjD,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,qGAAqG;IACrG,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,gEAAgE;IAChE,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,oEAAoE;IACpE,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C;;;;OAIG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AAED,MAAM,MAAM,eAAe,GAAG,kBAAkB,GAC9C,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,kBAAkB,GAAG,UAAU,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/choice/types.ts"],"names":[],"mappings":"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"}

package/dist/hooks/use-isomorphic-layout-effect.d.ts

@@ -1,7 +1,7 @@
-import { useEffect } from "react";
+import { useLayoutEffect } from "react";
 /**
  * `useLayoutEffect` in the browser, `useEffect` on the server — avoids React's
  * "useLayoutEffect does nothing on the server" warning during SSR.
  */
-export declare const useIsomorphicLayoutEffect: typeof useEffect;
+export declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
 //# sourceMappingURL=use-isomorphic-layout-effect.d.ts.map

package/dist/hooks/use-isomorphic-layout-effect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-isomorphic-layout-effect.d.ts","sourceRoot":"","sources":["../../src/hooks/use-isomorphic-layout-effect.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAmB,MAAM,OAAO,CAAC;AAEnD;;;GAGG;AACH,eAAO,MAAM,yBAAyB,kBACuB,CAAC"}
+{"version":3,"file":"use-isomorphic-layout-effect.d.ts","sourceRoot":"","sources":["../../src/hooks/use-isomorphic-layout-effect.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,eAAe,EAAE,MAAM,OAAO,CAAC;AAEnD;;;GAGG;AACH,eAAO,MAAM,yBAAyB,wBACuB,CAAC"}