@loja-integrada/admin-components 1.3.0 → 1.3.2

package/dist/{chunk-UIXQQMI7.js → chunk-7BT5L3CO.js}

@@ -5,6 +5,6 @@ import { cva } from 'class-variance-authority';
 import x, { useMemo, useRef, useEffect } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var i=24,O=cva("relative appearance-none overflow-hidden rounded border border-card-stroke bg-base-1 px-4 py-3 shadow-none outline-none transition-colors focus-within:border-inverted-1 focus:border-inverted-1",{variants:{hasErrorState:{true:"border-danger focus:border-danger [&~.adornment]:border-danger [&~.adornment]:focus:border-danger"},disabled:{true:"pointer-events-none bg-base-3 text-on-base-2"},readOnly:{true:"bg-base-2"}},defaultVariants:{hasErrorState:!1,disabled:!1,readOnly:!1}}),k=({className:g="",formGroupClassName:T="",label:v,labelComplement:H,helpText:w,hasError:y=!1,errorMessage:l,required:d=!1,id:E,name:p,disabled:c,readOnly:f,minLines:n=2,maxLines:I=5,...A},L)=>{let N=useMemo(()=>Math.random().toString(36).substring(7),[]),m=E||p||N,a$3=y||!!l,R=jsx(a,{label:v,labelComplement:H,required:d,hasError:a$3,htmlFor:m,className:"mb-1"}),P=jsx(a$1,{helpText:l||w,hasError:a$3,className:"mt-2"}),r=useRef(null),M=()=>{let e=r.current;if(e){let t=I*i,u=n*i;e.scrollHeight>t?(e.style.height="auto",e.style.height=`${t}px`):e.scrollHeight<u?(e.style.height="auto",e.style.height=`${u}px`):(e.style.height="auto",e.style.height=`${e.scrollHeight}px`);}};return useEffect(()=>{let e=r.current;if(e){let t=n*i;e.style.height=`${t}px`;}},[r,n]),jsxs("div",{className:a$2("form-group flex flex-col ",T),ref:L,children:[R,jsx("div",{className:a$2("relative appearance-none overflow-hidden rounded border border-card-stroke bg-base-1 px-4 py-3 shadow-none outline-none transition-colors focus-within:border-inverted-1 focus:border-inverted-1",O({hasErrorState:a$3,disabled:c,readOnly:f,className:g})),children:jsx("textarea",{ref:r,onInput:M,className:"peer text-f6 flex w-full min-w-0 resize-none bg-transparent text-on-base shadow-none outline-none transition-colors focus-within:border-inverted-1 focus:border-inverted-1",id:m,name:p,required:d,disabled:c,readOnly:f,...A})}),P]})},G=x.forwardRef(k),V=x.memo(G);V.displayName="TextArea";
