@vaadin/react-components 25.0.0-alpha18 → 25.0.0-alpha19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/react-components",
-  "version": "25.0.0-alpha18",
+  "version": "25.0.0-alpha19",
   "publishConfig": {
     "access": "public"
   },
@@ -27,66 +27,66 @@
   },
   "dependencies": {
     "@lit/react": "^1.0.7",
-    "@vaadin/a11y-base": "25.0.0-alpha18",
-    "@vaadin/accordion": "25.0.0-alpha18",
-    "@vaadin/app-layout": "25.0.0-alpha18",
-    "@vaadin/avatar": "25.0.0-alpha18",
-    "@vaadin/avatar-group": "25.0.0-alpha18",
-    "@vaadin/button": "25.0.0-alpha18",
-    "@vaadin/card": "25.0.0-alpha18",
-    "@vaadin/checkbox": "25.0.0-alpha18",
-    "@vaadin/checkbox-group": "25.0.0-alpha18",
-    "@vaadin/combo-box": "25.0.0-alpha18",
-    "@vaadin/component-base": "25.0.0-alpha18",
-    "@vaadin/confirm-dialog": "25.0.0-alpha18",
-    "@vaadin/context-menu": "25.0.0-alpha18",
-    "@vaadin/custom-field": "25.0.0-alpha18",
-    "@vaadin/date-picker": "25.0.0-alpha18",
-    "@vaadin/date-time-picker": "25.0.0-alpha18",
-    "@vaadin/details": "25.0.0-alpha18",
-    "@vaadin/dialog": "25.0.0-alpha18",
-    "@vaadin/email-field": "25.0.0-alpha18",
-    "@vaadin/field-base": "25.0.0-alpha18",
-    "@vaadin/field-highlighter": "25.0.0-alpha18",
-    "@vaadin/form-layout": "25.0.0-alpha18",
-    "@vaadin/grid": "25.0.0-alpha18",
-    "@vaadin/horizontal-layout": "25.0.0-alpha18",
-    "@vaadin/icon": "25.0.0-alpha18",
-    "@vaadin/icons": "25.0.0-alpha18",
-    "@vaadin/input-container": "25.0.0-alpha18",
-    "@vaadin/integer-field": "25.0.0-alpha18",
-    "@vaadin/item": "25.0.0-alpha18",
-    "@vaadin/list-box": "25.0.0-alpha18",
-    "@vaadin/lit-renderer": "25.0.0-alpha18",
-    "@vaadin/login": "25.0.0-alpha18",
-    "@vaadin/markdown": "25.0.0-alpha18",
-    "@vaadin/master-detail-layout": "25.0.0-alpha18",
-    "@vaadin/menu-bar": "25.0.0-alpha18",
-    "@vaadin/message-input": "25.0.0-alpha18",
-    "@vaadin/message-list": "25.0.0-alpha18",
-    "@vaadin/multi-select-combo-box": "25.0.0-alpha18",
-    "@vaadin/notification": "25.0.0-alpha18",
-    "@vaadin/number-field": "25.0.0-alpha18",
-    "@vaadin/overlay": "25.0.0-alpha18",
-    "@vaadin/password-field": "25.0.0-alpha18",
-    "@vaadin/popover": "25.0.0-alpha18",
-    "@vaadin/progress-bar": "25.0.0-alpha18",
-    "@vaadin/radio-group": "25.0.0-alpha18",
-    "@vaadin/scroller": "25.0.0-alpha18",
-    "@vaadin/select": "25.0.0-alpha18",
-    "@vaadin/side-nav": "25.0.0-alpha18",
-    "@vaadin/split-layout": "25.0.0-alpha18",
-    "@vaadin/tabs": "25.0.0-alpha18",
-    "@vaadin/tabsheet": "25.0.0-alpha18",
-    "@vaadin/text-area": "25.0.0-alpha18",
-    "@vaadin/text-field": "25.0.0-alpha18",
-    "@vaadin/time-picker": "25.0.0-alpha18",
-    "@vaadin/tooltip": "25.0.0-alpha18",
-    "@vaadin/upload": "25.0.0-alpha18",
-    "@vaadin/vaadin-lumo-styles": "25.0.0-alpha18",
-    "@vaadin/vaadin-themable-mixin": "25.0.0-alpha18",
-    "@vaadin/vertical-layout": "25.0.0-alpha18",
-    "@vaadin/virtual-list": "25.0.0-alpha18"
+    "@vaadin/a11y-base": "25.0.0-alpha19",
+    "@vaadin/accordion": "25.0.0-alpha19",
+    "@vaadin/app-layout": "25.0.0-alpha19",
+    "@vaadin/avatar": "25.0.0-alpha19",
+    "@vaadin/avatar-group": "25.0.0-alpha19",
+    "@vaadin/button": "25.0.0-alpha19",
+    "@vaadin/card": "25.0.0-alpha19",
+    "@vaadin/checkbox": "25.0.0-alpha19",
+    "@vaadin/checkbox-group": "25.0.0-alpha19",
+    "@vaadin/combo-box": "25.0.0-alpha19",
+    "@vaadin/component-base": "25.0.0-alpha19",
+    "@vaadin/confirm-dialog": "25.0.0-alpha19",
+    "@vaadin/context-menu": "25.0.0-alpha19",
+    "@vaadin/custom-field": "25.0.0-alpha19",
+    "@vaadin/date-picker": "25.0.0-alpha19",
+    "@vaadin/date-time-picker": "25.0.0-alpha19",
+    "@vaadin/details": "25.0.0-alpha19",
+    "@vaadin/dialog": "25.0.0-alpha19",
+    "@vaadin/email-field": "25.0.0-alpha19",
+    "@vaadin/field-base": "25.0.0-alpha19",
+    "@vaadin/field-highlighter": "25.0.0-alpha19",
+    "@vaadin/form-layout": "25.0.0-alpha19",
+    "@vaadin/grid": "25.0.0-alpha19",
+    "@vaadin/horizontal-layout": "25.0.0-alpha19",
+    "@vaadin/icon": "25.0.0-alpha19",
+    "@vaadin/icons": "25.0.0-alpha19",
+    "@vaadin/input-container": "25.0.0-alpha19",
+    "@vaadin/integer-field": "25.0.0-alpha19",
+    "@vaadin/item": "25.0.0-alpha19",
+    "@vaadin/list-box": "25.0.0-alpha19",
+    "@vaadin/lit-renderer": "25.0.0-alpha19",
+    "@vaadin/login": "25.0.0-alpha19",
+    "@vaadin/markdown": "25.0.0-alpha19",
+    "@vaadin/master-detail-layout": "25.0.0-alpha19",
+    "@vaadin/menu-bar": "25.0.0-alpha19",
+    "@vaadin/message-input": "25.0.0-alpha19",
+    "@vaadin/message-list": "25.0.0-alpha19",
+    "@vaadin/multi-select-combo-box": "25.0.0-alpha19",
+    "@vaadin/notification": "25.0.0-alpha19",
+    "@vaadin/number-field": "25.0.0-alpha19",
+    "@vaadin/overlay": "25.0.0-alpha19",
+    "@vaadin/password-field": "25.0.0-alpha19",
+    "@vaadin/popover": "25.0.0-alpha19",
+    "@vaadin/progress-bar": "25.0.0-alpha19",
+    "@vaadin/radio-group": "25.0.0-alpha19",
+    "@vaadin/scroller": "25.0.0-alpha19",
+    "@vaadin/select": "25.0.0-alpha19",
+    "@vaadin/side-nav": "25.0.0-alpha19",
+    "@vaadin/split-layout": "25.0.0-alpha19",
+    "@vaadin/tabs": "25.0.0-alpha19",
+    "@vaadin/tabsheet": "25.0.0-alpha19",
+    "@vaadin/text-area": "25.0.0-alpha19",
+    "@vaadin/text-field": "25.0.0-alpha19",
+    "@vaadin/time-picker": "25.0.0-alpha19",
+    "@vaadin/tooltip": "25.0.0-alpha19",
+    "@vaadin/upload": "25.0.0-alpha19",
+    "@vaadin/vaadin-lumo-styles": "25.0.0-alpha19",
+    "@vaadin/vaadin-themable-mixin": "25.0.0-alpha19",
+    "@vaadin/vertical-layout": "25.0.0-alpha19",
+    "@vaadin/virtual-list": "25.0.0-alpha19"
   },
   "author": "Vaadin Ltd.",
   "license": "Apache-2.0",
