@tecsinapse/cortex-react 1.4.0 → 1.4.2

package/dist/cjs/components/Select/Content.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var clsx = require('clsx');
 var React = require('react');
 require('@internationalized/date');
 require('react-aria');
@@ -9,14 +10,14 @@ require('currency.js');
 var useOutsideClickListener = require('../../hooks/useOutsideClickListener.js');
 var Context = require('../Popover/Context.js');
 
-const Content = ({ children }) => {
+const Content = ({ children, className }) => {
   const { setIsOpen } = Context.usePopoverContext();
   const ref = React.useRef(null);
   useOutsideClickListener.useOutsideClickListener({
     ref,
     onClickOutside: () => setIsOpen(false)
   });
-  return /* @__PURE__ */ React.createElement("div", { className: "w-full relative", ref }, children);
+  return /* @__PURE__ */ React.createElement("div", { className: clsx("w-full relative", className), ref }, children);
 };
 
 exports.Content = Content;

package/dist/cjs/components/Select/Root.js

@@ -9,9 +9,10 @@ const SelectRoot = ({
   children,
   value,
   keyExtractor,
-  labelExtractor
+  labelExtractor,
+  className
 }) => {
-  return /* @__PURE__ */ React.createElement(index.Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React.createElement(context.SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React.createElement(Content.Content, null, children)));
+  return /* @__PURE__ */ React.createElement(index.Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React.createElement(context.SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React.createElement(Content.Content, { className }, children)));
 };
 
 exports.SelectRoot = SelectRoot;

package/dist/cjs/components/Select/Trigger.js

@@ -10,13 +10,15 @@ const { button } = cortexCore.selectVariants();
 const SelectTrigger = ({
   label,
   placeholder,
-  disabled
+  disabled,
+  multiLabelSelected
 }) => {
   const { value, labelExtractor } = React.useContext(context.SelectContext);
   const _placeholder = React.useMemo(() => {
     if (value?.length === 0 || !value) return placeholder ?? label;
     if (value?.length === 1) return labelExtractor(value[0]);
-    if (value?.length > 1) return `${value.length} items selected`;
+    if (value?.length > 1)
+      return multiLabelSelected ? multiLabelSelected(value.length) : `${value.length} items selected`;
     return labelExtractor(value);
   }, [label, value]);
   return /* @__PURE__ */ React.createElement(index.Popover.Trigger, null, /* @__PURE__ */ React.createElement(

package/dist/esm/components/Select/Content.js

@@ -1,3 +1,4 @@
+import clsx from 'clsx';
 import React__default, { useRef } from 'react';
 import '@internationalized/date';
 import 'react-aria';
@@ -7,14 +8,14 @@ import 'currency.js';
 import { useOutsideClickListener } from '../../hooks/useOutsideClickListener.js';
 import { usePopoverContext } from '../Popover/Context.js';
 
-const Content = ({ children }) => {
+const Content = ({ children, className }) => {
   const { setIsOpen } = usePopoverContext();
   const ref = useRef(null);
   useOutsideClickListener({
     ref,
     onClickOutside: () => setIsOpen(false)
   });
-  return /* @__PURE__ */ React__default.createElement("div", { className: "w-full relative", ref }, children);
+  return /* @__PURE__ */ React__default.createElement("div", { className: clsx("w-full relative", className), ref }, children);
 };
 
 export { Content };

package/dist/esm/components/Select/Root.js

@@ -7,9 +7,10 @@ const SelectRoot = ({
   children,
   value,
   keyExtractor,
-  labelExtractor
+  labelExtractor,
+  className
 }) => {
-  return /* @__PURE__ */ React__default.createElement(Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React__default.createElement(SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React__default.createElement(Content, null, children)));
+  return /* @__PURE__ */ React__default.createElement(Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React__default.createElement(SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React__default.createElement(Content, { className }, children)));
 };
 
 export { SelectRoot };

package/dist/esm/components/Select/Trigger.js

@@ -8,13 +8,15 @@ const { button } = selectVariants();
 const SelectTrigger = ({
   label,
   placeholder,
-  disabled
+  disabled,
+  multiLabelSelected
 }) => {
   const { value, labelExtractor } = useContext(SelectContext);
   const _placeholder = useMemo(() => {
     if (value?.length === 0 || !value) return placeholder ?? label;
     if (value?.length === 1) return labelExtractor(value[0]);
-    if (value?.length > 1) return `${value.length} items selected`;
+    if (value?.length > 1)
+      return multiLabelSelected ? multiLabelSelected(value.length) : `${value.length} items selected`;
     return labelExtractor(value);
   }, [label, value]);
   return /* @__PURE__ */ React__default.createElement(Popover.Trigger, null, /* @__PURE__ */ React__default.createElement(

package/dist/types/components/Select/Content.d.ts

@@ -1,2 +1,2 @@
 import { ContentProps } from './types';
-export declare const Content: ({ children }: ContentProps) => JSX.Element;
+export declare const Content: ({ children, className }: ContentProps) => JSX.Element;

package/dist/types/components/Select/Root.d.ts

@@ -1,2 +1,2 @@
 import { SelectRootProps } from './types';
-export declare const SelectRoot: <T>({ children, value, keyExtractor, labelExtractor, }: SelectRootProps<T>) => JSX.Element;
+export declare const SelectRoot: <T>({ children, value, keyExtractor, labelExtractor, className, }: SelectRootProps<T>) => JSX.Element;

package/dist/types/components/Select/Trigger.d.ts

@@ -1,2 +1,2 @@
 import { SelectTriggerProps } from './types';
-export declare const SelectTrigger: ({ label, placeholder, disabled, }: SelectTriggerProps) => JSX.Element;
+export declare const SelectTrigger: ({ label, placeholder, disabled, multiLabelSelected, }: SelectTriggerProps) => JSX.Element;

package/dist/types/components/Select/index.d.ts

@@ -1,6 +1,6 @@
 export declare const Select: {
-    Root: <T>({ children, value, keyExtractor, labelExtractor, }: import("./types").SelectRootProps<T>) => JSX.Element;
-    Trigger: ({ label, placeholder, disabled, }: import("./types").SelectTriggerProps) => JSX.Element;
+    Root: <T>({ children, value, keyExtractor, labelExtractor, className, }: import("./types").SelectRootProps<T>) => JSX.Element;
+    Trigger: ({ label, placeholder, disabled, multiLabelSelected, }: import("./types").SelectTriggerProps) => JSX.Element;
     Popover: ({ children }: import("./types").SelectPopoverProps) => JSX.Element;
     Options: <T_1>({ onSelect, options, }: import("./types").SelectOptionsProps<T_1>) => JSX.Element;
     GroupedOptions: <T_2>({ onSelect, groupedLabelExtractor, options, }: import("./types").SelectGroupedOptionsProps<T_2>) => JSX.Element;

package/dist/types/components/Select/types.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
 export interface ContentProps {
     children: ReactNode;
+    className?: string;
 }
 export interface SelectGroupedOptionsProps<T> {
     onSelect: (value: T) => void;
@@ -43,9 +44,11 @@ export interface SelectRootProps<T> {
     value?: T | T[];
     keyExtractor: (value: T) => string;
     labelExtractor: (value: T) => string;
+    className?: string;
 }
 export interface SelectTriggerProps {
     label: string;
     placeholder?: string;
     disabled?: boolean;
+    multiLabelSelected?: (n: number) => string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -43,5 +43,5 @@
     "react-dom": ">=18.0.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "3ad0df3b05c88748ba583a580f031cb09bea14f0"
+  "gitHead": "7bee713285e66349b7ffaf13928d08b0487654a9"
 }