@widergy/energy-ui 3.172.1 → 3.172.3

package/dist/components/UTSelect/UTSelectFixedBottomOption.stories.js

@@ -1,171 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.SeleccionMultiple = exports.ListaLarga = exports.ListaCorta = exports.ConCategorias = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = require("prop-types");
-var _2 = _interopRequireDefault(require("."));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-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); }
-const OPTIONS = [{
-  name: 'Electricidad',
-  value: 'electricity'
-}, {
-  name: 'Gas natural',
-  value: 'gas'
-}, {
-  name: 'Agua potable',
-  value: 'water'
-}, {
-  name: 'Energía solar',
-  value: 'solar'
-}, {
-  name: 'Biomasa',
-  value: 'biomass'
-}];
-const OPTIONS_WITH_CATEGORIES = [{
-  name: 'Residencial bajo',
-  value: 'res-low',
-  category: 'Residencial'
-}, {
-  name: 'Residencial medio',
-  value: 'res-mid',
-  category: 'Residencial'
-}, {
-  name: 'Residencial alto',
-  value: 'res-high',
-  category: 'Residencial'
-}, {
-  name: 'Comercial pequeño',
-  value: 'com-sm',
-  category: 'Comercial'
-}, {
-  name: 'Comercial grande',
-  value: 'com-lg',
-  category: 'Comercial'
-}, {
-  name: 'Industrial liviano',
-  value: 'ind-sm',
-  category: 'Industrial'
-}, {
-  name: 'Industrial pesado',
-  value: 'ind-lg',
-  category: 'Industrial'
-}];
-const LONG_OPTIONS = Array.from({
-  length: 20
-}, (_, i) => ({
-  name: "Opci\xF3n ".concat(i + 1),
-  value: "opt-".concat(i + 1)
-}));
-const wrapperStyle = {
-  maxWidth: '360px',
-  padding: '1rem'
-};
-const SelectWrapper = _ref => {
-  let {
-    multiple,
-    ...props
-  } = _ref;
-  const [value, setValue] = (0, _react.useState)(multiple ? [] : null);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: wrapperStyle
-  }, /*#__PURE__*/_react.default.createElement(_2.default, _extends({}, props, {
-    multiple: multiple,
-    onChange: setValue,
-    value: value,
-    version: "V1"
-  })));
-};
-SelectWrapper.propTypes = {
-  multiple: _propTypes.bool,
-  title: _propTypes.string
-};
-var _default = exports.default = {
-  component: _2.default,
-  title: 'Energy-UI/UTSelect/Con opción fija'
-};
-const ListaLarga = exports.ListaLarga = {
-  name: 'Lista larga',
-  args: {
-    fixedBottomOption: {
-      name: 'Otro motivo',
-      value: 'other'
-    },
-    options: LONG_OPTIONS,
-    placeholder: 'Seleccioná una opción',
-    title: 'Con opción fija al final (lista larga)'
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: 'La prop `fixedBottomOption` agrega una opción fija debajo del scroll, siempre visible independientemente del término de búsqueda. Útil para opciones como "Otro motivo".'
-      }
-    }
-  },
-  render: args => /*#__PURE__*/_react.default.createElement(SelectWrapper, args)
-};
-const ListaCorta = exports.ListaCorta = {
-  name: 'Lista corta',
-  args: {
-    fixedBottomOption: {
-      name: 'Otro motivo',
-      value: 'other'
-    },
-    options: OPTIONS,
-    placeholder: 'Seleccioná una opción',
-    title: 'Con opción fija al final (lista corta)'
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: 'La opción fija también se muestra cuando la lista es corta y no hay scroll. Si el usuario filtra y no hay coincidencias, la opción fija permanece visible.'
-      }
-    }
-  },
-  render: args => /*#__PURE__*/_react.default.createElement(SelectWrapper, args)
-};
-const ConCategorias = exports.ConCategorias = {
-  name: 'Con categorías',
-  args: {
-    fixedBottomOption: {
-      name: 'Otro motivo',
-      value: 'other'
-    },
-    options: OPTIONS_WITH_CATEGORIES,
-    placeholder: 'Seleccioná una opción',
-    title: 'Con categorías y opción fija'
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: 'La opción fija convive con opciones agrupadas por categoría. El divider y la opción fija siempre quedan por debajo de todos los grupos.'
-      }
-    }
-  },
-  render: args => /*#__PURE__*/_react.default.createElement(SelectWrapper, args)
-};
-const SeleccionMultiple = exports.SeleccionMultiple = {
-  name: 'Selección múltiple',
-  args: {
-    fixedBottomOption: {
-      name: 'Otro motivo',
-      value: 'other'
-    },
-    multiple: true,
-    options: OPTIONS,
-    placeholder: 'Seleccioná una o más opciones',
-    title: 'Selección múltiple con opción fija'
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: 'Con `multiple={true}` la opción fija se comporta como cualquier otra: se puede seleccionar y deseleccionar de forma independiente. El valor es un array que incluye `fixedBottomOption.value` cuando está marcada.'
-      }
-    }
-  },
-  render: args => /*#__PURE__*/_react.default.createElement(SelectWrapper, args)
-};