@@ -476,17 +476,6 @@
     "./Upload": "./Upload.js",
     "./VerticalLayout": "./VerticalLayout.js",
     "./VirtualList": "./VirtualList.js",
-    "./css/Lumo.css": "./css/Lumo.css",
-    "./css/lumo/Badge.css": "./css/lumo/Badge.css",
-    "./css/lumo/Color.css": "./css/lumo/Color.css",
-    "./css/lumo/ColorBase.css": "./css/lumo/ColorBase.css",
-    "./css/lumo/Font.css": "./css/lumo/Font.css",
-    "./css/lumo/FontIcons.css": "./css/lumo/FontIcons.css",
-    "./css/lumo/Sizing.css": "./css/lumo/Sizing.css",
-    "./css/lumo/Spacing.css": "./css/lumo/Spacing.css",
-    "./css/lumo/Style.css": "./css/lumo/Style.css",
-    "./css/lumo/Typography.css": "./css/lumo/Typography.css",
-    "./css/lumo/UserColors.css": "./css/lumo/UserColors.css",
     "./css/lumo/Utility.module.css": "./css/lumo/Utility.module.css",
     "./utils/createComponent.d.ts": "./utils/createComponent.d.ts",
     "./utils/createComponent.d.ts.map": "./utils/createComponent.d.ts.map",

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:"25.0.0-alpha18"});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:"25.0.0-alpha19"});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 */ '25.0.0-alpha18',\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"],
+  "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 */ '25.0.0-alpha19',\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"]
 }

