@sbb-esta/lyne-elements-dev 4.7.0-dev.1773317876 → 4.7.0-dev.1773333589
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/core/styles/core.scss +9 -26
- package/core.css +10 -20
- package/custom-elements.json +762 -753
- package/development/mini-calendar/mini-calendar-day/mini-calendar-day.component.js +3 -5
- package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts +2 -0
- package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts.map +1 -1
- package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.js +43 -19
- package/mini-calendar/mini-calendar-day/mini-calendar-day.component.js +14 -14
- package/mini-calendar/mini-calendar-month/mini-calendar-month.component.js +38 -35
- package/off-brand-theme.css +10 -20
- package/package.json +2 -2
- package/safety-theme.css +10 -20
- package/standard-theme.css +10 -20
|
@@ -14,15 +14,13 @@ import "../../core/datetime/date-adapter.js";
|
|
|
14
14
|
import { defaultDateAdapter } from "../../core/datetime/native-date-adapter.js";
|
|
15
15
|
import { forceType, omitEmptyConverter } from "../../core/decorators.js";
|
|
16
16
|
const style = css`:host {
|
|
17
|
-
--sbb-mini-calendar-day-scale: 1.333;
|
|
18
|
-
--sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
|
|
19
17
|
--sbb-mini-calendar-day-animation-duration: var(
|
|
20
18
|
--sbb-disable-animation-duration,
|
|
21
19
|
var(--sbb-animation-duration-2x)
|
|
22
20
|
);
|
|
23
21
|
display: block;
|
|
24
|
-
height:
|
|
25
|
-
width:
|
|
22
|
+
height: var(--sbb-mini-calendar-day-dimensions);
|
|
23
|
+
width: var(--sbb-mini-calendar-day-dimensions);
|
|
26
24
|
margin: 0.0625rem;
|
|
27
25
|
border-radius: var(--sbb-border-radius-infinity);
|
|
28
26
|
color: var(--sbb-color-storm);
|
|
@@ -165,4 +163,4 @@ let SbbMiniCalendarDayElement = (() => {
|
|
|
165
163
|
export {
|
|
166
164
|
SbbMiniCalendarDayElement
|
|
167
165
|
};
|
|
168
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWluaS1jYWxlbmRhci1kYXkuY29tcG9uZW50LmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvbWluaS1jYWxlbmRhci9taW5pLWNhbGVuZGFyLWRheS9taW5pLWNhbGVuZGFyLWRheS5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdHlwZSBDU1NSZXN1bHRHcm91cCwgaHRtbCwgdHlwZSBQcm9wZXJ0eVZhbHVlcywgdHlwZSBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBwcm9wZXJ0eSB9IGZyb20gJ2xpdC9kZWNvcmF0b3JzLmpzJztcblxuaW1wb3J0IHsgU2JiQnV0dG9uQmFzZUVsZW1lbnQgfSBmcm9tICcuLi8uLi9jb3JlL2Jhc2UtZWxlbWVudHMudHMnO1xuaW1wb3J0IHsgcmVhZENvbmZpZyB9IGZyb20gJy4uLy4uL2NvcmUvY29uZmlnL2NvbmZpZy50cyc7XG5pbXBvcnQgeyB0eXBlIERhdGVBZGFwdGVyIH0gZnJvbSAnLi4vLi4vY29yZS9kYXRldGltZS9kYXRlLWFkYXB0ZXIudHMnO1xuaW1wb3J0IHsgZGVmYXVsdERhdGVBZGFwdGVyIH0gZnJvbSAnLi4vLi4vY29yZS9kYXRldGltZS9uYXRpdmUtZGF0ZS1hZGFwdGVyLnRzJztcbmltcG9ydCB7IGZvcmNlVHlwZSwgb21pdEVtcHR5Q29udmVydGVyIH0gZnJvbSAnLi4vLi4vY29yZS9kZWNvcmF0b3JzLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbWluaS1jYWxlbmRhci1kYXkuc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIGRheSBpbiB0aGUgYHNiYi1taW5pLWNhbGVuZGFyLW1vbnRoYC5cbiAqL1xuZXhwb3J0IGNsYXNzIFNiYk1pbmlDYWxlbmRhckRheUVsZW1lbnQ8VCA9IERhdGU+IGV4dGVuZHMgU2JiQnV0dG9uQmFzZUVsZW1lbnQge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IGVsZW1lbnROYW1lOiBzdHJpbmcgPSAnc2JiLW1pbmktY2FsZW5kYXItZGF5JztcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSBzdHlsZXM6IENTU1Jlc3VsdEdyb3VwID0gc3R5bGU7XG5cbiAgcHJpdmF0ZSBfZGF0ZUFkYXB0ZXI6IERhdGVBZGFwdGVyPFQ+ID0gcmVhZENvbmZpZygpLmRhdGV0aW1lPy5kYXRlQWRhcHRlciA/
|
|
166
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWluaS1jYWxlbmRhci1kYXkuY29tcG9uZW50LmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvbWluaS1jYWxlbmRhci9taW5pLWNhbGVuZGFyLWRheS9taW5pLWNhbGVuZGFyLWRheS5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdHlwZSBDU1NSZXN1bHRHcm91cCwgaHRtbCwgdHlwZSBQcm9wZXJ0eVZhbHVlcywgdHlwZSBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBwcm9wZXJ0eSB9IGZyb20gJ2xpdC9kZWNvcmF0b3JzLmpzJztcblxuaW1wb3J0IHsgU2JiQnV0dG9uQmFzZUVsZW1lbnQgfSBmcm9tICcuLi8uLi9jb3JlL2Jhc2UtZWxlbWVudHMudHMnO1xuaW1wb3J0IHsgcmVhZENvbmZpZyB9IGZyb20gJy4uLy4uL2NvcmUvY29uZmlnL2NvbmZpZy50cyc7XG5pbXBvcnQgeyB0eXBlIERhdGVBZGFwdGVyIH0gZnJvbSAnLi4vLi4vY29yZS9kYXRldGltZS9kYXRlLWFkYXB0ZXIudHMnO1xuaW1wb3J0IHsgZGVmYXVsdERhdGVBZGFwdGVyIH0gZnJvbSAnLi4vLi4vY29yZS9kYXRldGltZS9uYXRpdmUtZGF0ZS1hZGFwdGVyLnRzJztcbmltcG9ydCB7IGZvcmNlVHlwZSwgb21pdEVtcHR5Q29udmVydGVyIH0gZnJvbSAnLi4vLi4vY29yZS9kZWNvcmF0b3JzLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbWluaS1jYWxlbmRhci1kYXkuc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIGRheSBpbiB0aGUgYHNiYi1taW5pLWNhbGVuZGFyLW1vbnRoYC5cbiAqL1xuZXhwb3J0IGNsYXNzIFNiYk1pbmlDYWxlbmRhckRheUVsZW1lbnQ8VCA9IERhdGU+IGV4dGVuZHMgU2JiQnV0dG9uQmFzZUVsZW1lbnQge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IGVsZW1lbnROYW1lOiBzdHJpbmcgPSAnc2JiLW1pbmktY2FsZW5kYXItZGF5JztcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSBzdHlsZXM6IENTU1Jlc3VsdEdyb3VwID0gc3R5bGU7XG5cbiAgcHJpdmF0ZSBfZGF0ZUFkYXB0ZXI6IERhdGVBZGFwdGVyPFQ+ID0gcmVhZENvbmZpZygpLmRhdGV0aW1lPy5kYXRlQWRhcHRlciA/PyBkZWZhdWx0RGF0ZUFkYXB0ZXI7XG5cbiAgLyoqIERhdGUgYXMgSVNPIHN0cmluZyAoWVlZWS1NTS1ERCkgKi9cbiAgQGZvcmNlVHlwZSgpXG4gIEBwcm9wZXJ0eSgpXG4gIHB1YmxpYyBhY2Nlc3NvciBkYXRlOiBzdHJpbmcgPSAnJztcblxuICAvKiogVGhlIHR5cGUgb2YgdGhlIG1hcmtlci4gKi9cbiAgQGZvcmNlVHlwZSgpXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUsIGNvbnZlcnRlcjogb21pdEVtcHR5Q29udmVydGVyIH0pXG4gIHB1YmxpYyBhY2Nlc3NvciBtYXJrZXI6ICd0YXJnZXQnIHwgJ2NpcmNsZScgfCAnc2xhc2gnIHwgJ2Nyb3NzJyB8IHN0cmluZyA9ICcnO1xuXG4gIC8qKiBUaGUgY29sb3Igb2YgdGhlIG1hcmtlci4gKi9cbiAgQGZvcmNlVHlwZSgpXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUsIGNvbnZlcnRlcjogb21pdEVtcHR5Q29udmVydGVyIH0pXG4gIHB1YmxpYyBhY2Nlc3NvciBjb2xvcjogJ2NoYXJjb2FsJyB8ICdjbG91ZCcgfCAnb3JhbmdlJyB8ICdyZWQnIHwgJ3NreScgfCBzdHJpbmcgPSAnJztcblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgd2lsbFVwZGF0ZShjaGFuZ2VkUHJvcGVydGllczogUHJvcGVydHlWYWx1ZXM8dGhpcz4pOiB2b2lkIHtcbiAgICBzdXBlci53aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzKTtcblxuICAgIGlmIChjaGFuZ2VkUHJvcGVydGllcy5oYXMoJ2RhdGUnKSAmJiB0aGlzLmRhdGUpIHtcbiAgICAgIHRoaXMuaW50ZXJuYWxzLmFyaWFMYWJlbCA9IHRoaXMuX2RhdGVBZGFwdGVyLmdldEFjY2Vzc2liaWxpdHlGb3JtYXREYXRlKHRoaXMuZGF0ZSk7XG4gICAgfVxuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlclRlbXBsYXRlKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBgO1xuICB9XG59XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIEhUTUxFbGVtZW50VGFnTmFtZU1hcCB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuICAgICdzYmItbWluaS1jYWxlbmRhci1kYXknOiBTYmJNaW5pQ2FsZW5kYXJEYXlFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztJQWNhLDZCQUF5QixNQUFBOztvQkFBbUI7Ozs7Ozs7Ozs7QUFBNUMsU0FBQSxtQkFBNEMsWUFBb0I7QUFBQTs7QUFTM0U7QUFLQTtBQUtBO0FBZlEsV0FBQSxlQUErQixXQUFBLEVBQWEsVUFBVSxlQUFlO0FBSzdELHlCQUFBLHdCQUFBLGtCQUFBLE1BQUEsb0JBQWUsRUFBRTtBQUtqQix5QkFBQSwyQkFBQSxrQkFBQSxNQUFBLHVCQUFBLEdBQUEsa0JBQUEsTUFBQSxzQkFBMkQsRUFBRTtBQUs3RCx5QkFBQSwwQkFBQSxrQkFBQSxNQUFBLHlCQUFBLEdBQUEsa0JBQUEsTUFBQSxxQkFBa0UsRUFBRTs7OztJQVZwRixJQUFnQixPQUFJO0FBQUEsYUFBQSxtQkFBQTtBQUFBLElBQUE7QUFBQSxJQUFwQixJQUFnQixLQUFJLE9BQUE7QUFBQSx5QkFBQSx3QkFBQTtBQUFBLElBQUE7QUFBQTtBQUFBLElBS3BCLElBQWdCLFNBQU07QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQXRCLElBQWdCLE9BQU0sT0FBQTtBQUFBLHlCQUFBLDBCQUFBO0FBQUEsSUFBQTtBQUFBO0FBQUEsSUFLdEIsSUFBZ0IsUUFBSztBQUFBLGFBQUEsbUJBQUE7QUFBQSxJQUFBO0FBQUEsSUFBckIsSUFBZ0IsTUFBSyxPQUFBO0FBQUEseUJBQUEseUJBQUE7QUFBQSxJQUFBO0FBQUEsSUFFRixXQUFXLG1CQUF1QztBQUNuRSxZQUFNLFdBQVcsaUJBQWlCO0FBRWxDLFVBQUksa0JBQWtCLElBQUksTUFBTSxLQUFLLEtBQUssTUFBTTtBQUM5QyxhQUFLLFVBQVUsWUFBWSxLQUFLLGFBQWEsMkJBQTJCLEtBQUssSUFBSTtBQUFBLE1BQ25GO0FBQUEsSUFDRjtBQUFBLElBRW1CLGlCQUFjO0FBQy9CLGFBQU87QUFBQSxJQUNUO0FBQUEsS0F0QkEsd0NBS0EsMENBS0E7O3dCQVpDLGFBQ0EsVUFBVTtBQUlWLHlCQUFBLENBQUEsVUFBQSxHQUNBLFNBQVMsRUFBRSxTQUFTLE1BQU0sV0FBVyxtQkFBQSxDQUFvQixDQUFDO0FBSTFELHdCQUFBLENBQUEsVUFBQSxHQUNBLFNBQVMsRUFBRSxTQUFTLE1BQU0sV0FBVyxtQkFBQSxDQUFvQixDQUFDO0FBVDNELGlCQUFBLElBQUEsTUFBQSxrQkFBQSxFQUFBLE1BQUEsWUFBQSxNQUFBLFFBQUEsUUFBQSxPQUFBLFNBQUEsT0FBQSxRQUFBLEVBQUEsS0FBQSxDQUFBLFFBQUEsVUFBQSxLQUFBLEtBQUEsQ0FBQSxRQUFBLElBQWdCLE1BQUksS0FBQSxDQUFBLEtBQUEsVUFBQTtBQUFBLFVBQUosT0FBSTtBQUFBLElBQUEsS0FBQSxVQUFBLFVBQUEsR0FBQSxvQkFBQSx1QkFBQTtBQUtwQixpQkFBQSxJQUFBLE1BQUEsb0JBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxVQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFlBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFnQixRQUFNLEtBQUEsQ0FBQSxLQUFBLFVBQUE7QUFBQSxVQUFOLFNBQU07QUFBQSxJQUFBLEtBQUEsVUFBQSxVQUFBLEdBQUEsc0JBQUEseUJBQUE7QUFLdEIsaUJBQUEsSUFBQSxNQUFBLG1CQUFBLEVBQUEsTUFBQSxZQUFBLE1BQUEsU0FBQSxRQUFBLE9BQUEsU0FBQSxPQUFBLFFBQUEsRUFBQSxLQUFBLENBQUEsUUFBQSxXQUFBLEtBQUEsS0FBQSxDQUFBLFFBQUEsSUFBZ0IsT0FBSyxLQUFBLENBQUEsS0FBQSxVQUFBO0FBQUEsVUFBTCxRQUFLO0FBQUEsSUFBQSxLQUFBLFVBQUEsVUFBQSxHQUFBLHFCQUFBLHdCQUFBOztRQWxCVyxHQUFBLGNBQXNCLHlCQUMvQixHQUFBLFNBQXlCLE9BRnJDOzsifQ==
|
|
@@ -14,6 +14,8 @@ export declare class SbbMiniCalendarMonthElement<T = Date> extends SbbElement {
|
|
|
14
14
|
private _monthNames;
|
|
15
15
|
private _monthLabel;
|
|
16
16
|
private _yearLabel;
|
|
17
|
+
private _previousOrientation;
|
|
18
|
+
constructor();
|
|
17
19
|
protected willUpdate(changedProperties: PropertyValues<this>): void;
|
|
18
20
|
protected render(): TemplateResult;
|
|
19
21
|
}
|
package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mini-calendar-month.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/mini-calendar/mini-calendar-month/mini-calendar-month.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIpF,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"mini-calendar-month.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/mini-calendar/mini-calendar-month/mini-calendar-month.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIpF,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAWzD;;;;GAIG;AACH,qBAAa,2BAA2B,CAAC,CAAC,GAAG,IAAI,CAAE,SAAQ,UAAU;IACnE,gBAAgC,WAAW,EAAE,MAAM,CAA6B;IAChF,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,mCAAmC;IACnC,SAEgB,IAAI,EAAE,MAAM,CAAM;IAElC,OAAO,CAAC,YAAY,CAA4E;IAChG,OAAO,CAAC,WAAW,CAA4C;IAC/D,OAAO,CAAC,WAAW,CAAuB;IAC1C,OAAO,CAAC,UAAU,CAAuB;IACzC,OAAO,CAAC,oBAAoB,CAA+B;;cAmBxC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAgBzD,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,yBAAyB,EAAE,2BAA2B,CAAC;KACxD;CACF"}
|
|
@@ -5,18 +5,17 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
|
|
|
5
5
|
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
6
6
|
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
7
7
|
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
|
|
8
|
-
import {
|
|
8
|
+
import { __esDecorate, __runInitializers } from "tslib";
|
|
9
9
|
import { css, html } from "lit";
|
|
10
10
|
import { property } from "lit/decorators.js";
|
|
11
11
|
import { SbbElement } from "../../core/base-elements.js";
|
|
12
12
|
import { readConfig } from "../../core/config/config.js";
|
|
13
|
+
import { SbbPropertyWatcherController } from "../../core/controllers.js";
|
|
13
14
|
import "../../core/datetime/date-adapter.js";
|
|
14
15
|
import { defaultDateAdapter } from "../../core/datetime/native-date-adapter.js";
|
|
15
16
|
import { forceType } from "../../core/decorators.js";
|
|
16
17
|
import { boxSizingStyles } from "../../core/styles.js";
|
|
17
18
|
const style = css`:host {
|
|
18
|
-
--sbb-mini-calendar-month-offset: 0;
|
|
19
|
-
--sbb-mini-calendar-month-visibilty-year: hidden;
|
|
20
19
|
display: inline-block;
|
|
21
20
|
}
|
|
22
21
|
|
|
@@ -24,10 +23,30 @@ const style = css`:host {
|
|
|
24
23
|
--sbb-mini-calendar-month-visibilty-year: visible;
|
|
25
24
|
}
|
|
26
25
|
|
|
26
|
+
:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])) {
|
|
27
|
+
--sbb-mini-calendar-month-grid-auto-flow: row;
|
|
28
|
+
--sbb-mini-calendar-month-height: 3rem;
|
|
29
|
+
--sbb-mini-calendar-month-grid-template-rows: none;
|
|
30
|
+
--sbb-mini-calendar-month-grid-template-columns: repeat(7, 1fr);
|
|
31
|
+
}
|
|
32
|
+
:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])) ::slotted(sbb-mini-calendar-day:first-child) {
|
|
33
|
+
grid-column-start: var(--sbb-mini-calendar-month-offset);
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
:host(:is(:state(orientation-vertical),[state--orientation-vertical])) {
|
|
37
|
+
--sbb-mini-calendar-month-grid-auto-flow: column;
|
|
38
|
+
--sbb-mini-calendar-month-height: auto;
|
|
39
|
+
--sbb-mini-calendar-month-grid-template-rows: repeat(7, 1fr);
|
|
40
|
+
--sbb-mini-calendar-month-grid-template-columns: none;
|
|
41
|
+
}
|
|
42
|
+
:host(:is(:state(orientation-vertical),[state--orientation-vertical])) ::slotted(sbb-mini-calendar-day:first-child) {
|
|
43
|
+
grid-row-start: var(--sbb-mini-calendar-month-offset);
|
|
44
|
+
}
|
|
45
|
+
|
|
27
46
|
.sbb-mini-calendar-month-wrapper {
|
|
28
47
|
display: grid;
|
|
29
48
|
height: var(--sbb-mini-calendar-month-height);
|
|
30
|
-
grid-auto-flow: var(--sbb-mini-calendar-grid-auto-flow);
|
|
49
|
+
grid-auto-flow: var(--sbb-mini-calendar-month-grid-auto-flow);
|
|
31
50
|
grid-auto-rows: 0.5rem;
|
|
32
51
|
grid-template-columns: var(--sbb-mini-calendar-month-grid-template-columns);
|
|
33
52
|
grid-template-rows: var(--sbb-mini-calendar-month-grid-template-rows);
|
|
@@ -35,14 +54,9 @@ const style = css`:host {
|
|
|
35
54
|
|
|
36
55
|
.sbb-mini-calendar-month-label-year,
|
|
37
56
|
.sbb-mini-calendar-month-label-month {
|
|
38
|
-
|
|
39
|
-
font-family: var(--sbb-typo-font-family);
|
|
40
|
-
font-weight: normal;
|
|
41
|
-
line-height: var(--sbb-typo-line-height-text);
|
|
57
|
+
font-size: var(--sbb-text-font-size-xxs);
|
|
42
58
|
letter-spacing: var(--sbb-typo-letter-spacing-text);
|
|
43
|
-
|
|
44
|
-
color: var(--sbb-color-granite);
|
|
45
|
-
color: light-dark(var(--sbb-color-granite), var(--sbb-color-silver));
|
|
59
|
+
color: var(--sbb-mini-calendar-month-label-color);
|
|
46
60
|
}
|
|
47
61
|
|
|
48
62
|
.sbb-mini-calendar-month-label-year {
|
|
@@ -56,13 +70,25 @@ let SbbMiniCalendarMonthElement = (() => {
|
|
|
56
70
|
let _date_extraInitializers = [];
|
|
57
71
|
return _a = class extends _classSuper {
|
|
58
72
|
constructor() {
|
|
59
|
-
super(
|
|
73
|
+
super();
|
|
60
74
|
__privateAdd(this, _date_accessor_storage);
|
|
61
75
|
__privateSet(this, _date_accessor_storage, __runInitializers(this, _date_initializers, ""));
|
|
62
76
|
this._dateAdapter = (__runInitializers(this, _date_extraInitializers), readConfig().datetime?.dateAdapter ?? defaultDateAdapter);
|
|
63
77
|
this._monthNames = this._dateAdapter.getMonthNames("short");
|
|
64
78
|
this._monthLabel = null;
|
|
65
79
|
this._yearLabel = null;
|
|
80
|
+
this._previousOrientation = null;
|
|
81
|
+
this.addController(new SbbPropertyWatcherController(this, () => this.closest("sbb-mini-calendar"), {
|
|
82
|
+
orientation: (parent) => {
|
|
83
|
+
if (this._previousOrientation) {
|
|
84
|
+
this.internals.states.delete(`orientation-${this._previousOrientation}`);
|
|
85
|
+
}
|
|
86
|
+
this._previousOrientation = parent.orientation;
|
|
87
|
+
if (this._previousOrientation) {
|
|
88
|
+
this.internals.states.add(`orientation-${this._previousOrientation}`);
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}));
|
|
66
92
|
}
|
|
67
93
|
/** Date as ISO string (YYYY-MM) */
|
|
68
94
|
get date() {
|
|
@@ -87,13 +113,11 @@ let SbbMiniCalendarMonthElement = (() => {
|
|
|
87
113
|
}
|
|
88
114
|
render() {
|
|
89
115
|
return html`
|
|
90
|
-
<div class="sbb-mini-calendar-month">
|
|
91
|
-
|
|
92
|
-
<
|
|
93
|
-
<slot></slot>
|
|
94
|
-
</div>
|
|
95
|
-
<div class="sbb-mini-calendar-month-label-month">${this._monthLabel}</div>
|
|
116
|
+
<div class="sbb-mini-calendar-month-label-year">${this._yearLabel}</div>
|
|
117
|
+
<div class="sbb-mini-calendar-month-wrapper">
|
|
118
|
+
<slot></slot>
|
|
96
119
|
</div>
|
|
120
|
+
<div class="sbb-mini-calendar-month-label-month">${this._monthLabel}</div>
|
|
97
121
|
`;
|
|
98
122
|
}
|
|
99
123
|
}, _date_accessor_storage = new WeakMap(), (() => {
|
|
@@ -108,4 +132,4 @@ let SbbMiniCalendarMonthElement = (() => {
|
|
|
108
132
|
export {
|
|
109
133
|
SbbMiniCalendarMonthElement
|
|
110
134
|
};
|
|
111
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
135
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWluaS1jYWxlbmRhci1tb250aC5jb21wb25lbnQuanMiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9lbGVtZW50cy9taW5pLWNhbGVuZGFyL21pbmktY2FsZW5kYXItbW9udGgvbWluaS1jYWxlbmRhci1tb250aC5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdHlwZSBDU1NSZXN1bHRHcm91cCwgdHlwZSBQcm9wZXJ0eVZhbHVlcywgdHlwZSBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBodG1sIH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBTYmJFbGVtZW50IH0gZnJvbSAnLi4vLi4vY29yZS9iYXNlLWVsZW1lbnRzLnRzJztcbmltcG9ydCB7IHJlYWRDb25maWcgfSBmcm9tICcuLi8uLi9jb3JlL2NvbmZpZy9jb25maWcudHMnO1xuaW1wb3J0IHsgU2JiUHJvcGVydHlXYXRjaGVyQ29udHJvbGxlciB9IGZyb20gJy4uLy4uL2NvcmUvY29udHJvbGxlcnMudHMnO1xuaW1wb3J0IHsgdHlwZSBEYXRlQWRhcHRlciB9IGZyb20gJy4uLy4uL2NvcmUvZGF0ZXRpbWUvZGF0ZS1hZGFwdGVyLnRzJztcbmltcG9ydCB7IGRlZmF1bHREYXRlQWRhcHRlciB9IGZyb20gJy4uLy4uL2NvcmUvZGF0ZXRpbWUvbmF0aXZlLWRhdGUtYWRhcHRlci50cyc7XG5pbXBvcnQgeyBmb3JjZVR5cGUgfSBmcm9tICcuLi8uLi9jb3JlL2RlY29yYXRvcnMudHMnO1xuaW1wb3J0IHR5cGUgeyBTYmJPcmllbnRhdGlvbiB9IGZyb20gJy4uLy4uL2NvcmUvaW50ZXJmYWNlcy50cyc7XG5pbXBvcnQgeyBib3hTaXppbmdTdHlsZXMgfSBmcm9tICcuLi8uLi9jb3JlL3N0eWxlcy50cyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL21pbmktY2FsZW5kYXItbW9udGguc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIG1vbnRoIGluIHRoZSBgc2JiLW1pbmktY2FsZW5kYXJgLlxuICpcbiAqIEBzbG90IC0gVXNlIHRoZSB1bm5hbWVkIHNsb3QgdG8gYWRkIGBzYmItbWluaS1jYWxlbmRhci1kYXlgIGVsZW1lbnRzLlxuICovXG5leHBvcnQgY2xhc3MgU2JiTWluaUNhbGVuZGFyTW9udGhFbGVtZW50PFQgPSBEYXRlPiBleHRlbmRzIFNiYkVsZW1lbnQge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IGVsZW1lbnROYW1lOiBzdHJpbmcgPSAnc2JiLW1pbmktY2FsZW5kYXItbW9udGgnO1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBbYm94U2l6aW5nU3R5bGVzLCBzdHlsZV07XG5cbiAgLyoqIERhdGUgYXMgSVNPIHN0cmluZyAoWVlZWS1NTSkgKi9cbiAgQGZvcmNlVHlwZSgpXG4gIEBwcm9wZXJ0eSgpXG4gIHB1YmxpYyBhY2Nlc3NvciBkYXRlOiBzdHJpbmcgPSAnJztcblxuICBwcml2YXRlIF9kYXRlQWRhcHRlcjogRGF0ZUFkYXB0ZXI8VD4gPSByZWFkQ29uZmlnKCkuZGF0ZXRpbWU/LmRhdGVBZGFwdGVyID8/IGRlZmF1bHREYXRlQWRhcHRlcjtcbiAgcHJpdmF0ZSBfbW9udGhOYW1lcyA9IHRoaXMuX2RhdGVBZGFwdGVyLmdldE1vbnRoTmFtZXMoJ3Nob3J0Jyk7XG4gIHByaXZhdGUgX21vbnRoTGFiZWw6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuICBwcml2YXRlIF95ZWFyTGFiZWw6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuICBwcml2YXRlIF9wcmV2aW91c09yaWVudGF0aW9uOiBTYmJPcmllbnRhdGlvbiB8IG51bGwgPSBudWxsO1xuXG4gIHB1YmxpYyBjb25zdHJ1Y3RvcigpIHtcbiAgICBzdXBlcigpO1xuICAgIHRoaXMuYWRkQ29udHJvbGxlcihcbiAgICAgIG5ldyBTYmJQcm9wZXJ0eVdhdGNoZXJDb250cm9sbGVyKHRoaXMsICgpID0+IHRoaXMuY2xvc2VzdCgnc2JiLW1pbmktY2FsZW5kYXInKSwge1xuICAgICAgICBvcmllbnRhdGlvbjogKHBhcmVudCkgPT4ge1xuICAgICAgICAgIGlmICh0aGlzLl9wcmV2aW91c09yaWVudGF0aW9uKSB7XG4gICAgICAgICAgICB0aGlzLmludGVybmFscy5zdGF0ZXMuZGVsZXRlKGBvcmllbnRhdGlvbi0ke3RoaXMuX3ByZXZpb3VzT3JpZW50YXRpb259YCk7XG4gICAgICAgICAgfVxuICAgICAgICAgIHRoaXMuX3ByZXZpb3VzT3JpZW50YXRpb24gPSBwYXJlbnQub3JpZW50YXRpb247XG4gICAgICAgICAgaWYgKHRoaXMuX3ByZXZpb3VzT3JpZW50YXRpb24pIHtcbiAgICAgICAgICAgIHRoaXMuaW50ZXJuYWxzLnN0YXRlcy5hZGQoYG9yaWVudGF0aW9uLSR7dGhpcy5fcHJldmlvdXNPcmllbnRhdGlvbn1gKTtcbiAgICAgICAgICB9XG4gICAgICAgIH0sXG4gICAgICB9KSxcbiAgICApO1xuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHdpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXM6IFByb3BlcnR5VmFsdWVzPHRoaXM+KTogdm9pZCB7XG4gICAgc3VwZXIud2lsbFVwZGF0ZShjaGFuZ2VkUHJvcGVydGllcyk7XG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnZGF0ZScpICYmIHRoaXMuZGF0ZSkge1xuICAgICAgaWYgKCF0aGlzLmRhdGUubWF0Y2goL15cXGR7NH0tKDBbMS05XXwxWzAtMl0pJC8pKSB7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cbiAgICAgIGNvbnN0IHNwbGl0RGF0ZSA9IHRoaXMuZGF0ZS5zcGxpdCgnLScpO1xuICAgICAgY29uc3QgZGF0ZSA9IHRoaXMuX2RhdGVBZGFwdGVyLmNyZWF0ZURhdGUoK3NwbGl0RGF0ZVswXSwgK3NwbGl0RGF0ZVsxXSwgMSk7XG4gICAgICBjb25zdCBvZmZzZXQgPSB0aGlzLl9kYXRlQWRhcHRlci5nZXRGaXJzdFdlZWtPZmZzZXQoZGF0ZSk7XG4gICAgICB0aGlzLnN0eWxlPy5zZXRQcm9wZXJ0eSgnLS1zYmItbWluaS1jYWxlbmRhci1tb250aC1vZmZzZXQnLCBgJHtvZmZzZXQgKyAxfWApO1xuXG4gICAgICB0aGlzLl9tb250aExhYmVsID0gYCR7dGhpcy5fbW9udGhOYW1lc1src3BsaXREYXRlWzFdIC0gMV19LmA7XG4gICAgICB0aGlzLl95ZWFyTGFiZWwgPSBTdHJpbmcodGhpcy5fZGF0ZUFkYXB0ZXIuZ2V0WWVhcihkYXRlKSk7XG4gICAgfVxuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICA8ZGl2IGNsYXNzPVwic2JiLW1pbmktY2FsZW5kYXItbW9udGgtbGFiZWwteWVhclwiPiR7dGhpcy5feWVhckxhYmVsfTwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cInNiYi1taW5pLWNhbGVuZGFyLW1vbnRoLXdyYXBwZXJcIj5cbiAgICAgICAgPHNsb3Q+PC9zbG90PlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwic2JiLW1pbmktY2FsZW5kYXItbW9udGgtbGFiZWwtbW9udGhcIj4ke3RoaXMuX21vbnRoTGFiZWx9PC9kaXY+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLW1pbmktY2FsZW5kYXItbW9udGgnOiBTYmJNaW5pQ2FsZW5kYXJNb250aEVsZW1lbnQ7XG4gIH1cbn1cbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7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
|
|
@@ -5,23 +5,23 @@ var A = (r, t, o) => t.has(r) || w("Cannot " + o);
|
|
|
5
5
|
var u = (r, t, o) => (A(r, t, "read from private field"), o ? o.call(r) : t.get(r)), h = (r, t, o) => t.has(r) ? w("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(r) : t.set(r, o), i = (r, t, o, b) => (A(r, t, "write to private field"), b ? b.call(r, o) : t.set(r, o), o);
|
|
6
6
|
import { __esDecorate as v, __runInitializers as d } from "tslib";
|
|
7
7
|
import { css as j, html as B } from "lit";
|
|
8
|
-
import { property as
|
|
8
|
+
import { property as f } from "lit/decorators.js";
|
|
9
9
|
import { SbbButtonBaseElement as O } from "../../core/base-elements.js";
|
|
10
10
|
import { readConfig as S } from "../../core/config/config.js";
|
|
11
11
|
import "../../core/datetime/date-adapter.js";
|
|
12
12
|
import { defaultDateAdapter as T } from "../../core/datetime/native-date-adapter.js";
|
|
13
|
-
import { forceType as
|
|
14
|
-
const U = j`:host{--sbb-mini-calendar-day-
|
|
13
|
+
import { forceType as p, omitEmptyConverter as I } from "../../core/decorators.js";
|
|
14
|
+
const U = j`:host{--sbb-mini-calendar-day-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );display:block;height:var(--sbb-mini-calendar-day-dimensions);width:var(--sbb-mini-calendar-day-dimensions);margin:.0625rem;border-radius:var(--sbb-border-radius-infinity);color:var(--sbb-color-storm);color:light-dark(var(--sbb-color-storm),var(--sbb-color-smoke));background-color:currentcolor}@media(any-hover:hover){:host(:hover){scale:var(--sbb-mini-calendar-day-scale);transition:scale var(--sbb-mini-calendar-day-animation-easing) var(--sbb-mini-calendar-day-animation-duration)}}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:.125rem}:host([color=charcoal]){color:var(--sbb-background-color-2-inverted)}:host([color=cloud]){color:var(--sbb-background-color-4-inverted)}:host([color=orange]){color:var(--sbb-color-orange-light)}:host([color=red]){color:var(--sbb-color-error)}:host([color=sky]){color:var(--sbb-color-sky-light)}:host([marker=circle]){background-color:var(--sbb-color-1-inverted);border:.0625rem solid currentcolor}:host([marker=target]){background:radial-gradient(circle,currentcolor 0%,currentcolor 25%,var(--sbb-color-1-inverted) 25%,var(--sbb-color-1-inverted) 50%,currentcolor 50%,currentcolor 100%)}:host([marker=slash]){position:relative}:host([marker=slash]):before{content:"";position:absolute;inset:0;background-image:linear-gradient(-45deg,transparent 45%,var(--sbb-color-1-inverted) 45%,var(--sbb-color-1-inverted) 55%,transparent 55%)}:host([marker=cross]){position:relative}:host([marker=cross]):before{content:"";position:absolute;inset:0;background-image:linear-gradient(-45deg,transparent 45%,var(--sbb-color-1-inverted) 45%,var(--sbb-color-1-inverted) 55%,transparent 55%),linear-gradient(45deg,transparent 45%,var(--sbb-color-1-inverted) 45%,var(--sbb-color-1-inverted) 55%,transparent 55%)}`;
|
|
15
15
|
let R = (() => {
|
|
16
|
-
var l,
|
|
17
|
-
let r = O, t, o = [], b = [],
|
|
16
|
+
var l, c, n, s;
|
|
17
|
+
let r = O, t, o = [], b = [], g, k = [], _ = [], y, z = [], x = [];
|
|
18
18
|
return s = class extends r {
|
|
19
19
|
constructor() {
|
|
20
20
|
super(...arguments);
|
|
21
21
|
h(this, l);
|
|
22
|
-
h(this, n);
|
|
23
22
|
h(this, c);
|
|
24
|
-
|
|
23
|
+
h(this, n);
|
|
24
|
+
this._dateAdapter = S().datetime?.dateAdapter ?? T, i(this, l, d(this, o, "")), i(this, c, (d(this, b), d(this, k, ""))), i(this, n, (d(this, _), d(this, z, ""))), d(this, x);
|
|
25
25
|
}
|
|
26
26
|
/** Date as ISO string (YYYY-MM-DD) */
|
|
27
27
|
get date() {
|
|
@@ -32,17 +32,17 @@ let R = (() => {
|
|
|
32
32
|
}
|
|
33
33
|
/** The type of the marker. */
|
|
34
34
|
get marker() {
|
|
35
|
-
return u(this,
|
|
35
|
+
return u(this, c);
|
|
36
36
|
}
|
|
37
37
|
set marker(a) {
|
|
38
|
-
i(this,
|
|
38
|
+
i(this, c, a);
|
|
39
39
|
}
|
|
40
40
|
/** The color of the marker. */
|
|
41
41
|
get color() {
|
|
42
|
-
return u(this,
|
|
42
|
+
return u(this, n);
|
|
43
43
|
}
|
|
44
44
|
set color(a) {
|
|
45
|
-
i(this,
|
|
45
|
+
i(this, n, a);
|
|
46
46
|
}
|
|
47
47
|
willUpdate(a) {
|
|
48
48
|
super.willUpdate(a), a.has("date") && this.date && (this.internals.ariaLabel = this._dateAdapter.getAccessibilityFormatDate(this.date));
|
|
@@ -50,11 +50,11 @@ let R = (() => {
|
|
|
50
50
|
renderTemplate() {
|
|
51
51
|
return B``;
|
|
52
52
|
}
|
|
53
|
-
}, l = new WeakMap(),
|
|
53
|
+
}, l = new WeakMap(), c = new WeakMap(), n = new WeakMap(), (() => {
|
|
54
54
|
const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
|
|
55
|
-
t = [
|
|
55
|
+
t = [p(), f()], g = [p(), f({ reflect: !0, converter: I })], y = [p(), f({ reflect: !0, converter: I })], v(s, null, t, { kind: "accessor", name: "date", static: !1, private: !1, access: { has: (e) => "date" in e, get: (e) => e.date, set: (e, m) => {
|
|
56
56
|
e.date = m;
|
|
57
|
-
} }, metadata: a }, o, b), v(s, null,
|
|
57
|
+
} }, metadata: a }, o, b), v(s, null, g, { kind: "accessor", name: "marker", static: !1, private: !1, access: { has: (e) => "marker" in e, get: (e) => e.marker, set: (e, m) => {
|
|
58
58
|
e.marker = m;
|
|
59
59
|
} }, metadata: a }, k, _), v(s, null, y, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (e) => "color" in e, get: (e) => e.color, set: (e, m) => {
|
|
60
60
|
e.color = m;
|
|
@@ -1,59 +1,62 @@
|
|
|
1
1
|
var d = (t) => {
|
|
2
2
|
throw TypeError(t);
|
|
3
3
|
};
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
import {
|
|
7
|
-
import { css as v, html as
|
|
8
|
-
import { property as
|
|
4
|
+
var h = (t, e, i) => e.has(t) || d("Cannot " + i);
|
|
5
|
+
var b = (t, e, i) => (h(t, e, "read from private field"), i ? i.call(t) : e.get(t)), c = (t, e, i) => e.has(t) ? d("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, i), m = (t, e, i, o) => (h(t, e, "write to private field"), o ? o.call(t, i) : e.set(t, i), i);
|
|
6
|
+
import { __esDecorate as u, __runInitializers as p } from "tslib";
|
|
7
|
+
import { css as v, html as y } from "lit";
|
|
8
|
+
import { property as g } from "lit/decorators.js";
|
|
9
9
|
import { SbbElement as _ } from "../../core/base-elements.js";
|
|
10
10
|
import { readConfig as w } from "../../core/config/config.js";
|
|
11
|
+
import { SbbPropertyWatcherController as z } from "../../core/controllers.js";
|
|
11
12
|
import "../../core/datetime/date-adapter.js";
|
|
12
|
-
import { defaultDateAdapter as
|
|
13
|
-
import { forceType as
|
|
14
|
-
import { boxSizingStyles as
|
|
15
|
-
const
|
|
13
|
+
import { defaultDateAdapter as O } from "../../core/datetime/native-date-adapter.js";
|
|
14
|
+
import { forceType as x } from "../../core/decorators.js";
|
|
15
|
+
import { boxSizingStyles as S } from "../../core/styles.js";
|
|
16
|
+
const A = v`:host{display:inline-block}:host(:is(:state(show-year),[state--show-year])){--sbb-mini-calendar-month-visibilty-year: visible}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])){--sbb-mini-calendar-month-grid-auto-flow: row;--sbb-mini-calendar-month-height: 3rem;--sbb-mini-calendar-month-grid-template-rows: none;--sbb-mini-calendar-month-grid-template-columns: repeat(7, 1fr)}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])) ::slotted(sbb-mini-calendar-day:first-child){grid-column-start:var(--sbb-mini-calendar-month-offset)}:host(:is(:state(orientation-vertical),[state--orientation-vertical])){--sbb-mini-calendar-month-grid-auto-flow: column;--sbb-mini-calendar-month-height: auto;--sbb-mini-calendar-month-grid-template-rows: repeat(7, 1fr);--sbb-mini-calendar-month-grid-template-columns: none}:host(:is(:state(orientation-vertical),[state--orientation-vertical])) ::slotted(sbb-mini-calendar-day:first-child){grid-row-start:var(--sbb-mini-calendar-month-offset)}.sbb-mini-calendar-month-wrapper{display:grid;height:var(--sbb-mini-calendar-month-height);grid-auto-flow:var(--sbb-mini-calendar-month-grid-auto-flow);grid-auto-rows:.5rem;grid-template-columns:var(--sbb-mini-calendar-month-grid-template-columns);grid-template-rows:var(--sbb-mini-calendar-month-grid-template-rows)}.sbb-mini-calendar-month-label-year,.sbb-mini-calendar-month-label-month{font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-typo-letter-spacing-text);color:var(--sbb-mini-calendar-month-label-color)}.sbb-mini-calendar-month-label-year{visibility:var(--sbb-mini-calendar-month-visibilty-year)}`;
|
|
16
17
|
let T = (() => {
|
|
17
|
-
var
|
|
18
|
-
let t = _, e,
|
|
19
|
-
return
|
|
18
|
+
var n, r;
|
|
19
|
+
let t = _, e, i = [], o = [];
|
|
20
|
+
return r = class extends t {
|
|
20
21
|
constructor() {
|
|
21
|
-
super(
|
|
22
|
-
c(this,
|
|
23
|
-
m(this,
|
|
22
|
+
super();
|
|
23
|
+
c(this, n);
|
|
24
|
+
m(this, n, p(this, i, "")), this._dateAdapter = (p(this, o), w().datetime?.dateAdapter ?? O), this._monthNames = this._dateAdapter.getMonthNames("short"), this._monthLabel = null, this._yearLabel = null, this._previousOrientation = null, this.addController(new z(this, () => this.closest("sbb-mini-calendar"), {
|
|
25
|
+
orientation: (a) => {
|
|
26
|
+
this._previousOrientation && this.internals.states.delete(`orientation-${this._previousOrientation}`), this._previousOrientation = a.orientation, this._previousOrientation && this.internals.states.add(`orientation-${this._previousOrientation}`);
|
|
27
|
+
}
|
|
28
|
+
}));
|
|
24
29
|
}
|
|
25
30
|
/** Date as ISO string (YYYY-MM) */
|
|
26
31
|
get date() {
|
|
27
|
-
return
|
|
32
|
+
return b(this, n);
|
|
28
33
|
}
|
|
29
|
-
set date(
|
|
30
|
-
m(this,
|
|
34
|
+
set date(a) {
|
|
35
|
+
m(this, n, a);
|
|
31
36
|
}
|
|
32
|
-
willUpdate(
|
|
33
|
-
if (super.willUpdate(
|
|
37
|
+
willUpdate(a) {
|
|
38
|
+
if (super.willUpdate(a), a.has("date") && this.date) {
|
|
34
39
|
if (!this.date.match(/^\d{4}-(0[1-9]|1[0-2])$/))
|
|
35
40
|
return;
|
|
36
|
-
const s = this.date.split("-"),
|
|
37
|
-
this.style?.setProperty("--sbb-mini-calendar-month-offset", `${f + 1}`), this._monthLabel = `${this._monthNames[+s[1] - 1]}.`, this._yearLabel = String(this._dateAdapter.getYear(
|
|
41
|
+
const s = this.date.split("-"), l = this._dateAdapter.createDate(+s[0], +s[1], 1), f = this._dateAdapter.getFirstWeekOffset(l);
|
|
42
|
+
this.style?.setProperty("--sbb-mini-calendar-month-offset", `${f + 1}`), this._monthLabel = `${this._monthNames[+s[1] - 1]}.`, this._yearLabel = String(this._dateAdapter.getYear(l));
|
|
38
43
|
}
|
|
39
44
|
}
|
|
40
45
|
render() {
|
|
41
|
-
return
|
|
42
|
-
<div class="sbb-mini-calendar-month">
|
|
43
|
-
|
|
44
|
-
<
|
|
45
|
-
<slot></slot>
|
|
46
|
-
</div>
|
|
47
|
-
<div class="sbb-mini-calendar-month-label-month">${this._monthLabel}</div>
|
|
46
|
+
return y`
|
|
47
|
+
<div class="sbb-mini-calendar-month-label-year">${this._yearLabel}</div>
|
|
48
|
+
<div class="sbb-mini-calendar-month-wrapper">
|
|
49
|
+
<slot></slot>
|
|
48
50
|
</div>
|
|
51
|
+
<div class="sbb-mini-calendar-month-label-month">${this._monthLabel}</div>
|
|
49
52
|
`;
|
|
50
53
|
}
|
|
51
|
-
},
|
|
52
|
-
const
|
|
53
|
-
e = [
|
|
54
|
-
s.date =
|
|
55
|
-
} }, metadata:
|
|
56
|
-
})(),
|
|
54
|
+
}, n = new WeakMap(), (() => {
|
|
55
|
+
const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(t[Symbol.metadata] ?? null) : void 0;
|
|
56
|
+
e = [x(), g()], u(r, null, e, { kind: "accessor", name: "date", static: !1, private: !1, access: { has: (s) => "date" in s, get: (s) => s.date, set: (s, l) => {
|
|
57
|
+
s.date = l;
|
|
58
|
+
} }, metadata: a }, i, o), a && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
|
|
59
|
+
})(), r.elementName = "sbb-mini-calendar-month", r.styles = [S, A], r;
|
|
57
60
|
})();
|
|
58
61
|
export {
|
|
59
62
|
T as SbbMiniCalendarMonthElement
|
package/off-brand-theme.css
CHANGED
|
@@ -1648,6 +1648,16 @@ summary {
|
|
|
1648
1648
|
--sbb-message-subtitle-color: var(--sbb-color-granite);
|
|
1649
1649
|
--sbb-message-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-platinum));
|
|
1650
1650
|
--sbb-message-legend-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
|
|
1651
|
+
--sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
|
|
1652
|
+
--sbb-mini-calendar-day-dimensions: 0.375rem;
|
|
1653
|
+
--sbb-mini-calendar-day-scale: 1.333;
|
|
1654
|
+
--sbb-mini-calendar-month-offset: 0;
|
|
1655
|
+
--sbb-mini-calendar-month-visibilty-year: hidden;
|
|
1656
|
+
--sbb-mini-calendar-month-label-color: var(--sbb-color-granite);
|
|
1657
|
+
--sbb-mini-calendar-month-label-color: light-dark(
|
|
1658
|
+
var(--sbb-color-granite),
|
|
1659
|
+
var(--sbb-color-silver)
|
|
1660
|
+
);
|
|
1651
1661
|
--sbb-option-color: var(--sbb-color-3);
|
|
1652
1662
|
--sbb-option-background-color: inherit;
|
|
1653
1663
|
--sbb-option-background-color-hover: var(--sbb-background-color-3);
|
|
@@ -2447,26 +2457,6 @@ sbb-notification:has(sbb-title)[size=s] {
|
|
|
2447
2457
|
--sbb-option-white-space: nowrap;
|
|
2448
2458
|
}
|
|
2449
2459
|
|
|
2450
|
-
sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month {
|
|
2451
|
-
--sbb-mini-calendar-grid-auto-flow: row;
|
|
2452
|
-
--sbb-mini-calendar-month-height: 3rem;
|
|
2453
|
-
--sbb-mini-calendar-month-grid-template-rows: none;
|
|
2454
|
-
--sbb-mini-calendar-month-grid-template-columns: repeat(7, 1fr);
|
|
2455
|
-
}
|
|
2456
|
-
sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
|
|
2457
|
-
grid-column-start: var(--sbb-mini-calendar-month-offset);
|
|
2458
|
-
}
|
|
2459
|
-
|
|
2460
|
-
sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month {
|
|
2461
|
-
--sbb-mini-calendar-grid-auto-flow: column;
|
|
2462
|
-
--sbb-mini-calendar-month-height: auto;
|
|
2463
|
-
--sbb-mini-calendar-month-grid-template-rows: repeat(7, 1fr);
|
|
2464
|
-
--sbb-mini-calendar-month-grid-template-columns: none;
|
|
2465
|
-
}
|
|
2466
|
-
sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
|
|
2467
|
-
grid-row-start: var(--sbb-mini-calendar-month-offset);
|
|
2468
|
-
}
|
|
2469
|
-
|
|
2470
2460
|
sub {
|
|
2471
2461
|
bottom: -0.36em;
|
|
2472
2462
|
}
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sbb-esta/lyne-elements-dev",
|
|
3
|
-
"version": "4.7.0-dev.
|
|
3
|
+
"version": "4.7.0-dev.1773333589",
|
|
4
4
|
"description": "Lyne Design System",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"design system",
|
|
7
7
|
"web components",
|
|
8
8
|
"lit",
|
|
9
9
|
"storybook",
|
|
10
|
-
"https://github.com/sbb-design-systems/lyne-components/commit/
|
|
10
|
+
"https://github.com/sbb-design-systems/lyne-components/commit/dc93eed64ffcb2a136df7b1adff07825b3787e6b"
|
|
11
11
|
],
|
|
12
12
|
"type": "module",
|
|
13
13
|
"exports": {
|
package/safety-theme.css
CHANGED
|
@@ -1648,6 +1648,16 @@ summary {
|
|
|
1648
1648
|
--sbb-message-subtitle-color: var(--sbb-color-granite);
|
|
1649
1649
|
--sbb-message-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-platinum));
|
|
1650
1650
|
--sbb-message-legend-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
|
|
1651
|
+
--sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
|
|
1652
|
+
--sbb-mini-calendar-day-dimensions: 0.375rem;
|
|
1653
|
+
--sbb-mini-calendar-day-scale: 1.333;
|
|
1654
|
+
--sbb-mini-calendar-month-offset: 0;
|
|
1655
|
+
--sbb-mini-calendar-month-visibilty-year: hidden;
|
|
1656
|
+
--sbb-mini-calendar-month-label-color: var(--sbb-color-granite);
|
|
1657
|
+
--sbb-mini-calendar-month-label-color: light-dark(
|
|
1658
|
+
var(--sbb-color-granite),
|
|
1659
|
+
var(--sbb-color-silver)
|
|
1660
|
+
);
|
|
1651
1661
|
--sbb-option-color: var(--sbb-color-3);
|
|
1652
1662
|
--sbb-option-background-color: inherit;
|
|
1653
1663
|
--sbb-option-background-color-hover: var(--sbb-background-color-3);
|
|
@@ -2447,26 +2457,6 @@ sbb-notification:has(sbb-title)[size=s] {
|
|
|
2447
2457
|
--sbb-option-white-space: nowrap;
|
|
2448
2458
|
}
|
|
2449
2459
|
|
|
2450
|
-
sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month {
|
|
2451
|
-
--sbb-mini-calendar-grid-auto-flow: row;
|
|
2452
|
-
--sbb-mini-calendar-month-height: 3rem;
|
|
2453
|
-
--sbb-mini-calendar-month-grid-template-rows: none;
|
|
2454
|
-
--sbb-mini-calendar-month-grid-template-columns: repeat(7, 1fr);
|
|
2455
|
-
}
|
|
2456
|
-
sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
|
|
2457
|
-
grid-column-start: var(--sbb-mini-calendar-month-offset);
|
|
2458
|
-
}
|
|
2459
|
-
|
|
2460
|
-
sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month {
|
|
2461
|
-
--sbb-mini-calendar-grid-auto-flow: column;
|
|
2462
|
-
--sbb-mini-calendar-month-height: auto;
|
|
2463
|
-
--sbb-mini-calendar-month-grid-template-rows: repeat(7, 1fr);
|
|
2464
|
-
--sbb-mini-calendar-month-grid-template-columns: none;
|
|
2465
|
-
}
|
|
2466
|
-
sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
|
|
2467
|
-
grid-row-start: var(--sbb-mini-calendar-month-offset);
|
|
2468
|
-
}
|
|
2469
|
-
|
|
2470
2460
|
sub {
|
|
2471
2461
|
bottom: -0.36em;
|
|
2472
2462
|
}
|
package/standard-theme.css
CHANGED
|
@@ -1648,6 +1648,16 @@ summary {
|
|
|
1648
1648
|
--sbb-message-subtitle-color: var(--sbb-color-granite);
|
|
1649
1649
|
--sbb-message-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-platinum));
|
|
1650
1650
|
--sbb-message-legend-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
|
|
1651
|
+
--sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
|
|
1652
|
+
--sbb-mini-calendar-day-dimensions: 0.375rem;
|
|
1653
|
+
--sbb-mini-calendar-day-scale: 1.333;
|
|
1654
|
+
--sbb-mini-calendar-month-offset: 0;
|
|
1655
|
+
--sbb-mini-calendar-month-visibilty-year: hidden;
|
|
1656
|
+
--sbb-mini-calendar-month-label-color: var(--sbb-color-granite);
|
|
1657
|
+
--sbb-mini-calendar-month-label-color: light-dark(
|
|
1658
|
+
var(--sbb-color-granite),
|
|
1659
|
+
var(--sbb-color-silver)
|
|
1660
|
+
);
|
|
1651
1661
|
--sbb-option-color: var(--sbb-color-3);
|
|
1652
1662
|
--sbb-option-background-color: inherit;
|
|
1653
1663
|
--sbb-option-background-color-hover: var(--sbb-background-color-3);
|
|
@@ -2447,26 +2457,6 @@ sbb-notification:has(sbb-title)[size=s] {
|
|
|
2447
2457
|
--sbb-option-white-space: nowrap;
|
|
2448
2458
|
}
|
|
2449
2459
|
|
|
2450
|
-
sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month {
|
|
2451
|
-
--sbb-mini-calendar-grid-auto-flow: row;
|
|
2452
|
-
--sbb-mini-calendar-month-height: 3rem;
|
|
2453
|
-
--sbb-mini-calendar-month-grid-template-rows: none;
|
|
2454
|
-
--sbb-mini-calendar-month-grid-template-columns: repeat(7, 1fr);
|
|
2455
|
-
}
|
|
2456
|
-
sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
|
|
2457
|
-
grid-column-start: var(--sbb-mini-calendar-month-offset);
|
|
2458
|
-
}
|
|
2459
|
-
|
|
2460
|
-
sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month {
|
|
2461
|
-
--sbb-mini-calendar-grid-auto-flow: column;
|
|
2462
|
-
--sbb-mini-calendar-month-height: auto;
|
|
2463
|
-
--sbb-mini-calendar-month-grid-template-rows: repeat(7, 1fr);
|
|
2464
|
-
--sbb-mini-calendar-month-grid-template-columns: none;
|
|
2465
|
-
}
|
|
2466
|
-
sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
|
|
2467
|
-
grid-row-start: var(--sbb-mini-calendar-month-offset);
|
|
2468
|
-
}
|
|
2469
|
-
|
|
2470
2460
|
sub {
|
|
2471
2461
|
bottom: -0.36em;
|
|
2472
2462
|
}
|