package/dist/components/UTSelect/versions/V1/README.md

@@ -1,317 +0,0 @@
-# UTSelect
-
-## Description
-
-`UTSelect` is a customizable dropdown select component, built on top of Material UI's `Autocomplete`. It allows users to select single or multiple options from a provided list with features like search, dynamic filtering, and adornments (prefixes, suffixes, icons, and badges).
-
-## Props
-
-| Name                  | Type                       | Default                                | Description                                                                                                                                  |
-| --------------------- | -------------------------- | -------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- |
-| action                | object                     |                                        | Action object containing `Icon`, `onClick`, and `size` for the action button.                                                                |
-| actions               | array                      |                                        | Array of action buttons to display in the title area.                                                                                        |
-| alwaysShowPlaceholder | bool                       | true                                   | Determines if the placeholder should always be shown, even when there is a value.                                                            |
-| autocompleteProps     | object                     | {}                                     | Additional props to pass to the underlying Material-UI Autocomplete component.                                                               |
-| className             | string                     |                                        | Additional CSS class name for the component container.                                                                                       |
-| clearable             | bool                       | true                                   | Determines whether a button to clear the current selection should be shown.                                                                  |
-| CustomRow             | elementType                |                                        | Custom React component to render each option row. Receives `{ item, isChecked }` as props, where `item` is the option object and `isChecked` indicates if the option is selected. |
-| dataTestId            | string                     |                                        | Test ID for the main input component.                                                                                                        |
-| disabled              | bool                       | false                                  | Disables the select input.                                                                                                                   |
-| disableFilterOptions  | bool                       | false                                  | Disables option filtering, showing all options even when typing in the search field.                                                         |
-| error                 | string                     |                                        | Error message to display below the input field.                                                                                              |
-| errorDataTestId       | string                     |                                        | Test ID for the error validation component.                                                                                                  |
-| fixedBottomOption     | object                     |                                        | Option rendered below the scrollable list, always visible regardless of the search term. Shape: `{ name: string, value: string \| number }`. |
-| freeWidth             | bool                       | false                                  | Allows the dropdown to have a free width instead of matching the input width.                                                                |
-| helpText              | string                     |                                        | Help text displayed below the input field.                                                                                                   |
-| icon                  | string                     |                                        | Icon name to display in the input field.                                                                                                     |
-| inputSize             | string                     |                                        | Size of the input field. One of: `small`, `large`.                                                                                           |
-| itemDataTestId        | string                     |                                        | Test ID for individual option items in the dropdown.                                                                                         |
-| listDataTestId        | string                     |                                        | Test ID for the dropdown list container.                                                                                                     |
-| listProps             | object                     | {}                                     | Additional props to pass to the dropdown list component.                                                                                     |
-| multiple              | bool                       | false                                  | Allows multiple selection if true.                                                                                                           |
-| noMatchesText         | string                     | 'No hay coincidencias con tu búsqueda' | Text to display when no matches are found in the search.                                                                                     |
-| noOptionsText         | string                     | 'No hay opciones disponibles'          | Text to display when there are no options available.                                                                                         |
-| onChange              | func                       | () => {}                               | Function to call when the selected value(s) change.                                                                                          |
-| onChangeSearchTerm    | func                       | () => {}                               | Function to call when the search term changes.                                                                                               |
-| options               | array                      | []                                     | Array of options to be displayed in the dropdown. Each option is an object with `name`, `value`, and optionally `category` and `subOptions`. |
-| placeholder           | string                     |                                        | Placeholder text for the select field.                                                                                                       |
-| prefix                | string                     |                                        | Text to display as a prefix inside the input field.                                                                                          |
-| readOnly              | bool                       | false                                  | Makes the select field read-only, preventing changes but allowing the dropdown to open.                                                      |
-| required              | bool                       | false                                  | Indicates if the select field is required.                                                                                                   |
-| suffix                | string                     |                                        | Text to display as a suffix inside the input field.                                                                                          |
-| title                 | string                     |                                        | Title for the select field, displayed above the input.                                                                                       |
-| titleVariant          | string                     | 'large'                                | Variant for the title display. Uses `TITLE_VARIANTS` constants.                                                                              |
-| value                 | oneOfType([string, array]) | null                                   | The value of the input field. It can be a string for single selection or an array for multiple selection.                                    |
-| variant               | string                     | 'select'                               | Determines the visual variant, either `select` or `picker`.                                                                                  |
-| withAutoReset         | bool                       | true                                   | Automatically resets the select value if the current selection is no longer available in the options.                                        |
-
-### Option Object
-
-The `options` prop is an array of objects, each representing an option:
-
-| Name       | Type           | Description                                          |
-| ---------- | -------------- | ---------------------------------------------------- |
-| name       | string         | Label to display for the option.                     |
-| value      | string, number | Value of the option.                                 |
-| category   | string         | Optional category for grouping options.              |
-| subOptions | array          | Optional nested options for hierarchical structures. |
-
-### Action Object
-
-The `action` prop accepts an object with the following properties:
-
-| Name    | Type   | Description                    |
-| ------- | ------ | ------------------------------ |
-| Icon    | string | Icon name to display.          |
-| onClick | func   | Function to call when clicked. |
-| size    | string | Size of the action button.     |
-
-## Features
-
-### `fixedBottomOption`
-
-`fixedBottomOption` adds a pinned option at the bottom of the dropdown list, rendered outside the scrollable area so it's always visible regardless of scroll position or active search term. Useful for "catch-all" options like "Other reason".
-
-```jsx
-<UTSelect
-  version="V1"
-  options={categorizedOptions}
-  fixedBottomOption={{ name: 'Otro motivo', value: 'other' }}
-  onChange={handleSelect}
-/>
-```
-
-- The fixed option is excluded from `filteredOptions` — if it's also present in `options`, it's automatically deduplicated by value.
-- When no options match the search term, `noMatchesText` is shown but the fixed option remains visible.
-- The option is visually separated from the list by a divider.
-- When selected, `onChange` receives the option's value (same behavior as any other option).
-
-### `withAutoReset`
-
-`withAutoReset` is a prop that controls the behavior of the `UTSelect` component when the selected value is no longer available in the current options. This prop ensures that the selected value resets to `null` if the chosen option is no longer valid. When an auto-reset occurs, the options are re-sorted to ensure the list is up-to-date with the current selections.
-
-### Option Sorting Behavior
-
-The `UTSelect` component sorts the options in a way that selected values are displayed at the top. For single selections, this sorting happens immediately after a selection is made. For multiple selections, the sorting occurs when the dropdown gains focus (opens) or loses focus (closes). This ensures that the selected options are prominently displayed when interacting with the dropdown, without disrupting the user's ongoing selection process.
-
-### `multiple` Selection Mode
-
-When using the `multiple` prop, the dropdown stays open after selecting an option, allowing users to select more items without the dropdown closing each time. The sorting behavior in this mode is controlled to ensure that reordering of options happens only when the dropdown gains or loses focus, preventing unwanted changes to the displayed options while the user is actively selecting items.
-
-### Category-based Organization
-
-Options can be organized into categories using the `category` property. When categories are present, options are automatically sorted by category, and selected options are moved to the top of their respective categories.
-
-### Search and Filtering
-
-The component provides built-in search functionality that filters options based on the `name` property. The `disableFilterOptions` prop can be used to disable this filtering behavior, showing all options regardless of the search term.
-
-## Adornments
-
-`UTSelect` allows for additional adornments, such as prefixes, suffixes, and custom action buttons. The `prefix` and `suffix` props can be used to display text or icons inside the input. You can also add a custom action button using the `action` prop.
-
-### Left Adornments
-
-- Error icon (automatically shown when there's an error)
-- Badge (shows count for multiple selections)
-- Prefix text
-- Custom icon (via `icon` prop)
-
-### Right Adornments
-
-- Suffix text
-- Clear button (when `clearable` is true and there's a value)
-- Dropdown chevron icon
-- Custom action button
-
-## Usage Examples
-
-### Basic Single Selection
-
-```jsx
-import React, { useState } from 'react';
-import UTSelect from './UTSelect';
-
-const options = [
-  { name: 'Option 1', value: '1' },
-  { name: 'Option 2', value: '2' },
-  { name: 'Option 3', value: '3' },
-  { name: 'Option 4', value: '4' }
-];
-
-const BasicExample = () => {
-  const [selectedOption, setSelectedOption] = useState(null);
-
-  return (
-    <div style={{ padding: 20 }}>
-      <UTSelect
-        title="Select an Option"
-        noMatchesText="No matches found"
-        onChange={setSelectedOption}
-        options={options}
-        placeholder="Choose an option"
-        clearable
-        value={selectedOption}
-        variant="select"
-      />
-      <p>Selected Option: {selectedOption}</p>
-    </div>
-  );
-};
-```
-
-### Multiple Selection with Categories
-
-```jsx
-import React, { useState } from 'react';
-import UTSelect from './UTSelect';
-
-const categorizedOptions = [
-  { name: 'Apple', value: 'apple', category: 'Fruits' },
-  { name: 'Banana', value: 'banana', category: 'Fruits' },
-  { name: 'Carrot', value: 'carrot', category: 'Vegetables' },
-  { name: 'Broccoli', value: 'broccoli', category: 'Vegetables' },
-  { name: 'Chicken', value: 'chicken', category: 'Proteins' },
-  { name: 'Fish', value: 'fish', category: 'Proteins' }
-];
-
-const MultipleSelectionExample = () => {
-  const [selectedItems, setSelectedItems] = useState([]);
-
-  return (
-    <div style={{ padding: 20 }}>
-      <UTSelect
-        title="Select Multiple Items"
-        multiple
-        onChange={setSelectedItems}
-        options={categorizedOptions}
-        placeholder="Choose multiple items"
-        value={selectedItems}
-        helpText="You can select multiple items from different categories"
-      />
-      <p>Selected Items: {selectedItems.join(', ')}</p>
-    </div>
-  );
-};
-```
-
-### With Custom Action and Adornments
-
-```jsx
-import React, { useState } from 'react';
-import UTSelect from './UTSelect';
-
-const AdvancedExample = () => {
-  const [selectedOption, setSelectedOption] = useState(null);
-
-  const customAction = {
-    Icon: 'IconPlus',
-    onClick: () => console.log('Custom action clicked'),
-    size: 'small'
-  };
-
-  return (
-    <div style={{ padding: 20 }}>
-      <UTSelect
-        title="Advanced Select"
-        onChange={setSelectedOption}
-        options={options}
-        placeholder="Choose an option"
-        prefix="$"
-        suffix="USD"
-        action={customAction}
-        error="This field is required"
-        helpText="This is a required field with custom adornments"
-        required
-        variant="picker"
-      />
-    </div>
-  );
-};
-```
-
-### Read-only Mode
-
-```jsx
-import React from 'react';
-import UTSelect from './UTSelect';
-
-const ReadOnlyExample = () => {
-  return (
-    <div style={{ padding: 20 }}>
-      <UTSelect
-        title="Read-only Select"
-        options={options}
-        value="1"
-        readOnly
-        helpText="This field cannot be modified"
-      />
-    </div>
-  );
-};
-```
-
-### With Custom Row Renderer
-
-```jsx
-import React, { useState } from 'react';
-import UTSelect from './UTSelect';
-
-const options = [
-  { name: 'Alice', value: '1', subtitle: 'Admin' },
-  { name: 'Bob', value: '2', subtitle: 'Editor' },
-  { name: 'Carol', value: '3', subtitle: 'Viewer' }
-];
-
-const MyCustomRow = ({ item, isChecked }) => (
-  <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
-    <span style={{ fontWeight: isChecked ? 'bold' : 'normal' }}>{item.name}</span>
-    <span style={{ color: 'gray', fontSize: 12 }}>{item.subtitle}</span>
-  </div>
-);
-
-const CustomRowExample = () => {
-  const [value, setValue] = useState(null);
-
-  return (
-    <UTSelect
-      CustomRow={MyCustomRow}
-      onChange={setValue}
-      options={options}
-      placeholder="Select a user"
-      value={value}
-    />
-  );
-};
-```
-
-### With Search Term Handling
-
-```jsx
-import React, { useState } from 'react';
-import UTSelect from './UTSelect';
-
-const SearchExample = () => {
-  const [selectedOption, setSelectedOption] = useState(null);
-  const [searchTerm, setSearchTerm] = useState('');
-
-  const handleSearchChange = term => {
-    setSearchTerm(term);
-    console.log('Search term changed:', term);
-  };
-
-  return (
-    <div style={{ padding: 20 }}>
-      <UTSelect
-        title="Searchable Select"
-        onChange={setSelectedOption}
-        onChangeSearchTerm={handleSearchChange}
-        options={options}
-        placeholder="Search and select..."
-        value={selectedOption}
-      />
-      <p>Current search term: {searchTerm}</p>
-    </div>
-  );
-};
-```

package/dist/components/UTSelectableCard/README.md

@@ -1,23 +0,0 @@
-# UTSelectableCard
-
-### Description
-Selectable card component.
-
-### Props
-
-| Name            | Type                                     | Default   |Description                                                           |
-|-----------------|------------------------------------------|-----------|----------------------------------------------------------------------|
-| aditionalInfo   | object: { title: '', description: ''}    |           | Aditional information to show in the card                            |
-| appareance      | string: 'white' \| 'gray' \|             | white     | The card appareance.                                                 |
-| checkIcon       | bool                                     | true      | Indicates if on "active" status shows a check icon                   |
-| classes         | string                                   |           | Classes returned by UTLabel's own [theme](./theme.js#)retrieveStyle. |
-| className       | string                                   |           | Additional classes.                                                  |
-| description     | string                                   |           | Card description                                                     |
-| disabled        | bool                                     | false     | Indicates if the card is disabled                                    |
-| Icon            | node                                     |           | An Icon component that can be displayed.                             |
-| OnClick         | func                                     |           | Function to be executed when clicking the card                       |
-| selected        | bool                                     | false     | Indicates if the current card has "Active" status                    |
-| size            | string: 'medium' \| 'small' \|           | medium    | Card size                                                            |
-| titleText       | string                                   |           | Title to show in the card                                            |
-| tooltip         | string                                   |           | Help icon tooltip as text                                            |
-