package/css/Lumo.css

@@ -1,15 +0,0 @@
-/* Generated file, do not edit */
-
-@import url(./lumo/ColorBase.css);
-
-@import url(./lumo/FontIcons.css);
-
-@import url(./lumo/Sizing.css);
-
-@import url(./lumo/Style.css);
-
-@import url(./lumo/Spacing.css);
-
-@import url(./lumo/Font.css);
-
-@import url(./lumo/UserColors.css);

package/css/lumo/Badge.css

@@ -1,165 +0,0 @@
-/* Generated file, do not edit */
-
-
-  [theme~='badge'] {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    padding: 0.4em calc(0.5em + var(--lumo-border-radius-s) / 4);
-    color: var(--lumo-primary-text-color);
-    background-color: var(--lumo-primary-color-10pct);
-    border-radius: var(--lumo-border-radius-s);
-    font-family: var(--lumo-font-family);
-    font-size: var(--lumo-font-size-s);
-    line-height: 1;
-    font-weight: 500;
-    text-transform: initial;
-    letter-spacing: initial;
-    min-width: calc(var(--lumo-line-height-xs) * 1em + 0.45em);
-    flex-shrink: 0;
-  }
-
-  /* Ensure proper vertical alignment */
-  [theme~='badge']::before {
-    display: inline-block;
-    content: '\\2003';
-    width: 0;
-  }
-
-  [theme~='badge'][theme~='small'] {
-    font-size: var(--lumo-font-size-xxs);
-    line-height: 1;
-  }
-
-  /* Colors */
-
-  [theme~='badge'][theme~='success'] {
-    color: var(--lumo-success-text-color);
-    background-color: var(--lumo-success-color-10pct);
-  }
-
-  [theme~='badge'][theme~='error'] {
-    color: var(--lumo-error-text-color);
-    background-color: var(--lumo-error-color-10pct);
-  }
-
-  [theme~='badge'][theme~='warning'] {
-    color: var(--lumo-warning-text-color);
-    background-color: var(--lumo-warning-color-10pct);
-  }
-
-  [theme~='badge'][theme~='contrast'] {
-    color: var(--lumo-contrast-80pct);
-    background-color: var(--lumo-contrast-5pct);
-  }
-
-  /* Primary */
-
-  [theme~='badge'][theme~='primary'] {
-    color: var(--lumo-primary-contrast-color);
-    background-color: var(--lumo-primary-color);
-  }
-
-  [theme~='badge'][theme~='success'][theme~='primary'] {
-    color: var(--lumo-success-contrast-color);
-    background-color: var(--lumo-success-color);
-  }
-
-  [theme~='badge'][theme~='error'][theme~='primary'] {
-    color: var(--lumo-error-contrast-color);
-    background-color: var(--lumo-error-color);
-  }
-
-  [theme~='badge'][theme~='warning'][theme~='primary'] {
-    color: var(--lumo-warning-contrast-color);
-    background-color: var(--lumo-warning-color);
-  }
-
-  [theme~='badge'][theme~='contrast'][theme~='primary'] {
-    color: var(--lumo-base-color);
-    background-color: var(--lumo-contrast);
-  }
-
-  /* Links */
-
-  [theme~='badge'][href]:hover {
-    text-decoration: none;
-  }
-
-  /* Icon */
-
-  [theme~='badge'] > vaadin-icon {
-    margin: -0.25em 0;
-  }
-
-  [theme~='badge'] > vaadin-icon:first-child {
-    margin-left: -0.375em;
-  }
-
-  [theme~='badge'] > vaadin-icon:last-child {
-    margin-right: -0.375em;
-  }
-
-  vaadin-icon[theme~='badge'][icon] {
-    min-width: 0;
-    padding: 0;
-    font-size: 1rem;
-    width: var(--lumo-icon-size-m);
-    height: var(--lumo-icon-size-m);
-  }
-
-  vaadin-icon[theme~='badge'][icon][theme~='small'] {
-    width: var(--lumo-icon-size-s);
-    height: var(--lumo-icon-size-s);
-  }
-
-  /* Empty */
-
-  [theme~='badge']:not([icon]):empty {
-    min-width: 0;
-    width: 1em;
-    height: 1em;
-    padding: 0;
-    border-radius: 50%;
-    background-color: var(--lumo-primary-color);
-  }
-
-  [theme~='badge'][theme~='small']:not([icon]):empty {
-    width: 0.75em;
-    height: 0.75em;
-  }
-
-  [theme~='badge'][theme~='contrast']:not([icon]):empty {
-    background-color: var(--lumo-contrast);
-  }
-
-  [theme~='badge'][theme~='success']:not([icon]):empty {
-    background-color: var(--lumo-success-color);
-  }
-
-  [theme~='badge'][theme~='error']:not([icon]):empty {
-    background-color: var(--lumo-error-color);
-  }
-
-  [theme~='badge'][theme~='warning']:not([icon]):empty {
-    background-color: var(--lumo-warning-color);
-  }
-
-  /* Pill */
-
-  [theme~='badge'][theme~='pill'] {
-    --lumo-border-radius-s: 1em;
-  }
-
-  /* RTL specific styles */
-
-  [dir='rtl'][theme~='badge'] vaadin-icon:first-child {
-    margin-right: -0.375em;
-    margin-left: 0;
-  }
-
-  [dir='rtl'][theme~='badge'] vaadin-icon:last-child {
-    margin-left: -0.375em;
-    margin-right: 0;
-  }

