@dsn-starter-kit/components-react 1.0.2 → 3.0.0

package/dist/FileInput/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/FileInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}

package/dist/FormField/FormField.css

@@ -1,16 +0,0 @@
-/**
- * FormField Component Styles
- * Container component that combines FormFieldLabel, FormFieldDescription,
- * FormFieldErrorMessage, FormFieldStatus, and form controls
- */
-
-.dsn-form-field {
-  display: block;
-}
-
-/* Invalid state - thick red left border when error message is present */
-.dsn-form-field--invalid {
-  border-inline-start: var(--dsn-form-field-invalid-border-inline-start-width)
-    solid var(--dsn-form-field-invalid-border-inline-start-color);
-  padding-inline-start: var(--dsn-form-field-invalid-padding-inline-start);
-}

package/dist/FormField/FormField.d.ts

@@ -1,85 +0,0 @@
-import React from 'react';
-import { FormFieldStatusVariant } from '../FormFieldStatus';
-import './FormField.css';
-export interface FormFieldProps {
-    /**
-     * The label text for the form field
-     */
-    label: string;
-    /**
-     * The ID of the form control (used for htmlFor/aria-describedby)
-     */
-    htmlFor?: string;
-    /**
-     * Optional suffix for the label (e.g., "(niet verplicht)" or "(verplicht)")
-     */
-    labelSuffix?: string;
-    /**
-     * Optional description text
-     */
-    description?: React.ReactNode;
-    /**
-     * Optional error message (shows when field is invalid)
-     */
-    error?: React.ReactNode;
-    /**
-     * Optional status message
-     */
-    status?: React.ReactNode;
-    /**
-     * Status variant (for status message styling)
-     * @default 'default'
-     */
-    statusVariant?: FormFieldStatusVariant;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-    /**
-     * The form control element (input, textarea, CheckboxGroup, RadioGroup, etc.)
-     */
-    children: React.ReactNode;
-}
-/**
- * Form Field component
- * Container that combines FormFieldLabel, FormFieldDescription, Control, FormFieldErrorMessage, and FormFieldStatus
- * Uses div/label structure (for fieldset/legend use FormFieldset component)
- *
- * @example
- * ```tsx
- * // Text input field
- * <FormField label="E-mailadres" htmlFor="email" description="We sturen hier geen spam naartoe">
- *   <TextInput id="email" type="email" />
- * </FormField>
- *
- * // With error
- * <FormField
- *   label="Wachtwoord"
- *   htmlFor="password"
- *   error="Wachtwoord moet minimaal 8 tekens bevatten"
- * >
- *   <PasswordInput id="password" invalid />
- * </FormField>
- *
- * // With status (character counter)
- * <FormField
- *   label="Bio"
- *   htmlFor="bio"
- *   status="280 van 500 karakters gebruikt"
- * >
- *   <TextArea id="bio" rows={4} />
- * </FormField>
- *
- * // With positive status
- * <FormField
- *   label="Wachtwoord"
- *   htmlFor="password"
- *   status="Wachtwoord is sterk genoeg"
- *   statusVariant="positive"
- * >
- *   <PasswordInput id="password" />
- * </FormField>
- * ```
- */
-export declare const FormField: React.ForwardRefExoticComponent<FormFieldProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=FormField.d.ts.map

package/dist/FormField/FormField.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../src/FormField/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAmB,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC7E,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IAEvC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,eAAO,MAAM,SAAS,uFAsDrB,CAAC"}

package/dist/FormField/FormField.js