+var i=24,O=cva("relative appearance-none overflow-hidden rounded border border-card-stroke bg-base-1 px-4 py-3 shadow-none outline-none transition-colors focus-within:border-inverted-1 focus:border-inverted-1",{variants:{hasErrorState:{true:"border-danger focus:border-danger [&~.adornment]:border-danger [&~.adornment]:focus:border-danger"},disabled:{true:"pointer-events-none bg-base-3 text-on-base-2"},readOnly:{true:"bg-base-2"}},defaultVariants:{hasErrorState:!1,disabled:!1,readOnly:!1}}),k=({className:g="",formGroupClassName:T="",label:v,labelComplement:H,helpText:w,hasError:y=!1,errorMessage:l,required:d=!1,id:E,name:p,disabled:c,readOnly:f,minLines:n=2,maxLines:I=5,...A},L)=>{let N=useMemo(()=>Math.random().toString(36).substring(7),[]),m=E||p||N,a$3=y||!!l,R=jsx(a,{label:v,labelComplement:H,required:d,hasError:a$3,htmlFor:m,className:"mb-1"}),P=jsx(a$1,{helpText:l||w,hasError:a$3,className:"mt-2"}),r=useRef(null),M=()=>{let e=r.current;if(e){let t=I*i,u=n*i;e.scrollHeight>t?(e.style.height="auto",e.style.height=`${t}px`):e.scrollHeight<=u?(e.style.height="auto",e.style.height=`${u}px`):(e.style.height="auto",e.style.height=`${e.scrollHeight}px`);}};return useEffect(()=>{let e=r.current;if(e){let t=n*i;e.style.height=`${t}px`;}},[r,n]),jsxs("div",{className:a$2("form-group flex flex-col ",T),ref:L,children:[R,jsx("div",{className:a$2("relative appearance-none overflow-hidden rounded border border-card-stroke bg-base-1 px-4 py-3 shadow-none outline-none transition-colors focus-within:border-inverted-1 focus:border-inverted-1",O({hasErrorState:a$3,disabled:c,readOnly:f,className:g})),children:jsx("textarea",{ref:r,onInput:M,className:"peer text-f6 flex w-full min-w-0 resize-none bg-transparent text-on-base shadow-none outline-none transition-colors focus-within:border-inverted-1 focus:border-inverted-1",id:m,name:p,required:d,disabled:c,readOnly:f,...A})}),P]})},G=x.forwardRef(k),V=x.memo(G);V.displayName="TextArea";
 
 export { V as a };

package/dist/chunk-JZAHJSYD.js