package/css/lumo/Color.css

@@ -1,122 +0,0 @@
-/* Generated file, do not edit */
-
-@import url(./ColorBase.css);
-
-
-  [theme~='dark'] {
-    /* Base (background) */
-    --lumo-base-color: hsl(214, 35%, 21%);
-
-    /* Tint */
-    --lumo-tint-5pct: hsla(214, 65%, 85%, 0.06);
-    --lumo-tint-10pct: hsla(214, 60%, 80%, 0.14);
-    --lumo-tint-20pct: hsla(214, 64%, 82%, 0.23);
-    --lumo-tint-30pct: hsla(214, 69%, 84%, 0.32);
-    --lumo-tint-40pct: hsla(214, 73%, 86%, 0.41);
-    --lumo-tint-50pct: hsla(214, 78%, 88%, 0.5);
-    --lumo-tint-60pct: hsla(214, 82%, 90%, 0.58);
-    --lumo-tint-70pct: hsla(214, 87%, 92%, 0.69);
-    --lumo-tint-80pct: hsla(214, 91%, 94%, 0.8);
-    --lumo-tint-90pct: hsla(214, 96%, 96%, 0.9);
-    --lumo-tint: hsl(214, 100%, 98%);
-
-    /* Shade */
-    --lumo-shade-5pct: hsla(214, 0%, 0%, 0.07);
-    --lumo-shade-10pct: hsla(214, 4%, 2%, 0.15);
-    --lumo-shade-20pct: hsla(214, 8%, 4%, 0.23);
-    --lumo-shade-30pct: hsla(214, 12%, 6%, 0.32);
-    --lumo-shade-40pct: hsla(214, 16%, 8%, 0.41);
-    --lumo-shade-50pct: hsla(214, 20%, 10%, 0.5);
-    --lumo-shade-60pct: hsla(214, 24%, 12%, 0.6);
-    --lumo-shade-70pct: hsla(214, 28%, 13%, 0.7);
-    --lumo-shade-80pct: hsla(214, 32%, 13%, 0.8);
-    --lumo-shade-90pct: hsla(214, 33%, 13%, 0.9);
-    --lumo-shade: hsl(214, 33%, 13%);
-
-    /* Contrast */
-    --lumo-contrast-5pct: var(--lumo-tint-5pct);
-    --lumo-contrast-10pct: var(--lumo-tint-10pct);
-    --lumo-contrast-20pct: var(--lumo-tint-20pct);
-    --lumo-contrast-30pct: var(--lumo-tint-30pct);
-    --lumo-contrast-40pct: var(--lumo-tint-40pct);
-    --lumo-contrast-50pct: var(--lumo-tint-50pct);
-    --lumo-contrast-60pct: var(--lumo-tint-60pct);
-    --lumo-contrast-70pct: var(--lumo-tint-70pct);
-    --lumo-contrast-80pct: var(--lumo-tint-80pct);
-    --lumo-contrast-90pct: var(--lumo-tint-90pct);
-    --lumo-contrast: var(--lumo-tint);
-
-    /* Text */
-    --lumo-header-text-color: var(--lumo-contrast);
-    --lumo-body-text-color: var(--lumo-contrast-90pct);
-    --lumo-secondary-text-color: var(--lumo-contrast-70pct);
-    --lumo-tertiary-text-color: var(--lumo-contrast-50pct);
-    --lumo-disabled-text-color: var(--lumo-contrast-30pct);
-
-    /* Primary */
-    --lumo-primary-color: hsl(214, 90%, 48%);
-    --lumo-primary-color-50pct: hsla(214, 90%, 70%, 0.69);
-    --lumo-primary-color-10pct: hsla(214, 90%, 55%, 0.13);
-    --lumo-primary-text-color: hsl(214, 90%, 77%);
-    --lumo-primary-contrast-color: #fff;
-
-    /* Error */
-    --lumo-error-color: hsl(3, 79%, 49%);
-    --lumo-error-color-50pct: hsla(3, 75%, 62%, 0.5);
-    --lumo-error-color-10pct: hsla(3, 75%, 62%, 0.14);
-    --lumo-error-text-color: hsl(3, 100%, 80%);
-
-    /* Success */
-    --lumo-success-color: hsl(145, 72%, 30%);
-    --lumo-success-color-50pct: hsla(145, 92%, 51%, 0.5);
-    --lumo-success-color-10pct: hsla(145, 92%, 51%, 0.1);
-    --lumo-success-text-color: hsl(145, 85%, 46%);
-
-    /* Warning */
-    --lumo-warning-color: hsl(43, 100%, 48%);
-    --lumo-warning-color-10pct: hsla(40, 100%, 50%, 0.2);
-    --lumo-warning-text-color: hsl(45, 100%, 60%);
-    --lumo-warning-contrast-color: var(--lumo-shade-90pct);
-  }
-
-  html {
-    color: var(--lumo-body-text-color);
-    background-color: var(--lumo-base-color);
-    color-scheme: light;
-  }
-
-  [theme~='dark'] {
-    color: var(--lumo-body-text-color);
-    background-color: var(--lumo-base-color);
-    color-scheme: dark;
-  }
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    color: var(--lumo-header-text-color);
-  }
-
-  a:where(:any-link) {
-    color: var(--lumo-primary-text-color);
-  }
-
-  a:not(:any-link) {
-    color: var(--lumo-disabled-text-color);
-  }
-
-  blockquote {
-    color: var(--lumo-secondary-text-color);
-  }
-
-  code,
-  pre {
-    background-color: var(--lumo-contrast-10pct);
-    border-radius: var(--lumo-border-radius-m);
-  }
-  pre code {
-    background: transparent;
-  }

