kiban-design-system 1.0.281-alpha.0 → 1.0.282-alpha.0

package/dist/components/Progress/Progress.d.ts

@@ -1,14 +1,13 @@
-/// <reference types="react" />
-import type { ProgressProps } from './Progress.props';
-import './Progress.styles.scss';
-/**
- * Component for showing ProgressBar.
- *
- * @param {ProgressProps}  ProgressProps - ProgressProps
- * @param {Object[]} ProgressProps[].steps - Array of objets
- * @param {string} ProgressProps[].steps.label - Label of step
- * @param {string} ProgressProps[].steps.status - Type to status for step (active, inactive)
- * @returns {symbol} The component.
- */
-declare const Progress: ({ steps }: ProgressProps) => JSX.Element;
-export default Progress;
+import type { ProgressProps } from './Progress.props';
+import './Progress.styles.scss';
+/**
+ * Component for showing ProgressBar.
+ *
+ * @param {ProgressProps}  ProgressProps - ProgressProps
+ * @param {Object[]} ProgressProps[].steps - Array of objets
+ * @param {string} ProgressProps[].steps.label - Label of step
+ * @param {string} ProgressProps[].steps.status - Type to status for step (active, inactive)
+ * @returns {symbol} The component.
+ */
+declare const Progress: ({ steps }: ProgressProps) => import("react/jsx-runtime").JSX.Element;
+export default Progress;

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

@@ -1,17 +1,17 @@
-export declare type StatusStepType = 'active' | 'inactive';
-export interface BodyStepsProps {
-    /**
-     * Label description of step
-     */
-    label: string;
-    /**
-     *  Type to status for step (active, inactive)
-     */
-    status: StatusStepType;
-}
-export interface ProgressProps {
-    /**
-     * Array of objects - optional
-     */
-    steps?: BodyStepsProps[];
-}
+export type StatusStepType = 'active' | 'inactive';
+export interface BodyStepsProps {
+    /**
+     * Label description of step
+     */
+    label: string;
+    /**
+     *  Type to status for step (active, inactive)
+     */
+    status: StatusStepType;
+}
+export interface ProgressProps {
+    /**
+     * Array of objects - optional
+     */
+    steps?: BodyStepsProps[];
+}

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

@@ -1,3 +1,3 @@
-import Progress from './Progress';
-export type { ProgressProps, BodyStepsProps, StatusStepType, } from './Progress.props';
-export { Progress };
+import Progress from './Progress';
+export type { ProgressProps, BodyStepsProps, StatusStepType, } from './Progress.props';
+export { Progress };

package/dist/components/RadioButton/RadioButton.d.ts

