@vaadin/react-components 24.8.0-alpha2 → 24.8.0-alpha20

package/ContextMenu.d.ts

@@ -8,7 +8,7 @@ export type ContextMenuItem<TItemData extends object = object> = Omit<_ContextMe
     children?: Array<ContextMenuItem<TItemData>>;
 };
 export type ContextMenuItemSelectedEvent<TItem extends ContextMenuItem = ContextMenuItem> = CustomEvent<{
-    value: TItem;
+    value: ContextMenuItem<TItem>;
 }>;
 export type ContextMenuProps<TItem extends ContextMenuItem = ContextMenuItem> = Partial<Omit<_ContextMenuProps, 'opened' | 'renderer' | 'items' | 'onItemSelected'>> & Readonly<{
     renderer?: ComponentType<ContextMenuReactRendererProps> | null;

package/ContextMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["src/ContextMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAiC,KAAK,YAAY,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AACjH,OAAO,EAEL,KAAK,0BAA0B,EAC/B,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,IAAI,iBAAiB,EAC1C,KAAK,eAAe,IAAI,gBAAgB,EACzC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,KAAK,yBAAyB,EAAsB,MAAM,mCAAmC,CAAC;AAGvG,cAAc,4BAA4B,CAAC;AAE3C,MAAM,MAAM,6BAA6B,GAAG,yBAAyB,CAAC,0BAA0B,EAAE,kBAAkB,CAAC,CAAC;AAEtH,MAAM,MAAM,eAAe,CAAC,SAAS,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CACnE,gBAAgB,CAAC,SAAS,CAAC,EAC3B,WAAW,GAAG,UAAU,CACzB,GAAG;IACF,SAAS,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAElC,QAAQ,CAAC,EAAE,KAAK,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC;CAC9C,CAAC;AAEF,MAAM,MAAM,4BAA4B,CAAC,KAAK,SAAS,eAAe,GAAG,eAAe,IAAI,WAAW,CAAC;IACtG,KAAK,EAAE,KAAK,CAAC;CACd,CAAC,CAAC;AAKH,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,eAAe,GAAG,eAAe,IAAI,OAAO,CACrF,IAAI,CAAC,iBAAiB,EAAE,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,gBAAgB,CAAC,CAC5E,GACC,QAAQ,CAAC;IACP,QAAQ,CAAC,EAAE,aAAa,CAAC,6BAA6B,CAAC,GAAG,IAAI,CAAC;IAE/D,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAErB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,4BAA4B,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACvE,CAAC,CAAC;AAmCL,QAAA,MAAM,oBAAoB,EAA8B,CAAC,KAAK,SAAS,eAAe,GAAG,eAAe,EACtG,KAAK,EAAE,gBAAgB,CAAC,KAAK,CAAC,GAAG,aAAa,CAAC,kBAAkB,CAAC,KAC/D,YAAY,GAAG,IAAI,CAAC;AAEzB,OAAO,EAAE,oBAAoB,IAAI,WAAW,EAAE,CAAC"}
+{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["src/ContextMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAiC,KAAK,YAAY,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AACjH,OAAO,EAEL,KAAK,0BAA0B,EAC/B,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,IAAI,iBAAiB,EAC1C,KAAK,eAAe,IAAI,gBAAgB,EACzC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,KAAK,yBAAyB,EAAsB,MAAM,mCAAmC,CAAC;AAGvG,cAAc,4BAA4B,CAAC;AAE3C,MAAM,MAAM,6BAA6B,GAAG,yBAAyB,CAAC,0BAA0B,EAAE,kBAAkB,CAAC,CAAC;AAEtH,MAAM,MAAM,eAAe,CAAC,SAAS,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CACnE,gBAAgB,CAAC,SAAS,CAAC,EAC3B,WAAW,GAAG,UAAU,CACzB,GAAG;IACF,SAAS,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAElC,QAAQ,CAAC,EAAE,KAAK,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC;CAC9C,CAAC;AAEF,MAAM,MAAM,4BAA4B,CAAC,KAAK,SAAS,eAAe,GAAG,eAAe,IAAI,WAAW,CAAC;IACtG,KAAK,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;CAC/B,CAAC,CAAC;AAKH,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,eAAe,GAAG,eAAe,IAAI,OAAO,CACrF,IAAI,CAAC,iBAAiB,EAAE,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,gBAAgB,CAAC,CAC5E,GACC,QAAQ,CAAC;IACP,QAAQ,CAAC,EAAE,aAAa,CAAC,6BAA6B,CAAC,GAAG,IAAI,CAAC;IAE/D,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAErB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,4BAA4B,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACvE,CAAC,CAAC;AAmCL,QAAA,MAAM,oBAAoB,EAA8B,CAAC,KAAK,SAAS,eAAe,GAAG,eAAe,EACtG,KAAK,EAAE,gBAAgB,CAAC,KAAK,CAAC,GAAG,aAAa,CAAC,kBAAkB,CAAC,KAC/D,YAAY,GAAG,IAAI,CAAC;AAEzB,OAAO,EAAE,oBAAoB,IAAI,WAAW,EAAE,CAAC"}

package/ContextMenu.js

@@ -1,2 +1,2 @@
-export*from"@vaadin/context-menu/vaadin-context-menu.js";import{forwardRef as s}from"react";import{ContextMenu as C}from"@vaadin/context-menu/vaadin-context-menu.js";import*as u from"react";import{createComponent as d}from"./utils/createComponent.js";var M={onItemSelected:"item-selected",onOpenedChanged:"opened-changed"},o=d({elementClass:C,events:M,react:u,tagName:"vaadin-context-menu"});import{useContextRenderer as l}from"./renderers/useContextRenderer.js";import{getOriginalItem as c,mapItemsWithComponents as I}from"./utils/mapItemsWithComponents.js";import{jsxs as E}from"react/jsx-runtime";function i(e,m){let[r,p]=l(e.renderer),[a,x]=I(e.items,"vaadin-context-menu-item"),n=e.onItemSelected;return E(o,{...e,ref:m,renderer:p,items:x,onItemSelected:n?t=>{Object.assign(t.detail,{value:c(t.detail.value)}),n(t)}:void 0,children:[e.children,r,a]})}var g=s(i);export{g as ContextMenu,C as ContextMenuElement};
+export*from"@vaadin/context-menu/vaadin-context-menu.js";import{forwardRef as s}from"react";import{ContextMenu as C}from"@vaadin/context-menu/vaadin-context-menu.js";import*as u from"react";import{createComponent as d}from"./utils/createComponent.js";var M={onItemSelected:"item-selected",onOpenedChanged:"opened-changed"},o=d({elementClass:C,events:M,react:u,tagName:"vaadin-context-menu"});import{useContextRenderer as l}from"./renderers/useContextRenderer.js";import{getOriginalItem as c,mapItemsWithComponents as I}from"./utils/mapItemsWithComponents.js";import{jsxs as E}from"react/jsx-runtime";function i(e,m){let[r,p]=l(e.renderer),[x,a]=I(e.items,"vaadin-context-menu-item"),n=e.onItemSelected;return E(o,{...e,ref:m,renderer:p,items:a,onItemSelected:n?t=>{Object.assign(t.detail,{value:c(t.detail.value)}),n(t)}:void 0,children:[e.children,r,x]})}var g=s(i);export{g as ContextMenu,C as ContextMenuElement};
 //# sourceMappingURL=ContextMenu.js.map

package/ContextMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["src/ContextMenu.tsx", "src/generated/ContextMenu.ts"],
-  "sourcesContent": ["export * from \"@vaadin/context-menu/vaadin-context-menu.js\";\nimport { type ComponentType, type ForwardedRef, forwardRef, type ReactElement, type RefAttributes } from 'react';\nimport {\n  ContextMenu as _ContextMenu,\n  type ContextMenuRendererContext,\n  type ContextMenuElement,\n  type ContextMenuProps as _ContextMenuProps,\n  type ContextMenuItem as _ContextMenuItem,\n} from './generated/ContextMenu.js';\nimport { type ReactContextRendererProps, useContextRenderer } from './renderers/useContextRenderer.js';\nimport { getOriginalItem, mapItemsWithComponents } from './utils/mapItemsWithComponents.js';\n\nexport * from './generated/ContextMenu.js';\n\nexport type ContextMenuReactRendererProps = ReactContextRendererProps<ContextMenuRendererContext, ContextMenuElement>;\n\nexport type ContextMenuItem<TItemData extends object = object> = Omit<\n  _ContextMenuItem<TItemData>,\n  'component' | 'children'\n> & {\n  component?: ReactElement | string;\n\n  children?: Array<ContextMenuItem<TItemData>>;\n};\n\nexport type ContextMenuItemSelectedEvent<TItem extends ContextMenuItem = ContextMenuItem> = CustomEvent<{\n  value: TItem;\n}>;\n\n// The 'opened' property is omitted because it is readonly in the web component.\n// So you cannot set it up manually, only read from the component.\n// For changing the property, use specific methods of the component.\nexport type ContextMenuProps<TItem extends ContextMenuItem = ContextMenuItem> = Partial<\n  Omit<_ContextMenuProps, 'opened' | 'renderer' | 'items' | 'onItemSelected'>\n> &\n  Readonly<{\n    renderer?: ComponentType<ContextMenuReactRendererProps> | null;\n\n    items?: Array<TItem>;\n\n    onItemSelected?: (event: ContextMenuItemSelectedEvent<TItem>) => void;\n  }>;\n\nfunction ContextMenu<TItem extends ContextMenuItem = ContextMenuItem>(\n  props: ContextMenuProps<TItem>,\n  ref: ForwardedRef<ContextMenuElement>,\n): ReactElement | null {\n  const [portals, renderer] = useContextRenderer(props.renderer);\n  const [itemPortals, webComponentItems] = mapItemsWithComponents(props.items, 'vaadin-context-menu-item');\n\n  const onItemSelected = props.onItemSelected;\n  const mappedOnItemSelected = onItemSelected\n    ? (event: CustomEvent<{ value: _ContextMenuItem }>) => {\n        // Replace the mapped web component item with the original item\n        Object.assign(event.detail, {\n          value: getOriginalItem(event.detail.value),\n        });\n\n        onItemSelected(event as ContextMenuItemSelectedEvent<TItem>);\n      }\n    : undefined;\n  return (\n    <_ContextMenu\n      {...props}\n      ref={ref}\n      renderer={renderer}\n      items={webComponentItems}\n      onItemSelected={mappedOnItemSelected}\n    >\n      {props.children}\n      {portals}\n      {itemPortals}\n    </_ContextMenu>\n  );\n}\n\nconst ForwardedContextMenu = forwardRef(ContextMenu) as <TItem extends ContextMenuItem = ContextMenuItem>(\n  props: ContextMenuProps<TItem> & RefAttributes<ContextMenuElement>,\n) => ReactElement | null;\n\nexport { ForwardedContextMenu as ContextMenu };\n", "import type { EventName } from \"@lit/react\";\nimport { ContextMenu as ContextMenuElement, type ContextMenuEventMap as _ContextMenuEventMap, } from \"@vaadin/context-menu/vaadin-context-menu.js\";\nimport * as React from \"react\";\nimport { createComponent, type WebComponentProps } from \"../utils/createComponent.js\";\nexport { ContextMenuElement, };\nexport type ContextMenuEventMap = Readonly<{\n    onItemSelected: EventName<_ContextMenuEventMap[\"item-selected\"]>;\n    onOpenedChanged: EventName<_ContextMenuEventMap[\"opened-changed\"]>;\n}>;\nconst events = { onItemSelected: \"item-selected\", onOpenedChanged: \"opened-changed\" } as ContextMenuEventMap;\nexport type ContextMenuProps = WebComponentProps<ContextMenuElement, ContextMenuEventMap>;\nexport const ContextMenu = createComponent({\n    elementClass: ContextMenuElement, events, react: React, tagName: \"vaadin-context-menu\"\n});\n"],
+  "sourcesContent": ["export * from \"@vaadin/context-menu/vaadin-context-menu.js\";\nimport { type ComponentType, type ForwardedRef, forwardRef, type ReactElement, type RefAttributes } from 'react';\nimport {\n  ContextMenu as _ContextMenu,\n  type ContextMenuRendererContext,\n  type ContextMenuElement,\n  type ContextMenuProps as _ContextMenuProps,\n  type ContextMenuItem as _ContextMenuItem,\n} from './generated/ContextMenu.js';\nimport { type ReactContextRendererProps, useContextRenderer } from './renderers/useContextRenderer.js';\nimport { getOriginalItem, mapItemsWithComponents } from './utils/mapItemsWithComponents.js';\n\nexport * from './generated/ContextMenu.js';\n\nexport type ContextMenuReactRendererProps = ReactContextRendererProps<ContextMenuRendererContext, ContextMenuElement>;\n\nexport type ContextMenuItem<TItemData extends object = object> = Omit<\n  _ContextMenuItem<TItemData>,\n  'component' | 'children'\n> & {\n  component?: ReactElement | string;\n\n  children?: Array<ContextMenuItem<TItemData>>;\n};\n\nexport type ContextMenuItemSelectedEvent<TItem extends ContextMenuItem = ContextMenuItem> = CustomEvent<{\n  value: ContextMenuItem<TItem>;\n}>;\n\n// The 'opened' property is omitted because it is readonly in the web component.\n// So you cannot set it up manually, only read from the component.\n// For changing the property, use specific methods of the component.\nexport type ContextMenuProps<TItem extends ContextMenuItem = ContextMenuItem> = Partial<\n  Omit<_ContextMenuProps, 'opened' | 'renderer' | 'items' | 'onItemSelected'>\n> &\n  Readonly<{\n    renderer?: ComponentType<ContextMenuReactRendererProps> | null;\n\n    items?: Array<TItem>;\n\n    onItemSelected?: (event: ContextMenuItemSelectedEvent<TItem>) => void;\n  }>;\n\nfunction ContextMenu<TItem extends ContextMenuItem = ContextMenuItem>(\n  props: ContextMenuProps<TItem>,\n  ref: ForwardedRef<ContextMenuElement>,\n): ReactElement | null {\n  const [portals, renderer] = useContextRenderer(props.renderer);\n  const [itemPortals, webComponentItems] = mapItemsWithComponents(props.items, 'vaadin-context-menu-item');\n\n  const onItemSelected = props.onItemSelected;\n  const mappedOnItemSelected = onItemSelected\n    ? (event: CustomEvent<{ value: _ContextMenuItem }>) => {\n        // Replace the mapped web component item with the original item\n        Object.assign(event.detail, {\n          value: getOriginalItem(event.detail.value),\n        });\n\n        onItemSelected(event as ContextMenuItemSelectedEvent<TItem>);\n      }\n    : undefined;\n  return (\n    <_ContextMenu\n      {...props}\n      ref={ref}\n      renderer={renderer}\n      items={webComponentItems}\n      onItemSelected={mappedOnItemSelected}\n    >\n      {props.children}\n      {portals}\n      {itemPortals}\n    </_ContextMenu>\n  );\n}\n\nconst ForwardedContextMenu = forwardRef(ContextMenu) as <TItem extends ContextMenuItem = ContextMenuItem>(\n  props: ContextMenuProps<TItem> & RefAttributes<ContextMenuElement>,\n) => ReactElement | null;\n\nexport { ForwardedContextMenu as ContextMenu };\n", "import type { EventName } from \"@lit/react\";\nimport { ContextMenu as ContextMenuElement, type ContextMenuEventMap as _ContextMenuEventMap, } from \"@vaadin/context-menu/vaadin-context-menu.js\";\nimport * as React from \"react\";\nimport { createComponent, type WebComponentProps } from \"../utils/createComponent.js\";\nexport { ContextMenuElement, };\nexport type ContextMenuEventMap = Readonly<{\n    onItemSelected: EventName<_ContextMenuEventMap[\"item-selected\"]>;\n    onOpenedChanged: EventName<_ContextMenuEventMap[\"opened-changed\"]>;\n}>;\nconst events = { onItemSelected: \"item-selected\", onOpenedChanged: \"opened-changed\" } as ContextMenuEventMap;\nexport type ContextMenuProps = WebComponentProps<ContextMenuElement, ContextMenuEventMap>;\nexport const ContextMenu = createComponent({\n    elementClass: ContextMenuElement, events, react: React, tagName: \"vaadin-context-menu\"\n});\n"],
   "mappings": "AAAA,WAAc,8CACd,OAAgD,cAAAA,MAAyD,QCAzG,OAAS,eAAeC,MAA6E,8CACrG,UAAYC,MAAW,QACvB,OAAS,mBAAAC,MAA+C,6BAMxD,IAAMC,EAAS,CAAE,eAAgB,gBAAiB,gBAAiB,gBAAiB,EAEvEC,EAAcC,EAAgB,CACvC,aAAcC,EAAoB,OAAAH,EAAQ,MAAOI,EAAO,QAAS,qBACrE,CAAC,EDJD,OAAyC,sBAAAC,MAA0B,oCACnE,OAAS,mBAAAC,EAAiB,0BAAAC,MAA8B,oCAoDpD,eAAAC,MAAA,oBAnBJ,SAASC,EACPC,EACAC,EACqB,CACrB,GAAM,CAACC,EAASC,CAAQ,EAAIR,EAAmBK,EAAM,QAAQ,EACvD,CAACI,EAAaC,CAAiB,EAAIR,EAAuBG,EAAM,MAAO,0BAA0B,EAEjGM,EAAiBN,EAAM,eAW7B,OACEF,EAACC,EAAA,CACE,GAAGC,EACJ,IAAKC,EACL,SAAUE,EACV,MAAOE,EACP,eAhByBC,EACxBC,GAAoD,CAEnD,OAAO,OAAOA,EAAM,OAAQ,CAC1B,MAAOX,EAAgBW,EAAM,OAAO,KAAK,CAC3C,CAAC,EAEDD,EAAeC,CAA4C,CAC7D,EACA,OASC,UAAAP,EAAM,SACNE,EACAE,GACH,CAEJ,CAEA,IAAMI,EAAuBC,EAAWV,CAAW",
   "names": ["forwardRef", "ContextMenuElement", "React", "createComponent", "events", "ContextMenu", "createComponent", "ContextMenuElement", "React", "useContextRenderer", "getOriginalItem", "mapItemsWithComponents", "jsxs", "ContextMenu", "props", "ref", "portals", "renderer", "itemPortals", "webComponentItems", "onItemSelected", "event", "ForwardedContextMenu", "forwardRef"]
 }

package/Markdown.d.ts

@@ -0,0 +1,9 @@
+import { type ReactElement, type RefAttributes } from 'react';
+import { type MarkdownProps as _MarkdownProps, type MarkdownElement } from './generated/Markdown.js';
+export * from './generated/Markdown.js';
+export type MarkdownProps = Partial<Omit<_MarkdownProps, 'children' | 'content'>> & Readonly<{
+    children?: string | null;
+}>;
+declare const ForwardedMarkdown: (props: MarkdownProps & RefAttributes<MarkdownElement>) => ReactElement | null;
+export { ForwardedMarkdown as Markdown };
+//# sourceMappingURL=Markdown.d.ts.map

package/Markdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["src/Markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,YAAY,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,EAEL,KAAK,aAAa,IAAI,cAAc,EACpC,KAAK,eAAe,EACrB,MAAM,yBAAyB,CAAC;AAEjC,cAAc,yBAAyB,CAAC;AAExC,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,GAC/E,QAAQ,CAAC;IACP,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B,CAAC,CAAC;AAML,QAAA,MAAM,iBAAiB,EAA2B,CAChD,KAAK,EAAE,aAAa,GAAG,aAAa,CAAC,eAAe,CAAC,KAClD,YAAY,GAAG,IAAI,CAAC;AAEzB,OAAO,EAAE,iBAAiB,IAAI,QAAQ,EAAE,CAAC"}

package/Markdown.js

@@ -0,0 +1,2 @@
+export*from"@vaadin/markdown/vaadin-markdown.js";import{forwardRef as m}from"react";import{Markdown as n}from"@vaadin/markdown/vaadin-markdown.js";import*as a from"react";import{createComponent as p}from"./utils/createComponent.js";var d={},o=p({elementClass:n,events:d,react:a,tagName:"vaadin-markdown"});import{jsx as M}from"react/jsx-runtime";function w({children:r,...e},t){return M(o,{...e,ref:t,content:r??""})}var c=m(w);export{c as Markdown,n as MarkdownElement};
+//# sourceMappingURL=Markdown.js.map

package/Markdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/Markdown.tsx", "src/generated/Markdown.ts"],
+  "sourcesContent": ["export * from \"@vaadin/markdown/vaadin-markdown.js\";\nimport { forwardRef, type ForwardedRef, type ReactElement, type RefAttributes } from 'react';\nimport {\n  Markdown as _Markdown,\n  type MarkdownProps as _MarkdownProps,\n  type MarkdownElement,\n} from './generated/Markdown.js';\n\nexport * from './generated/Markdown.js';\n\nexport type MarkdownProps = Partial<Omit<_MarkdownProps, 'children' | 'content'>> &\n  Readonly<{\n    children?: string | null;\n  }>;\n\nfunction Markdown({ children, ...props }: MarkdownProps, ref: ForwardedRef<MarkdownElement>): ReactElement | null {\n  return <_Markdown {...props} ref={ref} content={children ?? ''}></_Markdown>;\n}\n\nconst ForwardedMarkdown = forwardRef(Markdown) as (\n  props: MarkdownProps & RefAttributes<MarkdownElement>,\n) => ReactElement | null;\n\nexport { ForwardedMarkdown as Markdown };\n", "import type {} from \"@lit/react\";\nimport { Markdown as MarkdownElement, } from \"@vaadin/markdown/vaadin-markdown.js\";\nimport * as React from \"react\";\nimport { createComponent, type WebComponentProps } from \"../utils/createComponent.js\";\nexport { MarkdownElement, };\nexport type MarkdownEventMap = Readonly<{}>;\nconst events = {} as MarkdownEventMap;\nexport type MarkdownProps = WebComponentProps<MarkdownElement, MarkdownEventMap>;\nexport const Markdown = createComponent({\n    elementClass: MarkdownElement, events, react: React, tagName: \"vaadin-markdown\"\n});\n"],
+  "mappings": "AAAA,WAAc,sCACd,OAAS,cAAAA,MAA4E,QCArF,OAAS,YAAYC,MAAwB,sCAC7C,UAAYC,MAAW,QACvB,OAAS,mBAAAC,MAA+C,6BAGxD,IAAMC,EAAS,CAAC,EAEHC,EAAWC,EAAgB,CACpC,aAAcC,EAAiB,OAAAH,EAAQ,MAAOI,EAAO,QAAS,iBAClE,CAAC,EDMQ,cAAAC,MAAA,oBADT,SAASC,EAAS,CAAE,SAAAC,EAAU,GAAGC,CAAM,EAAkBC,EAAyD,CAChH,OAAOJ,EAACC,EAAA,CAAW,GAAGE,EAAO,IAAKC,EAAK,QAASF,GAAY,GAAI,CAClE,CAEA,IAAMG,EAAoBC,EAAWL,CAAQ",
+  "names": ["forwardRef", "MarkdownElement", "React", "createComponent", "events", "Markdown", "createComponent", "MarkdownElement", "React", "jsx", "Markdown", "children", "props", "ref", "ForwardedMarkdown", "forwardRef"]
+}