package/css/lumo/ColorBase.css

@@ -1,87 +0,0 @@
-/* Generated file, do not edit */
-
-
-  html {
-    /* Base (background) */
-    --lumo-base-color: #fff;
-
-    /* Tint */
-    --lumo-tint-5pct: hsla(0, 0%, 100%, 0.3);
-    --lumo-tint-10pct: hsla(0, 0%, 100%, 0.37);
-    --lumo-tint-20pct: hsla(0, 0%, 100%, 0.44);
-    --lumo-tint-30pct: hsla(0, 0%, 100%, 0.5);
-    --lumo-tint-40pct: hsla(0, 0%, 100%, 0.57);
-    --lumo-tint-50pct: hsla(0, 0%, 100%, 0.64);
-    --lumo-tint-60pct: hsla(0, 0%, 100%, 0.7);
-    --lumo-tint-70pct: hsla(0, 0%, 100%, 0.77);
-    --lumo-tint-80pct: hsla(0, 0%, 100%, 0.84);
-    --lumo-tint-90pct: hsla(0, 0%, 100%, 0.9);
-    --lumo-tint: #fff;
-
-    /* Shade */
-    --lumo-shade-5pct: hsla(214, 61%, 25%, 0.05);
-    --lumo-shade-10pct: hsla(214, 57%, 24%, 0.1);
-    --lumo-shade-20pct: hsla(214, 53%, 23%, 0.16);
-    --lumo-shade-30pct: hsla(214, 50%, 22%, 0.26);
-    --lumo-shade-40pct: hsla(214, 47%, 21%, 0.38);
-    --lumo-shade-50pct: hsla(214, 45%, 20%, 0.52);
-    --lumo-shade-60pct: hsla(214, 43%, 19%, 0.6);
-    --lumo-shade-70pct: hsla(214, 42%, 18%, 0.69);
-    --lumo-shade-80pct: hsla(214, 41%, 17%, 0.83);
-    --lumo-shade-90pct: hsla(214, 40%, 16%, 0.94);
-    --lumo-shade: hsl(214, 35%, 15%);
-
-    /* Contrast */
-    --lumo-contrast-5pct: var(--lumo-shade-5pct);
-    --lumo-contrast-10pct: var(--lumo-shade-10pct);
-    --lumo-contrast-20pct: var(--lumo-shade-20pct);
-    --lumo-contrast-30pct: var(--lumo-shade-30pct);
-    --lumo-contrast-40pct: var(--lumo-shade-40pct);
-    --lumo-contrast-50pct: var(--lumo-shade-50pct);
-    --lumo-contrast-60pct: var(--lumo-shade-60pct);
-    --lumo-contrast-70pct: var(--lumo-shade-70pct);
-    --lumo-contrast-80pct: var(--lumo-shade-80pct);
-    --lumo-contrast-90pct: var(--lumo-shade-90pct);
-    --lumo-contrast: var(--lumo-shade);
-
-    /* Text */
-    --lumo-header-text-color: var(--lumo-contrast);
-    --lumo-body-text-color: var(--lumo-contrast-90pct);
-    --lumo-secondary-text-color: var(--lumo-contrast-70pct);
-    --lumo-tertiary-text-color: var(--lumo-contrast-50pct);
-    --lumo-disabled-text-color: var(--lumo-contrast-30pct);
-
-    /* Primary */
-    --lumo-primary-color: hsl(214, 100%, 48%);
-    --lumo-primary-color-50pct: hsla(214, 100%, 49%, 0.76);
-    --lumo-primary-color-10pct: hsla(214, 100%, 60%, 0.13);
-    --lumo-primary-text-color: hsl(214, 100%, 43%);
-    --lumo-primary-contrast-color: #fff;
-
-    /* Error */
-    --lumo-error-color: hsl(3, 85%, 48%);
-    --lumo-error-color-50pct: hsla(3, 85%, 49%, 0.5);
-    --lumo-error-color-10pct: hsla(3, 85%, 49%, 0.1);
-    --lumo-error-text-color: hsl(3, 89%, 42%);
-    --lumo-error-contrast-color: #fff;
-
-    /* Success */
-    --lumo-success-color: hsl(145, 72%, 30%);
-    --lumo-success-color-50pct: hsla(145, 72%, 31%, 0.5);
-    --lumo-success-color-10pct: hsla(145, 72%, 31%, 0.1);
-    --lumo-success-text-color: hsl(145, 85%, 25%);
-    --lumo-success-contrast-color: #fff;
-
-    /* Warning */
-    --lumo-warning-color: hsl(48, 100%, 50%);
-    --lumo-warning-color-10pct: hsla(48, 100%, 50%, 0.25);
-    --lumo-warning-text-color: hsl(32, 100%, 30%);
-    --lumo-warning-contrast-color: var(--lumo-shade-90pct);
-  }
-
-  /* forced-colors mode adjustments */
-  @media (forced-colors: active) {
-    html {
-      --lumo-disabled-text-color: GrayText;
-    }
-  }

package/css/lumo/Font.css

@@ -1,22 +0,0 @@
-/* Generated file, do not edit */
-
-
-  html {
-    /* prettier-ignore */
-    --lumo-font-family: -apple-system, BlinkMacSystemFont, 'Roboto', 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-
-    /* Font sizes */
-    --lumo-font-size-xxs: 0.75rem;
-    --lumo-font-size-xs: 0.8125rem;
-    --lumo-font-size-s: 0.875rem;
-    --lumo-font-size-m: 1rem;
-    --lumo-font-size-l: 1.125rem;
-    --lumo-font-size-xl: 1.375rem;
-    --lumo-font-size-xxl: 1.75rem;
-    --lumo-font-size-xxxl: 2.5rem;
-
-    /* Line heights */
-    --lumo-line-height-xs: 1.25;
-    --lumo-line-height-s: 1.375;
-    --lumo-line-height-m: 1.625;
-  }