@@ -1,60 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { classNames } from '@dsn-starter-kit/core';
-import { FormFieldLabel } from '../FormFieldLabel';
-import { FormFieldDescription } from '../FormFieldDescription';
-import { FormFieldErrorMessage } from '../FormFieldErrorMessage';
-import { FormFieldStatus } from '../FormFieldStatus';
-import './FormField.css';
-/**
- * Form Field component
- * Container that combines FormFieldLabel, FormFieldDescription, Control, FormFieldErrorMessage, and FormFieldStatus
- * Uses div/label structure (for fieldset/legend use FormFieldset component)
- *
- * @example
- * ```tsx
- * // Text input field
- * <FormField label="E-mailadres" htmlFor="email" description="We sturen hier geen spam naartoe">
- *   <TextInput id="email" type="email" />
- * </FormField>
- *
- * // With error
- * <FormField
- *   label="Wachtwoord"
- *   htmlFor="password"
- *   error="Wachtwoord moet minimaal 8 tekens bevatten"
- * >
- *   <PasswordInput id="password" invalid />
- * </FormField>
- *
- * // With status (character counter)
- * <FormField
- *   label="Bio"
- *   htmlFor="bio"
- *   status="280 van 500 karakters gebruikt"
- * >
- *   <TextArea id="bio" rows={4} />
- * </FormField>
- *
- * // With positive status
- * <FormField
- *   label="Wachtwoord"
- *   htmlFor="password"
- *   status="Wachtwoord is sterk genoeg"
- *   statusVariant="positive"
- * >
- *   <PasswordInput id="password" />
- * </FormField>
- * ```
- */
-export const FormField = React.forwardRef(({ label, htmlFor, labelSuffix, description, error, status, statusVariant = 'default', className, children, }, ref) => {
-    const descriptionId = htmlFor && description ? `${htmlFor}-description` : undefined;
-    const errorId = htmlFor && error ? `${htmlFor}-error` : undefined;
-    const statusId = htmlFor && status ? `${htmlFor}-status` : undefined;
-    const containerClasses = classNames('dsn-form-field', {
-        'dsn-form-field--invalid': !!error,
-    }, className);
-    return (_jsxs("div", { ref: ref, className: containerClasses, children: [_jsx(FormFieldLabel, { htmlFor: htmlFor, suffix: labelSuffix, children: label }), description && (_jsx(FormFieldDescription, { id: descriptionId, children: description })), error && (_jsx(FormFieldErrorMessage, { id: errorId, children: error })), children, status && (_jsx(FormFieldStatus, { id: statusId, variant: statusVariant, children: status }))] }));
-});
-FormField.displayName = 'FormField';
-//# sourceMappingURL=FormField.js.map

package/dist/FormField/FormField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../src/FormField/FormField.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,eAAe,EAA0B,MAAM,oBAAoB,CAAC;AAC7E,OAAO,iBAAiB,CAAC;AAkDzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACvC,CACE,EACE,KAAK,EACL,OAAO,EACP,WAAW,EACX,WAAW,EACX,KAAK,EACL,MAAM,EACN,aAAa,GAAG,SAAS,EACzB,SAAS,EACT,QAAQ,GACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,aAAa,GACjB,OAAO,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,OAAO,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC;IAChE,MAAM,OAAO,GAAG,OAAO,IAAI,KAAK,CAAC,CAAC,CAAC,GAAG,OAAO,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAClE,MAAM,QAAQ,GAAG,OAAO,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,OAAO,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IAErE,MAAM,gBAAgB,GAAG,UAAU,CACjC,gBAAgB,EAChB;QACE,yBAAyB,EAAE,CAAC,CAAC,KAAK;KACnC,EACD,SAAS,CACV,CAAC;IAEF,OAAO,CACL,eAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,gBAAgB,aACxC,KAAC,cAAc,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,YAClD,KAAK,GACS,EAEhB,WAAW,IAAI,CACd,KAAC,oBAAoB,IAAC,EAAE,EAAE,aAAa,YACpC,WAAW,GACS,CACxB,EAEA,KAAK,IAAI,CACR,KAAC,qBAAqB,IAAC,EAAE,EAAE,OAAO,YAAG,KAAK,GAAyB,CACpE,EAEA,QAAQ,EAER,MAAM,IAAI,CACT,KAAC,eAAe,IAAC,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,YAClD,MAAM,GACS,CACnB,IACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC"}

package/dist/FormField/index.d.ts

@@ -1,3 +0,0 @@
-export { FormField } from './FormField';
-export type { FormFieldProps } from './FormField';
-//# sourceMappingURL=index.d.ts.map

package/dist/FormField/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/FormField/index.js

@@ -1,2 +0,0 @@
-export { FormField } from './FormField';
-//# sourceMappingURL=index.js.map

package/dist/FormField/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/FormField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}

package/dist/FormFieldDescription/FormFieldDescription.css

@@ -1,25 +0,0 @@
-/**
- * FormFieldDescription Component Styles for React
- * Re-exports the base FormFieldDescription styles from components-html
- */
-
-/**
- * Form Field Description Component
- * Optional help text displayed below the label and above the form control
- *
- * Usage:
- * <p class="dsn-form-field-description">
- *   Vul hier uw officiële voornaam in zoals deze op uw paspoort staat.
- * </p>
- */
-
-.dsn-form-field-description {
-  font-family: var(--dsn-form-field-description-font-family);
-  font-size: var(--dsn-form-field-description-font-size);
-  font-weight: var(--dsn-form-field-description-font-weight);
-  line-height: var(--dsn-form-field-description-line-height);
-  color: var(--dsn-form-field-description-color);
-  margin-block-start: 0;
-  margin-block-end: var(--dsn-form-field-description-margin-block-end);
-}
-

