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

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

@@ -1,44 +1,44 @@
-export interface CalendarPickerProps {
-    /**
-     * This function will return the selected date, it responds to the change of month, year and day selection; it should be called like this: (date) => functionName (date)
-     */
-    handleChangeDate(e: string): void;
-    /**
-     * Number of years prior to the current year to render in the year select, by default it is 5 years
-     */
-    minYear?: number;
-    /**
-     * Number of years after the current year to render in the year select, by default it is 5 years
-     */
-    maxYear?: number;
-    /**
-     * Receive a string with a specific date, the format must be DD/MM/YYYY.
-     */
-    date?: string;
-    /**
-     * Accept text strings
-     */
-    label?: string;
-    /**
-     * Accept only value bool
-     */
-    isDisabled?: boolean;
-    /**
-     * Accept only value string
-     */
-    placeHolder?: string;
-    /**
-     * Accept only value bool
-     */
-    isReadOnly?: boolean;
-    /**
-     * Returns a * if the field is required
-     */
-    isRequired?: boolean;
-    /**
-     * Calendar language
-     */
-    language?: 'es' | 'en';
-    /** Callback when focus leaves input */
-    onBlur?: () => void;
-}
+export interface CalendarPickerProps {
+    /**
+     * This function will return the selected date, it responds to the change of month, year and day selection; it should be called like this: (date) => functionName (date)
+     */
+    handleChangeDate(e: string): void;
+    /**
+     * Number of years prior to the current year to render in the year select, by default it is 5 years
+     */
+    minYear?: number;
+    /**
+     * Number of years after the current year to render in the year select, by default it is 5 years
+     */
+    maxYear?: number;
+    /**
+     * Receive a string with a specific date, the format must be DD/MM/YYYY.
+     */
+    date?: string;
+    /**
+     * Accept text strings
+     */
+    label?: string;
+    /**
+     * Accept only value bool
+     */
+    isDisabled?: boolean;
+    /**
+     * Accept only value string
+     */
+    placeHolder?: string;
+    /**
+     * Accept only value bool
+     */
+    isReadOnly?: boolean;
+    /**
+     * Returns a * if the field is required
+     */
+    isRequired?: boolean;
+    /**
+     * Calendar language
+     */
+    language?: 'es' | 'en';
+    /** Callback when focus leaves input */
+    onBlur?: () => void;
+}

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

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

package/dist/components/CalendarPicker/utils/index.d.ts

@@ -1 +1 @@
-export * from './labels';
+export * from './labels';

package/dist/components/CalendarPicker/utils/labels.d.ts

@@ -1,3 +1,3 @@
-declare const getMonths: (language: string) => undefined;
-declare const getDays: (language: string) => undefined;
-export { getMonths, getDays };
+declare const getMonths: (language: string) => undefined;
+declare const getDays: (language: string) => undefined;
+export { getMonths, getDays };

package/dist/components/Card/Card.d.ts

@@ -1,27 +1,26 @@
-/// <reference types="react" />
-import type { CardProps } from './Card.props';
-import './Card.styles.scss';
-/**
- * Card component are used primarily for show  a little information, sometimes with image.
- *
- * @example
- * <Card title='Facturación' media='Grid' />
- * @param {CardProps} CardProps - Card Props.
- * @param {ReactNode} CardProps.addon - Item extra to show in Header
- * @param {string} CardProps.description - Description to show in card
- * @param {string} CardProps.image - Source of image
- * @param {boolean} CardProps.isBorderLess - Flag to show border
- * @param {boolean} CardProps.isDisabled - Flag to set disabled card
- * @param {boolean} CardProps.isSelected - Flag to set selected card
- * @param {IconName} CardProps.media - Icon to show in Header
- * @param {IconName} CardProps.mediaAppearance - Media appearance to shoe in Header
- * @param {IconName} CardProps.mediaSize - Media size to show in Header
- * @param {Function} CardProps.onClick - Event onClick on Card
- * @param {string} CardProps.size - Size of Card
- * @param {string} CardProps.source - Source of thumbnail image
- * @param {string} CardProps.title - Title to show in Card
- * @param {ReactNode} CardProps.children - Title to show in Card
- * @returns {symbol} The component.
- */
-declare const Card: ({ addon, children, description, image, isBorderLess, isDisabled, isSelected, media, mediaAppearance, mediaSize, onClick, size, source, title, icon, }: CardProps) => JSX.Element;
-export default Card;
+import type { CardProps } from './Card.props';
+import './Card.styles.scss';
+/**
+ * Card component are used primarily for show  a little information, sometimes with image.
+ *
+ * @example
+ * <Card title='Facturación' media='Grid' />
+ * @param {CardProps} CardProps - Card Props.
+ * @param {ReactNode} CardProps.addon - Item extra to show in Header
+ * @param {string} CardProps.description - Description to show in card
+ * @param {string} CardProps.image - Source of image
+ * @param {boolean} CardProps.isBorderLess - Flag to show border
+ * @param {boolean} CardProps.isDisabled - Flag to set disabled card
+ * @param {boolean} CardProps.isSelected - Flag to set selected card
+ * @param {IconName} CardProps.media - Icon to show in Header
+ * @param {IconName} CardProps.mediaAppearance - Media appearance to shoe in Header
+ * @param {IconName} CardProps.mediaSize - Media size to show in Header
+ * @param {Function} CardProps.onClick - Event onClick on Card
+ * @param {string} CardProps.size - Size of Card
+ * @param {string} CardProps.source - Source of thumbnail image
+ * @param {string} CardProps.title - Title to show in Card
+ * @param {ReactNode} CardProps.children - Title to show in Card
+ * @returns {symbol} The component.
+ */
+declare const Card: ({ addon, children, description, image, isBorderLess, isDisabled, isSelected, media, mediaAppearance, mediaSize, onClick, size, source, title, icon, }: CardProps) => import("react/jsx-runtime").JSX.Element;
+export default Card;

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

