rds-ui-system 2.2.0 → 2.3.0

package/README.md

@@ -1,7 +1,8 @@
 # Remondis UI Library
 
 ## Preview on vercel
-  https://rds-ui-system-react.vercel.app/
+
+https://storybook.remondis.io/
 
 ## Features
 

package/dist/lib/components/atoms/Box/Box.d.ts

@@ -1,12 +1,14 @@
-import { ButtonHTMLAttributes, ReactNode } from 'react'
+import { HTMLAttributes, ReactNode } from 'react'
 export declare const BOX_VARIANT: {
   readonly DEFAULT: 'default'
 }
 export type BoxVariant = keyof typeof BOX_VARIANT
 export declare const boxVariant: Record<BoxVariant, string>
-export interface BoxProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+export interface BoxProps extends HTMLAttributes<HTMLDivElement> {
   children?: ReactNode
   variant?: BoxVariant
   isDisabled?: boolean
 }
-export declare const Box: ({ variant, isDisabled, children }: BoxProps) => import('react/jsx-runtime').JSX.Element
+export declare const Box: import('react').ForwardRefExoticComponent<
+  BoxProps & import('react').RefAttributes<HTMLDivElement>
+>

package/dist/lib/components/atoms/Button/Button.d.ts

@@ -1,5 +1,5 @@
 import { ButtonHTMLAttributes, MouseEventHandler, ReactNode } from 'react'
-import { IconMapping } from '../../icons/iconMapping'
+import { IconName } from '../../icons/iconMapping'
 export declare const BUTTON_VARIANT: {
   readonly DEFAULT: 'default'
   readonly HOVERED: 'hovered'
@@ -10,10 +10,6 @@ export declare const BUTTON_VARIANT: {
   readonly OUTLINED: 'outlined'
 }
 export type ButtonVariant = keyof typeof BUTTON_VARIANT
-export declare const ICONBUTTON_VARIANT: {
-  readonly DEFAULT: 'default'
-}
-export type IconButtonVariant = keyof typeof ICONBUTTON_VARIANT
 export declare const buttonVariant: Record<ButtonVariant, string>
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
   label?: string
@@ -22,18 +18,12 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
   isOutlined?: boolean
   onClick?: MouseEventHandler<HTMLButtonElement>
   children?: ReactNode
-  type: 'button' | 'reset' | 'submit' | undefined
   customClasses?: string
-  iconName?: IconMapping
+  name?: IconName
+  bgFillColor?: string
+  iconColor?: string
+  textColor?: string
 }
-export declare const Button: ({
-  label,
-  variant,
-  isDisabled,
-  isOutlined,
-  onClick,
-  children,
-  type,
-  customClasses,
-  iconName,
-}: ButtonProps) => import('react/jsx-runtime').JSX.Element
+export declare const Button: import('react').ForwardRefExoticComponent<
+  ButtonProps & import('react').RefAttributes<HTMLButtonElement>
+>

package/dist/lib/components/atoms/Checkbox/Checkbox.d.ts

@@ -15,15 +15,8 @@ export interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
   onChange?: ChangeEventHandler<HTMLInputElement>
   id: string
   readOnly?: boolean
+  value?: any
 }
-export declare const Checkbox: ({
-  placeholder,
-  label,
-  isDisabled,
-  isError,
-  isRequired,
-  onChange,
-  checked,
-  id,
-  readOnly,
-}: CheckboxProps) => import('react/jsx-runtime').JSX.Element
+export declare const Checkbox: import('react').ForwardRefExoticComponent<
+  CheckboxProps & import('react').RefAttributes<HTMLInputElement>
+>

package/dist/lib/components/atoms/FilterChip/FilterChip.d.ts

@@ -9,10 +9,9 @@ export interface FilterChipProps extends ButtonHTMLAttributes<HTMLButtonElement>
   isDisabled?: boolean
   variant?: FilterChipVariant
   onClick?: MouseEventHandler<HTMLButtonElement>
+  bgFillColor?: string
+  textColor?: string
 }
-export declare const FilterChip: ({
-  label,
-  isDisabled,
-  variant,
-  onClick,
-}: FilterChipProps) => import('react/jsx-runtime').JSX.Element
+export declare const FilterChip: import('react').ForwardRefExoticComponent<
+  FilterChipProps & import('react').RefAttributes<HTMLButtonElement>
+>

package/dist/lib/components/atoms/Heading/Heading.d.ts

@@ -1,4 +1,4 @@
-import { ButtonHTMLAttributes, ReactNode } from 'react'
+import { HTMLAttributes, ReactNode } from 'react'
 export declare const HEADING_VARIANT: {
   readonly h1: 'h1'
   readonly h2: 'h2'
@@ -6,17 +6,13 @@ export declare const HEADING_VARIANT: {
 }
 export type HeadingVariant = keyof typeof HEADING_VARIANT
 export declare const headingVariant: Record<HeadingVariant, string>
-export interface HeadingProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+export interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
   label?: string
   children?: ReactNode
   variant?: HeadingVariant
   bold?: boolean
   customClasses?: string
 }
