@vodafone_de/brix-components 7.0.8 → 7.0.9

package/dist/components/Rating/props.d.ts

@@ -0,0 +1,22 @@
+import { FieldsetSharedProps } from '../Fieldset';
+/**
+ * Props for the Rating component
+ */
+export interface RatingProps extends Omit<FieldsetSharedProps, 'status' | 'errorMessage' | 'disabled' | 'helperText'> {
+    /**
+     * The current rating value (number of stars selected)
+     */
+    value?: number;
+    /**
+     * Callback fired when the rating value changes
+     */
+    onUpdate?: (value: number) => void;
+    /**
+     * Optional group name to identify the rating group for accessibility
+     */
+    groupName?: string;
+    /**
+     * Pin component's name from string to the concrete name
+     */
+    component?: 'Rating';
+}

package/dist/components/Rating/styled.d.ts

@@ -0,0 +1,6 @@
+export declare const StarsWrapperStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StarLabelStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
+    selected: boolean;
+    isInHoverRange?: boolean;
+}>> & string;
+export declare const HiddenRadioStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;

package/dist/components/ResponsiveImage/index.js

@@ -6,7 +6,7 @@ import styled from "styled-components";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { b as borderRadiusMd, a as borderRadiusNone } from "../../BorderRadius-ClUShVLu.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 const ResponsiveImagePictureStyled = styled.picture.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "ResponsiveImagePictureStyled",

package/dist/components/RichText/index.js

@@ -1,7 +1,7 @@
 "use client";
 import "react/jsx-runtime";
 import "react";
-import { R } from "../../index-BeSd-V81.js";
+import { R } from "../../index-9io8adeQ.js";
 export {
   R as default
 };

package/dist/components/ScreenreaderOnly/index.js

@@ -1,6 +1,6 @@
 "use client";
 import "react/jsx-runtime";
-import { S } from "../../index-DQhtQZ85.js";
+import { S } from "../../index-GwyCjtti.js";
 export {
   S as default
 };

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

@@ -1,4 +1,5 @@
+import { FC } from 'react';
 import { SearchInputProps } from './props';
-declare const SearchInput: import('react').ForwardRefExoticComponent<SearchInputProps & import('react').RefAttributes<HTMLInputElement>>;
+declare const SearchInput: FC<SearchInputProps>;
 export default SearchInput;
 export * from './props';

package/dist/components/SearchInput/index.js

@@ -1,17 +1,19 @@
 "use client";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { bn as CloseIcon, iv as iconSizeSm } from "../../index-Cbojl4_Q.js";
-import { forwardRef, useState, useRef, useImperativeHandle } from "react";
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState, useRef } from "react";
 import FormHelperLabel from "../FormHelperLabel/index.js";
 import IconButton, { iconButtonShapeSquare } from "../IconButton/index.js";
-import { b as spacingNone, s as spacingMd } from "../../Spacing-D0HQH9YJ.js";
-import { p as primaryAppearance } from "../../styled-BSqC5P9h.js";
+import { b as iconSizeSm } from "../../styled-DPHfwWsx.js";
+import { s as spacingMd, b as spacingNone } from "../../Spacing-D0HQH9YJ.js";
+import { p as primaryAppearance } from "../../styled-C4eI47I1.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
-import Form from "../Form/index.js";
+import "../../NotificationErrorIcon-DMnAJgPN.js";
+import { bn as CloseIcon } from "../../_5gPlusIcon-B_69VW4X.js";
 import styled from "styled-components";
