@producteca/producteca-ui-kit 1.8.0 → 1.9.0

package/dist/components/inputs/checkboxInput/checkboxInput.d.ts

@@ -1,22 +1,9 @@
 import { default as React } from 'react';
-import { ReduxFormInput } from '../../../hooks/useReduxFormField';
+import { CheckboxInputProps } from './checkboxInputGroup';
 
-export interface CheckboxItem {
-    id?: string;
-    name?: string;
-    label: string;
-    value?: any;
+export declare const CheckboxInput: React.FC<Omit<CheckboxInputProps, 'items'> & {
     checked?: boolean;
+    label: string;
     disabled?: boolean;
-}
-export interface CheckboxInputProps {
-    name: string;
-    items: CheckboxItem[];
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    title?: string;
-    type?: 'checkbox' | 'radio';
-    size?: 'sm' | 'md' | 'lg';
-    input?: ReduxFormInput;
-}
-export declare const CheckboxInput: React.FC<CheckboxInputProps>;
+}>;
 export default CheckboxInput;

package/dist/components/inputs/checkboxInput/checkboxInputGroup.d.ts

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+import { ReduxFormInput } from '../../../hooks/useReduxFormField';
+
+export interface CheckboxItem {
+    id?: string;
+    name?: string;
+    label: string;
+    value?: any;
+    checked?: boolean;
+    disabled?: boolean;
+}
+export interface CheckboxInputProps {
+    name: string;
+    items: CheckboxItem[];
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    title?: string;
+    type?: 'checkbox' | 'radio';
+    size?: 'sm' | 'md' | 'lg';
+    input?: ReduxFormInput;
+}
+export declare const CheckboxInputGroup: React.FC<CheckboxInputProps>;
+export default CheckboxInputGroup;

package/dist/components/inputs/checkboxInput/index.d.ts

@@ -1,4 +1,4 @@
-import { SingleCheckboxInput } from './singleCheckboxInput';
 import { CheckboxInput } from './checkboxInput';
+import { CheckboxInputGroup } from './checkboxInputGroup';
 
-export { SingleCheckboxInput, CheckboxInput };
+export { CheckboxInput, CheckboxInput as Checkbox, CheckboxInputGroup, CheckboxInputGroup as CheckboxGroup };

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

@@ -3,3 +3,4 @@ export * from './formField/formField';
 export * from './formField/textInput';
 export * from './checkboxInput';
 export * from './searcher/searcher';
+export * from './switchInput';

package/dist/components/inputs/switchInput/index.d.ts

@@ -0,0 +1,4 @@
+import { SwitchInput, SwitchInputGroup, SwitchItem, SwitchInputProps } from './switchInput';
+
+export { SwitchInput, SwitchInput as Switch, SwitchInputGroup, SwitchInputGroup as SwitchGroup };
+export type { SwitchItem, SwitchInputProps };

package/dist/components/inputs/switchInput/switchInput.d.ts

@@ -0,0 +1,31 @@
+import { default as React } from 'react';
+import { ReduxFormInput } from '../../../hooks/useReduxFormField';
+
+export interface SwitchItem {
+    id?: string;
+    name?: string;
+    label: string;
+    value?: any;
+    checked?: boolean;
+    disabled?: boolean;
+}
+export interface SwitchInputProps {
+    name: string;
+    items: SwitchItem[];
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    title?: string;
+    size?: 'sm' | 'md' | 'lg';
+    input?: ReduxFormInput;
+}
+export declare const SwitchInputGroup: React.FC<SwitchInputProps>;
+export declare const SwitchInput: React.FC<{
+    name: string;
+    checked?: boolean;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    label: string;
+    title?: string;
+    disabled?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    input?: ReduxFormInput;
+}>;
+export default SwitchInput;

package/dist/locales/description.d.ts

@@ -7,8 +7,8 @@ export declare const isOptionDisabled = " \n    Funcion que recibe un valor de t
 export declare const selectFieldDescription = "\n  #### Ejemplo de uso   \n  ```typescript\n      <SelectField\n      name=\"productId\"\n      options={[{ label: \"1\", value: 1 }, { label: \"2\", value: 2, tooltipMessage: \"Este valor no es representativo\" }]}\n      onChange={(event) => handleChange(event.target.name, event.target.value)}\n      isMultiple\n      isClearable={false}\n      label={localize('product')}\n      isOptionDisabled={(option) => option.value == 2}\n      rightModifier={shouldShowLoader && <Spinner />}\n    />\n  ```\n";
 export declare const formFieldExample = "\n #### Ejemplo de uso\n \n  ``` typescript\n      <FormField\n        label=\"T\u00EDtulo\"\n        name=\"textInput\"\n        onChange={(event) => handleChange(event.target.name, event.target.value)}\n        placeholder=\"Placeholder\"\n        size=\"md\"\n        type=\"text\"\n        isValid={(inputValue) => _.isNumber(inputValue)}\n      />\n  ```\n";
 export declare const isValidInput = "\n    Funcion que recibe un valor de tipo inputValue y deberia devolver un valor booleano.\n    \n    #### Por ejemplo: (inputValue) => _.isNumber(inputValue)\n    \n    ``` typescript\n         type inputValue = string | number; \n    ```\n";
