fix: switch theme for single imported components (#356)

pskelin · web-flow · commit dcd64a9718b0 · 2019-04-23T15:24:59.000+03:00
When importing a single component like show in the documentation,
the url parameters for setting a theme stopped working,
unless a ThemePropertiesProvider module is also imported.

This change returns the previous behaviour, where the single
imports have all features working.
diff --git a/packages/main/src/Button.js b/packages/main/src/Button.js
@@ -11,6 +11,9 @@ import Icon from "./Icon.js";
 // Styles
 import buttonCss from "./themes/Button.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Calendar.js b/packages/main/src/Calendar.js
@@ -24,6 +24,9 @@ import "@ui5/webcomponents-core/dist/sap/ui/core/date/Gregorian.js";
 // Styles
 import calendarCSS from "./themes/Calendar.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/CalendarHeader.js b/packages/main/src/CalendarHeader.js
@@ -9,6 +9,9 @@ import CalendarHeaderRenderer from "./build/compiled/CalendarHeaderRenderer.lit.
 // Styles
 import styles from "./themes/CalendarHeader.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 const metadata = {
 	tag: "ui5-calendar-header",
 	properties: {
diff --git a/packages/main/src/Card.js b/packages/main/src/Card.js
@@ -10,6 +10,9 @@ import Icon from "./Icon.js";
 // Styles
 import cardCss from "./themes/Card.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/CheckBox.js b/packages/main/src/CheckBox.js
@@ -10,6 +10,9 @@ import Label from "./Label.js";
 // Styles
 import checkboxCss from "./themes/CheckBox.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/CustomListItem.js b/packages/main/src/CustomListItem.js
@@ -6,6 +6,9 @@ import CustomListItemRenderer from "./build/compiled/CustomListItemRenderer.lit.
 // Styles
 import columnListItemCss from "./themes/CustomListItem.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/DatePicker.js b/packages/main/src/DatePicker.js
@@ -28,6 +28,9 @@ import "@ui5/webcomponents-core/dist/sap/ui/core/date/Gregorian.js";
 // Styles
 import datePickerCss from "./themes/DatePicker.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/DayPicker.js b/packages/main/src/DayPicker.js
@@ -16,6 +16,9 @@ import DayPickerRenderer from "./build/compiled/DayPickerRenderer.lit.js";
 // Styles
 import dayPickerCSS from "./themes/DayPicker.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Dialog.js b/packages/main/src/Dialog.js
@@ -8,6 +8,9 @@ import DialogRenderer from "./build/compiled/DialogRenderer.lit.js";
 // Styles
 import dialogCss from "./themes/Dialog.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/GroupHeaderListItem.js b/packages/main/src/GroupHeaderListItem.js
@@ -8,6 +8,8 @@ import GroupHeaderListItemTemplateContext from "./GroupHeaderListItemTemplateCon
 // Styles
 import groupheaderListItemCss from "./themes/GroupHeaderListItem.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
 
 /**
  * @public
diff --git a/packages/main/src/Icon.js b/packages/main/src/Icon.js
@@ -8,6 +8,9 @@ import IconRenderer from "./build/compiled/IconRenderer.lit.js";
 // Styles
 import iconCss from "./themes/Icon.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Input.js b/packages/main/src/Input.js
@@ -18,6 +18,9 @@ import InputTemplateContext from "./InputTemplateContext.js";
 import styles from "./themes/Input.css.js";
 import shellbarInput from "./themes/ShellBarInput.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Label.js b/packages/main/src/Label.js
@@ -8,6 +8,9 @@ import LabelTemplateContext from "./LabelTemplateContext.js";
 // Styles
 import labelCss from "./themes/Label.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Link.js b/packages/main/src/Link.js
@@ -11,6 +11,9 @@ import LinkTemplateContext from "./LinkTemplateContext.js";
 // Styles
 import linkCss from "./themes/Link.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/List.js b/packages/main/src/List.js
@@ -16,6 +16,9 @@ import ListTemplateContext from "./ListTemplateContext.js";
 // Styles
 import listCss from "./themes/List.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/MessageStrip.js b/packages/main/src/MessageStrip.js
@@ -9,6 +9,9 @@ import Icon from "./Icon.js";
 // Styles
 import messageStripCss from "./themes/MessageStrip.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/MonthPicker.js b/packages/main/src/MonthPicker.js
@@ -15,6 +15,9 @@ import MonthPickerRenderer from "./build/compiled/MonthPickerRenderer.lit.js";
 // Styles
 import styles from "./themes/MonthPicker.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Panel.js b/packages/main/src/Panel.js
@@ -13,6 +13,9 @@ import { fetchResourceBundle, getResourceBundle } from "./ResourceBundleProvider
 // Styles
 import panelCss from "./themes/Panel.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Popover.js b/packages/main/src/Popover.js
@@ -15,6 +15,9 @@ import PopoverRenderer from "./build/compiled/PopoverRenderer.lit.js";
 // Styles
 import popoverCss from "./themes/Popover.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Popup.js b/packages/main/src/Popup.js
@@ -6,6 +6,9 @@ import { isEscape } from "@ui5/webcomponents-base/src/events/PseudoEvents.js";
 // Styles
 import styles from "./themes/Popup.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/RadioButton.js b/packages/main/src/RadioButton.js
@@ -18,6 +18,9 @@ import RadioButtonTemplateContext from "./RadioButtonTemplateContext.js";
 // Styles
 import radioButtonCss from "./themes/RadioButton.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Select.js b/packages/main/src/Select.js
@@ -18,6 +18,9 @@ import SelectTemplateContext from "./SelectTemplateContext.js";
 // Styles
 import selectCss from "./themes/Select.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/ShellBar.js b/packages/main/src/ShellBar.js
@@ -18,6 +18,9 @@ import ShellBarTemplateContext from "./ShellBarTemplateContext.js";
 // Styles
 import styles from "./themes/ShellBar.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/ShellBarItem.js b/packages/main/src/ShellBarItem.js
@@ -5,6 +5,9 @@ import URI from "@ui5/webcomponents-base/src/types/URI.js";
 // Template
 import ShellBarItemRenderer from "./build/compiled/ShellBarItemRenderer.lit.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/StandardListItem.js b/packages/main/src/StandardListItem.js
@@ -7,6 +7,9 @@ import StandardListItemRenderer from "./build/compiled/StandardListItemRenderer.
 
 // Styles
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Switch.js b/packages/main/src/Switch.js
@@ -10,6 +10,9 @@ import SwitchType from "./types/SwitchType.js";
 // Styles
 import switchCss from "./themes/Switch.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Tab.js b/packages/main/src/Tab.js
@@ -7,6 +7,9 @@ import IconColor from "./types/IconColor.js";
 import Icon from "./Icon.js";
 import TabRenderer from "./build/compiled/TabRenderer.lit.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/TabContainer.js b/packages/main/src/TabContainer.js
@@ -14,7 +14,10 @@ import Popover from "./Popover.js";
 import TabBase from "./TabBase.js";
 
 // Styles
-import buttonCss from "./themes/TabContainer.css.js";
+import tabContainerCss from "./themes/TabContainer.css.js";
+
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
 
 const SCROLL_STEP = 128;
 
@@ -162,7 +165,7 @@ class TabContainer extends UI5Element {
 	}
 
 	static get styles() {
-		return buttonCss;
+		return tabContainerCss;
 	}
 
 	static get renderer() {
diff --git a/packages/main/src/TabSeparator.js b/packages/main/src/TabSeparator.js
@@ -3,6 +3,9 @@ import TabSeparatorTemplateContext from "./TabSeparatorTemplateContext.js";
 import TabBase from "./TabBase.js";
 import TabSeparatorRenderer from "./build/compiled/TabSeparatorRenderer.lit.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Table.js b/packages/main/src/Table.js
@@ -9,6 +9,9 @@ import TableRenderer from "./build/compiled/TableRenderer.lit.js";
 // Styles
 import styles from "./themes/Table.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/TableCell.js b/packages/main/src/TableCell.js
@@ -5,6 +5,9 @@ import TableCellRenderer from "./build/compiled/TableCellRenderer.lit.js";
 // Styles
 import styles from "./themes/TableCell.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/TableColumn.js b/packages/main/src/TableColumn.js
@@ -7,6 +7,9 @@ import TableColumnRenderer from "./build/compiled/TableColumnRenderer.lit.js";
 // Styles
 import styles from "./themes/TableColumn.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 const metadata = {
 	tag: "ui5-table-column",
 	slots: /** @lends sap.ui.webcomponents.main.TableColumn.prototype */ {
diff --git a/packages/main/src/TableRow.js b/packages/main/src/TableRow.js
@@ -6,6 +6,9 @@ import TableRowRenderer from "./build/compiled/TableRowRenderer.lit.js";
 // Styles
 import styles from "./themes/TableRow.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/TextArea.js b/packages/main/src/TextArea.js
@@ -9,6 +9,9 @@ import { fetchResourceBundle, getResourceBundle } from "./ResourceBundleProvider
 // Styles
 import styles from "./themes/TextArea.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Timeline.js b/packages/main/src/Timeline.js
@@ -8,6 +8,9 @@ import TimelineRenderer from "./build/compiled/TimelineRenderer.lit.js";
 // Styles
 import styles from "./themes/Timeline.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/TimelineItem.js b/packages/main/src/TimelineItem.js
@@ -12,6 +12,9 @@ import TimelineItemRenderer from "./build/compiled/TimelineItemRenderer.lit.js";
 // Styles
 import styles from "./themes/TimelineItem.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/Title.js b/packages/main/src/Title.js
@@ -7,6 +7,9 @@ import TitleRenderer from "./build/compiled/TitleRenderer.lit.js";
 // Styles
 import titleCss from "./themes/Title.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/ToggleButton.js b/packages/main/src/ToggleButton.js
@@ -6,6 +6,9 @@ import ToggleButtonRenderer from "./build/compiled/ToggleButtonRenderer.lit.js";
 // Styles
 import toggleBtnCss from "./themes/ToggleButton.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
diff --git a/packages/main/src/YearPicker.js b/packages/main/src/YearPicker.js
@@ -16,6 +16,9 @@ import YearPickerRenderer from "./build/compiled/YearPickerRenderer.lit.js";
 // Styles
 import styles from "./themes/YearPicker.css.js";
 
+// all themes should work via the convenience import (inlined now, switch to json when elements can be imported individyally)
+import "./ThemePropertiesProvider.js";
+
 /**
  * @public
  */
