@sapudex/web-components 2.20.0 → 2.20.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Carousel.d.ts +29 -2
- package/dist/Carousel.js +34 -6
- package/dist/Carousel.js.map +1 -1
- package/dist/CarouselTemplate.js +2 -2
- package/dist/CarouselTemplate.js.map +1 -1
- package/dist/DatePicker.d.ts +4 -4
- package/dist/DatePicker.js +3 -10
- package/dist/DatePicker.js.map +1 -1
- package/dist/DatePickerPopoverTemplate.d.ts +2 -0
- package/dist/DatePickerPopoverTemplate.js +13 -0
- package/dist/DatePickerPopoverTemplate.js.map +1 -0
- package/dist/DatePickerTemplate.d.ts +2 -0
- package/dist/DatePickerTemplate.js +7 -0
- package/dist/DatePickerTemplate.js.map +1 -0
- package/dist/MediaPlayerTemplate.js +2 -2
- package/dist/MediaPlayerTemplate.js.map +1 -1
- package/dist/MessageStripTemplate.js +3 -1
- package/dist/MessageStripTemplate.js.map +1 -1
- package/dist/RatingBarTemplate.js +1 -1
- package/dist/RatingBarTemplate.js.map +1 -1
- package/dist/Review.js +3 -6
- package/dist/Review.js.map +1 -1
- package/dist/ReviewItem.d.ts +1 -1
- package/dist/ReviewItem.js +15 -18
- package/dist/ReviewItem.js.map +1 -1
- package/dist/ReviewItemTemplate.d.ts +2 -0
- package/dist/ReviewItemTemplate.js +10 -0
- package/dist/ReviewItemTemplate.js.map +1 -0
- package/dist/ReviewTemplate.d.ts +2 -0
- package/dist/ReviewTemplate.js +9 -0
- package/dist/ReviewTemplate.js.map +1 -0
- package/dist/TileTemplate.js +1 -1
- package/dist/TileTemplate.js.map +1 -1
- package/dist/assets/{InputSuggestions-DOj9B3SE.js → InputSuggestions-yR1p8cXL.js} +1 -1
- package/dist/assets/{ListItemStandardExpandableTextTemplate-C6q5EhEr.js → ListItemStandardExpandableTextTemplate-BovnAV24.js} +1 -1
- package/dist/assets/{bundle.esm-CmHUshBw.js → bundle.esm-C7AybWk0.js} +202 -202
- package/dist/css/themes/RatingIndicator.css +1 -1
- package/dist/css/themes/Slider.css +1 -1
- package/dist/custom-elements-internal.json +190 -144
- package/dist/custom-elements.json +174 -129
- package/dist/generated/themes/RatingIndicator.css.d.ts +1 -1
- package/dist/generated/themes/RatingIndicator.css.js +1 -1
- package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
- package/dist/generated/themes/Slider.css.d.ts +1 -1
- package/dist/generated/themes/Slider.css.js +1 -1
- package/dist/generated/themes/Slider.css.js.map +1 -1
- package/dist/vscode.html-custom-data.json +10 -0
- package/dist/web-types.json +24 -1
- package/package.json +1 -1
- package/src/Carousel.ts +36 -6
- package/src/CarouselTemplate.tsx +4 -0
- package/src/DatePicker.ts +7 -11
- package/src/DatePickerPopoverTemplate.tsx +35 -0
- package/src/DatePickerTemplate.tsx +27 -0
- package/src/MediaPlayerTemplate.tsx +20 -19
- package/src/MessageStripTemplate.tsx +4 -2
- package/src/RatingBarTemplate.tsx +1 -0
- package/src/Review.ts +3 -6
- package/src/ReviewItem.ts +15 -19
- package/src/ReviewItemTemplate.tsx +49 -0
- package/src/ReviewTemplate.tsx +69 -0
- package/src/TileTemplate.tsx +1 -0
- package/src/generated/themes/RatingIndicator.css.ts +1 -1
- package/src/generated/themes/Slider.css.ts +1 -1
- package/dist/generated/templates/DatePickerPopoverTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/DatePickerPopoverTemplate.lit.js +0 -10
- package/dist/generated/templates/DatePickerPopoverTemplate.lit.js.map +0 -1
- package/dist/generated/templates/DatePickerTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/DatePickerTemplate.lit.js +0 -10
- package/dist/generated/templates/DatePickerTemplate.lit.js.map +0 -1
- package/dist/generated/templates/ReviewItemTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/ReviewItemTemplate.lit.js +0 -10
- package/dist/generated/templates/ReviewItemTemplate.lit.js.map +0 -1
- package/dist/generated/templates/ReviewTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/ReviewTemplate.lit.js +0 -12
- package/dist/generated/templates/ReviewTemplate.lit.js.map +0 -1
- package/src/DatePicker.hbs +0 -19
- package/src/DatePickerPopover.hbs +0 -24
- package/src/Review.hbs +0 -44
- package/src/ReviewItem.hbs +0 -20
- package/src/generated/templates/DatePickerPopoverTemplate.lit.ts +0 -14
- package/src/generated/templates/DatePickerTemplate.lit.ts +0 -14
- package/src/generated/templates/ReviewItemTemplate.lit.ts +0 -14
- package/src/generated/templates/ReviewTemplate.lit.ts +0 -16
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: ":host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-20-
|
|
1
|
+
declare const _default: ":host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-20-1_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel,:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}\n";
|
|
2
2
|
export default _default;
|
|
@@ -3,6 +3,6 @@ import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/s
|
|
|
3
3
|
import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
|
|
4
4
|
registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
|
|
5
5
|
registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
|
|
6
|
-
export default `:host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-20-
|
|
6
|
+
export default `:host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-20-1_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel,:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}
|
|
7
7
|
`;
|
|
8
8
|
//# sourceMappingURL=RatingIndicator.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RatingIndicator.css.js","sourceRoot":"","sources":["../../../src/generated/themes/RatingIndicator.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@\" + \"ui5\" + \"/\" + \"webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport default `:host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-20-
|
|
1
|
+
{"version":3,"file":"RatingIndicator.css.js","sourceRoot":"","sources":["../../../src/generated/themes/RatingIndicator.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@\" + \"ui5\" + \"/\" + \"webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport default `:host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-20-1_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel,:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}\n`"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: ":host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-20-
|
|
1
|
+
declare const _default: ":host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-20-1_range_slider_handle_background_focus)}:host .ui5-slider-inner .ui5-slider-labels{top:34px}:host .ui5-slider-inner .ui5-slider-labels li{height:1.375rem;font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px)}[slider-icon]{color:var(--udex-slider-color-handle-default-icon)}.ui5-slider-root:focus .ui5-slider-inner .ui5-slider-handle,.ui5-slider-handle:focus{border:var(--udex-slider-handle-focus-border)}.ui5-slider-labels li{color:var(--udex-slider-label-color)}.ui5-slider-tickmarks li{border-inline-start:1px solid var(--udex-slider-tickmark-bg)}.ui5-slider-tickmarks li.ui5-slider-tickmark-in-range{border-inline-start:1px solid var(--udex-slider-tickmark-in-range-bg)}:host(:not([hidden])) .ui5-slider-handle-container .ui5-slider-tooltip{bottom:var(--udex-slider-tooltip-bottom);border:var(--udex-slider-tooltip-border);border-radius:var(--udex-slider-tooltip-border-radius);font-size:var(--udex-slider-tooltip-font-size);color:var(--udex-slider-tooltip-color);height:var(--udex-slider-tooltip-height);min-width:var(--udex-slider-tooltip-min-width)}[slider-icon]{width:var(--udex-slider-handle-icon-size);height:var(--udex-slider-handle-icon-size)}.ui5-slider-progress-container:after{background-color:var(--udex-slider-progress-after-background)}.ui5-slider-progress-container:before{inset-inline-start:var(--udex-slider-start-end-point-left)}.ui5-slider-progress-container:after{inset-inline-end:var(--udex-slider-start-end-point-right)}.ui5-slider-handle-container{margin-inline-start:calc(-1 * var(--udex-slider-handle-width) / 2);top:var(--udex-slider-handle-top)}.ui5-slider-handle{height:var(--udex-slider-handle-height);width:var(--udex-slider-handle-width)}\n";
|
|
2
2
|
export default _default;
|
|
@@ -3,6 +3,6 @@ import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/s
|
|
|
3
3
|
import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
|
|
4
4
|
registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
|
|
5
5
|
registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
|
|
6
|
-
export default `:host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-20-
|
|
6
|
+
export default `:host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-20-1_range_slider_handle_background_focus)}:host .ui5-slider-inner .ui5-slider-labels{top:34px}:host .ui5-slider-inner .ui5-slider-labels li{height:1.375rem;font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px)}[slider-icon]{color:var(--udex-slider-color-handle-default-icon)}.ui5-slider-root:focus .ui5-slider-inner .ui5-slider-handle,.ui5-slider-handle:focus{border:var(--udex-slider-handle-focus-border)}.ui5-slider-labels li{color:var(--udex-slider-label-color)}.ui5-slider-tickmarks li{border-inline-start:1px solid var(--udex-slider-tickmark-bg)}.ui5-slider-tickmarks li.ui5-slider-tickmark-in-range{border-inline-start:1px solid var(--udex-slider-tickmark-in-range-bg)}:host(:not([hidden])) .ui5-slider-handle-container .ui5-slider-tooltip{bottom:var(--udex-slider-tooltip-bottom);border:var(--udex-slider-tooltip-border);border-radius:var(--udex-slider-tooltip-border-radius);font-size:var(--udex-slider-tooltip-font-size);color:var(--udex-slider-tooltip-color);height:var(--udex-slider-tooltip-height);min-width:var(--udex-slider-tooltip-min-width)}[slider-icon]{width:var(--udex-slider-handle-icon-size);height:var(--udex-slider-handle-icon-size)}.ui5-slider-progress-container:after{background-color:var(--udex-slider-progress-after-background)}.ui5-slider-progress-container:before{inset-inline-start:var(--udex-slider-start-end-point-left)}.ui5-slider-progress-container:after{inset-inline-end:var(--udex-slider-start-end-point-right)}.ui5-slider-handle-container{margin-inline-start:calc(-1 * var(--udex-slider-handle-width) / 2);top:var(--udex-slider-handle-top)}.ui5-slider-handle{height:var(--udex-slider-handle-height);width:var(--udex-slider-handle-width)}
|
|
7
7
|
`;
|
|
8
8
|
//# sourceMappingURL=Slider.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Slider.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@\" + \"ui5\" + \"/\" + \"webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport default `:host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-20-
|
|
1
|
+
{"version":3,"file":"Slider.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Slider.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@\" + \"ui5\" + \"/\" + \"webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport default `:host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-20-1_range_slider_handle_background_focus)}:host .ui5-slider-inner .ui5-slider-labels{top:34px}:host .ui5-slider-inner .ui5-slider-labels li{height:1.375rem;font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px)}[slider-icon]{color:var(--udex-slider-color-handle-default-icon)}.ui5-slider-root:focus .ui5-slider-inner .ui5-slider-handle,.ui5-slider-handle:focus{border:var(--udex-slider-handle-focus-border)}.ui5-slider-labels li{color:var(--udex-slider-label-color)}.ui5-slider-tickmarks li{border-inline-start:1px solid var(--udex-slider-tickmark-bg)}.ui5-slider-tickmarks li.ui5-slider-tickmark-in-range{border-inline-start:1px solid var(--udex-slider-tickmark-in-range-bg)}:host(:not([hidden])) .ui5-slider-handle-container .ui5-slider-tooltip{bottom:var(--udex-slider-tooltip-bottom);border:var(--udex-slider-tooltip-border);border-radius:var(--udex-slider-tooltip-border-radius);font-size:var(--udex-slider-tooltip-font-size);color:var(--udex-slider-tooltip-color);height:var(--udex-slider-tooltip-height);min-width:var(--udex-slider-tooltip-min-width)}[slider-icon]{width:var(--udex-slider-handle-icon-size);height:var(--udex-slider-handle-icon-size)}.ui5-slider-progress-container:after{background-color:var(--udex-slider-progress-after-background)}.ui5-slider-progress-container:before{inset-inline-start:var(--udex-slider-start-end-point-left)}.ui5-slider-progress-container:after{inset-inline-end:var(--udex-slider-start-end-point-right)}.ui5-slider-handle-container{margin-inline-start:calc(-1 * var(--udex-slider-handle-width) / 2);top:var(--udex-slider-handle-top)}.ui5-slider-handle{height:var(--udex-slider-handle-height);width:var(--udex-slider-handle-width)}\n`"]}
|
|
@@ -285,6 +285,16 @@
|
|
|
285
285
|
"description": "Defines the position of the navigation.\n<br><br>\nAvailable options are:\n<ul>\n<li><code>top</code> - the navigation button are placed above the component.</li>\n<li><code>bottom</code> - the navigation button arrows are placed below the component.</li>\n</ul>",
|
|
286
286
|
"values": [{ "name": "top" }, { "name": "bottom" }]
|
|
287
287
|
},
|
|
288
|
+
{
|
|
289
|
+
"name": "items-per-page",
|
|
290
|
+
"description": "Defines the number of items per page depending on the carousel width.\n\n- 'S' for screens smaller than 600 pixels.\n- 'M' for screens greater than or equal to 600 pixels and smaller than 1024 pixels.\n- 'L' for screens greater than or equal to 1024 pixels and smaller than 1440 pixels.\n- 'XL' for screens greater than or equal to 1440 pixels.\n\nOne item per page is shown by default.",
|
|
291
|
+
"values": []
|
|
292
|
+
},
|
|
293
|
+
{
|
|
294
|
+
"name": "page-indicator-type",
|
|
295
|
+
"description": "Defines the style of the page indicator.\nAvailable options are:\n\n- `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)\n- `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y)",
|
|
296
|
+
"values": [{ "name": "Default" }, { "name": "Numeric" }]
|
|
297
|
+
},
|
|
288
298
|
{
|
|
289
299
|
"name": "accessible-name",
|
|
290
300
|
"description": "Defines the accessible ARIA name of the component.",
|
package/dist/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
|
|
3
3
|
"name": "@sapudex/web-components",
|
|
4
|
-
"version": "2.20.
|
|
4
|
+
"version": "2.20.1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -574,6 +574,19 @@
|
|
|
574
574
|
"description": "Defines the position of the navigation.\n<br><br>\nAvailable options are:\n<ul>\n<li><code>top</code> - the navigation button are placed above the component.</li>\n<li><code>bottom</code> - the navigation button arrows are placed below the component.</li>\n</ul>",
|
|
575
575
|
"value": { "type": "\"top\" | \"bottom\"" }
|
|
576
576
|
},
|
|
577
|
+
{
|
|
578
|
+
"name": "items-per-page",
|
|
579
|
+
"description": "Defines the number of items per page depending on the carousel width.\n\n- 'S' for screens smaller than 600 pixels.\n- 'M' for screens greater than or equal to 600 pixels and smaller than 1024 pixels.\n- 'L' for screens greater than or equal to 1024 pixels and smaller than 1440 pixels.\n- 'XL' for screens greater than or equal to 1440 pixels.\n\nOne item per page is shown by default.",
|
|
580
|
+
"value": { "type": "string", "default": "\"S1 M1 L1 XL1\"" }
|
|
581
|
+
},
|
|
582
|
+
{
|
|
583
|
+
"name": "page-indicator-type",
|
|
584
|
+
"description": "Defines the style of the page indicator.\nAvailable options are:\n\n- `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)\n- `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y)",
|
|
585
|
+
"value": {
|
|
586
|
+
"type": "\"Default\" | \"Numeric\"",
|
|
587
|
+
"default": "\"Default\""
|
|
588
|
+
}
|
|
589
|
+
},
|
|
577
590
|
{
|
|
578
591
|
"name": "accessible-name",
|
|
579
592
|
"description": "Defines the accessible ARIA name of the component.",
|
|
@@ -594,6 +607,16 @@
|
|
|
594
607
|
"description": "Defines the position of the navigation.\n<br><br>\nAvailable options are:\n<ul>\n<li><code>top</code> - the navigation button are placed above the component.</li>\n<li><code>bottom</code> - the navigation button arrows are placed below the component.</li>\n</ul>",
|
|
595
608
|
"value": { "type": "\"top\" | \"bottom\"" }
|
|
596
609
|
},
|
|
610
|
+
{
|
|
611
|
+
"name": "items-per-page",
|
|
612
|
+
"description": "Defines the number of items per page depending on the carousel width.\n\n- 'S' for screens smaller than 600 pixels.\n- 'M' for screens greater than or equal to 600 pixels and smaller than 1024 pixels.\n- 'L' for screens greater than or equal to 1024 pixels and smaller than 1440 pixels.\n- 'XL' for screens greater than or equal to 1440 pixels.\n\nOne item per page is shown by default.",
|
|
613
|
+
"value": { "type": "string" }
|
|
614
|
+
},
|
|
615
|
+
{
|
|
616
|
+
"name": "page-indicator-type",
|
|
617
|
+
"description": "Defines the style of the page indicator.\nAvailable options are:\n\n- `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)\n- `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y)",
|
|
618
|
+
"value": { "type": "\"Default\" | \"Numeric\"" }
|
|
619
|
+
},
|
|
597
620
|
{
|
|
598
621
|
"name": "accessible-name",
|
|
599
622
|
"description": "Defines the accessible ARIA name of the component.",
|
package/package.json
CHANGED
package/src/Carousel.ts
CHANGED
|
@@ -11,11 +11,15 @@ import {
|
|
|
11
11
|
import { CAROUSEL_NEXT_ARROW_TEXT, CAROUSEL_PREVIOUS_ARROW_TEXT } from "./generated/i18n/i18n-defaults.js";
|
|
12
12
|
import redirectAttributes from "./utils/redirectAttributes.js";
|
|
13
13
|
import type UI5Carousel from "@ui5/webcomponents/dist/Carousel.js";
|
|
14
|
+
import type { UI5CustomEvent } from "@ui5/webcomponents-base";
|
|
15
|
+
import type Icon from "@ui5/webcomponents/dist/Icon.js";
|
|
14
16
|
|
|
15
17
|
import CarouselTemplate from "./CarouselTemplate.js";
|
|
16
18
|
|
|
17
19
|
// Styles
|
|
18
20
|
import CarouselCss from "./generated/themes/Carousel.css.js";
|
|
21
|
+
import type CarouselPageIndicatorType from "@ui5/webcomponents/dist/types/CarouselPageIndicatorType.js";
|
|
22
|
+
import type UDExButton from "./Button.js";
|
|
19
23
|
|
|
20
24
|
export enum UDExCarouselNavigationPosition {
|
|
21
25
|
top = "top",
|
|
@@ -76,6 +80,34 @@ class UDExCarousel extends UI5Element {
|
|
|
76
80
|
@slot({ "default": true, type: HTMLElement, individualSlots: true })
|
|
77
81
|
items!: Array<HTMLElement>;
|
|
78
82
|
|
|
83
|
+
/**
|
|
84
|
+
* Defines the number of items per page depending on the carousel width.
|
|
85
|
+
*
|
|
86
|
+
* - 'S' for screens smaller than 600 pixels.
|
|
87
|
+
* - 'M' for screens greater than or equal to 600 pixels and smaller than 1024 pixels.
|
|
88
|
+
* - 'L' for screens greater than or equal to 1024 pixels and smaller than 1440 pixels.
|
|
89
|
+
* - 'XL' for screens greater than or equal to 1440 pixels.
|
|
90
|
+
*
|
|
91
|
+
* One item per page is shown by default.
|
|
92
|
+
* @default "S1 M1 L1 XL1"
|
|
93
|
+
* @public
|
|
94
|
+
*/
|
|
95
|
+
@property()
|
|
96
|
+
itemsPerPage = "S1 M1 L1 XL1";
|
|
97
|
+
|
|
98
|
+
/**
|
|
99
|
+
* Defines the style of the page indicator.
|
|
100
|
+
* Available options are:
|
|
101
|
+
*
|
|
102
|
+
* - `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)
|
|
103
|
+
* - `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y)
|
|
104
|
+
* @since 1.10
|
|
105
|
+
* @default "Default"
|
|
106
|
+
* @public
|
|
107
|
+
*/
|
|
108
|
+
@property()
|
|
109
|
+
pageIndicatorType: `${CarouselPageIndicatorType}` = "Default";
|
|
110
|
+
|
|
79
111
|
/**
|
|
80
112
|
* Defines the prev button is disabled
|
|
81
113
|
*
|
|
@@ -150,23 +182,21 @@ class UDExCarousel extends UI5Element {
|
|
|
150
182
|
this.isNextButtonDisabled = !this._carousel?.hasNext;
|
|
151
183
|
}
|
|
152
184
|
|
|
153
|
-
_prevButtonClick() {
|
|
185
|
+
_prevButtonClick(e: UI5CustomEvent<UDExButton, "click">) {
|
|
154
186
|
if (this.isPrevButtonDisabled) {
|
|
155
187
|
return;
|
|
156
188
|
}
|
|
157
189
|
|
|
158
|
-
this._carousel?.
|
|
159
|
-
this._ui5CarouselRoot?.focus();
|
|
190
|
+
this._carousel?._navButtonClick(e as unknown as UI5CustomEvent<Icon, "click">);
|
|
160
191
|
this._calculateDisabledButtonsState();
|
|
161
192
|
}
|
|
162
193
|
|
|
163
|
-
_nextButtonClick() {
|
|
194
|
+
_nextButtonClick(e: UI5CustomEvent<UDExButton, "click">) {
|
|
164
195
|
if (this.isNextButtonDisabled) {
|
|
165
196
|
return;
|
|
166
197
|
}
|
|
167
198
|
|
|
168
|
-
this._carousel?.
|
|
169
|
-
this._ui5CarouselRoot?.focus();
|
|
199
|
+
this._carousel?._navButtonClick(e as unknown as UI5CustomEvent<Icon, "click">);
|
|
170
200
|
this._calculateDisabledButtonsState();
|
|
171
201
|
}
|
|
172
202
|
|
package/src/CarouselTemplate.tsx
CHANGED
|
@@ -12,6 +12,8 @@ export default function CarouselTemplate(this: Carousel) {
|
|
|
12
12
|
<div className={this.carouselClass} onKeyDown={this._onkeydown}>
|
|
13
13
|
{this.showNavigationButtons.top && navigation.call(this)}
|
|
14
14
|
<UI5Carousel
|
|
15
|
+
itemsPerPage={this.itemsPerPage}
|
|
16
|
+
pageIndicatorType={this.pageIndicatorType}
|
|
15
17
|
id="carousel"
|
|
16
18
|
hideNavigationArrows
|
|
17
19
|
arrowsPlacement={CarouselArrowsPlacement.Navigation}
|
|
@@ -32,6 +34,7 @@ function navigation(this: Carousel) {
|
|
|
32
34
|
return (
|
|
33
35
|
<div class="udex-carousel__navigation-wrapper" part="navigation">
|
|
34
36
|
<UDExButton
|
|
37
|
+
data-ui5-arrow-back
|
|
35
38
|
size={UDExButtonSize.Large}
|
|
36
39
|
disabled={this.isPrevButtonDisabled}
|
|
37
40
|
class={btnClassName}
|
|
@@ -42,6 +45,7 @@ function navigation(this: Carousel) {
|
|
|
42
45
|
part="prev-button">
|
|
43
46
|
</UDExButton>
|
|
44
47
|
<UDExButton
|
|
48
|
+
data-ui5-arrow-forward
|
|
45
49
|
size={UDExButtonSize.Large}
|
|
46
50
|
disabled={this.isNextButtonDisabled}
|
|
47
51
|
class={btnClassName}
|
package/src/DatePicker.ts
CHANGED
|
@@ -1,23 +1,20 @@
|
|
|
1
1
|
import DateComponentBase from "@ui5/webcomponents/dist/DateComponentBase.js";
|
|
2
|
-
import
|
|
2
|
+
import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
|
|
3
3
|
import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
|
|
4
4
|
import property from "@ui5/webcomponents-base/dist/decorators/property.js";
|
|
5
5
|
import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
|
|
6
|
-
|
|
7
|
-
import Calendar, { CalendarSelectionChangeEventDetail } from "@ui5/webcomponents/dist/Calendar.js";
|
|
8
|
-
import CalendarDate from "@ui5/webcomponents/dist/CalendarDate.js";
|
|
6
|
+
import type { CalendarSelectionChangeEventDetail } from "@ui5/webcomponents/dist/Calendar.js";
|
|
9
7
|
import "@ui5/webcomponents/dist/Icon.js";
|
|
10
8
|
import "@ui5/webcomponents-icons/dist/appointment-2.js";
|
|
11
9
|
import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
|
|
12
10
|
import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
|
|
13
11
|
import { CALENDAR_ICON, DATEPICKER_DATE_DESCRIPTION } from "./generated/i18n/i18n-defaults.js";
|
|
14
|
-
import UDExTextField from "./TextField.js";
|
|
15
|
-
import UDExDropdown from "./Dropdown.js";
|
|
16
|
-
import UDExStatusMessage from "./StatusMessage.js";
|
|
12
|
+
import type UDExTextField from "./TextField.js";
|
|
13
|
+
import type UDExDropdown from "./Dropdown.js";
|
|
17
14
|
import UDExValueState from "./types/common.js";
|
|
18
15
|
|
|
19
16
|
// Template
|
|
20
|
-
import DatePickerTemplate from "./
|
|
17
|
+
import DatePickerTemplate from "./DatePickerTemplate.js";
|
|
21
18
|
|
|
22
19
|
// Styles
|
|
23
20
|
import DatePickerCss from "./generated/themes/DatePicker.css.js";
|
|
@@ -60,10 +57,9 @@ type UDExDatePickerValueStateChangeEventDetail = {
|
|
|
60
57
|
*/
|
|
61
58
|
@customElement({
|
|
62
59
|
tag: "udex-date-picker",
|
|
63
|
-
renderer:
|
|
60
|
+
renderer: jsxRenderer,
|
|
64
61
|
styles: [DatePickerCss, DatePickerPopoverCss],
|
|
65
62
|
template: DatePickerTemplate,
|
|
66
|
-
dependencies: [CalendarDate, Calendar, UDExTextField, UDExDropdown, UDExStatusMessage],
|
|
67
63
|
})
|
|
68
64
|
/**
|
|
69
65
|
* Fired when the selected dates change.
|
|
@@ -506,7 +502,7 @@ class UDExDatePicker extends DateComponentBase {
|
|
|
506
502
|
this._updateValueAndFireDecoratorEvents((e.target as UDExDatePicker).value, true);
|
|
507
503
|
}
|
|
508
504
|
|
|
509
|
-
handleInputClick(e:
|
|
505
|
+
handleInputClick(e: CustomEvent<void>): void {
|
|
510
506
|
e.preventDefault();
|
|
511
507
|
|
|
512
508
|
if (this.disabled || this.readonly) {
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import Calendar from "@ui5/webcomponents/dist/Calendar.js";
|
|
2
|
+
import type DatePicker from "./DatePicker.js";
|
|
3
|
+
import UDExDropdown from "./Dropdown.js";
|
|
4
|
+
import { Placement } from "./types/Dropdown.js";
|
|
5
|
+
import CalendarDate from "@ui5/webcomponents/dist/CalendarDate.js";
|
|
6
|
+
import CalendarDateRange from "@ui5/webcomponents/dist/CalendarDateRange.js";
|
|
7
|
+
|
|
8
|
+
export default function DatePickerPopoverTemplate(this: DatePicker) {
|
|
9
|
+
return (
|
|
10
|
+
<UDExDropdown
|
|
11
|
+
id={`udex-${this._id}-calendar__popover`}
|
|
12
|
+
opener={`udex-${this._id}-calendar__opener`}
|
|
13
|
+
class="udex-date-picker__popover"
|
|
14
|
+
placement={Placement.Bottom}
|
|
15
|
+
horizontal-align="Start"
|
|
16
|
+
onClose={this._afterDropdownClose}
|
|
17
|
+
onOpen={this._afterDropdownOpen}>
|
|
18
|
+
<Calendar
|
|
19
|
+
class="udex-date-picker__calendar"
|
|
20
|
+
onSelectionChange={this.handleCalendarChange}
|
|
21
|
+
selection-mode={this.selectionMode}
|
|
22
|
+
min-date={this.minDate}
|
|
23
|
+
max-date={this.maxDate}
|
|
24
|
+
format-pattern={this.formatPattern}>
|
|
25
|
+
{ this.isRangeMode ?
|
|
26
|
+
<CalendarDateRange start-value={this.startValue} end-value={this.endValue}></CalendarDateRange>
|
|
27
|
+
:
|
|
28
|
+
this._calendarSelectedDates.map(date =>
|
|
29
|
+
<CalendarDate value={date}></CalendarDate>
|
|
30
|
+
)
|
|
31
|
+
}
|
|
32
|
+
</Calendar>
|
|
33
|
+
</UDExDropdown>
|
|
34
|
+
);
|
|
35
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type DatePicker from "./DatePicker.js";
|
|
2
|
+
import DatePickerPopoverTemplate from "./DatePickerPopoverTemplate.js";
|
|
3
|
+
import UDExTextField from "./TextField.js";
|
|
4
|
+
|
|
5
|
+
export default function DatePickerTemplate(this: DatePicker) {
|
|
6
|
+
return (
|
|
7
|
+
<>
|
|
8
|
+
<UDExTextField
|
|
9
|
+
class="udex-date-picker__input"
|
|
10
|
+
_aria-has-popup="grid"
|
|
11
|
+
icon="appointment-2"
|
|
12
|
+
value={this.value}
|
|
13
|
+
label={this.label}
|
|
14
|
+
accessible-name={this.dateAccessibleName}
|
|
15
|
+
accessible-name-ref={this.accessibleNameRef}
|
|
16
|
+
accessible-icon-name={this.accessibleIconName}
|
|
17
|
+
{...(this.disabled ? { "disabled": true } : {})}
|
|
18
|
+
{...(this.required ? { "required": true } : {})}
|
|
19
|
+
{...(this.readonly ? { "readonly": true } : {})}
|
|
20
|
+
onClickIcon={this.handleInputClick}
|
|
21
|
+
onChange={this._onInputChange}
|
|
22
|
+
value-state={this.valueState}
|
|
23
|
+
supporting-text={this.supportingText} />
|
|
24
|
+
{DatePickerPopoverTemplate.call(this)}
|
|
25
|
+
</>
|
|
26
|
+
);
|
|
27
|
+
}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
// @ts-nocheck
|
|
2
|
+
// No ts check required for video-js tag usage. Please remove during development.
|
|
1
3
|
import type UDExMediaPlayer from "./MediaPlayer.js";
|
|
2
4
|
import UDExMediaPlayerYoutube from "./MediaPlayerYoutube.js";
|
|
3
5
|
import UDExMediaPlayerVimeo from "./MediaPlayerVimeo.js";
|
|
@@ -30,27 +32,26 @@ function renderAudioOnlyTemplate(this: UDExMediaPlayer, rootClass: string) {
|
|
|
30
32
|
|
|
31
33
|
function renderStandardTemplate(this: UDExMediaPlayer, rootClass: string) {
|
|
32
34
|
return (
|
|
33
|
-
<video
|
|
35
|
+
<video-js
|
|
34
36
|
id={this.playerElementId}
|
|
35
37
|
class={`${rootClass} ${this.aspectRatioClass}`}>
|
|
36
|
-
<source src={this.source} type={this.type}
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
</video>
|
|
38
|
+
<source src={this.source} type={this.type} />
|
|
39
|
+
{this._tracks.map((element: HTMLTrackElement, index: number) => {
|
|
40
|
+
const {
|
|
41
|
+
"default": isDefault, kind, src, srclang, label
|
|
42
|
+
} = element;
|
|
43
|
+
return (
|
|
44
|
+
<track
|
|
45
|
+
key={index}
|
|
46
|
+
kind={kind}
|
|
47
|
+
src={src}
|
|
48
|
+
srclang={srclang}
|
|
49
|
+
label={label}
|
|
50
|
+
{...(isDefault ? { "default": true } : {})}
|
|
51
|
+
/>
|
|
52
|
+
);
|
|
53
|
+
})}
|
|
54
|
+
</video-js>
|
|
54
55
|
);
|
|
55
56
|
}
|
|
56
57
|
|
|
@@ -7,6 +7,8 @@ import sysEnter2 from "@ui5/webcomponents-icons/dist/sys-enter-2.js";
|
|
|
7
7
|
import error from "@ui5/webcomponents-icons/dist/error.js";
|
|
8
8
|
import alert from "@ui5/webcomponents-icons/dist/alert.js";
|
|
9
9
|
import { UDExMessageStripDesign } from "./types/MessageStrip.js";
|
|
10
|
+
import UDExButtonSize from "./types/ButtonSize.js";
|
|
11
|
+
import UDExButtonDesign from "./types/ButtonDesign.js";
|
|
10
12
|
|
|
11
13
|
export default function MessageStripTemplate(this: UDExMessageStrip) {
|
|
12
14
|
return (
|
|
@@ -47,9 +49,9 @@ export default function MessageStripTemplate(this: UDExMessageStrip) {
|
|
|
47
49
|
</span>
|
|
48
50
|
{!this.hideCloseButton && (
|
|
49
51
|
<UDExButton
|
|
50
|
-
size=
|
|
52
|
+
size={UDExButtonSize.Small}
|
|
51
53
|
icon={decline}
|
|
52
|
-
design=
|
|
54
|
+
design={UDExButtonDesign.Tertiary}
|
|
53
55
|
onClick={this._closeClick}
|
|
54
56
|
tooltip={this._closeButtonText}
|
|
55
57
|
part="close-button"
|
package/src/Review.ts
CHANGED
|
@@ -2,16 +2,14 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
|
|
|
2
2
|
import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
|
|
3
3
|
import property from "@ui5/webcomponents-base/dist/decorators/property.js";
|
|
4
4
|
import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
|
|
5
|
-
import
|
|
6
|
-
import Icon from "@ui5/webcomponents/dist/Icon.js";
|
|
5
|
+
import jsxRenderer from "@ui5/webcomponents-base/renderer/JsxRenderer.js";
|
|
7
6
|
import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
|
|
8
7
|
import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
|
|
9
8
|
import { REVIEWS, STARS } from "./generated/i18n/i18n-defaults.js";
|
|
10
9
|
import "@ui5/webcomponents-icons/dist/favorite.js";
|
|
11
10
|
import UDExRatingBar from "./RatingBar.js";
|
|
12
|
-
import UDExRatingIndicator from "./RatingIndicator.js";
|
|
13
11
|
import type UDExButton from "./Button.js";
|
|
14
|
-
import ReviewTemplate from "./
|
|
12
|
+
import ReviewTemplate from "./ReviewTemplate.js";
|
|
15
13
|
|
|
16
14
|
// Styles
|
|
17
15
|
import ReviewCss from "./generated/themes/Review.css.js";
|
|
@@ -35,10 +33,9 @@ import ReviewCss from "./generated/themes/Review.css.js";
|
|
|
35
33
|
*/
|
|
36
34
|
@customElement({
|
|
37
35
|
tag: "udex-review",
|
|
38
|
-
renderer:
|
|
36
|
+
renderer: jsxRenderer,
|
|
39
37
|
styles: ReviewCss,
|
|
40
38
|
template: ReviewTemplate,
|
|
41
|
-
dependencies: [UDExRatingBar, UDExRatingIndicator, Icon],
|
|
42
39
|
})
|
|
43
40
|
|
|
44
41
|
class UDExReview extends UI5Element {
|