-export declare const Heading: ({
-  variant,
-  children,
-  bold,
-  label,
-  customClasses,
-}: HeadingProps) => import('react/jsx-runtime').JSX.Element
+export declare const Heading: import('react').ForwardRefExoticComponent<
+  HeadingProps & import('react').RefAttributes<HTMLHeadingElement>
+>

package/dist/lib/components/atoms/Input/Input.d.ts

@@ -17,18 +17,8 @@ export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
   id: string
   supportingText?: string
   isRequired?: boolean
+  customClasses?: string
 }
-export declare const Input: ({
-  placeholder,
-  label,
-  variant,
-  isDisabled,
-  isError,
-  onChange,
-  value: propValue,
-  name,
-  type,
-  id,
-  supportingText,
-  isRequired,
-}: InputProps) => import('react/jsx-runtime').JSX.Element
+export declare const Input: import('react').ForwardRefExoticComponent<
+  InputProps & import('react').RefAttributes<HTMLInputElement>
+>

package/dist/lib/components/atoms/Modal/Modal.d.ts

@@ -12,10 +12,6 @@ export interface ModalProps extends ButtonHTMLAttributes<HTMLButtonElement> {
   onClick?: () => void
   customClasses?: string
 }
-export declare const Modal: ({
-  children,
-  onClick,
-  width,
-  height,
-  customClasses,
-}: ModalProps) => import('react/jsx-runtime').JSX.Element
+export declare const Modal: import('react').ForwardRefExoticComponent<
+  ModalProps & import('react').RefAttributes<HTMLDivElement>
+>

package/dist/lib/components/atoms/MultiSelect/MultiSelect.d.ts

@@ -1,10 +1,10 @@
-import { SelectHTMLAttributes } from 'react'
+import { HTMLAttributes } from 'react'
 export declare const MULTISELECT_VARIANT: {
   readonly DEFAULT: 'default'
 }
 export type MultiSelectVariant = keyof typeof MULTISELECT_VARIANT
 export declare const multiSelectVariant: Record<MultiSelectVariant, string>
-export interface MultiSelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
+export interface MultiSelectProps extends HTMLAttributes<HTMLDivElement> {
   id?: string
   selectedOptions?: any
   onSelectionChange: (selectedOption: any) => void
@@ -13,12 +13,6 @@ export interface MultiSelectProps extends SelectHTMLAttributes<HTMLSelectElement
   label?: string
   variant?: MultiSelectVariant
 }
-export declare const MultiSelect: ({
-  id,
-  selectedOptions,
-  onSelectionChange,
-  options,
-  isDisabled,
-  label,
-  variant,
-}: MultiSelectProps) => import('react/jsx-runtime').JSX.Element
+export declare const MultiSelect: import('react').ForwardRefExoticComponent<
+  MultiSelectProps & import('react').RefAttributes<HTMLDivElement>
+>

package/dist/lib/components/atoms/Radio/Radio.d.ts

@@ -1,4 +1,4 @@
-import { InputHTMLAttributes, ChangeEventHandler } from 'react'
+import React, { InputHTMLAttributes, ChangeEventHandler } from 'react'
 export declare const RADIO_VARIANT: {
   readonly DEFAULT: 'primary'
 }
@@ -16,14 +16,4 @@ export interface RadioProps extends InputHTMLAttributes<HTMLInputElement> {
   id?: string
   readOnly?: boolean
 }
-export declare const Radio: ({
-  placeholder,
-  label,
-  isDisabled,
-  isError,
-  isRequired,
-  onChange,
-  checked,
-  id,
-  readOnly,
-}: RadioProps) => import('react/jsx-runtime').JSX.Element
+export declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>

package/dist/lib/components/atoms/Select/Select.d.ts

@@ -1,10 +1,10 @@
-import { SelectHTMLAttributes } from 'react'
+import { HTMLAttributes } from 'react'
 export declare const SELECT_VARIANT: {
   readonly DEFAULT: 'default'
 }
 export type SelectVariant = keyof typeof SELECT_VARIANT
 export declare const selectVariant: Record<SelectVariant, string>
-export interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
+export interface SelectProps extends HTMLAttributes<HTMLDivElement> {
   id: string
   options?: any[]
   selectedOptions?: any
@@ -16,14 +16,6 @@ export interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
   variant?: SelectVariant
   topPull?: boolean
 }
-export declare const Select: ({
-  id,
-  options,
-  selectedOptions,
-  onSelectionChange,
-  label,
-  prepopulatedId,
-  boxText,
-  isDisabled,
-  topPull,
-}: SelectProps) => import('react/jsx-runtime').JSX.Element
+export declare const Select: import('react').ForwardRefExoticComponent<
+  SelectProps & import('react').RefAttributes<HTMLDivElement>
+>

package/dist/lib/components/atoms/Text/Text.d.ts

@@ -1,30 +1,17 @@
 import { HTMLAttributes, ReactNode } from 'react'
 export declare const TEXT_VARIANT: {
   readonly DEFAULT: 'default'
-  readonly IMPORTANT: 'important'
-  readonly SMALL: 'small'
 }
 export type TextVariant = keyof typeof TEXT_VARIANT
 export declare const textVariant: Record<TextVariant, string>
 export interface TextProps extends HTMLAttributes<HTMLParagraphElement> {
   text?: string
   children?: ReactNode
-  variant?: TextVariant
   isDisabled?: boolean
   bold?: boolean
-  small?: boolean
-  important?: boolean
   customClasses?: string
   title?: string
 }
-export declare const Text: ({
-  variant,
-  isDisabled,
-  text,
-  children,
-  bold,
-  small,
-  important,
-  customClasses,
-  title,
-}: TextProps) => import('react/jsx-runtime').JSX.Element
+export declare const Text: import('react').ForwardRefExoticComponent<
+  TextProps & import('react').RefAttributes<HTMLParagraphElement>
+>

package/dist/lib/components/atoms/Textarea/Textarea.d.ts

@@ -4,7 +4,7 @@ export declare const TEXTAREA_VARIANT: {
 }
 export type Textarea = keyof typeof TEXTAREA_VARIANT
 export declare const textarea: Record<Textarea, string>
-export interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement | HTMLLabelElement> {
+export interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
   value?: string
   label?: string
   placeholder?: string
@@ -18,16 +18,6 @@ export interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElemen
   id: string
   onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void
 }
-export declare const Textarea: ({
-  value,
-  placeholder,
-  label,
-  variant,
-  isDisabled,
-  isError,
-  defaultValue,
-  isRequired,
-  onChange,
-  supportingText,
-  id,
-}: TextareaProps) => import('react/jsx-runtime').JSX.Element
+export declare const Textarea: import('react').ForwardRefExoticComponent<
+  TextareaProps & import('react').RefAttributes<HTMLTextAreaElement>
+>

package/dist/lib/components/icons/Icon/Icon.d.ts

@@ -1,14 +1,17 @@
-import { HTMLProps } from 'react'
-import { IconMapping } from '../iconMapping'
+import { HTMLAttributes } from 'react'
+import { IconName } from '../iconMapping'
 export declare const ICON_VARIANT: {
   readonly DEFAULT: 'default'
 }
 export type IconVariant = keyof typeof ICON_VARIANT
 export declare const iconVariant: Record<IconVariant, string>
-export interface IconProps extends HTMLProps<HTMLSpanElement> {
-  name: IconMapping
+export interface IconProps extends HTMLAttributes<HTMLSpanElement> {
+  name: IconName
   variant?: IconVariant
   isOutlined?: boolean
   isDisabled?: boolean
+  iconColor?: string
 }
-export declare const Icon: ({ name, isOutlined, isDisabled }: IconProps) => import('react/jsx-runtime').JSX.Element
+export declare const Icon: import('react').ForwardRefExoticComponent<
+  IconProps & import('react').RefAttributes<HTMLSpanElement>
+>

package/dist/lib/components/icons/iconMapping.d.ts

@@ -1,2 +1,228 @@
-export declare const iconMapping: Record<string, (isOutlined: boolean, isDisabled: boolean) => React.ReactNode>
-export type IconMapping = keyof typeof iconMapping
+export declare const iconMapping: {
+  readonly Warning: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Error: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Checked: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Add: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly AddBox: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly AddCircle: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Remove: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly RemoveCircle: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Block: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly ContentCopy: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly SaveAlt: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Unarchive: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly MoreHoriz: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly MoreVert: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Menu: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Refresh: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Move: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly South: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly North: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly West: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly ExpandMore: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly ExpandLess: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Close: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Cancel: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Delete: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly FilterAlt: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Edit: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly CheckCircle: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly CalendarToday: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly AccountCircle: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Done: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly LogIn: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly OpenWith: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Search: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Info: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Help: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly KeyboardArrowLeft: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly KeyboardArrowRight: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly DownloadDone: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Place: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly OpenInNew: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Schedule: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly ZoomIn: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly ZoomOut: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+  readonly Photo: (
+    isOutlined: boolean,
+    isDisabled: boolean,
+    bgFillColor: string,
+  ) => import('react/jsx-runtime').JSX.Element
+}
+export type IconName = keyof typeof iconMapping