@@ -1,23 +1,22 @@
-/// <reference types="react" />
-import type { RadioButtonProps } from './RadioButton.props';
-import './RadioButton.styles.scss';
-/**
- * The 'RadioButton' component is mainly used to select
- * some fields such as 'terms and conditions' or to
- * select one or more options from a catalog
- *
- * @param {RadioButtonProps}  RadioButtonProps - RadioButtonProps
- * @param {string} RadioButtonProps.className - Outer class to modify styles
- * @param {string} RadioButtonProps.id - RadioButton id
- * @param {boolean} RadioButtonProps.isChecked - Flag to check
- * @param {boolean} RadioButtonProps.isDisabled - Flag to disable the Radio-button
- * @param {string} RadioButtonProps.label - Text to display in the Radio-button
- * @param {string} RadioButtonProps.labelPosition - Label position depending on the Radio-button, it can be left or right, by default it is right
- * @param {string} RadioButtonProps.name - RadioButton name
- * @param {void} RadioButtonProps.onChange - Action to trigger when the Radio-button changes state, returns the value of the Radio-button
- * @param {string} RadioButtonProps.value - RadioButton value
- * @param {object} RadioButtonProps.rest - Rest of props to be passed to the Radio-button
- * @returns {symbol} - Returns the component
- */
-declare const RadioButton: ({ className, id, isChecked, isDisabled, label, onChange, value, name, isRequired, ...rest }: RadioButtonProps) => JSX.Element;
-export default RadioButton;
+import type { RadioButtonProps } from './RadioButton.props';
+import './RadioButton.styles.scss';
+/**
+ * The 'RadioButton' component is mainly used to select
+ * some fields such as 'terms and conditions' or to
+ * select one or more options from a catalog
+ *
+ * @param {RadioButtonProps}  RadioButtonProps - RadioButtonProps
+ * @param {string} RadioButtonProps.className - Outer class to modify styles
+ * @param {string} RadioButtonProps.id - RadioButton id
+ * @param {boolean} RadioButtonProps.isChecked - Flag to check
+ * @param {boolean} RadioButtonProps.isDisabled - Flag to disable the Radio-button
+ * @param {string} RadioButtonProps.label - Text to display in the Radio-button
+ * @param {string} RadioButtonProps.labelPosition - Label position depending on the Radio-button, it can be left or right, by default it is right
+ * @param {string} RadioButtonProps.name - RadioButton name
+ * @param {void} RadioButtonProps.onChange - Action to trigger when the Radio-button changes state, returns the value of the Radio-button
+ * @param {string} RadioButtonProps.value - RadioButton value
+ * @param {object} RadioButtonProps.rest - Rest of props to be passed to the Radio-button
+ * @returns {symbol} - Returns the component
+ */
+declare const RadioButton: ({ className, id, isChecked, isDisabled, label, onChange, value, name, isRequired, ...rest }: RadioButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default RadioButton;

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

@@ -1,43 +1,42 @@
-/// <reference types="react" />
-export interface RadioButtonProps extends React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
-    /**
-     * Gives the possibility to add an external class to the component to modify its styles
-     */
-    className?: string;
-    /**
-     * Add an identifier to the component
-     */
-    id?: string;
-    /**
-     * Flag that determines if the component is selected or not
-     *
-     * @default 'false'
-     */
-    isChecked?: boolean;
-    /**
-     * Flag that determines if the component is disabled or not
-     *
-     * @default 'false'
-     */
-    isDisabled?: boolean;
-    /**
-     * Text displayed next to the component
-     */
-    label?: React.ReactNode;
-    /**
-     * Function that is triggered when the component changes state, returns the value of the component
-     */
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * Component Value
-     */
-    value?: string;
-    /**
-     * Component Name
-     */
-    name?: string;
-    /**
-     * Returns a * if the field is required
-     */
-    isRequired?: boolean;
-}
+export interface RadioButtonProps extends React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
+    /**
+     * Gives the possibility to add an external class to the component to modify its styles
+     */
+    className?: string;
+    /**
+     * Add an identifier to the component
+     */
+    id?: string;
+    /**
+     * Flag that determines if the component is selected or not
+     *
+     * @default 'false'
+     */
+    isChecked?: boolean;
+    /**
+     * Flag that determines if the component is disabled or not
+     *
+     * @default 'false'
+     */
+    isDisabled?: boolean;
+    /**
+     * Text displayed next to the component
+     */
+    label?: React.ReactNode;
+    /**
+     * Function that is triggered when the component changes state, returns the value of the component
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Component Value
+     */
+    value?: string;
+    /**
+     * Component Name
+     */
+    name?: string;
+    /**
+     * Returns a * if the field is required
+     */
+    isRequired?: boolean;
+}

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

@@ -1,3 +1,3 @@
-import RadioButton from './RadioButton';
-export * from './RadioButton.props';
-export { RadioButton };
+import RadioButton from './RadioButton';
+export * from './RadioButton.props';
+export { RadioButton };

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

