@destyler-ui/svelte 0.0.1-beta.17

package/dist/components/field/components/Root.svelte

@@ -0,0 +1,52 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, Optional, PolymorphicProps } from '../../../types'
+  import type { UseFieldProps } from '../hooks/use-field.svelte'
+
+  export interface FieldRootBaseProps extends Optional<UseFieldProps, 'id'>, PolymorphicProps<'div'> {
+    ref?: Element | null
+  }
+  export interface FieldRootProps extends Assign<HTMLProps<'div'>, FieldRootBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { createSplitProps } from '../../../utils/create-split-props'
+  import { mergeProps } from '@destyler/svelte'
+  import { untrack } from 'svelte'
+  import { UI } from '../../factory'
+  import { FieldProvider } from '../hooks/use-field-context'
+  import { useField } from '../hooks/use-field.svelte'
+
+  let { ref = $bindable<Element | null>(null), ...props }: FieldRootProps = $props()
+
+  const [useFieldProps, localProps] = $derived(
+    createSplitProps<Optional<UseFieldProps, 'id'>>()(props, [
+      'id',
+      'ids',
+      'disabled',
+      'invalid',
+      'readOnly',
+      'required',
+    ]),
+  )
+
+  const providedId = $props.id()
+
+  const machineProps = $derived.by(() => {
+    return {
+      ...useFieldProps,
+      id: useFieldProps.id ?? providedId,
+    }
+  })
+
+  const field = useField(() => machineProps)
+  const mergedProps = $derived(mergeProps(field().getRootProps(), localProps))
+
+  FieldProvider(field)
+
+  function setNode(node: Element | null) {
+    untrack(() => field().setRootRef(node))
+    ref = node
+  }
+</script>
+
+<UI as="div" {...mergedProps} {@attach setNode} />

package/dist/components/field/components/Root.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, Optional, PolymorphicProps } from '../../../types.js';
+import type { UseFieldProps } from '../hooks/use-field.svelte.js';
+export interface FieldRootBaseProps extends Optional<UseFieldProps, 'id'>, PolymorphicProps<'div'> {
+    ref?: Element | null;
+}
+export interface FieldRootProps extends Assign<HTMLProps<'div'>, FieldRootBaseProps> {
+}
+declare const Root: import("svelte").Component<FieldRootProps, {}, "ref">;
+type Root = ReturnType<typeof Root>;
+export default Root;

package/dist/components/field/components/RootProvider.d.svelte.ts

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+import type { UseFieldReturn } from '../hooks/use-field.svelte.js';
+export interface FieldRootProviderBaseProps extends PolymorphicProps<'div'> {
+    value: UseFieldReturn;
+}
+export interface FieldRootProviderProps extends Assign<HTMLProps<'div'>, FieldRootProviderBaseProps> {
+}
+declare const RootProvider: import("svelte").Component<FieldRootProviderProps, {}, "">;
+type RootProvider = ReturnType<typeof RootProvider>;
+export default RootProvider;

package/dist/components/field/components/RootProvider.svelte

@@ -0,0 +1,22 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps } from '../../../types'
+  import type { UseFieldReturn } from '../hooks/use-field.svelte'
+
+  export interface FieldRootProviderBaseProps extends PolymorphicProps<'div'> {
+    value: UseFieldReturn
+  }
+  export interface FieldRootProviderProps extends Assign<HTMLProps<'div'>, FieldRootProviderBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@destyler/svelte'
+  import { UI } from '../../factory'
+  import { FieldProvider } from '../hooks/use-field-context'
+
+  const { value, ...props }: FieldRootProviderProps = $props()
+  const mergedProps = $derived(mergeProps(value().getRootProps(), props))
+
+  FieldProvider(() => value())
+</script>
+
+<UI as="div" {...mergedProps} />

package/dist/components/field/components/RootProvider.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+import type { UseFieldReturn } from '../hooks/use-field.svelte.js';
+export interface FieldRootProviderBaseProps extends PolymorphicProps<'div'> {
+    value: UseFieldReturn;
+}
+export interface FieldRootProviderProps extends Assign<HTMLProps<'div'>, FieldRootProviderBaseProps> {
+}
+declare const RootProvider: import("svelte").Component<FieldRootProviderProps, {}, "">;
+type RootProvider = ReturnType<typeof RootProvider>;
+export default RootProvider;