-export declare const checkboxInputExample = "\n  #### Ejemplo de uso\n  \n  ``` typescript\n      <CheckboxInput\n        items={[\n          {\n            id: '1',\n            label: 'Opci\u00F3n 1'\n          },\n          {\n            id: '2',\n            label: 'Opci\u00F3n 2'\n          },\n          {\n            disabled: true,\n            id: '3',\n            label: 'Opci\u00F3n 3'\n          }\n        ]}\n        name=\"CheckboxList\"\n        onChange={(event) => handleChange(event.target.name, event.target.value)}\n        size=\"lg\"\n        title=\"Selecciona una opci\u00F3n\"\n        type=\"checkbox\"\n      />\n  ```\n";
-export declare const singleCheckboxInputExample = " \n    Versi\u00F3n con una sola opci\u00F3n tipo checkbox y un label personalizado:\n    \n    ```typescript\n      const [checked, setChecked] = React.useState(false)\n      <SingleCheckboxInput\n        name=\"SingleToggle\"\n        checked={checked}\n        onChange={setChecked}\n        label={\"Amazon\"}\n        title={locale('syncStockFromChannel')}\n      />\n    ```\n";
+export declare const checkboxInputGroupExample = "\n  #### Ejemplo de uso\n  \n  ``` typescript\n      <CheckboxInput\n        items={[\n          {\n            id: '1',\n            label: 'Opci\u00F3n 1'\n          },\n          {\n            id: '2',\n            label: 'Opci\u00F3n 2'\n          },\n          {\n            disabled: true,\n            id: '3',\n            label: 'Opci\u00F3n 3'\n          }\n        ]}\n        name=\"CheckboxList\"\n        onChange={(event) => handleChange(event.target.name, event.target.value)}\n        size=\"lg\"\n        title=\"Selecciona una opci\u00F3n\"\n        type=\"checkbox\"\n      />\n  ```\n";
+export declare const checkboxInputExample = " \n    Versi\u00F3n con una sola opci\u00F3n tipo checkbox y un label personalizado:\n    \n    ```typescript\n      const [checked, setChecked] = React.useState(false)\n      <CheckboxInput\n        name=\"Toggle\"\n        checked={checked}\n        onChange={setChecked}\n        label={\"Amazon\"}\n        title={locale('syncStockFromChannel')}\n      />\n    ```\n";
 export declare const searcherExample = " \n    Note la diferencia entre onChange y onInputChange (oficia de onSearch):\n    \n    ```typescript\n      <Searcher\n        label=\"Search label\"\n        name=\"Searcher\"\n        onChange={(event) => onSelectOption(event.target.value)}\n        onInputChange={(event) => handleSearch(event.target.value)}\n        options={[{ label: 'text', value: 1 }]}\n      />\n    ```\n";
 export declare const saveBarExample = "\n  #### Uso b\u00E1sico\n  ```typescript\n    <SaveBar\n      saveProps={{\n        onSave: () => handleSave(),\n        label: 'Save'\n      }}\n      cancelProps={{\n        onCancel: () => handleCancel(),\n        label: 'Cancel'\n      }}\n    />\n  ```\n    #### Con bot\u00F3n de navegaci\u00F3n\n  ```typescript\n    <SaveBar\n      saveProps={{\n        onSave: () => handleSave(),\n        label: 'Save',\n        variant: 'primary'\n      }}\n      cancelProps={{\n        onCancel: () => handleCancel(),\n        label: 'Cancel'\n      }}\n      previousProps={{\n        onPrevious: () => handlePrevious(),\n        label: 'Previous'\n      }}\n    />\n  ```\n    #### Ejemplo completo\n  ```typescript\n    <SaveBar\n      saveProps={{\n        onSave: () => handleSave(),\n        label: 'Guardar cambios',\n        variant: 'success',\n        disabled: false,\n        onClick: () => {},\n      }}\n      cancelProps={{\n        onCancel: () => handleCancel(),\n        label: 'Descartar',\n      }}\n      previousProps={{\n        onPrevious: () => handlePrevious(),\n        label: 'Anterior',\n        variant: 'primary',\n        outline: true,\n        disabled: false,\n        onClick: () => console.log('Previous clicked'),\n      }}\n    />\n  ```\n";
-export declare const singleCheckboxInputReduxFormExample = "\n  #### Ejemplo de uso con Redux Form - SingleCheckboxInput\n  \n  ```typescript\n    <Field\n      name=\"salesSync\"\n      component={SingleCheckboxInput}\n      classComponent={'decrease-stock'}\n      props={{\n        name: 'cancelSales',\n        value: this.salesSync().cancelSales,\n        checked: this.salesSync().cancelSales,\n        label: this.context.localize('settings.cancelSales')\n      }}\n    />\n  ```\n";
+export declare const checkboxInputReduxFormExample = "\n  #### Ejemplo de uso con Redux Form - CheckboxInput\n  \n  ```typescript\n    <Field\n      name=\"salesSync\"\n      component={CheckboxInput}\n      classComponent={'decrease-stock'}\n      props={{\n        name: 'cancelSales',\n        value: this.salesSync().cancelSales,\n        checked: this.salesSync().cancelSales,\n        label: this.context.localize('settings.cancelSales')\n      }}\n    />\n  ```\n";

package/dist/locales/es.d.ts

@@ -19,7 +19,7 @@ declare const _default: {
     save: string;
     hideSelectedOptionsExplainText: string;
     description: {
-        singleCheckboxInputReduxFormExample: string;
+        checkboxInputReduxFormExample: string;
         onChangeSelectField: string;
         onInputChange: string;
         onChangeSearcher: string;
@@ -53,7 +53,8 @@ declare const _default: {
         };
         checkboxInput: {
             example: string;
-            singleCheckboxInputExample: string;
+            checkboxInputExample: string;
+            checkboxInputGroupExample: string;
         };
         icons: {
             size: string;