@@ -1,34 +1,33 @@
-/// <reference types="react" />
-import type { IconName } from '../Icon';
-export interface CardProps {
-    /** Item extra to show in Header */
-    addon?: React.ReactNode;
-    /** Children to display */
-    children?: React.ReactNode;
-    /** Description to show in card */
-    description?: string;
-    /** Source of image */
-    image?: string;
-    /** Icon to show like placeholder */
-    icon?: IconName;
-    /** Flag to show border */
-    isBorderLess?: boolean;
-    /** Flag to set disabled card */
-    isDisabled?: boolean;
-    /** Flag to set selected card */
-    isSelected?: boolean;
-    /** Icon to show in Header */
-    media?: IconName;
-    /** Icon to show in Header */
-    mediaAppearance?: 'info' | 'success';
-    /** Size of media */
-    mediaSize?: 'small' | 'medium' | 'large';
-    /** Event onClick on Card */
-    onClick?: () => void;
-    /** Size of Card */
-    size?: 'extra-small' | 'small' | 'medium';
-    /** Source of thumbnail image */
-    source?: string;
-    /** Title to show in Card */
-    title: string;
-}
+import type { IconName } from '../Icon';
+export interface CardProps {
+    /** Item extra to show in Header */
+    addon?: React.ReactNode;
+    /** Children to display */
+    children?: React.ReactNode;
+    /** Description to show in card */
+    description?: string;
+    /** Source of image */
+    image?: string;
+    /** Icon to show like placeholder */
+    icon?: IconName;
+    /** Flag to show border */
+    isBorderLess?: boolean;
+    /** Flag to set disabled card */
+    isDisabled?: boolean;
+    /** Flag to set selected card */
+    isSelected?: boolean;
+    /** Icon to show in Header */
+    media?: IconName;
+    /** Icon to show in Header */
+    mediaAppearance?: 'info' | 'success';
+    /** Size of media */
+    mediaSize?: 'small' | 'medium' | 'large';
+    /** Event onClick on Card */
+    onClick?: () => void;
+    /** Size of Card */
+    size?: 'extra-small' | 'small' | 'medium';
+    /** Source of thumbnail image */
+    source?: string;
+    /** Title to show in Card */
+    title: string;
+}

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

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

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

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

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

@@ -1,29 +1,28 @@
-/// <reference types="react" />
-export interface CheckboxProps 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;
-    /**
-     * Returns a * if the field is required
-     */
-    isRequired?: boolean;
-}
+export interface CheckboxProps 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;
+    /**
+     * Returns a * if the field is required
+     */
+    isRequired?: boolean;
+}

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

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

package/dist/components/ChoiceList/ChoiceList.d.ts

