[ { "id": "oj-c.SplitMenuButton", "name": "SplitMenuButton", "memberof": "oj-c", "kind": "class", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "ojcomponent": true, "isvcomponent": true, "since": "14.0.0", "longname": "oj-c.SplitMenuButton", "pack": "oj-c", "classdesc": "

\n JET Split Menu Button\n \n

\n\n

Description: A Split Menu Button combines a push button and menu button.\n\n

<oj-c-split-menu-button label=\"Copy\" onAction=\"[[action]]\" items=\"[[items]]\">\n</oj-c-split-menu-button>\n
\n\n

\n Touch End User Information\n \n

\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
TargetGestureAction
ButtonTap on action sideInvoke the action.
ButtonTap on menu sideInvoke the menu.
\n\n

\n Keyboard End User Information\n \n

\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
TargetKeyAction
Split Menu ButtonEnter or SpaceInvoke the Button action.
Split Menu ButtonDown ArrowInvoke the Button menu.
\n\n

\n Accessibility\n \n

\n\n

For accessibility, the label is used as the accessible aria label. This is required\nas persistent split menu buttons modify the label depending on the last menu item selection.\n\n

oj-c-split-menu-button follows the ARIA Authoring Practices Guide patterns for\nmenu and\nmenu button.\nNote that this is an implementation detail that may change in the future.\n\n

\nDisabled content: JET supports an accessible luminosity contrast ratio,\nas specified in WCAG 2.0 - Section 1.4.3 \"Contrast\",\nin the themes that are accessible. (See the \"Theming\" chapter of the JET Developer Guide for more information on which\nthemes are accessible.) Note that Section 1.4.3 says that text or images of text that are part of an inactive user\ninterface component have no contrast requirement. Because disabled content may not meet the minimum contrast ratio\nrequired of enabled content, it cannot be used to convey meaningful information.\n

", "scope": "static", "tagWithoutBrackets": "oj-c-split-menu-button", "tagWithBrackets": "", "domInterface": "CSplitMenuButtonElement", "ojPageTitle": "<oj-c-split-menu-button>", "camelCaseName": "SplitMenuButton", "ojPageTitlePrefix": "Element: ", "ojtsvcomponent": true, "tstype": { "target": "Type", "value": "interface CSplitMenuButtonElement extends JetElement" }, "ojsignature": [ { "target": "Type", "value": "interface CSplitMenuButtonElement extends JetElement" } ], "tsdeprecated": [ { "type": "production", "since": "17.0.0" } ], "extension": { "catalog": { "category": "Controls" }, "vbdt": { "module": "oj-c/split-menu-button" }, "oracle": { "icon": "oj-ux-ico-menu-button", "uxSpecs": [ "menu-button" ] } }, "ojmodule": "split-menu-button" }, { "id": "oj-c.SplitMenuButton#label", "name": "label", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#label", "scope": "instance", "type": { "names": [ "string" ] }, "optional": false, "ojdisplayname": "label", "ojshortdesc": "Text to show in the button.", "description": "Text to show in the button." }, { "id": "oj-c.SplitMenuButton#items", "name": "items", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#items", "scope": "instance", "type": { "names": [ "Array" ] }, "optional": true, "ojshortdesc": "Items describe the menu items rendered by the menu button.", "description": "Items describe the menu items rendered by the menu button.", "defaultvalue": "[]", "tstype": [ { "target": "Type", "value": "Array", "jsdocOverride": true } ] }, { "id": "oj-c.SplitMenuButton#tooltip", "name": "tooltip", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#tooltip", "scope": "instance", "type": { "names": [ "string" ] }, "optional": true, "ojshortdesc": "Text to show in the tooltip.", "description": "Text to show in the tooltip." }, { "id": "oj-c.SplitMenuButton#disabled", "name": "disabled", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#disabled", "scope": "instance", "type": { "names": [ "boolean" ] }, "optional": true, "ojshortdesc": "Specifies that the button element should be disabled.", "description": "Specifies that the button element should be disabled.", "defaultvalue": false }, { "id": "oj-c.SplitMenuButton#size", "name": "size", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#size", "scope": "instance", "type": { "names": [ "\"sm\"", "\"md\"", "\"lg\"" ] }, "optional": true, "ojshortdesc": "Size of button", "description": "Size of button", "ojvalues": [ { "name": "sm", "description": "Display a small button.", "displayName": "Small", "type": { "names": [ "string" ] } }, { "name": "md", "description": "Display a default size button.", "displayName": "Medium", "type": { "names": [ "string" ] } }, { "name": "lg", "description": "Display a large button.", "displayName": "Large", "type": { "names": [ "string" ] } } ], "ojvalueskeeporder": true, "defaultvalue": "'md'" }, { "id": "oj-c.SplitMenuButton#width", "name": "width", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#width", "scope": "instance", "type": { "names": [ "number|string" ] }, "optional": true, "ojshortdesc": "Specifies that the button style width", "description": "Specifies that the button style width" }, { "id": "oj-c.SplitMenuButton#chroming", "name": "chroming", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "member", "longname": "oj-c.SplitMenuButton#chroming", "scope": "instance", "type": { "names": [ "\"solid\"", "\"outlined\"", "\"callToAction\"" ] }, "optional": true, "ojshortdesc": "Indicates in what states the button has chromings in background and border.", "description": "Indicates in what states the button has chromings in background and border.", "ojvalues": [ { "name": "outlined", "description": "Outlined buttons are salient, but lighter weight than solid buttons. Outlined buttons are useful for secondary actions.", "displayName": "Outlined", "type": { "names": [ "string" ] } }, { "name": "solid", "description": "Solid buttons stand out, and direct the user's attention to the most important actions in the UI.", "displayName": "Solid", "type": { "names": [ "string" ] } }, { "name": "callToAction", "description": "A Call To Action (CTA) button guides the user to take or complete the action that is the main goal of the page or page section. There should only be one CTA button on a page at any given time.", "displayName": "Call To Action", "type": { "names": [ "string" ] } } ], "ojvalueskeeporder": true, "defaultvalue": "'outlined'" }, { "id": "oj-c.SplitMenuButton#focus", "name": "focus", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "function", "longname": "oj-c.SplitMenuButton#focus", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "description": "" }, { "id": "oj-c.SplitMenuButton#blur", "name": "blur", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "function", "longname": "oj-c.SplitMenuButton#blur", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "description": "" }, { "id": "oj-c.SplitMenuButton#click", "name": "click", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "function", "longname": "oj-c.SplitMenuButton#click", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "description": "" }, { "id": "oj-c.SplitMenuButton#setProperty", "name": "setProperty", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "function", "longname": "oj-c.SplitMenuButton#setProperty", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "ojshortdesc": "Sets a property or a single subproperty for complex properties and notifies the component of the change, triggering a corresponding event.", "description": "Sets a property or a single subproperty for complex properties and notifies the component of the change, triggering a corresponding event.", "params": [ { "name": "property", "description": "The property name to set. Supports dot notation for subproperty access.", "type": { "names": [ "string" ] } }, { "name": "value", "description": "The new value to set the property to.", "type": { "names": [ "any" ] } } ] }, { "id": "oj-c.SplitMenuButton#getProperty", "name": "getProperty", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "function", "longname": "oj-c.SplitMenuButton#getProperty", "scope": "instance", "returns": [ { "type": { "names": [ "any" ] } } ], "ojshortdesc": "Retrieves the value of a property or a subproperty.", "description": "Retrieves the value of a property or a subproperty.", "params": [ { "name": "property", "description": "The property name to get. Supports dot notation for subproperty access.", "type": { "names": [ "string" ] } } ] }, { "id": "oj-c.SplitMenuButton#setProperties", "name": "setProperties", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "kind": "function", "longname": "oj-c.SplitMenuButton#setProperties", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "ojshortdesc": "Performs a batch set of properties.", "description": "Performs a batch set of properties.", "params": [ { "name": "properties", "description": "An object containing the property and value pairs to set.", "type": { "names": [ "object" ] } } ] }, { "id": "oj-c.SplitMenuButton#event:ojMenuAction", "name": "ojMenuAction", "kind": "event", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "longname": "oj-c.SplitMenuButton#event:ojMenuAction", "scope": "instance", "bubbles": true, "ojshortdesc": "Triggered when a menu item is clicked, whether by keyboard, mouse, or touch events. Detail indicates which menu item was clicked.", "description": "

Note: The event detail contains the following properties: [oj-c.SplitMenuButton.MenuItemSelectionDetail]{@link oj-c.SplitMenuButton.MenuItemSelectionDetail}

Triggered when a menu item is clicked, whether by keyboard, mouse, or touch events. Detail indicates which menu item was clicked." }, { "id": "oj-c.SplitMenuButton#event:ojAction", "name": "ojAction", "kind": "event", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "longname": "oj-c.SplitMenuButton#event:ojAction", "scope": "instance", "bubbles": true, "ojshortdesc": "Triggered when a button is clicked, whether by keyboard, mouse, or touch events. To meet accessibility requirements, the only supported way to react to the click of a button is to listen for this event.", "description": "Triggered when a button is clicked, whether by keyboard, mouse, or touch events. To meet accessibility requirements, the only supported way to react to the click of a button is to listen for this event." }, { "id": "oj-c.SplitMenuButton.touchDoc", "name": "touchDoc", "kind": "member", "longname": "oj-c.SplitMenuButton.touchDoc", "description": "\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
TargetGestureAction
ButtonTap on action sideInvoke the action.
ButtonTap on menu sideInvoke the menu.
", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "ojfragment": true }, { "id": "oj-c.SplitMenuButton.keyboardDoc", "name": "keyboardDoc", "kind": "member", "longname": "oj-c.SplitMenuButton.keyboardDoc", "description": "\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
TargetKeyAction
Split Menu ButtonEnter or SpaceInvoke the Button action.
Split Menu ButtonDown ArrowInvoke the Button menu.
", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "ojfragment": true }, { "id": "oj-c.SplitMenuButton.MenuSeparator", "name": "MenuSeparator", "kind": "typedef", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "longname": "oj-c.SplitMenuButton.MenuSeparator", "type": { "names": [ "Object" ] }, "scope": "static", "description": "Specifies a menu separator: { type: \"separator\" }.", "properties": [ { "name": "type", "description": "Specifies a separator menu item.", "optional": false, "type": { "names": [ "\"separator\"", "\"divider\"" ] }, "tsdeprecated": [ { "type": "deprecated", "since": "17.0.0", "target": "propertyValue", "value": [ "divider" ], "description": "Use 'separator' instead." } ], "ojshortdesc": "Specifies a separator menu item." } ] }, { "id": "oj-c.SplitMenuButton.MenuItem", "name": "MenuItem", "kind": "typedef", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "longname": "oj-c.SplitMenuButton.MenuItem", "type": { "names": [ "Object" ] }, "scope": "static", "description": "Specifies a standard menu item.", "properties": [ { "name": "type", "description": "Specifies a standard menu item.", "optional": true, "type": { "names": [ "\"item\"" ] }, "ojshortdesc": "Specifies a standard menu item." }, { "name": "label", "description": "The menu item label.", "optional": false, "type": { "names": [ "string" ] }, "ojshortdesc": "The menu item label." }, { "name": "key", "description": "A unique key associated with the menu item.", "optional": false, "type": { "names": [ "string" ] }, "ojshortdesc": "A unique key associated with the menu item." }, { "name": "disabled", "description": "Specifies if the menu item is disabled (enabled by default).", "optional": true, "type": { "names": [ "boolean" ] }, "ojshortdesc": "Specifies if the menu item is disabled (enabled by default)." }, { "name": "onAction", "description": "Optional callback function associated with the menu item.", "optional": true, "type": { "names": [ "function" ] }, "ojshortdesc": "Optional callback function associated with the menu item." }, { "name": "startIcon", "description": "Optional icon to render at the start of the menu item.", "optional": true, "type": { "names": [ "object" ] }, "tstype": [ { "target": "Type", "value": "{ type?: 'class'; class: string; }|{ type: 'img'; src: string; }", "jsdocOverride": true, "for": "startIcon" } ], "ojshortdesc": "Optional icon to render at the start of the menu item." }, { "name": "endIcon", "description": "Optional icon to render at the end of the menu item.", "optional": true, "type": { "names": [ "object" ] }, "tstype": [ { "target": "Type", "value": "{ type?: 'class'; class: string; }|{ type: 'img'; src: string; }", "jsdocOverride": true, "for": "endIcon" } ], "ojshortdesc": "Optional icon to render at the end of the menu item." }, { "name": "variant", "description": "Specifies the menu item behavior.", "optional": true, "type": { "names": [ "\"standard\"", "\"destructive\"" ] }, "ojshortdesc": "Specifies the menu item behavior." } ] }, { "id": "oj-c.SplitMenuButton.MenuItems", "name": "MenuItems", "kind": "typedef", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "longname": "oj-c.SplitMenuButton.MenuItems", "type": { "names": [ "Object" ] }, "scope": "static", "description": "", "tstype": [ { "target": "Type", "value": "oj-c.SplitMenuButton.MenuSeparator|oj-c.SplitMenuButton.MenuItem", "jsdocOverride": true } ] }, { "id": "oj-c.SplitMenuButton.MenuItemSelectionDetail", "name": "MenuItemSelectionDetail", "kind": "typedef", "memberof": "oj-c.SplitMenuButton", "meta": { "filename": "split-menu-button.tsx", "path": "web/components/oj-c/split-menu-button" }, "longname": "oj-c.SplitMenuButton.MenuItemSelectionDetail", "type": { "names": [ "Object" ] }, "scope": "static", "description": "", "properties": [ { "name": "key", "optional": false, "type": { "names": [ "string" ] } } ] } ]