@rcarls/rc-fab-menu 0.4.2 → 0.6.0

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 (11) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/README.md +4 -4
  3. package/dist/custom-elements.json +8 -2
  4. package/dist/{rc-fab-menu-BhXCZQuw.js → rc-fab-menu-DqKyQYNn.js} +14 -14
  5. package/dist/{rc-fab-menu-BhXCZQuw.js.map → rc-fab-menu-DqKyQYNn.js.map} +1 -1
  6. package/dist/rc-fab-menu-define.js +1 -1
  7. package/dist/rc-fab-menu.js +1 -1
  8. package/dist/types/packages/rc-fab-menu/src/index.d.ts +1 -1
  9. package/dist/types/packages/rc-fab-menu/src/rc-fab-menu.d.ts +2 -2
  10. package/package.json +4 -4
  11. package/dist/types/packages/rc-fab-menu/src/rc-fab-menu.test.d.ts +0 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,33 @@
1
1
  # @rcarls/rc-fab-menu
2
2
 
3
+ ## 0.6.0
4
+
5
+ ### Patch Changes
6
+
7
+ - 57370e4: Align component metadata, aggregate framework typings, development-time native-child
8
+ validation, controlled menu state, package declarations, and public documentation before the
9
+ next release.
10
+ - Updated dependencies [7382c71]
11
+ - Updated dependencies [6683eb9]
12
+ - Updated dependencies [ee7ba6c]
13
+ - Updated dependencies [30eb232]
14
+ - Updated dependencies [30eb232]
15
+ - Updated dependencies [57370e4]
16
+ - @rcarls/rc-menu@0.6.0
17
+ - @rcarls/rc-menu-button@0.6.0
18
+ - @rcarls/rc-common@0.6.0
19
+
20
+ ## 0.5.0
21
+
22
+ ### Patch Changes
23
+
24
+ - Updated dependencies [4ae2ef0]
25
+ - Updated dependencies [d33b92f]
26
+ - Updated dependencies [689340c]
27
+ - @rcarls/rc-common@0.5.0
28
+ - @rcarls/rc-menu-button@0.5.0
29
+ - @rcarls/rc-menu@0.5.0
30
+
3
31
  ## 0.4.2
4
32
 
5
33
  ### Patch Changes
package/README.md CHANGED
@@ -44,10 +44,10 @@ standalone menu package.
44
44
  `rc-fab-menu` inherits `open`, `defaultOpen`, `openMenu()`, `closeMenu()`, and `toggleMenu()`
45
45
  from `rc-menu-button` unchanged. It also overrides `placement`'s default (see below).
46
46
 
47
- | Property | Attribute | Type | Default | Description |
48
- | ----------- | ----------- | ------------------------------------------------------------ | -------------- | ------------------------------------------------------------------------------------------------------------------------------ |
49
- | `position` | `position` | `'bottom-end' \| 'bottom-start' \| 'top-end' \| 'top-start'` | `'bottom-end'` | Viewport corner where the trigger is anchored. |
50
- | `placement` | `placement` | `AnchorPlacement` | `'top-end'` | Preferred popup placement. Overrides `rc-menu-button`'s `'bottom-start'` default so the action menu opens above the trigger. |
47
+ | Property | Attribute | Type | Default | Description |
48
+ | ----------- | ----------- | ------------------------------------------------------------ | -------------- | ---------------------------------------------------------------------------------------------------------------------------- |
49
+ | `position` | `position` | `'bottom-end' \| 'bottom-start' \| 'top-end' \| 'top-start'` | `'bottom-end'` | Viewport corner where the trigger is anchored. |
50
+ | `placement` | `placement` | `AnchorPlacement` | `'top-end'` | Preferred popup placement. Overrides `rc-menu-button`'s `'bottom-start'` default so the action menu opens above the trigger. |
51
51
 
52
52
  | Event | Detail | Description |
53
53
  | -------------------- | ------------------- | ------------------------------------------------------------ |
package/dist/custom-elements.json CHANGED
@@ -35,7 +35,7 @@
35
35
  "name": "*",
36
36
  "declaration": {
37
37
  "name": "*",
38
- "module": "src/rc-fab-menu"
38
+ "module": "src/rc-fab-menu.js"
39
39
  }
40
40
  }
41
41
  ]
@@ -249,7 +249,13 @@
249
249
  "text": "void"
250
250
  }
251
251
  },
252
- "description": "Dispatches the `rc-fab-menu-toggle` bubbling composed event with the current open state."
252
+ "parameters": [
253
+ {
254
+ "name": "open",
255
+ "default": "this.open"
256
+ }
257
+ ],
258
+ "description": "Dispatches the `rc-fab-menu-toggle` bubbling composed event with the requested open state."
253
259
  }
254
260
  ],
255
261
  "events": [
package/dist/{rc-fab-menu-BhXCZQuw.js → rc-fab-menu-DqKyQYNn.js} RENAMED
@@ -132,35 +132,35 @@ const d = u`
132
132
  }
133
133
  }
134
134
  `;
135
- var v = Object.defineProperty, l = (o, a, i, m) => {
136
- for (var e = void 0, r = o.length - 1, s; r >= 0; r--)
137
- (s = o[r]) && (e = s(a, i, e) || e);
138
- return e && v(a, i, e), e;
135
+ var v = Object.defineProperty, l = (a, t, i, m) => {
136
+ for (var e = void 0, n = a.length - 1, s; n >= 0; n--)
137
+ (s = a[n]) && (e = s(t, i, e) || e);
138
+ return e && v(t, i, e), e;
139
139
  };
140
- const n = class n extends b {
140
+ const o = class o extends b {
141
141
  constructor() {
142
142
  super(...arguments), this.position = "bottom-end", this.placement = "top-end";
143
143
  }
144
- /** Dispatches the `rc-fab-menu-toggle` bubbling composed event with the current open state. */
145
- _dispatchToggle() {
144
+ /** Dispatches the `rc-fab-menu-toggle` bubbling composed event with the requested open state. */
145
+ _dispatchToggle(t = this.open) {
146
146
  this.dispatchEvent(
147
147
  new CustomEvent("rc-fab-menu-toggle", {
148
148
  bubbles: !0,
149
149
  composed: !0,
150
- detail: { open: this.open }
150
+ detail: { open: t }
151
151
  })
152
152
  );
153
153
  }
154
154
  };
155
- n.styles = [d];
156
- let t = n;
155
+ o.styles = [d];
156
+ let r = o;
157
157
  l([
158
158
  c({ type: String, reflect: !0 })
159
- ], t.prototype, "position");
159
+ ], r.prototype, "position");
160
160
  l([
161
161
  c({ reflect: !0 })
162
- ], t.prototype, "placement");
162
+ ], r.prototype, "placement");
163
163
  export {
164
- t as R
164
+ r as R
165
165
  };