@@ -1,21 +1,20 @@
-/// <reference types="react" />
-import type { ChoiceListProps } from './ChoiceList.props';
-import './ChoiceList.styles.scss';
-/**
- * Allow user to select one or multiple options from a list. Make sure all options
- * are an either/or choice.
- *
- * @param {ChoiceListProps}  ChoiceListProps - ChoiceListProps
- * @param {ChoiceListItemType[]} ChoiceListProps.choices - Collection of choices
- * @param {string} ChoiceListProps.name - Name for form input
- * @param {string[]} ChoiceListProps.selected - Collection of selected choices
- * @param {boolean} ChoiceListProps.allowMultiple - Allow users to select multiple options at once
- * @param {boolean} ChoiceListProps.isDisabled - Disable all choices
- * @param {Function} ChoiceListProps.onChange - Callback when the selected choices change
- * @param {string} ChoiceListProps.title - Label for list of choices
- * @param {string} ChoiceListProps.allowSelectAll - Let user select all choices when is multiple choice list
- * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
- * @returns {symbol} - Returns the component
- */
-declare const ChoiceList: ({ ariaLabel, choices, name, selected, allowMultiple, allowSelectAll, isDisabled, onChange, title, }: ChoiceListProps) => JSX.Element;
-export default ChoiceList;
+import type { ChoiceListProps } from './ChoiceList.props';
+import './ChoiceList.styles.scss';
+/**
+ * Allow user to select one or multiple options from a list. Make sure all options
+ * are an either/or choice.
+ *
+ * @param {ChoiceListProps}  ChoiceListProps - ChoiceListProps
+ * @param {ChoiceListItemType[]} ChoiceListProps.choices - Collection of choices
+ * @param {string} ChoiceListProps.name - Name for form input
+ * @param {string[]} ChoiceListProps.selected - Collection of selected choices
+ * @param {boolean} ChoiceListProps.allowMultiple - Allow users to select multiple options at once
+ * @param {boolean} ChoiceListProps.isDisabled - Disable all choices
+ * @param {Function} ChoiceListProps.onChange - Callback when the selected choices change
+ * @param {string} ChoiceListProps.title - Label for list of choices
+ * @param {string} ChoiceListProps.allowSelectAll - Let user select all choices when is multiple choice list
+ * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
+ * @returns {symbol} - Returns the component
+ */
+declare const ChoiceList: ({ ariaLabel, choices, name, selected, allowMultiple, allowSelectAll, isDisabled, onChange, title, }: ChoiceListProps) => import("react/jsx-runtime").JSX.Element;
+export default ChoiceList;

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

@@ -1,33 +1,33 @@
-import { ReactNode } from 'react';
-export declare type ChoiceListItemType = {
-    /** Choice value */
-    value: string;
-    /** Choice label */
-    label: ReactNode;
-    /** Disable the choice */
-    isDisabled?: boolean;
-    /** Sets choice in error state */
-    isDanger?: boolean;
-};
-export interface ChoiceListProps {
-    /** Label for list of choices */
-    title?: string;
-    /** Collection of choices */
-    choices: ChoiceListItemType[];
-    /** Collection of selected choices */
-    selected: string[];
-    /** Name for form input */
-    name: string;
-    /** Allow users to select multiple options at once */
-    allowMultiple?: boolean;
-    /** Disable all choices */
-    isDisabled?: boolean;
-    /** Callback when the selected choices change */
-    onChange?: (selected: string[], name: string) => void;
-    /** Let user select all choices when is multiple choice list */
-    allowSelectAll?: boolean;
-    /**
-     * Label to use in automatic tests
-     */
-    ariaLabel?: string;
-}
+import type { ReactNode } from "react";
+export type ChoiceListItemType = {
+    /** Choice value */
+    value: string;
+    /** Choice label */
+    label: ReactNode;
+    /** Disable the choice */
+    isDisabled?: boolean;
+    /** Sets choice in error state */
+    isDanger?: boolean;
+};
+export interface ChoiceListProps {
+    /** Label for list of choices */
+    title?: string;
+    /** Collection of choices */
+    choices: ChoiceListItemType[];
+    /** Collection of selected choices */
+    selected: string[];
+    /** Name for form input */
+    name: string;
+    /** Allow users to select multiple options at once */
+    allowMultiple?: boolean;
+    /** Disable all choices */
+    isDisabled?: boolean;
+    /** Callback when the selected choices change */
+    onChange?: (selected: string[], name: string) => void;
+    /** Let user select all choices when is multiple choice list */
+    allowSelectAll?: boolean;
+    /**
+     * Label to use in automatic tests
+     */
+    ariaLabel?: string;
+}

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

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

package/dist/components/Collapsible/Collapsible.d.ts