package/MasterDetailLayout.d.ts

@@ -0,0 +1,37 @@
+import { MasterDetailLayout as _MasterDetailLayout } from './generated/MasterDetailLayout.js';
+import React from 'react';
+export * from './generated/MasterDetailLayout.js';
+type MasterProps = React.PropsWithChildren<{}>;
+type DetailProps = React.PropsWithChildren<{}>;
+declare const MasterDetailLayoutWithValidation: React.FC<React.ComponentProps<typeof _MasterDetailLayout>>;
+/**
+ * `MasterDetailLayout` is a React component for building UIs with a master
+ * (or primary) area and a detail (or secondary) area that is displayed next to, or
+ * overlaid on top of, the master area, depending on configuration and viewport size.
+ *
+ * Content for each area should be wrapped into to the respective
+ * `MasterDetailLayout.Master` and `MasterDetailLayout.Detail` wrapper components.
+ * Using any other component as a child will throw an error. To ensure that view
+ * transitions are run properly, details content should be rendered conditionally
+ * into the `MasterDetailLayout.Detail` component.
+ *
+ * @example
+ * ```tsx
+ * const selectedProduct = useSignal<Product | null>(null);
+ *
+ * <MasterDetailLayout>
+ *   <MasterDetailLayout.Master>
+ *     <ProductList onSelect={(product) => { selectedProduct.value = product }} />
+ *   </MasterDetailLayout.Master>
+ *   <MasterDetailLayout.Detail>
+ *     { selectedProduct.value && <ProductDetail product={selectedProduct.value} /> }
+ *   </MasterDetailLayout.Detail>
+ * </MasterDetailLayout>
+ * ```
+ */
+declare const MasterDetailLayout: typeof MasterDetailLayoutWithValidation & {
+    Master: React.FC<MasterProps>;
+    Detail: React.FC<DetailProps>;
+};
+export { MasterDetailLayout };
+//# sourceMappingURL=MasterDetailLayout.d.ts.map