@@ -1,34 +1,33 @@
-/// <reference types="react" />
-import type { SelectProps } from './Select.props';
-import './Select.styles.scss';
-/**
- * The Select is used to render a list of options to choose from.
- *
- * @param {SelectProps}  SelectProps - SelectProps.
- * @default 'true'
- * @param {boolean} SelectProps.isMultiple - Flag that shows us if multiple
- * options can be selected or not
- * @param {string} SelectProps.placeholder - Select Placeholder
- * @param {string} SelectProps.selectLabel - Select Label
- * @param {object} InputTextProps.secondaryAction - Text for show icon inside right input.
- * @param {string[]} SelectProps.selected - Selected data to highlight in the render
- * of the list items
- * @param {Function} SelectProps.onChange - Action that is triggered by selecting
- * or deselecting one or more items in the list
- * @param {string} SelectProps.searchPlaceholder - Search placeholder
- * @param {string}  SelectProps.searchLabel  - Search label
- * @param {string}  SelectProps.helperText  - Help text to be displayed under the select
- * @param {boolean}  SelectProps.isHelperMode  - To show a different style in
- * select (style help)
- * @default 'false'
- * @param {boolean}  SelectProps.isDisabled  - Select disabled state
- * @default 'false'
- * @param {Function}  SelectProps.onSearchChange  - Action that is triggered every
- * time the search engine is typed
- * @param {boolean}  SelectProps.isReadOnly  - Disables popover operation
- * @default 'false'
- * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
- * @returns {symbol} - Element Select
- */
-declare const Select: ({ ariaLabel, items, sections, isMultiple, placeholder, label, secondaryAction, selected, onChange, searchPlaceholder, searchLabel, helperText, isHelperMode, isDisabled, tooltip, isDanger, isReadOnly, id, emptyState, onBlur, isRequired, tooltipLabel, action, showSearch, }: SelectProps) => JSX.Element;
-export default Select;
+import type { SelectProps } from "./Select.props";
+import "./Select.styles.scss";
+/**
+ * The Select is used to render a list of options to choose from.
+ *
+ * @param {SelectProps}  SelectProps - SelectProps.
+ * @default 'true'
+ * @param {boolean} SelectProps.isMultiple - Flag that shows us if multiple
+ * options can be selected or not
+ * @param {string} SelectProps.placeholder - Select Placeholder
+ * @param {string} SelectProps.selectLabel - Select Label
+ * @param {object} InputTextProps.secondaryAction - Text for show icon inside right input.
+ * @param {string[]} SelectProps.selected - Selected data to highlight in the render
+ * of the list items
+ * @param {Function} SelectProps.onChange - Action that is triggered by selecting
+ * or deselecting one or more items in the list
+ * @param {string} SelectProps.searchPlaceholder - Search placeholder
+ * @param {string}  SelectProps.searchLabel  - Search label
+ * @param {string}  SelectProps.helperText  - Help text to be displayed under the select
+ * @param {boolean}  SelectProps.isHelperMode  - To show a different style in
+ * select (style help)
+ * @default 'false'
+ * @param {boolean}  SelectProps.isDisabled  - Select disabled state
+ * @default 'false'
+ * @param {Function}  SelectProps.onSearchChange  - Action that is triggered every
+ * time the search engine is typed
+ * @param {boolean}  SelectProps.isReadOnly  - Disables popover operation
+ * @default 'false'
+ * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
+ * @returns {symbol} - Element Select
+ */
+declare const Select: ({ ariaLabel, items, sections, isMultiple, placeholder, label, secondaryAction, selected, onChange, searchPlaceholder, searchLabel, helperText, isHelperMode, isDisabled, tooltip, isDanger, isReadOnly, id, emptyState, onBlur, isRequired, tooltipLabel, action, showSearch, }: SelectProps) => import("react/jsx-runtime").JSX.Element;
+export default Select;

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

