@cgi-learning-hub/ui/dist/Chip-BG0OU0KI.cjs

@cgi-learning-hub/ui is an open-source React component library that implements UI for HUB's features

"use strict";const te=require("react"),t=require("./index-DLnSn8GT.cjs"),o=require("./identifier-BoZelETM.cjs"),le=require("./createSvgIcon-IET9soda.cjs"),T=require("react/jsx-runtime"),re=require("./memoTheme-BKfsJx_F.cjs"),P=require("./createSimplePaletteValueFilter-PTK3TAhW.cjs"),N=require("./useSlot-C2FjoUpF.cjs"),k=require("./DefaultPropsProvider-Cnf49AIv.cjs"),ie=require("./useForkRef-CFhhTu-Q.cjs"),F=require("./ButtonBase-Dp6sf_dP.cjs"),ne=require("./unsupportedProp-Bn6XWqwH.cjs");function ce(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const n=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(r,a,n.get?n:{enumerable:!0,get:()=>e[a]})}}return r.default=e,Object.freeze(r)}const d=ce(te),pe=le.createSvgIcon(T.jsx("path",{d:"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"}),"Cancel");function M(e){return o.generateUtilityClass("MuiChip",e)}const l=o.generateUtilityClasses("MuiChip",["root","sizeSmall","sizeMedium","colorDefault","colorError","colorInfo","colorPrimary","colorSecondary","colorSuccess","colorWarning","disabled","clickable","clickableColorPrimary","clickableColorSecondary","deletable","deletableColorPrimary","deletableColorSecondary","outlined","filled","outlinedPrimary","outlinedSecondary","filledPrimary","filledSecondary","avatar","avatarSmall","avatarMedium","avatarColorPrimary","avatarColorSecondary","icon","iconSmall","iconMedium","iconColorPrimary","iconColorSecondary","label","labelSmall","labelMedium","deleteIcon","deleteIconSmall","deleteIconMedium","deleteIconColorPrimary","deleteIconColorSecondary","deleteIconOutlinedColorPrimary","deleteIconOutlinedColorSecondary","deleteIconFilledColorPrimary","deleteIconFilledColorSecondary","focusVisible"]),se=e=>{const{classes:r,disabled:a,size:n,color:c,iconColor:g,onDelete:u,clickable:p,variant:s}=e,C={root:["root",s,a&&"disabled",`size${o.capitalize(n)}`,`color${o.capitalize(c)}`,p&&"clickable",p&&`clickableColor${o.capitalize(c)}`,u&&"deletable",u&&`deletableColor${o.capitalize(c)}`,`${s}${o.capitalize(c)}`],label:["label",`label${o.capitalize(n)}`],avatar:["avatar",`avatar${o.capitalize(n)}`,`avatarColor${o.capitalize(c)}`],icon:["icon",`icon${o.capitalize(n)}`,`iconColor${o.capitalize(g)}`],deleteIcon:["deleteIcon",`deleteIcon${o.capitalize(n)}`,`deleteIconColor${o.capitalize(c)}`,`deleteIcon${o.capitalize(s)}Color${o.capitalize(c)}`]};return k.composeClasses(C,M,r)},de=k.styled("div",{name:"MuiChip",slot:"Root",overridesResolver:(e,r)=>{const{ownerState:a}=e,{color:n,iconColor:c,clickable:g,onDelete:u,size:p,variant:s}=a;return[{[`& .${l.avatar}`]:r.avatar},{[`& .${l.avatar}`]:r[`avatar${o.capitalize(p)}`]},{[`& .${l.avatar}`]:r[`avatarColor${o.capitalize(n)}`]},{[`& .${l.icon}`]:r.icon},{[`& .${l.icon}`]:r[`icon${o.capitalize(p)}`]},{[`& .${l.icon}`]:r[`iconColor${o.capitalize(c)}`]},{[`& .${l.deleteIcon}`]:r.deleteIcon},{[`& .${l.deleteIcon}`]:r[`deleteIcon${o.capitalize(p)}`]},{[`& .${l.deleteIcon}`]:r[`deleteIconColor${o.capitalize(n)}`]},{[`& .${l.deleteIcon}`]:r[`deleteIcon${o.capitalize(s)}Color${o.capitalize(n)}`]},r.root,r[`size${o.capitalize(p)}`],r[`color${o.capitalize(n)}`],g&&r.clickable,g&&n!=="default"&&r[`clickableColor${o.capitalize(n)})`],u&&r.deletable,u&&n!=="default"&&r[`deletableColor${o.capitalize(n)}`],r[s],r[`${s}${o.capitalize(n)}`]]}})(re.memoTheme(({theme:e})=>{const r=e.palette.mode==="light"?e.palette.grey[700]:e.palette.grey[300];return{maxWidth:"100%",fontFamily:e.typography.fontFamily,fontSize:e.typography.pxToRem(13),display:"inline-flex",alignItems:"center",justifyContent:"center",height:32,color:(e.vars||e).palette.text.primary,backgroundColor:(e.vars||e).palette.action.selected,borderRadius:32/2,whiteSpace:"nowrap",transition:e.transitions.create(["background-color","box-shadow"]),cursor:"unset",outline:0,textDecoration:"none",border:0,padding:0,verticalAlign:"middle",boxSizing:"border-box",[`&.${l.disabled}`]:{opacity:(e.vars||e).palette.action.disabledOpacity,pointerEvents:"none"},[`& .${l.avatar}`]:{marginLeft:5,marginRight:-6,width:24,height:24,color:e.vars?e.vars.palette.Chip.defaultAvatarColor:r,fontSize:e.typography.pxToRem(12)},[`& .${l.avatarColorPrimary}`]:{color:(e.vars||e).palette.primary.contrastText,backgroundColor:(e.vars||e).palette.primary.dark},[`& .${l.avatarColorSecondary}`]:{color:(e.vars||e).palette.secondary.contrastText,backgroundColor:(e.vars||e).palette.secondary.dark},[`& .${l.avatarSmall}`]:{marginLeft:4,marginRight:-4,width:18,height:18,fontSize:e.typography.pxToRem(10)},[`& .${l.icon}`]:{marginLeft:5,marginRight:-6},[`& .${l.deleteIcon}`]:{WebkitTapHighlightColor:"transparent",color:e.vars?`rgba(${e.vars.palette.text.primaryChannel} / 0.26)`:o.alpha(e.palette.text.primary,.26),fontSize:22,cursor:"pointer",margin:"0 5px 0 -6px","&:hover":{color:e.vars?`rgba(${e.vars.palette.text.primaryChannel} / 0.4)`:o.alpha(e.palette.text.primary,.4)}},variants:[{props:{size:"small"},style:{height:24,[`& .${l.icon}`]:{fontSize:18,marginLeft:4,marginRight:-4},[`& .${l.deleteIcon}`]:{fontSize:16,marginRight:4,marginLeft:-4}}},...Object.entries(e.palette).filter(P.createSimplePaletteValueFilter(["contrastText"])).map(([a])=>({props:{color:a},style:{backgroundColor:(e.vars||e).palette[a].main,color:(e.vars||e).palette[a].contrastText,[`& .${l.deleteIcon}`]:{color:e.vars?`rgba(${e.vars.palette[a].contrastTextChannel} / 0.7)`:o.alpha(e.palette[a].contrastText,.7),"&:hover, &:active":{color:(e.vars||e).palette[a].contrastText}}}})),{props:a=>a.iconColor===a.color,style:{[`& .${l.icon}`]:{color:e.vars?e.vars.palette.Chip.defaultIconColor:r}}},{props:a=>a.iconColor===a.color&&a.color!=="default",style:{[`& .${l.icon}`]:{color:"inherit"}}},{props:{onDelete:!0},style:{[`&.${l.focusVisible}`]:{backgroundColor:e.vars?`rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))`:o.alpha(e.palette.action.selected,e.palette.action.selectedOpacity+e.palette.action.focusOpacity)}}},...Object.entries(e.palette).filter(P.createSimplePaletteValueFilter(["dark"])).map(([a])=>({props:{color:a,onDelete:!0},style:{[`&.${l.focusVisible}`]:{background:(e.vars||e).palette[a].dark}}})),{props:{clickable:!0},style:{userSelect:"none",WebkitTapHighlightColor:"transparent",cursor:"pointer","&:hover":{backgroundColor:e.vars?`rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))`:o.alpha(e.palette.action.selected,e.palette.action.selectedOpacity+e.palette.action.hoverOpacity)},[`&.${l.focusVisible}`]:{backgroundColor:e.vars?`rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))`:o.alpha(e.palette.action.selected,e.palette.action.selectedOpacity+e.palette.action.focusOpacity)},"&:active":{boxShadow:(e.vars||e).shadows[1]}}},...Object.entries(e.palette).filter(P.createSimplePaletteValueFilter(["dark"])).map(([a])=>({props:{color:a,clickable:!0},style:{[`&:hover, &.${l.focusVisible}`]:{backgroundColor:(e.vars||e).palette[a].dark}}})),{props:{variant:"outlined"},style:{backgroundColor:"transparent",border:e.vars?`1px solid ${e.vars.palette.Chip.defaultBorder}`:`1px solid ${e.palette.mode==="light"?e.palette.grey[400]:e.palette.grey[700]}`,[`&.${l.clickable}:hover`]:{backgroundColor:(e.vars||e).palette.action.hover},[`&.${l.focusVisible}`]:{backgroundColor:(e.vars||e).palette.action.focus},[`& .${l.avatar}`]:{marginLeft:4},[`& .${l.avatarSmall}`]:{marginLeft:2},[`& .${l.icon}`]:{marginLeft:4},[`& .${l.iconSmall}`]:{marginLeft:2},[`& .${l.deleteIcon}`]:{marginRight:5},[`& .${l.deleteIconSmall}`]:{marginRight:3}}},...Object.entries(e.palette).filter(P.createSimplePaletteValueFilter()).map(([a])=>({props:{variant:"outlined",color:a},style:{color:(e.vars||e).palette[a].main,border:`1px solid ${e.vars?`rgba(${e.vars.palette[a].mainChannel} / 0.7)`:o.alpha(e.palette[a].main,.7)}`,[`&.${l.clickable}:hover`]:{backgroundColor:e.vars?`rgba(${e.vars.palette[a].mainChannel} / ${e.vars.palette.action.hoverOpacity})`:o.alpha(e.palette[a].main,e.palette.action.hoverOpacity)},[`&.${l.focusVisible}`]:{backgroundColor:e.vars?`rgba(${e.vars.palette[a].mainChannel} / ${e.vars.palette.action.focusOpacity})`:o.alpha(e.palette[a].main,e.palette.action.focusOpacity)},[`& .${l.deleteIcon}`]:{color:e.vars?`rgba(${e.vars.palette[a].mainChannel} / 0.7)`:o.alpha(e.palette[a].main,.7),"&:hover, &:active":{color:(e.vars||e).palette[a].main}}}}))]}})),ue=k.styled("span",{name:"MuiChip",slot:"Label",overridesResolver:(e,r)=>{const{ownerState:a}=e,{size:n}=a;return[r.label,r[`label${o.capitalize(n)}`]]}})({overflow:"hidden",textOverflow:"ellipsis",paddingLeft:12,paddingRight:12,whiteSpace:"nowrap",variants:[{props:{variant:"outlined"},style:{paddingLeft:11,paddingRight:11}},{props:{size:"small"},style:{paddingLeft:8,paddingRight:8}},{props:{size:"small",variant:"outlined"},style:{paddingLeft:7,paddingRight:7}}]});function E(e){return e.key==="Backspace"||e.key==="Delete"}const q=d.forwardRef(function(r,a){const n=k.useDefaultProps({props:r,name:"MuiChip"}),{avatar:c,className:g,clickable:u,color:p="default",component:s,deleteIcon:C,disabled:S=!1,icon:$,label:K,onClick:R,onDelete:y,onKeyDown:D,onKeyUp:w,size:U="medium",variant:B="filled",tabIndex:W,skipFocusWhenDisabled:_=!1,slots:A={},slotProps:H={},...G}=n,J=d.useRef(null),Q=ie.useForkRef(J,a),V=i=>{i.stopPropagation(),y&&y(i)},X=i=>{i.currentTarget===i.target&&E(i)&&i.preventDefault(),D&&D(i)},Y=i=>{i.currentTarget===i.target&&y&&E(i)&&y(i),w&&w(i)},z=u!==!1&&R?!0:u,x=z||y?F.ButtonBase:s||"div",I={...n,component:x,disabled:S,size:U,color:p,iconColor:d.isValidElement($)&&$.props.color||p,onDelete:!!y,clickable:z,variant:B},v=se(I),Z=x===F.ButtonBase?{component:s||"div",focusVisibleClassName:v.focusVisible,...y&&{disableRipple:!0}}:{};let j=null;y&&(j=C&&d.isValidElement(C)?d.cloneElement(C,{className:o.clsx(C.props.className,v.deleteIcon),onClick:V}):T.jsx(pe,{className:v.deleteIcon,onClick:V}));let m=null;c&&d.isValidElement(c)&&(m=d.cloneElement(c,{className:o.clsx(v.avatar,c.props.className)}));let O=null;$&&d.isValidElement($)&&(O=d.cloneElement($,{className:o.clsx(v.icon,$.props.className)})),process.env.NODE_ENV!=="production"&&m&&O&&console.error("MUI: The Chip component can not handle the avatar and the icon prop at the same time. Pick one.");const L={slots:A,slotProps:H},[h,ee]=N.useSlot("root",{elementType:de,externalForwardedProps:{...L,...G},ownerState:I,shouldForwardComponentProp:!0,ref:Q,className:o.clsx(v.root,g),additionalProps:{disabled:z&&S?!0:void 0,tabIndex:_&&S?-1:W,...Z},getSlotProps:i=>({...i,onClick:b=>{var f;(f=i.onClick)==null||f.call(i,b),R(b)},onKeyDown:b=>{var f;(f=i.onKeyDown)==null||f.call(i,b),X(b)},onKeyUp:b=>{var f;(f=i.onKeyUp)==null||f.call(i,b),Y(b)}})}),[ae,oe]=N.useSlot("label",{elementType:ue,externalForwardedProps:L,ownerState:I,className:v.label});return T.jsxs(h,{as:x,...ee,children:[m||O,T.jsx(ae,{...oe,children:K}),j]})});process.env.NODE_ENV!=="production"&&(q.propTypes={avatar:t.PropTypes.element,children:ne.unsupportedProp,classes:t.PropTypes.object,className:t.PropTypes.string,clickable:t.PropTypes.bool,color:t.PropTypes.oneOfType([t.PropTypes.oneOf(["default","primary","secondary","error","info","success","warning"]),t.PropTypes.string]),component:t.PropTypes.elementType,deleteIcon:t.PropTypes.element,disabled:t.PropTypes.bool,icon:t.PropTypes.element,label:t.PropTypes.node,onClick:t.PropTypes.func,onDelete:t.PropTypes.func,onKeyDown:t.PropTypes.func,onKeyUp:t.PropTypes.func,size:t.PropTypes.oneOfType([t.PropTypes.oneOf(["medium","small"]),t.PropTypes.string]),skipFocusWhenDisabled:t.PropTypes.bool,slotProps:t.PropTypes.shape({label:t.PropTypes.oneOfType([t.PropTypes.func,t.PropTypes.object]),root:t.PropTypes.oneOfType([t.PropTypes.func,t.PropTypes.object])}),slots:t.PropTypes.shape({label:t.PropTypes.elementType,root:t.PropTypes.elementType}),sx:t.PropTypes.oneOfType([t.PropTypes.arrayOf(t.PropTypes.oneOfType([t.PropTypes.func,t.PropTypes.object,t.PropTypes.bool])),t.PropTypes.func,t.PropTypes.object]),tabIndex:t.PropTypes.number,variant:t.PropTypes.oneOfType([t.PropTypes.oneOf(["filled","outlined"]),t.PropTypes.string])});exports.Chip=q;exports.chipClasses=l;exports.getChipUtilityClass=M;