@sbb-esta/lyne-elements 1.2.0 → 1.3.0
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/accordion/accordion.d.ts +1 -1
- package/accordion/accordion.d.ts.map +1 -1
- package/alert/alert/alert.d.ts +1 -1
- package/alert/alert/alert.d.ts.map +1 -1
- package/button/common/button-common.d.ts.map +1 -1
- package/button/common.js +20 -20
- package/button/mini-button/mini-button.d.ts +0 -1
- package/button/mini-button/mini-button.d.ts.map +1 -1
- package/button/mini-button.js +16 -18
- package/calendar/calendar.d.ts.map +1 -1
- package/calendar.js +22 -20
- package/checkbox/checkbox/checkbox.d.ts +0 -1
- package/checkbox/checkbox/checkbox.d.ts.map +1 -1
- package/checkbox/checkbox-group/checkbox-group.d.ts +0 -1
- package/checkbox/checkbox-group/checkbox-group.d.ts.map +1 -1
- package/checkbox/checkbox-group.js +5 -3
- package/checkbox/checkbox-panel/checkbox-panel.d.ts +0 -1
- package/checkbox/checkbox-panel/checkbox-panel.d.ts.map +1 -1
- package/checkbox/checkbox-panel.js +12 -11
- package/checkbox/checkbox.js +12 -11
- package/clock/clock.d.ts +19 -13
- package/clock/clock.d.ts.map +1 -1
- package/clock.js +86 -75
- package/core/datetime/date-adapter.d.ts +23 -13
- package/core/datetime/date-adapter.d.ts.map +1 -1
- package/core/datetime/native-date-adapter.d.ts +0 -1
- package/core/datetime/native-date-adapter.d.ts.map +1 -1
- package/core/datetime.js +23 -23
- package/core/decorators/host-attributes.d.ts +1 -1
- package/core/decorators/slot-state.d.ts +18 -0
- package/core/decorators/slot-state.d.ts.map +1 -0
- package/core/decorators.d.ts +1 -0
- package/core/decorators.d.ts.map +1 -1
- package/core/decorators.js +15 -9
- package/core/mixins/hydration-mixin.d.ts.map +1 -1
- package/core/mixins.js +126 -132
- package/core/styles/mixins/buttons.scss +15 -48
- package/custom-elements.json +509 -540
- package/datepicker/common/datepicker-button.d.ts +5 -5
- package/datepicker/common/datepicker-button.d.ts.map +1 -1
- package/datepicker/common.js +21 -20
- package/datepicker/datepicker/datepicker.d.ts +55 -38
- package/datepicker/datepicker/datepicker.d.ts.map +1 -1
- package/datepicker/datepicker-next-day/datepicker-next-day.d.ts +1 -1
- package/datepicker/datepicker-next-day/datepicker-next-day.d.ts.map +1 -1
- package/datepicker/datepicker-next-day.js +16 -16
- package/datepicker/datepicker-previous-day/datepicker-previous-day.d.ts +1 -1
- package/datepicker/datepicker-previous-day/datepicker-previous-day.d.ts.map +1 -1
- package/datepicker/datepicker-previous-day.js +14 -14
- package/datepicker/datepicker-toggle/datepicker-toggle.d.ts +1 -1
- package/datepicker/datepicker-toggle/datepicker-toggle.d.ts.map +1 -1
- package/datepicker/datepicker-toggle.js +25 -23
- package/datepicker/datepicker.js +147 -181
- package/development/accordion/accordion.d.ts +1 -1
- package/development/accordion/accordion.d.ts.map +1 -1
- package/development/accordion.js +1 -1
- package/development/alert/alert/alert.d.ts +1 -1
- package/development/alert/alert/alert.d.ts.map +1 -1
- package/development/alert/alert.js +1 -1
- package/development/button/common/button-common.d.ts.map +1 -1
- package/development/button/common.js +30 -25
- package/development/button/mini-button/mini-button.d.ts +0 -1
- package/development/button/mini-button/mini-button.d.ts.map +1 -1
- package/development/button/mini-button.js +17 -55
- package/development/calendar/calendar.d.ts.map +1 -1
- package/development/calendar.js +4 -2
- package/development/checkbox/checkbox/checkbox.d.ts +0 -1
- package/development/checkbox/checkbox/checkbox.d.ts.map +1 -1
- package/development/checkbox/checkbox-group/checkbox-group.d.ts +0 -1
- package/development/checkbox/checkbox-group/checkbox-group.d.ts.map +1 -1
- package/development/checkbox/checkbox-group.js +6 -5
- package/development/checkbox/checkbox-panel/checkbox-panel.d.ts +0 -1
- package/development/checkbox/checkbox-panel/checkbox-panel.d.ts.map +1 -1
- package/development/checkbox/checkbox-panel.js +5 -5
- package/development/checkbox/checkbox.js +5 -5
- package/development/clock/clock.d.ts +19 -13
- package/development/clock/clock.d.ts.map +1 -1
- package/development/clock.js +85 -80
- package/development/core/datetime/date-adapter.d.ts +23 -13
- package/development/core/datetime/date-adapter.d.ts.map +1 -1
- package/development/core/datetime/native-date-adapter.d.ts +0 -1
- package/development/core/datetime/native-date-adapter.d.ts.map +1 -1
- package/development/core/datetime.js +28 -26
- package/development/core/decorators/host-attributes.d.ts +1 -1
- package/development/core/decorators/slot-state.d.ts +18 -0
- package/development/core/decorators/slot-state.d.ts.map +1 -0
- package/development/core/decorators.d.ts +1 -0
- package/development/core/decorators.d.ts.map +1 -1
- package/development/core/decorators.js +11 -2
- package/development/core/mixins/hydration-mixin.d.ts.map +1 -1
- package/development/core/mixins.js +15 -16
- package/development/datepicker/common/datepicker-button.d.ts +5 -5
- package/development/datepicker/common/datepicker-button.d.ts.map +1 -1
- package/development/datepicker/common.js +10 -9
- package/development/datepicker/datepicker/datepicker.d.ts +55 -38
- package/development/datepicker/datepicker/datepicker.d.ts.map +1 -1
- package/development/datepicker/datepicker-next-day/datepicker-next-day.d.ts +1 -1
- package/development/datepicker/datepicker-next-day/datepicker-next-day.d.ts.map +1 -1
- package/development/datepicker/datepicker-next-day.js +14 -54
- package/development/datepicker/datepicker-previous-day/datepicker-previous-day.d.ts +1 -1
- package/development/datepicker/datepicker-previous-day/datepicker-previous-day.d.ts.map +1 -1
- package/development/datepicker/datepicker-previous-day.js +14 -54
- package/development/datepicker/datepicker-toggle/datepicker-toggle.d.ts +1 -1
- package/development/datepicker/datepicker-toggle/datepicker-toggle.d.ts.map +1 -1
- package/development/datepicker/datepicker-toggle.js +16 -10
- package/development/datepicker/datepicker.js +134 -159
- package/development/dialog/dialog.js +1 -1
- package/development/file-selector/file-selector.d.ts +0 -1
- package/development/file-selector/file-selector.d.ts.map +1 -1
- package/development/file-selector.js +6 -5
- package/development/form-field/form-field/form-field.d.ts +1 -2
- package/development/form-field/form-field/form-field.d.ts.map +1 -1
- package/development/form-field/form-field-clear/form-field-clear.d.ts.map +1 -1
- package/development/form-field/form-field-clear.js +15 -51
- package/development/form-field/form-field.js +8 -7
- package/development/icon/icon-request.d.ts.map +1 -1
- package/development/icon.js +8 -13
- package/development/link/common/link-common.d.ts.map +1 -1
- package/development/link/common.js +6 -7
- package/development/link-list/link-list.d.ts +0 -1
- package/development/link-list/link-list.d.ts.map +1 -1
- package/development/link-list.js +5 -5
- package/development/map-container.js +5 -2
- package/development/navigation/navigation-list/navigation-list.d.ts +0 -1
- package/development/navigation/navigation-list/navigation-list.d.ts.map +1 -1
- package/development/navigation/navigation-list.js +5 -5
- package/development/navigation/navigation-section/navigation-section.d.ts +0 -1
- package/development/navigation/navigation-section/navigation-section.d.ts.map +1 -1
- package/development/navigation/navigation-section.js +6 -6
- package/development/notification/notification.d.ts +5 -16
- package/development/notification/notification.d.ts.map +1 -1
- package/development/notification.js +8 -9
- package/development/option/option/option.d.ts.map +1 -1
- package/development/option/option.js +5 -5
- package/development/popover/popover/popover.d.ts +3 -1
- package/development/popover/popover/popover.d.ts.map +1 -1
- package/development/popover/popover-trigger.js +14 -49
- package/development/popover/popover.js +11 -4
- package/development/radio-button/radio-button/radio-button.d.ts +0 -1
- package/development/radio-button/radio-button/radio-button.d.ts.map +1 -1
- package/development/radio-button/radio-button-group/radio-button-group.d.ts +0 -1
- package/development/radio-button/radio-button-group/radio-button-group.d.ts.map +1 -1
- package/development/radio-button/radio-button-group.js +6 -6
- package/development/radio-button/radio-button-panel/radio-button-panel.d.ts +0 -1
- package/development/radio-button/radio-button-panel/radio-button-panel.d.ts.map +1 -1
- package/development/radio-button/radio-button-panel.js +4 -7
- package/development/radio-button/radio-button.js +4 -7
- package/development/selection-expansion-panel/selection-expansion-panel.d.ts +0 -1
- package/development/selection-expansion-panel/selection-expansion-panel.d.ts.map +1 -1
- package/development/selection-expansion-panel.js +6 -5
- package/development/skiplink-list/skiplink-list.d.ts +0 -1
- package/development/skiplink-list/skiplink-list.d.ts.map +1 -1
- package/development/skiplink-list.js +5 -5
- package/development/status/status.d.ts +0 -1
- package/development/status/status.d.ts.map +1 -1
- package/development/status.js +5 -5
- package/development/stepper/stepper/stepper.d.ts +3 -1
- package/development/stepper/stepper/stepper.d.ts.map +1 -1
- package/development/stepper/stepper.js +3 -2
- package/development/tabs/tab-group/tab-group.d.ts +3 -1
- package/development/tabs/tab-group/tab-group.d.ts.map +1 -1
- package/development/tabs/tab-group.js +3 -2
- package/development/tabs/tab-label/tab-label.d.ts +0 -1
- package/development/tabs/tab-label/tab-label.d.ts.map +1 -1
- package/development/tabs/tab-label.js +5 -5
- package/development/tag/tag/tag.d.ts +0 -1
- package/development/tag/tag/tag.d.ts.map +1 -1
- package/development/tag/tag.js +6 -5
- package/development/teaser/teaser.d.ts +0 -1
- package/development/teaser/teaser.d.ts.map +1 -1
- package/development/teaser.js +5 -5
- package/development/toast/toast.d.ts +1 -2
- package/development/toast/toast.d.ts.map +1 -1
- package/development/toast.js +10 -8
- package/development/toggle/toggle-option/toggle-option.d.ts +0 -1
- package/development/toggle/toggle-option/toggle-option.d.ts.map +1 -1
- package/development/toggle/toggle-option.js +6 -6
- package/development/toggle-check/toggle-check.d.ts +2 -3
- package/development/toggle-check/toggle-check.d.ts.map +1 -1
- package/development/toggle-check.js +5 -5
- package/development/visual-checkbox.js +2 -2
- package/dialog/dialog.js +1 -1
- package/file-selector/file-selector.d.ts +0 -1
- package/file-selector/file-selector.d.ts.map +1 -1
- package/file-selector.js +17 -15
- package/form-field/form-field/form-field.d.ts +1 -2
- package/form-field/form-field/form-field.d.ts.map +1 -1
- package/form-field/form-field-clear/form-field-clear.d.ts.map +1 -1
- package/form-field/form-field-clear.js +17 -18
- package/form-field/form-field.js +16 -14
- package/icon/icon-request.d.ts.map +1 -1
- package/icon.js +86 -86
- package/link/common/link-common.d.ts.map +1 -1
- package/link/common.js +9 -9
- package/link-list/link-list.d.ts +0 -1
- package/link-list/link-list.d.ts.map +1 -1
- package/link-list.js +8 -7
- package/map-container.js +1 -1
- package/navigation/navigation-list/navigation-list.d.ts +0 -1
- package/navigation/navigation-list/navigation-list.d.ts.map +1 -1
- package/navigation/navigation-list.js +9 -8
- package/navigation/navigation-section/navigation-section.d.ts +0 -1
- package/navigation/navigation-section/navigation-section.d.ts.map +1 -1
- package/navigation/navigation-section.js +10 -9
- package/notification/notification.d.ts +5 -16
- package/notification/notification.d.ts.map +1 -1
- package/notification.js +9 -9
- package/option/option/option.d.ts.map +1 -1
- package/option/option.js +6 -5
- package/package.json +1 -1
- package/popover/popover/popover.d.ts +3 -1
- package/popover/popover/popover.d.ts.map +1 -1
- package/popover/popover-trigger.js +13 -13
- package/popover/popover.js +55 -48
- package/radio-button/radio-button/radio-button.d.ts +0 -1
- package/radio-button/radio-button/radio-button.d.ts.map +1 -1
- package/radio-button/radio-button-group/radio-button-group.d.ts +0 -1
- package/radio-button/radio-button-group/radio-button-group.d.ts.map +1 -1
- package/radio-button/radio-button-group.js +7 -6
- package/radio-button/radio-button-panel/radio-button-panel.d.ts +0 -1
- package/radio-button/radio-button-panel/radio-button-panel.d.ts.map +1 -1
- package/radio-button/radio-button-panel.js +12 -14
- package/radio-button/radio-button.js +7 -9
- package/selection-expansion-panel/selection-expansion-panel.d.ts +0 -1
- package/selection-expansion-panel/selection-expansion-panel.d.ts.map +1 -1
- package/selection-expansion-panel.js +15 -13
- package/skiplink-list/skiplink-list.d.ts +0 -1
- package/skiplink-list/skiplink-list.d.ts.map +1 -1
- package/skiplink-list.js +4 -3
- package/status/status.d.ts +0 -1
- package/status/status.d.ts.map +1 -1
- package/status.js +9 -8
- package/stepper/stepper/stepper.d.ts +3 -1
- package/stepper/stepper/stepper.d.ts.map +1 -1
- package/stepper/stepper.js +7 -6
- package/tabs/tab-group/tab-group.d.ts +3 -1
- package/tabs/tab-group/tab-group.d.ts.map +1 -1
- package/tabs/tab-group.js +14 -13
- package/tabs/tab-label/tab-label.d.ts +0 -1
- package/tabs/tab-label/tab-label.d.ts.map +1 -1
- package/tabs/tab-label.js +4 -3
- package/tag/tag/tag.d.ts +0 -1
- package/tag/tag/tag.d.ts.map +1 -1
- package/tag/tag.js +6 -4
- package/teaser/teaser.d.ts +0 -1
- package/teaser/teaser.d.ts.map +1 -1
- package/teaser.js +4 -3
- package/toast/toast.d.ts +1 -2
- package/toast/toast.d.ts.map +1 -1
- package/toast.js +15 -12
- package/toggle/toggle-option/toggle-option.d.ts +0 -1
- package/toggle/toggle-option/toggle-option.d.ts.map +1 -1
- package/toggle/toggle-option.js +12 -11
- package/toggle-check/toggle-check.d.ts +2 -3
- package/toggle-check/toggle-check.d.ts.map +1 -1
- package/toggle-check.js +4 -3
- package/visual-checkbox.js +4 -4
package/accordion/accordion.d.ts
CHANGED
|
@@ -20,7 +20,7 @@ export declare class SbbAccordionElement extends SbbAccordionElement_base {
|
|
|
20
20
|
set multi(value: boolean);
|
|
21
21
|
get multi(): boolean;
|
|
22
22
|
private _multi;
|
|
23
|
-
/** Size variant, either l or s; overrides the size on any projected `sbb-expansion-panel`.
|
|
23
|
+
/** Size variant, either l or s; overrides the size on any projected `sbb-expansion-panel`. */
|
|
24
24
|
size: 's' | 'l';
|
|
25
25
|
private _abort;
|
|
26
26
|
private _closePanels;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/elements/accordion/accordion.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAMvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;;AAIjD;;;;GAIG;AACH,qBACa,mBAAoB,SAAQ,wBAA6B;IACpE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACH,IACW,UAAU,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI,EAGhD;IACD,IAAW,UAAU,IAAI,aAAa,GAAG,IAAI,CAE5C;IACD,OAAO,CAAC,WAAW,CAA8B;IAEjD,8EAA8E;IAC9E,IACW,KAAK,CAAC,KAAK,EAAE,OAAO,EAI9B;IACD,IAAW,KAAK,IAAI,OAAO,CAE1B;IACD,OAAO,CAAC,MAAM,CAAkB;IAEhC
|
|
1
|
+
{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/elements/accordion/accordion.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAMvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;;AAIjD;;;;GAIG;AACH,qBACa,mBAAoB,SAAQ,wBAA6B;IACpE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACH,IACW,UAAU,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI,EAGhD;IACD,IAAW,UAAU,IAAI,aAAa,GAAG,IAAI,CAE5C;IACD,OAAO,CAAC,WAAW,CAA8B;IAEjD,8EAA8E;IAC9E,IACW,KAAK,CAAC,KAAK,EAAE,OAAO,EAI9B;IACD,IAAW,KAAK,IAAI,OAAO,CAE1B;IACD,OAAO,CAAC,MAAM,CAAkB;IAEhC,8FAA8F;IAC1D,IAAI,EAAE,GAAG,GAAG,GAAG,CAAO;IAE1D,OAAO,CAAC,MAAM,CAAyC;IAEvD,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,qBAAqB;IAW7B,OAAO,CAAC,wBAAwB;IAMhC,OAAO,KAAK,gBAAgB,GAE3B;IAEe,iBAAiB,IAAI,IAAI;cAUtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5E,OAAO,CAAC,iBAAiB;cAWN,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,mBAAmB,CAAC;KACtC;CACF"}
|
package/alert/alert/alert.d.ts
CHANGED
|
@@ -25,7 +25,7 @@ export declare class SbbAlertElement extends SbbAlertElement_base {
|
|
|
25
25
|
* In readonly mode, there is no dismiss button offered to the user.
|
|
26
26
|
*/
|
|
27
27
|
readonly: boolean;
|
|
28
|
-
/** You can choose between `m` or `l` size. */
|
|
28
|
+
/** You can choose between `s`, `m` or `l` size. */
|
|
29
29
|
size: 's' | 'm' | 'l';
|
|
30
30
|
/**
|
|
31
31
|
* Name of the icon which will be forward to the nested `sbb-icon`.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert/alert.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAGb,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAMlE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAIpD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,gBAAgB,CAAC;;AAIxB;;;;;;;;;GASG;AACH,qBACa,eAAgB,SAAQ,oBAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;;MAIlB;IAEX;;;OAGG;IACgD,QAAQ,UAAS;IAEpE,
|
|
1
|
+
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert/alert.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAGb,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAMlE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAIpD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,gBAAgB,CAAC;;AAIxB;;;;;;;;;GASG;AACH,qBACa,eAAgB,SAAQ,oBAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;;MAIlB;IAEX;;;OAGG;IACgD,QAAQ,UAAS;IAEpE,mDAAmD;IACf,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAO;IAEhE;;;;OAIG;IACmD,QAAQ,EAAE,MAAM,CAAU;IAEhF,wBAAwB;IACyB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEvE,sFAAsF;IACvC,UAAU,EAAE,aAAa,CAAO;IAE/E,2BAA2B;IACqB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErE,0CAA0C;IACvB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAE5C,uCAAuC;IACpB,MAAM,EAAE,cAAc,GAAG,MAAM,GAAG,SAAS,CAAC;IAE/D,wEAAwE;IACrD,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3C,2EAA2E;IACpB,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IAE9F,8BAA8B;IACM,SAAS,EAAE,MAAM,GAAG,MAAM,CAAU;IAExE,8BAA8B;IAC9B,OAAO,KAAK,MAAM,GAEjB;IACD,OAAO,KAAK,MAAM,QAEjB;IAED,+CAA+C;IAC/C,OAAO,CAAC,SAAS,CAA+E;IAEhG,yEAAyE;IACzE,OAAO,CAAC,QAAQ,CAA8E;IAE9F,sDAAsD;IACtD,OAAO,CAAC,mBAAmB,CAGzB;IAEF,OAAO,CAAC,SAAS,CAAmC;cAE3B,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAM7F,uCAAuC;IAChC,gBAAgB,IAAI,IAAI;IAI/B,sBAAsB;IACtB,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,eAAe;cAOJ,MAAM,IAAI,cAAc;CAqD5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/common/button-common.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"button-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/common/button-common.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAExE,OAAO,KAAK,EACV,mBAAmB,EACnB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAE5E,MAAM,MAAM,sBAAsB,GAAG,+BAA+B,GAAG,oBAAoB,CAAC;AAE5F,MAAM,MAAM,aAAa,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5C,MAAM,CAAC,OAAO,OAAO,+BACnB,YAAW,oBAAoB,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC;IAEtF,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CAC1B;AAGD,eAAO,MAAM,2BAA2B,GAAI,CAAC,SAAS,mBAAmB,CAAC,oBAAoB,CAAC,cACjF,CAAC,KACZ,mBAAmB,CAAC,+BAA+B,CAAC,GAAG,CAuBzD,CAAC"}
|
package/button/common.js
CHANGED
|
@@ -1,19 +1,18 @@
|
|
|
1
1
|
import { property as i } from "lit/decorators.js";
|
|
2
2
|
import { html as c } from "lit/static-html.js";
|
|
3
|
-
import {
|
|
4
|
-
import { hostAttributes as u } from "../core/decorators.js";
|
|
3
|
+
import { hostAttributes as d, slotState as u } from "../core/decorators.js";
|
|
5
4
|
import { SbbNegativeMixin as v } from "../core/mixins.js";
|
|
6
5
|
import { SbbIconNameMixin as h } from "../icon.js";
|
|
7
|
-
import { css as
|
|
8
|
-
var f = Object.defineProperty, m = Object.getOwnPropertyDescriptor, l = (
|
|
9
|
-
for (var
|
|
10
|
-
(n =
|
|
11
|
-
return
|
|
6
|
+
import { css as b } from "lit";
|
|
7
|
+
var f = Object.defineProperty, m = Object.getOwnPropertyDescriptor, l = (r, o, s, a) => {
|
|
8
|
+
for (var t = a > 1 ? void 0 : a ? m(o, s) : o, e = r.length - 1, n; e >= 0; e--)
|
|
9
|
+
(n = r[e]) && (t = (a ? n(o, s, t) : n(t)) || t);
|
|
10
|
+
return a && t && f(o, s, t), t;
|
|
12
11
|
};
|
|
13
|
-
const
|
|
14
|
-
let o = class extends v(h(
|
|
15
|
-
constructor(
|
|
16
|
-
super(
|
|
12
|
+
const z = (r) => {
|
|
13
|
+
let o = class extends v(h(r)) {
|
|
14
|
+
constructor() {
|
|
15
|
+
super(...arguments), this.size = "l";
|
|
17
16
|
}
|
|
18
17
|
renderTemplate() {
|
|
19
18
|
return c`
|
|
@@ -27,16 +26,17 @@ const S = (a) => {
|
|
|
27
26
|
return l([
|
|
28
27
|
i({ reflect: !0 })
|
|
29
28
|
], o.prototype, "size", 2), o = l([
|
|
30
|
-
|
|
29
|
+
d({
|
|
31
30
|
"data-sbb-button": ""
|
|
32
|
-
})
|
|
31
|
+
}),
|
|
32
|
+
u()
|
|
33
33
|
], o), o;
|
|
34
|
-
}, _ = r`*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-button-icon-size: var(--sbb-size-icon-ui-small);--sbb-button-color-disabled-background: var(--sbb-color-milk);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-granite);--sbb-button-shadow-1-offset-y: var(--sbb-shadow-elevation-level-3-shadow-1-offset-y);--sbb-button-shadow-2-offset-y: var(--sbb-shadow-elevation-level-3-shadow-2-offset-y);--sbb-button-shadow-1-blur: var(--sbb-shadow-elevation-level-3-shadow-1-blur);--sbb-button-shadow-2-blur: var(--sbb-shadow-elevation-level-3-shadow-2-blur);--sbb-button-shadow-1-color: var(--sbb-color-red-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-red125-alpha-20);--sbb-button-border-style: solid;--sbb-button-border-disabled-style: dashed;--sbb-button-border-width: var(--sbb-border-width-2x);--sbb-button-border-disabled-width: var(--sbb-border-width-1x);--sbb-button-border-radius: var(--sbb-border-radius-infinity);--sbb-button-min-height: var(--sbb-size-element-m);--sbb-button-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-button-transition-easing-function: var(--sbb-animation-easing);--sbb-button-padding-block-min: var(--sbb-spacing-fixed-1x);--sbb-button-padding-inline: var(--sbb-spacing-fixed-8x);--sbb-button-gap: var(--sbb-spacing-fixed-2x);--sbb-button-inset: 0;--sbb-button-box-shadow: transparent;--sbb-button-box-shadow-definition: var(--sbb-shadow-elevation-level-3-shadow-2-offset-x) var(--sbb-button-shadow-2-offset-y) var(--sbb-button-shadow-2-blur) var(--sbb-shadow-elevation-level-3-shadow-2-spread) var(--sbb-button-shadow-2-color), var(--sbb-shadow-elevation-level-3-shadow-1-offset-x) var(--sbb-button-shadow-1-offset-y) var(--sbb-button-shadow-1-blur) var(--sbb-shadow-elevation-level-3-shadow-1-spread) var(--sbb-button-shadow-1-color)}@media (min-width: 52.5rem){:host{--sbb-button-padding-inline: var(--sbb-spacing-fixed-10x)}}@media (forced-colors: active){:host{--sbb-button-color-default-border: CanvasText !important;--sbb-button-color-active-border: Highlight !important}}:host([negative]){--sbb-button-color-disabled-background: var(--sbb-color-anthracite);--sbb-button-color-disabled-text: var(--sbb-color-aluminium)}:host([size=m]){--sbb-button-min-height: var(--sbb-size-element-s);--sbb-button-padding-inline: var(--sbb-spacing-fixed-5x)}@media (min-width: 52.5rem){:host([size=m]){--sbb-button-padding-inline: var(--sbb-spacing-fixed-8x)}}:host([size=s]){--sbb-button-min-height: var(--sbb-size-element-xs);--sbb-button-padding-inline: var(--sbb-spacing-fixed-4x);--sbb-button-gap: var(--sbb-spacing-fixed-1x)}@media (min-width: 52.5rem){:host([size=s]){--sbb-button-padding-inline: var(--sbb-spacing-fixed-5x)}}:host(:where([data-slot-names~=icon],[icon-name]):not([data-slot-names~=unnamed])){--sbb-button-padding-inline: 0}@media (forced-colors: active){:host([disabled]){--sbb-button-color-disabled-text: GrayText !important}}@media (any-hover: hover){:host(:not([disabled],:active,[data-active]):hover){--sbb-button-translate-y-content-hover: -.0625rem;--sbb-button-shadow-1-offset-y: calc( .5 * var(--sbb-shadow-elevation-level-3-shadow-1-offset-y) );--sbb-button-shadow-1-blur: calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-1-blur));--sbb-button-shadow-2-blur: calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-2-blur))}}@media (forced-colors: active){:host(:not([disabled],:active,[data-active]):hover){--sbb-button-color-hover-border: Highlight !important}}@media (forced-colors: active){:host([role=button]){--sbb-button-color-default-text: ButtonText !important;--sbb-button-color-hover-text: ButtonText !important;--sbb-button-color-active-text: ButtonText !important;--sbb-button-color-default-background: Canvas !important;--sbb-button-color-hover-background: Canvas !important;--sbb-button-color-active-background: Canvas !important;--sbb-button-color-disabled-background: Canvas !important}}.sbb-action-base{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;width:100%;position:relative;display:flex;gap:var(--sbb-button-gap);align-items:center;justify-content:center;text-align:left;transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:color;min-height:var(--sbb-button-min-height);border-radius:var(--sbb-button-border-radius);padding-block:var(--sbb-button-padding-block-min);padding-inline:var(--sbb-button-padding-inline);color:var(--sbb-button-color-default-text);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.sbb-action-base:before{position:absolute;content:"";inset:var(--sbb-button-inset);border:var(--sbb-button-border-width) var(--sbb-button-border-style) var(--sbb-button-color-default-border);border-radius:var(--sbb-button-border-radius);background-color:var(--sbb-button-color-default-background);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,background-color,border-color,box-shadow;box-shadow:var(--sbb-button-box-shadow)}:host([disabled]) .sbb-action-base:before{background-color:var(--sbb-button-color-disabled-background);border-width:var(--sbb-button-border-disabled-width);border-color:var(--sbb-button-color-disabled-border);border-style:var(--sbb-button-border-disabled-style)}@media (any-hover: hover){:host(:not([disabled],:active,[data-active]):hover) .sbb-action-base:before{inset:calc(var(--sbb-button-border-width) * -1);background-color:var(--sbb-button-color-hover-background);border-color:var(--sbb-button-color-hover-border)}}:host(:not([disabled]):is(:active,[data-active])) .sbb-action-base:before{color:var(--sbb-button-color-active-text);background-color:var(--sbb-button-color-active-background);border-color:var(--sbb-button-color-active-border)}:host(:where([data-slot-names~=icon],[icon-name]):not([data-slot-names~=unnamed])) .sbb-action-base{width:var(--sbb-button-min-height);justify-content:center}:host([disabled]) .sbb-action-base{color:var(--sbb-button-color-disabled-text);cursor:default;pointer-events:none}@media (any-hover: hover){:host(:not([disabled],:active,[data-active]):hover) .sbb-action-base{color:var(--sbb-button-color-hover-text)}}:host([data-focus-visible]) .sbb-action-base:before,:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base:before,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-button__label,::slotted([slot=icon]),sbb-icon{transition:transform var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);transform:translateY(var(--sbb-button-translate-y-content-hover, 0rem))}.sbb-button__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}:host(:where([data-slot-names~=icon],[icon-name]):not([data-slot-names~=unnamed])) .sbb-button__label{display:none}`, C = r`:host{--sbb-button-color-active-background: var(--sbb-color-red150);--sbb-button-color-active-border: var(--sbb-color-red150);--sbb-button-color-active-text: var(--sbb-color-cloud);--sbb-button-color-default-background: var(--sbb-color-red);--sbb-button-color-default-border: var(--sbb-color-red);--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: var(--sbb-color-red125);--sbb-button-color-hover-border: var(--sbb-color-red125);--sbb-button-color-hover-text: var(--sbb-color-milk)}:host([negative]){--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-red150);--sbb-button-color-default-background: var(--sbb-color-white);--sbb-button-color-default-border: var(--sbb-color-white);--sbb-button-color-default-text: var(--sbb-color-red);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-hover-border: var(--sbb-color-milk);--sbb-button-color-hover-text: var(--sbb-color-red125);--sbb-button-shadow-1-color: var(--sbb-color-smoke-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-metal-alpha-20)}:host(:not([disabled],:active,[data-active])){--sbb-button-box-shadow: var(--sbb-button-box-shadow-definition)}`, B = r`:host{--sbb-button-color-active-background: var(--sbb-color-milk);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-anthracite);--sbb-button-color-default-background: var(--sbb-color-white);--sbb-button-color-default-border: var(--sbb-color-cloud);--sbb-button-color-default-text: var(--sbb-color-charcoal);--sbb-button-color-hover-background: var(--sbb-color-white);--sbb-button-color-hover-border: var(--sbb-color-cloud);--sbb-button-color-hover-text: var(--sbb-color-iron);--sbb-button-shadow-1-color: var(--sbb-color-platinum-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-cement-alpha-20)}:host([negative]){--sbb-button-color-active-background: transparent;--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-cloud);--sbb-button-color-default-background: transparent;--sbb-button-color-default-border: var(--sbb-color-white);--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: transparent;--sbb-button-color-hover-border: var(--sbb-color-milk);--sbb-button-color-hover-text: var(--sbb-color-milk)}:host(:not([disabled],[negative],:active,[data-active])){--sbb-button-box-shadow: var(--sbb-button-box-shadow-definition)}`, T = r`:host{--sbb-button-color-active-background: var(--sbb-color-black);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-cloud);--sbb-button-color-default-background: var(--sbb-color-charcoal);--sbb-button-color-default-border: var(--sbb-color-cloud);--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: var(--sbb-color-midnight);--sbb-button-color-hover-border: var(--sbb-color-cloud);--sbb-button-color-hover-text: var(--sbb-color-milk);--sbb-button-shadow-1-color: var(--sbb-color-platinum-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-cement-alpha-20)}:host(:not([disabled],:active,[data-active])){--sbb-button-box-shadow: var(--sbb-button-box-shadow-definition)}`, P = r`:host{--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-black);--sbb-button-color-default-background: transparent;--sbb-button-color-default-border: transparent;--sbb-button-color-default-text: var(--sbb-color-black);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-hover-border: var(--sbb-color-milk);--sbb-button-color-hover-text: var(--sbb-color-black)}:host([negative]){--sbb-button-color-active-background: var(--sbb-color-iron);--sbb-button-color-active-border: var(--sbb-color-iron);--sbb-button-color-active-text: var(--sbb-color-white);--sbb-button-color-default-background: transparent;--sbb-button-color-default-border: transparent;--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: var(--sbb-color-charcoal);--sbb-button-color-hover-border: var(--sbb-color-charcoal);--sbb-button-color-hover-text: var(--sbb-color-white)}`;
|
|
34
|
+
}, C = b`*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-button-icon-size: var(--sbb-size-icon-ui-small);--sbb-button-color-disabled-background: var(--sbb-color-milk);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-granite);--sbb-button-shadow-1-offset-y: var(--sbb-shadow-elevation-level-3-shadow-1-offset-y);--sbb-button-shadow-2-offset-y: var(--sbb-shadow-elevation-level-3-shadow-2-offset-y);--sbb-button-shadow-1-blur: var(--sbb-shadow-elevation-level-3-shadow-1-blur);--sbb-button-shadow-2-blur: var(--sbb-shadow-elevation-level-3-shadow-2-blur);--sbb-button-shadow-1-color: var(--sbb-color-red-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-red125-alpha-20);--sbb-button-border-style: solid;--sbb-button-border-disabled-style: dashed;--sbb-button-border-width: var(--sbb-border-width-2x);--sbb-button-border-disabled-width: var(--sbb-border-width-1x);--sbb-button-border-radius: var(--sbb-border-radius-infinity);--sbb-button-min-height: var(--sbb-size-element-m);--sbb-button-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-button-transition-easing-function: var(--sbb-animation-easing);--sbb-button-padding-block-min: var(--sbb-spacing-fixed-1x);--sbb-button-padding-inline: var(--sbb-spacing-fixed-8x);--sbb-button-gap: var(--sbb-spacing-fixed-2x);--sbb-button-inset: 0;--sbb-button-box-shadow: transparent;--sbb-button-box-shadow-definition: var(--sbb-shadow-elevation-level-3-shadow-2-offset-x) var(--sbb-button-shadow-2-offset-y) var(--sbb-button-shadow-2-blur) var(--sbb-shadow-elevation-level-3-shadow-2-spread) var(--sbb-button-shadow-2-color), var(--sbb-shadow-elevation-level-3-shadow-1-offset-x) var(--sbb-button-shadow-1-offset-y) var(--sbb-button-shadow-1-blur) var(--sbb-shadow-elevation-level-3-shadow-1-spread) var(--sbb-button-shadow-1-color)}@media (min-width: 52.5rem){:host{--sbb-button-padding-inline: var(--sbb-spacing-fixed-10x)}}@media (forced-colors: active){:host{--sbb-button-color-default-border: CanvasText !important;--sbb-button-color-active-border: Highlight !important;--sbb-button-color-default-background: Canvas !important;--sbb-button-color-hover-background: Canvas !important;--sbb-button-color-active-background: Canvas !important;--sbb-button-color-disabled-background: Canvas !important;--sbb-button-color-disabled-text: GrayText !important;--sbb-button-color-default-text: CanvasText !important;--sbb-button-color-hover-text: CanvasText !important;--sbb-button-color-active-text: CanvasText !important}}@media (forced-colors: active){:host([data-button]){--sbb-button-color-default-text: ButtonText !important;--sbb-button-color-hover-text: ButtonText !important;--sbb-button-color-active-text: ButtonText !important}}@media (forced-colors: active){:host([data-link]){--sbb-button-color-default-text: LinkText !important;--sbb-button-color-hover-text: LinkText !important;--sbb-button-color-active-text: LinkText !important}}:host([negative]){--sbb-button-color-disabled-background: var(--sbb-color-anthracite);--sbb-button-color-disabled-text: var(--sbb-color-aluminium)}:host([size=m]){--sbb-button-min-height: var(--sbb-size-element-s);--sbb-button-padding-inline: var(--sbb-spacing-fixed-5x)}@media (min-width: 52.5rem){:host([size=m]){--sbb-button-padding-inline: var(--sbb-spacing-fixed-8x)}}:host([size=s]){--sbb-button-min-height: var(--sbb-size-element-xs);--sbb-button-padding-inline: var(--sbb-spacing-fixed-4x);--sbb-button-gap: var(--sbb-spacing-fixed-1x)}@media (min-width: 52.5rem){:host([size=s]){--sbb-button-padding-inline: var(--sbb-spacing-fixed-5x)}}:host(:where([data-slot-names~=icon],[icon-name]):not([data-slot-names~=unnamed])){--sbb-button-padding-inline: 0}@media (any-hover: hover){:host(:not([disabled],:active,[data-active]):hover){--sbb-button-translate-y-content-hover: -.0625rem;--sbb-button-shadow-1-offset-y: calc( .5 * var(--sbb-shadow-elevation-level-3-shadow-1-offset-y) );--sbb-button-shadow-1-blur: calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-1-blur));--sbb-button-shadow-2-blur: calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-2-blur))}}@media (forced-colors: active){:host(:not([disabled],:active,[data-active]):hover){--sbb-button-color-hover-border: Highlight !important}}.sbb-action-base{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;width:100%;position:relative;display:flex;gap:var(--sbb-button-gap);align-items:center;justify-content:center;text-align:left;transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:color;min-height:var(--sbb-button-min-height);border-radius:var(--sbb-button-border-radius);padding-block:var(--sbb-button-padding-block-min);padding-inline:var(--sbb-button-padding-inline);color:var(--sbb-button-color-default-text);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.sbb-action-base:before{position:absolute;content:"";inset:var(--sbb-button-inset);border:var(--sbb-button-border-width) var(--sbb-button-border-style) var(--sbb-button-color-default-border);border-radius:var(--sbb-button-border-radius);background-color:var(--sbb-button-color-default-background);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,background-color,border-color,box-shadow;box-shadow:var(--sbb-button-box-shadow)}:host([disabled]) .sbb-action-base:before{background-color:var(--sbb-button-color-disabled-background);border-width:var(--sbb-button-border-disabled-width);border-color:var(--sbb-button-color-disabled-border);border-style:var(--sbb-button-border-disabled-style)}@media (any-hover: hover){:host(:not([disabled],:active,[data-active]):hover) .sbb-action-base:before{inset:calc(var(--sbb-button-border-width) * -1);background-color:var(--sbb-button-color-hover-background);border-color:var(--sbb-button-color-hover-border)}}:host(:not([disabled]):is(:active,[data-active])) .sbb-action-base:before{color:var(--sbb-button-color-active-text);background-color:var(--sbb-button-color-active-background);border-color:var(--sbb-button-color-active-border)}:host(:where([data-slot-names~=icon],[icon-name]):not([data-slot-names~=unnamed])) .sbb-action-base{width:var(--sbb-button-min-height);justify-content:center}:host([disabled]) .sbb-action-base{color:var(--sbb-button-color-disabled-text);cursor:default;pointer-events:none}@media (any-hover: hover){:host(:not([disabled],:active,[data-active]):hover) .sbb-action-base{color:var(--sbb-button-color-hover-text)}}:host([data-focus-visible]) .sbb-action-base:before,:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base:before,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-button__label,::slotted([slot=icon]),sbb-icon{transition:transform var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);transform:translateY(var(--sbb-button-translate-y-content-hover, 0rem))}.sbb-button__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}:host(:where([data-slot-names~=icon],[icon-name]):not([data-slot-names~=unnamed])) .sbb-button__label{display:none}`, T = b`:host{--sbb-button-color-active-background: var(--sbb-color-red150);--sbb-button-color-active-border: var(--sbb-color-red150);--sbb-button-color-active-text: var(--sbb-color-cloud);--sbb-button-color-default-background: var(--sbb-color-red);--sbb-button-color-default-border: var(--sbb-color-red);--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: var(--sbb-color-red125);--sbb-button-color-hover-border: var(--sbb-color-red125);--sbb-button-color-hover-text: var(--sbb-color-milk)}:host([negative]){--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-red150);--sbb-button-color-default-background: var(--sbb-color-white);--sbb-button-color-default-border: var(--sbb-color-white);--sbb-button-color-default-text: var(--sbb-color-red);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-hover-border: var(--sbb-color-milk);--sbb-button-color-hover-text: var(--sbb-color-red125);--sbb-button-shadow-1-color: var(--sbb-color-smoke-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-metal-alpha-20)}:host(:not([disabled],:active,[data-active])){--sbb-button-box-shadow: var(--sbb-button-box-shadow-definition)}`, _ = b`:host{--sbb-button-color-active-background: var(--sbb-color-milk);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-anthracite);--sbb-button-color-default-background: var(--sbb-color-white);--sbb-button-color-default-border: var(--sbb-color-cloud);--sbb-button-color-default-text: var(--sbb-color-charcoal);--sbb-button-color-hover-background: var(--sbb-color-white);--sbb-button-color-hover-border: var(--sbb-color-cloud);--sbb-button-color-hover-text: var(--sbb-color-iron);--sbb-button-shadow-1-color: var(--sbb-color-platinum-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-cement-alpha-20)}:host([negative]){--sbb-button-color-active-background: transparent;--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-cloud);--sbb-button-color-default-background: transparent;--sbb-button-color-default-border: var(--sbb-color-white);--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: transparent;--sbb-button-color-hover-border: var(--sbb-color-milk);--sbb-button-color-hover-text: var(--sbb-color-milk)}:host(:not([disabled],[negative],:active,[data-active])){--sbb-button-box-shadow: var(--sbb-button-box-shadow-definition)}`, S = b`:host{--sbb-button-color-active-background: var(--sbb-color-black);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-cloud);--sbb-button-color-default-background: var(--sbb-color-charcoal);--sbb-button-color-default-border: var(--sbb-color-cloud);--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: var(--sbb-color-midnight);--sbb-button-color-hover-border: var(--sbb-color-cloud);--sbb-button-color-hover-text: var(--sbb-color-milk);--sbb-button-shadow-1-color: var(--sbb-color-platinum-alpha-20);--sbb-button-shadow-2-color: var(--sbb-color-cement-alpha-20)}:host(:not([disabled],:active,[data-active])){--sbb-button-box-shadow: var(--sbb-button-box-shadow-definition)}`, B = b`:host{--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-active-border: var(--sbb-color-cloud);--sbb-button-color-active-text: var(--sbb-color-black);--sbb-button-color-default-background: transparent;--sbb-button-color-default-border: transparent;--sbb-button-color-default-text: var(--sbb-color-black);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-hover-border: var(--sbb-color-milk);--sbb-button-color-hover-text: var(--sbb-color-black)}:host([negative]){--sbb-button-color-active-background: var(--sbb-color-iron);--sbb-button-color-active-border: var(--sbb-color-iron);--sbb-button-color-active-text: var(--sbb-color-white);--sbb-button-color-default-background: transparent;--sbb-button-color-default-border: transparent;--sbb-button-color-default-text: var(--sbb-color-white);--sbb-button-color-hover-background: var(--sbb-color-charcoal);--sbb-button-color-hover-border: var(--sbb-color-charcoal);--sbb-button-color-hover-text: var(--sbb-color-white)}`;
|
|
35
35
|
export {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
36
|
+
z as SbbButtonCommonElementMixin,
|
|
37
|
+
C as buttonCommonStyle,
|
|
38
|
+
T as buttonPrimaryStyle,
|
|
39
|
+
_ as buttonSecondaryStyle,
|
|
40
|
+
S as buttonTertiaryStyle,
|
|
41
|
+
B as buttonTransparentStyle
|
|
42
42
|
};
|
|
@@ -10,7 +10,6 @@ declare const SbbMiniButtonElement_base: import('../../core/mixins.js').Abstract
|
|
|
10
10
|
*/
|
|
11
11
|
export declare class SbbMiniButtonElement extends SbbMiniButtonElement_base {
|
|
12
12
|
static styles: CSSResultGroup;
|
|
13
|
-
constructor();
|
|
14
13
|
protected renderTemplate(): TemplateResult;
|
|
15
14
|
}
|
|
16
15
|
declare global {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mini-button.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/mini-button/mini-button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAOnE;;;;;GAKG;AACH,
|
|
1
|
+
{"version":3,"file":"mini-button.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/mini-button/mini-button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAOnE;;;;;GAKG;AACH,qBAEa,oBAAqB,SAAQ,yBAEzC;IACC,OAAuB,MAAM,EAAE,cAAc,CAAS;cAEnC,cAAc,IAAI,cAAc;CAGpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}
|
package/button/mini-button.js
CHANGED
|
@@ -1,29 +1,27 @@
|
|
|
1
|
-
import { customElement as
|
|
1
|
+
import { customElement as e } from "lit/decorators.js";
|
|
2
2
|
import { SbbButtonBaseElement as l } from "../core/base-elements.js";
|
|
3
|
-
import {
|
|
4
|
-
import { SbbNegativeMixin as
|
|
3
|
+
import { slotState as d } from "../core/decorators.js";
|
|
4
|
+
import { SbbNegativeMixin as c, SbbDisabledTabIndexActionMixin as u } from "../core/mixins.js";
|
|
5
5
|
import { SbbIconNameMixin as v } from "../icon.js";
|
|
6
|
-
import { css as
|
|
7
|
-
const
|
|
8
|
-
var
|
|
9
|
-
for (var o = b > 1 ? void 0 : b ?
|
|
10
|
-
(
|
|
11
|
-
return b && o &&
|
|
6
|
+
import { css as m } from "lit";
|
|
7
|
+
const f = m`*,:before,:after{box-sizing:border-box}:host{display:block;outline:none!important}:host{display:inline-block;-webkit-tap-highlight-color:transparent;height:fit-content;outline:none!important;--sbb-button-color-text: var(--sbb-color-charcoal);--sbb-button-color-default-background: var(--sbb-color-black-alpha-0);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-disabled-background: var(--sbb-color-milk);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-granite);--sbb-button-border-disabled-width: var(--sbb-border-width-1x);--sbb-button-border-disabled-style: dashed;--sbb-button-border-radius: var(--sbb-border-radius-infinity);--sbb-button-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-button-transition-easing-function: var(--sbb-animation-easing)}@media (forced-colors: active){:host{--sbb-button-color-text: ButtonText !important;--sbb-button-color-hover-background: Highlight !important;--sbb-button-color-active-background: Highlight !important;--sbb-button-color-disabled-background: Canvas !important;--sbb-button-color-disabled-border: GrayText !important;--sbb-button-color-disabled-text: GrayText !important}}:host .sbb-mini-button{position:relative;transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:color;border-radius:var(--sbb-button-border-radius);color:var(--sbb-button-color-text);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex}:host .sbb-mini-button:before{position:absolute;content:"";top:0;right:0;bottom:0;left:0;border-radius:var(--sbb-button-border-radius);background-color:var(--sbb-button-color-default-background);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,background-color}::slotted(sbb-icon),sbb-icon{transition:transform var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);transform:translateY(var(--sbb-button-translate-y-content-hover, 0rem));display:flex}:host([negative]){--sbb-button-color-text: var(--sbb-color-milk);--sbb-button-color-default-background: var(--sbb-color-black-alpha-0);--sbb-button-color-hover-background: var(--sbb-color-charcoal);--sbb-button-color-active-background: var(--sbb-color-iron);--sbb-button-color-disabled-background: var(--sbb-color-black-alpha-0);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-smoke)}:host(:is([disabled],[data-disabled])) .sbb-mini-button{color:var(--sbb-button-color-disabled-text);cursor:default;pointer-events:none}:host(:is([disabled],[data-disabled])) .sbb-mini-button:before{background-color:var(--sbb-button-color-disabled-background);border:var(--sbb-button-border-disabled-width) var(--sbb-button-border-disabled-style) var(--sbb-button-color-disabled-border)}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-mini-button:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (any-hover: hover){:host(:not([disabled],[data-disabled],:active,[data-active]):hover){--sbb-button-translate-y-content-hover: -.0625rem}}@media (any-hover: hover){:host(:not([disabled],[data-disabled],:active,[data-active]):hover) .sbb-mini-button:before{background-color:var(--sbb-button-color-hover-background)}}:host(:not([disabled],[data-disabled]):is(:active,[data-active])) .sbb-mini-button:before{background-color:var(--sbb-button-color-active-background)}`;
|
|
8
|
+
var h = Object.defineProperty, g = Object.getOwnPropertyDescriptor, p = (s, t, r, b) => {
|
|
9
|
+
for (var o = b > 1 ? void 0 : b ? g(t, r) : t, n = s.length - 1, a; n >= 0; n--)
|
|
10
|
+
(a = s[n]) && (o = (b ? a(t, r, o) : a(o)) || o);
|
|
11
|
+
return b && o && h(t, r, o), o;
|
|
12
12
|
};
|
|
13
|
-
let
|
|
13
|
+
let i = class extends c(
|
|
14
14
|
v(u(l))
|
|
15
15
|
) {
|
|
16
|
-
constructor() {
|
|
17
|
-
super(), new c(this);
|
|
18
|
-
}
|
|
19
16
|
renderTemplate() {
|
|
20
17
|
return super.renderIconSlot();
|
|
21
18
|
}
|
|
22
19
|
};
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
20
|
+
i.styles = f;
|
|
21
|
+
i = p([
|
|
22
|
+
e("sbb-mini-button"),
|
|
23
|
+
d()
|
|
24
|
+
], i);
|
|
27
25
|
export {
|
|
28
|
-
|
|
26
|
+
i as SbbMiniButtonElement
|
|
29
27
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/elements/calendar/calendar.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAGnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/elements/calendar/calendar.ts"],"names":[],"mappings":"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"}
|
package/calendar.js
CHANGED
|
@@ -2,27 +2,29 @@ import { css as Y, LitElement as M, isServer as x, html as o, nothing as h } fro
|
|
|
2
2
|
import { property as u, state as f, customElement as V } from "lit/decorators.js";
|
|
3
3
|
import { classMap as p } from "lit/directives/class-map.js";
|
|
4
4
|
import { sbbInputModalityDetector as k, isArrowKeyOrPageKeysPressed as F } from "./core/a11y.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
5
|
+
import { readConfig as z } from "./core/config.js";
|
|
6
|
+
import { SbbConnectedAbortController as R, SbbLanguageController as N } from "./core/controllers.js";
|
|
7
|
+
import { defaultDateAdapter as T, YEARS_PER_PAGE as l, DAYS_PER_ROW as y, MONTHS_PER_ROW as g, YEARS_PER_ROW as v } from "./core/datetime.js";
|
|
7
8
|
import { isBreakpoint as A } from "./core/dom.js";
|
|
8
|
-
import { EventEmitter as
|
|
9
|
-
import { i18nPreviousMonth as
|
|
10
|
-
import { SbbHydrationMixin as
|
|
9
|
+
import { EventEmitter as I } from "./core/eventing.js";
|
|
10
|
+
import { i18nPreviousMonth as O, i18nNextMonth as S, i18nYearMonthSelection as C, i18nPreviousYear as W, i18nNextYear as E, i18nCalendarDateSelection as D, i18nPreviousYearRange as L, i18nNextYearRange as P } from "./core/i18n.js";
|
|
11
|
+
import { SbbHydrationMixin as B } from "./core/mixins.js";
|
|
11
12
|
import "./button/secondary-button.js";
|
|
12
13
|
import "./icon.js";
|
|
13
14
|
import "./screen-reader-only.js";
|
|
14
|
-
const
|
|
15
|
-
var
|
|
16
|
-
for (var s = r > 1 ? void 0 : r ?
|
|
15
|
+
const q = Y`*,:before,:after{box-sizing:border-box}:host{--sbb-calendar-cell-size: 2.5rem;--sbb-calendar-hover-shift: .0625rem;--sbb-calendar-wide-cell-size: 4.375rem;--sbb-calendar-cell-disabled-color: var(--sbb-color-granite);--sbb-calendar-header-color: var(--sbb-color-granite);--sbb-calendar-cell-background-color: transparent;--sbb-calendar-cell-padding: .125rem;--sbb-calendar-cell-color: var(--sbb-color-charcoal);--sbb-calendar-cell-selected-color: var(--sbb-color-white);--sbb-calendar-cell-selected-background-color: var(--sbb-color-charcoal);--sbb-calendar-cell-disabled-height: .09375rem;--sbb-calendar-cell-disabled-width: 1.59375rem;--sbb-calendar-cell-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);--sbb-calendar-tables-gap: var(--sbb-spacing-fixed-10x);--sbb-calendar-table-animation-shift: .00625rem;--sbb-calendar-table-animation-duration: .1ms;--sbb-calendar-table-column-spaces: 12;--sbb-calendar-control-view-change-height: 2.75rem;--sbb-calendar-control-view-change-color: var(--sbb-color-charcoal);--sbb-calendar-control-view-change-background: var(--sbb-color-white);display:block;width:max-content}@media (min-width: 22.5rem){:host{--sbb-calendar-cell-size: 2.75rem;--sbb-calendar-wide-cell-size: 4.8125rem;--sbb-calendar-control-view-change-height: 3rem}}.sbb-calendar__wrapper{width:100%;display:block;transition-duration:var(--sbb-calendar-cell-transition-duration)}.sbb-calendar__controls{width:100%;display:inline-flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);margin-block-end:var(--sbb-spacing-fixed-4x)}.sbb-calendar__controls-month{width:100%;display:flex;gap:var(--sbb-calendar-tables-gap)}#sbb-calendar__controls-previous,#sbb-calendar__controls-next{-webkit-tap-highlight-color:transparent}.sbb-calendar__controls-change-date{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;align-items:center;margin:auto;height:var(--sbb-calendar-control-view-change-height);text-transform:capitalize;cursor:pointer;padding-inline:var(--sbb-spacing-fixed-5x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-calendar-control-view-change-background);color:var(--sbb-calendar-control-view-change-color);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color,padding-block-end}.sbb-calendar__controls-change-date:disabled{--sbb-calendar-control-view-change-background: var(--sbb-color-milk);--sbb-calendar-control-view-change-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__controls-change-date:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-1x)}@media (any-hover: hover){.sbb-calendar__controls-change-date:not(:active,:disabled):hover{padding-block-end:var(--sbb-calendar-hover-shift)}}.sbb-calendar__controls-change-date:not(:disabled):active{--sbb-calendar-control-view-change-background: var(--sbb-color-milk)}.sbb-calendar__table-month-view,.sbb-calendar__table-year-view{--sbb-calendar-table-column-spaces: 6}.sbb-calendar__table-container{display:flex;gap:var(--sbb-calendar-tables-gap);--sbb-calendar-min-width: calc(7 * var(--sbb-calendar-cell-size));--sbb-calendar-overflow: calc(100% - var(--sbb-calendar-min-width));--sbb-calendar-start-offset: min( 0px, -1 * (var(--sbb-calendar-overflow) / var(--sbb-calendar-table-column-spaces)) );--sbb-calendar-margin: var(--sbb-calendar-start-offset);margin-inline:var(--sbb-calendar-margin)}:host([data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 7 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) );--sbb-calendar-margin: calc(.5 * var(--sbb-calendar-start-offset))}.sbb-calendar__table{width:100%;border-collapse:collapse;height:max-content;animation-name:show;animation-duration:var(--sbb-calendar-table-animation-duration)}.sbb-calendar__table.sbb-calendar__table-hide{--sbb-calendar-cell-transition-duration: 0ms;animation-name:hide;animation-duration:var(--sbb-calendar-table-animation-duration)}:host(:not([data-wide])) .sbb-calendar__table{min-width:100%}.sbb-calendar__table-header{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-calendar-header-color);width:var(--sbb-calendar-cell-size);padding:0;padding-block-end:var(--sbb-spacing-fixed-4x);text-align:center}.sbb-calendar__table-data{position:relative;padding:0;text-align:center}.sbb-calendar__cell{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);height:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-cell-color);cursor:pointer;position:relative;z-index:0}.sbb-calendar__cell:before{content:"";position:absolute;inset:var(--sbb-calendar-cell-padding);background-color:var(--sbb-calendar-cell-background-color);border-radius:50%;z-index:-1;transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color}@media (any-hover: hover){.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover{--sbb-calendar-cell-background-color: var(--sbb-color-milk);padding-block-end:var(--sbb-calendar-hover-shift)}}@media (any-hover: hover) and (forced-colors: active){.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}}.sbb-calendar__cell:disabled{--sbb-calendar-cell-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__cell:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active{--sbb-calendar-cell-background-color: var(--sbb-color-cloud)}@media (forced-colors: active){.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}}.sbb-calendar__day{border-radius:50%;width:var(--sbb-calendar-cell-size)}.sbb-calendar__day:before{border-radius:50%}.sbb-calendar__pill{width:var(--sbb-calendar-wide-cell-size);border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__pill:before{border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__crossed-out:after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);position:absolute;background-color:var(--sbb-calendar-cell-disabled-color);top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg)}.sbb-calendar__cell-current{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}.sbb-calendar__selected{--sbb-calendar-cell-color: var(--sbb-calendar-cell-selected-color);--sbb-calendar-cell-background-color: var(--sbb-calendar-cell-selected-background-color)}@media (forced-colors: active){.sbb-calendar__selected{--sbb-calendar-cell-background-color: ButtonText !important}}@keyframes show{0%{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}to{opacity:1;transform:translateY(0)}}@keyframes hide{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}}`;
|
|
16
|
+
var K = Object.defineProperty, H = Object.getOwnPropertyDescriptor, b = (e, t, a, r) => {
|
|
17
|
+
for (var s = r > 1 ? void 0 : r ? H(t, a) : t, i = e.length - 1, n; i >= 0; i--)
|
|
17
18
|
(n = e[i]) && (s = (r ? n(t, a, s) : n(s)) || s);
|
|
18
|
-
return r && s &&
|
|
19
|
+
return r && s && K(t, a, s), s;
|
|
19
20
|
};
|
|
20
|
-
let d = class extends
|
|
21
|
+
let d = class extends B(M) {
|
|
21
22
|
constructor() {
|
|
22
|
-
|
|
23
|
+
var e;
|
|
24
|
+
super(), this.wide = !1, this._now = null, this._dateAdapter = ((e = z().datetime) == null ? void 0 : e.dateAdapter) ?? T, this._dateSelected = new I(
|
|
23
25
|
this,
|
|
24
26
|
d.events.dateSelected
|
|
25
|
-
), this._activeDate = this.now, this._calendarView = "day", this._nextCalendarView = "day", this._weeks = [], this._monthNames = this._dateAdapter.getMonthNames("long"), this._resetFocus = !1, this._initialized = !1, this._abort = new
|
|
27
|
+
), this._activeDate = this.now, this._calendarView = "day", this._nextCalendarView = "day", this._weeks = [], this._monthNames = this._dateAdapter.getMonthNames("long"), this._resetFocus = !1, this._initialized = !1, this._abort = new R(this), this._language = new N(this).withHandler(() => {
|
|
26
28
|
this._monthNames = this._dateAdapter.getMonthNames("long"), this._createMonthRows();
|
|
27
29
|
}), this._createMonthRows(), this._setWeekdays();
|
|
28
30
|
}
|
|
@@ -430,7 +432,7 @@ let d = class extends P(M) {
|
|
|
430
432
|
${this._getArrow(
|
|
431
433
|
"left",
|
|
432
434
|
() => this._goToDifferentMonth(-1),
|
|
433
|
-
|
|
435
|
+
O[this._language.current],
|
|
434
436
|
this._previousMonthDisabled()
|
|
435
437
|
)}
|
|
436
438
|
<div class="sbb-calendar__controls-month">
|
|
@@ -443,7 +445,7 @@ let d = class extends P(M) {
|
|
|
443
445
|
${this._getArrow(
|
|
444
446
|
"right",
|
|
445
447
|
() => this._goToDifferentMonth(1),
|
|
446
|
-
|
|
448
|
+
S[this._language.current],
|
|
447
449
|
this._nextMonthDisabled()
|
|
448
450
|
)}
|
|
449
451
|
</div>
|
|
@@ -461,7 +463,7 @@ let d = class extends P(M) {
|
|
|
461
463
|
type="button"
|
|
462
464
|
id="sbb-calendar__date-selection"
|
|
463
465
|
class="sbb-calendar__controls-change-date"
|
|
464
|
-
aria-label="${
|
|
466
|
+
aria-label="${C[this._language.current]} ${t}"
|
|
465
467
|
@click=${() => {
|
|
466
468
|
this._resetFocus = !0, this._nextCalendarView = "year", this._removeTable();
|
|
467
469
|
}}
|
|
@@ -571,14 +573,14 @@ let d = class extends P(M) {
|
|
|
571
573
|
${this._getArrow(
|
|
572
574
|
"left",
|
|
573
575
|
() => this._goToDifferentYear(-1),
|
|
574
|
-
|
|
576
|
+
W[this._language.current],
|
|
575
577
|
this._previousYearDisabled()
|
|
576
578
|
)}
|
|
577
579
|
<div class="sbb-calendar__controls-month">${this._createLabelForMonthView()}</div>
|
|
578
580
|
${this._getArrow(
|
|
579
581
|
"right",
|
|
580
582
|
() => this._goToDifferentYear(1),
|
|
581
|
-
|
|
583
|
+
E[this._language.current],
|
|
582
584
|
this._nextYearDisabled()
|
|
583
585
|
)}
|
|
584
586
|
</div>
|
|
@@ -671,14 +673,14 @@ let d = class extends P(M) {
|
|
|
671
673
|
${this._getArrow(
|
|
672
674
|
"left",
|
|
673
675
|
() => this._goToDifferentYearRange(-l),
|
|
674
|
-
|
|
676
|
+
L(l)[this._language.current],
|
|
675
677
|
this._previousYearRangeDisabled()
|
|
676
678
|
)}
|
|
677
679
|
<div class="sbb-calendar__controls-month">${this._createLabelForYearView()}</div>
|
|
678
680
|
${this._getArrow(
|
|
679
681
|
"right",
|
|
680
682
|
() => this._goToDifferentYearRange(l),
|
|
681
|
-
|
|
683
|
+
P(l)[this._language.current],
|
|
682
684
|
this._nextYearRangeDisabled()
|
|
683
685
|
)}
|
|
684
686
|
</div>
|
|
@@ -791,7 +793,7 @@ let d = class extends P(M) {
|
|
|
791
793
|
return o`<div class="sbb-calendar__wrapper">${this._getView}</div>`;
|
|
792
794
|
}
|
|
793
795
|
};
|
|
794
|
-
d.styles =
|
|
796
|
+
d.styles = q;
|
|
795
797
|
d.events = {
|
|
796
798
|
dateSelected: "dateSelected"
|
|
797
799
|
};
|
|
@@ -18,7 +18,6 @@ export declare class SbbCheckboxElement extends SbbCheckboxElement_base {
|
|
|
18
18
|
};
|
|
19
19
|
/** The label position relative to the labelIcon. Defaults to end */
|
|
20
20
|
iconPlacement: SbbIconPlacement;
|
|
21
|
-
constructor();
|
|
22
21
|
protected render(): TemplateResult;
|
|
23
22
|
}
|
|
24
23
|
declare global {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox/checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIjF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox/checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIjF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAMjE,OAAO,0BAA0B,CAAC;;AAElC;;;;;;;;GAQG;AACH,qBAEa,kBAAmB,SAAQ,uBAEvC;IACC,OAAuB,MAAM,EAAE,cAAc,CAAwC;IAErF,gBAAuB,MAAM;;MAElB;IAEX,oEAAoE;IAE7D,aAAa,EAAE,gBAAgB,CAAS;cAE5B,MAAM,IAAI,cAAc;CAuB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,cAAc,EAAE,kBAAkB,CAAC;KACpC;CACF"}
|
|
@@ -24,7 +24,6 @@ export declare class SbbCheckboxGroupElement extends SbbCheckboxGroupElement_bas
|
|
|
24
24
|
/** List of contained checkbox elements. */
|
|
25
25
|
get checkboxes(): (SbbCheckboxElement | SbbCheckboxPanelElement)[];
|
|
26
26
|
private _abort;
|
|
27
|
-
constructor();
|
|
28
27
|
connectedCallback(): void;
|
|
29
28
|
protected willUpdate(changedProperties: PropertyValues<this>): void;
|
|
30
29
|
private _handleKeyDown;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox-group/checkbox-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"checkbox-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox-group/checkbox-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAElF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;;AAIpD;;;;;GAKG;AACH,qBAEa,uBAAwB,SAAQ,4BAA4B;IACvE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,8CAA8C;IACK,QAAQ,UAAS;IAEpE,mCAAmC;IAChB,IAAI,EAAE,eAAe,CAAO;IAE/C,yDAAyD;IAElD,cAAc,CAAC,EAAE,iBAAiB,CAAC;IAE1C,qFAAqF;IAE9E,WAAW,EAAE,cAAc,CAAgB;IAElD,2CAA2C;IAC3C,IAAW,UAAU,IAAI,CAAC,kBAAkB,GAAG,uBAAuB,CAAC,EAAE,CAMxE;IAED,OAAO,CAAC,MAAM,CAAsE;IAEpE,iBAAiB,IAAI,IAAI;cAUtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAc5E,OAAO,CAAC,cAAc;cA0BH,MAAM,IAAI,cAAc;CAU5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { css as h, LitElement as l, html as d } from "lit";
|
|
2
2
|
import { property as s, customElement as p } from "lit/decorators.js";
|
|
3
3
|
import { interactivityChecker as x, isArrowKeyPressed as m, getNextElementIndex as u } from "../core/a11y.js";
|
|
4
|
-
import { SbbConnectedAbortController as k
|
|
4
|
+
import { SbbConnectedAbortController as k } from "../core/controllers.js";
|
|
5
|
+
import { slotState as g } from "../core/decorators.js";
|
|
5
6
|
import { SbbDisabledMixin as f } from "../core/mixins.js";
|
|
6
7
|
const w = h`*,:before,:after{box-sizing:border-box}:host{--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-width: max-content;--sbb-checkbox-group-gap: var(--sbb-spacing-fixed-3x) var(--sbb-spacing-fixed-6x);display:block}:host([orientation=vertical]){--sbb-checkbox-group-orientation: column;--sbb-checkbox-group-width: 100%;--sbb-checkbox-group-checkbox-width: 100%}:host([orientation=vertical]) ::slotted(sbb-checkbox-panel){width:100%}:host([data-has-panel]){--sbb-checkbox-group-width: 100%}:host([data-has-panel]) ::slotted(sbb-checkbox-panel){flex:auto}:host([data-has-panel][orientation=vertical]){--sbb-checkbox-group-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x)}@media (min-width: 0rem){:host([orientation=vertical][horizontal-from=zero]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=zero]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=zero]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}@media (min-width: 22.5rem){:host([orientation=vertical][horizontal-from=micro]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=micro]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=micro]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}@media (min-width: 37.5rem){:host([orientation=vertical][horizontal-from=small]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=small]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=small]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}@media (min-width: 52.5rem){:host([orientation=vertical][horizontal-from=medium]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=medium]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=medium]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}@media (min-width: 64rem){:host([orientation=vertical][horizontal-from=large]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=large]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=large]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}@media (min-width: 80rem){:host([orientation=vertical][horizontal-from=wide]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=wide]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=wide]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}@media (min-width: 90rem){:host([orientation=vertical][horizontal-from=ultra]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto}:host([orientation=vertical][horizontal-from=ultra]) ::slotted(sbb-checkbox-panel){width:initial}:host([orientation=vertical][horizontal-from=ultra]:not([data-has-panel])){--sbb-checkbox-group-width: max-content}}.sbb-checkbox-group{display:flex;flex-direction:var(--sbb-checkbox-group-orientation);gap:var(--sbb-checkbox-group-gap);align-items:flex-start;width:var(--sbb-checkbox-group-width)}.sbb-checkbox-group__error{display:inline-block;margin-block-start:var(--sbb-spacing-fixed-1x)}:host(:not([data-slot-names~=error])) .sbb-checkbox-group__error{display:none}::slotted(sbb-checkbox){width:var(--sbb-checkbox-group-checkbox-width)}`;
|
|
7
8
|
var v = Object.defineProperty, z = Object.getOwnPropertyDescriptor, b = (t, o, e, r) => {
|
|
@@ -11,7 +12,7 @@ var v = Object.defineProperty, z = Object.getOwnPropertyDescriptor, b = (t, o, e
|
|
|
11
12
|
};
|
|
12
13
|
let a = class extends f(l) {
|
|
13
14
|
constructor() {
|
|
14
|
-
super(), this.required = !1, this.size = "m", this.orientation = "horizontal", this._abort = new k(this)
|
|
15
|
+
super(...arguments), this.required = !1, this.size = "m", this.orientation = "horizontal", this._abort = new k(this);
|
|
15
16
|
}
|
|
16
17
|
/** List of contained checkbox elements. */
|
|
17
18
|
get checkboxes() {
|
|
@@ -79,7 +80,8 @@ b([
|
|
|
79
80
|
s({ reflect: !0 })
|
|
80
81
|
], a.prototype, "orientation", 2);
|
|
81
82
|
a = b([
|
|
82
|
-
p("sbb-checkbox-group")
|
|
83
|
+
p("sbb-checkbox-group"),
|
|
84
|
+
g()
|
|
83
85
|
], a);
|
|
84
86
|
export {
|
|
85
87
|
a as SbbCheckboxGroupElement
|
|
@@ -28,7 +28,6 @@ export declare class SbbCheckboxPanelElement extends SbbCheckboxPanelElement_bas
|
|
|
28
28
|
* in relation to the parent selection panel changes.
|
|
29
29
|
*/
|
|
30
30
|
protected stateChange: EventEmitter<SbbCheckboxPanelStateChange>;
|
|
31
|
-
constructor();
|
|
32
31
|
protected willUpdate(changedProperties: PropertyValues<this>): Promise<void>;
|
|
33
32
|
protected render(): TemplateResult;
|
|
34
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox-panel.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox-panel/checkbox-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAIb,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,KAAK,EACV,qBAAqB,EACrB,sBAAsB,EACtB,cAAc,EACf,MAAM,gCAAgC,CAAC;AAIxC,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAElC,MAAM,MAAM,2BAA2B,GAAG,OAAO,CAC/C,cAAc,EACd,sBAAsB,GAAG,qBAAqB,CAC/C,CAAC;;AAEF;;;;;;;;;;GAUG;AACH,
|
|
1
|
+
{"version":3,"file":"checkbox-panel.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox-panel/checkbox-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAIb,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,KAAK,EACV,qBAAqB,EACrB,sBAAsB,EACtB,cAAc,EACf,MAAM,gCAAgC,CAAC;AAIxC,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAElC,MAAM,MAAM,2BAA2B,GAAG,OAAO,CAC/C,cAAc,EACd,sBAAsB,GAAG,qBAAqB,CAC/C,CAAC;;AAEF;;;;;;;;;;GAUG;AACH,qBAEa,uBAAwB,SAAQ,4BAE5C;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;IAGxF,gBAAuB,MAAM;;;;MAIlB;IAEX;;;;OAIG;IACH,SAAS,CAAC,WAAW,EAAE,YAAY,CAAC,2BAA2B,CAAC,CAI9D;cAEuB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAkBxE,MAAM,IAAI,cAAc;CA8B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}
|
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
import { LitElement as o, html as c, nothing as h } from "lit";
|
|
2
|
-
import { customElement as
|
|
3
|
-
import {
|
|
2
|
+
import { customElement as d } from "lit/decorators.js";
|
|
3
|
+
import { slotState as r } from "../core/decorators.js";
|
|
4
4
|
import { EventEmitter as p } from "../core/eventing.js";
|
|
5
5
|
import { SbbPanelMixin as m, SbbUpdateSchedulerMixin as x, panelCommonStyle as f } from "../core/mixins.js";
|
|
6
|
-
import { SbbCheckboxCommonElementMixin as
|
|
6
|
+
import { SbbCheckboxCommonElementMixin as k, checkboxCommonStyle as u } from "./common.js";
|
|
7
7
|
import "../screen-reader-only.js";
|
|
8
8
|
import "../visual-checkbox.js";
|
|
9
|
-
var
|
|
9
|
+
var C = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, g = (e, a, i, n) => {
|
|
10
10
|
for (var s = n > 1 ? void 0 : n ? _(a, i) : a, b = e.length - 1, l; b >= 0; b--)
|
|
11
11
|
(l = e[b]) && (s = (n ? l(a, i, s) : l(s)) || s);
|
|
12
|
-
return n && s &&
|
|
12
|
+
return n && s && C(a, i, s), s;
|
|
13
13
|
};
|
|
14
14
|
let t = class extends m(
|
|
15
|
-
|
|
15
|
+
k(x(o))
|
|
16
16
|
) {
|
|
17
17
|
constructor() {
|
|
18
|
-
super(), this.stateChange = new p(
|
|
18
|
+
super(...arguments), this.stateChange = new p(
|
|
19
19
|
this,
|
|
20
20
|
t.events.stateChange,
|
|
21
21
|
{ bubbles: !0 }
|
|
22
|
-
)
|
|
22
|
+
);
|
|
23
23
|
}
|
|
24
24
|
async willUpdate(e) {
|
|
25
25
|
super.willUpdate(e), e.has("checked") && (this.toggleAttribute("data-checked", this.checked), this.checked !== e.get("checked") && this.stateChange.emit({ type: "checked", checked: this.checked })), e.has("disabled") && this.disabled !== e.get("disabled") && this.stateChange.emit({ type: "disabled", disabled: this.disabled });
|
|
@@ -53,14 +53,15 @@ let t = class extends m(
|
|
|
53
53
|
`;
|
|
54
54
|
}
|
|
55
55
|
};
|
|
56
|
-
t.styles = [
|
|
56
|
+
t.styles = [u, f];
|
|
57
57
|
t.events = {
|
|
58
58
|
didChange: "didChange",
|
|
59
59
|
stateChange: "stateChange",
|
|
60
60
|
panelConnected: "panelConnected"
|
|
61
61
|
};
|
|
62
|
-
t =
|
|
63
|
-
|
|
62
|
+
t = g([
|
|
63
|
+
d("sbb-checkbox-panel"),
|
|
64
|
+
r()
|
|
64
65
|
], t);
|
|
65
66
|
export {
|
|
66
67
|
t as SbbCheckboxPanelElement
|
package/checkbox/checkbox.js
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { css as i, LitElement as r, html as h } from "lit";
|
|
2
2
|
import { property as p, customElement as m } from "lit/decorators.js";
|
|
3
|
-
import {
|
|
4
|
-
import { SbbIconNameMixin as
|
|
3
|
+
import { slotState as u } from "../core/decorators.js";
|
|
4
|
+
import { SbbIconNameMixin as f } from "../icon.js";
|
|
5
5
|
import { SbbCheckboxCommonElementMixin as d, checkboxCommonStyle as x } from "./common.js";
|
|
6
6
|
import "../visual-checkbox.js";
|
|
7
7
|
const _ = i`:host{outline:none!important;display:inline-block}.sbb-checkbox__label--icon{color:var(--sbb-checkbox-label-icon-color)}:host([icon-placement=end]) .sbb-checkbox__label--icon{margin-inline-start:auto}:host(:not([icon-name],[data-slot-names~=icon])) .sbb-checkbox__label--icon{display:none}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-checkbox-wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset))}:host([icon-placement=start]) .sbb-checkbox__label{flex-direction:row-reverse;justify-content:flex-end}:host([icon-placement=end]) .sbb-checkbox__label{justify-content:flex-start;flex-grow:1}`;
|
|
8
|
-
var k = Object.defineProperty, v = Object.getOwnPropertyDescriptor,
|
|
9
|
-
for (var e =
|
|
10
|
-
(b =
|
|
11
|
-
return
|
|
8
|
+
var k = Object.defineProperty, v = Object.getOwnPropertyDescriptor, l = (a, s, t, c) => {
|
|
9
|
+
for (var e = c > 1 ? void 0 : c ? v(s, t) : s, n = a.length - 1, b; n >= 0; n--)
|
|
10
|
+
(b = a[n]) && (e = (c ? b(s, t, e) : b(e)) || e);
|
|
11
|
+
return c && e && k(s, t, e), e;
|
|
12
12
|
};
|
|
13
13
|
let o = class extends d(
|
|
14
|
-
|
|
14
|
+
f(r)
|
|
15
15
|
) {
|
|
16
16
|
constructor() {
|
|
17
|
-
super(), this.iconPlacement = "end"
|
|
17
|
+
super(...arguments), this.iconPlacement = "end";
|
|
18
18
|
}
|
|
19
19
|
render() {
|
|
20
20
|
return h`
|
|
@@ -44,11 +44,12 @@ o.styles = [x, _];
|
|
|
44
44
|
o.events = {
|
|
45
45
|
didChange: "didChange"
|
|
46
46
|
};
|
|
47
|
-
|
|
47
|
+
l([
|
|
48
48
|
p({ attribute: "icon-placement", reflect: !0 })
|
|
49
49
|
], o.prototype, "iconPlacement", 2);
|
|
50
|
-
o =
|
|
51
|
-
m("sbb-checkbox")
|
|
50
|
+
o = l([
|
|
51
|
+
m("sbb-checkbox"),
|
|
52
|
+
u()
|
|
52
53
|
], o);
|
|
53
54
|
export {
|
|
54
55
|
o as SbbCheckboxElement
|