package/dist/components/field/components/Select.d.svelte.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldSelectBaseProps extends PolymorphicProps<'select'> {
+}
+export interface FieldSelectProps extends Assign<HTMLProps<'select'>, FieldSelectBaseProps> {
+}
+declare const Select: import("svelte").Component<FieldSelectProps, {}, "value">;
+type Select = ReturnType<typeof Select>;
+export default Select;

package/dist/components/field/components/Select.svelte

@@ -0,0 +1,27 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps } from '../../../types'
+
+  export interface FieldSelectBaseProps extends PolymorphicProps<'select'> {}
+  export interface FieldSelectProps extends Assign<HTMLProps<'select'>, FieldSelectBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@destyler/svelte'
+  import { UI } from '../../factory'
+  import { useFieldContext } from '../hooks/use-field-context'
+
+  let { value = $bindable(), multiple, ...props }: FieldSelectProps = $props()
+  const field = useFieldContext()
+  const nativeSelectProps: HTMLProps<'select'> = $derived({
+    value,
+    multiple,
+    oninput(event) {
+      value = multiple
+        ? Array.from(event.currentTarget.selectedOptions).map(option => option.value)
+        : event.currentTarget.value
+    },
+  })
+  const mergedProps = $derived(mergeProps(field?.().getSelectProps() ?? {}, nativeSelectProps, props))
+</script>
+
+<UI as="select" {...mergedProps} />

package/dist/components/field/components/Select.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldSelectBaseProps extends PolymorphicProps<'select'> {
+}
+export interface FieldSelectProps extends Assign<HTMLProps<'select'>, FieldSelectBaseProps> {
+}
+declare const Select: import("svelte").Component<FieldSelectProps, {}, "value">;
+type Select = ReturnType<typeof Select>;
+export default Select;

package/dist/components/field/components/Textarea.d.svelte.ts

@@ -0,0 +1,13 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldTextareaBaseProps extends PolymorphicProps<'textarea'> {
+    /**
+     * Whether the textarea should autoresize
+     * @default false
+     */
+    autoresize?: boolean;
+}
+export interface FieldTextareaProps extends Assign<HTMLProps<'textarea'>, FieldTextareaBaseProps> {
+}
+declare const Textarea: import("svelte").Component<FieldTextareaProps, {}, "value">;
+type Textarea = ReturnType<typeof Textarea>;
+export default Textarea;

package/dist/components/field/components/Textarea.svelte

@@ -0,0 +1,42 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps } from '../../../types'
+
+  export interface FieldTextareaBaseProps extends PolymorphicProps<'textarea'> {
+    /**
+     * Whether the textarea should autoresize
+     * @default false
+     */
+    autoresize?: boolean
+  }
+  export interface FieldTextareaProps extends Assign<HTMLProps<'textarea'>, FieldTextareaBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { autoresizeTextarea } from '@destyler/auto-resize'
+  import { mergeProps } from '@destyler/svelte'
+  import { UI } from '../../factory'
+  import { useFieldContext } from '../hooks/use-field-context'
+
+  let textareaRef = $state<HTMLTextAreaElement | null>(null)
+
+  let { value = $bindable(), autoresize, ...props }: FieldTextareaProps = $props()
+
+  const field = useFieldContext()
+  const nativeTextareaProps: HTMLProps<'textarea'> = $derived({
+    value,
+    oninput(event) {
+      value = event.currentTarget.value
+    },
+    style: autoresize ? 'resize: none' : undefined,
+  })
+  const mergedProps = $derived(
+    mergeProps(field?.().getTextareaProps() ?? {}, nativeTextareaProps, props),
+  )
+
+  $effect(() => {
+    if (!autoresize) return
+    return autoresizeTextarea(textareaRef)
+  })
+</script>
+
+<UI as="textarea" {...mergedProps} bind:ref={textareaRef} />

package/dist/components/field/components/Textarea.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldTextareaBaseProps extends PolymorphicProps<'textarea'> {
+    /**
+     * Whether the textarea should autoresize
+     * @default false
+     */
+    autoresize?: boolean;
+}
+export interface FieldTextareaProps extends Assign<HTMLProps<'textarea'>, FieldTextareaBaseProps> {
+}
+declare const Textarea: import("svelte").Component<FieldTextareaProps, {}, "value">;
+type Textarea = ReturnType<typeof Textarea>;
+export default Textarea;

package/dist/components/field/hooks/use-field-context.d.ts

@@ -0,0 +1,4 @@
+import type { UseFieldReturn } from './use-field.svelte.js';
+export interface UseFieldContext extends UseFieldReturn {
+}
+export declare const FieldProvider: (value: UseFieldContext) => void, useFieldContext: import("../../../utils/create-context.js").OptionalContextConsumer<UseFieldContext>;