package/MasterDetailLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MasterDetailLayout.d.ts","sourceRoot":"","sources":["src/MasterDetailLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,IAAI,mBAAmB,EAE1C,MAAM,mCAAmC,CAAC;AAC3C,OAAO,KAAuD,MAAM,OAAO,CAAC;AAE5E,cAAc,mCAAmC,CAAC;AAElD,KAAK,WAAW,GAAG,KAAK,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAAC;AAC/C,KAAK,WAAW,GAAG,KAAK,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAAC;AAoI/C,QAAA,MAAM,gCAAgC,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAIhG,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,QAAA,MAAM,kBAAkB,EAAuC,OAAO,gCAAgC,GAAG;IACvG,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;IAC9B,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;CAC/B,CAAC;AAKF,OAAO,EAAE,kBAAkB,EAAE,CAAC"}

package/MasterDetailLayout.js

@@ -0,0 +1,2 @@
+export*from"@vaadin/master-detail-layout/vaadin-master-detail-layout.js";import{MasterDetailLayout as v}from"@vaadin/master-detail-layout/vaadin-master-detail-layout.js";import*as L from"react";import{createComponent as R}from"./utils/createComponent.js";var P={onBackdropClick:"backdrop-click",onDetailEscapePress:"detail-escape-press"},m=R({elementClass:v,events:P,react:L,tagName:"vaadin-master-detail-layout"});import s,{useEffect as k,useLayoutEffect as x,useRef as p,useState as f}from"react";import{Fragment as A,jsx as d,jsxs as N}from"react/jsx-runtime";function D({children:t}){return t}function b(t,e){let n=s.Children.toArray(t).filter(a=>s.isValidElement(a)),l=s.Children.toArray(e).filter(a=>s.isValidElement(a));if(n.length!==l.length)return!0;for(let a=0;a<n.length;a++){let r=n[a],i=l[a];if(r.type!==i.type||r.key!==i.key)return!0}return!1}function M({children:t}){let e=p(null),n=p(0),l=p(null),a=n.current+1,[r,i]=f("idle"),[c,y]=f(t);return x(()=>{let u=e.current?.closest("vaadin-master-detail-layout");if(u){if(r==="idle"){let o=e.current.childElementCount>0;e.current.setAttribute("slot",o?"detail":"detail-hidden")}else if(r==="starting"){let o=e.current.childElementCount>0,E=l.current.childElementCount>0,C=o&&E?"replace":o?"remove":"add";u._startTransition(C,()=>{i("ready"),y(t),n.current=a})}else if(r==="ready"){let o=e.current.childElementCount>0;e.current.setAttribute("slot",o?"detail":"detail-hidden"),u._finishTransition().then(()=>{i("idle")})}}},[r,c]),k(()=>{r==="idle"&&(b(c,t)?i("starting"):y(t))},[r,t]),N(A,{children:[d("div",{ref:e,style:{display:"contents"},children:c},n.current),r==="starting"&&d("div",{ref:l,style:{display:"none"},children:t},a)]})}function _(t){s.Children.forEach(t,e=>{if(s.isValidElement(e)&&e.type!==D&&e.type!==M)throw new Error("Invalid child in MasterDetailLayout. Only <MasterDetailLayout.Master> and <MasterDetailLayout.Detail> components are allowed. Check the component docs for proper usage.")})}var g=t=>(_(t.children),d(m,{...t})),h=g;h.Master=D;h.Detail=M;export{h as MasterDetailLayout,v as MasterDetailLayoutElement};
+//# sourceMappingURL=MasterDetailLayout.js.map

