@pzerelles/headlessui-svelte 2.1.2-next.7 → 2.1.2-next.8

package/dist/transition/TransitionChild.svelte

@@ -1,36 +1,16 @@
-<script lang="ts" module>
-  import type { ElementType, Props } from "../utils/types.js"
-  import { RenderFeatures, type PropsForFeatures } from "../utils/render.js"
-  import type { TransitionEvents, TransitionClasses } from "./context.svelte.js"
-
-  type TransitionChildPropsWeControl = never
-
-  export type TransitionChildProps<TTag extends ElementType> = Props<
-    TTag,
-    TransitionChildRenderPropArg,
-    TransitionChildPropsWeControl,
-    PropsForFeatures<typeof TransitionChildRenderFeatures> &
-      TransitionClasses &
-      TransitionEvents & { transition?: boolean; appear?: boolean }
-  >
-
-  export const DEFAULT_TRANSITION_CHILD_TAG = "svelte:fragment"
-  export type TransitionChildRenderPropArg = HTMLElement
-  export const TransitionChildRenderFeatures = RenderFeatures.RenderStrategy
+<script lang="ts" module>import { RenderFeatures } from "../utils/render.js";
+export const DEFAULT_TRANSITION_CHILD_TAG = "svelte:fragment";
+export const TransitionChildRenderFeatures = RenderFeatures.RenderStrategy;
 </script>
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG">
-  import { useOpenClosed } from "../internal/open-closed.js"
-  import { getContext } from "svelte"
-  import InternalTransitionChild from "./InternalTransitionChild.svelte"
-  import Transition from "./Transition.svelte"
-
-  const hasTransitionContext = !!getContext("TransitionContext")
-  const hasOpenClosedContext = useOpenClosed() !== null
-
-  let { ref = $bindable(), as, ...props }: { as?: TTag } & TransitionChildProps<TTag> = $props()
-
-  const TransitionRootOrChild = !hasTransitionContext && hasOpenClosedContext ? Transition : InternalTransitionChild
+<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG">import { useOpenClosed } from "../internal/open-closed.js";
+import { getContext } from "svelte";
+import InternalTransitionChild from "./InternalTransitionChild.svelte";
+import Transition from "./Transition.svelte";
+const hasTransitionContext = !!getContext("TransitionContext");
+const hasOpenClosedContext = useOpenClosed() !== null;
+let { ref = $bindable(), as, ...props } = $props();
+const TransitionRootOrChild = !hasTransitionContext && hasOpenClosedContext ? Transition : InternalTransitionChild;
 </script>
 
 <TransitionRootOrChild bind:ref {...props} />

package/dist/utils/ElementOrComponent.svelte