@@ -0,0 +1,13 @@
+import { a as a$1 } from './chunk-7Z3CCBLX.js';
+import { a as a$4 } from './chunk-DIENJUYM.js';
+import { a as a$2 } from './chunk-G3GCVCTU.js';
+import { a as a$3 } from './chunk-KEDPPRQK.js';
+import { a } from './chunk-REQIQLRI.js';
+import { cva } from 'class-variance-authority';
+import O, { useMemo } from 'react';
+import j, { components } from 'react-select';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var $=cva("flex w-full cursor-pointer items-center border bg-base-1 transition-colors",{variants:{size:{small:"text-f7 h-10",default:"text-f6 h-12",large:"text-f5 h-14",xlarge:"text-f4 h-24"},variant:{default:"rounded border-card-stroke font-normal text-on-base",secondary:"rounded-md border-inverted-2 font-semibold shadow-inner hover:bg-base-3 focus:bg-base-1 focus:ring-2 focus:ring-focus focus:ring-offset-2"},disabled:{true:"pointer-events-none bg-base-3 text-on-base-2"},readOnly:{true:"pointer-events-none bg-base-2"},hasErrorState:{true:"border-danger focus:border-danger"}},defaultVariants:{variant:"default",size:"default",hasErrorState:!1,disabled:!1,readOnly:!1}}),{Option:J,DropdownIndicator:A}=components,K=r=>{let{selectProps:s}=r,t=`transform transition duration-200 ${s.menuIsOpen?"rotate-180":"rotate-0"} text-inverted-2`;return jsx(A,{...r,className:"mr-2",children:jsx(a$3,{icon:"sortDown",size:5,className:t})})},Q=r=>{let{data:s,removeProps:t}=r;return jsxs("div",{...r,className:"selected-option mr-2 flex items-center gap-x-1.5 rounded-sm bg-primary-light px-2 text-inverted-1",children:[jsx("span",{className:"text-f7 truncate font-semibold",children:s.label}),jsx("div",{onClick:t.onClick,...t,className:"cursor-pointer",children:jsx(a$3,{icon:"close",size:3})})]})},U=r=>{let{isSelected:s,isDisabled:t,isFocused:a$1,data:n,isMulti:i}=r,c=useMemo(()=>n.element?n.element:jsx(Fragment,{children:i?jsx(a$4,{label:n.label,checked:s}):jsxs(Fragment,{children:[n.icon?jsx(a$3,{icon:n.icon,className:"mr-2"}):null,n.label]})}),[n,s,i]);return jsx(J,{...r,className:a("text-f6 first:mt-2 last:mb-2 py-2 px-5 font-semibold transition-colors flex items-center",t?"opacity-50 cursor-not-allowed":"hover:text-on-base hover:bg-inverted-2/5 cursor-pointer",s?"text-inverted-1":"text-inverted-2",a$1&&"bg-inverted-2/5"),children:c})},Y=({options:r,isSearchable:s=!1,isMultivalued:t=!1,onChange:a$3,onMultiChange:n,onBlur:i,size:c="default",variant:S="default",placeholder:I="Selecione um item",emptyMessage:y="Nenhuma op\xE7\xE3o dispon\xEDvel",hasError:M=!1,errorMessage:b,helpText:N,label:D,labelComplement:V,id:E,name:W,required:k=!1,disabled:g,readOnly:m,maxMenuHeight:G=300,menuPosition:L="absolute",menuPlacement:z="auto",menuWidth:B="100%",menuHorizontalPlacement:l,formGroupClassName:R="",value:F},T)=>{let H=useMemo(()=>Math.random().toString(36).substring(7),[]),h=E||W||H,p=M||!!b;return jsxs("div",{className:a("form-group flex flex-col",R),children:[jsx(a$1,{label:D,labelComplement:V,required:k,hasError:p,htmlFor:h,className:"mb-1"}),jsx(j,{id:h,ref:T,value:F,classNamePrefix:"select",options:r,isSearchable:s,blurInputOnSelect:!t,isMulti:t,hideSelectedOptions:!1,closeMenuOnSelect:!t,isDisabled:g||m,maxMenuHeight:G,menuPortalTarget:document?.body,menuPosition:L,menuPlacement:z,placeholder:I,noOptionsMessage:({inputValue:e})=>e?`Nenhum resultado para "${e}"`:y,onChange:e=>{t&&n?n(e):a$3&&e&&a$3(e);},onBlur:e=>i?.(e),components:{Option:e=>U(e),DropdownIndicator:e=>K(e),MultiValue:e=>Q(e),ClearIndicator:()=>null},classNames:{input:()=>"absolute !mx-0",noOptionsMessage:()=>"text-on-base-3 text-f6 font-semibold break-words",valueContainer:()=>"w-full min-h-10",singleValue:()=>"truncate",placeholder:()=>"w-full truncate pr-2 h-full text-on-base-3",control:({isFocused:e})=>a($({variant:S,size:c,hasErrorState:p,disabled:g,readOnly:m}),e&&!p&&!m&&"border-inverted-1"),groupHeading:()=>"px-5 text-on-base-3 text-f7 font-semibold uppercase"},styles:{option:()=>({}),control:()=>({}),menu:e=>({...e,width:B,backgroundColor:"rgb(var(--color-base-1) / 100)",zIndex:999,...l&&l==="left"&&{left:0},...l&&l==="right"&&{right:0}}),menuPortal:e=>({...e,zIndex:9999}),indicatorSeparator:()=>({}),groupHeading:()=>({}),singleValue:()=>({maxWidth:"calc(100% - 6px)"}),valueContainer:e=>({...e,paddingLeft:16,display:"flex",flexWrap:"nowrap",alignItems:"center",overflowX:"auto",msOverflowStyle:"none",scrollbarWidth:"none","::-webkit-scrollbar":{display:"none"}}),placeholder:()=>({}),multiValue:e=>({...e,overflow:"scroll",display:"flex",flexWrap:"nowrap",overflowX:"auto",scrollbarWidth:"thin",msOverflowStyle:"auto",whiteSpace:"nowrap"})}}),jsx(a$2,{helpText:b||N,hasError:p,className:"mt-2"})]})},Z=O.forwardRef(Y),_=O.memo(Z);_.displayName="Dropdown";
+
+export { _ as a };