@@ -1,19 +1,18 @@
-/// <reference types="react" />
-import type { CollapsibleProps } from './Collapsible.props';
-import './Collapsible.styles.scss';
-/**
- * Component used to show or hide information.
- *
- * @param {CollapsibleProps}  CollapsibleProps - CollapsibleProps
- * @param {string} CollapsibleProps.iconMedia - icon to show in the component header
- * @param {string} CollapsibleProps.mediaAppearance - Media Component Styles
- * @param {symbol} CollapsibleProps.children - Component to render
- * @param {boolean} CollapsibleProps.isOpen - Component is open?
- * @param {function} CollapsibleProps.onClick - Component opening function
- * @param {string} CollapsibleProps.buttonText - Text to display on the button
- * @param {string} CollapsibleProps.title - Component Title
- * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
- * @returns {symbol} The component.
- */
-declare const Collapsible: ({ ariaLabel, iconMedia, mediaAppearance, children, isOpen, onClick, buttonText, title, }: CollapsibleProps) => JSX.Element;
-export default Collapsible;
+import type { CollapsibleProps } from './Collapsible.props';
+import './Collapsible.styles.scss';
+/**
+ * Component used to show or hide information.
+ *
+ * @param {CollapsibleProps}  CollapsibleProps - CollapsibleProps
+ * @param {string} CollapsibleProps.iconMedia - icon to show in the component header
+ * @param {string} CollapsibleProps.mediaAppearance - Media Component Styles
+ * @param {symbol} CollapsibleProps.children - Component to render
+ * @param {boolean} CollapsibleProps.isOpen - Component is open?
+ * @param {function} CollapsibleProps.onClick - Component opening function
+ * @param {string} CollapsibleProps.buttonText - Text to display on the button
+ * @param {string} CollapsibleProps.title - Component Title
+ * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
+ * @returns {symbol} The component.
+ */
+declare const Collapsible: ({ ariaLabel, iconMedia, mediaAppearance, children, isOpen, onClick, buttonText, title, }: CollapsibleProps) => import("react/jsx-runtime").JSX.Element;
+export default Collapsible;

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

@@ -1,37 +1,36 @@
-/// <reference types="react" />
-import type { IconName } from '../Icon';
-export interface CollapsibleProps {
-    /**
-     * The type of media to display
-     *
-     * @default 'default'
-     */
-    mediaAppearance?: 'default' | 'success' | 'warning' | 'info' | 'danger' | 'majorWarning';
-    /** Icon to be displayed */
-    iconMedia?: IconName;
-    /**
-     * Component to render
-     */
-    children?: React.ReactNode;
-    /**
-     * Component is open?
-     * @default false
-     */
-    isOpen?: boolean;
-    /**
-     * Component opening function
-     */
-    onClick?: () => void;
-    /**
-     * Text to display on the button
-     */
-    buttonText?: string;
-    /**
-     * Component Title
-     */
-    title?: string;
-    /**
-     * Label to use in automatic tests
-     */
-    ariaLabel?: string;
-}
+import type { IconName } from '../Icon';
+export interface CollapsibleProps {
+    /**
+     * The type of media to display
+     *
+     * @default 'default'
+     */
+    mediaAppearance?: 'default' | 'success' | 'warning' | 'info' | 'danger' | 'majorWarning';
+    /** Icon to be displayed */
+    iconMedia?: IconName;
+    /**
+     * Component to render
+     */
+    children?: React.ReactNode;
+    /**
+     * Component is open?
+     * @default false
+     */
+    isOpen?: boolean;
+    /**
+     * Component opening function
+     */
+    onClick?: () => void;
+    /**
+     * Text to display on the button
+     */
+    buttonText?: string;
+    /**
+     * Component Title
+     */
+    title?: string;
+    /**
+     * Label to use in automatic tests
+     */
+    ariaLabel?: string;
+}

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

@@ -1,3 +1,3 @@
-import Collapsible from './Collapsible';
-export type { CollapsibleProps } from './Collapsible.props';
-export { Collapsible };
+import Collapsible from './Collapsible';
+export type { CollapsibleProps } from './Collapsible.props';
+export { Collapsible };

package/dist/components/Connector/Connector.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-import { ConnectorProps } from './Connector.props';
-import './Connector.styles.scss';
-declare const Connector: ({ alt, icon, id, isActive, image, meta, name, onClick, theme, }: ConnectorProps) => JSX.Element;
-export default Connector;
+import type { ConnectorProps } from "./Connector.props";
+import "./Connector.styles.scss";
+declare const Connector: ({ alt, icon, id, isActive, image, meta, name, onClick, theme, }: ConnectorProps) => import("react/jsx-runtime").JSX.Element;
+export default Connector;