package/dist/FormFieldDescription/FormFieldDescription.d.ts

@@ -1,47 +0,0 @@
-import React from 'react';
-import './FormFieldDescription.css';
-export interface FormFieldDescriptionProps extends React.HTMLAttributes<HTMLElement> {
-    /**
-     * HTML element to render — use 'div' when the description contains block-level
-     * content such as a list (a <ul> cannot be nested inside a <p>)
-     * @default 'p'
-     */
-    as?: 'p' | 'div';
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-    /**
-     * Description content
-     */
-    children?: React.ReactNode;
-}
-/**
- * Form Field Description component
- * Optional help text displayed below the label and above the form control.
- * Use `as="div"` when the description contains block-level content like a list.
- *
- * @example
- * ```tsx
- * // Basic usage
- * <FormFieldDescription>
- *   Vul hier uw officiële voornaam in zoals deze op uw paspoort staat.
- * </FormFieldDescription>
- *
- * // With ID for aria-describedby
- * <FormFieldDescription id="email-description">
- *   We gebruiken uw e-mailadres alleen voor accountgerelateerde berichten.
- * </FormFieldDescription>
- *
- * // With a list (requires as="div" to avoid invalid HTML)
- * <FormFieldDescription as="div" id="upload-description">
- *   Toegestane bestandstypen:
- *   <UnorderedList>
- *     <li>PDF (max. 5 MB)</li>
- *     <li>Word-documenten (.docx)</li>
- *   </UnorderedList>
- * </FormFieldDescription>
- * ```
- */
-export declare const FormFieldDescription: React.ForwardRefExoticComponent<FormFieldDescriptionProps & React.RefAttributes<HTMLElement>>;
-//# sourceMappingURL=FormFieldDescription.d.ts.map

package/dist/FormFieldDescription/FormFieldDescription.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormFieldDescription.d.ts","sourceRoot":"","sources":["../../src/FormFieldDescription/FormFieldDescription.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,4BAA4B,CAAC;AAEpC,MAAM,WAAW,yBAA0B,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAClF;;;;OAIG;IACH,EAAE,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC;IAEjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,oBAAoB,+FAe/B,CAAC"}

package/dist/FormFieldDescription/FormFieldDescription.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import { classNames } from '@dsn-starter-kit/core';
-import './FormFieldDescription.css';
-/**
- * Form Field Description component
- * Optional help text displayed below the label and above the form control.
- * Use `as="div"` when the description contains block-level content like a list.
- *
- * @example
- * ```tsx
- * // Basic usage
- * <FormFieldDescription>
- *   Vul hier uw officiële voornaam in zoals deze op uw paspoort staat.
- * </FormFieldDescription>
- *
- * // With ID for aria-describedby
- * <FormFieldDescription id="email-description">
- *   We gebruiken uw e-mailadres alleen voor accountgerelateerde berichten.
- * </FormFieldDescription>
- *
- * // With a list (requires as="div" to avoid invalid HTML)
- * <FormFieldDescription as="div" id="upload-description">
- *   Toegestane bestandstypen:
- *   <UnorderedList>
- *     <li>PDF (max. 5 MB)</li>
- *     <li>Word-documenten (.docx)</li>
- *   </UnorderedList>
- * </FormFieldDescription>
- * ```
- */
-export const FormFieldDescription = React.forwardRef(({ as: As = 'p', className, children, ...props }, ref) => {
-    const classes = classNames('dsn-form-field-description', className);
-    return (_jsx(As, { ref: ref, className: classes, ...props, children: children }));
-});
-FormFieldDescription.displayName = 'FormFieldDescription';
-//# sourceMappingURL=FormFieldDescription.js.map

package/dist/FormFieldDescription/FormFieldDescription.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormFieldDescription.js","sourceRoot":"","sources":["../../src/FormFieldDescription/FormFieldDescription.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,4BAA4B,CAAC;AAqBpC;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,KAAK,CAAC,UAAU,CAGlD,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACzD,MAAM,OAAO,GAAG,UAAU,CAAC,4BAA4B,EAAE,SAAS,CAAC,CAAC;IAEpE,OAAO,CACL,KAAC,EAAE,IACD,GAAG,EAAE,GAAsC,EAC3C,SAAS,EAAE,OAAO,KACd,KAAK,YAER,QAAQ,GACN,CACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC"}

