mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-16 10:51:06 +00:00
chore: v11 OverflowMenu
Size `xl` changed to `lg`. For better compatibility with existing codebases size `xl` is still supported.
This commit is contained in:
parent
9f32d57353
commit
ff8d54b38e
6 changed files with 8 additions and 8 deletions
|
@ -2609,7 +2609,7 @@ None.
|
||||||
| buttonRef | No | <code>let</code> | Yes | <code>null | HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the trigger button element |
|
| buttonRef | No | <code>let</code> | Yes | <code>null | HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the trigger button element |
|
||||||
| icon | No | <code>let</code> | Yes | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render.<br />Defaults to `<OverflowMenuVertical />` |
|
| icon | No | <code>let</code> | Yes | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render.<br />Defaults to `<OverflowMenuVertical />` |
|
||||||
| open | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the menu |
|
| open | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the menu |
|
||||||
| size | No | <code>let</code> | No | <code>"sm" | "xl"</code> | <code>undefined</code> | Specify the size of the overflow menu |
|
| size | No | <code>let</code> | No | <code>"sm" | "lg"</code> | <code>undefined</code> | Specify the size of the overflow menu |
|
||||||
| direction | No | <code>let</code> | No | <code>"top" | "bottom"</code> | <code>"bottom"</code> | Specify the direction of the overflow menu relative to the button |
|
| direction | No | <code>let</code> | No | <code>"top" | "bottom"</code> | <code>"bottom"</code> | Specify the direction of the overflow menu relative to the button |
|
||||||
| light | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the light variant |
|
| light | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the light variant |
|
||||||
| flipped | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to flip the menu relative to the button |
|
| flipped | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to flip the menu relative to the button |
|
||||||
|
|
|
@ -7984,7 +7984,7 @@
|
||||||
"name": "size",
|
"name": "size",
|
||||||
"kind": "let",
|
"kind": "let",
|
||||||
"description": "Specify the size of the overflow menu",
|
"description": "Specify the size of the overflow menu",
|
||||||
"type": "\"sm\" | \"xl\"",
|
"type": "\"sm\" | \"lg\"",
|
||||||
"isFunction": false,
|
"isFunction": false,
|
||||||
"isFunctionDeclaration": false,
|
"isFunctionDeclaration": false,
|
||||||
"isRequired": false,
|
"isRequired": false,
|
||||||
|
|
|
@ -42,7 +42,7 @@ Set `flipped` to `true` for the menu to be positioned to the left of the button.
|
||||||
<OverflowMenuItem danger text="Delete service" />
|
<OverflowMenuItem danger text="Delete service" />
|
||||||
</OverflowMenu>
|
</OverflowMenu>
|
||||||
|
|
||||||
## Extra-large size
|
## Large size
|
||||||
|
|
||||||
<OverflowMenu size="xl">
|
<OverflowMenu size="xl">
|
||||||
<OverflowMenuItem text="Manage credentials" />
|
<OverflowMenuItem text="Manage credentials" />
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Specify the size of the overflow menu
|
* Specify the size of the overflow menu
|
||||||
* @type {"sm" | "xl"}
|
* @type {"sm" | "lg"}
|
||||||
*/
|
*/
|
||||||
export let size = undefined;
|
export let size = undefined;
|
||||||
|
|
||||||
|
@ -199,7 +199,7 @@
|
||||||
class:bx--overflow-menu--open="{open}"
|
class:bx--overflow-menu--open="{open}"
|
||||||
class:bx--overflow-menu--light="{light}"
|
class:bx--overflow-menu--light="{light}"
|
||||||
class:bx--overflow-menu--sm="{size === 'sm'}"
|
class:bx--overflow-menu--sm="{size === 'sm'}"
|
||||||
class:bx--overflow-menu--xl="{size === 'xl'}"
|
class:bx--overflow-menu--lg="{size === 'lg'}"
|
||||||
{...$$restProps}
|
{...$$restProps}
|
||||||
on:click
|
on:click
|
||||||
on:click="{({ target }) => {
|
on:click="{({ target }) => {
|
||||||
|
@ -254,7 +254,7 @@
|
||||||
class:bx--overflow-menu-options--open="{open}"
|
class:bx--overflow-menu-options--open="{open}"
|
||||||
class:bx--overflow-menu-options--light="{light}"
|
class:bx--overflow-menu-options--light="{light}"
|
||||||
class:bx--overflow-menu-options--sm="{size === 'sm'}"
|
class:bx--overflow-menu-options--sm="{size === 'sm'}"
|
||||||
class:bx--overflow-menu-options--xl="{size === 'xl'}"
|
class:bx--overflow-menu-options--lg="{size === 'lg'}"
|
||||||
class:bx--breadcrumb-menu-options="{!!ctxBreadcrumbItem}"
|
class:bx--breadcrumb-menu-options="{!!ctxBreadcrumbItem}"
|
||||||
class="{menuOptionsClass}"
|
class="{menuOptionsClass}"
|
||||||
>
|
>
|
||||||
|
|
|
@ -34,7 +34,7 @@
|
||||||
<OverflowMenuItem danger text="Delete service" />
|
<OverflowMenuItem danger text="Delete service" />
|
||||||
</OverflowMenu>
|
</OverflowMenu>
|
||||||
|
|
||||||
<OverflowMenu size="xl">
|
<OverflowMenu size="lg">
|
||||||
<OverflowMenuItem text="Manage credentials" />
|
<OverflowMenuItem text="Manage credentials" />
|
||||||
<OverflowMenuItem
|
<OverflowMenuItem
|
||||||
href="https://cloud.ibm.com/docs/api-gateway/"
|
href="https://cloud.ibm.com/docs/api-gateway/"
|
||||||
|
|
2
types/OverflowMenu/OverflowMenu.svelte.d.ts
vendored
2
types/OverflowMenu/OverflowMenu.svelte.d.ts
vendored
|
@ -8,7 +8,7 @@ export interface OverflowMenuProps extends RestProps {
|
||||||
* Specify the size of the overflow menu
|
* Specify the size of the overflow menu
|
||||||
* @default undefined
|
* @default undefined
|
||||||
*/
|
*/
|
||||||
size?: "sm" | "xl";
|
size?: "sm" | "lg";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Specify the direction of the overflow menu relative to the button
|
* Specify the direction of the overflow menu relative to the button
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue