@widergy/energy-ui 3.172.2 → 3.172.3

package/dist/esm/components/UTRadioGroup/UTRadioGroup.stories.js

@@ -1,547 +0,0 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { useArgs } from '@storybook/preview-api';
-import { joinArgTypes } from 'stories/utils';
-import { SPACING } from '../UTCheckbox/versions/V1/constants';
-import { RADIO_VARIANTS } from './versions/V1/components/Radio/constants';
-import UTRadioGroup from '.';
-const defaultOptions = [{
-  name: 'Opción 1',
-  value: '1',
-  icon: 'IconBeach',
-  prefix: 'Prefijo',
-  suffix: 'Sufijo',
-  description: 'Descripción'
-}, {
-  name: 'Opción 2',
-  value: '2'
-}, {
-  name: 'Opción 3',
-  value: '3',
-  disabled: true
-}];
-export default {
-  args: {
-    version: 'V1',
-    options: defaultOptions,
-    title: 'Selecciona una opción',
-    value: ''
-  },
-  argTypes: {
-    version: {
-      control: 'inline-radio',
-      options: ['V0', 'V1'],
-      description: 'Versión del componente a utilizar.',
-      table: {
-        defaultValue: {
-          summary: 'V1'
-        },
-        type: {
-          summary: joinArgTypes(['V0', 'V1'])
-        }
-      }
-    },
-    title: {
-      control: 'text',
-      description: 'Título del campo (V1 only).',
-      table: {
-        defaultValue: {
-          summary: 'undefined'
-        },
-        type: {
-          summary: 'string'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V1'
-      }
-    },
-    field: {
-      control: 'object',
-      description: 'Objeto de configuración del campo (V0 only). Contiene title, required, read_only, etc.',
-      table: {
-        defaultValue: {
-          summary: 'undefined'
-        },
-        type: {
-          summary: 'object'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    input: {
-      control: 'object',
-      description: 'Objeto input con value y onChange (V0 only). Similar al patrón de Redux Form.',
-      table: {
-        defaultValue: {
-          summary: '{ value: "", onChange: () => {} }'
-        },
-        type: {
-          summary: 'object'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    labelKey: {
-      control: 'text',
-      description: 'Clave para obtener la etiqueta de cada opción (V0 only).',
-      table: {
-        defaultValue: {
-          summary: 'name'
-        },
-        type: {
-          summary: 'string'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    valueKey: {
-      control: 'text',
-      description: 'Clave para obtener el valor de cada opción (V0 only).',
-      table: {
-        defaultValue: {
-          summary: 'value'
-        },
-        type: {
-          summary: 'string'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    divider: {
-      control: 'boolean',
-      description: 'Muestra divisores entre las opciones (V0 only).',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    disableRipple: {
-      control: 'boolean',
-      description: 'Deshabilita el efecto ripple de Material-UI (V0 only).',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    withUpperTitle: {
-      control: 'boolean',
-      description: 'Muestra el título en la parte superior usando UTFieldLabel (V0 only).',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    hideLabels: {
-      control: 'boolean',
-      description: 'Oculta las etiquetas (V0 only).',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V0'
-      }
-    },
-    options: {
-      control: 'object',
-      description: 'Array de opciones a mostrar como botones de radio.',
-      table: {
-        defaultValue: {
-          summary: '[]'
-        },
-        type: {
-          summary: 'arrayOf(shape)'
-        }
-      }
-    },
-    value: {
-      control: 'text',
-      description: 'Valor seleccionado.',
-      table: {
-        defaultValue: {
-          summary: 'null'
-        },
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    onChange: {
-      control: false,
-      description: 'Función a llamar cuando cambia la selección.',
-      table: {
-        defaultValue: {
-          summary: '() => {}'
-        },
-        type: {
-          summary: 'func'
-        }
-      }
-    },
-    disabled: {
-      control: 'boolean',
-      description: 'Deshabilita todos los botones de radio del grupo cuando es verdadero.',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      }
-    },
-    required: {
-      control: 'boolean',
-      description: 'Indica si el campo es obligatorio.',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      }
-    },
-    variant: {
-      control: 'select',
-      description: 'Estilo de variante para el campo (V1 only).',
-      options: Object.values(RADIO_VARIANTS),
-      table: {
-        defaultValue: {
-          summary: 'undefined'
-        },
-        type: {
-          summary: joinArgTypes(Object.values(RADIO_VARIANTS))
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V1'
-      }
-    },
-    horizontalSpacing: {
-      control: 'select',
-      description: 'Espaciado entre el botón de radio y el título horizontalmente (V1 only).',
-      options: Object.values(SPACING),
-      table: {
-        defaultValue: {
-          summary: 'medium'
-        },
-        type: {
-          summary: joinArgTypes(Object.values(SPACING))
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V1'
-      }
-    },
-    verticalSpacing: {
-      control: 'select',
-      description: 'Espaciado entre los elementos de botones de radio verticalmente (V1 only).',
-      options: Object.values(SPACING),
-      table: {
-        defaultValue: {
-          summary: 'medium'
-        },
-        type: {
-          summary: joinArgTypes(Object.values(SPACING))
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V1'
-      }
-    },
-    reversed: {
-      control: 'boolean',
-      description: 'Si es verdadero, invierte el orden del título y el botón de radio (V1 only).',
-      table: {
-        defaultValue: {
-          summary: 'false'
-        },
-        type: {
-          summary: 'bool'
-        }
-      },
-      if: {
-        arg: 'version',
-        eq: 'V1'
-      }
-    },
-    dataTestId: {
-      control: 'text',
-      description: 'ID de prueba para el elemento raíz.',
-      table: {
-        defaultValue: {
-          summary: 'undefined'
-        },
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    itemDataTestId: {
-      control: 'text',
-      description: 'Prefijo de ID de prueba para elementos de radio individuales.',
-      table: {
-        defaultValue: {
-          summary: 'undefined'
-        },
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    classNames: {
-      control: 'object',
-      description: 'Nombres de clase personalizados para aplicar a diferentes elementos.',
-      table: {
-        defaultValue: {
-          summary: '{}'
-        },
-        type: {
-          summary: 'objectOf(string)'
-        }
-      }
-    },
-    actions: {
-      control: 'object',
-      description: 'Acciones a renderizar dentro de UTFieldLabel.',
-      table: {
-        defaultValue: {
-          summary: 'undefined'
-        },
-        type: {
-          summary: 'arrayOf(object)'
-        }
-      }
-    }
-  },
-  component: UTRadioGroup,
-  parameters: {
-    controls: {
-      exclude: ['classes', 'style']
-    },
-    docs: {
-      description: {
-        component: 'UTRadioGroup es un componente personalizable que renderiza un grupo de botones de radio, permitiendo a los usuarios seleccionar una sola opción de una lista proporcionada. Está disponible en dos versiones: V0 (basado en Material-UI con patrón de input similar a Redux Form) y V1 (versión moderna con características avanzadas como variantes card/button, categorización de opciones, y espaciado personalizable).'
-      }
-    }
-  },
-  title: 'Energy-UI/UTRadioGroup'
-};
-
-// Template for V1 stories
-const V1Template = args => {
-  const [{
-    value
-  }, updateArgs] = useArgs();
-  const handleChange = newValue => {
-    updateArgs({
-      value: newValue
-    });
-    if (args.onChange) args.onChange(newValue);
-  };
-  return /*#__PURE__*/React.createElement(UTRadioGroup, _extends({}, args, {
-    value: value,
-    onChange: handleChange
-  }));
-};
-
-// Template for V0 stories
-const V0Template = args => {
-  var _args$input;
-  const [{
-    value
-  }, updateArgs] = useArgs();
-  const handleChange = newValue => {
-    updateArgs({
-      value: newValue
-    });
-    if (args.onChange) args.onChange(newValue);
-  };
-  return /*#__PURE__*/React.createElement(UTRadioGroup, _extends({}, args, {
-    input: {
-      name: ((_args$input = args.input) === null || _args$input === void 0 ? void 0 : _args$input.name) || 'radio-group-v0',
-      value: value || '',
-      onChange: handleChange
-    }
-  }));
-};
-export const Playground = {
-  render: V1Template,
-  args: {
-    version: 'V1',
-    options: defaultOptions,
-    title: 'Selecciona una opción',
-    value: '',
-    horizontalSpacing: 'medium',
-    verticalSpacing: 'medium',
-    reversed: false,
-    required: false,
-    disabled: false,
-    variant: 'default'
-  },
-  name: 'Playground'
-};
-export const V1Categorized = {
-  render: V1Template,
-  args: {
-    version: 'V1',
-    options: [{
-      name: 'Opción 1',
-      value: '1'
-    }, {
-      name: 'Opción 2',
-      value: '2',
-      category: 'Grupo A'
-    }, {
-      name: 'Opción 3',
-      value: '3',
-      category: 'Grupo B',
-      disabled: true
-    }, {
-      name: 'Opción 4',
-      value: '4',
-      category: 'Grupo A'
-    }],
-    title: 'Opciones Categorizadas',
-    value: ''
-  },
-  name: 'V1 - Opciones Categorizadas'
-};
-export const V1CardVariant = {
-  render: V1Template,
-  args: {
-    version: 'V1',
-    options: defaultOptions,
-    title: 'Opciones de Estilo Card',
-    value: '',
-    variant: 'card'
-  },
-  name: 'V1 - Variante Card'
-};
-export const V1ButtonVariant = {
-  render: V1Template,
-  args: {
-    version: 'V1',
-    options: defaultOptions,
-    title: 'Opciones de Estilo Button',
-    value: '',
-    variant: 'button'
-  },
-  name: 'V1 - Variante Button'
-};
-
-// V0 Stories
-export const V0Basic = {
-  render: V0Template,
-  args: {
-    version: 'V0',
-    options: defaultOptions,
-    value: '',
-    labelKey: 'name',
-    valueKey: 'value',
-    disabled: false,
-    divider: false,
-    disableRipple: false,
-    input: {
-      name: 'radio-group-v0'
-    }
-  },
-  name: 'V0 - Básico'
-};
-export const V0WithField = {
-  render: V0Template,
-  args: {
-    version: 'V0',
-    options: defaultOptions,
-    value: '',
-    labelKey: 'name',
-    valueKey: 'value',
-    withUpperTitle: true,
-    field: {
-      title: 'Selecciona una opción',
-      required: true,
-      read_only: false
-    },
-    input: {
-      name: 'radio-group-v0-field'
-    }
-  },
-  name: 'V0 - Con Campo y Título Superior'
-};
-export const V0WithDividers = {
-  render: V0Template,
-  args: {
-    version: 'V0',
-    options: defaultOptions,
-    value: '',
-    labelKey: 'name',
-    valueKey: 'value',
-    divider: true,
-    input: {
-      name: 'radio-group-v0-dividers'
-    }
-  },
-  name: 'V0 - Con Divisores'
-};
-export const V0Disabled = {
-  render: V0Template,
-  args: {
-    version: 'V0',
-    options: defaultOptions,
-    value: '1',
-    labelKey: 'name',
-    valueKey: 'value',
-    disabled: true,
-    input: {
-      name: 'radio-group-v0-disabled'
-    }
-  },
-  name: 'V0 - Deshabilitado'
-};

package/dist/esm/components/UTRating/versions/V1/README.md

@@ -1,44 +0,0 @@
-# UTRating
-
-## Description
-
-`UTRating` is a configurable rating input component that enables users to easily provide feedback through visual indicators.
-
-## Props
-
-| Name                | Type      | Default | Description                                                                                               |
-| ------------------- | --------- | ------- | --------------------------------------------------------------------------------------------------------  |
-| classNames          | object    |         | Custom CSS class names for styling the component.                                                         |
-| dataTestId          | string    |         | Unique identifier for testing purposes.                                                                   |
-| disabled            | bool      | false   | Indicates whether the input is disabled and cannot be interacted with.                                    |
-| error               | string    |         | Error message to display when validation fails or an issue occurs.                                        |
-| helpTextEnd         | string    |         | Additional help text displayed at the end of the input for user guidance.                                 |
-| helpTextStart       | string    |         | Additional help text displayed at the beginning of the input for user guidance.                           |
-| onChange            | func      |         | Callback function invoked when the input value changes.                                                   |
-| options             | array     |         | Array of options available for selection.                                                                 |
-| required            | bool      | false   | Indicates whether the input is mandatory for form submission.                                             |
-| title               | string    |         | Title for the input, providing context to the user.                                                       |
-| validations         | array     |         | Array of validation rules to be applied to the input value.                                               |
-| value               | string    |         | The current value of the input.                                                                           |
-| variant             | string    | `star`  | Defines the visual style component.                                                                       |
-
-
-### options
-
-`options` is an array of objects with a `value` and a `name` key. The values should be in the range of 0-10, except for the `faces` variant. In desktop view, all options are displayed in one row; in responsive view, they are broken into 2 rows if there are more than 5 options.
-
-### variant
-
-The value of `variant` must be one of the following:
-
-- `faces`: the options are represented as face icons. Option values should exclusively be between 1 and 5, values outside this range are not supported.
-- `star`: the options are represented as star icons.
-- `text`: the options are represented as the option's `text`.
-
-### Structure of Validations
-
-For detailed information about the structure of validations, please refer to the UTValidation component documentation.
-
-### Handling Errors
-
-Errors can be displayed below the text input using either the `error` prop or the `validations` prop.

package/dist/esm/components/UTSearchField/README.md

@@ -1,36 +0,0 @@
-# UTSearchField
-
-## Description
-
-`UTSearchField` is a customizable search field component. It includes a search icon on the left and an optional clear button on the right when there is text in the input field.
-
-## Props
-
-| Name         | Type   | Default | Description                                                 |
-| ------------ | ------ | ------- | ----------------------------------------------------------- |
-| className    | string |         | CSS class to customize the root element of the input field. |
-| dataTestId   | string |         | Identifier used for testing purposes.                       |
-| dataKeyboard | string |         | Identifier used for keyboardSupport.                        |
-| disabled     | bool   |         | Disables the input field if set to true.                    |
-| id           | string |         | Unique identifier for the input field.                      |
-| onBlur       | func   |         | Function to call when the input field loses focus.          |
-| onChange     | func   |         | Function to call when the input field value changes.        |
-| onFocus      | func   |         | Function to call when the input field gains focus.          |
-| placeholder  | string |         | Placeholder text for the input field.                       |
-| size         | string |         | Size of the input field. One of: `small`, `large`.          |
-| type         | string |         | Type of input (e.g., 'numeric', 'password', 'text' ).       |
-| value        | string | null    | The value of the input field.                               |
-| variant      | string | gray    | Variant of the input field. One of: `white`, `gray`.        |
-
-### Adornments
-
-`UTSearchField` utilizes adornments on both sides of the input field:
-
-- **Left Adornment**: A search icon is always displayed on the left side of the input field.
-- **Right Adornment**: A clear (reset) button is displayed on the right side only when there is a value in the input field.
-
-## Additional Information
-
-- The clear button appears when the input field contains text and clears the input when clicked.
-- The search icon can change its style based on the focus state of the input field.
-- The component is built on top of `UTBaseInputField`, inheriting its flexible adornment handling.