package/MasterDetailLayout.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/MasterDetailLayout.tsx", "src/generated/MasterDetailLayout.ts"],
+  "sourcesContent": ["export * from \"@vaadin/master-detail-layout/vaadin-master-detail-layout.js\";\nimport {\n  MasterDetailLayout as _MasterDetailLayout,\n  MasterDetailLayoutElement,\n} from './generated/MasterDetailLayout.js';\nimport React, { useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nexport * from './generated/MasterDetailLayout.js';\n\ntype MasterProps = React.PropsWithChildren<{}>;\ntype DetailProps = React.PropsWithChildren<{}>;\n\ntype MasterDetailLayoutElementWithInternalAPI = MasterDetailLayoutElement & {\n  _startTransition: (transitionType: 'add' | 'remove' | 'replace', callback: () => void) => void;\n  _finishTransition: () => Promise<void>;\n};\n\nfunction Master({ children }: MasterProps) {\n  return children;\n}\n\n/**\n * Compares two sets of React children to detect meaningful changes, ignoring text nodes.\n * Compares by component type and key.\n *\n * @param prevChildren Previous children\n * @param nextChildren Current children\n * @returns True if the non-text children are meaningfully different, false otherwise\n */\nfunction areChildrenDifferent(prevChildren: React.ReactNode, nextChildren: React.ReactNode): boolean {\n  // Convert to arrays and filter out text nodes\n  const prevArray = React.Children.toArray(prevChildren).filter((child) => React.isValidElement(child));\n  const nextArray = React.Children.toArray(nextChildren).filter((child) => React.isValidElement(child));\n\n  // If lengths are different, children have changed\n  if (prevArray.length !== nextArray.length) {\n    return true;\n  }\n\n  // Compare each element by type and key\n  for (let i = 0; i < prevArray.length; i++) {\n    const prevChild = prevArray[i] as React.ReactElement;\n    const nextChild = nextArray[i] as React.ReactElement;\n\n    // Compare by type\n    if (prevChild.type !== nextChild.type) {\n      return true;\n    }\n\n    // Compare by key (React.Children.toArray adds keys if missing)\n    if (prevChild.key !== nextChild.key) {\n      return true;\n    }\n  }\n\n  return false;\n}\n\nfunction Detail({ children }: DetailProps) {\n  const currentDetailsRef = useRef<HTMLDivElement>(null);\n  const currentDetailsKey = useRef<number>(0);\n  const nextDetailsRef = useRef<HTMLDivElement>(null);\n  const nextDetailsKey = currentDetailsKey.current + 1;\n  const [state, setState] = useState('idle');\n  const [currentChildren, setCurrentChildren] = useState(children);\n\n  useLayoutEffect(() => {\n    const layout = currentDetailsRef.current?.closest(\n      'vaadin-master-detail-layout',\n    ) as MasterDetailLayoutElementWithInternalAPI;\n    if (!layout) {\n      return;\n    }\n\n    if (state === 'idle') {\n      // No transition in progress\n      // Just update slot name\n      const hasChildren = currentDetailsRef.current!.childElementCount > 0;\n      currentDetailsRef.current!.setAttribute('slot', hasChildren ? 'detail' : 'detail-hidden');\n    } else if (state === 'starting') {\n      // Transition is starting and old and (invisible) new details are rendered\n      // Determine the transition type based on old and new detail contents\n      const hasCurrentDetails = currentDetailsRef.current!.childElementCount > 0;\n      const hasNextDetails = nextDetailsRef.current!.childElementCount > 0;\n      const transitionType = hasCurrentDetails && hasNextDetails ? 'replace' : hasCurrentDetails ? 'remove' : 'add';\n      // Start transition to capture old DOM state\n      layout._startTransition(transitionType, () => {\n        // Once old DOM state is captured, render with new details only\n        setState('ready');\n        setCurrentChildren(children);\n        currentDetailsKey.current = nextDetailsKey;\n      });\n    } else if (state === 'ready') {\n      // Transition is ready and new details are rendered\n      // Update slot name to either show or hide the new details\n      const hasChildren = currentDetailsRef.current!.childElementCount > 0;\n      currentDetailsRef.current!.setAttribute('slot', hasChildren ? 'detail' : 'detail-hidden');\n      // Finish transition to animate to new DOM state\n      layout._finishTransition().then(() => {\n        // Transition is finished, reset state\n        setState('idle');\n      });\n    }\n  }, [state, currentChildren]);\n\n  useEffect(() => {\n    if (state !== 'idle') {\n      return;\n    }\n    if (areChildrenDifferent(currentChildren, children)) {\n      setState('starting');\n    } else {\n      setCurrentChildren(children);\n    }\n  }, [state, children]);\n\n  return (\n    <>\n      <div ref={currentDetailsRef} key={currentDetailsKey.current} style={{ display: 'contents' }}>\n        {currentChildren}\n      </div>\n      {state === 'starting' && (\n        <div ref={nextDetailsRef} key={nextDetailsKey} style={{ display: 'none' }}>\n          {children}\n        </div>\n      )}\n    </>\n  );\n}\n\nfunction validateChildren(children: React.ReactNode) {\n  React.Children.forEach(children, (child) => {\n    // Ignore non-React elements\n    // We especially want to ignore text nodes to allow for whitespace resulting from formatting\n    if (React.isValidElement(child) && child.type !== Master && child.type !== Detail) {\n      throw new Error(\n        'Invalid child in MasterDetailLayout. Only <MasterDetailLayout.Master> and <MasterDetailLayout.Detail> components are allowed. Check the component docs for proper usage.',\n      );\n    }\n  });\n}\n\nconst MasterDetailLayoutWithValidation: React.FC<React.ComponentProps<typeof _MasterDetailLayout>> = (props) => {\n  validateChildren(props.children);\n\n  return <_MasterDetailLayout {...props} />;\n};\n\n/**\n * `MasterDetailLayout` is a React component for building UIs with a master\n * (or primary) area and a detail (or secondary) area that is displayed next to, or\n * overlaid on top of, the master area, depending on configuration and viewport size.\n *\n * Content for each area should be wrapped into to the respective\n * `MasterDetailLayout.Master` and `MasterDetailLayout.Detail` wrapper components.\n * Using any other component as a child will throw an error. To ensure that view\n * transitions are run properly, details content should be rendered conditionally\n * into the `MasterDetailLayout.Detail` component.\n *\n * @example\n * ```tsx\n * const selectedProduct = useSignal<Product | null>(null);\n *\n * <MasterDetailLayout>\n *   <MasterDetailLayout.Master>\n *     <ProductList onSelect={(product) => { selectedProduct.value = product }} />\n *   </MasterDetailLayout.Master>\n *   <MasterDetailLayout.Detail>\n *     { selectedProduct.value && <ProductDetail product={selectedProduct.value} /> }\n *   </MasterDetailLayout.Detail>\n * </MasterDetailLayout>\n * ```\n */\nconst MasterDetailLayout = MasterDetailLayoutWithValidation as typeof MasterDetailLayoutWithValidation & {\n  Master: React.FC<MasterProps>;\n  Detail: React.FC<DetailProps>;\n};\n\nMasterDetailLayout.Master = Master;\nMasterDetailLayout.Detail = Detail;\n\nexport { MasterDetailLayout };\n", "import type { EventName } from \"@lit/react\";\nimport { MasterDetailLayout as MasterDetailLayoutElement, type MasterDetailLayoutEventMap as _MasterDetailLayoutEventMap, } from \"@vaadin/master-detail-layout/vaadin-master-detail-layout.js\";\nimport * as React from \"react\";\nimport { createComponent, type WebComponentProps } from \"../utils/createComponent.js\";\nexport { MasterDetailLayoutElement, };\nexport type MasterDetailLayoutEventMap = Readonly<{\n    onBackdropClick: EventName<_MasterDetailLayoutEventMap[\"backdrop-click\"]>;\n    onDetailEscapePress: EventName<_MasterDetailLayoutEventMap[\"detail-escape-press\"]>;\n}>;\nconst events = { onBackdropClick: \"backdrop-click\", onDetailEscapePress: \"detail-escape-press\" } as MasterDetailLayoutEventMap;\nexport type MasterDetailLayoutProps = WebComponentProps<MasterDetailLayoutElement, MasterDetailLayoutEventMap>;\nexport const MasterDetailLayout = createComponent({\n    elementClass: MasterDetailLayoutElement, events, react: React, tagName: \"vaadin-master-detail-layout\"\n});\n"],
+  "mappings": "AAAA,WAAc,8DCCd,OAAS,sBAAsBA,MAAkG,8DACjI,UAAYC,MAAW,QACvB,OAAS,mBAAAC,MAA+C,6BAMxD,IAAMC,EAAS,CAAE,gBAAiB,iBAAkB,oBAAqB,qBAAsB,EAElFC,EAAqBC,EAAgB,CAC9C,aAAcC,EAA2B,OAAAH,EAAQ,MAAOI,EAAO,QAAS,6BAC5E,CAAC,EDRD,OAAOC,GAAS,aAAAC,EAAW,mBAAAC,EAAiB,UAAAC,EAAQ,YAAAC,MAAgB,QAgHhE,mBAAAC,EACE,OAAAC,EADF,QAAAC,MAAA,oBApGJ,SAASC,EAAO,CAAE,SAAAC,CAAS,EAAgB,CACzC,OAAOA,CACT,CAUA,SAASC,EAAqBC,EAA+BC,EAAwC,CAEnG,IAAMC,EAAYb,EAAM,SAAS,QAAQW,CAAY,EAAE,OAAQG,GAAUd,EAAM,eAAec,CAAK,CAAC,EAC9FC,EAAYf,EAAM,SAAS,QAAQY,CAAY,EAAE,OAAQE,GAAUd,EAAM,eAAec,CAAK,CAAC,EAGpG,GAAID,EAAU,SAAWE,EAAU,OACjC,MAAO,GAIT,QAASC,EAAI,EAAGA,EAAIH,EAAU,OAAQG,IAAK,CACzC,IAAMC,EAAYJ,EAAUG,CAAC,EACvBE,EAAYH,EAAUC,CAAC,EAQ7B,GALIC,EAAU,OAASC,EAAU,MAK7BD,EAAU,MAAQC,EAAU,IAC9B,MAAO,EAEX,CAEA,MAAO,EACT,CAEA,SAASC,EAAO,CAAE,SAAAV,CAAS,EAAgB,CACzC,IAAMW,EAAoBjB,EAAuB,IAAI,EAC/CkB,EAAoBlB,EAAe,CAAC,EACpCmB,EAAiBnB,EAAuB,IAAI,EAC5CoB,EAAiBF,EAAkB,QAAU,EAC7C,CAACG,EAAOC,CAAQ,EAAIrB,EAAS,MAAM,EACnC,CAACsB,EAAiBC,CAAkB,EAAIvB,EAASK,CAAQ,EAE/D,OAAAP,EAAgB,IAAM,CACpB,IAAM0B,EAASR,EAAkB,SAAS,QACxC,6BACF,EACA,GAAKQ,GAIL,GAAIJ,IAAU,OAAQ,CAGpB,IAAMK,EAAcT,EAAkB,QAAS,kBAAoB,EACnEA,EAAkB,QAAS,aAAa,OAAQS,EAAc,SAAW,eAAe,CAC1F,SAAWL,IAAU,WAAY,CAG/B,IAAMM,EAAoBV,EAAkB,QAAS,kBAAoB,EACnEW,EAAiBT,EAAe,QAAS,kBAAoB,EAC7DU,EAAiBF,GAAqBC,EAAiB,UAAYD,EAAoB,SAAW,MAExGF,EAAO,iBAAiBI,EAAgB,IAAM,CAE5CP,EAAS,OAAO,EAChBE,EAAmBlB,CAAQ,EAC3BY,EAAkB,QAAUE,CAC9B,CAAC,CACH,SAAWC,IAAU,QAAS,CAG5B,IAAMK,EAAcT,EAAkB,QAAS,kBAAoB,EACnEA,EAAkB,QAAS,aAAa,OAAQS,EAAc,SAAW,eAAe,EAExFD,EAAO,kBAAkB,EAAE,KAAK,IAAM,CAEpCH,EAAS,MAAM,CACjB,CAAC,CACH,EACF,EAAG,CAACD,EAAOE,CAAe,CAAC,EAE3BzB,EAAU,IAAM,CACVuB,IAAU,SAGVd,EAAqBgB,EAAiBjB,CAAQ,EAChDgB,EAAS,UAAU,EAEnBE,EAAmBlB,CAAQ,EAE/B,EAAG,CAACe,EAAOf,CAAQ,CAAC,EAGlBF,EAAAF,EAAA,CACE,UAAAC,EAAC,OAAI,IAAKc,EAAmD,MAAO,CAAE,QAAS,UAAW,EACvF,SAAAM,GAD+BL,EAAkB,OAEpD,EACCG,IAAU,YACTlB,EAAC,OAAI,IAAKgB,EAAqC,MAAO,CAAE,QAAS,MAAO,EACrE,SAAAb,GAD4Bc,CAE/B,GAEJ,CAEJ,CAEA,SAASU,EAAiBxB,EAA2B,CACnDT,EAAM,SAAS,QAAQS,EAAWK,GAAU,CAG1C,GAAId,EAAM,eAAec,CAAK,GAAKA,EAAM,OAASN,GAAUM,EAAM,OAASK,EACzE,MAAM,IAAI,MACR,0KACF,CAEJ,CAAC,CACH,CAEA,IAAMe,EAAgGC,IACpGF,EAAiBE,EAAM,QAAQ,EAExB7B,EAAC8B,EAAA,CAAqB,GAAGD,EAAO,GA4BnCC,EAAqBF,EAK3BE,EAAmB,OAAS5B,EAC5B4B,EAAmB,OAASjB",
+  "names": ["MasterDetailLayoutElement", "React", "createComponent", "events", "MasterDetailLayout", "createComponent", "MasterDetailLayoutElement", "React", "React", "useEffect", "useLayoutEffect", "useRef", "useState", "Fragment", "jsx", "jsxs", "Master", "children", "areChildrenDifferent", "prevChildren", "nextChildren", "prevArray", "child", "nextArray", "i", "prevChild", "nextChild", "Detail", "currentDetailsRef", "currentDetailsKey", "nextDetailsRef", "nextDetailsKey", "state", "setState", "currentChildren", "setCurrentChildren", "layout", "hasChildren", "hasCurrentDetails", "hasNextDetails", "transitionType", "validateChildren", "MasterDetailLayoutWithValidation", "props", "MasterDetailLayout"]
+}