@@ -1,47 +1,26 @@
-<script lang="ts" generics="TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue">
-  import type { ElementType, Props } from "./types.js"
-  import { mergePropsAdvanced, RenderFeatures, RenderStrategy, type PropsForFeatures } from "./render.js"
-  import Generic from "./Generic.svelte"
-  import type { ComponentProps } from "svelte"
-
-  let {
-    ourProps,
-    theirProps,
-    slots,
-    slot = slots,
-    defaultTag,
-    features,
-    visible = true,
-    name,
-    ref = $bindable(),
-    value = $bindable(),
-    checked = $bindable(),
-  }: {
-    ourProps?: Expand<Props<any, TSlot> & PropsForFeatures<TFeature>>
-    theirProps: Expand<{ as?: TTag } & Props<any, TSlot, any>>
-    slot?: TSlot
-    slots?: TSlot
-    defaultTag: ElementType
-    features?: TFeature
-    visible?: boolean
-    name: string
-    ref?: HTMLElement
-    value?: TValue
-    checked?: boolean
-  } = $props()
-
-  const featureFlags = $derived(features ?? RenderFeatures.None)
-  const { static: isStatic = false, unmount = true, ...rest } = $derived(mergePropsAdvanced(theirProps, ourProps ?? {}))
-  const render = $derived(
-    visible ||
-      (featureFlags & RenderFeatures.Static && isStatic) ||
-      (featureFlags & RenderFeatures.RenderStrategy && !unmount)
-  )
-  const hiddenProps = $derived(
-    !visible && !(featureFlags & RenderFeatures.Static) && featureFlags & RenderFeatures.RenderStrategy && !unmount
-      ? { hidden: true, style: "display: none;" }
-      : {}
-  )
+<script lang="ts" generics="TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue">import { mergePropsAdvanced, RenderFeatures, RenderStrategy } from "./render.js";
+import Generic from "./Generic.svelte";
+let {
+  ourProps,
+  theirProps,
+  slots,
+  slot = slots,
+  defaultTag,
+  features,
+  visible = true,
+  name,
+  ref = $bindable(),
+  value = $bindable(),
+  checked = $bindable()
+} = $props();
+const featureFlags = $derived(features ?? RenderFeatures.None);
+const { static: isStatic = false, unmount = true, ...rest } = $derived(mergePropsAdvanced(theirProps, ourProps ?? {}));
+const render = $derived(
+  visible || featureFlags & RenderFeatures.Static && isStatic || featureFlags & RenderFeatures.RenderStrategy && !unmount
+);
+const hiddenProps = $derived(
+  !visible && !(featureFlags & RenderFeatures.Static) && featureFlags & RenderFeatures.RenderStrategy && !unmount ? { hidden: true, style: "display: none;" } : {}
+);
 </script>
 
 {#if render}<Generic {...rest} {...hiddenProps} {slot} tag={defaultTag} {name} bind:ref bind:value bind:checked />{/if}

package/dist/utils/Generic.svelte

@@ -1,32 +1,20 @@
-<script lang="ts" generics="TTag extends keyof SvelteHTMLProps, TSlot, TValue">
-  import { stateFromSlot } from "./state.js"
-  import type { ElementType, Props, SvelteHTMLProps } from "./types.js"
-
-  let {
-    slot = {} as TSlot,
-    tag,
-    name,
-    ref = $bindable(),
-    value = $bindable(),
-    checked = $bindable(),
-    children,
-    as = tag as TTag,
-    unmount,
-    static: isStatic,
-    ...props
-  }: {
-    as?: TTag
-    slot: TSlot
-    tag: ElementType
-    name: string
-    ref?: HTMLElement
-    value?: TValue
-    checked?: boolean
-  } & Props<TTag, TSlot> = $props()
-
-  const resolvedClass = $derived(
-    typeof props.class === "function" ? props.class(slot) : (props.class as string | undefined)
-  )
+<script lang="ts" generics="TTag extends keyof SvelteHTMLProps, TSlot, TValue">import { stateFromSlot } from "./state.js";
+let {
+  slot = {},
+  tag,
+  name,
+  ref = $bindable(),
+  value = $bindable(),
+  checked = $bindable(),
+  children,
+  as = tag,
+  unmount,
+  static: isStatic,
+  ...props
+} = $props();
+const resolvedClass = $derived(
+  typeof props.class === "function" ? props.class(slot) : props.class
+);
 </script>
 
 {#if as === "svelte:fragment"}

package/dist/utils/StableCollection.svelte

@@ -1,61 +1,43 @@
-<script lang="ts" module>
-  import { useId } from "../hooks/use-id.js"
-  import { getContext, setContext, type Snippet } from "svelte"
-
-  type CollectionKey = string | symbol
-  type CollectionItem = [number, () => void]
-  type Collection = ReturnType<typeof createCollection>
-
-  function createCollection() {
-    return {
-      /** @type {Map<string, Map<string, number>>} */
-      groups: new Map(),
-
-      get(group: string, key: CollectionKey): CollectionItem {
-        let list = this.groups.get(group)
-        if (!list) {
-          list = new Map()
-          this.groups.set(group, list)
-        }
-
-        let renders = list.get(key) ?? 0
-        // FIXME: This is a side-effect during render. `release` is only called in
-        // an effect cleanup so we may never release if we had to render multiple
-        // times before commit e.g. when a sibling suspends.
-        list.set(key, renders + 1)
-
-        let index = Array.from(list.keys()).indexOf(key)
-        function release() {
-          let renders = list.get(key)
-          if (renders > 1) {
-            list.set(key, renders - 1)
-          } else {
-            list.delete(key)
-          }
+<script lang="ts" module>import { useId } from "../hooks/use-id.js";
+import { getContext, setContext } from "svelte";
+function createCollection() {
+  return {
+    /** @type {Map<string, Map<string, number>>} */
+    groups: /* @__PURE__ */ new Map(),
+    get(group, key) {
+      let list = this.groups.get(group);
+      if (!list) {
+        list = /* @__PURE__ */ new Map();
+        this.groups.set(group, list);
+      }
+      let renders = list.get(key) ?? 0;
+      list.set(key, renders + 1);
+      let index = Array.from(list.keys()).indexOf(key);
+      function release() {
+        let renders2 = list.get(key);
+        if (renders2 > 1) {
+          list.set(key, renders2 - 1);
+        } else {
+          list.delete(key);
         }
-
-        return [index, release]
-      },
+      }
+      return [index, release];
     }
-  }
-
-  export function useStableCollectionIndex(group: string) {
-    let collection = getContext<Collection>("StableCollection")
-    if (!collection) throw new Error("You must wrap your component in a <StableCollection>")
-
-    let key = useId()
-    let [idx, cleanupIdx] = collection.get(group, key)
-
-    $effect(() => cleanupIdx)
-    return idx
-  }
+  };
+}
+export function useStableCollectionIndex(group) {
+  let collection = getContext("StableCollection");
+  if (!collection) throw new Error("You must wrap your component in a <StableCollection>");
+  let key = useId();
+  let [idx, cleanupIdx] = collection.get(group, key);
+  $effect(() => cleanupIdx);
+  return idx;
+}
 </script>
 
-<script lang="ts">
-  const collection = createCollection()
-  setContext<Collection>("StableCollection", collection)
-
-  let { children }: { children: Snippet } = $props()
+<script lang="ts">const collection = createCollection();
+setContext("StableCollection", collection);
+let { children } = $props();
 </script>
 
 {#if children}{@render children()}{/if}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pzerelles/headlessui-svelte",
-  "version": "2.1.2-next.7",
+  "version": "2.1.2-next.8",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",