@@ -1,114 +1,114 @@
-import React from 'react';
-import type { OptionListItemType, OptionListSectionType } from '../OptionList';
-import type { TooltipInput } from '../InputText';
-import { ActionType } from '../../types';
-export interface TooltipSelect {
-    text?: string;
-    id?: string;
-    position?: 'topLeft' | 'topRight' | 'topCenter' | 'bottomLeft' | 'bottomRight' | 'bottomCenter' | 'right' | 'left';
-}
-export interface SelectElementSecondaryActionType {
-    text?: string;
-    onClick?: () => void;
-}
-export interface SelectProps {
-    /**
-     * Items to render
-     */
-    items?: OptionListItemType[];
-    /**
-     * Sections to render
-     */
-    sections?: OptionListSectionType[];
-    /**
-     * Flag that shows us if multiple options can be selected or not
-     */
-    isMultiple?: boolean;
-    /**
-     * Select Placeholder
-     */
-    placeholder?: string;
-    /**
-     * Select Label
-     */
-    label?: string;
-    /**
-     * Element to show a one action on right top to the input
-     */
-    secondaryAction?: SelectElementSecondaryActionType;
-    /**
-     * Selected data to highlight in the render of the list items
-     */
-    selected?: string[];
-    /**
-     * Action that is triggered by selecting or deselecting one or more items in the list
-     */
-    onChange?: (data?: string[]) => void;
-    /**
-     * Search placeholder
-     */
-    searchPlaceholder?: string;
-    /**
-     * Search label
-     */
-    searchLabel?: string;
-    /**
-     * Help text to be displayed under the select
-     */
-    helperText?: React.ReactNode;
-    /**
-     * To show a different style in select (style help)
-     *
-     * @default false
-     */
-    isHelperMode?: boolean;
-    /**
-     * Select disabled state
-     *
-     * @default false
-     */
-    isDisabled?: boolean;
-    /**
-     * Tooltip props
-     */
-    tooltip?: TooltipSelect;
-    /**
-     * Flag that shows a different style in inputTag (style error)
-     *
-     * @default false
-     */
-    isDanger?: boolean;
-    /**
-     * Disables popover operation
-     *
-     * @default false
-     */
-    isReadOnly?: boolean;
-    /**
-     * Add an id to select
-     */
-    id?: string;
-    /**
-     * Add node or string to show infrmative popover
-     */
-    emptyState?: React.ReactNode;
-    /** Callback when focus leaves button */
-    onBlur?: () => void;
-    /**
-     * Returns a * if the field is required
-     *
-     */
-    isRequired?: boolean;
-    tooltipLabel?: TooltipInput;
-    action?: ActionType;
-    /**
-     * Label to use in automatic tests
-     */
-    ariaLabel?: string;
-    /**
-     * Show feature search in select
-     *
-     * @default true
-     */
-    showSearch?: boolean;
-}
+import React from "react";
+import type { OptionListItemType, OptionListSectionType } from "../OptionList";
+import type { TooltipInput } from "../InputText";
+import type { ActionType } from "../../types";
+export interface TooltipSelect {
+    text?: string;
+    id?: string;
+    position?: "topLeft" | "topRight" | "topCenter" | "bottomLeft" | "bottomRight" | "bottomCenter" | "right" | "left";
+}
+export interface SelectElementSecondaryActionType {
+    text?: string;
+    onClick?: () => void;
+}
+export interface SelectProps {
+    /**
+     * Items to render
+     */
+    items?: OptionListItemType[];
+    /**
+     * Sections to render
+     */
+    sections?: OptionListSectionType[];
+    /**
+     * Flag that shows us if multiple options can be selected or not
+     */
+    isMultiple?: boolean;
+    /**
+     * Select Placeholder
+     */
+    placeholder?: string;
+    /**
+     * Select Label
+     */
+    label?: string;
+    /**
+     * Element to show a one action on right top to the input
+     */
+    secondaryAction?: SelectElementSecondaryActionType;
+    /**
+     * Selected data to highlight in the render of the list items
+     */
+    selected?: string[];
+    /**
+     * Action that is triggered by selecting or deselecting one or more items in the list
+     */
+    onChange?: (data?: string[]) => void;
+    /**
+     * Search placeholder
+     */
+    searchPlaceholder?: string;
+    /**
+     * Search label
+     */
+    searchLabel?: string;
+    /**
+     * Help text to be displayed under the select
+     */
+    helperText?: React.ReactNode;
+    /**
+     * To show a different style in select (style help)
+     *
+     * @default false
+     */
+    isHelperMode?: boolean;
+    /**
+     * Select disabled state
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Tooltip props
+     */
+    tooltip?: TooltipSelect;
+    /**
+     * Flag that shows a different style in inputTag (style error)
+     *
+     * @default false
+     */
+    isDanger?: boolean;
+    /**
+     * Disables popover operation
+     *
+     * @default false
+     */
+    isReadOnly?: boolean;
+    /**
+     * Add an id to select
+     */
+    id?: string;
+    /**
+     * Add node or string to show infrmative popover
+     */
+    emptyState?: React.ReactNode;
+    /** Callback when focus leaves button */
+    onBlur?: () => void;
+    /**
+     * Returns a * if the field is required
+     *
+     */
+    isRequired?: boolean;
+    tooltipLabel?: TooltipInput;
+    action?: ActionType;
+    /**
+     * Label to use in automatic tests
+     */
+    ariaLabel?: string;
+    /**
+     * Show feature search in select
+     *
+     * @default true
+     */
+    showSearch?: boolean;
+}

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