package/MenuBar.d.ts

@@ -10,7 +10,7 @@ export type MenuBarItem<TItemData extends object = object> = Omit<_MenuBarItem<T
     children?: Array<SubMenuItem<TItemData>>;
 };
 export type MenuBarItemSelectedEvent<TItem extends MenuBarItem = MenuBarItem> = CustomEvent<{
-    value: TItem;
+    value: MenuBarItem<TItem>;
 }>;
 export type MenuBarProps<TItem extends MenuBarItem = MenuBarItem> = Partial<Omit<_MenuBarProps, 'items' | 'onItemSelected'>> & Readonly<{
     items?: Array<TItem>;

package/MenuBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuBar.d.ts","sourceRoot":"","sources":["src/MenuBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,YAAY,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,YAAY,IAAI,aAAa,EAClC,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,WAAW,IAAI,YAAY,EACjC,MAAM,wBAAwB,CAAC;AAGhC,cAAc,wBAAwB,CAAC;AAEvC,MAAM,MAAM,WAAW,CAAC,SAAS,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrH,SAAS,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAElC,QAAQ,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,SAAS,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrH,SAAS,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAElC,QAAQ,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,wBAAwB,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,IAAI,WAAW,CAAC;IAAE,KAAK,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC;AAE9G,MAAM,MAAM,YAAY,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,IAAI,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,gBAAgB,CAAC,CAAC,GAC1H,QAAQ,CAAC;IACP,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAErB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACnE,CAAC,CAAC;AAyBL,QAAA,MAAM,gBAAgB,EAA0B,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,EACtF,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,GAAG,aAAa,CAAC,cAAc,CAAC,KACvD,YAAY,GAAG,IAAI,CAAC;AAEzB,OAAO,EAAE,gBAAgB,IAAI,OAAO,EAAE,CAAC"}
+{"version":3,"file":"MenuBar.d.ts","sourceRoot":"","sources":["src/MenuBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,YAAY,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,YAAY,IAAI,aAAa,EAClC,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,WAAW,IAAI,YAAY,EACjC,MAAM,wBAAwB,CAAC;AAGhC,cAAc,wBAAwB,CAAC;AAEvC,MAAM,MAAM,WAAW,CAAC,SAAS,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrH,SAAS,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAElC,QAAQ,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,SAAS,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrH,SAAS,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAElC,QAAQ,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,wBAAwB,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,IAAI,WAAW,CAAC;IAAE,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,CAAA;CAAE,CAAC,CAAC;AAE3H,MAAM,MAAM,YAAY,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,IAAI,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,gBAAgB,CAAC,CAAC,GAC1H,QAAQ,CAAC;IACP,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAErB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACnE,CAAC,CAAC;AAyBL,QAAA,MAAM,gBAAgB,EAA0B,CAAC,KAAK,SAAS,WAAW,GAAG,WAAW,EACtF,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,GAAG,aAAa,CAAC,cAAc,CAAC,KACvD,YAAY,GAAG,IAAI,CAAC;AAEzB,OAAO,EAAE,gBAAgB,IAAI,OAAO,EAAE,CAAC"}

package/MenuBar.js

@@ -1,2 +1,2 @@
-export*from"@vaadin/menu-bar/vaadin-menu-bar.js";import{forwardRef as I}from"react";import{MenuBar as u}from"@vaadin/menu-bar/vaadin-menu-bar.js";import*as p from"react";import{createComponent as M}from"./utils/createComponent.js";var s={onItemSelected:"item-selected"},a=M({elementClass:u,events:s,react:p,tagName:"vaadin-menu-bar"});import{getOriginalItem as l,mapItemsWithComponents as c}from"./utils/mapItemsWithComponents.js";import{jsxs as B}from"react/jsx-runtime";function d(e,r){let[m,o]=c(e.items,"vaadin-menu-bar-item"),n=e.onItemSelected;return B(a,{...e,ref:r,items:o,onItemSelected:n?t=>{Object.assign(t.detail,{value:l(t.detail.value)}),n(t)}:void 0,children:[e.children,m]})}var x=I(d);export{x as MenuBar,u as MenuBarElement};
+export*from"@vaadin/menu-bar/vaadin-menu-bar.js";import{forwardRef as s}from"react";import{MenuBar as u}from"@vaadin/menu-bar/vaadin-menu-bar.js";import*as p from"react";import{createComponent as M}from"./utils/createComponent.js";var I={onItemSelected:"item-selected"},a=M({elementClass:u,events:I,react:p,tagName:"vaadin-menu-bar"});import{getOriginalItem as l,mapItemsWithComponents as c}from"./utils/mapItemsWithComponents.js";import{jsxs as B}from"react/jsx-runtime";function d(e,r){let[m,o]=c(e.items,"vaadin-menu-bar-item"),n=e.onItemSelected;return B(a,{...e,ref:r,items:o,onItemSelected:n?t=>{Object.assign(t.detail,{value:l(t.detail.value)}),n(t)}:void 0,children:[e.children,m]})}var x=s(d);export{x as MenuBar,u as MenuBarElement};
 //# sourceMappingURL=MenuBar.js.map

package/MenuBar.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["src/MenuBar.tsx", "src/generated/MenuBar.ts"],
-  "sourcesContent": ["export * from \"@vaadin/menu-bar/vaadin-menu-bar.js\";\nimport { type ForwardedRef, forwardRef, type ReactElement, type RefAttributes } from 'react';\nimport {\n  MenuBar as _MenuBar,\n  type MenuBarElement,\n  type MenuBarProps as _MenuBarProps,\n  type MenuBarItem as _MenuBarItem,\n  type SubMenuItem as _SubMenuItem,\n} from './generated/MenuBar.js';\nimport { getOriginalItem, mapItemsWithComponents } from './utils/mapItemsWithComponents.js';\n\nexport * from './generated/MenuBar.js';\n\nexport type SubMenuItem<TItemData extends object = object> = Omit<_SubMenuItem<TItemData>, 'component' | 'children'> & {\n  component?: ReactElement | string;\n\n  children?: Array<SubMenuItem<TItemData>>;\n};\n\nexport type MenuBarItem<TItemData extends object = object> = Omit<_MenuBarItem<TItemData>, 'component' | 'children'> & {\n  component?: ReactElement | string;\n\n  children?: Array<SubMenuItem<TItemData>>;\n};\n\nexport type MenuBarItemSelectedEvent<TItem extends MenuBarItem = MenuBarItem> = CustomEvent<{ value: TItem }>;\n\nexport type MenuBarProps<TItem extends MenuBarItem = MenuBarItem> = Partial<Omit<_MenuBarProps, 'items' | 'onItemSelected'>> &\n  Readonly<{\n    items?: Array<TItem>;\n\n    onItemSelected?: (event: MenuBarItemSelectedEvent<TItem>) => void;\n  }>;\n\nfunction MenuBar<TItem extends MenuBarItem = MenuBarItem>(props: MenuBarProps<TItem>, ref: ForwardedRef<MenuBarElement>): ReactElement | null {\n  const [itemPortals, webComponentItems] = mapItemsWithComponents(props.items, 'vaadin-menu-bar-item');\n\n  const onItemSelected = props.onItemSelected;\n  const mappedOnItemSelected = onItemSelected\n    ? (event: CustomEvent<{ value: _MenuBarItem }>) => {\n        // Replace the mapped web component item with the original item\n        Object.assign(event.detail, {\n          value: getOriginalItem(event.detail.value),\n        });\n\n        onItemSelected(event as MenuBarItemSelectedEvent<TItem>);\n      }\n    : undefined;\n\n  return (\n    <_MenuBar {...props} ref={ref} items={webComponentItems} onItemSelected={mappedOnItemSelected}>\n      {props.children}\n      {itemPortals}\n    </_MenuBar>\n  );\n}\n\nconst ForwardedMenuBar = forwardRef(MenuBar) as <TItem extends MenuBarItem = MenuBarItem>(\n  props: MenuBarProps<TItem> & RefAttributes<MenuBarElement>,\n) => ReactElement | null;\n\nexport { ForwardedMenuBar as MenuBar };\n", "import type { EventName } from \"@lit/react\";\nimport { MenuBar as MenuBarElement, type MenuBarEventMap as _MenuBarEventMap, } from \"@vaadin/menu-bar/vaadin-menu-bar.js\";\nimport * as React from \"react\";\nimport { createComponent, type WebComponentProps } from \"../utils/createComponent.js\";\nexport { MenuBarElement, };\nexport type MenuBarEventMap = Readonly<{\n    onItemSelected: EventName<_MenuBarEventMap[\"item-selected\"]>;\n}>;\nconst events = { onItemSelected: \"item-selected\" } as MenuBarEventMap;\nexport type MenuBarProps = WebComponentProps<MenuBarElement, MenuBarEventMap>;\nexport const MenuBar = createComponent({\n    elementClass: MenuBarElement, events, react: React, tagName: \"vaadin-menu-bar\"\n});\n"],
+  "sourcesContent": ["export * from \"@vaadin/menu-bar/vaadin-menu-bar.js\";\nimport { type ForwardedRef, forwardRef, type ReactElement, type RefAttributes } from 'react';\nimport {\n  MenuBar as _MenuBar,\n  type MenuBarElement,\n  type MenuBarProps as _MenuBarProps,\n  type MenuBarItem as _MenuBarItem,\n  type SubMenuItem as _SubMenuItem,\n} from './generated/MenuBar.js';\nimport { getOriginalItem, mapItemsWithComponents } from './utils/mapItemsWithComponents.js';\n\nexport * from './generated/MenuBar.js';\n\nexport type SubMenuItem<TItemData extends object = object> = Omit<_SubMenuItem<TItemData>, 'component' | 'children'> & {\n  component?: ReactElement | string;\n\n  children?: Array<SubMenuItem<TItemData>>;\n};\n\nexport type MenuBarItem<TItemData extends object = object> = Omit<_MenuBarItem<TItemData>, 'component' | 'children'> & {\n  component?: ReactElement | string;\n\n  children?: Array<SubMenuItem<TItemData>>;\n};\n\nexport type MenuBarItemSelectedEvent<TItem extends MenuBarItem = MenuBarItem> = CustomEvent<{ value: MenuBarItem<TItem> }>;\n\nexport type MenuBarProps<TItem extends MenuBarItem = MenuBarItem> = Partial<Omit<_MenuBarProps, 'items' | 'onItemSelected'>> &\n  Readonly<{\n    items?: Array<TItem>;\n\n    onItemSelected?: (event: MenuBarItemSelectedEvent<TItem>) => void;\n  }>;\n\nfunction MenuBar<TItem extends MenuBarItem = MenuBarItem>(props: MenuBarProps<TItem>, ref: ForwardedRef<MenuBarElement>): ReactElement | null {\n  const [itemPortals, webComponentItems] = mapItemsWithComponents(props.items, 'vaadin-menu-bar-item');\n\n  const onItemSelected = props.onItemSelected;\n  const mappedOnItemSelected = onItemSelected\n    ? (event: CustomEvent<{ value: _MenuBarItem }>) => {\n        // Replace the mapped web component item with the original item\n        Object.assign(event.detail, {\n          value: getOriginalItem(event.detail.value),\n        });\n\n        onItemSelected(event as MenuBarItemSelectedEvent<TItem>);\n      }\n    : undefined;\n\n  return (\n    <_MenuBar {...props} ref={ref} items={webComponentItems} onItemSelected={mappedOnItemSelected}>\n      {props.children}\n      {itemPortals}\n    </_MenuBar>\n  );\n}\n\nconst ForwardedMenuBar = forwardRef(MenuBar) as <TItem extends MenuBarItem = MenuBarItem>(\n  props: MenuBarProps<TItem> & RefAttributes<MenuBarElement>,\n) => ReactElement | null;\n\nexport { ForwardedMenuBar as MenuBar };\n", "import type { EventName } from \"@lit/react\";\nimport { MenuBar as MenuBarElement, type MenuBarEventMap as _MenuBarEventMap, } from \"@vaadin/menu-bar/vaadin-menu-bar.js\";\nimport * as React from \"react\";\nimport { createComponent, type WebComponentProps } from \"../utils/createComponent.js\";\nexport { MenuBarElement, };\nexport type MenuBarEventMap = Readonly<{\n    onItemSelected: EventName<_MenuBarEventMap[\"item-selected\"]>;\n}>;\nconst events = { onItemSelected: \"item-selected\" } as MenuBarEventMap;\nexport type MenuBarProps = WebComponentProps<MenuBarElement, MenuBarEventMap>;\nexport const MenuBar = createComponent({\n    elementClass: MenuBarElement, events, react: React, tagName: \"vaadin-menu-bar\"\n});\n"],
   "mappings": "AAAA,WAAc,sCACd,OAA4B,cAAAA,MAAyD,QCArF,OAAS,WAAWC,MAAiE,sCACrF,UAAYC,MAAW,QACvB,OAAS,mBAAAC,MAA+C,6BAKxD,IAAMC,EAAS,CAAE,eAAgB,eAAgB,EAEpCC,EAAUC,EAAgB,CACnC,aAAcC,EAAgB,OAAAH,EAAQ,MAAOI,EAAO,QAAS,iBACjE,CAAC,EDHD,OAAS,mBAAAC,EAAiB,0BAAAC,MAA8B,oCAyCpD,eAAAC,MAAA,oBAhBJ,SAASC,EAAiDC,EAA4BC,EAAwD,CAC5I,GAAM,CAACC,EAAaC,CAAiB,EAAIN,EAAuBG,EAAM,MAAO,sBAAsB,EAE7FI,EAAiBJ,EAAM,eAY7B,OACEF,EAACC,EAAA,CAAU,GAAGC,EAAO,IAAKC,EAAK,MAAOE,EAAmB,eAZ9BC,EACxBC,GAAgD,CAE/C,OAAO,OAAOA,EAAM,OAAQ,CAC1B,MAAOT,EAAgBS,EAAM,OAAO,KAAK,CAC3C,CAAC,EAEDD,EAAeC,CAAwC,CACzD,EACA,OAIC,UAAAL,EAAM,SACNE,GACH,CAEJ,CAEA,IAAMI,EAAmBC,EAAWR,CAAO",
   "names": ["forwardRef", "MenuBarElement", "React", "createComponent", "events", "MenuBar", "createComponent", "MenuBarElement", "React", "getOriginalItem", "mapItemsWithComponents", "jsxs", "MenuBar", "props", "ref", "itemPortals", "webComponentItems", "onItemSelected", "event", "ForwardedMenuBar", "forwardRef"]
 }

package/css/lumo/mixins/RequiredField.css

@@ -6,10 +6,10 @@
     color: var(--vaadin-input-field-label-color, var(--lumo-secondary-text-color));
     font-weight: var(--vaadin-input-field-label-font-weight, 500);
     font-size: var(--vaadin-input-field-label-font-size, var(--lumo-font-size-s));
-    margin-left: calc(var(--lumo-border-radius-m) / 4);
     transition: color 0.2s;
     line-height: 1;
-    padding-right: 1em;
+    padding-inline-start: calc(var(--lumo-border-radius-m) / 4);
+    padding-inline-end: 1em;
     padding-bottom: 0.5em;
     /* As a workaround for diacritics being cut off, add a top padding and a
     negative margin to compensate */
@@ -93,16 +93,6 @@
 
   /* RTL specific styles */
 
-  :host([dir='rtl']) [part='label'] {
-    margin-left: 0;
-    margin-right: calc(var(--lumo-border-radius-m) / 4);
-  }
-
-  :host([dir='rtl']) [part='label'] {
-    padding-left: 1em;
-    padding-right: 0;
-  }
-
   :host([dir='rtl']) [part='required-indicator']::after {
     right: auto;
     left: 0;

package/generated/Markdown.d.ts

@@ -0,0 +1,9 @@
+import { Markdown as MarkdownElement } from "@vaadin/markdown/vaadin-markdown.js";
+import * as React from "react";
+import { type WebComponentProps } from "../utils/createComponent.js";
+export * from "@vaadin/markdown/vaadin-markdown.js";
+export { MarkdownElement, };
+export type MarkdownEventMap = Readonly<{}>;
+export type MarkdownProps = WebComponentProps<MarkdownElement, MarkdownEventMap>;
+export declare const Markdown: (props: Partial<import("../utils/createComponent.js").ThemedWebComponentProps<MarkdownElement, Readonly<{}>>> & React.RefAttributes<MarkdownElement>) => React.ReactElement | null;
+//# sourceMappingURL=Markdown.d.ts.map

package/generated/Markdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../src/generated/Markdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAG,MAAM,qCAAqC,CAAC;AACnF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,KAAK,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AACtF,cAAc,qCAAqC,CAAC;AACpD,OAAO,EAAE,eAAe,GAAG,CAAC;AAC5B,MAAM,MAAM,gBAAgB,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AAE5C,MAAM,MAAM,aAAa,GAAG,iBAAiB,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAC;AACjF,eAAO,MAAM,QAAQ,oLAEnB,CAAC"}

package/generated/MasterDetailLayout.d.ts

@@ -0,0 +1,16 @@
+import type { EventName } from "@lit/react";
+import { MasterDetailLayout as MasterDetailLayoutElement, type MasterDetailLayoutEventMap as _MasterDetailLayoutEventMap } from "@vaadin/master-detail-layout/vaadin-master-detail-layout.js";
+import * as React from "react";
+import { type WebComponentProps } from "../utils/createComponent.js";
+export * from "@vaadin/master-detail-layout/vaadin-master-detail-layout.js";
+export { MasterDetailLayoutElement, };
+export type MasterDetailLayoutEventMap = Readonly<{
+    onBackdropClick: EventName<_MasterDetailLayoutEventMap["backdrop-click"]>;
+    onDetailEscapePress: EventName<_MasterDetailLayoutEventMap["detail-escape-press"]>;
+}>;
+export type MasterDetailLayoutProps = WebComponentProps<MasterDetailLayoutElement, MasterDetailLayoutEventMap>;
+export declare const MasterDetailLayout: (props: Partial<import("../utils/createComponent.js").ThemedWebComponentProps<MasterDetailLayoutElement, Readonly<{
+    onBackdropClick: EventName<_MasterDetailLayoutEventMap["backdrop-click"]>;
+    onDetailEscapePress: EventName<_MasterDetailLayoutEventMap["detail-escape-press"]>;
+}>>> & React.RefAttributes<MasterDetailLayoutElement>) => React.ReactElement | null;
+//# sourceMappingURL=MasterDetailLayout.d.ts.map

package/generated/MasterDetailLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MasterDetailLayout.d.ts","sourceRoot":"","sources":["../src/generated/MasterDetailLayout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,EAAE,kBAAkB,IAAI,yBAAyB,EAAE,KAAK,0BAA0B,IAAI,2BAA2B,EAAG,MAAM,6DAA6D,CAAC;AAC/L,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,KAAK,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AACtF,cAAc,6DAA6D,CAAC;AAC5E,OAAO,EAAE,yBAAyB,GAAG,CAAC;AACtC,MAAM,MAAM,0BAA0B,GAAG,QAAQ,CAAC;IAC9C,eAAe,EAAE,SAAS,CAAC,2BAA2B,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAC1E,mBAAmB,EAAE,SAAS,CAAC,2BAA2B,CAAC,qBAAqB,CAAC,CAAC,CAAC;CACtF,CAAC,CAAC;AAEH,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,yBAAyB,EAAE,0BAA0B,CAAC,CAAC;AAC/G,eAAO,MAAM,kBAAkB;qBALV,SAAS,CAAC,2BAA2B,CAAC,gBAAgB,CAAC,CAAC;yBACpD,SAAS,CAAC,2BAA2B,CAAC,qBAAqB,CAAC,CAAC;mFAMpF,CAAC"}

package/index.d.ts

@@ -42,6 +42,8 @@ export * from "./Item.js";
 export * from "./ListBox.js";
 export * from "./LoginForm.js";
 export * from "./LoginOverlay.js";
+export * from "./Markdown.js";
+export * from "./MasterDetailLayout.js";
 export * from "./MenuBar.js";
 export * from "./MessageInput.js";
 export * from "./Message.js";

package/index.js

@@ -42,6 +42,8 @@ export * from "./Item.js";
 export * from "./ListBox.js";
 export * from "./LoginForm.js";
 export * from "./LoginOverlay.js";
+export * from "./Markdown.js";
+export * from "./MasterDetailLayout.js";
 export * from "./MenuBar.js";
 export * from "./MessageInput.js";
 export * from "./Message.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/react-components",
-  "version": "24.8.0-alpha2",
+  "version": "24.8.0-alpha20",
   "publishConfig": {
     "access": "public"
   },
@@ -27,65 +27,67 @@
   },
   "dependencies": {
     "@lit/react": "^1.0.7",
-    "@vaadin/a11y-base": "24.8.0-alpha2",
-    "@vaadin/accordion": "24.8.0-alpha2",
-    "@vaadin/app-layout": "24.8.0-alpha2",
-    "@vaadin/avatar": "24.8.0-alpha2",
-    "@vaadin/avatar-group": "24.8.0-alpha2",
-    "@vaadin/button": "24.8.0-alpha2",
-    "@vaadin/card": "24.8.0-alpha2",
-    "@vaadin/checkbox": "24.8.0-alpha2",
-    "@vaadin/checkbox-group": "24.8.0-alpha2",
-    "@vaadin/combo-box": "24.8.0-alpha2",
-    "@vaadin/component-base": "24.8.0-alpha2",
-    "@vaadin/confirm-dialog": "24.8.0-alpha2",
-    "@vaadin/context-menu": "24.8.0-alpha2",
-    "@vaadin/custom-field": "24.8.0-alpha2",
-    "@vaadin/date-picker": "24.8.0-alpha2",
-    "@vaadin/date-time-picker": "24.8.0-alpha2",
-    "@vaadin/details": "24.8.0-alpha2",
-    "@vaadin/dialog": "24.8.0-alpha2",
-    "@vaadin/email-field": "24.8.0-alpha2",
-    "@vaadin/field-base": "24.8.0-alpha2",
-    "@vaadin/field-highlighter": "24.8.0-alpha2",
-    "@vaadin/form-layout": "24.8.0-alpha2",
-    "@vaadin/grid": "24.8.0-alpha2",
-    "@vaadin/horizontal-layout": "24.8.0-alpha2",
-    "@vaadin/icon": "24.8.0-alpha2",
-    "@vaadin/icons": "24.8.0-alpha2",
-    "@vaadin/input-container": "24.8.0-alpha2",
-    "@vaadin/integer-field": "24.8.0-alpha2",
-    "@vaadin/item": "24.8.0-alpha2",
-    "@vaadin/list-box": "24.8.0-alpha2",
-    "@vaadin/lit-renderer": "24.8.0-alpha2",
-    "@vaadin/login": "24.8.0-alpha2",
-    "@vaadin/menu-bar": "24.8.0-alpha2",
-    "@vaadin/message-input": "24.8.0-alpha2",
-    "@vaadin/message-list": "24.8.0-alpha2",
-    "@vaadin/multi-select-combo-box": "24.8.0-alpha2",
-    "@vaadin/notification": "24.8.0-alpha2",
-    "@vaadin/number-field": "24.8.0-alpha2",
-    "@vaadin/overlay": "24.8.0-alpha2",
-    "@vaadin/password-field": "24.8.0-alpha2",
-    "@vaadin/popover": "24.8.0-alpha2",
-    "@vaadin/progress-bar": "24.8.0-alpha2",
-    "@vaadin/radio-group": "24.8.0-alpha2",
-    "@vaadin/scroller": "24.8.0-alpha2",
-    "@vaadin/select": "24.8.0-alpha2",
-    "@vaadin/side-nav": "24.8.0-alpha2",
-    "@vaadin/split-layout": "24.8.0-alpha2",
-    "@vaadin/tabs": "24.8.0-alpha2",
-    "@vaadin/tabsheet": "24.8.0-alpha2",
-    "@vaadin/text-area": "24.8.0-alpha2",
-    "@vaadin/text-field": "24.8.0-alpha2",
-    "@vaadin/time-picker": "24.8.0-alpha2",
-    "@vaadin/tooltip": "24.8.0-alpha2",
-    "@vaadin/upload": "24.8.0-alpha2",
-    "@vaadin/vaadin-lumo-styles": "24.8.0-alpha2",
-    "@vaadin/vaadin-material-styles": "24.8.0-alpha2",
-    "@vaadin/vaadin-themable-mixin": "24.8.0-alpha2",
-    "@vaadin/vertical-layout": "24.8.0-alpha2",
-    "@vaadin/virtual-list": "24.8.0-alpha2"
+    "@vaadin/a11y-base": "24.8.0-alpha20",
+    "@vaadin/accordion": "24.8.0-alpha20",
+    "@vaadin/app-layout": "24.8.0-alpha20",
+    "@vaadin/avatar": "24.8.0-alpha20",
+    "@vaadin/avatar-group": "24.8.0-alpha20",
+    "@vaadin/button": "24.8.0-alpha20",
+    "@vaadin/card": "24.8.0-alpha20",
+    "@vaadin/checkbox": "24.8.0-alpha20",
+    "@vaadin/checkbox-group": "24.8.0-alpha20",
+    "@vaadin/combo-box": "24.8.0-alpha20",
+    "@vaadin/component-base": "24.8.0-alpha20",
+    "@vaadin/confirm-dialog": "24.8.0-alpha20",
+    "@vaadin/context-menu": "24.8.0-alpha20",
+    "@vaadin/custom-field": "24.8.0-alpha20",
+    "@vaadin/date-picker": "24.8.0-alpha20",
+    "@vaadin/date-time-picker": "24.8.0-alpha20",
+    "@vaadin/details": "24.8.0-alpha20",
+    "@vaadin/dialog": "24.8.0-alpha20",
+    "@vaadin/email-field": "24.8.0-alpha20",
+    "@vaadin/field-base": "24.8.0-alpha20",
+    "@vaadin/field-highlighter": "24.8.0-alpha20",
+    "@vaadin/form-layout": "24.8.0-alpha20",
+    "@vaadin/grid": "24.8.0-alpha20",
+    "@vaadin/horizontal-layout": "24.8.0-alpha20",
+    "@vaadin/icon": "24.8.0-alpha20",
+    "@vaadin/icons": "24.8.0-alpha20",
+    "@vaadin/input-container": "24.8.0-alpha20",
+    "@vaadin/integer-field": "24.8.0-alpha20",
+    "@vaadin/item": "24.8.0-alpha20",
+    "@vaadin/list-box": "24.8.0-alpha20",
+    "@vaadin/lit-renderer": "24.8.0-alpha20",
+    "@vaadin/login": "24.8.0-alpha20",
+    "@vaadin/markdown": "24.8.0-alpha20",
+    "@vaadin/master-detail-layout": "24.8.0-alpha20",
+    "@vaadin/menu-bar": "24.8.0-alpha20",
+    "@vaadin/message-input": "24.8.0-alpha20",
+    "@vaadin/message-list": "24.8.0-alpha20",
+    "@vaadin/multi-select-combo-box": "24.8.0-alpha20",
+    "@vaadin/notification": "24.8.0-alpha20",
+    "@vaadin/number-field": "24.8.0-alpha20",
+    "@vaadin/overlay": "24.8.0-alpha20",
+    "@vaadin/password-field": "24.8.0-alpha20",
+    "@vaadin/popover": "24.8.0-alpha20",
+    "@vaadin/progress-bar": "24.8.0-alpha20",
+    "@vaadin/radio-group": "24.8.0-alpha20",
+    "@vaadin/scroller": "24.8.0-alpha20",
+    "@vaadin/select": "24.8.0-alpha20",
+    "@vaadin/side-nav": "24.8.0-alpha20",
+    "@vaadin/split-layout": "24.8.0-alpha20",
+    "@vaadin/tabs": "24.8.0-alpha20",
+    "@vaadin/tabsheet": "24.8.0-alpha20",
+    "@vaadin/text-area": "24.8.0-alpha20",
+    "@vaadin/text-field": "24.8.0-alpha20",
+    "@vaadin/time-picker": "24.8.0-alpha20",
+    "@vaadin/tooltip": "24.8.0-alpha20",
+    "@vaadin/upload": "24.8.0-alpha20",
+    "@vaadin/vaadin-lumo-styles": "24.8.0-alpha20",
+    "@vaadin/vaadin-material-styles": "24.8.0-alpha20",
+    "@vaadin/vaadin-themable-mixin": "24.8.0-alpha20",
+    "@vaadin/vertical-layout": "24.8.0-alpha20",
+    "@vaadin/virtual-list": "24.8.0-alpha20"
   },
   "author": "Vaadin Ltd.",
   "license": "Apache-2.0",
@@ -296,6 +298,14 @@
       "types": "./LoginOverlay.d.ts",
       "default": "./LoginOverlay.js"
     },
