@stihl-design-system/components 1.0.0-RC.32 → 1.0.0-RC.35

package/components/{InputStepper/InputStepper.d.ts → InputNumber/InputNumber.d.ts}

@@ -1,7 +1,7 @@
 import { InputHTMLAttributes } from 'react';
 import { BreakpointCustomizable } from '../../types';
 import { InputSize } from '../Input/Input.utils';
-export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size' | 'value'> {
+export interface InputNumberProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size' | 'value'> {
     /** Unique id for the input. */
     id: string;
     /** Label text displayed above the input. */
@@ -61,8 +61,25 @@ export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputEle
      * @default 0
      */
     min?: number | string;
+    /** The interval between legal numbers of the input.
+     * @default 1
+     */
+    step?: number | string;
     /** Text displayed as a prefix inside the input, maximum 8 characters. */
     prefix?: string;
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Enables the readonly state of the input.
      * @default false
      */
@@ -71,10 +88,6 @@ export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputEle
      * @default false
      */
     required?: boolean;
-    /** The interval between legal numbers of the input.
-     * @default 1
-     */
-    step?: number | string;
     /** Text displayed as a suffix inside the input, maximum 5 characters. */
     suffix?: string;
     /** Defines a system feedback message, shown when `invalid={true}`. */
@@ -87,11 +100,11 @@ export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputEle
     value?: InputHTMLAttributes<HTMLInputElement>['value'];
 }
 /**
- * The `<DSInputStepper />` component is a versatile input field that allows users to easily enter a value and decrease or increase it as needed.
+ * The `<DSInputNumber />` component is a versatile input field that allows users to easily enter a value and decrease or increase it as needed.
  * It comes in two sizes (medium & small) and supports various customizations including a prefix and suffix.
  *
  * Next to the input field, there are two buttons to increase or decrease the input value.
  *
- * Design in Figma: [Input Stepper](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=2141-6769&t=UBsmFURFENnuYSW1-11)
+ * Design in Figma: [Input Number](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=2141-6769&t=UBsmFURFENnuYSW1-11)
  */
-export declare const DSInputStepper: import('react').ForwardRefExoticComponent<InputStepperProps & import('react').RefAttributes<HTMLInputElement>>;
+export declare const DSInputNumber: import('react').ForwardRefExoticComponent<InputNumberProps & import('react').RefAttributes<HTMLInputElement>>;

package/components/InputNumber/InputNumber.utils.d.ts

@@ -0,0 +1,13 @@
+import { InputNumberProps } from './InputNumber';
+type ValidationProps = Pick<InputNumberProps, 'id' | 'label' | 'prefix' | 'suffix' | 'hideLabel' | 'popoverContent'>;
+export declare const isValidValue: (value: string | number | readonly string[] | undefined | null) => boolean;
+/**
+ * Validates the given properties of the DSInputNumber component for common configuration errors.
+ * This function is intended to be used in development mode to provide developers with
+ * warnings about potential misuse of the component.
+ *
+ * @param validationProps - The subset of DSInputNumber properties to validate. This includes
+ *                          properties related to the prefix, suffix, icons and action button of the input.
+ */
+export declare const validateInputNumberProps: ({ id, label, prefix, suffix, hideLabel, popoverContent, }: ValidationProps) => void;
+export {};

package/components/InputPassword/InputPassword.d.ts

@@ -25,6 +25,19 @@ export interface InputPasswordProps extends Omit<InputHTMLAttributes<HTMLInputEl
      * @default false
      */
     invalid?: boolean;
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Enables the readonly state of the input.
      * @default false
      */

package/components/InputPassword/InputPassword.utils.d.ts

@@ -1,5 +1,5 @@
 import { InputPasswordProps } from './InputPassword';
-type ValidationProps = Pick<InputPasswordProps, 'id' | 'label'>;
+type ValidationProps = Pick<InputPasswordProps, 'id' | 'label' | 'hideLabel' | 'popoverContent'>;
 /**
  * Validates the given properties of the DSInputPassword component for common configuration errors.
  * This function is intended to be used in development mode to provide developers with
@@ -8,5 +8,5 @@ type ValidationProps = Pick<InputPasswordProps, 'id' | 'label'>;
  * @param validationProps - The subset of DSInputPassword properties to validate. This includes
  *                          id and label.
  */
