UNPKG

@numl-react/avatar

Version:

Avatars are used to show a thumbnail representation of an individual or business in the interface.

2 lines (1 loc) 2.91 kB
"use strict";var e=Object.defineProperty,t=Object.prototype.hasOwnProperty,n=Object.getOwnPropertySymbols,l=Object.prototype.propertyIsEnumerable,r=(t,n,l)=>n in t?e(t,n,{enumerable:!0,configurable:!0,writable:!0,value:l}):t[n]=l,a=(e,a)=>{for(var o in a||(a={}))t.call(a,o)&&r(e,o,a[o]);if(n)for(var o of n(a))l.call(a,o)&&r(e,o,a[o]);return e},o=(e,r)=>{var a={};for(var o in e)t.call(e,o)&&r.indexOf(o)<0&&(a[o]=e[o]);if(null!=e&&n)for(var o of n(e))r.indexOf(o)<0&&l.call(e,o)&&(a[o]=e[o]);return a};Object.defineProperty(exports,"__esModule",{value:!0}),exports[Symbol.toStringTag]="Module";var u=require("@numl-react/elements"),c=require("react");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var t={__proto__:null,[Symbol.toStringTag]:"Module"};return e&&Object.keys(e).forEach((function(n){if("default"!==n){var l=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,l.get?l:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var f=s(u),d=i(c);const m=function e(t){const{username:n,subtitle:l,theme:r="default",children:u,fill:c,showIcon:i=!0,gap:s="2x 1x",cursor:m="pointer",padding:p="1x"}=t,b=o(t,["username","subtitle","theme","children","fill","showIcon","gap","cursor","padding"]);return d.default.createElement(f.Button,a({gap:s,theme:r,fill:c,cursor:m,padding:p},b),d.default.createElement(e.Profile,{column:"1",gap:s,fill:c,username:n,subtitle:l,showIcon:i}),u&&d.default.createElement(f.Inline,null,d.default.createElement(f.DropdownIcon,{padding:"0 1x",name:"chevron-down-outline",fill:c,theme:r}),d.default.createElement(e.Popup,null,u)))};m.Icon=function(e){const{username:t,showIcon:n=!0,size:l,padding:r,icon:u}=e,c=o(e,["username","showIcon","size","padding","icon"]);let i="",s=r;return"sm"===l?(i="4x",s="0.5x"):"md"===l?(i="5x",s="1x"):(i="6x",s="1.5x"),d.default.createElement(f.Circle,a({text:"uppercase",size:i,inline:!0},c),d.default.createElement(f.AttributeProvider,{for:"nu-el",size:"special"}),n&&"false"!==n||!t?u||d.default.createElement(f.Icon,{padding:s,size:"4x",sp:!0,name:"person"}):d.default.createElement(f.BaseElement,{padding:"1x",size:"3x 4x"},t.slice(0,2)))},m.Profile=function(e){const{username:t,subtitle:n,showIcon:l,gap:r="1x"}=e,u=o(e,["username","subtitle","showIcon","gap"]);return d.default.createElement(f.Flex,a({columns:"auto auto",items:"center",gap:r},u),d.default.createElement(m.Icon,{username:t,showIcon:l}),d.default.createElement(f.Flex,{flow:"column",items:"start center"},t?d.default.createElement(f.Block,null,t?d.default.createElement(f.BaseElement,{size:"md"},t):null):null,n?d.default.createElement(f.Block,null,n?d.default.createElement(f.BaseElement,{size:"sm"},n):null,"nd"):null))},m.Popup=function(e){const{children:t}=e,n=o(e,["children"]);return d.default.createElement(f.Popup,a({"use-menu":!0},n),t)},exports.Avatar=m;