@cavilha/chip/dist/index.es.js

A component that allow users to make selections and filter content.

import e from"react";import{faTimesCircle as o}from"@fortawesome/pro-solid-svg-icons";import{styled as r}from"@cavilha/theme";import*as t from"@radix-ui/react-toggle-group";import n from"@cavilha/icon";var a,l,i,s,c=function(){return c=Object.assign||function(e){for(var o,r=1,t=arguments.length;r<t;r++)for(var n in o=arguments[r])Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n]);return e},c.apply(this,arguments)};function d(e,o){var r={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&o.indexOf(t)<0&&(r[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(e);n<t.length;n++)o.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(e,t[n])&&(r[t[n]]=e[t[n]])}return r}var p=r(t.Root,{display:"flex",alignItems:"center"}),u=r("span",{fontFamily:"$untitled",fontSize:"$bodySmall",fontWeight:"$semibold",color:"$secondary4",lineHeight:"$small2"}),m=r(n,{ml:"$small2",lineHeight:0,color:"$neutral1",display:"none"}),b=r(t.Item,{appearance:"none",border:"1px solid $colors$secondary4",br:"$large",mr:"$small2",mb:"$small2",outline:"none",height:32,padding:"6px $small3",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",position:"relative",bc:"transparent","&:hover":(a={bc:"$secondary0Hover"},a["".concat(u)]={color:"$secondary4"},a),"&:focus":(l={boxShadow:"$focusPressed"},l["".concat(u)]={color:"$secondary4"},l),"&[data-state=on]":(i={bc:"$secondary4","&:hover":{bc:"$secondary4Hover"}},i["".concat(u)]={color:"$alwaysWhite"},i["".concat(m)]={color:"$alwaysWhite",display:"block"},i),"&:disabled":(s={border:"1px solid $colors$neutral3",cursor:"not-allowed","&:hover":{bc:"transparent"}},s["".concat(u)]={color:"$neutral4"},s)}),y=function(r){var t=r.id,n=r.label,a=r.value,l=r.isDisabled,i=r.css,s=d(r,["id","label","value","isDisabled","css"]);return e.createElement(b,c({id:t,role:"button",title:n,disabled:l,value:a,css:i},s),e.createElement(u,null,n),e.createElement(m,{icon:o,iconSize:16}))},f=function(o){var r=o.isDisabled,t=void 0!==r&&r,n=o.children,a=o.onChange,l=o.loop,i=void 0===l||l,s=o.rovingFocus,u=void 0===s||s,m=o.css,b=d(o,["isDisabled","children","onChange","loop","rovingFocus","css"]);return e.createElement(p,c({onValueChange:a,loop:i,rovingFocus:u,disabled:t,type:"single",css:m},b),n&&(Array.isArray(n)?n.map((function(o){return e.createElement(y,c({key:o.props.id},o.props))})):n))};export{y as ChipItem,f as default};