@openfin/ui-library 0.21.0-alpha.1690388953 → 0.21.0-alpha.1690484356

package/dist/components/elements/DropdownMenu/dropdownButton.d.ts

@@ -1,6 +1,7 @@
 import { MenuOption } from './menu';
 import React from 'react';
-export interface DropdownButtonProps {
+import { WithStatusProps } from '../../system/HOC';
+export interface DropdownButtonProps extends WithStatusProps {
     tabIndex?: number;
     activeDescendant?: string;
     expanded: boolean;

package/dist/index.js

@@ -428,13 +428,16 @@ var e={8594:(e,t,n)=>{n.d(t,{Z:()=>o});var r=/^((children|dangerouslySetInnerHTM
       border-radius: 100px;
     }
   }
-`},9734:function(e,t,n){var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__exportStar||function(e,t){for(var n in e)"default"===n||Object.prototype.hasOwnProperty.call(t,n)||r(t,e,n)};Object.defineProperty(t,"__esModule",{value:!0}),o(n(6895),t)},162:function(e,t,n){var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.DropdownButton=void 0;const o=n(5893),i=n(279),a=n(7261),l=n(9634),c=n(6689),s=r(n(7518)),u=n(1335);t.DropdownButton=(0,c.forwardRef)(((e,t)=>{var n,r,c,s,u;return(0,o.jsxs)(d,Object.assign({role:"comboxbox",ref:t,tabIndex:e.tabIndex,"aria-activedescendant":e.activeDescendant,"aria-expanded":e.expanded,"aria-haspopup":"listbox","aria-controls":"dropdown-listbox",onClick:()=>e.handleClick(),as:"button","data-testid":"dropdown-button",title:null!==(r=null===(n=e.selected)||void 0===n?void 0:n.title)&&void 0!==r?r:e.placeholder},{children:[(null===(c=e.selected)||void 0===c?void 0:c.iconUrl)&&(0,o.jsx)(i.ButtonImage,{src:e.selected.iconUrl}),(0,o.jsx)(a.OptionTitle,Object.assign({"aria-live":"polite","data-testid":"selected-option"},{children:null!==(u=null===(s=e.selected)||void 0===s?void 0:s.title)&&void 0!==u?u:e.placeholder})),(0,o.jsx)(l.Icon,{icon:e.expanded?"ChevronUpIcon":"ChevronDownIcon"})]}))})),t.DropdownButton.displayName="DropdownButton";const d=(0,s.default)(u.Box)`
+`},9734:function(e,t,n){var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__exportStar||function(e,t){for(var n in e)"default"===n||Object.prototype.hasOwnProperty.call(t,n)||r(t,e,n)};Object.defineProperty(t,"__esModule",{value:!0}),o(n(6895),t)},162:function(e,t,n){var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.DropdownButton=void 0;const o=n(5893),i=n(279),a=n(7261),l=n(9634),c=n(6689),s=r(n(7518)),u=n(1335),d=n(9507);t.DropdownButton=(0,c.forwardRef)(((e,t)=>{var n,r,l,c,s;return(0,o.jsxs)(C,Object.assign({role:"comboxbox",ref:t,tabIndex:e.tabIndex,"aria-activedescendant":e.activeDescendant,status:e.status,"aria-expanded":e.expanded,"aria-haspopup":"listbox","aria-controls":"dropdown-listbox",onClick:()=>e.handleClick(),as:"button","data-testid":"dropdown-button",title:null!==(r=null===(n=e.selected)||void 0===n?void 0:n.title)&&void 0!==r?r:e.placeholder},{children:[(null===(l=e.selected)||void 0===l?void 0:l.iconUrl)&&(0,o.jsx)(i.ButtonImage,{src:e.selected.iconUrl}),(0,o.jsx)(a.OptionTitle,Object.assign({"aria-live":"polite","data-testid":"selected-option"},{children:null!==(s=null===(c=e.selected)||void 0===c?void 0:c.title)&&void 0!==s?s:e.placeholder})),(0,o.jsx)(f,{status:e.status,icon:e.expanded?"ChevronUpIcon":"ChevronDownIcon"})]}))})),t.DropdownButton.displayName="DropdownButton";const f=(0,s.default)(l.Icon)`
+  color: ${({theme:e,status:t})=>(0,d.getStatusColor)(e,t,"inputBorder")};
+`,C=(0,s.default)(u.Box)`
   align-items: center;
   background: ${({theme:e})=>e.palette.background4};
   border: 1px solid ${({theme:e})=>e.palette.inputBackground};
   border-radius: ${({theme:e})=>e.radius.small};
   color: ${({theme:e})=>e.palette.textDefault};
   cursor: pointer;
+  border-color: ${({theme:e,status:t})=>(0,d.getStatusColor)(e,t,"inputBorder")};
   display: inline-flex;
   font-weight: ${({theme:e})=>e.fontWeight.bold};
   gap: ${({theme:e})=>e.px.small};
@@ -455,6 +458,11 @@ var e={8594:(e,t,n)=>{n.d(t,{Z:()=>o});var r=/^((children|dangerouslySetInnerHTM
   &:focus-within {
     border-color: ${({theme:e})=>e.palette.inputFocused};
   }
+
+  &:focus {
+    outline: 0;
+    border-color: ${({theme:e,status:t})=>(0,d.getStatusColor)(e,t,"inputFocused")};
+  }
 `},6062:function(e,t,n){var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.DropdownMenu=void 0;const o=n(5893),i=n(6689),a=n(1335),l=r(n(7518)),c=n(7261),s=n(279),u=n(347),d=n(162);t.DropdownMenu=(0,i.forwardRef)((({label:e,options:t=[[]],placeholder:n="Select an option",selected:r,onOptionHover:l,onChange:h,renderLabel:v,fitContent:g},m)=>{const[w,b]=(0,i.useState)(!1);(0,i.useEffect)((()=>{1===t[0].length&&y(!1)}),[t]);const y=e=>{b(null!=e?e:!w)},{focusedOption:x,handleKeyDown:L}=(0,u.useDropdownKeyboardNavigation)(t,r,w,y,h);return(0,o.jsx)(C,Object.assign({ref:m,flexDirection:"column",onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||b(!1)},onKeyDown:L},{children:(0,o.jsxs)(a.Box,Object.assign({gap:"small",flexDirection:"column",style:{width:"100%"}},{children:[e&&(0,o.jsx)(f,Object.assign({htmlFor:"dropdown-button"},{children:(0,o.jsx)(c.OptionTitle,{children:e})})),(0,o.jsxs)(p,{children:[v?v(r||{title:n,value:null},w,y,x):(0,o.jsx)(d.DropdownButton,{tabIndex:0,activeDescendant:`menu-option-${null==x?void 0:x.value}`,expanded:w&&t[0].length>1,handleClick:()=>y(),selected:r,placeholder:n}),t.length&&t[0].length>1&&w&&(0,o.jsx)(s.Menu,{menuId:"dropdown-listbox",options:t,selected:r,handleExpandMenu:y,onOptionHover:l,onChange:h,fitContent:g,focusedOption:x,absolutePosition:!0})]})]}))}))})),t.DropdownMenu.displayName="DropdownMenu";const f=l.default.label`
   font-weight: ${({theme:e})=>e.fontWeight.bold};
 `,C=(0,l.default)(a.Box)`
@@ -1086,7 +1094,7 @@ var e={8594:(e,t,n)=>{n.d(t,{Z:()=>o});var r=/^((children|dangerouslySetInnerHTM
 `;t.Mixins={noSelect:i,textOverflow:a,scrollbar:{[r.Size.base]:l,[r.Size.small]:c},appRegion:{drag:s,noDrag:u}}},5459:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.Palette=void 0,t.Palette={background1:"background1",background2:"background2",background3:"background3",background4:"background4",background5:"background5",background6:"background6",brandPrimary:"brandPrimary",brandSecondary:"brandSecondary",brandPrimaryActive:"brandPrimaryActive",brandPrimaryHover:"brandPrimaryHover",brandPrimaryFocused:"brandPrimaryFocused",brandPrimaryText:"brandPrimaryText",brandSecondaryActive:"brandSecondaryActive",brandSecondaryHover:"brandSecondaryHover",brandSecondaryFocused:"brandSecondaryFocused",brandSecondaryText:"brandSecondaryText",inputBackground:"inputBackground",inputColor:"inputColor",inputPlaceholder:"inputPlaceholder",inputDisabled:"inputDisabled",inputFocused:"inputFocused",inputBorder:"inputBorder",statusSuccess:"statusSuccess",statusWarning:"statusWarning",statusCritical:"statusCritical",statusActive:"statusActive",textDefault:"textDefault",textHelp:"textHelp",textInactive:"textInactive",borderNeutral:"borderNeutral",contentBackground1:"contentBackground1",contentBackground2:"contentBackground2",contentBackground3:"contentBackground3",contentBackground4:"contentBackground4",contentBackground5:"contentBackground5",linkDefault:"linkDefault",linkHover:"linkHover"}},5317:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0})},4266:function(e,t,n){var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__exportStar||function(e,t){for(var n in e)"default"===n||Object.prototype.hasOwnProperty.call(t,n)||r(t,e,n)};Object.defineProperty(t,"__esModule",{value:!0}),o(n(9483),t)},9483:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.OpenFinDarkTheme=t.OpenFinLightTheme=void 0;const r=n(5459),o=n(3471),i=n(6714),a={[r.Palette.brandPrimary]:o.Color.openFin,[r.Palette.statusSuccess]:o.Color.functional1,[r.Palette.statusWarning]:o.Color.functional10,[r.Palette.statusCritical]:o.Color.functional7,[r.Palette.statusActive]:o.Color.functional3,[r.Palette.borderNeutral]:o.Color.silverGray,[r.Palette.contentBackground1]:o.Color.openFin,[r.Palette.contentBackground2]:"#000000",[r.Palette.contentBackground3]:"#000000",[r.Palette.contentBackground4]:"#000000",[r.Palette.contentBackground5]:"#000000",[r.Palette.linkDefault]:o.Color.functional4,[r.Palette.linkHover]:o.Color.functional5};t.OpenFinLightTheme=(0,i.createTheme)(Object.assign(Object.assign({},a),{[r.Palette.background1]:o.Color.white,[r.Palette.background2]:o.Color.lightGray1,[r.Palette.background3]:o.Color.lightGray2,[r.Palette.background4]:o.Color.lightGray3,[r.Palette.background5]:o.Color.lightGray3,[r.Palette.background6]:o.Color.lightGray5,[r.Palette.brandSecondary]:o.Color.lightGray4,[r.Palette.inputBackground]:o.Color.lightGray3,[r.Palette.inputColor]:o.Color.darkGray5,[r.Palette.inputPlaceholder]:o.Color.darkGray2,[r.Palette.inputDisabled]:o.Color.neutralGray,[r.Palette.inputFocused]:o.Color.lightGray5,[r.Palette.inputBorder]:o.Color.neutralGray,[r.Palette.textDefault]:o.Color.darkGray5,[r.Palette.textHelp]:o.Color.neutralGray,[r.Palette.textInactive]:o.Color.neutralGray}),"light"),t.OpenFinDarkTheme=(0,i.createTheme)(Object.assign(Object.assign({},a),{[r.Palette.background1]:o.Color.darkGray6,[r.Palette.background2]:o.Color.darkGray5,[r.Palette.background3]:o.Color.darkGray4,[r.Palette.background4]:o.Color.darkGray3,[r.Palette.background5]:o.Color.darkGray2,[r.Palette.background6]:o.Color.darkGray1,[r.Palette.brandSecondary]:o.Color.darkGray2,[r.Palette.inputBackground]:o.Color.darkGray1,[r.Palette.inputColor]:o.Color.white,[r.Palette.inputPlaceholder]:o.Color.lightGray5,[r.Palette.inputDisabled]:o.Color.neutralGray,[r.Palette.inputFocused]:o.Color.lightGray5,[r.Palette.inputBorder]:o.Color.neutralGray,[r.Palette.textDefault]:o.Color.white,[r.Palette.textHelp]:o.Color.lightGray5,[r.Palette.textInactive]:o.Color.neutralGray}),"dark")},420:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ThemeProvider=void 0;const r=n(5893),o=n(7518),i=n(7088),a=n(1069);t.ThemeProvider=({children:e,themes:t,scheme:n,config:l,includeGlobalStyles:c=!0})=>{const s=(0,i.useTheme)({themes:t,scheme:n,config:l});return(0,r.jsx)(o.ThemeProvider,Object.assign({theme:s},{children:(0,r.jsxs)(r.Fragment,{children:[c&&(0,r.jsx)(a.GlobalStyles,{}),e]})}))}},9758:function(e,t,n){var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ContactStatusIcon=void 0;const o=n(5893),i=r(n(7518)),a=n(1333),l={available:(0,o.jsx)(a.CheckSVG,{}),away:(0,o.jsx)(a.BusySVG,{}),"do-not-disturb":(0,o.jsx)(a.DoNotDisturbSVG,{}),offline:(0,o.jsx)(a.OfflineSVG,{}),busy:null};t.ContactStatusIcon=({onlineStatus:e})=>e?(0,o.jsx)(c,Object.assign({onlineStatus:e},{children:l[e]||null})):null;const c=i.default.div`
   border: 1.6px solid ${({theme:e})=>e.palette.background1};
 
-  background: ${({onlineStatus:e,theme:t})=>"busy"===e?"#C21313":t.palette.background1};
+  background: ${({onlineStatus:e})=>"busy"===e?"#C21313":"white"};
   border-radius: 50%;
 
   height: ${({theme:e})=>e.px.large};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openfin/ui-library",
   "description": "OpenFin UI Component Library",
-  "version": "0.21.0-alpha.1690388953",
+  "version": "0.21.0-alpha.1690484356",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "repository": "github:openfin/ui-library",