@royaltics/ui 1.6.13 → 1.6.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,15 @@
1
+ import React from "react";
2
+ import { ComponentInputBase } from "../types/global.js";
3
+ export interface SelectMultipleProps extends ComponentInputBase {
4
+ data: any[];
5
+ keyText?: string | string[];
6
+ keyValue?: string;
7
+ KeyFindItem?: string;
8
+ onKeyDown?: (e: any) => void;
9
+ state: [any] | [any, React.Dispatch<any>];
10
+ placeholder?: string;
11
+ searchable?: boolean;
12
+ }
13
+ declare const _default: React.MemoExoticComponent<({ id, lb, state, onKeyDown, data, referer, keyText, keyValue, required, readOnly, className, KeyFindItem, size, variant, placeholder, searchable }: SelectMultipleProps) => JSX.Element>;
14
+ export default _default;
15
+ //# sourceMappingURL=SelectMultiple.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SelectMultiple.d.ts","sourceRoot":"","sources":["../../src/forms/SelectMultiple.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAIxD,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC3D,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC7B,KAAK,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IAC1C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;uMAmCE,mBAAmB,KAAG,GAAG,CAAC,OAAO;AA2OpC,wBAAoC"}
@@ -0,0 +1,121 @@
1
+ import React, { memo, useEffect, useState, useRef } from "react";
2
+ import { cn, cvaMix } from "../utils/index.js";
3
+ import { Variants } from "../constants/Variants.js";
4
+ const classNamesProps = cvaMix("flex flex-col items-stretch justify-start", {
5
+ size: Variants.size,
6
+ variant: {
7
+ fill: 'bg-input-options text-input-foreground',
8
+ outline: 'text-input-foreground'
9
+ }
10
+ }, {
11
+ size: 'xs',
12
+ width: 'full',
13
+ variant: 'fill'
14
+ });
15
+ const SelectMultiple = ({ id, lb, state, onKeyDown, data, referer, keyText = 'names', keyValue = 'id', required = false, readOnly, className, KeyFindItem, size = 'xs', variant = 'outline', placeholder = 'Seleccione opciones...', searchable = true }) => {
16
+ const [inputs, setInputs] = state;
17
+ const [isOpen, setIsOpen] = useState(false);
18
+ const [searchTerm, setSearchTerm] = useState('');
19
+ const dropdownRef = useRef(null);
20
+ const isObject = (item) => typeof item === 'object';
21
+ // Close dropdown when clicking outside
22
+ useEffect(() => {
23
+ const handleClickOutside = (event) => {
24
+ if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
25
+ setIsOpen(false);
26
+ setSearchTerm('');
27
+ }
28
+ };
29
+ document.addEventListener('mousedown', handleClickOutside);
30
+ return () => document.removeEventListener('mousedown', handleClickOutside);
31
+ }, []);
32
+ const selectedValues = inputs?.[id] !== undefined && Array.isArray(inputs[id]) ? inputs[id] : [];
33
+ const toggleOption = (value) => {
34
+ if (readOnly)
35
+ return;
36
+ const newValues = selectedValues.includes(value)
37
+ ? selectedValues.filter((v) => v !== value)
38
+ : [...selectedValues, value];
39
+ if (KeyFindItem) {
40
+ const findItems = newValues.map(val => data.find((item) => item === val || item[keyValue] === val));
41
+ setInputs?.({ [id]: newValues, [KeyFindItem]: findItems });
42
+ }
43
+ else {
44
+ setInputs?.({ [id]: newValues });
45
+ }
46
+ };
47
+ const removeOption = (value) => {
48
+ if (readOnly)
49
+ return;
50
+ const newValues = selectedValues.filter((v) => v !== value);
51
+ if (KeyFindItem) {
52
+ const findItems = newValues.map(val => data.find((item) => item === val || item[keyValue] === val));
53
+ setInputs?.({ [id]: newValues, [KeyFindItem]: findItems });
54
+ }
55
+ else {
56
+ setInputs?.({ [id]: newValues });
57
+ }
58
+ };
59
+ const getItemText = (item) => {
60
+ if (!isObject(item))
61
+ return item;
62
+ return Array.isArray(keyText)
63
+ ? `${item[keyText[0]]} - ${item[keyText[1]]}`
64
+ : item[keyText];
65
+ };
66
+ const getItemValue = (item) => {
67
+ return isObject(item) ? item[keyValue] : item;
68
+ };
69
+ const filteredData = searchable && searchTerm
70
+ ? data.filter(item => {
71
+ const text = getItemText(item).toString().toLowerCase();
72
+ return text.includes(searchTerm.toLowerCase());
73
+ })
74
+ : data;
75
+ useEffect(() => {
76
+ if (!data || data.length == 0 || !id)
77
+ return;
78
+ if (inputs[id] == undefined || !Array.isArray(inputs[id])) {
79
+ setInputs?.({ [id]: [] });
80
+ }
81
+ else {
82
+ const validValues = inputs[id].filter((value) => data.find((item) => item == value || item[keyValue] == value));
83
+ if (validValues.length !== inputs[id].length) {
84
+ setInputs?.({ [id]: validValues });
85
+ }
86
+ }
87
+ }, [data]);
88
+ return (React.createElement("div", { className: cn("flex flex-col items-stretch justify-start relative", className), ref: dropdownRef },
89
+ lb && React.createElement("label", { htmlFor: id, className: cn(`font-medium text-input-label mb-1`) },
90
+ lb,
91
+ ":"),
92
+ React.createElement("select", { ref: referer, required: required, disabled: readOnly, name: id, value: selectedValues, onChange: () => { }, multiple: true, className: "hidden", tabIndex: -1 }, data && data.map((item, index) => (React.createElement("option", { key: index, value: getItemValue(item) }, getItemText(item))))),
93
+ React.createElement("div", { onClick: () => !readOnly && setIsOpen(!isOpen), onKeyDown: onKeyDown, className: cn('relative cursor-pointer rounded-md w-full border-1 border-input-border outline-none transition-all min-h-[38px]', classNamesProps({ variant, size }), readOnly && 'opacity-60 cursor-not-allowed', isOpen && 'ring-2 ring-blue-500/50') },
94
+ React.createElement("div", { className: "flex flex-wrap gap-1.5 items-center" }, selectedValues.length === 0 ? (React.createElement("span", { className: "text-gray-400 text-sm" }, placeholder)) : (selectedValues.map((value) => {
95
+ const item = data.find(d => getItemValue(d) === value);
96
+ return (React.createElement("span", { key: value, className: cn("inline-flex items-center gap-1 px-2 py-0.5 rounded text-xs font-medium", "bg-blue-500/20 text-blue-300 border border-blue-500/30") },
97
+ item ? getItemText(item) : value,
98
+ !readOnly && (React.createElement("button", { type: "button", onClick: (e) => {
99
+ e.stopPropagation();
100
+ removeOption(value);
101
+ }, className: "hover:text-red-400 transition-colors ml-0.5" }, "\u2715"))));
102
+ }))),
103
+ React.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none" },
104
+ React.createElement("svg", { className: cn("w-4 h-4 transition-transform", isOpen && "rotate-180"), fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
105
+ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })))),
106
+ isOpen && !readOnly && (React.createElement("div", { className: cn("absolute z-50 w-full mt-1 rounded-md border border-input-border shadow-lg overflow-hidden", variant === 'fill' ? 'bg-input-options' : 'bg-black/90 backdrop-blur-sm', "top-full") },
107
+ searchable && (React.createElement("div", { className: "p-2 border-b border-input-border" },
108
+ React.createElement("input", { type: "text", placeholder: "Buscar...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: cn("w-full px-2 py-1.5 text-sm rounded border border-input-border outline-none", "bg-transparent focus:ring-2 focus:ring-blue-500/50"), onClick: (e) => e.stopPropagation() }))),
109
+ React.createElement("div", { className: "max-h-60 overflow-y-auto" }, filteredData.length === 0 ? (React.createElement("div", { className: "px-3 py-2 text-sm text-gray-400" }, "No se encontraron opciones")) : (filteredData.map((item, index) => {
110
+ const value = getItemValue(item);
111
+ const isSelected = selectedValues.includes(value);
112
+ return (React.createElement("div", { key: index, onClick: () => toggleOption(value), className: cn("px-3 py-2 cursor-pointer transition-colors flex items-center gap-2", "hover:bg-blue-500/20", isSelected && "bg-blue-500/10") },
113
+ React.createElement("div", { className: cn("w-4 h-4 rounded border-2 flex items-center justify-center flex-shrink-0", isSelected
114
+ ? "bg-blue-500 border-blue-500"
115
+ : "border-gray-400") }, isSelected && (React.createElement("svg", { className: "w-3 h-3 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" },
116
+ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" })))),
117
+ React.createElement("span", { className: "text-sm" }, getItemText(item))));
118
+ })))))));
119
+ };
120
+ export default memo(SelectMultiple);
121
+ //# sourceMappingURL=SelectMultiple.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SelectMultiple.js","sourceRoot":"","sources":["../../src/forms/SelectMultiple.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,18 @@
1
+ import type { StoryObj } from '@storybook/react-vite';
2
+ import { SelectMultipleProps } from './SelectMultiple.js';
3
+ import React from 'react';
4
+ declare const meta: {
5
+ title: string;
6
+ component: React.MemoExoticComponent<({ id, lb, state, onKeyDown, data, referer, keyText, keyValue, required, readOnly, className, KeyFindItem, size, variant, placeholder, searchable }: SelectMultipleProps) => JSX.Element>;
7
+ parameters: {
8
+ layout: string;
9
+ };
10
+ tags: string[];
11
+ argTypes: {
12
+ [x: string]: any;
13
+ };
14
+ };
15
+ export default meta;
16
+ export declare const SelectMultipleBasic: StoryObj<typeof meta>;
17
+ export declare const SelectMultipleWithPreselection: StoryObj<typeof meta>;
18
+ //# sourceMappingURL=SelectMultiple.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SelectMultiple.stories.d.ts","sourceRoot":"","sources":["../../src/forms/SelectMultiple.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAuB,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1E,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,QAAA,MAAM,IAAI;;;;;;;;;;CAW2B,CAAC;AAEtC,eAAe,IAAI,CAAC;AAIpB,eAAO,MAAM,mBAAmB,EAAE,QAAQ,CAAC,OAAO,IAAI,CAsCrD,CAAC;AAGF,eAAO,MAAM,8BAA8B,EAAE,QAAQ,CAAC,OAAO,IAAI,CAoChE,CAAC"}
@@ -0,0 +1,63 @@
1
+ import SelectMultiple from './SelectMultiple.js';
2
+ import { ArgumentsInputs } from '../types/StoriesArguments.js';
3
+ import React from 'react';
4
+ // Configuración general para el componente en Storybook
5
+ const meta = {
6
+ title: 'UI/Forms/SelectMultiple',
7
+ component: SelectMultiple,
8
+ parameters: {
9
+ layout: 'centered',
10
+ },
11
+ tags: ['autodocs'],
12
+ argTypes: {
13
+ ...ArgumentsInputs,
14
+ }
15
+ };
16
+ export default meta;
17
+ // Historias individuales
18
+ export const SelectMultipleBasic = {
19
+ render: (args) => {
20
+ const [inputs, setInputs] = React.useState({ selectedItems: [] });
21
+ return (React.createElement("div", { className: 'flex flex-col gap-3 text-white' },
22
+ React.createElement(SelectMultiple, { data: args.data, id: "selectedItems", lb: args.lb, state: [inputs, setInputs], variant: args.variant, size: args.size, readOnly: args.readOnly }),
23
+ React.createElement("div", { className: 'mt-4 p-4 bg-gray-800 rounded-md' },
24
+ React.createElement("p", { className: 'text-sm font-semibold mb-2' }, "Selected Values:"),
25
+ React.createElement("pre", { className: 'text-xs' }, JSON.stringify(inputs.selectedItems, null, 2)))));
26
+ },
27
+ args: {
28
+ id: 'selectedItems',
29
+ lb: 'Selección Múltiple',
30
+ state: [{ selectedItems: [] }],
31
+ readOnly: false,
32
+ data: [
33
+ { id: 1, names: "Opción 1" },
34
+ { id: 2, names: "Opción 2" },
35
+ { id: 3, names: "Opción 3" },
36
+ { id: 4, names: "Opción 4" },
37
+ { id: 5, names: "Opción 5" }
38
+ ]
39
+ },
40
+ };
41
+ export const SelectMultipleWithPreselection = {
42
+ render: (args) => {
43
+ const [inputs, setInputs] = React.useState({ selectedItems: ['2', '4'] });
44
+ return (React.createElement("div", { className: 'flex flex-col gap-3 text-white' },
45
+ React.createElement(SelectMultiple, { data: args.data, id: "selectedItems", lb: args.lb, state: [inputs, setInputs], variant: args.variant, size: args.size }),
46
+ React.createElement("div", { className: 'mt-4 p-4 bg-gray-800 rounded-md' },
47
+ React.createElement("p", { className: 'text-sm font-semibold mb-2' }, "Selected Values:"),
48
+ React.createElement("pre", { className: 'text-xs' }, JSON.stringify(inputs.selectedItems, null, 2)))));
49
+ },
50
+ args: {
51
+ id: 'selectedItems',
52
+ lb: 'Con Preselección',
53
+ state: [{ selectedItems: ['2', '4'] }],
54
+ data: [
55
+ { id: 1, names: "Opción 1" },
56
+ { id: 2, names: "Opción 2" },
57
+ { id: 3, names: "Opción 3" },
58
+ { id: 4, names: "Opción 4" },
59
+ { id: 5, names: "Opción 5" }
60
+ ]
61
+ },
62
+ };
63
+ //# sourceMappingURL=SelectMultiple.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SelectMultiple.stories.js","sourceRoot":"","sources":["../../src/forms/SelectMultiple.stories.tsx"],"names":[],"mappings":"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"}
@@ -4,6 +4,7 @@ export { default as TextArea } from "./TextArea.js";
4
4
  export { default as Checkbox } from "./Checkbox.js";
5
5
  export { default as RadioButton } from "./RadioButton.js";
6
6
  export { default as Select } from "./Select.js";
7
+ export { default as SelectMultiple } from "./SelectMultiple.js";
7
8
  /**Buttons */
8
9
  export { default as Button } from "./Button.js";
9
10
  export { default as LinkButtonSmall } from "./LinkButton.js";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAEhD,aAAa;AACb,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5D,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAChE,aAAa;AACb,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5D,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC"}
@@ -4,6 +4,7 @@ export { default as TextArea } from "./TextArea.js";
4
4
  export { default as Checkbox } from "./Checkbox.js";
5
5
  export { default as RadioButton } from "./RadioButton.js";
6
6
  export { default as Select } from "./Select.js";
7
+ export { default as SelectMultiple } from "./SelectMultiple.js";
7
8
  /**Buttons */
8
9
  export { default as Button } from "./Button.js";
9
10
  export { default as LinkButtonSmall } from "./LinkButton.js";
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAEhD,aAAa;AACb,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAChE,aAAa;AACb,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@royaltics/ui",
3
- "version": "1.6.13",
3
+ "version": "1.6.15",
4
4
  "private": false,
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",