@jovertical/mise-design-system 0.0.0-stage → 1.1.0

package/dist/components/forms/input-group/input-group-button.svelte

@@ -0,0 +1,39 @@
+<!--
+  Origin: the React package 2.23.0 `input-group.tsx` (`InputGroupButton`), itself shadcn/ui new-york `input-group`
+  Svelte: shadcn-svelte `input-group`
+  Diverged: React's `render` prop, which cloned an element, has no Svelte
+    equivalent and is dropped, as `asChild` is.
+-->
+<script lang="ts" module>
+  import type { ButtonProps } from '../../actions/button/button.svelte'
+  import type { InputGroupButtonSize } from './input-group-variants.js'
+
+  export type InputGroupButtonProps = Omit<ButtonProps, 'size'> & {
+    size?: InputGroupButtonSize
+  }
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+  import Button from '../../actions/button/button.svelte'
+  import { inputGroupButtonVariants } from './input-group-variants.js'
+
+  let {
+    ref = $bindable(null),
+    type = 'button',
+    variant = 'ghost',
+    size = 'xs',
+    class: className,
+    ...rest
+  }: InputGroupButtonProps = $props()
+</script>
+
+<Button
+  bind:ref
+  {type}
+  {variant}
+  data-size={size}
+  data-slot="input-group-button"
+  class={cn(inputGroupButtonVariants({ size }), className)}
+  {...rest}
+/>

package/dist/components/forms/input-group/input-group-button.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { ButtonProps } from '../../actions/button/button.svelte';
+import type { InputGroupButtonSize } from './input-group-variants.js';
+export type InputGroupButtonProps = Omit<ButtonProps, 'size'> & {
+    size?: InputGroupButtonSize;
+};
+declare const InputGroupButton: import("svelte").Component<InputGroupButtonProps, {}, "ref">;
+type InputGroupButton = ReturnType<typeof InputGroupButton>;
+export default InputGroupButton;

package/dist/components/forms/input-group/input-group-input.svelte

@@ -0,0 +1,33 @@
+<!--
+  Origin: the React package 2.23.0 `input-group.tsx` (`InputGroupInput`), itself shadcn/ui new-york `input-group`
+  Svelte: shadcn-svelte `input-group`
+  Diverged: none beyond the port. `bind:value` passes through to Input.
+-->
+<script lang="ts" module>
+  import type { InputProps } from '../input/input.svelte'
+
+  export type InputGroupInputProps = InputProps
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+  import Input from '../input/input.svelte'
+
+  let {
+    ref = $bindable(null),
+    value = $bindable(),
+    class: className,
+    ...rest
+  }: InputGroupInputProps = $props()
+</script>
+
+<Input
+  bind:ref
+  bind:value
+  data-slot="input-group-control"
+  class={cn(
+    'flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent',
+    className,
+  )}
+  {...rest}
+/>

package/dist/components/forms/input-group/input-group-input.svelte.d.ts

@@ -0,0 +1,5 @@
+import type { InputProps } from '../input/input.svelte';
+export type InputGroupInputProps = InputProps;
+declare const InputGroupInput: import("svelte").Component<InputProps, {}, "ref" | "value">;
+type InputGroupInput = ReturnType<typeof InputGroupInput>;
+export default InputGroupInput;

package/dist/components/forms/input-group/input-group-text.svelte

@@ -0,0 +1,30 @@
+<!--
+  Origin: the React package 2.23.0 `input-group.tsx` (`InputGroupText`), itself shadcn/ui new-york `input-group`
+  Svelte: shadcn-svelte `input-group`
+  Diverged: none beyond the port.
+-->
+<script lang="ts" module>
+  import type { HTMLAttributes } from 'svelte/elements'
+
+  import type { WithElementRef } from '../../../utils/types.js'
+
+  /** A fixed unit or symbol rather than an interactive addon. */
+  export type InputGroupTextProps = WithElementRef<HTMLAttributes<HTMLSpanElement>>
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let { ref = $bindable(null), class: className, children, ...rest }: InputGroupTextProps = $props()
+</script>
+
+<span
+  bind:this={ref}
+  class={cn(
+    "text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
+    className,
+  )}
+  {...rest}
+>
+  {@render children?.()}
+</span>