166
- //# sourceMappingURL=rc-fab-menu-BhXCZQuw.js.map
166
+ //# sourceMappingURL=rc-fab-menu-DqKyQYNn.js.map
package/dist/{rc-fab-menu-BhXCZQuw.js.map → rc-fab-menu-DqKyQYNn.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"rc-fab-menu-BhXCZQuw.js","sources":["../src/rc-fab-menu.styles.ts","../src/rc-fab-menu.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const fabMenuStyles = css`\n :host {\n position: var(--rc-fab-menu-position-css, fixed);\n inset-block-end: var(--rc-fab-menu-inset-block, var(--rc-fab-inset-block, 1.5rem));\n inset-inline-end: var(--rc-fab-menu-inset-inline, var(--rc-fab-inset-inline, 1.5rem));\n z-index: var(--rc-fab-menu-z-index, var(--rc-fab-z-index, 10));\n display: inline-block;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n :host([position='bottom-start']) {\n inset-inline-end: unset;\n inset-inline-start: var(--rc-fab-menu-inset-inline, var(--rc-fab-inset-inline, 1.5rem));\n }\n\n :host([position='top-end']) {\n inset-block-end: unset;\n inset-block-start: var(--rc-fab-menu-inset-block, var(--rc-fab-inset-block, 1.5rem));\n }\n\n :host([position='top-start']) {\n inset-block-end: unset;\n inset-block-start: var(--rc-fab-menu-inset-block, var(--rc-fab-inset-block, 1.5rem));\n inset-inline-end: unset;\n inset-inline-start: var(--rc-fab-menu-inset-inline, var(--rc-fab-inset-inline, 1.5rem));\n }\n\n #root {\n display: inline-block;\n }\n\n #trigger-wrap {\n display: contents;\n }\n\n slot[name='trigger']::slotted(button),\n slot[name='trigger']::slotted([role='button']) {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--rc-fab-menu-trigger-gap);\n min-inline-size: var(--rc-fab-menu-size);\n min-block-size: var(--rc-fab-menu-size);\n padding-block: var(--rc-fab-menu-padding-block, revert);\n padding-inline: var(--rc-fab-menu-padding-inline, revert);\n appearance: var(--rc-fab-menu-appearance, revert);\n box-sizing: border-box;\n border: var(--rc-fab-menu-border, revert);\n border-radius: var(--rc-fab-menu-radius, revert);\n background: var(--rc-fab-menu-bg, revert);\n color: var(--rc-fab-menu-color, revert);\n box-shadow: var(--rc-fab-menu-shadow, revert);\n font: var(--rc-fab-menu-font, revert);\n font-family: var(--rc-fab-menu-font-family, revert);\n font-size: var(--rc-fab-menu-font-size, revert);\n font-weight: var(--rc-fab-menu-font-weight, revert);\n letter-spacing: var(--rc-fab-menu-letter-spacing, revert);\n white-space: nowrap;\n text-decoration: var(--rc-fab-menu-text-decoration, revert);\n user-select: var(--rc-fab-menu-user-select, revert);\n transition: var(--rc-fab-menu-transition, revert);\n }\n\n slot[name='trigger']::slotted(button:hover),\n slot[name='trigger']::slotted([role='button']:hover) {\n background: var(--rc-fab-menu-bg-hover, revert);\n box-shadow: var(--rc-fab-menu-shadow-hover, revert);\n }\n\n slot[name='trigger']::slotted(button[aria-expanded='true']),\n slot[name='trigger']::slotted([role='button'][aria-expanded='true']) {\n background: var(--rc-fab-menu-bg-open, revert);\n box-shadow: var(--rc-fab-menu-shadow-open, revert);\n }\n\n slot[name='trigger']::slotted(button:active),\n slot[name='trigger']::slotted([role='button']:active) {\n box-shadow: var(--rc-fab-menu-shadow-active, revert);\n transform: var(--rc-fab-menu-active-transform, revert);\n }\n\n slot[name='trigger']::slotted(button:focus-visible),\n slot[name='trigger']::slotted([role='button']:focus-visible) {\n outline: var(--rc-fab-menu-focus-ring, revert);\n outline-offset: var(--rc-fab-menu-focus-ring-offset, revert);\n }\n\n slot[name='trigger']::slotted(button:disabled),\n slot[name='trigger']::slotted([role='button'][aria-disabled='true']) {\n opacity: var(--rc-fab-menu-disabled-opacity, revert);\n pointer-events: none;\n box-shadow: var(--rc-fab-menu-disabled-shadow, revert);\n }\n\n #popup {\n z-index: var(--rc-fab-menu-popup-z-index, var(--rc-menu-button-popup-z-index, 1000));\n opacity: 1;\n scale: 1;\n transform-origin: var(--rc-fab-menu-popup-transform-origin, bottom right);\n transition:\n opacity var(--rc-fab-menu-popup-duration, 0ms) ease,\n scale var(--rc-fab-menu-popup-duration, 0ms) ease;\n }\n\n #popup[hidden] {\n display: none;\n }\n\n @starting-style {\n :host([open]) #popup {\n opacity: 0;\n scale: 0.92;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n slot[name='trigger']::slotted(button),\n slot[name='trigger']::slotted([role='button']),\n #popup {\n transition-duration: 0s;\n }\n\n slot[name='trigger']::slotted(button:active),\n slot[name='trigger']::slotted([role='button']:active) {\n transform: none;\n }\n }\n`;\n\nexport default fabMenuStyles;\n","import { property } from 'lit/decorators.js';\n\nimport type { AnchorPlacement } from '@rcarls/rc-common';\nimport { RCMenuButton, type RCMenuButtonToggleEvent } from '@rcarls/rc-menu-button';\n\nimport fabMenuStyles from './rc-fab-menu.styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-fab-menu': RCFabMenu;\n }\n\n interface HTMLElementEventMap {\n 'rc-fab-menu-toggle': CustomEvent<RCFabMenuToggleEvent>;\n }\n}\n\n/** Detail payload for the `rc-fab-menu-toggle` event. */\nexport type RCFabMenuToggleEvent = RCMenuButtonToggleEvent;\n\nexport type RCFabMenuPosition = 'bottom-end' | 'bottom-start' | 'top-end' | 'top-start';\n\n/**\n * Floating action button menu wrapper for an `rc-menu` action surface.\n *\n * `rc-fab-menu` specializes `rc-menu-button` for floating action menus. It\n * preserves the menu-button keyboard, focus return, light-dismiss, and popup\n * positioning behavior while applying FAB placement and reveal styling.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-fab-menu rc-fab-menu docs}\n * @see {@link https://m3.material.io/components/floating-action-button/overview Material 3 floating action button}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/ WAI-ARIA Menu Button pattern}\n *\n * @example\n * ```html\n * <rc-fab-menu>\n * <button slot=\"trigger\" type=\"button\" aria-label=\"Create\">\n * <span aria-hidden=\"true\">+</span>\n * </button>\n * <rc-menu label=\"Create\">\n * <button>Recipe</button>\n * <button>Collection</button>\n * </rc-menu>\n * </rc-fab-menu>\n * ```\n *\n * @slot trigger - Native button or button-like element that opens the action menu.\n * @slot default - `rc-menu` element containing floating action commands.\n *\n * @fires rc-fab-menu-toggle - Fired when user interaction opens or closes the action menu.\n *\n * @attr position - Viewport corner where the floating action menu trigger is anchored.\n * @attr placement - Preferred placement of the action menu relative to the trigger button.\n *\n * @cssprop [--rc-fab-menu-position-css=fixed] - CSS position value for the floating wrapper.\n * @cssprop [--rc-fab-menu-inset-block=1.5rem] - Distance from the block-axis edge; falls back\n * through --rc-fab-inset-block.\n * @cssprop [--rc-fab-menu-inset-inline=1.5rem] - Distance from the inline-axis edge; falls back\n * through --rc-fab-inset-inline.\n * @cssprop [--rc-fab-menu-z-index=10] - Stacking order for the floating wrapper; falls back\n * through --rc-fab-z-index.\n * @cssprop [--rc-fab-menu-trigger-gap] - Gap between trigger icon and label content. No default.\n * @cssprop [--rc-fab-menu-size] - Trigger minimum inline and block size. No default; set\n * explicitly or apply a theme.\n * @cssprop [--rc-fab-menu-padding-block] - Trigger block-axis padding (defers to native button\n * padding when unset).\n * @cssprop [--rc-fab-menu-padding-inline] - Trigger inline-axis padding (defers to native button\n * padding when unset).\n * @cssprop [--rc-fab-menu-appearance] - Trigger appearance (defers to native button appearance\n * when unset).\n * @cssprop [--rc-fab-menu-border] - Trigger border (defers to native button border when unset).\n * @cssprop [--rc-fab-menu-radius] - Trigger border radius (defers to native button radius when\n * unset).\n * @cssprop [--rc-fab-menu-bg] - Trigger background (defers to native button background when\n * unset).\n * @cssprop [--rc-fab-menu-color] - Trigger foreground color (defers to native button color when\n * unset).\n * @cssprop [--rc-fab-menu-shadow] - Trigger elevation shadow (defers to native button shadow\n * when unset).\n * @cssprop [--rc-fab-menu-font] - Trigger font shorthand (defers to native button font when\n * unset).\n * @cssprop [--rc-fab-menu-font-family] - Trigger font family (defers to native button font-family\n * when unset).\n * @cssprop [--rc-fab-menu-font-size] - Trigger font size (defers to native button font-size when\n * unset).\n * @cssprop [--rc-fab-menu-font-weight] - Trigger font weight (defers to native button font-weight\n * when unset).\n * @cssprop [--rc-fab-menu-letter-spacing] - Trigger letter spacing (defers to native button\n * letter-spacing when unset).\n * @cssprop [--rc-fab-menu-text-decoration] - Trigger text decoration (defers to native button\n * text-decoration when unset).\n * @cssprop [--rc-fab-menu-user-select] - Trigger user-select (defers to native button user-select\n * when unset).\n * @cssprop [--rc-fab-menu-transition] - Trigger transition shorthand (defers to native button\n * transition when unset).\n * @cssprop [--rc-fab-menu-bg-hover] - Trigger hover background (defers to native button hover\n * styling when unset).\n * @cssprop [--rc-fab-menu-shadow-hover] - Trigger hover elevation shadow (defers to native button\n * hover styling when unset).\n * @cssprop [--rc-fab-menu-bg-open] - Trigger background while the menu is open (defers to native\n * button styling when unset).\n * @cssprop [--rc-fab-menu-shadow-open] - Trigger elevation shadow while the menu is open (defers\n * to native button styling when unset).\n * @cssprop [--rc-fab-menu-shadow-active] - Trigger pressed elevation shadow (defers to native\n * button styling when unset).\n * @cssprop [--rc-fab-menu-active-transform] - Trigger transform while pressed (defers to native\n * button styling when unset).\n * @cssprop [--rc-fab-menu-focus-ring] - Trigger focus ring (defers to native button focus styling\n * when unset).\n * @cssprop [--rc-fab-menu-focus-ring-offset] - Trigger focus ring offset (defers to native button\n * focus styling when unset).\n * @cssprop [--rc-fab-menu-disabled-opacity] - Trigger opacity while disabled (defers to native\n * disabled styling when unset).\n * @cssprop [--rc-fab-menu-disabled-shadow] - Trigger elevation shadow while disabled (defers to\n * native disabled styling when unset).\n * @cssprop [--rc-fab-menu-popup-z-index=1000] - Stacking order of the popup container; falls back\n * through --rc-menu-button-popup-z-index.\n * @cssprop [--rc-fab-menu-popup-duration=0ms] - Popup reveal transition duration.\n * @cssprop [--rc-fab-menu-popup-transform-origin=bottom right] - Popup reveal transform origin.\n *\n * @csspart root - The root popup anchor inherited from `rc-menu-button`.\n * @csspart popup - The popup container inherited from `rc-menu-button`.\n */\nexport class RCFabMenu extends RCMenuButton {\n static override styles = [fabMenuStyles];\n\n /** Viewport corner where the floating action menu trigger is anchored. */\n @property({ type: String, reflect: true })\n position: RCFabMenuPosition = 'bottom-end';\n\n /** Preferred placement of the action menu relative to the trigger button. */\n @property({ reflect: true })\n override placement: AnchorPlacement = 'top-end';\n\n /** Dispatches the `rc-fab-menu-toggle` bubbling composed event with the current open state. */\n protected override _dispatchToggle(): void {\n this.dispatchEvent(\n new CustomEvent<RCFabMenuToggleEvent>('rc-fab-menu-toggle', {\n bubbles: true,\n composed: true,\n detail: { open: this.open },\n }),\n );\n }\n}\n\nexport default RCFabMenu;\n"],"names":["fabMenuStyles","css","_RCFabMenu","RCMenuButton","RCFabMenu","__decorateClass","property"],"mappings":";;;AAEO,MAAMA,IAAgBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACyHtB,MAAMC,IAAN,MAAMA,UAAkBC,EAAa;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAKL,KAAA,WAA8B,cAI9B,KAAS,YAA6B;AAAA,EAAA;AAAA;AAAA,EAGnB,kBAAwB;AACzC,SAAK;AAAA,MACH,IAAI,YAAkC,sBAAsB;AAAA,QAC1D,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,MAAM,KAAK,KAAA;AAAA,MAAK,CAC3B;AAAA,IAAA;AAAA,EAEL;AACF;AApBED,EAAgB,SAAS,CAACF,CAAa;AADlC,IAAMI,IAANF;AAKLG,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAJ9BF,EAKX,WAAA,UAAA;AAISC,EAAA;AAAA,EADRC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GARhBF,EASF,WAAA,WAAA;"}
1
+ {"version":3,"file":"rc-fab-menu-DqKyQYNn.js","sources":["../src/rc-fab-menu.styles.ts","../src/rc-fab-menu.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const fabMenuStyles = css`\n :host {\n position: var(--rc-fab-menu-position-css, fixed);\n inset-block-end: var(--rc-fab-menu-inset-block, var(--rc-fab-inset-block, 1.5rem));\n inset-inline-end: var(--rc-fab-menu-inset-inline, var(--rc-fab-inset-inline, 1.5rem));\n z-index: var(--rc-fab-menu-z-index, var(--rc-fab-z-index, 10));\n display: inline-block;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n :host([position='bottom-start']) {\n inset-inline-end: unset;\n inset-inline-start: var(--rc-fab-menu-inset-inline, var(--rc-fab-inset-inline, 1.5rem));\n }\n\n :host([position='top-end']) {\n inset-block-end: unset;\n inset-block-start: var(--rc-fab-menu-inset-block, var(--rc-fab-inset-block, 1.5rem));\n }\n\n :host([position='top-start']) {\n inset-block-end: unset;\n inset-block-start: var(--rc-fab-menu-inset-block, var(--rc-fab-inset-block, 1.5rem));\n inset-inline-end: unset;\n inset-inline-start: var(--rc-fab-menu-inset-inline, var(--rc-fab-inset-inline, 1.5rem));\n }\n\n #root {\n display: inline-block;\n }\n\n #trigger-wrap {\n display: contents;\n }\n\n slot[name='trigger']::slotted(button),\n slot[name='trigger']::slotted([role='button']) {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--rc-fab-menu-trigger-gap);\n min-inline-size: var(--rc-fab-menu-size);\n min-block-size: var(--rc-fab-menu-size);\n padding-block: var(--rc-fab-menu-padding-block, revert);\n padding-inline: var(--rc-fab-menu-padding-inline, revert);\n appearance: var(--rc-fab-menu-appearance, revert);\n box-sizing: border-box;\n border: var(--rc-fab-menu-border, revert);\n border-radius: var(--rc-fab-menu-radius, revert);\n background: var(--rc-fab-menu-bg, revert);\n color: var(--rc-fab-menu-color, revert);\n box-shadow: var(--rc-fab-menu-shadow, revert);\n font: var(--rc-fab-menu-font, revert);\n font-family: var(--rc-fab-menu-font-family, revert);\n font-size: var(--rc-fab-menu-font-size, revert);\n font-weight: var(--rc-fab-menu-font-weight, revert);\n letter-spacing: var(--rc-fab-menu-letter-spacing, revert);\n white-space: nowrap;\n text-decoration: var(--rc-fab-menu-text-decoration, revert);\n user-select: var(--rc-fab-menu-user-select, revert);\n transition: var(--rc-fab-menu-transition, revert);\n }\n\n slot[name='trigger']::slotted(button:hover),\n slot[name='trigger']::slotted([role='button']:hover) {\n background: var(--rc-fab-menu-bg-hover, revert);\n box-shadow: var(--rc-fab-menu-shadow-hover, revert);\n }\n\n slot[name='trigger']::slotted(button[aria-expanded='true']),\n slot[name='trigger']::slotted([role='button'][aria-expanded='true']) {\n background: var(--rc-fab-menu-bg-open, revert);\n box-shadow: var(--rc-fab-menu-shadow-open, revert);\n }\n\n slot[name='trigger']::slotted(button:active),\n slot[name='trigger']::slotted([role='button']:active) {\n box-shadow: var(--rc-fab-menu-shadow-active, revert);\n transform: var(--rc-fab-menu-active-transform, revert);\n }\n\n slot[name='trigger']::slotted(button:focus-visible),\n slot[name='trigger']::slotted([role='button']:focus-visible) {\n outline: var(--rc-fab-menu-focus-ring, revert);\n outline-offset: var(--rc-fab-menu-focus-ring-offset, revert);\n }\n\n slot[name='trigger']::slotted(button:disabled),\n slot[name='trigger']::slotted([role='button'][aria-disabled='true']) {\n opacity: var(--rc-fab-menu-disabled-opacity, revert);\n pointer-events: none;\n box-shadow: var(--rc-fab-menu-disabled-shadow, revert);\n }\n\n #popup {\n z-index: var(--rc-fab-menu-popup-z-index, var(--rc-menu-button-popup-z-index, 1000));\n opacity: 1;\n scale: 1;\n transform-origin: var(--rc-fab-menu-popup-transform-origin, bottom right);\n transition:\n opacity var(--rc-fab-menu-popup-duration, 0ms) ease,\n scale var(--rc-fab-menu-popup-duration, 0ms) ease;\n }\n\n #popup[hidden] {\n display: none;\n }\n\n @starting-style {\n :host([open]) #popup {\n opacity: 0;\n scale: 0.92;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n slot[name='trigger']::slotted(button),\n slot[name='trigger']::slotted([role='button']),\n #popup {\n transition-duration: 0s;\n }\n\n slot[name='trigger']::slotted(button:active),\n slot[name='trigger']::slotted([role='button']:active) {\n transform: none;\n }\n }\n`;\n\nexport default fabMenuStyles;\n","import { property } from 'lit/decorators.js';\n\nimport type { AnchorPlacement } from '@rcarls/rc-common';\nimport { RCMenuButton, type RCMenuButtonToggleEvent } from '@rcarls/rc-menu-button';\n\nimport fabMenuStyles from './rc-fab-menu.styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-fab-menu': RCFabMenu;\n }\n\n interface HTMLElementEventMap {\n 'rc-fab-menu-toggle': CustomEvent<RCFabMenuToggleEvent>;\n }\n}\n\n/** Detail payload for the `rc-fab-menu-toggle` event. */\nexport type RCFabMenuToggleEvent = RCMenuButtonToggleEvent;\n\nexport type RCFabMenuPosition = 'bottom-end' | 'bottom-start' | 'top-end' | 'top-start';\n\n/**\n * Floating action button menu wrapper for an `rc-menu` action surface.\n *\n * `rc-fab-menu` specializes `rc-menu-button` for floating action menus. It\n * preserves the menu-button keyboard, focus return, light-dismiss, and popup\n * positioning behavior while applying FAB placement and reveal styling.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-fab-menu rc-fab-menu docs}\n * @see {@link https://m3.material.io/components/floating-action-button/overview Material 3 floating action button}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/ WAI-ARIA Menu Button pattern}\n *\n * @example\n * ```html\n * <rc-fab-menu>\n * <button slot=\"trigger\" type=\"button\" aria-label=\"Create\">\n * <span aria-hidden=\"true\">+</span>\n * </button>\n * <rc-menu label=\"Create\">\n * <button>Recipe</button>\n * <button>Collection</button>\n * </rc-menu>\n * </rc-fab-menu>\n * ```\n *\n * @slot trigger - Native button or button-like element that opens the action menu.\n * @slot default - `rc-menu` element containing floating action commands.\n *\n * @fires rc-fab-menu-toggle - Fired when user interaction opens or closes the action menu.\n *\n * @attr position - Viewport corner where the floating action menu trigger is anchored.\n * @attr placement - Preferred placement of the action menu relative to the trigger button.\n *\n * @cssprop [--rc-fab-menu-position-css=fixed] - CSS position value for the floating wrapper.\n * @cssprop [--rc-fab-menu-inset-block=1.5rem] - Distance from the block-axis edge; falls back\n * through --rc-fab-inset-block.\n * @cssprop [--rc-fab-menu-inset-inline=1.5rem] - Distance from the inline-axis edge; falls back\n * through --rc-fab-inset-inline.\n * @cssprop [--rc-fab-menu-z-index=10] - Stacking order for the floating wrapper; falls back\n * through --rc-fab-z-index.\n * @cssprop [--rc-fab-menu-trigger-gap] - Gap between trigger icon and label content. No default.\n * @cssprop [--rc-fab-menu-size] - Trigger minimum inline and block size. No default; set\n * explicitly or apply a theme.\n * @cssprop [--rc-fab-menu-padding-block] - Trigger block-axis padding (defers to native button\n * padding when unset).\n * @cssprop [--rc-fab-menu-padding-inline] - Trigger inline-axis padding (defers to native button\n * padding when unset).\n * @cssprop [--rc-fab-menu-appearance] - Trigger appearance (defers to native button appearance\n * when unset).\n * @cssprop [--rc-fab-menu-border] - Trigger border (defers to native button border when unset).\n * @cssprop [--rc-fab-menu-radius] - Trigger border radius (defers to native button radius when\n * unset).\n * @cssprop [--rc-fab-menu-bg] - Trigger background (defers to native button background when\n * unset).\n * @cssprop [--rc-fab-menu-color] - Trigger foreground color (defers to native button color when\n * unset).\n * @cssprop [--rc-fab-menu-shadow] - Trigger elevation shadow (defers to native button shadow\n * when unset).\n * @cssprop [--rc-fab-menu-font] - Trigger font shorthand (defers to native button font when\n * unset).\n * @cssprop [--rc-fab-menu-font-family] - Trigger font family (defers to native button font-family\n * when unset).\n * @cssprop [--rc-fab-menu-font-size] - Trigger font size (defers to native button font-size when\n * unset).\n * @cssprop [--rc-fab-menu-font-weight] - Trigger font weight (defers to native button font-weight\n * when unset).\n * @cssprop [--rc-fab-menu-letter-spacing] - Trigger letter spacing (defers to native button\n * letter-spacing when unset).\n * @cssprop [--rc-fab-menu-text-decoration] - Trigger text decoration (defers to native button\n * text-decoration when unset).\n * @cssprop [--rc-fab-menu-user-select] - Trigger user-select (defers to native button user-select\n * when unset).\n * @cssprop [--rc-fab-menu-transition] - Trigger transition shorthand (defers to native button\n * transition when unset).\n * @cssprop [--rc-fab-menu-bg-hover] - Trigger hover background (defers to native button hover\n * styling when unset).\n * @cssprop [--rc-fab-menu-shadow-hover] - Trigger hover elevation shadow (defers to native button\n * hover styling when unset).\n * @cssprop [--rc-fab-menu-bg-open] - Trigger background while the menu is open (defers to native\n * button styling when unset).\n * @cssprop [--rc-fab-menu-shadow-open] - Trigger elevation shadow while the menu is open (defers\n * to native button styling when unset).\n * @cssprop [--rc-fab-menu-shadow-active] - Trigger pressed elevation shadow (defers to native\n * button styling when unset).\n * @cssprop [--rc-fab-menu-active-transform] - Trigger transform while pressed (defers to native\n * button styling when unset).\n * @cssprop [--rc-fab-menu-focus-ring] - Trigger focus ring (defers to native button focus styling\n * when unset).\n * @cssprop [--rc-fab-menu-focus-ring-offset] - Trigger focus ring offset (defers to native button\n * focus styling when unset).\n * @cssprop [--rc-fab-menu-disabled-opacity] - Trigger opacity while disabled (defers to native\n * disabled styling when unset).\n * @cssprop [--rc-fab-menu-disabled-shadow] - Trigger elevation shadow while disabled (defers to\n * native disabled styling when unset).\n * @cssprop [--rc-fab-menu-popup-z-index=1000] - Stacking order of the popup container; falls back\n * through --rc-menu-button-popup-z-index.\n * @cssprop [--rc-fab-menu-popup-duration=0ms] - Popup reveal transition duration.\n * @cssprop [--rc-fab-menu-popup-transform-origin=bottom right] - Popup reveal transform origin.\n *\n * @csspart root - The root popup anchor inherited from `rc-menu-button`.\n * @csspart popup - The popup container inherited from `rc-menu-button`.\n */\nexport class RCFabMenu extends RCMenuButton {\n static override styles = [fabMenuStyles];\n\n /** Viewport corner where the floating action menu trigger is anchored. */\n @property({ type: String, reflect: true })\n position: RCFabMenuPosition = 'bottom-end';\n\n /** Preferred placement of the action menu relative to the trigger button. */\n @property({ reflect: true })\n override placement: AnchorPlacement = 'top-end';\n\n /** Dispatches the `rc-fab-menu-toggle` bubbling composed event with the requested open state. */\n protected override _dispatchToggle(open = this.open): void {\n this.dispatchEvent(\n new CustomEvent<RCFabMenuToggleEvent>('rc-fab-menu-toggle', {\n bubbles: true,\n composed: true,\n detail: { open },\n }),\n );\n }\n}\n\nexport default RCFabMenu;\n"],"names":["fabMenuStyles","css","_RCFabMenu","RCMenuButton","open","RCFabMenu","__decorateClass","property"],"mappings":";;;AAEO,MAAMA,IAAgBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACyHtB,MAAMC,IAAN,MAAMA,UAAkBC,EAAa;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAKL,KAAA,WAA8B,cAI9B,KAAS,YAA6B;AAAA,EAAA;AAAA;AAAA,EAGnB,gBAAgBC,IAAO,KAAK,MAAY;AACzD,SAAK;AAAA,MACH,IAAI,YAAkC,sBAAsB;AAAA,QAC1D,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,MAAAA,EAAA;AAAA,MAAK,CAChB;AAAA,IAAA;AAAA,EAEL;AACF;AApBEF,EAAgB,SAAS,CAACF,CAAa;AADlC,IAAMK,IAANH;AAKLI,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAJ9BF,EAKX,WAAA,UAAA;AAISC,EAAA;AAAA,EADRC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GARhBF,EASF,WAAA,WAAA;"}
package/dist/rc-fab-menu-define.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import "@rcarls/rc-menu/define";
2
- import { R as e } from "./rc-fab-menu-BhXCZQuw.js";
2
+ import { R as e } from "./rc-fab-menu-DqKyQYNn.js";
3
3
  customElements.get("rc-fab-menu") || customElements.define("rc-fab-menu", e);
