freemium-ui 2.0.0-beta.34 → 2.0.0-beta.36

package/dist/index.cjs.js

@@ -1804,7 +1804,7 @@ name:i.name,ref:d,onCheck:()=>i.onValueChange(o.value),onKeyDown:rr((e=>{
   }
   &:hover:not([data-disabled]) {
     box-shadow: 0 0 0 5px
-      ${({theme:e,disabled:t})=>t?"transparent":`${e.colors.border.hover}30`};
+      ${({theme:e,disabled:t})=>t?"transparent":e.colors.fill.hover};
   }
   &:focus-within {
     box-shadow: ${({theme:e,isErrored:t})=>t?e.colors.border.error:e.colors.border.active}
@@ -16034,18 +16034,18 @@ fill:u.colors.text.semantic.warning
 target:"_blank",rel:"noreferrer",href:i?.href??"#"
 },i.linkText)),t&&e.createElement(Mn,{onClick:()=>{h(!1),n?.()}
 },e.createElement(qn,{fill:u.colors.text.primary}))):null
-},exports.BoxedRadio=({options:t,defaultValue:n,idAccessor:r="id",onChange:a,isErrored:o,errorText:i,disabled:l=!1,getTextContent:c,className:s,id:u,isRequired:d,readOnly:h,itemComponent:p,label:f,value:m,...v})=>e.createElement(ic,{
+},exports.BoxedRadio=({options:t,defaultValue:n,idAccessor:r="id",onChange:a,isErrored:o,errorText:i,disabled:l=!1,getTextContent:c,className:s,id:u,isRequired:d,readOnly:h,itemComponent:p,label:f,value:m,customIndicator:v,...g})=>e.createElement(ic,{
 className:"StyledBoxedRadio"},f&&e.createElement(wn,{htmlFor:u,
 className:"input-label"},f,d&&e.createElement(zn,null,"*")),e.createElement(lc,{
 defaultValue:n,value:m,onValueChange:e=>a?.(e),"aria-readonly":h,id:u,
 "aria-label":f,"aria-labelledby":u,"aria-invalid":o,
-className:`BoxedRadioGroupRoot ${s??""}`.trim(),...v},t?.map((t=>{
+className:`BoxedRadioGroupRoot ${s??""}`.trim(),...g},t?.map((t=>{
 const n=c?.(t,"name")??"",a=c?.(t,"description")??"";return e.createElement(dc,{
 isErrored:!1,disabled:t.disabled||l,key:t?.[r],className:"BoxedRadioContainer"
 },e.createElement(uc,{className:"BoxedRadioGroupItem",disabled:t.disabled||l,
 value:t?.[r],id:t?.[r],"aria-label":n,hasDescription:!!a},e.createElement(cc,{
 hasDescription:!!a,className:"BoxedRadioGroupIndicatorHolder"
-},e.createElement(sc,{className:"BoxedRadioGroupIndicator"
+},v??e.createElement(sc,{className:"BoxedRadioGroupIndicator"
 }))),e.createElement(fc,{className:"BoxedRadioLabel",htmlFor:t?.[r]
 },p?p(t):e.createElement(e.Fragment,null,a?e.createElement(hc,{
 className:"BoxedRadioLabelHeading"
@@ -16160,7 +16160,8 @@ selectedItems:N,onStateChange:({selectedItems:e,type:t})=>{switch(t){
 case Bf.stateChangeTypes.SelectedItemKeyDownBackspace:
 case Bf.stateChangeTypes.SelectedItemKeyDownDelete:
 case Bf.stateChangeTypes.DropdownKeyDownBackspace:
-case Bf.stateChangeTypes.FunctionRemoveSelectedItem:e&&F(e)}},...m
+case Bf.stateChangeTypes.FunctionRemoveSelectedItem:e&&F(e)}},
+initialSelectedItems:[...M],...m
 }),{isOpen:W,getToggleButtonProps:G,getLabelProps:K,getMenuProps:q,getInputProps:Z,highlightedIndex:X,getItemProps:Q}=ff({
 items:B,itemToString:e=>e&&u?u(e,"downshift"):"",selectedItem:null,inputValue:I,
 stateReducer:(e,t)=>{const{changes:n,type:r}=t;switch(r){
@@ -16171,10 +16172,9 @@ case ff.stateChangeTypes.InputKeyDownEnter:case ff.stateChangeTypes.ItemClick:
 case ff.stateChangeTypes.InputBlur:
 r&&(N.indexOf(r)>-1?F(N.filter((e=>e?.[t]!==r?.[t]))):F([...N,r]),O(""));break
 ;case ff.stateChangeTypes.InputChange:O(e||"")}},...f});e.useEffect((()=>{x?.(I)
-}),[x,I]),e.useEffect((()=>{o?.(N)}),[o,N]),e.useEffect((()=>{
-M.length>0&&Y([...M])}),[M]),e.useEffect((()=>{O(w??"")}),[w]);const J=!c&&!l&&W
-;return e.createElement(ld,{width:p,isOpen:J},e.createElement(wn,{
-className:"input-label",...K({disabled:c,readOnly:l})
+}),[x,I]),e.useEffect((()=>{o?.(N)}),[o,N]),e.useEffect((()=>{O(w??"")}),[w])
+;const J=!c&&!l&&W;return e.createElement(ld,{width:p,isOpen:J
+},e.createElement(wn,{className:"input-label",...K({disabled:c,readOnly:l})
 },n,s&&e.createElement(zn,null,"*")),e.createElement(cd,{disabled:c,
 isErrored:!!E,"aria-invalid":E
 },e.createElement(pm,null,!T&&N.map(((t,n)=>e.createElement(_m,{

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import * as react from 'react';
-import react__default, { HTMLAttributes } from 'react';
+import react__default, { ReactNode, HTMLAttributes } from 'react';
 import * as Popover$1 from '@radix-ui/react-popover';
 import { PopperContentProps } from '@radix-ui/react-popover';
 import { RadioGroupProps as RadioGroupProps$1, RadioGroupContextValue } from '@radix-ui/react-radio-group';
@@ -196,6 +196,7 @@ type BoxedRadioProps<T extends BoxedRadioItemProps = BoxedRadioItemProps> = Omit
     errorText?: string;
     isRequired?: boolean;
     isErrored?: boolean;
+    customIndicator?: ReactNode;
     /**
      * The description of the content
      */
@@ -209,7 +210,7 @@ type BoxedRadioProps<T extends BoxedRadioItemProps = BoxedRadioItemProps> = Omit
 /**
  * BoxedRadio displays a group of options with radio buttons and enables selection of one option from the list.
  */
-declare const BoxedRadio: <T extends BoxedRadioItemProps>({ options, defaultValue, idAccessor, onChange, isErrored, errorText, disabled, getTextContent, className, id, isRequired, readOnly, itemComponent, label, value, ...props }: BoxedRadioProps<T>) => react__default.JSX.Element;
+declare const BoxedRadio: <T extends BoxedRadioItemProps>({ options, defaultValue, idAccessor, onChange, isErrored, errorText, disabled, getTextContent, className, id, isRequired, readOnly, itemComponent, label, value, customIndicator, ...props }: BoxedRadioProps<T>) => react__default.JSX.Element;
 
 interface CheckboxProps extends CheckboxProps$1 {
     /**

package/dist/index.js

@@ -1792,7 +1792,7 @@ onCheck:()=>l.onValueChange(o.value),onKeyDown:xr((e=>{
   }
   &:hover:not([data-disabled]) {
     box-shadow: 0 0 0 5px
-      ${({theme:e,disabled:t})=>t?"transparent":`${e.colors.border.hover}30`};
+      ${({theme:e,disabled:t})=>t?"transparent":e.colors.fill.hover};
   }
   &:focus-within {
     box-shadow: ${({theme:e,isErrored:t})=>t?e.colors.border.error:e.colors.border.active}
@@ -1833,18 +1833,18 @@ onCheck:()=>l.onValueChange(o.value),onKeyDown:xr((e=>{
   line-height: 20px;
 `,Oc=e=>t.createElement(Rc,{...e,
 className:`input-helper ${e.className??""}`.trim()
-},e.children),Nc=({options:e,defaultValue:n,idAccessor:r="id",onChange:a,isErrored:o,errorText:i,disabled:l=!1,getTextContent:c,className:s,id:u,isRequired:d,readOnly:h,itemComponent:p,label:f,value:m,...v})=>t.createElement(Hc,{
+},e.children),Nc=({options:e,defaultValue:n,idAccessor:r="id",onChange:a,isErrored:o,errorText:i,disabled:l=!1,getTextContent:c,className:s,id:u,isRequired:d,readOnly:h,itemComponent:p,label:f,value:m,customIndicator:v,...g})=>t.createElement(Hc,{
 className:"StyledBoxedRadio"},f&&t.createElement(Fn,{htmlFor:u,
 className:"input-label"},f,d&&t.createElement(jn,null,"*")),t.createElement(Dc,{
 defaultValue:n,value:m,onValueChange:e=>a?.(e),"aria-readonly":h,id:u,
 "aria-label":f,"aria-labelledby":u,"aria-invalid":o,
-className:`BoxedRadioGroupRoot ${s??""}`.trim(),...v},e?.map((e=>{
+className:`BoxedRadioGroupRoot ${s??""}`.trim(),...g},e?.map((e=>{
 const n=c?.(e,"name")??"",a=c?.(e,"description")??"";return t.createElement(kc,{
 isErrored:!1,disabled:e.disabled||l,key:e?.[r],className:"BoxedRadioContainer"
 },t.createElement(Ac,{className:"BoxedRadioGroupItem",disabled:e.disabled||l,
 value:e?.[r],id:e?.[r],"aria-label":n,hasDescription:!!a},t.createElement(Lc,{
 hasDescription:!!a,className:"BoxedRadioGroupIndicatorHolder"
-},t.createElement(Vc,{className:"BoxedRadioGroupIndicator"
+},v??t.createElement(Vc,{className:"BoxedRadioGroupIndicator"
 }))),t.createElement(Ic,{className:"BoxedRadioLabel",htmlFor:e?.[r]
 },p?p(e):t.createElement(t.Fragment,null,a?t.createElement(Tc,{
 className:"BoxedRadioLabelHeading"
@@ -3895,7 +3895,8 @@ selectedItems:N,onStateChange:({selectedItems:e,type:t})=>{switch(t){
 case hm.stateChangeTypes.SelectedItemKeyDownBackspace:
 case hm.stateChangeTypes.SelectedItemKeyDownDelete:
 case hm.stateChangeTypes.DropdownKeyDownBackspace:
-case hm.stateChangeTypes.FunctionRemoveSelectedItem:e&&F(e)}},...m
+case hm.stateChangeTypes.FunctionRemoveSelectedItem:e&&F(e)}},
+initialSelectedItems:[...M],...m
 }),{isOpen:W,getToggleButtonProps:G,getLabelProps:K,getMenuProps:q,getInputProps:Z,highlightedIndex:X,getItemProps:Q}=Nf({
 items:B,itemToString:e=>e&&u?u(e,"downshift"):"",selectedItem:null,inputValue:R,
 stateReducer:(e,t)=>{const{changes:n,type:r}=t;switch(r){
@@ -3906,10 +3907,9 @@ case Nf.stateChangeTypes.InputKeyDownEnter:case Nf.stateChangeTypes.ItemClick:
 case Nf.stateChangeTypes.InputBlur:
 r&&(N.indexOf(r)>-1?F(N.filter((t=>t?.[e]!==r?.[e]))):F([...N,r]),O(""));break
 ;case Nf.stateChangeTypes.InputChange:O(t||"")}},...f});t.useEffect((()=>{x?.(R)
-}),[x,R]),t.useEffect((()=>{o?.(N)}),[o,N]),t.useEffect((()=>{
-M.length>0&&Y([...M])}),[M]),t.useEffect((()=>{O(w??"")}),[w]);const J=!c&&!l&&W
-;return t.createElement(Ad,{width:p,isOpen:J},t.createElement(Fn,{
-className:"input-label",...K({disabled:c,readOnly:l})
+}),[x,R]),t.useEffect((()=>{o?.(N)}),[o,N]),t.useEffect((()=>{O(w??"")}),[w])
+;const J=!c&&!l&&W;return t.createElement(Ad,{width:p,isOpen:J
+},t.createElement(Fn,{className:"input-label",...K({disabled:c,readOnly:l})
 },n,s&&t.createElement(jn,null,"*")),t.createElement(kd,{disabled:c,
 isErrored:!!S,"aria-invalid":S
 },t.createElement(Nm,null,!T&&N.map(((e,n)=>t.createElement(Jm,{

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "freemium-ui",
-  "version": "2.0.0-beta.34",
+  "version": "2.0.0-beta.36",
   "description": "React Ui Components for Freemium Apps",
   "main": "./index.js",
   "module": "./index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "freemium-ui",
-  "version": "2.0.0-beta.34",
+  "version": "2.0.0-beta.36",
   "description": "React Ui Components for Freemium Apps",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",