diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index 245a25e9..bc2c5cf2 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -3014,6 +3014,7 @@ import { OverflowMenu } from "carbon-components-svelte";
| Prop name | Type | Default value | Description |
| :--------------- | :------------------------------------------------------------------ | :--------------------------------- | :----------------------------------------------------------------- |
+| size | "sm" | "xl"
| -- | Specify the size of the overflow menu. |
| direction | "top" | "bottom"
| `"bottom"` | Specify the direction of the overflow menu relative to the button. |
| open | boolean
| `false` | Set to `true` to open the menu. |
| light | boolean
| `false` | Set to `true` to enable the light variant. |
diff --git a/docs/package.json b/docs/package.json
index 0ddbd352..2aff263e 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -12,7 +12,7 @@
"@carbon/themes": "^10.20.0",
"@sveltech/routify": "^1.9.9",
"autoprefixer": "^10.0.1",
- "carbon-components": "^10.22.0",
+ "carbon-components": "^10.23.0",
"carbon-components-svelte": "../",
"clipboard-copy": "^3.1.0",
"mdsvex": "^0.8.8",
diff --git a/docs/src/PUBLIC_API.json b/docs/src/PUBLIC_API.json
index 93f06fef..4e531a64 100644
--- a/docs/src/PUBLIC_API.json
+++ b/docs/src/PUBLIC_API.json
@@ -8756,6 +8756,14 @@
"OverflowMenu": {
"moduleName": "OverflowMenu",
"props": [
+ [
+ "size",
+ {
+ "kind": "let",
+ "type": "\"sm\" | \"xl\"",
+ "description": "Specify the size of the overflow menu"
+ }
+ ],
[
"direction",
{
@@ -8858,14 +8866,14 @@
{
"attributes": [
{
- "start": 4805,
- "end": 4816,
+ "start": 5113,
+ "end": 5124,
"type": "Attribute",
"name": "name",
"value": [
{
- "start": 4811,
- "end": 4815,
+ "start": 5119,
+ "end": 5123,
"type": "Text",
"raw": "menu",
"data": "menu"
@@ -8875,39 +8883,39 @@
],
"children": [
{
- "start": 4817,
- "end": 4822,
+ "start": 5125,
+ "end": 5130,
"type": "Text",
"raw": "\n ",
"data": "\n "
},
{
- "start": 4822,
- "end": 4985,
+ "start": 5130,
+ "end": 5293,
"type": "InlineComponent",
"name": "svelte:component",
"attributes": [
{
- "start": 4866,
- "end": 4896,
+ "start": 5174,
+ "end": 5204,
"type": "Attribute",
"name": "aria-label",
"value": [
{
- "start": 4878,
- "end": 4895,
+ "start": 5186,
+ "end": 5203,
"type": "MustacheTag",
"expression": {
"type": "Identifier",
- "start": 4879,
- "end": 4894,
+ "start": 5187,
+ "end": 5202,
"loc": {
"start": {
- "line": 206,
+ "line": 216,
"column": 19
},
"end": {
- "line": 206,
+ "line": 216,
"column": 34
}
},
@@ -8917,26 +8925,26 @@
]
},
{
- "start": 4903,
- "end": 4928,
+ "start": 5211,
+ "end": 5236,
"type": "Attribute",
"name": "title",
"value": [
{
- "start": 4910,
- "end": 4927,
+ "start": 5218,
+ "end": 5235,
"type": "MustacheTag",
"expression": {
"type": "Identifier",
- "start": 4911,
- "end": 4926,
+ "start": 5219,
+ "end": 5234,
"loc": {
"start": {
- "line": 207,
+ "line": 217,
"column": 14
},
"end": {
- "line": 207,
+ "line": 217,
"column": 29
}
},
@@ -8946,33 +8954,33 @@
]
},
{
- "start": 4935,
- "end": 4978,
+ "start": 5243,
+ "end": 5286,
"type": "Attribute",
"name": "class",
"value": [
{
- "start": 4942,
- "end": 4967,
+ "start": 5250,
+ "end": 5275,
"type": "Text",
"raw": "bx--overflow-menu__icon ",
"data": "bx--overflow-menu__icon "
},
{
- "start": 4966,
- "end": 4977,
+ "start": 5274,
+ "end": 5285,
"type": "MustacheTag",
"expression": {
"type": "Identifier",
- "start": 4967,
- "end": 4976,
+ "start": 5275,
+ "end": 5284,
"loc": {
"start": {
- "line": 208,
+ "line": 218,
"column": 38
},
"end": {
- "line": 208,
+ "line": 218,
"column": 47
}
},
@@ -8985,15 +8993,15 @@
"children": [],
"expression": {
"type": "Identifier",
- "start": 4853,
- "end": 4857,
+ "start": 5161,
+ "end": 5165,
"loc": {
"start": {
- "line": 205,
+ "line": 215,
"column": 13
},
"end": {
- "line": 205,
+ "line": 215,
"column": 17
}
},
@@ -9001,8 +9009,8 @@
}
},
{
- "start": 4985,
- "end": 4988,
+ "start": 5293,
+ "end": 5296,
"type": "Text",
"raw": "\n ",
"data": "\n "
@@ -9026,8 +9034,8 @@
[
"click",
{
- "start": 4327,
- "end": 4335,
+ "start": 4635,
+ "end": 4643,
"type": "EventHandler",
"name": "click",
"modifiers": [],
@@ -9037,8 +9045,8 @@
[
"mouseover",
{
- "start": 4451,
- "end": 4463,
+ "start": 4759,
+ "end": 4771,
"type": "EventHandler",
"name": "mouseover",
"modifiers": [],
@@ -9048,8 +9056,8 @@
[
"mouseenter",
{
- "start": 4466,
- "end": 4479,
+ "start": 4774,
+ "end": 4787,
"type": "EventHandler",
"name": "mouseenter",
"modifiers": [],
@@ -9059,8 +9067,8 @@
[
"mouseleave",
{
- "start": 4482,
- "end": 4495,
+ "start": 4790,
+ "end": 4803,
"type": "EventHandler",
"name": "mouseleave",
"modifiers": [],
@@ -9070,8 +9078,8 @@
[
"keydown",
{
- "start": 4498,
- "end": 4508,
+ "start": 4806,
+ "end": 4816,
"type": "EventHandler",
"name": "keydown",
"modifiers": [],
diff --git a/docs/src/pages/components/OverflowMenu.svx b/docs/src/pages/components/OverflowMenu.svx
index 553dbb1f..89ba3f5f 100644
--- a/docs/src/pages/components/OverflowMenu.svx
+++ b/docs/src/pages/components/OverflowMenu.svx
@@ -4,6 +4,7 @@ components: ["OverflowMenu", "OverflowMenuItem"]
@@ -31,6 +32,22 @@ components: ["OverflowMenu", "OverflowMenuItem"]
+### Extra-large size
+
+
+
+
+
+
+
+### Small size
+
+
+
+
+
+
+
### Custom primary focus
By default, the first overflow menu item is focused when opening the dropdown.
@@ -41,6 +58,14 @@ By default, the first overflow menu item is focused when opening the dropdown.
+### Custom trigger icon
+
+
+
+
+
+
+
### Custom trigger slot
diff --git a/docs/yarn.lock b/docs/yarn.lock
index f6fda509..84d117f5 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -771,15 +771,15 @@ caniuse-lite@^1.0.30001135, caniuse-lite@^1.0.30001137:
integrity sha512-VAy5RHDfTJhpxnDdp2n40GPPLp3KqNrXz1QqFv4J64HvArKs8nuNMOWkB3ICOaBTU/Aj4rYAo/ytdQDDFF/Pug==
carbon-components-svelte@../:
- version "0.17.0"
+ version "0.21.0"
dependencies:
carbon-icons-svelte "^10.17.0"
flatpickr "4.6.3"
-carbon-components@^10.22.0:
- version "10.22.0"
- resolved "https://registry.npmjs.org/carbon-components/-/carbon-components-10.22.0.tgz#866791ca8e3f651054543d63f6a898cff6bcacf9"
- integrity sha512-0cADWQf1e+6YsxXnjEz630Z7GZa3Z1ssO0UW/HnnJy03Dr+qdT3o6sIgSqObYLddJliAVcjeTlwJshZ9K4bWJQ==
+carbon-components@^10.23.0:
+ version "10.23.0"
+ resolved "https://registry.npmjs.org/carbon-components/-/carbon-components-10.23.0.tgz#56bdfffa95f518237a0bee2961b955c367a8b4c4"
+ integrity sha512-Meq//PMtSnAwoMKr2BpiOmjAivpSzc1D2Q0r3mudkQsz9dhYOzBQAsfEfoh8WKbDiD7rHWUM2fNkw0yQl4dahA==
dependencies:
flatpickr "4.6.1"
lodash.debounce "^4.0.8"
diff --git a/src/OverflowMenu/OverflowMenu.svelte b/src/OverflowMenu/OverflowMenu.svelte
index edae7c7a..14db7c77 100644
--- a/src/OverflowMenu/OverflowMenu.svelte
+++ b/src/OverflowMenu/OverflowMenu.svelte
@@ -1,4 +1,10 @@