package/dist/{chunk-YNBEDPYZ.js → chunk-RN4YOSXH.js}

@@ -1,4 +1,4 @@
-import { a as a$3 } from './chunk-RB4S3T7L.js';
+import { a as a$3 } from './chunk-JZAHJSYD.js';
 import { a as a$1 } from './chunk-NW24WOHT.js';
 import { a } from './chunk-7Z3CCBLX.js';
 import { a as a$4 } from './chunk-G3GCVCTU.js';

package/dist/forms/Dropdown/Dropdown.client.d.ts

@@ -1,6 +1,6 @@
 import { type VariantProps } from 'class-variance-authority';
 import React from 'react';
-import { SelectInstance } from 'react-select';
+import { MultiValue, SelectInstance } from 'react-select';
 import { IconProps } from '../../components/Icon';
 import { InputLabelProps } from '../InputLabel';
 declare const dropdownVariants: (props?: ({
@@ -19,6 +19,11 @@ interface DropdownProps {
      * Options displayed inside dropdown
      * */
     options: CustomOptionProps[] | CustomGroupedOptionsProps[];
+    /**
+     * Controls whether the dropdown is multivalued or not
+     * @default false
+     * */
+    isMultivalued?: boolean;
     /**
      * Placeholder text
      * @default "Selecione um item"
@@ -27,7 +32,11 @@ interface DropdownProps {
     /**
      * Callback function triggered when an option is selected
      * */
-    onChange?: (option: CustomOptionProps) => void;
+    onChange?: (options: CustomOptionProps) => void;
+    /**
+     * Callback function triggered when an option is selected
+     * */
+    onMultiChange?: (options: MultiValue<CustomOptionProps>) => void;
     /**
      * Callback function triggered when the dropdown loses
      * focus
@@ -132,6 +141,7 @@ interface CustomOptionProps {
     label: string;
     icon?: IconProps['icon'];
     isDisabled?: boolean | undefined;
+    element?: JSX.Element;
 }
 interface CustomGroupedOptionsProps {
     label: string;

package/dist/forms/Dropdown/index.js

@@ -1,5 +1,6 @@
-"use client";export { a as Dropdown } from '../../chunk-RB4S3T7L.js';
+"use client";export { a as Dropdown } from '../../chunk-JZAHJSYD.js';
 import '../../chunk-7Z3CCBLX.js';
+import '../../chunk-DIENJUYM.js';
 import '../../chunk-G3GCVCTU.js';
 import '../../chunk-LTWCICTK.js';
 import '../../chunk-KEDPPRQK.js';

package/dist/forms/InputWithUnit/index.js

@@ -1,8 +1,9 @@
-"use client";export { a as DEFAULT_UNITS, b as InputWithUnit } from '../../chunk-YNBEDPYZ.js';
-import '../../chunk-RB4S3T7L.js';
+"use client";export { a as DEFAULT_UNITS, b as InputWithUnit } from '../../chunk-RN4YOSXH.js';
+import '../../chunk-JZAHJSYD.js';
 import '../../chunk-NW24WOHT.js';
 import '../../chunk-SJ4MATMO.js';
 import '../../chunk-7Z3CCBLX.js';
+import '../../chunk-DIENJUYM.js';
 import '../../chunk-G3GCVCTU.js';
 import '../../chunk-LTWCICTK.js';
 import '../../chunk-KEDPPRQK.js';

package/dist/forms/TextArea/index.js

@@ -1,4 +1,4 @@
-export { a as TextArea } from '../../chunk-UIXQQMI7.js';
+export { a as TextArea } from '../../chunk-7BT5L3CO.js';
 import '../../chunk-7Z3CCBLX.js';
 import '../../chunk-G3GCVCTU.js';
 import '../../chunk-REQIQLRI.js';

package/dist/forms/index.js

@@ -1,5 +1,5 @@
 import '../chunk-SLXIJR46.js';
-export { a as TextArea } from '../chunk-UIXQQMI7.js';
+export { a as TextArea } from '../chunk-7BT5L3CO.js';
 export { b as Select, a as SelectComponent } from '../chunk-HZACKBIW.js';
 export { a as Calendar } from '../chunk-PHVC2M6R.js';
 import '../chunk-KN7DOGNL.js';
@@ -9,8 +9,8 @@ import '../chunk-6W6QWPEA.js';
 import '../chunk-4QFFUXWM.js';
 import '../chunk-3BKW5XAK.js';
 import '../chunk-L6H2NDVS.js';
-export { a as DEFAULT_UNITS, b as InputWithUnit } from '../chunk-YNBEDPYZ.js';
-export { a as Dropdown } from '../chunk-RB4S3T7L.js';
+export { a as DEFAULT_UNITS, b as InputWithUnit } from '../chunk-RN4YOSXH.js';
+export { a as Dropdown } from '../chunk-JZAHJSYD.js';
 export { a as InputMask } from '../chunk-NW24WOHT.js';
 export { a as Input } from '../chunk-SJ4MATMO.js';
 export { a as InputLabel } from '../chunk-7Z3CCBLX.js';

package/dist/index.js

@@ -1,5 +1,5 @@
 import './chunk-SLXIJR46.js';
-export { a as TextArea } from './chunk-UIXQQMI7.js';
+export { a as TextArea } from './chunk-7BT5L3CO.js';
 import './chunk-7RP4L6ZM.js';
 import './chunk-4PUGMMDC.js';
 export { a as Tooltip } from './chunk-TZI6YTCW.js';
@@ -16,8 +16,8 @@ export { a as ActionBar } from './chunk-6W6QWPEA.js';
 export { b as Box, d as BoxContent, c as BoxHeader, a as BoxSeparator } from './chunk-4QFFUXWM.js';
 export { a as Container, b as ContainerHeader } from './chunk-3BKW5XAK.js';
 import './chunk-L6H2NDVS.js';
-export { a as DEFAULT_UNITS, b as InputWithUnit } from './chunk-YNBEDPYZ.js';
-export { a as Dropdown } from './chunk-RB4S3T7L.js';
+export { a as DEFAULT_UNITS, b as InputWithUnit } from './chunk-RN4YOSXH.js';
+export { a as Dropdown } from './chunk-JZAHJSYD.js';
 export { a as InputMask } from './chunk-NW24WOHT.js';
 export { a as Input } from './chunk-SJ4MATMO.js';
 export { a as InputLabel } from './chunk-7Z3CCBLX.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loja-integrada/admin-components",
-  "version": "1.3.0",
+  "version": "1.3.2",
   "author": "Loja Integrada",
   "license": "MIT",
   "repository": {

package/dist/chunk-RB4S3T7L.js

@@ -1,12 +0,0 @@
-import { a as a$1 } from './chunk-7Z3CCBLX.js';
-import { a as a$2 } from './chunk-G3GCVCTU.js';
-import { a as a$3 } from './chunk-KEDPPRQK.js';
-import { a } from './chunk-REQIQLRI.js';
-import { cva } from 'class-variance-authority';
-import h, { useMemo } from 'react';
-import k, { components } from 'react-select';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var W=cva("flex w-full cursor-pointer items-center border bg-base-1 transition-colors",{variants:{size:{small:"text-f7 h-10",default:"text-f6 h-12",large:"text-f5 h-14",xlarge:"text-f4 h-24"},variant:{default:"rounded border-card-stroke font-normal text-on-base",secondary:"rounded-md border-inverted-2 font-semibold shadow-inner hover:bg-base-3 focus:bg-base-1 focus:ring-2 focus:ring-focus focus:ring-offset-2"},disabled:{true:"pointer-events-none bg-base-3 text-on-base-2"},readOnly:{true:"pointer-events-none bg-base-2"},hasErrorState:{true:"border-danger focus:border-danger"}},defaultVariants:{variant:"default",size:"default",hasErrorState:!1,disabled:!1,readOnly:!1}}),{Option:q,DropdownIndicator:$}=components,A=o=>{let{selectProps:n}=o,t=`transform transition duration-200 ${n.menuIsOpen?"rotate-180":"rotate-0"} text-inverted-2`;return jsx($,{...o,className:"mr-2",children:jsx(a$3,{icon:"sortDown",size:5,className:t})})},J=o=>{let{isSelected:n,isDisabled:t,isFocused:p,data:s}=o;return jsxs(q,{...o,className:a("text-f6 first:mt-2 last:mb-2 py-2 px-5 font-semibold transition-colors flex items-center",t?"opacity-50 cursor-not-allowed":"hover:text-on-base hover:bg-inverted-2/5 cursor-pointer",n?"text-inverted-1":"text-inverted-2",p&&"bg-inverted-2/5"),children:[s.icon?jsx(a$3,{icon:s.icon,className:"mr-2"}):null,s.label]})},K=({options:o,isSearchable:n=!1,onChange:t,onBlur:p,size:s="default",variant:P="default",placeholder:v="Selecione um item",emptyMessage:w="Nenhuma op\xE7\xE3o dispon\xEDvel",hasError:C=!1,errorMessage:m,helpText:O,label:I,labelComplement:D,id:y,name:N,required:S=!1,disabled:c,readOnly:d,maxMenuHeight:E=300,menuPosition:M="absolute",menuPlacement:V="auto",menuWidth:G="100%",menuHorizontalPlacement:a$3,formGroupClassName:R="",value:z},B)=>{let F=useMemo(()=>Math.random().toString(36).substring(7),[]),f=y||N||F,i=C||!!m;return jsxs("div",{className:a("form-group flex flex-col",R),children:[jsx(a$1,{label:I,labelComplement:D,required:S,hasError:i,htmlFor:f,className:"mb-1"}),jsx(k,{id:f,ref:B,value:z,classNamePrefix:"select",options:o,isSearchable:n,isDisabled:c||d,maxMenuHeight:E,menuPortalTarget:document?.body,menuPosition:M,menuPlacement:V,placeholder:v,noOptionsMessage:({inputValue:e})=>e?`Nenhum resultado para "${e}"`:w,onChange:e=>t&&e&&t(e),onBlur:e=>p?.(e),components:{Option:e=>J(e),DropdownIndicator:e=>A(e)},classNames:{input:()=>"absolute !mx-0",noOptionsMessage:()=>"text-on-base-3 text-f6 font-semibold break-words",valueContainer:()=>"w-full min-h-10",singleValue:()=>"truncate",placeholder:()=>"w-full truncate pr-2 h-full text-on-base-3",control:({isFocused:e})=>a(W({variant:P,size:s,hasErrorState:i,disabled:c,readOnly:d}),e&&!i&&!d&&"border-inverted-1"),groupHeading:()=>"px-5 text-on-base-3 text-f7 font-semibold uppercase"},styles:{option:()=>({}),control:()=>({}),menu:e=>({...e,width:G,backgroundColor:"rgb(var(--color-base-1) / 100)",zIndex:999,...a$3&&a$3==="left"&&{left:0},...a$3&&a$3==="right"&&{right:0}}),menuPortal:e=>({...e,zIndex:9999}),indicatorSeparator:()=>({}),groupHeading:()=>({}),singleValue:()=>({maxWidth:"calc(100% - 6px)"}),valueContainer:e=>({...e,paddingLeft:16,display:"flex",alignItems:"center",flexWrap:"nowrap"}),placeholder:()=>({})}}),jsx(a$2,{helpText:m||O,hasError:i,className:"mt-2"})]})},Q=h.forwardRef(K),U=h.memo(Q);U.displayName="Dropdown";
-
-export { U as a };