package/dist/components/forms/input-group/input-group-text.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import type { WithElementRef } from '../../../utils/types.js';
+/** A fixed unit or symbol rather than an interactive addon. */
+export type InputGroupTextProps = WithElementRef<HTMLAttributes<HTMLSpanElement>>;
+declare const InputGroupText: import("svelte").Component<InputGroupTextProps, {}, "ref">;
+type InputGroupText = ReturnType<typeof InputGroupText>;
+export default InputGroupText;

package/dist/components/forms/input-group/input-group-textarea.svelte

@@ -0,0 +1,39 @@
+<!--
+  Origin: the React package 2.23.0 `input-group.tsx` (`InputGroupTextarea`), itself shadcn/ui new-york `input-group`
+  Svelte: shadcn-svelte `input-group`
+  Diverged: none beyond the port.
+-->
+<script lang="ts" module>
+  import type { HTMLTextareaAttributes } from 'svelte/elements'
+
+  import type { WithElementRef } from '../../../utils/types.js'
+
+  /**
+   * A bare `textarea`, not this package's `Textarea`. That one wraps itself in
+   * a `div` with a counter once `maxlength` is set, which breaks the group's
+   * `>textarea` selectors. A group that wants a count shows it in an addon.
+   */
+  export type InputGroupTextareaProps = WithElementRef<HTMLTextareaAttributes, HTMLTextAreaElement>
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let {
+    ref = $bindable(null),
+    value = $bindable(),
+    class: className,
+    ...rest
+  }: InputGroupTextareaProps = $props()
+</script>
+
+<textarea
+  bind:this={ref}
+  bind:value
+  data-slot="input-group-control"
+  class={cn(
+    'placeholder:text-muted-foreground flex field-sizing-content min-h-16 w-full flex-1 resize-none bg-transparent px-3 py-3 text-base outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+    className,
+  )}
+  {...rest}
+></textarea>

package/dist/components/forms/input-group/input-group-textarea.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { HTMLTextareaAttributes } from 'svelte/elements';
+import type { WithElementRef } from '../../../utils/types.js';
+/**
+ * A bare `textarea`, not this package's `Textarea`. That one wraps itself in
+ * a `div` with a counter once `maxlength` is set, which breaks the group's
+ * `>textarea` selectors. A group that wants a count shows it in an addon.
+ */
+export type InputGroupTextareaProps = WithElementRef<HTMLTextareaAttributes, HTMLTextAreaElement>;
+declare const InputGroupTextarea: import("svelte").Component<InputGroupTextareaProps, {}, "ref" | "value">;
+type InputGroupTextarea = ReturnType<typeof InputGroupTextarea>;
+export default InputGroupTextarea;