@@ -1,3 +1,3 @@
-import Select from './Select';
-export * from './Select.props';
-export { Select };
+import Select from './Select';
+export * from './Select.props';
+export { Select };

package/dist/components/SideMenu/SideMenu.d.ts

@@ -1,16 +1,15 @@
-/// <reference types="react" />
-import type { SideMenuProps } from './SideMenu.props';
-import './SideMenu.styles.scss';
-/**
- * The Side Menu is used to show navigation.
- *
- * @deprecated This component is deprecated and will be removed in a future version. Please use the new SideMenu component when it becomes available.
- * @param {SideMenuProps}  SideMenuProps -SideMenuProps
- * @param {object} SideMenuProps.itemsBottom - Element to render section inside this component
- * @returns {symbol} - Element SideMenu
- */
-declare const SideMenu: {
-    ({ children, secondaryActions }: SideMenuProps): JSX.Element;
-    Section: ({ items, title, empty }: import("./components").SideMenuSectionProps) => JSX.Element;
-};
-export default SideMenu;
+import type { SideMenuProps } from './SideMenu.props';
+import './SideMenu.styles.scss';
+/**
+ * The Side Menu is used to show navigation.
+ *
+ * @deprecated This component is deprecated and will be removed in a future version. Please use the new SideMenu component when it becomes available.
+ * @param {SideMenuProps}  SideMenuProps -SideMenuProps
+ * @param {object} SideMenuProps.itemsBottom - Element to render section inside this component
+ * @returns {symbol} - Element SideMenu
+ */
+declare const SideMenu: {
+    ({ children, secondaryActions }: SideMenuProps): import("react/jsx-runtime").JSX.Element;
+    Section: ({ items, title, empty }: import("./components").SideMenuSectionProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default SideMenu;

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

@@ -1,20 +1,19 @@
-/// <reference types="react" />
-import type { IconName } from '../Icon';
-export interface SecondaryActionsType {
-    icon?: IconName;
-    onClick?: () => void;
-    /**
-     * Label to use in automatic tests
-     */
-    ariaLabel?: string;
-}
-export interface SideMenuProps {
-    /**
-     * Component to render by the SideMenu.Section
-     */
-    children?: React.ReactNode;
-    /**
-     * elements to show in a bottom in sidemenu
-     */
-    secondaryActions?: SecondaryActionsType[];
-}
+import type { IconName } from '../Icon';
+export interface SecondaryActionsType {
+    icon?: IconName;
+    onClick?: () => void;
+    /**
+     * Label to use in automatic tests
+     */
+    ariaLabel?: string;
+}
+export interface SideMenuProps {
+    /**
+     * Component to render by the SideMenu.Section
+     */
+    children?: React.ReactNode;
+    /**
+     * elements to show in a bottom in sidemenu
+     */
+    secondaryActions?: SecondaryActionsType[];
+}

package/dist/components/SideMenu/components/Section/Section.d.ts

@@ -1,13 +1,12 @@
-/// <reference types="react" />
-import type { SideMenuSectionProps } from './Section.props';
-import './Section.styles.scss';
-/**
- *  The Side Menu is used to show navigation.
- *
- * @param {SectionProps}  SectionProps - SectionProps
- * @param {object} SectionProps.items - Element to render in this section
- * @param {object} SectionProps.message - Element to show text to no containt items
- * @returns {symbol} - Element SideMenu.Section
- */
-declare const Section: ({ items, title, empty }: SideMenuSectionProps) => JSX.Element;
-export default Section;
+import type { SideMenuSectionProps } from './Section.props';
+import './Section.styles.scss';
+/**
+ *  The Side Menu is used to show navigation.
+ *
+ * @param {SectionProps}  SectionProps - SectionProps
+ * @param {object} SectionProps.items - Element to render in this section
+ * @param {object} SectionProps.message - Element to show text to no containt items
+ * @returns {symbol} - Element SideMenu.Section
+ */
+declare const Section: ({ items, title, empty }: SideMenuSectionProps) => import("react/jsx-runtime").JSX.Element;
+export default Section;