package/dist/FormFieldDescription/index.d.ts

@@ -1,3 +0,0 @@
-export { FormFieldDescription } from './FormFieldDescription';
-export type { FormFieldDescriptionProps } from './FormFieldDescription';
-//# sourceMappingURL=index.d.ts.map

package/dist/FormFieldDescription/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldDescription/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/FormFieldDescription/index.js

@@ -1,2 +0,0 @@
-export { FormFieldDescription } from './FormFieldDescription';
-//# sourceMappingURL=index.js.map

package/dist/FormFieldDescription/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/FormFieldDescription/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/FormFieldErrorMessage/FormFieldErrorMessage.css

@@ -1,38 +0,0 @@
-/**
- * FormFieldErrorMessage Component Styles for React
- * Re-exports the base FormFieldErrorMessage styles from components-html
- */
-
-/**
- * Form Field Error Message Component
- * Error message displayed below the description and above the form control
- * Supports optional icon (exclamation-circle) before the message text
- *
- * Usage:
- * <p class="dsn-form-field-error-message">
- *   <svg class="dsn-icon" aria-hidden="true">...</svg>
- *   Dit veld is verplicht.
- * </p>
- */
-
-.dsn-form-field-error-message {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--dsn-form-field-error-message-gap);
-  font-family: var(--dsn-form-field-error-message-font-family);
-  font-size: var(--dsn-form-field-error-message-font-size);
-  font-weight: var(--dsn-form-field-error-message-font-weight);
-  line-height: var(--dsn-form-field-error-message-line-height);
-  color: var(--dsn-form-field-error-message-color);
-  margin-block-start: 0;
-  margin-block-end: var(--dsn-form-field-error-message-margin-block-end);
-}
-
-/* Icon sizing within error message */
-.dsn-form-field-error-message > .dsn-icon {
-  flex-shrink: 0;
-  width: var(--dsn-form-field-error-message-icon-size);
-  height: var(--dsn-form-field-error-message-icon-size);
-  color: inherit;
-}
-

package/dist/FormFieldErrorMessage/FormFieldErrorMessage.d.ts

@@ -1,40 +0,0 @@
-import React from 'react';
-import './FormFieldErrorMessage.css';
-export interface FormFieldErrorMessageProps extends React.HTMLAttributes<HTMLParagraphElement> {
-    /**
-     * Whether to show the exclamation-circle icon before the message
-     * @default true
-     */
-    showIcon?: boolean;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-    /**
-     * Error message content
-     */
-    children?: React.ReactNode;
-}
-/**
- * Form Field Error Message component
- * Error message displayed below the description and above the form control
- * Shows exclamation-circle icon by default for visual emphasis
- *
- * @example
- * ```tsx
- * // Basic usage with icon (default)
- * <FormFieldErrorMessage>Dit veld is verplicht.</FormFieldErrorMessage>
- *
- * // Without icon
- * <FormFieldErrorMessage showIcon={false}>
- *   Ongeldige waarde opgegeven.
- * </FormFieldErrorMessage>
- *
- * // With ID for aria-describedby
- * <FormFieldErrorMessage id="email-error">
- *   Vul een geldig e-mailadres in.
- * </FormFieldErrorMessage>
- * ```
- */
-export declare const FormFieldErrorMessage: React.ForwardRefExoticComponent<FormFieldErrorMessageProps & React.RefAttributes<HTMLParagraphElement>>;
-//# sourceMappingURL=FormFieldErrorMessage.d.ts.map

package/dist/FormFieldErrorMessage/FormFieldErrorMessage.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormFieldErrorMessage.d.ts","sourceRoot":"","sources":["../../src/FormFieldErrorMessage/FormFieldErrorMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,6BAA6B,CAAC;AAErC,MAAM,WAAW,0BAA2B,SAAQ,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC;IAC5F;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,qBAAqB,yGAYhC,CAAC"}

