@televet/kibble-ui 4.0.0-beta.80 → 4.0.0-beta.82

package/dist/types/theme/tokens/zIndices/zIndices.config.d.ts

@@ -2,6 +2,9 @@ export declare const zIndexTokens: {
     base: {
         value: string;
     };
+    overlay: {
+        value: string;
+    };
     popover: {
         value: string;
     };
@@ -11,9 +14,6 @@ export declare const zIndexTokens: {
     tooltip: {
         value: string;
     };
-    overlay: {
-        value: string;
-    };
     sticky: {
         value: string;
     };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@televet/kibble-ui",
   "description": "Kibble Design System by Otto",
-  "version": "4.0.0-beta.80",
+  "version": "4.0.0-beta.82",
   "type": "module",
   "main": "dist/cjs/index.cjs",
   "module": "dist/esm/index.js",

package/dist/chunks/avatar.component-BdkTgslj.js

@@ -1,2 +0,0 @@
-"use strict";const a=require("./jsx-runtime-BjDatQAs.js"),n=require("react"),N=require("./tooltip.component-Dq7F5JIs.js"),g=require("./icon.component-C0e0UGBw.js"),h=require("./float-OQXnYWBw.js"),M=require("./config-BFcXpdZo.js"),F=require("./use-recipe-DaPWl_pL.js"),H=require("./flex-D14H6HbP.js"),V=require("./box-Baq7UBls.js"),f=require("./factory-D6tdBUPG.js"),W=require("./create-slot-recipe-context-IwVIgtBt.js"),$=require("./use-slot-recipe-8liupslO.js"),G=require("./group-Cv7AQw1b.js"),i=require("./use-locale-context-D0LByRu9.js"),j=require("./index-DOXzraja.js"),m=require("./index-CHIISuTq.js"),L=r=>r&&r.__esModule?r:{default:r},Z=L(n),[C,k]=i.createContext({name:"AvatarContext",hookName:"useAvatarContext",providerName:"<AvatarProvider />"}),A=n.forwardRef((r,e)=>{const s=k(),t=m.mergeProps(s.getFallbackProps(),r);return a.jsxRuntimeExports.jsx(i.ark.span,{...t,ref:e})});A.displayName="AvatarFallback";const w=n.forwardRef((r,e)=>{const s=k(),t=m.mergeProps(s.getImageProps(),r);return a.jsxRuntimeExports.jsx(i.ark.img,{...t,ref:e})});w.displayName="AvatarImage";const O=r=>{const e=n.useId(),{getRootNode:s}=i.useEnvironmentContext(),{dir:t}=i.useLocaleContext(),o={id:e,dir:t,getRootNode:s,...r},c=i.useMachine(j.machine,o);return j.connect(c,i.normalizeProps)},E=n.forwardRef((r,e)=>{const[s,t]=i.createSplitProps()(r,["id","ids","onStatusChange"]),o=O(s),c=m.mergeProps(o.getRootProps(),t);return a.jsxRuntimeExports.jsx(C,{value:o,children:a.jsxRuntimeExports.jsx(i.ark.div,{...c,ref:e})})});E.displayName="AvatarRoot";const P=n.forwardRef((r,e)=>{const[{value:s},t]=i.createSplitProps()(r,["value"]),o=m.mergeProps(s.getRootProps(),t);return a.jsxRuntimeExports.jsx(C,{value:s,children:a.jsxRuntimeExports.jsx(i.ark.div,{...o,ref:e})})});P.displayName="AvatarRootProvider";const{withProvider:S,withContext:D,useStyles:T,useClassNames:X,PropsProvider:J}=W.createSlotRecipeContext({key:"avatar"});S(P,"root",{forwardAsChild:!0});const K=S(E,"root",{forwardAsChild:!0}),Q=f.chakra(A,{},{forwardAsChild:!0});function U(r){return r.children||r.asChild?r.children:r.name?Y(r.name):a.jsxRuntimeExports.jsx(re,{})}function Y(r){const e=r.trim().split(" "),s=e[0]!=null?e[0]:"",t=e.length>1?e[e.length-1]:"";return s&&t?`${s.charAt(0)}${t.charAt(0)}`:s.charAt(0)}const ee=n.forwardRef(function(e,s){const t=T(),o=X(),{name:c,...u}=e;return a.jsxRuntimeExports.jsx(Q,{ref:s,...u,className:f.cx(e.className,o.fallback),css:[t.fallback,e.css],children:U(e)})}),te=D(w,"image",{forwardAsChild:!0,defaultProps:{draggable:"false",referrerPolicy:"no-referrer"}}),re=n.forwardRef(function(e,s){return a.jsxRuntimeExports.jsx(f.chakra.svg,{stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1.2em",width:"1.2em",ref:s,...e,children:a.jsxRuntimeExports.jsx("path",{d:"M20 22H18V20C18 18.3431 16.6569 17 15 17H9C7.34315 17 6 18.3431 6 20V22H4V20C4 17.2386 6.23858 15 9 15H15C17.7614 15 20 17.2386 20 20V22ZM12 13C8.68629 13 6 10.3137 6 7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7C18 10.3137 15.3137 13 12 13ZM12 11C14.2091 11 16 9.20914 16 7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7C8 9.20914 9.79086 11 12 11Z"})})}),se=n.forwardRef(function(e,s){const t=$.useSlotRecipe({key:"avatar"}),[o,c]=n.useMemo(()=>t.splitVariantProps(e),[e,t]);return a.jsxRuntimeExports.jsx(J,{value:o,children:a.jsxRuntimeExports.jsx(G.Group,{gap:"0",spaceX:"-3",ref:s,...c})})}),ae=({avatarSize:r,onRemove:e,isBeingHovered:s,setIsBeingHovered:t})=>{const o=n.useCallback(c=>{c.stopPropagation(),e&&e(c)},[e]);return a.jsxRuntimeExports.jsx(h.Float,{className:"Avatar__RemoveButton","data-testid":"kibble-avatar-remove-button",backgroundColor:"background",borderRadius:"full",cursor:"pointer",display:"none",h:4,onClick:o,onMouseEnter:()=>t(!0),onMouseLeave:()=>t(!1),w:4,zIndex:"tooltip",offset:r==="xl"?2:.5,_groupHover:{display:"flex"},children:a.jsxRuntimeExports.jsx(g.Icon,{variant:"default",name:"closeCircleSolid",size:s?"sm":"xs"})})},I=({currentSize:r,larger:e=!0,delta:s=1})=>{let t;switch(r){case"xs":t=e?"sm":"xs";break;case"sm":t=e?"md":"xs";break;case"md":t=e?"lg":"sm";break;case"lg":t=e?"xl":"md";break;case"xl":t=e?"2xl":"lg";break;case"2xl":t=e?"2xl":"xl";break;default:t=r;break}return s>1&&(t=I({currentSize:t,larger:e,delta:s-1})),t},oe={info:{bgColor:"background.info"},default:{bgColor:"background.subtle.less"},error:{bgColor:"background.danger"},success:{bgColor:"background.success"},warning:{bgColor:"background.warning"}},ne={xs:{boxSize:"10px"},sm:{boxSize:"18px"},md:{boxSize:"18px"},lg:{boxSize:"18px"},xl:{borderWidth:"2px",boxSize:"24px"}},ce=M.defineRecipe({base:{alignItems:"center",borderColor:"border.strong.contrast",borderRadius:"full",borderWidth:"1px",justifyContent:"center"},variants:{size:ne,status:oe,withIcon:{true:{},false:{}}},defaultVariants:{status:"info"},compoundVariants:[{withIcon:!1,status:"info",css:{bgColor:"background.secondary"}},{withIcon:!1,status:"default",css:{bgColor:"background.contrast"}},{withIcon:!1,status:"error",css:{bgColor:"background.destructive"}},{withIcon:!1,status:"success",css:{bgColor:"background.success.contrast"}},{withIcon:!1,status:"warning",css:{bgColor:"background.warning.contrast"}},{withIcon:!1,size:["sm","md","lg"],css:{boxSize:"12px"}},{withIcon:!1,size:"xl",css:{borderWidth:"2px",boxSize:"16px"}}]}),ie={xs:.5,sm:.5,md:.5,lg:.5,xl:2},le={xs:.5,sm:.5,md:1,lg:1,xl:2},ue=({avatarSize:r="md",iconName:e,position:s="bottom-end",status:t="info",...o})=>{const u=F.useRecipe({recipe:ce})({status:t,size:r,withIcon:!!e}),d=n.useMemo(()=>r==="xs"||!e,[e,r]),p=n.useMemo(()=>d?le:ie,[d]);return a.jsxRuntimeExports.jsx(h.Float,{className:"Avatar__BadgeWrapper","data-testid":"kibble-avatar-badge-wrapper",offset:p[r],placement:s,children:a.jsxRuntimeExports.jsx(H.Flex,{className:"Avatar__Badge","data-testid":"kibble-avatar-badge",css:u,...o,children:!d&&e&&a.jsxRuntimeExports.jsx(g.Icon,{name:e,variant:t!=="error"?t:"danger",size:r==="xl"?"sm":"xs"})})})},de=({badgeProps:r,hideBorder:e,iconName:s,name:t="",onClick:o,onRemove:c,showBadge:u,showRemoveButton:d,showTooltip:p=!0,size:l="md",src:v,tooltipProps:x,variant:y="default",webpSrc:b,...q})=>{const[R,B]=n.useState(!1),_=p&&!R?({children:z})=>a.jsxRuntimeExports.jsx(N.Tooltip,{"data-testid":"kibble-avatar-tooltip",...x,label:x?.label||t,disabled:!t&&!x?.label,placement:x?.placement||"bottom",children:a.jsxRuntimeExports.jsx(V.Box,{children:z})}):Z.default.Fragment;return a.jsxRuntimeExports.jsx(_,{children:a.jsxRuntimeExports.jsxs(K,{className:"Avatar group","data-testid":"kibble-avatar",variant:y,size:l,interactive:!!o,hideBorder:e,onClick:o,...q,children:[a.jsxRuntimeExports.jsx(ee,{name:t,children:s&&a.jsxRuntimeExports.jsx(g.Icon,{name:s,mt:"-1px",size:l==="lg"?"lg":I({currentSize:l,larger:!0,delta:1})})}),u&&a.jsxRuntimeExports.jsx(ue,{avatarSize:l,...r}),(b||v)&&a.jsxRuntimeExports.jsx(te,{src:v,srcSet:b}),d&&l!=="xs"&&a.jsxRuntimeExports.jsx(ae,{avatarSize:l,onRemove:c,isBeingHovered:R,setIsBeingHovered:B})]})})};exports.Avatar=de;exports.AvatarGroup=se;
-//# sourceMappingURL=avatar.component-BdkTgslj.js.map

package/dist/chunks/conversationCard.component-CHm8X5MK.js

@@ -1,2 +0,0 @@
-"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),S=require("react"),z=require("./card.component-KNc4HKSh.js"),T=require("./timestamp.component-CNzJfora.js"),y=require("./notificationCounter.component-BhZcuBmr.js"),C=require("./icon.component-C0e0UGBw.js"),H=require("./heading.component-dGH5sXSB.js"),v=require("./text.component-H5f43IC6.js"),I=require("./avatar.component-BdkTgslj.js"),f=require("./tooltip.component-Dq7F5JIs.js"),b=require("./flex-D14H6HbP.js"),l=require("./h-stack-Bjx9hlJo.js"),B=require("./v-stack-DxjgpeJ0.js"),u=require("./box-Baq7UBls.js"),E=require("./button.component-Dd9AfGox.js"),F=require("./menu.component-BGGElaYy.js"),W=require("./tag.component-C6a6EzZB.js"),h=require("./wrap-CNn1kyJX.js"),O=({avatars:t,max:n=1,onAvatarGroupClick:s,tooltipLabel:r})=>e.jsxRuntimeExports.jsx(f.Tooltip,{label:r||"",disabled:!r?.length,children:e.jsxRuntimeExports.jsx(b.Flex,{className:"ConversationCard__AvatarGroup",alignItems:"flex-start",justifyContent:"flex-start",children:n&&t.length>n?e.jsxRuntimeExports.jsx(I.Avatar,{onClick:a=>{a.stopPropagation(),s&&s(a)},cursor:"pointer",name:t.length.toString(),showTooltip:!1}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:t.map(a=>a)})})}),w=({avatarGroupProps:t,timestampProps:n,isHoveringCard:s,isCardPinned:r,title:a,showNotificationIndicator:d,subtitle:i})=>e.jsxRuntimeExports.jsxs(l.HStack,{className:"ConversationCard__Header","data-testid":"kibble-conversation-card-header",justify:"space-between",align:"flex-start",children:[e.jsxRuntimeExports.jsxs(l.HStack,{className:"ConversationCard__Header--Left","data-testid":"kibble-conversation-card-header-left",cursor:"pointer",children:[t&&e.jsxRuntimeExports.jsx(O,{...t,tooltipLabel:t?.tooltipLabel||a}),e.jsxRuntimeExports.jsxs(B.VStack,{className:"ConversationCard__HeaderText","data-testid":"kibble-conversation-card-header-text",justify:"center",align:"left",gap:"0",children:[e.jsxRuntimeExports.jsx(H.WrappedHeading,{className:"ConversationCard__HeaderText--Title","data-testid":"kibble-conversation-card-header-title",size:"sm",truncated:!0,children:a}),i&&e.jsxRuntimeExports.jsx(v.WrappedText,{className:"ConversationCard__HeaderText--Subtitle","data-testid":"kibble-conversation-card-header-subtitle",size:"sm",variant:"subtle",truncated:!0,children:i})]})]}),e.jsxRuntimeExports.jsxs(l.HStack,{className:"ConversationCard__Header--Right","data-testid":"kibble-conversation-card-header-right",visibility:s?"hidden":"visible",align:"center",gap:1,children:[e.jsxRuntimeExports.jsx(T.Timestamp,{...n}),d&&e.jsxRuntimeExports.jsx(u.Box,{as:"span",className:"ConversationCard__HeaderNotificationCounter","data-testid":"conversation-card-unread-indicator",children:e.jsxRuntimeExports.jsx(y.NotificationCounter,{size:"xs"})}),r&&e.jsxRuntimeExports.jsx(b.Flex,{"data-testid":"conversation-card-pinned-icon",children:e.jsxRuntimeExports.jsx(C.Icon,{size:"md",variant:"info",name:"pin"})})]})]}),M=({overlayProps:t,pinProps:n,headerMenuProps:s,isHovering:r,setIsHovering:a})=>{const{isOpenInOverlay:d,onOpenInOverlay:i}=t||{},{isPinned:o,onTogglePin:c}=n||{},{listProps:x}=s||{},m=o?"pinCancel":"pin";return e.jsxRuntimeExports.jsxs(l.HStack,{className:"ConversationCard__Menu","data-testid":"kibble-conversation-card-menu",gap:1,children:[t&&e.jsxRuntimeExports.jsx(E.Button,{className:"ConversationCard__OverlayButton","data-testid":"conversation-card-overlay-icon-button",variant:"secondarySubtle",borderRadius:"sm",...d&&{active:!0},onClick:()=>{i&&i(),r&&a(!1)},iconName:"popup",size:"sm"}),n&&e.jsxRuntimeExports.jsx(E.Button,{className:"ConversationCard__PinButton","data-testid":"conversation-card-pin-toggle-icon-button",variant:o?"secondarySubtleDestructive":"secondarySubtle",borderRadius:"sm",onClick:()=>{c&&c(!o),r&&a(!1)},iconName:m,size:"sm"}),s&&e.jsxRuntimeExports.jsx(F.Menu,{buttonProps:s.buttonProps||{variant:"secondarySubtle",size:"sm",borderRadius:"sm",iconName:"dotsVertical",hideCaret:!0,padding:0},closeOnSelect:!1,lazyMount:!0,...s,listProps:{...x,menuItems:[...n?[{"data-testid":"conversation-card-pin-toggle-dropdown-button",label:`${o?"Unpin":"Pin"} Conversation`,value:"PinConversation",variant:o?"danger":"default",leftElement:e.jsxRuntimeExports.jsx(C.Icon,{size:"md",variant:o?"danger":"default",name:m}),onSelect:()=>{c&&c(!o)}}]:[],...x?.menuItems||[]]}})]})},A=({tags:t})=>e.jsxRuntimeExports.jsx(u.Box,{className:"ConversationCard__Tags",mt:3,children:e.jsxRuntimeExports.jsx(h.Wrap,{gap:"6px",children:t.map(n=>{const{tooltipContent:s,...r}=n;let a=e.jsxRuntimeExports.jsx(W.Tag,{...r,size:"sm",textTransform:"capitalize"});return s&&(a=e.jsxRuntimeExports.jsx(f.Tooltip,{label:s,placement:"top",children:e.jsxRuntimeExports.jsx(u.Box,{children:a})})),e.jsxRuntimeExports.jsx(h.WrapItem,{children:a},n.label)})})}),L=({iconProps:t,content:n,contentProps:s})=>{const r=typeof n=="string"?e.jsxRuntimeExports.jsx(v.WrappedText,{className:"ConversationCard__FooterMessage","data-testid":"kibble-conversation-card-footer-message",size:"sm",variant:"subtle",...s,...t&&{ml:1},children:n}):n;return e.jsxRuntimeExports.jsxs(b.Flex,{className:"ConversationCard__Footer","data-testid":"kibble-conversation-card-footer",mt:3,alignItems:"center",children:[t&&e.jsxRuntimeExports.jsx(C.Icon,{size:"sm",variant:"subtle",...t}),r]})},V=({contentMenu:t,content:n,contentProps:s})=>{const r=typeof n=="string"?e.jsxRuntimeExports.jsx(v.WrappedText,{className:"ConversationCard__Content","data-testid":"kibble-conversation-card-content",truncated:!0,size:"sm",...s,children:n}):n;return e.jsxRuntimeExports.jsxs(l.HStack,{className:"ConversationCard__ContentContainer","data-testid":"kibble-conversation-card-content-container",mt:3,justifyContent:"space-between",alignItems:"center",children:[r,t&&e.jsxRuntimeExports.jsx(u.Box,{className:"ConversationCard__ContentMenu","data-testid":"kibble-conversation-card-content-menu",ml:"auto",children:t})]})},D=({allowHoverActions:t=!0,avatarGroupProps:n,content:s,contentProps:r,contentMenu:a,footerProps:d,headerMenuProps:i,headerProps:o,active:c,onClick:x,overlayProps:m,pinProps:_,shouldPreservePosition:k=!1,showNotificationIndicator:R,tags:g})=>{const{isPinned:N}=_||{},[p,j]=S.useState(!1);return e.jsxRuntimeExports.jsxs(z.Card,{className:"ConversationCard",id:"conversation-card-item","data-testid":"kibble-conversation-card",interactive:!0,active:c,size:"sm",fullWidth:!0,onClick:()=>{x&&x()},bg:R||c||p?"background.default":"background.alphaContrast.pressed",onMouseEnter:()=>{t&&j(!0)},onMouseLeave:()=>j(!1),pos:"relative",css:{overflowAnchor:k?"auto":"none"},children:[p&&e.jsxRuntimeExports.jsx(u.Box,{className:"ConversationCard__Menu--Container","data-testid":"kibble-conversation-card-menu-container",pos:"absolute",top:2,zIndex:"banner",right:2,bg:"background",borderRadius:"md",onClick:q=>q.stopPropagation(),children:e.jsxRuntimeExports.jsx(M,{overlayProps:m,pinProps:_,headerMenuProps:i,isHovering:p,setIsHovering:j})}),e.jsxRuntimeExports.jsx(w,{avatarGroupProps:n,isHoveringCard:p,isCardPinned:N,showNotificationIndicator:R,...o}),e.jsxRuntimeExports.jsx(V,{content:s,contentProps:r,contentMenu:a}),!!g?.length&&e.jsxRuntimeExports.jsx(A,{tags:g}),d&&e.jsxRuntimeExports.jsx(L,{...d})]})};exports.ConversationCard=D;
-//# sourceMappingURL=conversationCard.component-CHm8X5MK.js.map