kiban-design-system 1.1.2-hotfix.0 → 1.1.2

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,20 +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
- * @returns {symbol} - Returns the component
- */
-declare const ChoiceList: ({ 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,29 +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;
-}
+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,18 +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
- * @returns {symbol} The component.
- */
-declare const Collapsible: ({ 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,33 +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;
-}
+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;

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

@@ -1,14 +1,14 @@
-import { ReactNode } from 'react';
-import { ThemeType } from '../ThemeProvider';
-import { IconName } from '../Icon';
-export interface ConnectorProps {
-    alt?: string;
-    icon?: IconName;
-    id: string;
-    image?: string;
-    isActive?: boolean;
-    meta?: ReactNode;
-    name?: string;
-    onClick?: (id: string) => void;
-    theme?: ThemeType;
-}
+import type { ReactNode } from "react";
+import type { ThemeType } from "../ThemeProvider";
+import type { IconName } from "../Icon";
+export interface ConnectorProps {
+    alt?: string;
+    icon?: IconName;
+    id: string;
+    image?: string;
+    isActive?: boolean;
+    meta?: ReactNode;
+    name?: string;
+    onClick?: (id: string) => void;
+    theme?: ThemeType;
+}

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

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

package/dist/components/Container/Container.d.ts

@@ -1,12 +1,11 @@
-/// <reference types="react" />
-import type { ContainerProps } from './Container.props';
-import './Container.styles.scss';
-/**
- *
- * @param {ContainerProps}  ContainerProps - ContainerProps
- * @param {symbol} ContainerProps.children - Element to display in container
- * @param {boolean} ContainerProps.hasShadow - Flag for display shadow
- * @returns {symbol} - Element Container
- */
-declare const Container: ({ children, hasShadow }: ContainerProps) => JSX.Element;
-export default Container;
+import type { ContainerProps } from './Container.props';
+import './Container.styles.scss';
+/**
+ *
+ * @param {ContainerProps}  ContainerProps - ContainerProps
+ * @param {symbol} ContainerProps.children - Element to display in container
+ * @param {boolean} ContainerProps.hasShadow - Flag for display shadow
+ * @returns {symbol} - Element Container
+ */
+declare const Container: ({ children, hasShadow }: ContainerProps) => import("react/jsx-runtime").JSX.Element;
+export default Container;

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

@@ -1,12 +1,11 @@
-/// <reference types="react" />
-export interface ContainerProps {
-    /**
-     * Content to display
-     */
-    children: React.ReactNode;
-    /**
-     * Flag for display shadow
-     * default is true
-     */
-    hasShadow?: boolean;
-}
+export interface ContainerProps {
+    /**
+     * Content to display
+     */
+    children: React.ReactNode;
+    /**
+     * Flag for display shadow
+     * default is true
+     */
+    hasShadow?: boolean;
+}

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

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

package/dist/components/Cover/Cover.d.ts

@@ -1,13 +1,12 @@
-/// <reference types="react" />
-import type { CoverProps } from './Cover.props';
-import './Cover.styles.scss';
-/**
- *
- * @param {CoverProps}  CoverProps - CoverProps
- * @param {symbol} CoverProps.children - Element to display in Cover
- * @param {boolean} CoverProps.position - Flag for display shadow
- * @param {string} CoverProps.source - Flag for display image background
- * @returns {symbol} - Element Cover
- */
-declare const Cover: ({ children, position, source, hasShadow, }: CoverProps) => JSX.Element;
-export default Cover;
+import type { CoverProps } from './Cover.props';
+import './Cover.styles.scss';
+/**
+ *
+ * @param {CoverProps}  CoverProps - CoverProps
+ * @param {symbol} CoverProps.children - Element to display in Cover
+ * @param {boolean} CoverProps.position - Flag for display shadow
+ * @param {string} CoverProps.source - Flag for display image background
+ * @returns {symbol} - Element Cover
+ */
+declare const Cover: ({ children, position, source, hasShadow, }: CoverProps) => import("react/jsx-runtime").JSX.Element;
+export default Cover;

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

@@ -1,22 +1,21 @@
-/// <reference types="react" />
-export interface CoverProps {
-    /**
-     * ** Content to display
-     */
-    children?: React.ReactNode;
-    /**
-     * Flag for display position
-     * default is center
-     */
-    position?: 'center' | 'right' | 'left';
-    /**
-     * Flag for display image background
-     * default is a color blue light
-     */
-    source: string;
-    /**
-     * Flag for display shadow
-     * default is false
-     */
-    hasShadow?: boolean;
-}
+export interface CoverProps {
+    /**
+     * ** Content to display
+     */
+    children?: React.ReactNode;
+    /**
+     * Flag for display position
+     * default is center
+     */
+    position?: 'center' | 'right' | 'left';
+    /**
+     * Flag for display image background
+     * default is a color blue light
+     */
+    source: string;
+    /**
+     * Flag for display shadow
+     * default is false
+     */
+    hasShadow?: boolean;
+}

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

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

package/dist/components/DataTable/DataTable.d.ts

@@ -1,22 +1,21 @@
-/// <reference types="react" />
-import type { DataTableProps } from './DataTable.props';
-import './DataTable.styles.scss';
-/**
- * The Table is used to render other components like lists, registers, etc.
- *
- * @param {DataTableProps}  DataTableProps - DataTableProps
- * @param {symbol} DataTableProps.children - Element to render by Table
- * @param {string} DataTableProps.id - Id to table
- * @param {Array} DataTableProps.headings - Headings of the table
- * @param {Array} DataTableProps.headingsTypes - Determines the positioning of the text
- *  in the columns, respects the order of the array, It only
- * accepts text or numeric, if it is numeric the text is aligned
- * to the right, if not it is aligned to the left
- * @returns {symbol} - Element Table
- */
-declare const DataTable: {
-    ({ headings, headingsTypes, children, id, }: DataTableProps): JSX.Element;
-    Row: ({ onClick, children, id, appearance }: import(".").RowProps) => JSX.Element;
-    Cell: ({ children, cellType }: import("./components/Cell").CellProps) => JSX.Element;
-};
-export default DataTable;
+import type { DataTableProps } from './DataTable.props';
+import './DataTable.styles.scss';
+/**
+ * The Table is used to render other components like lists, registers, etc.
+ *
+ * @param {DataTableProps}  DataTableProps - DataTableProps
+ * @param {symbol} DataTableProps.children - Element to render by Table
+ * @param {string} DataTableProps.id - Id to table
+ * @param {Array} DataTableProps.headings - Headings of the table
+ * @param {Array} DataTableProps.headingsTypes - Determines the positioning of the text
+ *  in the columns, respects the order of the array, It only
+ * accepts text or numeric, if it is numeric the text is aligned
+ * to the right, if not it is aligned to the left
+ * @returns {symbol} - Element Table
+ */
+declare const DataTable: {
+    ({ headings, headingsTypes, children, id, }: DataTableProps): import("react/jsx-runtime").JSX.Element;
+    Row: ({ onClick, children, id, appearance }: import(".").RowProps) => import("react/jsx-runtime").JSX.Element;
+    Cell: ({ children, cellType }: import("./components/Cell").CellProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default DataTable;

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

@@ -1,20 +1,19 @@
-/// <reference types="react" />
-export declare type headingType = 'text' | 'numeric';
-export interface DataTableProps {
-    /**
-     * Element that will activator the popover
-     */
-    headings?: string[];
-    /**
-     * Element that will activator the popover
-     */
-    headingsTypes?: headingType[];
-    /**
-     * Children element only indexTable.Row
-     */
-    children?: React.ReactNode;
-    /**
-     * Id to data table
-     */
-    id?: string;
-}
+export type headingType = 'text' | 'numeric';
+export interface DataTableProps {
+    /**
+     * Element that will activator the popover
+     */
+    headings?: string[];
+    /**
+     * Element that will activator the popover
+     */
+    headingsTypes?: headingType[];
+    /**
+     * Children element only indexTable.Row
+     */
+    children?: React.ReactNode;
+    /**
+     * Id to data table
+     */
+    id?: string;
+}

package/dist/components/DataTable/components/Cell/Cell.d.ts

@@ -1,11 +1,10 @@
-/// <reference types="react" />
-import type { CellProps } from './Cell.props';
-/**
- * The Cell is used to render other components like lists, registers, etc.
- *
- * @param {CellProps}  CellProps - CellProps
- * @param {symbol} CellProps.children - Element to render by Cell
- * @returns {symbol} - Element Cell
- */
-declare const Cell: ({ children, cellType }: CellProps) => JSX.Element;
-export default Cell;
+import type { CellProps } from './Cell.props';
+/**
+ * The Cell is used to render other components like lists, registers, etc.
+ *
+ * @param {CellProps}  CellProps - CellProps
+ * @param {symbol} CellProps.children - Element to render by Cell
+ * @returns {symbol} - Element Cell
+ */
+declare const Cell: ({ children, cellType }: CellProps) => import("react/jsx-runtime").JSX.Element;
+export default Cell;

package/dist/components/DataTable/components/Cell/Cell.props.d.ts

@@ -1,15 +1,14 @@
-/// <reference types="react" />
-export declare type cellType = 'text' | 'numeric';
-export interface CellProps {
-    /**
-     * Children element
-     */
-    children?: React.ReactNode;
-    /**
-     * Defines the alignment of the cell content, if
-     * it is numeric the content is aligned to the
-     * right and if it is text it is aligned to the left
-     * @default 'text'
-     */
-    cellType?: cellType;
-}
+export type cellType = 'text' | 'numeric';
+export interface CellProps {
+    /**
+     * Children element
+     */
+    children?: React.ReactNode;
+    /**
+     * Defines the alignment of the cell content, if
+     * it is numeric the content is aligned to the
+     * right and if it is text it is aligned to the left
+     * @default 'text'
+     */
+    cellType?: cellType;
+}