-export declare const validateInputPasswordProps: ({ id, label }: ValidationProps) => void;
+export declare const validateInputPasswordProps: ({ id, label, hideLabel, popoverContent, }: ValidationProps) => void;
 export {};

package/components/InputSearch/InputSearch.d.ts

@@ -25,6 +25,19 @@ export interface InputSearchProps extends Omit<InputHTMLAttributes<HTMLInputElem
      * @default false
      */
     invalid?: boolean;
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Enables the readonly state of the input.
      * @default false
      */

package/components/InputSearch/InputSearch.utils.d.ts

@@ -1,5 +1,5 @@
 import { InputSearchProps } from './InputSearch';
-type ValidationProps = Pick<InputSearchProps, 'id' | 'label'>;
+type ValidationProps = Pick<InputSearchProps, 'id' | 'label' | 'hideLabel' | 'popoverContent'>;
 /**
  * Validates the given properties of the DSInputSearch component for common configuration errors.
  * This function is intended to be used in development mode to provide developers with
@@ -8,7 +8,7 @@ type ValidationProps = Pick<InputSearchProps, 'id' | 'label'>;
  * @param validationProps - The subset of DSInputSearch properties to validate. This includes
  *                          id and label.
  */
-export declare const validateInputSearchProps: ({ id, label }: ValidationProps) => void;
+export declare const validateInputSearchProps: ({ id, label, hideLabel, popoverContent, }: ValidationProps) => void;
 /**
  * Determines whether the specified HTMLElement is within a form element.
  *

package/components/LinkButton/LinkButton.d.ts

@@ -53,6 +53,11 @@ export interface LinkButtonProps extends CommonLinkProps {
      * @default 'medium'
      */
     size?: LinkButtonSize;
+    /** Stretches the link over the parent's width.
+     *  `boolean | { base: boolean; s?: boolean; m?: boolean; l?: boolean; xl?: boolean; }`
+     * @default false
+     */
+    stretched?: BreakpointCustomizable<boolean>;
     /** Visual style variant of the link.
      * @default 'filled'
      */

package/components/LinkButton/LinkButton.utils.d.ts

@@ -7,19 +7,18 @@ export type LinkButtonIconPosition = 'left' | 'right';
 export type LinkButtonRel = 'alternate' | 'author' | 'bookmark' | 'external' | 'help' | 'license' | 'next' | 'nofollow' | 'noreferrer' | 'noopener' | 'prev' | 'search' | 'tag';
 export type LinkButtonReferrerPolicy = 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';
 export type LinkButtonAriaAttribute = 'aria-label' | 'aria-current' | 'aria-labelledby';
-type ValidationProps = Pick<LinkButtonProps, 'variant' | 'size' | 'theme'>;
+type ValidationProps = Pick<LinkButtonProps, 'hideLabel' | 'iconName' | 'iconSource' | 'isFlush' | 'size' | 'stretched' | 'theme' | 'variant'>;
 /**
  * Performs runtime validation on a subset of `DSLinkButton` props to detect
  * misconfigurations during development.
  *
- * This function provides warnings or throws errors when invalid combinations
- * of `variant`, `size`, or `theme` are detected—particularly for the `navigation` variant.
+ * This function provides warnings or throws errors when invalid combinations of props occur.
  *
  * Intended for development use only; should not be used in production environments.
  *
- * @param validationProps - An object containing the `variant`, `size`, and `theme` props
+ * @param validationProps - An object containing the props to validate
  *                          from the `DSLinkButton` component. These are validated to ensure
  *                          they are used in supported combinations.
  */
-export declare const validateLinkButtonProps: ({ variant, size, theme, }: ValidationProps) => void;
+export declare const validateLinkButtonProps: ({ hideLabel, iconName, iconSource, isFlush, size, stretched, theme, variant, }: ValidationProps) => void;
 export {};

package/components/RadioGroup/RadioGroup.d.ts

@@ -45,6 +45,19 @@ export interface RadioGroupProps extends Omit<FieldsetHTMLAttributes<HTMLFieldSe
      * @default false
      */
     invalid?: boolean;
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Marks the radio group as required.
      *  When this property is set, an asterisk (*) is automatically appended to the radio group's legend.
      * @default false

package/components/Scroller/Scroller.d.ts