+    "./Markdown.js": {
+      "types": "./Markdown.d.ts",
+      "default": "./Markdown.js"
+    },
+    "./MasterDetailLayout.js": {
+      "types": "./MasterDetailLayout.d.ts",
+      "default": "./MasterDetailLayout.js"
+    },
     "./MenuBar.js": {
       "types": "./MenuBar.d.ts",
       "default": "./MenuBar.js"
@@ -448,6 +458,8 @@
     "./ListBox": "./ListBox.js",
     "./LoginForm": "./LoginForm.js",
     "./LoginOverlay": "./LoginOverlay.js",
+    "./Markdown": "./Markdown.js",
+    "./MasterDetailLayout": "./MasterDetailLayout.js",
     "./MenuBar": "./MenuBar.js",
     "./Message": "./Message.js",
     "./MessageInput": "./MessageInput.js",

package/utils/createComponent.js

@@ -1,2 +1,2 @@
-import{createComponent as n}from"@lit/react";window.Vaadin??={},window.Vaadin.registrations??=[],window.Vaadin.registrations.push({is:"@vaadin/react-components",version:"24.8.0-alpha2"});function s(e){const{elementClass:t}=e;return n("_properties"in t?{...e,elementClass:{name:t.name,prototype:{...t._properties,hidden:Boolean}}}:e)}export{s as createComponent};
+import{createComponent as n}from"@lit/react";window.Vaadin??={},window.Vaadin.registrations??=[],window.Vaadin.registrations.push({is:"@vaadin/react-components",version:"24.8.0-alpha20"});function s(e){const{elementClass:t}=e;return n("_properties"in t?{...e,elementClass:{name:t.name,prototype:{...t._properties,hidden:Boolean}}}:e)}export{s as createComponent};
 //# sourceMappingURL=createComponent.js.map

package/utils/createComponent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/utils/createComponent.ts"],
-  "sourcesContent": ["import { createComponent as _createComponent, type EventName } from '@lit/react';\nimport type { ThemePropertyMixinClass } from '@vaadin/vaadin-themable-mixin/vaadin-theme-property-mixin.js';\nimport type React from 'react';\nimport type { RefAttributes } from 'react';\n\ndeclare const __VERSION__: string;\n\ndeclare global {\n  interface VaadinRegistration {\n    is: string;\n    version: string;\n  }\n\n  interface Vaadin {\n    registrations?: VaadinRegistration[];\n  }\n\n  interface Window {\n    // @ts-expect-error: Different declaration from one of the dependencies.\n    Vaadin?: Vaadin;\n  }\n}\n\nwindow.Vaadin ??= {};\nwindow.Vaadin.registrations ??= [];\nwindow.Vaadin.registrations.push({\n  is: '@vaadin/react-components',\n  version: /* updated-by-script */ '24.8.0-alpha2',\n});\n\n// TODO: Remove when types from @lit-labs/react are exported\nexport type EventNames = Record<string, EventName | string>;\ntype Constructor<T> = { new (): T; name: string };\ntype PolymerConstructor<T> = Constructor<T> & { _properties: Record<string, unknown> };\ntype Options<I extends HTMLElement, E extends EventNames = {}> = Readonly<{\n  displayName?: string;\n  elementClass: Constructor<I> | PolymerConstructor<I>;\n  events?: E;\n  react: typeof window.React;\n  tagName: string;\n}>;\n\n// A map of expected event listener types based on EventNames.\ntype EventListeners<R extends EventNames> = {\n  [K in keyof R]?: R[K] extends EventName ? (e: R[K]['__eventType']) => void : (e: Event) => void;\n};\n\n// Props derived from custom element class. Currently has limitations of making\n// all properties optional and also surfaces life cycle methods in autocomplete.\n// TODO: LoginOverlay has \"autofocus\" property, so we add it back manually.\ntype ElementProps<I> = Partial<Omit<I, keyof HTMLElement>> & { autofocus?: boolean };\n\n// Acceptable props to the React component.\ntype ComponentProps<I, E extends EventNames = {}> = Omit<\n  React.HTMLAttributes<I>,\n  // Prefer type of provided event handler props or those on element over\n  // built-in HTMLAttributes\n  keyof E | keyof ElementProps<I>\n> &\n  EventListeners<E> &\n  ElementProps<I>;\n\nexport type ThemedWebComponentProps<\n  I extends ThemePropertyMixinClass & HTMLElement,\n  E extends EventNames = {},\n> = ComponentProps<I, E> & {\n  /**\n   * Attribute that can be used by the component to apply built-in style variants,\n   * or to propagate its value to the sub-components in Shadow DOM.\n   *\n   * @see ThemePropertyMixinClass#_theme\n   */\n  theme?: string;\n};\n\ntype AllWebComponentProps<I extends HTMLElement, E extends EventNames = {}> = I extends ThemePropertyMixinClass\n  ? ThemedWebComponentProps<I, E>\n  : ComponentProps<I, E>;\n\nexport type WebComponentProps<I extends HTMLElement, E extends EventNames = {}> = Partial<AllWebComponentProps<I, E>>;\n\n// We need a separate declaration here; otherwise, the TypeScript fails into the\n// endless loop trying to resolve the typings.\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>(\n  options: Options<I, E>,\n): (props: WebComponentProps<I, E> & RefAttributes<I>) => React.ReactElement | null;\n\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>(options: Options<I, E>): any {\n  const { elementClass } = options;\n\n  return _createComponent(\n    '_properties' in elementClass\n      ? {\n          ...options,\n          // TODO: improve or remove the Polymer workaround\n          // 'createComponent' relies on key presence on the custom element class,\n          // but Polymer defines properties on the prototype when the first element\n          // is created. Workaround: pass a mock object with properties in\n          // the prototype.\n          elementClass: {\n            // @ts-expect-error: it is a specific workaround for Polymer classes.\n            name: elementClass.name,\n            prototype: { ...elementClass._properties, hidden: Boolean },\n          },\n        }\n      : options,\n  );\n}\n"],
-  "mappings": "AAAA,OAAS,mBAAmBA,MAAwC,aAuBpE,OAAO,SAAW,CAAC,EACnB,OAAO,OAAO,gBAAkB,CAAC,EACjC,OAAO,OAAO,cAAc,KAAK,CAC/B,GAAI,2BACJ,QAAiC,eACnC,CAAC,EA2DM,SAASC,EAAkEC,EAA6B,CAC7G,KAAM,CAAE,aAAAC,CAAa,EAAID,EAEzB,OAAOF,EACL,gBAAiBG,EACb,CACE,GAAGD,EAMH,aAAc,CAEZ,KAAMC,EAAa,KACnB,UAAW,CAAE,GAAGA,EAAa,YAAa,OAAQ,OAAQ,CAC5D,CACF,EACAD,CACN,CACF",
+  "sourcesContent": ["import { createComponent as _createComponent, type EventName } from '@lit/react';\nimport type { ThemePropertyMixinClass } from '@vaadin/vaadin-themable-mixin/vaadin-theme-property-mixin.js';\nimport type React from 'react';\nimport type { RefAttributes } from 'react';\n\ndeclare const __VERSION__: string;\n\ndeclare global {\n  interface VaadinRegistration {\n    is: string;\n    version: string;\n  }\n\n  interface Vaadin {\n    registrations?: VaadinRegistration[];\n  }\n\n  interface Window {\n    // @ts-expect-error: Different declaration from one of the dependencies.\n    Vaadin?: Vaadin;\n  }\n}\n\nwindow.Vaadin ??= {};\nwindow.Vaadin.registrations ??= [];\nwindow.Vaadin.registrations.push({\n  is: '@vaadin/react-components',\n  version: /* updated-by-script */ '24.8.0-alpha20',\n});\n\n// TODO: Remove when types from @lit-labs/react are exported\nexport type EventNames = Record<string, EventName | string>;\ntype Constructor<T> = { new (): T; name: string };\ntype PolymerConstructor<T> = Constructor<T> & { _properties: Record<string, unknown> };\ntype Options<I extends HTMLElement, E extends EventNames = {}> = Readonly<{\n  displayName?: string;\n  elementClass: Constructor<I> | PolymerConstructor<I>;\n  events?: E;\n  react: typeof window.React;\n  tagName: string;\n}>;\n\n// A map of expected event listener types based on EventNames.\ntype EventListeners<R extends EventNames> = {\n  [K in keyof R]?: R[K] extends EventName ? (e: R[K]['__eventType']) => void : (e: Event) => void;\n};\n\n// Props derived from custom element class. Currently has limitations of making\n// all properties optional and also surfaces life cycle methods in autocomplete.\n// TODO: LoginOverlay has \"autofocus\" property, so we add it back manually.\ntype ElementProps<I> = Partial<Omit<I, keyof HTMLElement>> & { autofocus?: boolean };\n\n// Acceptable props to the React component.\ntype ComponentProps<I, E extends EventNames = {}> = Omit<\n  React.HTMLAttributes<I>,\n  // Prefer type of provided event handler props or those on element over\n  // built-in HTMLAttributes\n  keyof E | keyof ElementProps<I>\n> &\n  EventListeners<E> &\n  ElementProps<I>;\n\nexport type ThemedWebComponentProps<\n  I extends ThemePropertyMixinClass & HTMLElement,\n  E extends EventNames = {},\n> = ComponentProps<I, E> & {\n  /**\n   * Attribute that can be used by the component to apply built-in style variants,\n   * or to propagate its value to the sub-components in Shadow DOM.\n   *\n   * @see ThemePropertyMixinClass#_theme\n   */\n  theme?: string;\n};\n\ntype AllWebComponentProps<I extends HTMLElement, E extends EventNames = {}> = I extends ThemePropertyMixinClass\n  ? ThemedWebComponentProps<I, E>\n  : ComponentProps<I, E>;\n\nexport type WebComponentProps<I extends HTMLElement, E extends EventNames = {}> = Partial<AllWebComponentProps<I, E>>;\n\n// We need a separate declaration here; otherwise, the TypeScript fails into the\n// endless loop trying to resolve the typings.\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>(\n  options: Options<I, E>,\n): (props: WebComponentProps<I, E> & RefAttributes<I>) => React.ReactElement | null;\n\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>(options: Options<I, E>): any {\n  const { elementClass } = options;\n\n  return _createComponent(\n    '_properties' in elementClass\n      ? {\n          ...options,\n          // TODO: improve or remove the Polymer workaround\n          // 'createComponent' relies on key presence on the custom element class,\n          // but Polymer defines properties on the prototype when the first element\n          // is created. Workaround: pass a mock object with properties in\n          // the prototype.\n          elementClass: {\n            // @ts-expect-error: it is a specific workaround for Polymer classes.\n            name: elementClass.name,\n            prototype: { ...elementClass._properties, hidden: Boolean },\n          },\n        }\n      : options,\n  );\n}\n"],
+  "mappings": "AAAA,OAAS,mBAAmBA,MAAwC,aAuBpE,OAAO,SAAW,CAAC,EACnB,OAAO,OAAO,gBAAkB,CAAC,EACjC,OAAO,OAAO,cAAc,KAAK,CAC/B,GAAI,2BACJ,QAAiC,gBACnC,CAAC,EA2DM,SAASC,EAAkEC,EAA6B,CAC7G,KAAM,CAAE,aAAAC,CAAa,EAAID,EAEzB,OAAOF,EACL,gBAAiBG,EACb,CACE,GAAGD,EAMH,aAAc,CAEZ,KAAMC,EAAa,KACnB,UAAW,CAAE,GAAGA,EAAa,YAAa,OAAQ,OAAQ,CAC5D,CACF,EACAD,CACN,CACF",
   "names": ["_createComponent", "createComponent", "options", "elementClass"]
 }