package/dist/components/field/hooks/use-field-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../../utils/create-context.js';
+export const [FieldProvider, useFieldContext] = createContext({
+    name: 'FieldContext',
+    strict: false,
+});

package/dist/components/field/hooks/use-field.svelte.d.ts

@@ -0,0 +1,63 @@
+import type { HTMLProps } from '../../../types.js';
+import type { MaybeFunction } from '@destyler/utils';
+export interface ElementIds {
+    root?: string;
+    control?: string;
+    label?: string;
+    errorText?: string;
+    helperText?: string;
+}
+export interface UseFieldProps {
+    /**
+     * A stable id for the field.
+     *
+     * Svelte hooks cannot call `$props.id()`. Components should pass the id
+     * generated at the component's top level; `Field.Root` does this
+     * automatically.
+     */
+    id: string;
+    /**
+     * The ids of the field parts.
+     */
+    ids?: ElementIds;
+    /**
+     * Indicates whether the field is required.
+     */
+    required?: boolean;
+    /**
+     * Indicates whether the field is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Indicates whether the field is invalid.
+     */
+    invalid?: boolean;
+    /**
+     * Indicates whether the field is read-only.
+     */
+    readOnly?: boolean;
+}
+export type UseFieldReturn = ReturnType<typeof useField>;
+export declare function useField(inProps: MaybeFunction<UseFieldProps>): () => {
+    setRootRef: (el: Element | null) => void;
+    ariaDescribedby: string | undefined;
+    ids: {
+        root: string;
+        control: string;
+        label: string;
+        errorText: string;
+        helperText: string;
+    };
+    disabled: boolean;
+    invalid: boolean;
+    readOnly: boolean;
+    required: boolean;
+    getRootProps: () => HTMLProps<"div">;
+    getLabelProps: () => HTMLProps<"label">;
+    getInputProps: () => HTMLProps<"input">;
+    getTextareaProps: () => HTMLProps<"textarea">;
+    getSelectProps: () => HTMLProps<"select">;
+    getHelperTextProps: () => HTMLProps<"span">;
+    getErrorTextProps: () => HTMLProps<"span">;
+    getRequiredIndicatorProps: () => HTMLProps<"span">;
+};

package/dist/components/field/hooks/use-field.svelte.js

