@patternfly/chatbot 6.3.0-prerelease.14 → 6.3.0-prerelease.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.d.ts +2 -0
  2. package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.js +4 -2
  3. package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.d.ts +2 -0
  4. package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.js +4 -2
  5. package/package.json +1 -1
  6. package/src/ChatbotHeader/ChatbotHeaderSelectorDropdown.tsx +6 -0
package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.d.ts CHANGED
@@ -17,6 +17,8 @@ export interface ChatbotHeaderSelectorDropdownProps extends Omit<DropdownProps,
17
17
  isCompact?: boolean;
18
18
  /** Additional props passed to toggle */
19
19
  toggleProps?: MenuToggleProps;
20
+ /** Custom width for the dropdown */
21
+ dropdownWidth?: string;
20
22
  }
21
23
  export declare const ChatbotHeaderSelectorDropdown: FunctionComponent<ChatbotHeaderSelectorDropdownProps>;
22
24
  export default ChatbotHeaderSelectorDropdown;
package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.js CHANGED
@@ -16,12 +16,14 @@ const jsx_runtime_1 = require("react/jsx-runtime");
16
16
  const react_1 = require("react");
17
17
  const react_core_1 = require("@patternfly/react-core");
18
18
  const ChatbotHeaderSelectorDropdown = (_a) => {
19
- var { value, className, children, onSelect, tooltipProps, tooltipContent = 'Select model', menuToggleAriaLabel, isCompact, toggleProps } = _a, props = __rest(_a, ["value", "className", "children", "onSelect", "tooltipProps", "tooltipContent", "menuToggleAriaLabel", "isCompact", "toggleProps"]);
19
+ var { value, className, children, onSelect, tooltipProps, tooltipContent = 'Select model', menuToggleAriaLabel, isCompact, toggleProps, dropdownWidth } = _a, props = __rest(_a, ["value", "className", "children", "onSelect", "tooltipProps", "tooltipContent", "menuToggleAriaLabel", "isCompact", "toggleProps", "dropdownWidth"]);
20
20
  const [isOptionsMenuOpen, setIsOptionsMenuOpen] = (0, react_1.useState)(false);
21
21
  const [defaultAriaLabel, setDefaultAriaLabel] = (0, react_1.useState)('Select model');
22
22
  const toggle = (toggleRef) => ((0, jsx_runtime_1.jsx)(react_core_1.Tooltip, Object.assign({ className: "pf-chatbot__tooltip", content: tooltipContent, position: "bottom",
23
23
  // prevents VO announcements of both aria label and tooltip
24
- aria: "none" }, tooltipProps, { children: (0, jsx_runtime_1.jsx)(react_core_1.MenuToggle, Object.assign({ variant: "secondary", "aria-label": menuToggleAriaLabel !== null && menuToggleAriaLabel !== void 0 ? menuToggleAriaLabel : defaultAriaLabel, ref: toggleRef, isExpanded: isOptionsMenuOpen, onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen), size: isCompact ? 'sm' : undefined, className: `${isCompact ? 'pf-m-compact' : ''}` }, toggleProps, { children: value })) })));
24
+ aria: "none" }, tooltipProps, { children: (0, jsx_runtime_1.jsx)(react_core_1.MenuToggle, Object.assign({ variant: "secondary", "aria-label": menuToggleAriaLabel !== null && menuToggleAriaLabel !== void 0 ? menuToggleAriaLabel : defaultAriaLabel, ref: toggleRef, isExpanded: isOptionsMenuOpen, onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen), size: isCompact ? 'sm' : undefined, className: `${isCompact ? 'pf-m-compact' : ''}` }, toggleProps, { style: {
25
+ width: dropdownWidth
26
+ }, children: value })) })));
25
27
  return ((0, jsx_runtime_1.jsx)(react_core_1.Dropdown, Object.assign({ className: `pf-chatbot__selections ${className !== null && className !== void 0 ? className : ''}`, isOpen: isOptionsMenuOpen, onSelect: (e, value) => {
26
28
  onSelect && onSelect(e, value);
27
29
  setDefaultAriaLabel(`Select model: ${value}`);
package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.d.ts CHANGED
@@ -17,6 +17,8 @@ export interface ChatbotHeaderSelectorDropdownProps extends Omit<DropdownProps,
17
17
  isCompact?: boolean;
18
18
  /** Additional props passed to toggle */
19
19
  toggleProps?: MenuToggleProps;
20
+ /** Custom width for the dropdown */
21
+ dropdownWidth?: string;
20
22
  }
21
23
  export declare const ChatbotHeaderSelectorDropdown: FunctionComponent<ChatbotHeaderSelectorDropdownProps>;
22
24
  export default ChatbotHeaderSelectorDropdown;
package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.js CHANGED
@@ -13,12 +13,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import { useState } from 'react';
14
14
  import { Tooltip, Dropdown, MenuToggle } from '@patternfly/react-core';
15
15
  export const ChatbotHeaderSelectorDropdown = (_a) => {
16
- var { value, className, children, onSelect, tooltipProps, tooltipContent = 'Select model', menuToggleAriaLabel, isCompact, toggleProps } = _a, props = __rest(_a, ["value", "className", "children", "onSelect", "tooltipProps", "tooltipContent", "menuToggleAriaLabel", "isCompact", "toggleProps"]);
16
+ var { value, className, children, onSelect, tooltipProps, tooltipContent = 'Select model', menuToggleAriaLabel, isCompact, toggleProps, dropdownWidth } = _a, props = __rest(_a, ["value", "className", "children", "onSelect", "tooltipProps", "tooltipContent", "menuToggleAriaLabel", "isCompact", "toggleProps", "dropdownWidth"]);
17
17
  const [isOptionsMenuOpen, setIsOptionsMenuOpen] = useState(false);
18
18
  const [defaultAriaLabel, setDefaultAriaLabel] = useState('Select model');
19
19
  const toggle = (toggleRef) => (_jsx(Tooltip, Object.assign({ className: "pf-chatbot__tooltip", content: tooltipContent, position: "bottom",
20
20
  // prevents VO announcements of both aria label and tooltip
21
- aria: "none" }, tooltipProps, { children: _jsx(MenuToggle, Object.assign({ variant: "secondary", "aria-label": menuToggleAriaLabel !== null && menuToggleAriaLabel !== void 0 ? menuToggleAriaLabel : defaultAriaLabel, ref: toggleRef, isExpanded: isOptionsMenuOpen, onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen), size: isCompact ? 'sm' : undefined, className: `${isCompact ? 'pf-m-compact' : ''}` }, toggleProps, { children: value })) })));
21
+ aria: "none" }, tooltipProps, { children: _jsx(MenuToggle, Object.assign({ variant: "secondary", "aria-label": menuToggleAriaLabel !== null && menuToggleAriaLabel !== void 0 ? menuToggleAriaLabel : defaultAriaLabel, ref: toggleRef, isExpanded: isOptionsMenuOpen, onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen), size: isCompact ? 'sm' : undefined, className: `${isCompact ? 'pf-m-compact' : ''}` }, toggleProps, { style: {
22
+ width: dropdownWidth
23
+ }, children: value })) })));
22
24
  return (_jsx(Dropdown, Object.assign({ className: `pf-chatbot__selections ${className !== null && className !== void 0 ? className : ''}`, isOpen: isOptionsMenuOpen, onSelect: (e, value) => {
23
25
  onSelect && onSelect(e, value);
24
26
  setDefaultAriaLabel(`Select model: ${value}`);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/chatbot",
3
- "version": "6.3.0-prerelease.14",
3
+ "version": "6.3.0-prerelease.15",
4
4
  "description": "This library provides React components based on PatternFly 6 that can be used to build chatbots.",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
package/src/ChatbotHeader/ChatbotHeaderSelectorDropdown.tsx CHANGED
@@ -28,6 +28,8 @@ export interface ChatbotHeaderSelectorDropdownProps extends Omit<DropdownProps,
28
28
  isCompact?: boolean;
29
29
  /** Additional props passed to toggle */
30
30
  toggleProps?: MenuToggleProps;
31
+ /** Custom width for the dropdown */
32
+ dropdownWidth?: string;
31
33
  }
32
34
 
33
35
  export const ChatbotHeaderSelectorDropdown: FunctionComponent<ChatbotHeaderSelectorDropdownProps> = ({
@@ -40,6 +42,7 @@ export const ChatbotHeaderSelectorDropdown: FunctionComponent<ChatbotHeaderSelec
40
42
  menuToggleAriaLabel,
41
43
  isCompact,
42
44
  toggleProps,
45
+ dropdownWidth,
43
46
  ...props
44
47
  }: ChatbotHeaderSelectorDropdownProps) => {
45
48
  const [isOptionsMenuOpen, setIsOptionsMenuOpen] = useState(false);
@@ -63,6 +66,9 @@ export const ChatbotHeaderSelectorDropdown: FunctionComponent<ChatbotHeaderSelec
63
66
  size={isCompact ? 'sm' : undefined}
64
67
  className={`${isCompact ? 'pf-m-compact' : ''}`}
65
68
  {...toggleProps}
69
+ style={{
70
+ width: dropdownWidth
71
+ }}
66
72
  >
67
73
  {value}
68
74
  </MenuToggle>