package/dist/FormFieldErrorMessage/FormFieldErrorMessage.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { classNames } from '@dsn-starter-kit/core';
-import { Icon } from '../Icon';
-import './FormFieldErrorMessage.css';
-/**
- * Form Field Error Message component
- * Error message displayed below the description and above the form control
- * Shows exclamation-circle icon by default for visual emphasis
- *
- * @example
- * ```tsx
- * // Basic usage with icon (default)
- * <FormFieldErrorMessage>Dit veld is verplicht.</FormFieldErrorMessage>
- *
- * // Without icon
- * <FormFieldErrorMessage showIcon={false}>
- *   Ongeldige waarde opgegeven.
- * </FormFieldErrorMessage>
- *
- * // With ID for aria-describedby
- * <FormFieldErrorMessage id="email-error">
- *   Vul een geldig e-mailadres in.
- * </FormFieldErrorMessage>
- * ```
- */
-export const FormFieldErrorMessage = React.forwardRef(({ showIcon = true, className, children, ...props }, ref) => {
-    const classes = classNames('dsn-form-field-error-message', className);
-    return (_jsxs("p", { ref: ref, className: classes, ...props, children: [showIcon && _jsx(Icon, { name: "exclamation-circle", "aria-hidden": true }), children] }));
-});
-FormFieldErrorMessage.displayName = 'FormFieldErrorMessage';
-//# sourceMappingURL=FormFieldErrorMessage.js.map

package/dist/FormFieldErrorMessage/FormFieldErrorMessage.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormFieldErrorMessage.js","sourceRoot":"","sources":["../../src/FormFieldErrorMessage/FormFieldErrorMessage.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,6BAA6B,CAAC;AAoBrC;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CAGnD,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC5D,MAAM,OAAO,GAAG,UAAU,CAAC,8BAA8B,EAAE,SAAS,CAAC,CAAC;IAEtE,OAAO,CACL,aAAG,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,KAAM,KAAK,aACvC,QAAQ,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,oBAAoB,wBAAe,EAC1D,QAAQ,IACP,CACL,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,WAAW,GAAG,uBAAuB,CAAC"}

package/dist/FormFieldErrorMessage/index.d.ts

@@ -1,3 +0,0 @@
-export { FormFieldErrorMessage } from './FormFieldErrorMessage';
-export type { FormFieldErrorMessageProps } from './FormFieldErrorMessage';
-//# sourceMappingURL=index.d.ts.map

package/dist/FormFieldErrorMessage/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldErrorMessage/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/FormFieldErrorMessage/index.js

@@ -1,2 +0,0 @@
-export { FormFieldErrorMessage } from './FormFieldErrorMessage';
-//# sourceMappingURL=index.js.map

package/dist/FormFieldErrorMessage/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/FormFieldErrorMessage/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/FormFieldLabel/FormFieldLabel.css

@@ -1,48 +0,0 @@
-/**
- * FormFieldLabel Component Styles for React
- * Re-exports the base FormFieldLabel styles from components-html
- */
-
-/**
- * Form Field Label Component
- * Label for form controls with optional suffix for "(niet verplicht)" or "(verplicht)"
- *
- * Usage:
- * <label class="dsn-form-field-label">
- *   Voornaam
- *   <span class="dsn-form-field-label-suffix">(niet verplicht)</span>
- * </label>
- */
-
-.dsn-form-field-label {
-  display: block;
-  font-family: var(--dsn-form-field-label-font-family);
-  font-size: var(--dsn-form-field-label-font-size);
-  font-weight: var(--dsn-form-field-label-font-weight);
-  line-height: var(--dsn-form-field-label-line-height);
-  color: var(--dsn-form-field-label-color);
-  margin-block-start: 0;
-  margin-block-end: var(--dsn-form-field-label-margin-block-end);
-}
-
-/* Reduced margin when followed by description */
-.dsn-form-field-label:has(+ .dsn-form-field-description) {
-  margin-block-end: var(
-    --dsn-form-field-label-margin-block-end-with-description
-  );
-}
-
-/**
- * Form Field Label Suffix
- * Optional suffix text within the label (e.g., "(niet verplicht)")
- * Same size but regular weight and inline with label text
- */
-.dsn-form-field-label-suffix {
-  font-family: var(--dsn-form-field-label-suffix-font-family);
-  font-size: var(--dsn-form-field-label-suffix-font-size);
-  font-weight: var(--dsn-form-field-label-suffix-font-weight);
-  line-height: var(--dsn-form-field-label-suffix-line-height);
-  color: var(--dsn-form-field-label-suffix-color);
-  margin-inline-start: var(--dsn-form-field-label-suffix-margin-inline-start);
-}
-