@@ -0,0 +1,131 @@
+import { resolveQueryRoot } from '../../../utils/resolve-query-root.js';
+import { ariaAttr, dataAttr, getWindow } from '@destyler/dom';
+import { runIfFn } from '@destyler/utils';
+import { onMount } from 'svelte';
+import { useFieldsetContext } from '../../fieldset/index.js';
+import { parts } from '../anatomy.js';
+export function useField(inProps) {
+    const fieldset = useFieldsetContext();
+    const props = $derived.by(() => {
+        const resolvedProps = runIfFn(inProps);
+        return resolvedProps;
+    });
+    const id = $derived(props.id);
+    const ids = $derived(props.ids);
+    const disabled = $derived(props.disabled ?? Boolean(fieldset?.().disabled));
+    const invalid = $derived(props.invalid ?? false);
+    const readOnly = $derived(props.readOnly ?? false);
+    const required = $derived(props.required ?? false);
+    let hasErrorText = $state(false);
+    let hasHelperText = $state(false);
+    let rootRef = $state(null);
+    const setRootRef = (el) => {
+        rootRef = el;
+    };
+    const rootId = $derived(ids?.root ?? `field::${id}`);
+    const controlId = $derived(ids?.control ?? `field::${id}::control`);
+    const errorTextId = $derived(ids?.errorText ?? `field::${id}::error-text`);
+    const helperTextId = $derived(ids?.helperText ?? `field::${id}::helper-text`);
+    const labelId = $derived(ids?.label ?? `field::${id}::label`);
+    const checkTextElements = () => {
+        if (!rootRef)
+            return;
+        const queryRoot = resolveQueryRoot(rootRef.getRootNode(), rootRef.ownerDocument);
+        hasErrorText = !!queryRoot.getElementById(errorTextId);
+        hasHelperText = !!queryRoot.getElementById(helperTextId);
+    };
+    onMount(() => {
+        checkTextElements();
+        if (rootRef) {
+            const win = getWindow(rootRef);
+            const observer = new win.MutationObserver(checkTextElements);
+            observer.observe(rootRef, { childList: true, subtree: true });
+            return () => observer.disconnect();
+        }
+    });
+    const labelIds = $derived(() => {
+        const ids = [];
+        if (hasErrorText && invalid)
+            ids.push(errorTextId);
+        if (hasHelperText)
+            ids.push(helperTextId);
+        return ids.join(' ') || undefined;
+    });
+    const getRootProps = () => ({
+        ...parts.root.attrs,
+        'id': rootId,
+        'role': 'group',
+        'data-disabled': dataAttr(disabled),
+        'data-invalid': dataAttr(invalid),
+        'data-readonly': dataAttr(readOnly),
+    });
+    const getLabelProps = () => ({
+        ...parts.label.attrs,
+        'id': labelId,
+        'data-disabled': dataAttr(disabled),
+        'data-invalid': dataAttr(invalid),
+        'data-readonly': dataAttr(readOnly),
+        'for': controlId,
+    });
+    const getControlProps = () => ({
+        'aria-describedby': labelIds(),
+        'aria-invalid': ariaAttr(invalid),
+        'data-invalid': dataAttr(invalid),
+        'data-required': dataAttr(required),
+        'data-readonly': dataAttr(readOnly),
+        'id': controlId,
+        required,
+        disabled,
+        readOnly,
+    });
+    const getInputProps = () => ({
+        ...getControlProps(),
+        ...parts.input.attrs,
+    });
+    const getTextareaProps = () => ({
+        ...getControlProps(),
+        ...parts.textarea.attrs,
+    });
+    const getSelectProps = () => ({
+        ...getControlProps(),
+        ...parts.select.attrs,
+    });
+    const getHelperTextProps = () => ({
+        'id': helperTextId,
+        ...parts.helperText.attrs,
+        'data-disabled': dataAttr(disabled),
+    });
+    const getErrorTextProps = () => ({
+        'id': errorTextId,
+        ...parts.errorText.attrs,
+        'aria-live': 'polite',
+    });
+    const getRequiredIndicatorProps = () => ({
+        'aria-hidden': true,
+        ...parts.requiredIndicator.attrs,
+    });
+    const api = $derived({
+        setRootRef,
+        ariaDescribedby: labelIds(),
+        ids: {
+            root: rootId,
+            control: controlId,
+            label: labelId,
+            errorText: errorTextId,
+            helperText: helperTextId,
+        },
+        disabled,
+        invalid,
+        readOnly,
+        required,
+        getRootProps,
+        getLabelProps,
+        getInputProps,
+        getTextareaProps,
+        getSelectProps,
+        getHelperTextProps,
+        getErrorTextProps,
+        getRequiredIndicatorProps,
+    });
+    return () => api;
+}

package/dist/components/field/index.d.ts

@@ -0,0 +1,14 @@
+export { fieldAnatomy } from './anatomy.js';
+export { default as FieldContext, type FieldContextProps } from './components/Context.svelte';
+export { default as FieldErrorText, type FieldErrorTextBaseProps, type FieldErrorTextProps, } from './components/ErrorText.svelte';
+export { default as FieldHelperText, type FieldHelperTextBaseProps, type FieldHelperTextProps, } from './components/HelperText.svelte';
+export { default as FieldInput, type FieldInputBaseProps, type FieldInputProps } from './components/Input.svelte';
+export { default as FieldLabel, type FieldLabelBaseProps, type FieldLabelProps } from './components/Label.svelte';
+export { default as FieldRequiredIndicator, type FieldRequiredIndicatorBaseProps, type FieldRequiredIndicatorProps, } from './components/RequiredIndicator.svelte';
+export { default as FieldRoot, type FieldRootBaseProps, type FieldRootProps } from './components/Root.svelte';
+export { default as FieldRootProvider, type FieldRootProviderBaseProps, type FieldRootProviderProps, } from './components/RootProvider.svelte';
+export { default as FieldSelect, type FieldSelectBaseProps, type FieldSelectProps } from './components/Select.svelte';
+export { default as FieldTextarea, type FieldTextareaBaseProps, type FieldTextareaProps } from './components/Textarea.svelte';
+export { useFieldContext, type UseFieldContext } from './hooks/use-field-context.js';
+export { useField, type UseFieldProps, type UseFieldReturn } from './hooks/use-field.svelte.js';
+export * as Field from './namespace.js';

package/dist/components/field/index.js

