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

package/dist/label/Label.svelte

@@ -1,99 +1,65 @@
-<script lang="ts" module>
-  import type { ElementType, Props, PropsOf } from "../utils/types.js"
-
-  let DEFAULT_LABEL_TAG = "label" as const
-
-  export type LabelProps<TTag extends ElementType = typeof DEFAULT_LABEL_TAG> = Props<TTag> & {
-    passive?: boolean
-    htmlFor?: string
-  }
+<script lang="ts" module>let DEFAULT_LABEL_TAG = "label";
 </script>
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_LABEL_TAG">
-  import { onMount } from "svelte"
-  import { getIdContext, htmlid } from "../utils/id.js"
-  import { useDisabled } from "../hooks/use-disabled.js"
-  import { stateFromSlot } from "../utils/state.js"
-  import ElementOrComponent from "../utils/ElementOrComponent.svelte"
-  import { useLabelContext } from "./context.svelte.js"
-
-  const internalId = htmlid()
-  const context = useLabelContext()
-  const providedHtmlFor = getIdContext()
-  const providedDisabled = useDisabled()
-
-  let {
-    ref = $bindable(),
-    id = `headlessui-label-${internalId}` as PropsOf<TTag>["id"],
-    htmlFor = providedHtmlFor,
-    passive = false,
-    ...theirOriginalProps
-  }: { as?: TTag } & LabelProps<TTag> = $props()
-
-  onMount(() => {
-    context.register(id)
-  })
-
-  let handleClick = (e: MouseEvent) => {
-    let current = e.currentTarget
-
-    // Labels connected to 'real' controls will already click the element. But we don't know that
-    // ahead of time. This will prevent the default click, such that only a single click happens
-    // instead of two. Otherwise this results in a visual no-op.
-    if (current instanceof HTMLLabelElement) {
-      e.preventDefault()
-    }
-
-    if (current instanceof HTMLLabelElement) {
-      let target = document.getElementById(current.getAttribute("for") ?? "")
-      if (target) {
-        // Bail if the target element is disabled
-        let actuallyDisabled = target.getAttribute("disabled")
-        if (actuallyDisabled === "true" || actuallyDisabled === "") {
-          return
-        }
-
-        let ariaDisabled = target.getAttribute("aria-disabled")
-        if (ariaDisabled === "true" || ariaDisabled === "") {
-          return
-        }
-
-        // Ensure we click the element this label is bound to. This is necessary for elements that
-        // immediately require state changes, e.g.: Radio & Checkbox inputs need to be checked (or
-        // unchecked).
-        if (
-          (target instanceof HTMLInputElement && (target.type === "radio" || target.type === "checkbox")) ||
-          target.role === "radio" ||
-          target.role === "checkbox" ||
-          target.role === "switch"
-        ) {
-          target.click()
-        }
-
-        // Move focus to the element, this allows you to start using keyboard shortcuts since the
-        // bound element is now focused.
-        target.focus({ preventScroll: true })
+<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_LABEL_TAG">import { onMount } from "svelte";
+import { getIdContext, htmlid } from "../utils/id.js";
+import { useDisabled } from "../hooks/use-disabled.js";
+import { stateFromSlot } from "../utils/state.js";
+import ElementOrComponent from "../utils/ElementOrComponent.svelte";
+import { useLabelContext } from "./context.svelte.js";
+const internalId = htmlid();
+const context = useLabelContext();
+const providedHtmlFor = getIdContext();
+const providedDisabled = useDisabled();
+let {
+  ref = $bindable(),
+  id = `headlessui-label-${internalId}`,
+  htmlFor = providedHtmlFor,
+  passive = false,
+  ...theirOriginalProps
+} = $props();
+onMount(() => {
+  context.register(id);
+});
+let handleClick = (e) => {
+  let current = e.currentTarget;
+  if (current instanceof HTMLLabelElement) {
+    e.preventDefault();
+  }
+  if (current instanceof HTMLLabelElement) {
+    let target = document.getElementById(current.getAttribute("for") ?? "");
+    if (target) {
+      let actuallyDisabled = target.getAttribute("disabled");
+      if (actuallyDisabled === "true" || actuallyDisabled === "") {
+        return;
+      }
+      let ariaDisabled = target.getAttribute("aria-disabled");
+      if (ariaDisabled === "true" || ariaDisabled === "") {
+        return;
       }
+      if (target instanceof HTMLInputElement && (target.type === "radio" || target.type === "checkbox") || target.role === "radio" || target.role === "checkbox" || target.role === "switch") {
+        target.click();
+      }
+      target.focus({ preventScroll: true });
     }
   }
-
-  const disabled = $derived(providedDisabled.value ?? false)
-  const slot = $derived({ disabled })
-  const ourProps = $derived({
-    id,
-    for: passive ? undefined : htmlFor,
-    onclick: passive ? undefined : handleClick,
-    ...stateFromSlot(slot),
-  })
-
-  const theirProps = $derived.by(() => {
-    if (passive) {
-      const { onclick: _, ...props } = theirOriginalProps
-      return props
-    } else {
-      return theirOriginalProps
-    }
-  })
+};
+const disabled = $derived(providedDisabled.value ?? false);
+const slot = $derived({ disabled });
+const ourProps = $derived({
+  id,
+  for: passive ? void 0 : htmlFor,
+  onclick: passive ? void 0 : handleClick,
+  ...stateFromSlot(slot)
+});
+const theirProps = $derived.by(() => {
+  if (passive) {
+    const { onclick: _, ...props } = theirOriginalProps;
+    return props;
+  } else {
+    return theirOriginalProps;
+  }
+});
 </script>
 
 <ElementOrComponent

package/dist/legend/Legend.svelte

@@ -1,23 +1,8 @@
-<script lang="ts" module>
-  import { Label, type LabelProps } from "../index.js"
-  import type { ElementType, Props } from "../utils/types.js"
-  import type { Component } from "svelte"
-
-  const DEFAULT_LEGEND_TAG = Label as Component<LabelProps, any>
-
-  type LegendRenderPropArg = {}
-  type LegendPropsWeControl = never
-
-  export type LegendProps<TTag extends ElementType = typeof DEFAULT_LEGEND_TAG> = Props<
-    TTag,
-    LegendRenderPropArg,
-    LegendPropsWeControl,
-    {}
-  >
+<script lang="ts" module>import { Label } from "../index.js";
+const DEFAULT_LEGEND_TAG = Label;
 </script>
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_LEGEND_TAG">
-  let { ...props }: { as?: TTag } & LegendProps<TTag> = $props()
+<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_LEGEND_TAG">let { ...props } = $props();
 </script>
 
 <Label as="div" {...props} />