package/dist/components/forms/input-group/input-group-variants.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Origin: the React package 2.23.0 `input-group.tsx` (`inputGroupAddonVariants`, `inputGroupButtonVariants`), itself shadcn/ui new-york `input-group`
+ * Diverged: split out of the component file, as badge-variants.ts is.
+ *   Classes, variants and defaults unchanged.
+ */
+import { type VariantProps } from 'class-variance-authority';
+export declare const inputGroupAddonVariants: (props?: ({
+    align?: "inline-start" | "inline-end" | "block-start" | "block-end" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const inputGroupButtonVariants: (props?: ({
+    size?: "sm" | "xs" | "icon-xs" | "icon-sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type InputGroupAddonAlign = NonNullable<VariantProps<typeof inputGroupAddonVariants>['align']>;
+export type InputGroupButtonSize = NonNullable<VariantProps<typeof inputGroupButtonVariants>['size']>;

package/dist/components/forms/input-group/input-group-variants.js

@@ -0,0 +1,32 @@
+/**
+ * Origin: the React package 2.23.0 `input-group.tsx` (`inputGroupAddonVariants`, `inputGroupButtonVariants`), itself shadcn/ui new-york `input-group`
+ * Diverged: split out of the component file, as badge-variants.ts is.
+ *   Classes, variants and defaults unchanged.
+ */
+import { cva } from 'class-variance-authority';
+export const inputGroupAddonVariants = cva("text-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[disabled=true]/input-group:opacity-50", {
+    variants: {
+        align: {
+            'inline-start': 'order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]',
+            'inline-end': 'order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]',
+            'block-start': 'order-first w-full justify-start px-3 pt-3 [.border-b]:pb-3 group-has-[>input]/input-group:pt-2.5',
+            'block-end': 'order-last w-full justify-start px-3 pb-3 [.border-t]:pt-3 group-has-[>input]/input-group:pb-2.5',
+        },
+    },
+    defaultVariants: {
+        align: 'inline-start',
+    },
+});
+export const inputGroupButtonVariants = cva('text-sm shadow-none flex gap-2 items-center', {
+    variants: {
+        size: {
+            xs: "h-6 gap-1 px-2 rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2",
+            sm: 'h-8 px-2.5 gap-1.5 rounded-md has-[>svg]:px-2.5',
+            'icon-xs': 'size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0',
+            'icon-sm': 'size-8 p-0 has-[>svg]:p-0',
+        },
+    },
+    defaultVariants: {
+        size: 'xs',
+    },
+});

package/dist/components/forms/input-group/input-group.svelte

@@ -0,0 +1,44 @@
+<!--
+  Origin: the React package 2.23.0 `input-group.tsx` (`InputGroup`), itself shadcn/ui new-york `input-group`
+  Svelte: shadcn-svelte `input-group`
+  Diverged: none beyond the port. The React divergences from shadcn carry over.
+-->
+<script lang="ts" module>
+  import type { HTMLAttributes } from 'svelte/elements'
+
+  import type { WithElementRef } from '../../../utils/types.js'
+
+  /**
+   * The surface matches `Input` exactly: filled, a transparent border,
+   * rounded-2xl. Stock shadcn draws a bordered white box at rounded-md, which
+   * put every grouped field out of step with the plain inputs beside it.
+   */
+  export type InputGroupProps = WithElementRef<HTMLAttributes<HTMLDivElement>>
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let { ref = $bindable(null), class: className, children, ...rest }: InputGroupProps = $props()
+</script>
+
+<!-- biome-ignore lint/a11y/useSemanticElements: a styling wrapper carrying a grouping role, as upstream; no semantic element covers it -->
+<div
+  bind:this={ref}
+  data-slot="input-group"
+  role="group"
+  class={cn(
+    'group/input-group bg-input/50 relative flex w-full items-center rounded-2xl border border-transparent shadow-xs transition-[color,box-shadow] outline-none',
+    'h-9 min-w-0 has-[>textarea]:h-auto',
+    'has-[>[data-align=inline-start]]:[&>input]:pl-2',
+    'has-[>[data-align=inline-end]]:[&>input]:pr-2',
+    'has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3',
+    'has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3',
+    'has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot=input-group-control]:focus-visible]:ring-[3px]',
+    'has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40',
+    className,
+  )}
+  {...rest}
+>
+  {@render children?.()}
+</div>

package/dist/components/forms/input-group/input-group.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import type { WithElementRef } from '../../../utils/types.js';
+/**
+ * The surface matches `Input` exactly: filled, a transparent border,
+ * rounded-2xl. Stock shadcn draws a bordered white box at rounded-md, which
+ * put every grouped field out of step with the plain inputs beside it.
+ */
+export type InputGroupProps = WithElementRef<HTMLAttributes<HTMLDivElement>>;
+declare const InputGroup: import("svelte").Component<InputGroupProps, {}, "ref">;
+type InputGroup = ReturnType<typeof InputGroup>;
+export default InputGroup;

package/dist/components/forms/input-otp/index.d.ts

@@ -0,0 +1,4 @@
+export { default as InputOTP, type InputOTPProps } from './input-otp.svelte';
+export { default as InputOTPGroup, type InputOTPGroupProps } from './input-otp-group.svelte';
+export { default as InputOTPSeparator, type InputOTPSeparatorProps, } from './input-otp-separator.svelte';
+export { default as InputOTPSlot, type InputOTPSlotProps } from './input-otp-slot.svelte';

package/dist/components/forms/input-otp/index.js

@@ -0,0 +1,4 @@
+export { default as InputOTP } from './input-otp.svelte';
+export { default as InputOTPGroup } from './input-otp-group.svelte';
+export { default as InputOTPSeparator, } from './input-otp-separator.svelte';
+export { default as InputOTPSlot } from './input-otp-slot.svelte';

package/dist/components/forms/input-otp/input-otp-group.svelte

@@ -0,0 +1,40 @@
+<!--
+  Origin: the React package 2.23.0 `input-otp.tsx` (`InputOTPGroup`), itself shadcn/ui new-york `input-otp`
+  Svelte: shadcn-svelte `input-otp`
+  Diverged: focus is read with `group-focus-within/input-otp` from the
+    container that holds the hidden input, where React reads input-otp's
+    context into `data-focused`.
+-->
+<script lang="ts" module>
+  import type { HTMLAttributes } from 'svelte/elements'
+
+  import type { WithElementRef } from '../../../utils/types.js'
+
+  /**
+   * The field: one rounded box around its slots, drawn as `Input` is
+   * (rounded-2xl, `bg-input/50`, the same focus ring around the whole of it),
+   * so a code sits in a form of inputs as one of them. Pass `aria-invalid`
+   * here, not on the slots: the field is what turns red.
+   */
+  export type InputOTPGroupProps = WithElementRef<HTMLAttributes<HTMLDivElement>>
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let { ref = $bindable(null), class: className, children, ...rest }: InputOTPGroupProps = $props()
+</script>
+
+<div
+  bind:this={ref}
+  data-slot="input-otp-group"
+  class={cn(
+    'bg-input/50 flex h-9 items-stretch overflow-hidden rounded-2xl border border-transparent shadow-xs transition-[color,box-shadow]',
+    'group-focus-within/input-otp:border-ring group-focus-within/input-otp:ring-ring/50 group-focus-within/input-otp:ring-[3px]',
+    'aria-invalid:border-destructive group-focus-within/input-otp:aria-invalid:ring-destructive/20 dark:group-focus-within/input-otp:aria-invalid:ring-destructive/40',
+    className,
+  )}
+  {...rest}
+>
+  {@render children?.()}
+</div>

package/dist/components/forms/input-otp/input-otp-group.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import type { WithElementRef } from '../../../utils/types.js';
+/**
+ * The field: one rounded box around its slots, drawn as `Input` is
+ * (rounded-2xl, `bg-input/50`, the same focus ring around the whole of it),
+ * so a code sits in a form of inputs as one of them. Pass `aria-invalid`
+ * here, not on the slots: the field is what turns red.
+ */
+export type InputOTPGroupProps = WithElementRef<HTMLAttributes<HTMLDivElement>>;
+declare const InputOtpGroup: import("svelte").Component<InputOTPGroupProps, {}, "ref">;
+type InputOtpGroup = ReturnType<typeof InputOtpGroup>;
+export default InputOtpGroup;

package/dist/components/forms/input-otp/input-otp-separator.svelte

@@ -0,0 +1,28 @@
+<!--
+  Origin: the React package 2.23.0 `input-otp.tsx` (`InputOTPSeparator`), itself shadcn/ui new-york `input-otp`
+  Svelte: shadcn-svelte `input-otp`
+  Diverged: Lucide's minus from `@lucide/svelte`. Takes `class`, and children in
+    place of the icon, as shadcn-svelte's does.
+-->
+<script lang="ts" module>
+  import type { HTMLAttributes } from 'svelte/elements'
+
+  import type { WithElementRef } from '../../../utils/types.js'
+
+  export type InputOTPSeparatorProps = WithElementRef<HTMLAttributes<HTMLDivElement>>
+</script>
+
+<script lang="ts">
+  import MinusIcon from '@lucide/svelte/icons/minus'
+
+  let { ref = $bindable(null), children, ...rest }: InputOTPSeparatorProps = $props()
+</script>
+
+<!-- biome-ignore lint/a11y/useSemanticElements: upstream shadcn markup. An <hr> cannot hold the icon drawn between the groups of cells -->
+<div bind:this={ref} data-slot="input-otp-separator" role="separator" {...rest}>
+  {#if children}
+    {@render children()}
+  {:else}
+    <MinusIcon />
+  {/if}
+</div>

package/dist/components/forms/input-otp/input-otp-separator.svelte.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import type { WithElementRef } from '../../../utils/types.js';
+export type InputOTPSeparatorProps = WithElementRef<HTMLAttributes<HTMLDivElement>>;
+declare const InputOtpSeparator: import("svelte").Component<InputOTPSeparatorProps, {}, "ref">;
+type InputOtpSeparator = ReturnType<typeof InputOtpSeparator>;
+export default InputOtpSeparator;

package/dist/components/forms/input-otp/input-otp-slot.svelte

@@ -0,0 +1,56 @@
+<!--
+  Origin: the React package 2.23.0 `input-otp.tsx` (`InputOTPSlot`), itself shadcn/ui new-york `input-otp`
+  Svelte: shadcn-svelte `input-otp`
+  Diverged: takes bits-ui's `cell` where React takes an `index`, and React's
+    `isMasked` is `masked`. `animate-caret-blink` is defined by neither
+    package, so the caret is steady, as React's is.
+-->
+<script lang="ts" module>
+  import { PinInput as InputOTPPrimitive } from 'bits-ui'
+
+  export type InputOTPSlotProps = InputOTPPrimitive.CellProps & {
+    /** A dot for each character typed, never the character: a PIN being set. */
+    masked?: boolean
+  }
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let {
+    ref = $bindable(null),
+    cell,
+    masked = false,
+    class: className,
+    ...rest
+  }: InputOTPSlotProps = $props()
+</script>
+
+<InputOTPPrimitive.Cell
+  bind:ref
+  {cell}
+  data-slot="input-otp-slot"
+  class={cn(
+    // A cell of the field: split from the one before it by a thin border, the
+    // one being typed in a step lighter.
+    'border-border relative flex w-9 items-center justify-center border-l text-sm transition-colors outline-none first:border-l-0',
+    'data-[active=true]:bg-foreground/5',
+    className,
+  )}
+  {...rest}
+>
+  {#snippet child({ props })}
+    <div {...props} data-active={cell.isActive}>
+      {#if masked && cell.char}
+        <span data-slot="input-otp-dot" class="bg-foreground size-2 rounded-full"></span>
+      {:else}
+        {cell.char}
+      {/if}
+      {#if cell.hasFakeCaret}
+        <div class="pointer-events-none absolute inset-0 flex items-center justify-center">
+          <div class="animate-caret-blink bg-foreground h-4 w-px duration-1000"></div>
+        </div>
+      {/if}
+    </div>
+  {/snippet}
+</InputOTPPrimitive.Cell>

package/dist/components/forms/input-otp/input-otp-slot.svelte.d.ts

@@ -0,0 +1,8 @@
+import { PinInput as InputOTPPrimitive } from 'bits-ui';
+export type InputOTPSlotProps = InputOTPPrimitive.CellProps & {
+    /** A dot for each character typed, never the character: a PIN being set. */
+    masked?: boolean;
+};
+declare const InputOtpSlot: import("svelte").Component<InputOTPSlotProps, {}, "ref">;
+type InputOtpSlot = ReturnType<typeof InputOtpSlot>;
+export default InputOtpSlot;

package/dist/components/forms/input-otp/input-otp.svelte

@@ -0,0 +1,40 @@
+<!--
+  Origin: the React package 2.23.0 `input-otp.tsx` (`InputOTP`), itself shadcn/ui new-york `input-otp`
+  Svelte: shadcn-svelte `input-otp`
+  Diverged: bits-ui PinInput for the `input-otp` package, with `bind:value`.
+    `maxLength` is `maxlength`, and the slots are drawn from the `cells` the
+    children snippet receives rather than read from a context by index. React's
+    `containerClassName` is `class`, which bits-ui puts on the container; the
+    rest of the props go to the hidden input, as React's do. The container is a
+    `group/input-otp`, so the field can read focus from the hidden input.
+-->
+<script lang="ts" module>
+  import { PinInput as InputOTPPrimitive } from 'bits-ui'
+
+  /**
+   * A one-time code or a PIN, typed into one hidden input and drawn as cells.
+   * Lay out `InputOTPGroup`s and `InputOTPSlot`s in the children snippet, one
+   * slot per cell it receives.
+   */
+  export type InputOTPProps = InputOTPPrimitive.RootProps
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let {
+    ref = $bindable(null),
+    value = $bindable(''),
+    class: className,
+    ...rest
+  }: InputOTPProps = $props()
+</script>
+
+<InputOTPPrimitive.Root
+  bind:ref
+  bind:value
+  data-slot="input-otp"
+  spellcheck={false}
+  class={cn('group/input-otp flex items-center gap-2 has-disabled:opacity-50', className)}
+  {...rest}
+/>

package/dist/components/forms/input-otp/input-otp.svelte.d.ts

@@ -0,0 +1,10 @@
+import { PinInput as InputOTPPrimitive } from 'bits-ui';
+/**
+ * A one-time code or a PIN, typed into one hidden input and drawn as cells.
+ * Lay out `InputOTPGroup`s and `InputOTPSlot`s in the children snippet, one
+ * slot per cell it receives.
+ */
+export type InputOTPProps = InputOTPPrimitive.RootProps;
+declare const InputOtp: import("svelte").Component<InputOTPPrimitive.RootProps, {}, "ref" | "value">;
+type InputOtp = ReturnType<typeof InputOtp>;
+export default InputOtp;

package/dist/components/forms/label/index.d.ts

@@ -0,0 +1 @@
+export { default as Label, type LabelProps } from './label.svelte';

package/dist/components/forms/label/index.js

@@ -0,0 +1 @@
+export { default as Label } from './label.svelte';

package/dist/components/forms/label/label.svelte

@@ -0,0 +1,26 @@
+<!--
+  Origin: the React package 2.23.0 `label.tsx`, itself shadcn/ui new-york `label`
+  Svelte: shadcn-svelte `label`
+  Diverged: unaudited, as in the React package. bits-ui Label for Radix Label.
+-->
+<script lang="ts" module>
+  import { Label as LabelPrimitive } from 'bits-ui'
+
+  export type LabelProps = LabelPrimitive.RootProps
+</script>
+
+<script lang="ts">
+  import { cn } from '../../../utils/cn.js'
+
+  let { ref = $bindable(null), class: className, ...rest }: LabelProps = $props()
+</script>
+
+<LabelPrimitive.Root
+  bind:ref
+  data-slot="label"
+  class={cn(
+    'flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
+    className,
+  )}
+  {...rest}
+/>

package/dist/components/forms/label/label.svelte.d.ts

@@ -0,0 +1,5 @@
+import { Label as LabelPrimitive } from 'bits-ui';
+export type LabelProps = LabelPrimitive.RootProps;
+declare const Label: import("svelte").Component<LabelPrimitive.RootProps, {}, "ref">;
+type Label = ReturnType<typeof Label>;
+export default Label;

package/dist/components/forms/media-dropzone/index.d.ts

@@ -0,0 +1,2 @@
+export { default as MediaDropzone, type MediaDropzoneProps } from './media-dropzone.svelte';
+export type { MediaAsset, MediaLinkMode, MediaUploaderAdapter, MediaUploadOptions, } from './media-uploader.svelte.js';

package/dist/components/forms/media-dropzone/index.js

@@ -0,0 +1 @@
+export { default as MediaDropzone } from './media-dropzone.svelte';