@@ -0,0 +1,14 @@
+export { fieldAnatomy } from './anatomy.js';
+export { default as FieldContext } from './components/Context.svelte';
+export { default as FieldErrorText, } from './components/ErrorText.svelte';
+export { default as FieldHelperText, } from './components/HelperText.svelte';
+export { default as FieldInput } from './components/Input.svelte';
+export { default as FieldLabel } from './components/Label.svelte';
+export { default as FieldRequiredIndicator, } from './components/RequiredIndicator.svelte';
+export { default as FieldRoot } from './components/Root.svelte';
+export { default as FieldRootProvider, } from './components/RootProvider.svelte';
+export { default as FieldSelect } from './components/Select.svelte';
+export { default as FieldTextarea } from './components/Textarea.svelte';
+export { useFieldContext } from './hooks/use-field-context.js';
+export { useField } from './hooks/use-field.svelte.js';
+export * as Field from './namespace.js';

package/dist/components/field/namespace.d.ts

@@ -0,0 +1,10 @@
+export { default as Context, type FieldContextProps as ContextProps } from './components/Context.svelte';
+export { default as ErrorText, type FieldErrorTextBaseProps as ErrorTextBaseProps, type FieldErrorTextProps as ErrorTextProps, } from './components/ErrorText.svelte';
+export { default as HelperText, type FieldHelperTextBaseProps as HelperTextBaseProps, type FieldHelperTextProps as HelperTextProps, } from './components/HelperText.svelte';
+export { default as Input, type FieldInputBaseProps as InputBaseProps, type FieldInputProps as InputProps, } from './components/Input.svelte';
+export { default as Label, type FieldLabelBaseProps as LabelBaseProps, type FieldLabelProps as LabelProps, } from './components/Label.svelte';
+export { default as RequiredIndicator, type FieldRequiredIndicatorBaseProps as RequiredIndicatorBaseProps, type FieldRequiredIndicatorProps as RequiredIndicatorProps, } from './components/RequiredIndicator.svelte';
+export { default as Root, type FieldRootBaseProps as RootBaseProps, type FieldRootProps as RootProps, } from './components/Root.svelte';
+export { default as RootProvider, type FieldRootProviderBaseProps as RootProviderBaseProps, type FieldRootProviderProps as RootProviderProps, } from './components/RootProvider.svelte';
+export { default as Select, type FieldSelectBaseProps as SelectBaseProps, type FieldSelectProps as SelectProps, } from './components/Select.svelte';
+export { default as Textarea, type FieldTextareaBaseProps as TextareaBaseProps, type FieldTextareaProps as TextareaProps, } from './components/Textarea.svelte';

package/dist/components/field/namespace.js

@@ -0,0 +1,10 @@
+export { default as Context } from './components/Context.svelte';
+export { default as ErrorText, } from './components/ErrorText.svelte';
+export { default as HelperText, } from './components/HelperText.svelte';
+export { default as Input, } from './components/Input.svelte';
+export { default as Label, } from './components/Label.svelte';
+export { default as RequiredIndicator, } from './components/RequiredIndicator.svelte';
+export { default as Root, } from './components/Root.svelte';
+export { default as RootProvider, } from './components/RootProvider.svelte';
+export { default as Select, } from './components/Select.svelte';
+export { default as Textarea, } from './components/Textarea.svelte';

package/dist/components/fieldset/anatomy.d.ts

@@ -0,0 +1,2 @@
+export declare const fieldsetAnatomy: import("@destyler/anatomy").AnatomyInstance<"legend" | "root" | "errorText" | "helperText">;
+export declare const parts: Record<"legend" | "root" | "errorText" | "helperText", import("@destyler/anatomy").AnatomyPart>;

package/dist/components/fieldset/anatomy.js

@@ -0,0 +1,3 @@
+import { createAnatomy } from '@destyler/anatomy';
+export const fieldsetAnatomy = createAnatomy('fieldset').parts('root', 'errorText', 'helperText', 'legend');
+export const parts = fieldsetAnatomy.build();

package/dist/components/fieldset/components/Context.d.svelte.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { UseFieldsetReturn } from '../hooks/use-fieldset.svelte.js';
+export interface FieldsetContextProps {
+    render: Snippet<[UseFieldsetReturn]>;
+}
+declare const Context: import("svelte").Component<FieldsetContextProps, {}, "">;
+type Context = ReturnType<typeof Context>;
+export default Context;