4
4
  export {
5
5
  e as RCFabMenu
package/dist/rc-fab-menu.js CHANGED
@@ -1,4 +1,4 @@
1
- import { R as o } from "./rc-fab-menu-BhXCZQuw.js";
1
+ import { R as o } from "./rc-fab-menu-DqKyQYNn.js";
2
2
  export {
3
3
  o as RCFabMenu
4
4
  };
package/dist/types/packages/rc-fab-menu/src/index.d.ts CHANGED
@@ -1 +1 @@
1
- export * from './rc-fab-menu';
1
+ export * from './rc-fab-menu.js';
package/dist/types/packages/rc-fab-menu/src/rc-fab-menu.d.ts CHANGED
@@ -118,7 +118,7 @@ export declare class RCFabMenu extends RCMenuButton {
118
118
  position: RCFabMenuPosition;
119
119
  /** Preferred placement of the action menu relative to the trigger button. */
120
120
  placement: AnchorPlacement;
121
- /** Dispatches the `rc-fab-menu-toggle` bubbling composed event with the current open state. */
122
- protected _dispatchToggle(): void;
121
+ /** Dispatches the `rc-fab-menu-toggle` bubbling composed event with the requested open state. */
122
+ protected _dispatchToggle(open?: boolean): void;
123
123
  }
124
124
  export default RCFabMenu;
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "0.4.2",
6
+ "version": "0.6.0",
7
7
  "description": "Floating action button menu wrapper for an rc-menu action surface.",
8
8
  "repository": {
9
9
  "type": "git",
@@ -45,9 +45,9 @@
45
45
  "test:browser:firefox": "vitest --run --project=firefox"
46
46
  },
47
47
  "dependencies": {
48
- "@rcarls/rc-common": "0.4.2",
49
- "@rcarls/rc-menu": "0.4.2",
50
- "@rcarls/rc-menu-button": "0.4.2"
48
+ "@rcarls/rc-common": "0.6.0",
49
+ "@rcarls/rc-menu": "0.6.0",
50
+ "@rcarls/rc-menu-button": "0.6.0"
51
51
  },
52
52
  "devDependencies": {
53
53
  "@custom-elements-manifest/analyzer": "0.11.0",