-import { I as InputWrapperStyled, a as InputStyled } from "../../styled-03irSJOQ.js";
+import { I as InputWrapperStyled, a as InputStyled } from "../../styled-Cep52hpR.js";
+import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 const SearchInputButtonWrapperStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "SearchInputButtonWrapperStyled",
@@ -21,7 +23,11 @@ const SearchInputButtonWrapperStyled = styled.div.withConfig({
   ":where(:focus,:focus-visible,:focus-within)": {
     zIndex: 1
   }
-});
+}, ({
+  bottomSpacing = spacingMd
+}) => getBottomSpacing({
+  bottomSpacing
+}));
 const SearchInputWrapperStyled = styled(InputWrapperStyled).withConfig({
   shouldForwardProp: filterProps(),
   displayName: "SearchInputWrapperStyled",
@@ -79,7 +85,7 @@ const SearchInputStyled = styled(InputStyled).withConfig({
     WebkitAppearance: "none"
   }
 });
-const SearchInput = forwardRef(({
+const SearchInput = ({
   uid,
   label,
   bottomSpacing = spacingMd,
@@ -91,11 +97,10 @@ const SearchInput = forwardRef(({
   onReset,
   disabled,
   ...props
-}, ref) => {
+}) => {
   const initialValueState = !props.value ? "" : props.value;
   const [value, setValue] = useState(initialValueState);
-  const inputRef = useRef(null);
-  useImperativeHandle(ref, () => inputRef.current, []);
+  const ref = useRef(null);
   const inputProps = {
     ...props,
     id: uid
@@ -106,35 +111,31 @@ const SearchInput = forwardRef(({
       props.onChange(event);
     }
   };
-  const onSubmit = (e) => {
-    e.preventDefault();
-    const formElement = e.target;
-    if (onSearch) {
-      onSearch(formElement.getElementsByTagName("input")[0].value);
-    }
-  };
   const resetButtonHandler = () => {
     var _a;
     if (disabled) return;
     setValue("");
-    inputRef && ((_a = inputRef.current) == null ? void 0 : _a.focus());
+    ref && ((_a = ref.current) == null ? void 0 : _a.focus());
     onReset && onReset();
   };
   const resetHandler = (e) => {
     if (e.key === "Escape" && onReset && value !== "") onReset();
     props.onKeyDown && props.onKeyDown(e);
   };
-  return /* @__PURE__ */ jsxs(Form, { className: props.className, role: "search", bottomSpacing, onSubmit, children: [
+  const onSubmit = () => {
+    onSearch && onSearch(value);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     !hideLabel && /* @__PURE__ */ jsx(FormHelperLabel, { label, uid }),
-    /* @__PURE__ */ jsxs(SearchInputButtonWrapperStyled, { children: [
+    /* @__PURE__ */ jsxs(SearchInputButtonWrapperStyled, { bottomSpacing, children: [
       /* @__PURE__ */ jsxs(SearchInputWrapperStyled, { value, children: [
-        /* @__PURE__ */ jsx(SearchInputStyled, { ...inputProps, ref: inputRef, onChange, onKeyDown: resetHandler, type: "search", value, "aria-label": hideLabel && typeof label === "string" ? label : void 0, placeholder: renderInlineRichTextFromOpenText(placeholder) }),
+        /* @__PURE__ */ jsx(SearchInputStyled, { ...inputProps, ref, onChange, onKeyDown: resetHandler, type: "search", value, "aria-label": hideLabel && typeof label === "string" ? label : void 0, placeholder: renderInlineRichTextFromOpenText(placeholder) }),
         value && /* @__PURE__ */ jsx(SearchInputCloseButtonStyled, { type: "button", "aria-hidden": true, onClick: resetButtonHandler, tabIndex: -1, disabled, children: /* @__PURE__ */ jsx(CloseIconStyled, { size: iconSizeSm, value }) })
       ] }),
-      /* @__PURE__ */ jsx(SearchInputIconButtonStyled, { iconName: "Search", label: searchButtonLabel, bottomSpacing: spacingNone, shape: iconButtonShapeSquare, appearance: buttonAppearance, type: "submit" })
+      /* @__PURE__ */ jsx(SearchInputIconButtonStyled, { iconName: "Search", label: searchButtonLabel, bottomSpacing: spacingNone, shape: iconButtonShapeSquare, appearance: buttonAppearance, type: "submit", onClick: onSubmit })
     ] })
   ] });
-});
+};
 export {
   SearchInput as default
 };

package/dist/components/SearchInput/props.d.ts

@@ -23,7 +23,8 @@ export interface SearchInputProps extends Omit<InputSharedProps, 'status' | 'err
      */
     searchButtonLabel: string;
     /**
-     * Function to be used when the user searches e.g. clicks enter inside the input or clicks the search button.
+     * Function to be used when the user searches e.g. clicks enter inside the input or clicks the search button. Basically works like a forms onSubmit in case you don't provide
+     * a form which is recommended.
      * @param query
      */
     onSearch?: (query: string) => void;

package/dist/components/SearchInput/styled.d.ts

@@ -1,13 +1,10 @@
-import { InlineIconProps } from '@vfde-react/inline-icon-library';
 import { IconButtonProps } from '../IconButton/props';
 import { SearchInputProps } from './props';
-export declare const SearchInputButtonWrapperStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SearchInputButtonWrapperStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<SearchInputProps, "bottomSpacing">>> & string;
 export declare const SearchInputWrapperStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "status" | keyof import('../..').PatternProps | "readOnly"> & import('../..').PatternProps & Pick<import('../Input').InputProps, "readOnly"> & {
     status?: import('../Input').InputStatus;
 }, Pick<SearchInputProps, "bottomSpacing" | "value">>> & string;
 export declare const SearchInputIconButtonStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<IconButtonProps, IconButtonProps>> & string & Omit<import('react').FC<IconButtonProps>, keyof import('react').Component<any, {}, any>>;
-export declare const CloseIconStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<InlineIconProps, InlineIconProps & {
-    value: string;
-}>> & string & Omit<import('react').FC<InlineIconProps>, keyof import('react').Component<any, {}, any>>;
+export declare const CloseIconStyled: import('styled-components/dist/types').IStyledComponentBase<"web", any> & string & Omit<import('react').FC<InlineIconProps>, keyof import('react').Component<any, {}, any>>;
 export declare const SearchInputCloseButtonStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, Pick<SearchInputProps, "disabled">>> & string;
-export declare const SearchInputStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import('react').InputHTMLAttributes<HTMLInputElement>> & import('react').InputHTMLAttributes<HTMLInputElement>, Omit<SearchInputProps, "uid" | "onReset" | "label" | "searchButtonLabel" | "onSearch">>> & string;
+export declare const SearchInputStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import('react').InputHTMLAttributes<HTMLInputElement>> & import('react').InputHTMLAttributes<HTMLInputElement>, Omit<SearchInputProps, "label" | "uid" | "onReset" | "searchButtonLabel" | "onSearch">>> & string;

package/dist/components/SelectInput/index.js

@@ -1,11 +1,13 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { iv as iconSizeSm, bf as ChevronDownIcon } from "../../index-Cbojl4_Q.js";
+import "../../NotificationErrorIcon-DMnAJgPN.js";
+import { bf as ChevronDownIcon } from "../../_5gPlusIcon-B_69VW4X.js";
 import { forwardRef } from "react";
 import FormElement from "../FormElement/index.js";
 import FormHelperLabel from "../FormHelperLabel/index.js";
 import FormHelperMessage from "../FormHelperMessage/index.js";
 import FormHelperStatusIcon from "../FormHelperStatusIcon/index.js";
+import { b as iconSizeSm } from "../../styled-DPHfwWsx.js";
 import { a as inputStateError } from "../../props-DDpgcryb.js";
 import { a as spacingXs, c as spacingSm, s as spacingMd } from "../../Spacing-D0HQH9YJ.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
@@ -21,7 +23,7 @@ import { c as colorBackgroundNeutral } from "../../BackgroundColor-e0N9tdDR.js";
 import { c as colorBorderFocus, a as colorBorderNeutral, b as colorBorderUnselected, d as colorBorderSuccess, e as colorBorderCritical } from "../../BorderColor-BummoQ1-.js";
 import { b as borderRadiusMd } from "../../BorderRadius-ClUShVLu.js";
 import { a as colorTextNeutral } from "../../TextColor-DsntmDNw.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
 const SelectInputWrapperStyled = styled.div.withConfig({
   displayName: "SelectInputWrapperStyled",

package/dist/components/Stepper/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { useState, useRef, useEffect } from "react";
-import { useViewport } from "../../hooks/useViewport/index.js";
+import { u as useViewport } from "../../index-Cs0Hw0dj.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 import styled from "styled-components";
 import forcedColors from "../../foundations/media-query/forcedColors/index.js";
@@ -12,11 +12,11 @@ import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index
 import { getFontWeight } from "../../foundations/token/getFontWeight/index.js";
 import { getObjectColor } from "../../foundations/token/getObjectColor/index.js";
 import { g as colorBorderBrand, a as colorBorderNeutral, h as colorBorderInverse } from "../../BorderColor-BummoQ1-.js";
-import { f as fontWeightBold } from "../../FontWeight-CR22KTex.js";
+import { f as fontWeightBold } from "../../FontWeight-DEBGHbtO.js";
 import { c as colorObjectBrand, a as colorObjectInverse } from "../../ObjectColor-BZDBuV8H.js";
 import { s as spacingMd } from "../../Spacing-D0HQH9YJ.js";
 import { t as textBodyMd } from "../../TextBodySize-BcZR9mh2.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 const StepperItemStyled = styled.li.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "StepperItemStyled",

package/dist/components/SuggestInput/index.js

@@ -1,17 +1,18 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { df as IconLoader, iv as iconSizeSm } from "../../index-Cbojl4_Q.js";
 import { useState, useEffect, forwardRef, useRef, useImperativeHandle } from "react";
 import FlexItem from "../FlexItem/index.js";
 import FormHelperLabel from "../FormHelperLabel/index.js";
 import FormHelperMessage from "../FormHelperMessage/index.js";
 import FormHelperStatusIcon from "../FormHelperStatusIcon/index.js";
+import IconLoader from "../IconLoader/index.js";
+import { b as iconSizeSm } from "../../styled-DPHfwWsx.js";
 import { a as inputStateError } from "../../props-DDpgcryb.js";
-import { I as InputWrapperStyled, a as InputStyled } from "../../styled-03irSJOQ.js";
+import { I as InputWrapperStyled, a as InputStyled } from "../../styled-Cep52hpR.js";
 import { c as spacingSm, a as spacingXs, s as spacingMd } from "../../Spacing-D0HQH9YJ.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 import Body from "../Body/index.js";
-import { g as strongTagName } from "../../tags-DI6H1biK.js";
+import { f as strongTagName } from "../../tags-D0ExIPLD.js";
 import styled from "styled-components";
 import Card from "../Card/index.js";
 import forcedColors from "../../foundations/media-query/forcedColors/index.js";
@@ -29,7 +30,7 @@ import { getOpacity } from "../../foundations/token/getOpacity/index.js";
 import { getTextColor } from "../../foundations/token/getTextColor/index.js";
 import { a as opacityDisabled } from "../../Opacity-smkGiwsf.js";
 import { a as colorTextNeutral } from "../../TextColor-DsntmDNw.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 const calculateListMaxHeight = (numberOfVisibleItems) => {
   return `calc((${getSpacing(spacingSm)} * 2 + ${getBodySize(textBodyMd).fontSize} * ${getBodySize(textBodyMd).lineHeight}) * ${numberOfVisibleItems})`;
 };

package/dist/components/SuggestInput/props.d.ts

@@ -1,4 +1,4 @@
-import { IconName } from '@vfde-react/inline-icon-library';
+import { IconName } from '@vfde-react/inline-icon-library/IconName';
 import { InputHTMLAttributes } from 'react';
 import { InputSharedProps } from '../Input/props';
 export interface SuggestInputItemProps {

package/dist/components/SuggestInput/styled.d.ts

@@ -1,7 +1,7 @@
-import { PatternProps } from '../../foundations/PatternProps';
-import { SuggestInputProps } from './props';
 import { FormElementProps } from '../FormElement/props.ts';
 import { InputStatus } from '../Input/props';
+import { PatternProps } from '../../foundations/PatternProps';
+import { SuggestInputProps } from './props';
 export declare const SuggestInputFormElementStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FormElementProps>> & string;
 export declare const SuggestInputWrapperStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "status" | keyof PatternProps | "readOnly"> & PatternProps & Pick<import('../Input/props').InputProps, "readOnly"> & {
     status?: InputStatus;

package/dist/components/Switch/index.js

@@ -1,8 +1,10 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { df as IconLoader, ip as iconSize2xs } from "../../index-Cbojl4_Q.js";
+import IconLoader from "../IconLoader/index.js";
+import { i as iconSize2xs } from "../../styled-DPHfwWsx.js";
 import styled from "styled-components";
+import Label from "../Label/index.js";
 import forcedColors from "../../foundations/media-query/forcedColors/index.js";
 import { e as ease_in_sine } from "../../easing-Dm-pO8SY.js";
 import { getBorderColor } from "../../foundations/token/getBorderColor/index.js";
@@ -18,8 +20,7 @@ import { a as borderWidthFocus, c as borderWidthSm } from "../../BorderWidth-DfO
 import { a as colorObjectInverse, b as colorObjectSelected, d as colorObjectUnselected } from "../../ObjectColor-BZDBuV8H.js";
 import { a as opacityDisabled } from "../../Opacity-smkGiwsf.js";
 import { a as spacingXs, s as spacingMd } from "../../Spacing-D0HQH9YJ.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
-import Label from "../Label/index.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 const getHandleIcon = (checked) => {
   const iconName = checked ? "Tick" : "Close";
   return /* @__PURE__ */ jsx(IconLoader, { size: iconSize2xs, name: iconName });

package/dist/components/TabularPrice/index.js

@@ -1,7 +1,7 @@
 "use client";
 import "react/jsx-runtime";
-import { T } from "../../index-aUJfXBUI.js";
-import "../../index-DQhtQZ85.js";
+import { T } from "../../index-TImInHXt.js";
+import "../../index-GwyCjtti.js";
 import "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 export {
   T as default

package/dist/components/TextList/index.js

@@ -1,7 +1,7 @@
 "use client";
 import "react/jsx-runtime";
-import { a, T } from "../../index-BeSd-V81.js";
-import "../../tags-DI6H1biK.js";
+import { a, T } from "../../index-9io8adeQ.js";
+import "../../tags-D0ExIPLD.js";
 import "../../Spacing-D0HQH9YJ.js";
 import "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 export {

package/dist/components/Textarea/index.js

@@ -22,7 +22,7 @@ import { a as colorBorderNeutral, c as colorBorderFocus, b as colorBorderUnselec
 import { b as borderRadiusMd } from "../../BorderRadius-ClUShVLu.js";
 import { t as textHeadingXs } from "../../HeadingSize-CfCRn3Lh.js";
 import { c as colorTextPlaceholder, a as colorTextNeutral } from "../../TextColor-DsntmDNw.js";
-import { f as filterProps } from "../../filterProps-Cewck8OH.js";
+import { a as filterProps } from "../../filterProps-CBnuV0LI.js";
 const TextareaWrapperStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "TextareaWrapperStyled",

package/dist/components/Textarea/styled.d.ts

@@ -4,7 +4,7 @@ import { TextareaProps } from './props';
 export declare const TextareaWrapperStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, PatternProps & {
     status?: InputStatus;
 }>> & string;
-export declare const TextareaStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, Omit<TextareaProps, "uid" | "label">>> & string;
+export declare const TextareaStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, Omit<TextareaProps, "label" | "uid">>> & string;
 export declare const TextareaStatusIcon: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../FormHelperStatusIcon/props').FormHelperStatusIconProps, {
     status?: InputStatus;
     hasScrollbar: boolean;

package/dist/components/TimeInput/index.js

@@ -1,19 +1,21 @@
 "use client";
 import { jsxs, jsx } from "react/jsx-runtime";
-import { bm as ClockIcon, iv as iconSizeSm } from "../../index-Cbojl4_Q.js";
 import { forwardRef, useState, useRef, useImperativeHandle, useEffect } from "react";
-import { s as spacingMd, a as spacingXs } from "../../Spacing-D0HQH9YJ.js";
 import FormElement from "../FormElement/index.js";
 import FormHelperLabel from "../FormHelperLabel/index.js";
 import FormHelperMessage from "../FormHelperMessage/index.js";
 import FormHelperStatusIcon from "../FormHelperStatusIcon/index.js";
+import { b as iconSizeSm } from "../../styled-DPHfwWsx.js";
 import "../Input/index.js";
+import { a as InputStyled, I as InputWrapperStyled } from "../../styled-Cep52hpR.js";
+import { s as spacingMd, a as spacingXs } from "../../Spacing-D0HQH9YJ.js";
+import "../../NotificationErrorIcon-DMnAJgPN.js";
+import { bm as ClockIcon } from "../../_5gPlusIcon-B_69VW4X.js";
 import styled from "styled-components";
 import { getBorderColor } from "../../foundations/token/getBorderColor/index.js";
 import { getBorderWidth } from "../../foundations/token/getBorderWidth/index.js";
 import { c as colorBorderFocus } from "../../BorderColor-BummoQ1-.js";
 import { a as borderWidthFocus } from "../../BorderWidth-DfOlyKK7.js";
-import { a as InputStyled, I as InputWrapperStyled } from "../../styled-03irSJOQ.js";
 import { a as inputStateError } from "../../props-DDpgcryb.js";
 const ClockIconStyled = styled(ClockIcon).withConfig({
   displayName: "ClockIconStyled",

package/dist/components/TimeInput/styled.d.ts

@@ -1,6 +1,3 @@
-import { InlineIconProps } from '@vfde-react/inline-icon-library';
 import { InputHTMLAttributes } from 'react';
-export declare const ClockIconStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<InlineIconProps, InlineIconProps & {
-    browserSupportsPicker: boolean;
-}>> & string & Omit<import('react').FC<InlineIconProps>, keyof import('react').Component<any, {}, any>>;
+export declare const ClockIconStyled: import('styled-components/dist/types').IStyledComponentBase<"web", any> & string & Omit<import('react').FC<InlineIconProps>, keyof import('react').Component<any, {}, any>>;
 export declare const TimeInputStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof InputHTMLAttributes<HTMLInputElement>> & InputHTMLAttributes<HTMLInputElement>, InputHTMLAttributes<HTMLInputElement>>> & string;

package/dist/components/Tray/index.js

@@ -4,7 +4,7 @@ import { useState, useRef, useEffect } from "react";
 import { createPortal } from "react-dom";
 import ButtonGroup from "../ButtonGroup/index.js";
 import Heading from "../Heading/index.js";
-import { f as fontWeightBold } from "../../FontWeight-CR22KTex.js";
+import { f as fontWeightBold } from "../../FontWeight-DEBGHbtO.js";
 import { a as textHeadingMd } from "../../HeadingSize-CfCRn3Lh.js";
 import { s as spacingMd, b as spacingNone } from "../../Spacing-D0HQH9YJ.js";
 import styled from "styled-components";
@@ -19,7 +19,7 @@ import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { d as colorBackgroundOverlayStatic } from "../../BackgroundColor-e0N9tdDR.js";
 import { a as borderWidthFocus } from "../../BorderWidth-DfOlyKK7.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
-import { a as flexOrientationVertical } from "../../styled-B0YKfXTz.js";
+import { a as flexOrientationVertical } from "../../styled-CPUu8mvT.js";
 const TrayOverlayStyled = styled("div").withConfig({
   displayName: "TrayOverlayStyled",
   componentId: "sc-os3mq3-0"

package/dist/components/Tray/props.d.ts

@@ -1,7 +1,7 @@
 import { HTMLAttributes, ReactNode } from 'react';
-import { PatternProps } from '../../foundations/PatternProps';
 import { ButtonGroupProps } from '../ButtonGroup/props';
 import { HeadingProps } from '../Heading/props';
+import { PatternProps } from '../../foundations/PatternProps';
 export interface TrayProps extends PatternProps, Omit<HTMLAttributes<HTMLDivElement>, 'onToggle'> {
     /**
      * Pin component's name from string to the concrete name

package/dist/components/YoutubeVideo/index.js

@@ -1,12 +1,12 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import ConsentMessage from "../ConsentMessage/index.js";
 import { useThirdPartyConsent } from "../../hooks/useThirdPartyConsent/index.js";
 import styled from "styled-components";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { b as borderRadiusMd } from "../../BorderRadius-ClUShVLu.js";
 import { s as spacingMd } from "../../Spacing-D0HQH9YJ.js";
-import ConsentMessage from "../ConsentMessage/index.js";
 const YoutubeVideoStyled = styled.div.withConfig({
   displayName: "YoutubeVideoStyled",
   componentId: "sc-1q2uytw-0"
@@ -17,7 +17,6 @@ const YoutubeVideoStyled = styled.div.withConfig({
   position: "relative",
   width: "100%",
   paddingBottom: "56.25%",
-  /* 16:9 aspect ratio */
   height: 0,
   overflow: "hidden",
   ...roundedCorner && {

package/dist/components/YoutubeVideo/props.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
-import { PatternProps } from '../../foundations/PatternProps';
 import { ConsentMessageProps } from '../ConsentMessage/props';
+import { PatternProps } from '../../foundations/PatternProps';
 export interface YoutubeVideoProps extends PatternProps, HTMLAttributes<HTMLDivElement> {
     /**
      * Pin component's name from string to the concrete name

package/dist/filterProps-CBnuV0LI.js

@@ -0,0 +1,17 @@
+const propsNotPassToDomDefault = ["accordionType", "activeId", "activeIndex", "setActiveId", "align", "animated", "appearance", "aspectRatio", "autoLayout", "apiKey", "badge", "borderBottom", "bottomSpacing", "buttonLink", "buttons", "coloringMode", "colorSwatch", "component", "corners", "coversFullPage", "description", "expanded", "filterItems", "gapSpacing", "grow", "handleOnClick", "handleOnToogle", "hasOverlay", "heading", "heightSm", "heightMd", "heightLg", "horizontalAlignment", "icon", "iconAlign", "iconName", "iconPosition", "images", "isActive", "isChecked", "isDisabled", "isFullscreen", "isOpen", "isOrdered", "isSelected", "isTransparentBackground", "items", "jumpToClickedItem", "justify", "justifyHorizontal", "label", "lg", "loadingSpinnerChild", "mapId", "md", "message", "more", "nextAriaLabel", "notificationType", "objectFit", "objectPosition", "offset", "onUpdate", "openMultiple", "orientation", "padding", "prefix", "prefixWeight", "prevAriaLabel", "price", "productId", "promoPrice", "screenReaderInstruction", "showList", "size", "sm", "spacing", "spinnerType", "status", "stretch", "strikePrice", "suffix", "tag", "textContent", "uid", "variant", "verticalPadding", "viewportHeight", "weight", "width"];
+const filterProps = (propsNotPassToDom = []) => {
+  const shouldForwardProp = (prop) => {
+    if ("string" !== typeof prop) {
+      return false;
+    }
+    return ![...propsNotPassToDom, ...propsNotPassToDomDefault].includes(prop);
+  };
+  return shouldForwardProp;
+};
+const filterPropsForUnstyledComponent = (props) => {
+  return Object.fromEntries(Object.entries(props).filter(([key]) => !propsNotPassToDomDefault.includes(key)));
+};
+export {
+  filterProps as a,
+  filterPropsForUnstyledComponent as f
+};