package/dist/components/fieldset/components/Context.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Snippet } from 'svelte'
+  import type { UseFieldsetReturn } from '../hooks/use-fieldset.svelte'
+
+  export interface FieldsetContextProps {
+    render: Snippet<[UseFieldsetReturn]>
+  }
+</script>
+
+<script lang="ts">
+  import { useFieldsetContext } from '../hooks/use-fieldset-context'
+
+  const props: FieldsetContextProps = $props()
+  const fieldset = useFieldsetContext()
+</script>
+
+{#if fieldset}
+  {@render props.render(fieldset)}
+{/if}

package/dist/components/fieldset/components/Context.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { UseFieldsetReturn } from '../hooks/use-fieldset.svelte.js';
+export interface FieldsetContextProps {
+    render: Snippet<[UseFieldsetReturn]>;
+}
+declare const Context: import("svelte").Component<FieldsetContextProps, {}, "">;
+type Context = ReturnType<typeof Context>;
+export default Context;

package/dist/components/fieldset/components/ErrorText.d.svelte.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldsetErrorTextBaseProps extends PolymorphicProps<'span'> {
+}
+export interface FieldsetErrorTextProps extends Assign<HTMLProps<'span'>, FieldsetErrorTextBaseProps> {
+}
+declare const ErrorText: import("svelte").Component<FieldsetErrorTextProps, {}, "">;
+type ErrorText = ReturnType<typeof ErrorText>;
+export default ErrorText;

package/dist/components/fieldset/components/ErrorText.svelte

@@ -0,0 +1,20 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps } from '../../../types'
+
+  export interface FieldsetErrorTextBaseProps extends PolymorphicProps<'span'> {}
+  export interface FieldsetErrorTextProps extends Assign<HTMLProps<'span'>, FieldsetErrorTextBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@destyler/svelte'
+  import { UI } from '../../factory'
+  import { useFieldsetContext } from '../hooks/use-fieldset-context'
+
+  const props: FieldsetErrorTextProps = $props()
+  const fieldset = useFieldsetContext()
+  const mergedProps = $derived(mergeProps(fieldset?.().getErrorTextProps() ?? {}, props))
+</script>
+
+{#if fieldset?.().invalid}
+  <UI as="span" {...mergedProps} />
+{/if}

package/dist/components/fieldset/components/ErrorText.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldsetErrorTextBaseProps extends PolymorphicProps<'span'> {
+}
+export interface FieldsetErrorTextProps extends Assign<HTMLProps<'span'>, FieldsetErrorTextBaseProps> {
+}
+declare const ErrorText: import("svelte").Component<FieldsetErrorTextProps, {}, "">;
+type ErrorText = ReturnType<typeof ErrorText>;
+export default ErrorText;

package/dist/components/fieldset/components/HelperText.d.svelte.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldsetHelperTextBaseProps extends PolymorphicProps<'span'> {
+}
+export interface FieldsetHelperTextProps extends Assign<HTMLProps<'span'>, FieldsetHelperTextBaseProps> {
+}
+declare const HelperText: import("svelte").Component<FieldsetHelperTextProps, {}, "">;
+type HelperText = ReturnType<typeof HelperText>;
+export default HelperText;

package/dist/components/fieldset/components/HelperText.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps } from '../../../types'
+
+  export interface FieldsetHelperTextBaseProps extends PolymorphicProps<'span'> {}
+  export interface FieldsetHelperTextProps extends Assign<HTMLProps<'span'>, FieldsetHelperTextBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@destyler/svelte'
+  import { UI } from '../../factory'
+  import { useFieldsetContext } from '../hooks/use-fieldset-context'
+
+  const props: FieldsetHelperTextProps = $props()
+  const fieldset = useFieldsetContext()
+  const mergedProps = $derived(mergeProps(fieldset?.().getHelperTextProps() ?? {}, props))
+</script>
+
+<UI as="span" {...mergedProps} />

package/dist/components/fieldset/components/HelperText.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldsetHelperTextBaseProps extends PolymorphicProps<'span'> {
+}
+export interface FieldsetHelperTextProps extends Assign<HTMLProps<'span'>, FieldsetHelperTextBaseProps> {
+}
+declare const HelperText: import("svelte").Component<FieldsetHelperTextProps, {}, "">;
+type HelperText = ReturnType<typeof HelperText>;
+export default HelperText;

package/dist/components/fieldset/components/Legend.d.svelte.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps } from '../../../types.js';
+export interface FieldsetLegendBaseProps extends PolymorphicProps<'legend'> {
+}
+export interface FieldsetLegendProps extends Assign<HTMLProps<'legend'>, FieldsetLegendBaseProps> {
+}
+declare const Legend: import("svelte").Component<FieldsetLegendProps, {}, "">;
+type Legend = ReturnType<typeof Legend>;
+export default Legend;