package/dist/FormFieldLabel/FormFieldLabel.d.ts

@@ -1,38 +0,0 @@
-import React from 'react';
-import './FormFieldLabel.css';
-export interface FormFieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
-    /**
-     * Optional suffix text displayed after the label (e.g., "(niet verplicht)")
-     */
-    suffix?: string;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-    /**
-     * Label content
-     */
-    children?: React.ReactNode;
-}
-/**
- * Form Field Label component
- * Label for form controls with optional suffix for "(niet verplicht)" or "(verplicht)"
- *
- * @example
- * ```tsx
- * // Basic usage
- * <FormFieldLabel htmlFor="firstname">Voornaam</FormFieldLabel>
- *
- * // With suffix for optional fields
- * <FormFieldLabel htmlFor="middlename" suffix="(niet verplicht)">
- *   Tussenvoegsel
- * </FormFieldLabel>
- *
- * // With suffix for required fields (when most fields are optional)
- * <FormFieldLabel htmlFor="email" suffix="(verplicht)">
- *   E-mailadres
- * </FormFieldLabel>
- * ```
- */
-export declare const FormFieldLabel: React.ForwardRefExoticComponent<FormFieldLabelProps & React.RefAttributes<HTMLLabelElement>>;
-//# sourceMappingURL=FormFieldLabel.d.ts.map

package/dist/FormFieldLabel/FormFieldLabel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormFieldLabel.d.ts","sourceRoot":"","sources":["../../src/FormFieldLabel/FormFieldLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,sBAAsB,CAAC;AAE9B,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IACtF;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,cAAc,8FAYzB,CAAC"}

package/dist/FormFieldLabel/FormFieldLabel.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { classNames } from '@dsn-starter-kit/core';
-import './FormFieldLabel.css';
-/**
- * Form Field Label component
- * Label for form controls with optional suffix for "(niet verplicht)" or "(verplicht)"
- *
- * @example
- * ```tsx
- * // Basic usage
- * <FormFieldLabel htmlFor="firstname">Voornaam</FormFieldLabel>
- *
- * // With suffix for optional fields
- * <FormFieldLabel htmlFor="middlename" suffix="(niet verplicht)">
- *   Tussenvoegsel
- * </FormFieldLabel>
- *
- * // With suffix for required fields (when most fields are optional)
- * <FormFieldLabel htmlFor="email" suffix="(verplicht)">
- *   E-mailadres
- * </FormFieldLabel>
- * ```
- */
-export const FormFieldLabel = React.forwardRef(({ suffix, className, children, ...props }, ref) => {
-    const classes = classNames('dsn-form-field-label', className);
-    return (_jsxs("label", { ref: ref, className: classes, ...props, children: [children, suffix && _jsx("span", { className: "dsn-form-field-label-suffix", children: suffix })] }));
-});
-FormFieldLabel.displayName = 'FormFieldLabel';
-//# sourceMappingURL=FormFieldLabel.js.map

package/dist/FormFieldLabel/FormFieldLabel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormFieldLabel.js","sourceRoot":"","sources":["../../src/FormFieldLabel/FormFieldLabel.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,sBAAsB,CAAC;AAmB9B;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAG5C,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACnD,MAAM,OAAO,GAAG,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC;IAE9D,OAAO,CACL,iBAAO,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,KAAM,KAAK,aAC3C,QAAQ,EACR,MAAM,IAAI,eAAM,SAAS,EAAC,6BAA6B,YAAE,MAAM,GAAQ,IAClE,CACT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}

package/dist/FormFieldLabel/index.d.ts

@@ -1,3 +0,0 @@
-export { FormFieldLabel } from './FormFieldLabel';
-export type { FormFieldLabelProps } from './FormFieldLabel';
-//# sourceMappingURL=index.d.ts.map

package/dist/FormFieldLabel/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLabel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/FormFieldLabel/index.js

@@ -1,2 +0,0 @@
-export { FormFieldLabel } from './FormFieldLabel';
-//# sourceMappingURL=index.js.map

package/dist/FormFieldLabel/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/FormFieldLabel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/FormFieldLegend/FormFieldLegend.css

@@ -1,7 +0,0 @@
-/**
- * FormFieldLegend Component Styles
- * Re-uses FormFieldLabel styles for consistent appearance
- * The legend element uses the same .dsn-form-field-label class
- */
-
-/* FormFieldLegend uses the FormFieldLabel CSS classes, no additional styles needed */