@@ -1,7 +1,11 @@
-import { HTMLAttributes, JSX } from 'react';
+import { HTMLAttributes } from 'react';
 export interface ScrollerProps extends HTMLAttributes<HTMLDivElement> {
     /** Content to be displayed within the scroller. */
     children?: React.ReactNode;
+    /** Additional class name to apply to the scrolling element. */
+    scrollerClassName?: string;
+    /** Additional class name to apply to the scroll buttons. */
+    scrollerButtonClassName?: string;
     /** Scrolls the scroll area to the left either smooth or immediately.
      *  `{scrollPosition: number;`
      *  `isSmooth?: boolean;}`
@@ -17,4 +21,4 @@ export interface ScrollerProps extends HTMLAttributes<HTMLDivElement> {
  *
  * Design in Figma: [Scroller](https://www.figma.com/design/Ie2r0R9QwjEc7O3nrFbXhV/Web-Pattern-Library?node-id=6263-49213&t=wRBNgx5siTv3aUkL-11)
  */
-export declare const DSScroller: ({ children, className, scrollToPosition, ...rest }: ScrollerProps) => JSX.Element;
+export declare const DSScroller: import('react').ForwardRefExoticComponent<ScrollerProps & import('react').RefAttributes<HTMLDivElement>>;

package/components/Select/Select.d.ts

@@ -28,6 +28,19 @@ export interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement
      * @default false
      */
     invalid?: boolean;
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Modifies the empty option label to ensure a conscious choice.
      * @default 'Select'
      */

package/components/Select/Select.utils.d.ts

@@ -1,7 +1,7 @@
 import { HTMLAttributes } from 'react';
 import { GroupBase, OptionsOrGroups } from 'react-select';
 import { SelectProps } from './Select';
-type ValidationProps = Pick<SelectProps, 'id' | 'label' | 'options'>;
+type ValidationProps = Pick<SelectProps, 'id' | 'label' | 'options' | 'hideLabel' | 'popoverContent'>;
 export interface SelectOption extends HTMLAttributes<HTMLOptionElement> {
     label: string;
     value: string | number;
@@ -19,7 +19,7 @@ export type SelectSize = (typeof SELECT_SIZE)[number];
  * @param validationProps - The subset of DSSelect properties to validate. This includes
  *                          id and label.
  */
-export declare const validateSelectProps: ({ id, label, options, }: ValidationProps) => void;
+export declare const validateSelectProps: ({ id, label, options, hideLabel, popoverContent, }: ValidationProps) => void;
 /**
  * Determines the initial visibility of the placeholder based on the `placeholder` string and
  * the values of `defaultValue` and `value` from the props.

package/components/Slider/Slider.d.ts

@@ -51,6 +51,19 @@ export interface SliderProps extends InputHTMLAttributes<HTMLInputElement> {
         suffix?: string;
         size?: InputSize;
     };
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
 }
 /**
  * The `<DSSlider />` component is a flexible range input that allows users to select a value within a defined range.

package/components/Stepper/Step.d.ts

@@ -0,0 +1,33 @@
+import { default as React, JSX } from 'react';
+import { StepState } from './Step.utils';
+import { StepperTranslations } from './Stepper.utils';
+/** Local copy of the Step data contract to avoid circular dependency with `Stepper.tsx`. */
+export interface Step {
+    label: string;
+    hint?: string;
+    disabled?: boolean;
+    state?: StepState;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+export interface StepperStepProps {
+    /** Step object */
+    step: Step;
+    /** Index of this step in the list */
+    index: number;
+    /** Orientation of the Stepper */
+    orientation: 'horizontal' | 'vertical';
+    /** Total number of steps */
+    stepsCount: number;
+    /** Translation function */
+    t: (key: keyof StepperTranslations, replacements?: string[]) => string;
+    /** Called when the button is clicked (index is already bound in parent) */
+    onStepClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    /** Collect the ref for scroll / focus management */
+    buttonRef?: (el: HTMLButtonElement | null) => void;
+}
+/**
+ * Presentational single Step inside the DSStepper.
+ * Keeps the markup & ARIA logic isolated from the Stepper container.
+ */
+export declare const StepperStep: ({ step, index, stepsCount, t, onStepClick, buttonRef, orientation, }: StepperStepProps) => JSX.Element;
+export default StepperStep;

package/components/Stepper/Step.utils.d.ts

@@ -0,0 +1,5 @@
+import { Step } from './Step';
+import { StepperTranslations } from './Stepper.utils';
+export declare const STEP_STATE: readonly ["current", "completed", undefined];
+export type StepState = (typeof STEP_STATE)[number];
+export declare const getStepAriaLabel: (t: (key: keyof StepperTranslations, replacements?: string[]) => string, index: number, total: number, step: Step, isCurrent: boolean) => string;

package/components/Stepper/Stepper.d.ts

@@ -0,0 +1,56 @@
+import { default as React, JSX } from 'react';
+import { SelectedAriaAttributes } from '../../types';
+import { StepState } from './Step.utils';
+import { StepperAlignment, StepperAriaAttributes, StepperLanguage, StepperOrientation, StepperTranslations } from './Stepper.utils';
+export interface Step {
+    /** Label text displayed for the Step. */
+    label: string;
+    /** Short descriptive text displayed beneath the label. */
+    hint?: string;
+    /** Disables the Step, preventing user interaction.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * State of the Step. If set to 'current', the step is highlighted as the current step.
+     * @default undefined
+     */
+    state?: StepState;
+    /** Callback function called when the Step is clicked. */
+    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+export interface StepperProps extends React.HTMLAttributes<HTMLElement> {
+    /** ARIA attributes to enhance accessibility
+     *  `{'aria-label'? string;`
+     *  `'aria-labelledby'?: string;}`
+     * */
+    aria: SelectedAriaAttributes<StepperAriaAttributes>;
+    /** An array of Step Objects containing the label and other optional parameters.
+     * `{label: string; hint: string; disabled?: boolean; state?: 'current' | 'completed' | undefined; onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;}[]`*/
+    steps: Step[];
+    /** Callback function called when the selection of the Stepper changes. */
+    onStepChange: (selectedStepIndex: number) => void;
+    /** Alignment of the DSStepper.
+     * @default 'left'
+     */
+    alignment?: StepperAlignment;
+    /** Sets language to use for the screen reader messages, if no translations object is provided.
+     * @default 'en'
+     */
+    lang?: StepperLanguage;
+    /** Orientation of the DSStepper.
+     * @default 'horizontal'
+     */
+    orientation?: StepperOrientation;
+    /** Translations for the DSStepper. Use our [customization page](/?path=/story/components-stepper-translations--documentation) for creating custom translations. */
+    translations?: StepperTranslations;
+}
+/**
+ * The `<DSStepper />` component provides an accessible step-based navigation pattern following the `aria-current="step"` specification.
+ * It is a **controlled component** and does not manage its own state.
+ * It renders steps as buttons inside an ordered list (`<ol>`) wrapped in a semantic `<nav>` landmark.
+ * Horizontal overflow is handled via `<DSScroller>` preventing line wrapping while enabling keyboard and pointer based scrolling.
+ *
+ * Design in Figma: [Stepper](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=26075-10497)
+ */
+export declare const DSStepper: ({ aria, className, steps, orientation, alignment, lang, translations, onStepChange, ...rest }: StepperProps) => JSX.Element;

package/components/Stepper/Stepper.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/Stepper/Stepper.utils.d.ts

@@ -0,0 +1,30 @@
+import { Step } from './Step';
+import { StepperProps } from './Stepper';
+export type StepperAriaAttributes = 'aria-label' | 'aria-labelledby';
+export declare const STEPPER_ALIGNMENT: readonly ["left", "center"];
+export type StepperAlignment = (typeof STEPPER_ALIGNMENT)[number];
+export declare const STEPPER_ORIENTATION: readonly ["horizontal", "vertical"];
+export type StepperOrientation = (typeof STEPPER_ORIENTATION)[number];
+export type ValidateStepperPropsParams = Pick<StepperProps, 'aria' | 'steps'>;
+export declare const validateStepperProps: ({ aria, steps, }: ValidateStepperPropsParams) => void;
+export declare const validateIsLiveRegionPresentForStepper: () => void;
+export type StepperLanguage = 'en' | 'de';
+export type StepperTranslations = typeof DS_STEPPER_TRANSLATIONS_EN;
+export declare const DS_STEPPER_TRANSLATIONS_EN: {
+    current: string;
+    completed: string;
+    step: string;
+    of: string;
+};
+export declare const DS_STEPPER_TRANSLATIONS_DE: StepperTranslations;
+export declare const DS_STEPPER_TRANSLATIONS: Record<StepperLanguage, StepperTranslations>;
+/**
+ * Get the current step in the stepper.
+ * If no step is marked as 'current', the last step with a defined state is returned.
+ * If no steps have a defined state, the first step is returned.
+ * @param steps The array of steps.
+ * @returns The current step.
+ */
+export declare const getCurrentStep: (steps: Step[]) => Step;
+export declare const getCurrentStepIndex: (steps: Step[]) => number;
+export declare const isStepClickable: (state: Step["state"], disabled: boolean | undefined) => boolean;

package/components/Stepper/Stepper.utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/Textarea/Textarea.d.ts

@@ -31,6 +31,19 @@ export interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaE
     invalid?: boolean;
     /** Maximum length of the textarea value - if set, a character counter is visible beneath the textarea. */
     maxLength?: number;
+    /** Shows an info button next to the label that triggers a popover with the passed content. */
+    popoverContent?: React.ReactNode;
+    /** Popover info button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    popoverInfoButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Enables the readonly state of the textarea.
      * @default false
      */

package/components/Textarea/Textarea.utils.d.ts

@@ -1,7 +1,7 @@
 import { TextareaProps } from './Textarea';
 export declare const TEXTAREA_SIZE: readonly ["medium", "small"];
 export type TextareaSize = (typeof TEXTAREA_SIZE)[number];
-type ValidationProps = Pick<TextareaProps, 'id' | 'label'>;
+type ValidationProps = Pick<TextareaProps, 'id' | 'label' | 'hideLabel' | 'popoverContent'>;
 /**
  * Validates the given properties of the DSTextarea component for common configuration errors.
  * This function is intended to be used in development mode to provide developers with
@@ -9,5 +9,5 @@ type ValidationProps = Pick<TextareaProps, 'id' | 'label'>;
  *
  * @param validationProps - The subset of DSTextarea properties to validate.
  */
-export declare const validateTextareaProps: ({ id, label }: ValidationProps) => void;
+export declare const validateTextareaProps: ({ id, label, hideLabel, popoverContent, }: ValidationProps) => void;
 export {};

package/customreactselect.BgYf8rKE.js

@@ -0,0 +1,15 @@
+"use client";
+import "react/jsx-runtime";
+import "./chunks/index.D-sRdssb.js";
+import "./chunks/index.DL9mof6u.js";
+import "react";
+import { c as f } from "./chunks/CustomReactSelect.BA3hUVkh.js";
+import "./chunks/useBreakpoint.1txsny17.js";
+import "./asterisk.B2ih8VwF.js";
+import "./chunks/Icon.CDLyB7Pv.js";
+import "./chunks/Popover.D7McfVaH.js";
+import "./chunks/SystemFeedback.CjlARKki.js";
+import "./optioncheckbox.nBVwGv6c.js";
+export {
+  f as CustomReactSelect
+};

package/dialog.Bq-ZyzR8.js

@@ -0,0 +1,9 @@
+"use client";
+import "react/jsx-runtime";
+import "./chunks/index.DL9mof6u.js";
+import "react";
+import "./chunks/Button.Cn5yg7dG.js";
+import { D as e } from "./chunks/Dialog.DRk_jSj5.js";
+export {
+  e as DSDialog
+};

package/drawer.DL5UzLWf.js

@@ -0,0 +1,9 @@
+"use client";
+import "react/jsx-runtime";
+import "./chunks/index.DL9mof6u.js";
+import "react";
+import "./chunks/Button.Cn5yg7dG.js";
+import { D as e } from "./chunks/Drawer.Dj6WeUC8.js";
+export {
+  e as DSDrawer
+};

package/fieldset.BFLW2D9H.js

@@ -0,0 +1,12 @@
+"use client";
+import "react/jsx-runtime";
+import "./chunks/index.DL9mof6u.js";
+import "react";
+import "./asterisk.B2ih8VwF.js";
+import "./heading.DHLpT4dc.js";
+import "./chunks/Popover.D7McfVaH.js";
+import "./chunks/SystemFeedback.CjlARKki.js";
+import { D } from "./chunks/Fieldset.C0RzpI-h.js";
+export {
+  D as DSFieldset
+};

package/{filelist.BiKMKCyg.js → filelist.BG6SGVJ8.js}

@@ -1,14 +1,14 @@
 "use client";
-import { jsx as o, jsxs as I } from "react/jsx-runtime";
-import { d as P } from "./chunks/index.CgTHIF3K.js";
-import { D as k } from "./chunks/Button.Cf1CKq8N.js";
-import { D as u } from "./chunks/Icon.NSsVrYeq.js";
-import { D as S } from "./chunks/SystemFeedback.CyGbUCzT.js";
-import { c as j } from "./chunks/index.CEyLAtio.js";
-import './assets/filelist.H_wKcSPX.css';const F = new RegExp("([\\p{Ll}\\d])(\\p{Lu})", "gu"), z = new RegExp("(\\p{Lu})([\\p{Lu}][\\p{Ll}])", "gu"), y = new RegExp("(\\d)\\p{Ll}|(\\p{L})\\d", "u"), C = /[^\p{L}\d]+/giu, E = "$1\0$2", N = "";
-function R(t) {
+import { jsx as o, jsxs as w } from "react/jsx-runtime";
+import { d as P } from "./chunks/index.D-sRdssb.js";
+import { D as k } from "./chunks/Button.Cn5yg7dG.js";
+import { D as u } from "./chunks/Icon.CDLyB7Pv.js";
+import { D as S } from "./chunks/SystemFeedback.CjlARKki.js";
+import { c as j } from "./chunks/index.DL9mof6u.js";
+import './assets/filelist.H_wKcSPX.css';const F = new RegExp("([\\p{Ll}\\d])(\\p{Lu})", "gu"), z = new RegExp("(\\p{Lu})([\\p{Lu}][\\p{Ll}])", "gu"), y = new RegExp("(\\d)\\p{Ll}|(\\p{L})\\d", "u"), C = /[^\p{L}\d]+/giu, I = "$1\0$2", E = "";
+function N(t) {
   let e = t.trim();
-  e = e.replace(F, E).replace(z, E), e = e.replace(C, "\0");
+  e = e.replace(F, I).replace(z, I), e = e.replace(C, "\0");
   let a = 0, s = e.length;
   for (; e.charAt(a) === "\0"; )
     a++;
@@ -19,7 +19,7 @@ function R(t) {
   return e.slice(a, s).split(/\0/g);
 }
 function A(t) {
-  const e = R(t);
+  const e = N(t);
   for (let a = 0; a < e.length; a++) {
     const s = e[a], c = y.exec(s);
     if (c) {
@@ -31,7 +31,7 @@ function A(t) {
 }
 function D(t, e) {
   const [a, s, c] = q(t, e);
-  return a + s.map(U(e == null ? void 0 : e.locale)).join((e == null ? void 0 : e.delimiter) ?? " ") + c;
+  return a + s.map(U(e?.locale)).join(e?.delimiter ?? " ") + c;
 }
 function T(t, e) {
   return D(t, { delimiter: "-", ...e });
@@ -40,7 +40,7 @@ function U(t) {
   return t === !1 ? (e) => e.toLowerCase() : (e) => e.toLocaleLowerCase(t);
 }
 function q(t, e = {}) {
-  const a = e.split ?? (e.separateNumbers ? A : R), s = e.prefixCharacters ?? N, c = e.suffixCharacters ?? N;
+  const a = e.split ?? (e.separateNumbers ? A : N), s = e.prefixCharacters ?? E, c = e.suffixCharacters ?? E;
   let i = 0, f = t.length;
   for (; i < t.length; ) {
     const d = t.charAt(i);
@@ -115,33 +115,32 @@ const W = "ds-file-list_root_qx1ja_1", $ = "ds-file-list_file-wrapper_qx1ja_7",
   const d = f, x = Q;
   let b;
   e[2] !== i ? (b = (n) => {
-    var h;
-    const r = ((h = n.name.split(".").pop()) == null ? void 0 : h.toLowerCase()) || "", {
+    const r = n.name.split(".").pop()?.toLowerCase() || "", {
       nonDisplayableImages: p,
-      documents: g,
-      videos: L,
-      archives: w
+      documents: h,
+      videos: g,
+      archives: L
     } = J;
-    return n.type.startsWith("image/") ? p.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-image", className: l.fileIcon }) : /* @__PURE__ */ o("img", { src: URL.createObjectURL(n), alt: `${i("fileListPreviewAltText")} ${n.name}`, className: l.preview }) : g.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-doc", className: l.fileIcon }) : n.type === "application/pdf" ? /* @__PURE__ */ o(u, { name: "file-type-pdf", className: l.fileIcon }) : n.type.startsWith("video/") && L.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-video", className: l.fileIcon }) : w.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-zip", className: l.fileIcon }) : /* @__PURE__ */ o(u, { name: "file", className: l.fileIcon });
+    return n.type.startsWith("image/") ? p.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-image", className: l.fileIcon }) : /* @__PURE__ */ o("img", { src: URL.createObjectURL(n), alt: `${i("fileListPreviewAltText")} ${n.name}`, className: l.preview }) : h.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-doc", className: l.fileIcon }) : n.type === "application/pdf" ? /* @__PURE__ */ o(u, { name: "file-type-pdf", className: l.fileIcon }) : n.type.startsWith("video/") && g.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-video", className: l.fileIcon }) : L.includes(r) ? /* @__PURE__ */ o(u, { name: "file-type-zip", className: l.fileIcon }) : /* @__PURE__ */ o(u, { name: "file", className: l.fileIcon });
   }, e[2] = i, e[3] = b) : b = e[3];
   const v = b;
   let m;
   if (e[4] !== d || e[5] !== a || e[6] !== v || e[7] !== s || e[8] !== i) {
     let n;
     e[10] !== d || e[11] !== v || e[12] !== s || e[13] !== i ? (n = (r, p) => {
-      const g = Object.fromEntries(Object.entries(d).map((L) => {
-        const [w, h] = L;
-        return [w, `${h}-${p}`];
+      const h = Object.fromEntries(Object.entries(d).map((g) => {
+        const [L, R] = g;
+        return [L, `${R}-${p}`];
       }));
-      return /* @__PURE__ */ I("div", { className: j(l.fileWrapper, {
+      return /* @__PURE__ */ w("div", { className: j(l.fileWrapper, {
         [l.fileWrapperInvalid]: r.feedback
       }), children: [
         v(r),
-        /* @__PURE__ */ I("div", { className: l.fileDetails, children: [
+        /* @__PURE__ */ w("div", { className: l.fileDetails, children: [
           /* @__PURE__ */ o("span", { className: l.fileName, children: r.name }),
           /* @__PURE__ */ o("span", { className: l.fileSize, children: V(r.size) })
         ] }),
-        /* @__PURE__ */ I(k, { ...g, className: l.removeButton, onClick: () => s(p), hideLabel: !0, iconName: "cross", size: "small", variant: "ghost", type: "button", "aria-describedby": r.feedback ? x(r.name) : void 0, "aria-invalid": r.feedback ? !0 : void 0, children: [
+        /* @__PURE__ */ w(k, { ...h, className: l.removeButton, onClick: () => s(p), hideLabel: !0, iconName: "cross", size: "small", variant: "ghost", type: "button", "aria-describedby": r.feedback ? x(r.name) : void 0, "aria-invalid": r.feedback ? !0 : void 0, children: [
           i("fileListRemoveSelectionButtonLabel", [r.name]),
           "."
         ] }),

package/{flag.72PONA83.js → flag.CE32qHPa.js}

@@ -1,8 +1,8 @@
 "use client";
 import { jsxs as y, jsx as p } from "react/jsx-runtime";
-import { d as L } from "./chunks/index.CgTHIF3K.js";
-import { c as u } from "./chunks/index.CEyLAtio.js";
-import { D as w } from "./chunks/Icon.NSsVrYeq.js";
+import { d as L } from "./chunks/index.D-sRdssb.js";
+import { c as u } from "./chunks/index.DL9mof6u.js";
+import { D as w } from "./chunks/Icon.CDLyB7Pv.js";
 import './assets/flag.C7i3MAAP.css';const b = "ds-flag_root_14d3h_1", x = "ds-flag_root--color-grey-light_14d3h_28", G = "ds-flag_root--color-yellow-light_14d3h_31", N = "ds-flag_root--color-red-light_14d3h_34", S = "ds-flag_root--color-green-light_14d3h_37", D = "ds-flag_root--color-orange-base_14d3h_40", C = {
   root: b,
   "root--color-grey-light": "ds-flag_root--color-grey-light_14d3h_28",