@sbb-esta/lyne-elements-dev 4.9.0-dev.1774507634 → 4.9.0-dev.1774514108
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/{compact-paginator.component-JM9tD9ys.js → compact-paginator.component-CrdZ6dqt.js} +2 -4
- package/core/styles/core.scss +8 -0
- package/core.css +13 -0
- package/custom-elements.json +170 -170
- package/development/compact-paginator.component-BgdCSnNV.js +86 -0
- package/development/paginator/compact-paginator/compact-paginator.component.d.ts.map +1 -1
- package/development/paginator/compact-paginator/compact-paginator.component.js +1 -1
- package/development/paginator/compact-paginator.js +1 -1
- package/development/paginator/paginator/paginator.component.js +1 -1
- package/development/paginator/paginator.js +1 -1
- package/development/paginator.component-C03vfQ7J.js +470 -0
- package/development/paginator.js +2 -2
- package/development/paginator.pure.js +2 -2
- package/off-brand-theme.css +13 -0
- package/package.json +2 -2
- package/paginator/compact-paginator/compact-paginator.component.js +1 -1
- package/paginator/compact-paginator.js +1 -1
- package/paginator/paginator/paginator.component.js +1 -1
- package/paginator/paginator.js +1 -1
- package/paginator.component-BoVsXIBx.js +206 -0
- package/paginator.js +2 -2
- package/paginator.pure.js +2 -2
- package/safety-theme.css +13 -0
- package/standard-theme.css +13 -0
- package/development/compact-paginator.component-BSTPWGJx.js +0 -96
- package/development/paginator.component-DT-sZuFS.js +0 -492
- package/paginator.component-nXF_Zbze.js +0 -206
|
@@ -7,7 +7,7 @@ import "./screen-reader-only.js";
|
|
|
7
7
|
import { styleMap as o } from "lit/directives/style-map.js";
|
|
8
8
|
import { SbbPaginatorCommonElementMixin as s } from "./paginator/common/paginator-common.js";
|
|
9
9
|
//#region src/elements/paginator/compact-paginator/compact-paginator.scss?lit&inline
|
|
10
|
-
var c = e`:host{display:
|
|
10
|
+
var c = e`:host{display:flex;gap:var(--sbb-compact-paginator-gap);justify-content:var(--sbb-paginator-compact-justify-content, start);min-height:var(--sbb-compact-paginator-height)}:host([size=s]){--sbb-compact-paginator-height: var(--sbb-size-element-xs)}:host([size=m]){--sbb-compact-paginator-height: var(--sbb-size-element-m)}:host([negative]){--sbb-compact-paginator-color: var(--sbb-color-5)}:host([pager-position=end]){--sbb-paginator-compact-justify-content: end}.sbb-paginator__pages{font-size:var(--sbb-compact-paginator-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);display:flex;align-items:center;justify-content:center;gap:var(--sbb-compact-paginator-pages-gap);color:var(--sbb-compact-paginator-color)}.sbb-compact-paginator__divider{height:1rem}`, l = class extends s(n) {
|
|
11
11
|
static {
|
|
12
12
|
this.elementName = "sbb-compact-paginator";
|
|
13
13
|
}
|
|
@@ -35,9 +35,7 @@ var c = e`:host{display:block;--sbb-compact-paginator-height: var(--sbb-size-ele
|
|
|
35
35
|
}
|
|
36
36
|
renderPaginator() {
|
|
37
37
|
return t`
|
|
38
|
-
|
|
39
|
-
${this.pagerPosition === "start" ? t`${this.renderPrevNextButtons()} ${this._renderPageNumbers()}` : t`${this._renderPageNumbers()} ${this.renderPrevNextButtons()}`}
|
|
40
|
-
</div>
|
|
38
|
+
${this.pagerPosition === "start" ? t`${this.renderPrevNextButtons()} ${this._renderPageNumbers()}` : t`${this._renderPageNumbers()} ${this.renderPrevNextButtons()}`}
|
|
41
39
|
`;
|
|
42
40
|
}
|
|
43
41
|
};
|
package/core/styles/core.scss
CHANGED
|
@@ -175,6 +175,12 @@ $theme: 'standard' !default;
|
|
|
175
175
|
@use '../../option/optgroup/optgroup.global' as optgroup with (
|
|
176
176
|
$theme: $theme
|
|
177
177
|
);
|
|
178
|
+
@use '../../paginator/paginator/paginator.global' as paginator with (
|
|
179
|
+
$theme: $theme
|
|
180
|
+
);
|
|
181
|
+
@use '../../paginator/compact-paginator/compact-paginator.global' as compact-paginator with (
|
|
182
|
+
$theme: $theme
|
|
183
|
+
);
|
|
178
184
|
@use '../../popover/popover.global' as popover-component with (
|
|
179
185
|
$theme: $theme
|
|
180
186
|
);
|
|
@@ -270,6 +276,8 @@ $theme: 'standard' !default;
|
|
|
270
276
|
@include option-hint.base;
|
|
271
277
|
@include optgroup.base;
|
|
272
278
|
@include overlay.options-panel-overlay-variables--global($theme);
|
|
279
|
+
@include paginator.base;
|
|
280
|
+
@include compact-paginator.base;
|
|
273
281
|
@include popover-component.base;
|
|
274
282
|
@include radio-button-common.base;
|
|
275
283
|
@include selection-group.base;
|
package/core.css
CHANGED
|
@@ -1588,6 +1588,19 @@ slot[name=error]::slotted(*) {
|
|
|
1588
1588
|
--sbb-options-panel-background-color: var(--sbb-background-color-1);
|
|
1589
1589
|
--sbb-options-panel-divider-margin-block: var(--sbb-spacing-fixed-3x);
|
|
1590
1590
|
--sbb-options-panel-padding-block: var(--sbb-spacing-fixed-2x);
|
|
1591
|
+
--sbb-paginator-height: var(--sbb-size-element-m);
|
|
1592
|
+
--sbb-paginator-page-color: var(--sbb-color-metal);
|
|
1593
|
+
--sbb-paginator-page-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
|
|
1594
|
+
--sbb-paginator-page-border-width: 0;
|
|
1595
|
+
--sbb-paginator-page-cursor: var(--sbb-cursor-pointer);
|
|
1596
|
+
--sbb-paginator-animation-easing: var(--sbb-animation-easing);
|
|
1597
|
+
--sbb-paginator-font-size: var(--sbb-text-font-size-s);
|
|
1598
|
+
--sbb-compact-paginator-height: var(--sbb-size-element-m);
|
|
1599
|
+
--sbb-compact-paginator-color: var(--sbb-color-metal);
|
|
1600
|
+
--sbb-compact-paginator-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
|
|
1601
|
+
--sbb-compact-paginator-font-size: var(--sbb-text-font-size-m);
|
|
1602
|
+
--sbb-compact-paginator-gap: var(--sbb-spacing-fixed-5x);
|
|
1603
|
+
--sbb-compact-paginator-pages-gap: var(--sbb-spacing-fixed-2x);
|
|
1591
1604
|
--sbb-popover-arrow-size: var(--sbb-spacing-fixed-4x);
|
|
1592
1605
|
--sbb-popover-max-width: calc(100% - var(--sbb-spacing-fixed-2x));
|
|
1593
1606
|
--sbb-popover-border-radius: var(--sbb-border-radius-8x);
|
package/custom-elements.json
CHANGED
|
@@ -108913,6 +108913,176 @@
|
|
|
108913
108913
|
}
|
|
108914
108914
|
]
|
|
108915
108915
|
},
|
|
108916
|
+
{
|
|
108917
|
+
"kind": "javascript-module",
|
|
108918
|
+
"path": "navigation/common/navigation-action-common.js",
|
|
108919
|
+
"declarations": [
|
|
108920
|
+
{
|
|
108921
|
+
"kind": "class",
|
|
108922
|
+
"description": "",
|
|
108923
|
+
"name": "SbbNavigationActionCommonElementMixinType",
|
|
108924
|
+
"members": [
|
|
108925
|
+
{
|
|
108926
|
+
"kind": "field",
|
|
108927
|
+
"name": "size",
|
|
108928
|
+
"type": {
|
|
108929
|
+
"text": "SbbNavigationActionSize"
|
|
108930
|
+
},
|
|
108931
|
+
"privacy": "public"
|
|
108932
|
+
},
|
|
108933
|
+
{
|
|
108934
|
+
"kind": "field",
|
|
108935
|
+
"name": "marker",
|
|
108936
|
+
"type": {
|
|
108937
|
+
"text": "SbbNavigationMarkerElement | null"
|
|
108938
|
+
},
|
|
108939
|
+
"privacy": "public",
|
|
108940
|
+
"readonly": true
|
|
108941
|
+
},
|
|
108942
|
+
{
|
|
108943
|
+
"kind": "field",
|
|
108944
|
+
"name": "section",
|
|
108945
|
+
"type": {
|
|
108946
|
+
"text": "SbbNavigationSectionElement | null"
|
|
108947
|
+
},
|
|
108948
|
+
"privacy": "public",
|
|
108949
|
+
"readonly": true
|
|
108950
|
+
},
|
|
108951
|
+
{
|
|
108952
|
+
"kind": "field",
|
|
108953
|
+
"name": "connectedSection",
|
|
108954
|
+
"type": {
|
|
108955
|
+
"text": "SbbNavigationSectionElement | undefined"
|
|
108956
|
+
},
|
|
108957
|
+
"privacy": "public"
|
|
108958
|
+
}
|
|
108959
|
+
]
|
|
108960
|
+
},
|
|
108961
|
+
{
|
|
108962
|
+
"kind": "mixin",
|
|
108963
|
+
"description": "",
|
|
108964
|
+
"name": "SbbNavigationActionCommonElementMixin",
|
|
108965
|
+
"members": [
|
|
108966
|
+
{
|
|
108967
|
+
"kind": "field",
|
|
108968
|
+
"name": "styles",
|
|
108969
|
+
"type": {
|
|
108970
|
+
"text": "CSSResultGroup"
|
|
108971
|
+
},
|
|
108972
|
+
"privacy": "public",
|
|
108973
|
+
"static": true,
|
|
108974
|
+
"default": "[boxSizingStyles, style]"
|
|
108975
|
+
},
|
|
108976
|
+
{
|
|
108977
|
+
"kind": "field",
|
|
108978
|
+
"name": "size",
|
|
108979
|
+
"type": {
|
|
108980
|
+
"text": "SbbNavigationActionSize"
|
|
108981
|
+
},
|
|
108982
|
+
"privacy": "public",
|
|
108983
|
+
"description": "Action size variant, either s, m or l.",
|
|
108984
|
+
"default": "'l' / 's' (lean)",
|
|
108985
|
+
"attribute": "size",
|
|
108986
|
+
"reflects": true
|
|
108987
|
+
},
|
|
108988
|
+
{
|
|
108989
|
+
"kind": "field",
|
|
108990
|
+
"name": "connectedSection",
|
|
108991
|
+
"type": {
|
|
108992
|
+
"text": "SbbNavigationSectionElement | undefined"
|
|
108993
|
+
},
|
|
108994
|
+
"privacy": "public",
|
|
108995
|
+
"description": "The section that is being controlled by the action, if any."
|
|
108996
|
+
},
|
|
108997
|
+
{
|
|
108998
|
+
"kind": "field",
|
|
108999
|
+
"name": "marker",
|
|
109000
|
+
"type": {
|
|
109001
|
+
"text": "SbbNavigationMarkerElement | null"
|
|
109002
|
+
},
|
|
109003
|
+
"privacy": "public",
|
|
109004
|
+
"description": "The navigation marker in which the action is nested.",
|
|
109005
|
+
"readonly": true
|
|
109006
|
+
},
|
|
109007
|
+
{
|
|
109008
|
+
"kind": "field",
|
|
109009
|
+
"name": "section",
|
|
109010
|
+
"type": {
|
|
109011
|
+
"text": "SbbNavigationSectionElement | null"
|
|
109012
|
+
},
|
|
109013
|
+
"privacy": "public",
|
|
109014
|
+
"description": "The section in which the action is nested.",
|
|
109015
|
+
"readonly": true
|
|
109016
|
+
},
|
|
109017
|
+
{
|
|
109018
|
+
"kind": "field",
|
|
109019
|
+
"name": "_navigationMarker",
|
|
109020
|
+
"type": {
|
|
109021
|
+
"text": "SbbNavigationMarkerElement | null"
|
|
109022
|
+
},
|
|
109023
|
+
"privacy": "private",
|
|
109024
|
+
"default": "null"
|
|
109025
|
+
},
|
|
109026
|
+
{
|
|
109027
|
+
"kind": "field",
|
|
109028
|
+
"name": "_navigationSection",
|
|
109029
|
+
"type": {
|
|
109030
|
+
"text": "SbbNavigationSectionElement | null"
|
|
109031
|
+
},
|
|
109032
|
+
"privacy": "private",
|
|
109033
|
+
"default": "null"
|
|
109034
|
+
},
|
|
109035
|
+
{
|
|
109036
|
+
"kind": "method",
|
|
109037
|
+
"name": "renderTemplate",
|
|
109038
|
+
"privacy": "protected",
|
|
109039
|
+
"return": {
|
|
109040
|
+
"type": {
|
|
109041
|
+
"text": "TemplateResult"
|
|
109042
|
+
}
|
|
109043
|
+
}
|
|
109044
|
+
}
|
|
109045
|
+
],
|
|
109046
|
+
"attributes": [
|
|
109047
|
+
{
|
|
109048
|
+
"name": "size",
|
|
109049
|
+
"type": {
|
|
109050
|
+
"text": "SbbNavigationActionSize"
|
|
109051
|
+
},
|
|
109052
|
+
"description": "Action size variant, either s, m or l.",
|
|
109053
|
+
"default": "'l' / 's' (lean)",
|
|
109054
|
+
"fieldName": "size"
|
|
109055
|
+
}
|
|
109056
|
+
],
|
|
109057
|
+
"parameters": [
|
|
109058
|
+
{
|
|
109059
|
+
"name": "superClass",
|
|
109060
|
+
"type": {
|
|
109061
|
+
"text": "T"
|
|
109062
|
+
}
|
|
109063
|
+
}
|
|
109064
|
+
]
|
|
109065
|
+
}
|
|
109066
|
+
],
|
|
109067
|
+
"exports": [
|
|
109068
|
+
{
|
|
109069
|
+
"kind": "js",
|
|
109070
|
+
"name": "SbbNavigationActionCommonElementMixinType",
|
|
109071
|
+
"declaration": {
|
|
109072
|
+
"name": "SbbNavigationActionCommonElementMixinType",
|
|
109073
|
+
"module": "navigation/common/navigation-action-common.js"
|
|
109074
|
+
}
|
|
109075
|
+
},
|
|
109076
|
+
{
|
|
109077
|
+
"kind": "js",
|
|
109078
|
+
"name": "SbbNavigationActionCommonElementMixin",
|
|
109079
|
+
"declaration": {
|
|
109080
|
+
"name": "SbbNavigationActionCommonElementMixin",
|
|
109081
|
+
"module": "navigation/common/navigation-action-common.js"
|
|
109082
|
+
}
|
|
109083
|
+
}
|
|
109084
|
+
]
|
|
109085
|
+
},
|
|
108916
109086
|
{
|
|
108917
109087
|
"kind": "javascript-module",
|
|
108918
109088
|
"path": "mini-calendar/mini-calendar-month/mini-calendar-month.component.js",
|
|
@@ -109131,176 +109301,6 @@
|
|
|
109131
109301
|
}
|
|
109132
109302
|
]
|
|
109133
109303
|
},
|
|
109134
|
-
{
|
|
109135
|
-
"kind": "javascript-module",
|
|
109136
|
-
"path": "navigation/common/navigation-action-common.js",
|
|
109137
|
-
"declarations": [
|
|
109138
|
-
{
|
|
109139
|
-
"kind": "class",
|
|
109140
|
-
"description": "",
|
|
109141
|
-
"name": "SbbNavigationActionCommonElementMixinType",
|
|
109142
|
-
"members": [
|
|
109143
|
-
{
|
|
109144
|
-
"kind": "field",
|
|
109145
|
-
"name": "size",
|
|
109146
|
-
"type": {
|
|
109147
|
-
"text": "SbbNavigationActionSize"
|
|
109148
|
-
},
|
|
109149
|
-
"privacy": "public"
|
|
109150
|
-
},
|
|
109151
|
-
{
|
|
109152
|
-
"kind": "field",
|
|
109153
|
-
"name": "marker",
|
|
109154
|
-
"type": {
|
|
109155
|
-
"text": "SbbNavigationMarkerElement | null"
|
|
109156
|
-
},
|
|
109157
|
-
"privacy": "public",
|
|
109158
|
-
"readonly": true
|
|
109159
|
-
},
|
|
109160
|
-
{
|
|
109161
|
-
"kind": "field",
|
|
109162
|
-
"name": "section",
|
|
109163
|
-
"type": {
|
|
109164
|
-
"text": "SbbNavigationSectionElement | null"
|
|
109165
|
-
},
|
|
109166
|
-
"privacy": "public",
|
|
109167
|
-
"readonly": true
|
|
109168
|
-
},
|
|
109169
|
-
{
|
|
109170
|
-
"kind": "field",
|
|
109171
|
-
"name": "connectedSection",
|
|
109172
|
-
"type": {
|
|
109173
|
-
"text": "SbbNavigationSectionElement | undefined"
|
|
109174
|
-
},
|
|
109175
|
-
"privacy": "public"
|
|
109176
|
-
}
|
|
109177
|
-
]
|
|
109178
|
-
},
|
|
109179
|
-
{
|
|
109180
|
-
"kind": "mixin",
|
|
109181
|
-
"description": "",
|
|
109182
|
-
"name": "SbbNavigationActionCommonElementMixin",
|
|
109183
|
-
"members": [
|
|
109184
|
-
{
|
|
109185
|
-
"kind": "field",
|
|
109186
|
-
"name": "styles",
|
|
109187
|
-
"type": {
|
|
109188
|
-
"text": "CSSResultGroup"
|
|
109189
|
-
},
|
|
109190
|
-
"privacy": "public",
|
|
109191
|
-
"static": true,
|
|
109192
|
-
"default": "[boxSizingStyles, style]"
|
|
109193
|
-
},
|
|
109194
|
-
{
|
|
109195
|
-
"kind": "field",
|
|
109196
|
-
"name": "size",
|
|
109197
|
-
"type": {
|
|
109198
|
-
"text": "SbbNavigationActionSize"
|
|
109199
|
-
},
|
|
109200
|
-
"privacy": "public",
|
|
109201
|
-
"description": "Action size variant, either s, m or l.",
|
|
109202
|
-
"default": "'l' / 's' (lean)",
|
|
109203
|
-
"attribute": "size",
|
|
109204
|
-
"reflects": true
|
|
109205
|
-
},
|
|
109206
|
-
{
|
|
109207
|
-
"kind": "field",
|
|
109208
|
-
"name": "connectedSection",
|
|
109209
|
-
"type": {
|
|
109210
|
-
"text": "SbbNavigationSectionElement | undefined"
|
|
109211
|
-
},
|
|
109212
|
-
"privacy": "public",
|
|
109213
|
-
"description": "The section that is being controlled by the action, if any."
|
|
109214
|
-
},
|
|
109215
|
-
{
|
|
109216
|
-
"kind": "field",
|
|
109217
|
-
"name": "marker",
|
|
109218
|
-
"type": {
|
|
109219
|
-
"text": "SbbNavigationMarkerElement | null"
|
|
109220
|
-
},
|
|
109221
|
-
"privacy": "public",
|
|
109222
|
-
"description": "The navigation marker in which the action is nested.",
|
|
109223
|
-
"readonly": true
|
|
109224
|
-
},
|
|
109225
|
-
{
|
|
109226
|
-
"kind": "field",
|
|
109227
|
-
"name": "section",
|
|
109228
|
-
"type": {
|
|
109229
|
-
"text": "SbbNavigationSectionElement | null"
|
|
109230
|
-
},
|
|
109231
|
-
"privacy": "public",
|
|
109232
|
-
"description": "The section in which the action is nested.",
|
|
109233
|
-
"readonly": true
|
|
109234
|
-
},
|
|
109235
|
-
{
|
|
109236
|
-
"kind": "field",
|
|
109237
|
-
"name": "_navigationMarker",
|
|
109238
|
-
"type": {
|
|
109239
|
-
"text": "SbbNavigationMarkerElement | null"
|
|
109240
|
-
},
|
|
109241
|
-
"privacy": "private",
|
|
109242
|
-
"default": "null"
|
|
109243
|
-
},
|
|
109244
|
-
{
|
|
109245
|
-
"kind": "field",
|
|
109246
|
-
"name": "_navigationSection",
|
|
109247
|
-
"type": {
|
|
109248
|
-
"text": "SbbNavigationSectionElement | null"
|
|
109249
|
-
},
|
|
109250
|
-
"privacy": "private",
|
|
109251
|
-
"default": "null"
|
|
109252
|
-
},
|
|
109253
|
-
{
|
|
109254
|
-
"kind": "method",
|
|
109255
|
-
"name": "renderTemplate",
|
|
109256
|
-
"privacy": "protected",
|
|
109257
|
-
"return": {
|
|
109258
|
-
"type": {
|
|
109259
|
-
"text": "TemplateResult"
|
|
109260
|
-
}
|
|
109261
|
-
}
|
|
109262
|
-
}
|
|
109263
|
-
],
|
|
109264
|
-
"attributes": [
|
|
109265
|
-
{
|
|
109266
|
-
"name": "size",
|
|
109267
|
-
"type": {
|
|
109268
|
-
"text": "SbbNavigationActionSize"
|
|
109269
|
-
},
|
|
109270
|
-
"description": "Action size variant, either s, m or l.",
|
|
109271
|
-
"default": "'l' / 's' (lean)",
|
|
109272
|
-
"fieldName": "size"
|
|
109273
|
-
}
|
|
109274
|
-
],
|
|
109275
|
-
"parameters": [
|
|
109276
|
-
{
|
|
109277
|
-
"name": "superClass",
|
|
109278
|
-
"type": {
|
|
109279
|
-
"text": "T"
|
|
109280
|
-
}
|
|
109281
|
-
}
|
|
109282
|
-
]
|
|
109283
|
-
}
|
|
109284
|
-
],
|
|
109285
|
-
"exports": [
|
|
109286
|
-
{
|
|
109287
|
-
"kind": "js",
|
|
109288
|
-
"name": "SbbNavigationActionCommonElementMixinType",
|
|
109289
|
-
"declaration": {
|
|
109290
|
-
"name": "SbbNavigationActionCommonElementMixinType",
|
|
109291
|
-
"module": "navigation/common/navigation-action-common.js"
|
|
109292
|
-
}
|
|
109293
|
-
},
|
|
109294
|
-
{
|
|
109295
|
-
"kind": "js",
|
|
109296
|
-
"name": "SbbNavigationActionCommonElementMixin",
|
|
109297
|
-
"declaration": {
|
|
109298
|
-
"name": "SbbNavigationActionCommonElementMixin",
|
|
109299
|
-
"module": "navigation/common/navigation-action-common.js"
|
|
109300
|
-
}
|
|
109301
|
-
}
|
|
109302
|
-
]
|
|
109303
|
-
},
|
|
109304
109304
|
{
|
|
109305
109305
|
"kind": "javascript-module",
|
|
109306
109306
|
"path": "navigation/navigation/navigation.component.js",
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { css, html } from "lit";
|
|
2
|
+
import { SbbElement } from "./core/base-elements.js";
|
|
3
|
+
import { boxSizingStyles } from "./core/styles.js";
|
|
4
|
+
import { i18nPage, i18nPaginatorOf } from "./core/i18n.js";
|
|
5
|
+
import "./divider.js";
|
|
6
|
+
import "./screen-reader-only.js";
|
|
7
|
+
import { styleMap } from "lit/directives/style-map.js";
|
|
8
|
+
import { SbbPaginatorCommonElementMixin } from "./paginator/common/paginator-common.js";
|
|
9
|
+
//#region src/elements/paginator/compact-paginator/compact-paginator.scss?lit&inline
|
|
10
|
+
var compact_paginator_default = css`:host {
|
|
11
|
+
display: flex;
|
|
12
|
+
gap: var(--sbb-compact-paginator-gap);
|
|
13
|
+
justify-content: var(--sbb-paginator-compact-justify-content, start);
|
|
14
|
+
min-height: var(--sbb-compact-paginator-height);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
:host([size=s]) {
|
|
18
|
+
--sbb-compact-paginator-height: var(--sbb-size-element-xs);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
:host([size=m]) {
|
|
22
|
+
--sbb-compact-paginator-height: var(--sbb-size-element-m);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
:host([negative]) {
|
|
26
|
+
--sbb-compact-paginator-color: var(--sbb-color-5);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
:host([pager-position=end]) {
|
|
30
|
+
--sbb-paginator-compact-justify-content: end;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.sbb-paginator__pages {
|
|
34
|
+
font-size: var(--sbb-compact-paginator-font-size);
|
|
35
|
+
letter-spacing: var(--sbb-typo-letter-spacing-text);
|
|
36
|
+
display: flex;
|
|
37
|
+
align-items: center;
|
|
38
|
+
justify-content: center;
|
|
39
|
+
gap: var(--sbb-compact-paginator-pages-gap);
|
|
40
|
+
color: var(--sbb-compact-paginator-color);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.sbb-compact-paginator__divider {
|
|
44
|
+
height: 1rem;
|
|
45
|
+
}`;
|
|
46
|
+
//#endregion
|
|
47
|
+
//#region src/elements/paginator/compact-paginator/compact-paginator.component.ts
|
|
48
|
+
/**
|
|
49
|
+
* It displays a paginator component in compact mode.
|
|
50
|
+
*/
|
|
51
|
+
var SbbCompactPaginatorElement = class extends SbbPaginatorCommonElementMixin(SbbElement) {
|
|
52
|
+
static {
|
|
53
|
+
this.elementName = "sbb-compact-paginator";
|
|
54
|
+
}
|
|
55
|
+
static {
|
|
56
|
+
this.styles = [boxSizingStyles, compact_paginator_default];
|
|
57
|
+
}
|
|
58
|
+
static {
|
|
59
|
+
this.events = { page: "page" };
|
|
60
|
+
}
|
|
61
|
+
_renderPageNumbers() {
|
|
62
|
+
return html`
|
|
63
|
+
<span class="sbb-paginator__pages" aria-hidden="true"
|
|
64
|
+
>${this.pageIndex + 1}<sbb-divider
|
|
65
|
+
orientation="vertical"
|
|
66
|
+
class="sbb-compact-paginator__divider"
|
|
67
|
+
style=${styleMap({ "--sbb-divider-color": "currentcolor" })}
|
|
68
|
+
?negative=${this.negative}
|
|
69
|
+
></sbb-divider
|
|
70
|
+
>${this.numberOfPages()}</span
|
|
71
|
+
>
|
|
72
|
+
<sbb-screen-reader-only>
|
|
73
|
+
${`${this.accessibilityPageLabel ? this.accessibilityPageLabel : i18nPage[this.language.current]} ${this.pageIndex + 1} ${i18nPaginatorOf[this.language.current]} ${this.numberOfPages()}`}
|
|
74
|
+
</sbb-screen-reader-only>
|
|
75
|
+
`;
|
|
76
|
+
}
|
|
77
|
+
renderPaginator() {
|
|
78
|
+
return html`
|
|
79
|
+
${this.pagerPosition === "start" ? html`${this.renderPrevNextButtons()} ${this._renderPageNumbers()}` : html`${this._renderPageNumbers()} ${this.renderPrevNextButtons()}`}
|
|
80
|
+
`;
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
//#endregion
|
|
84
|
+
export { SbbCompactPaginatorElement as t };
|
|
85
|
+
|
|
86
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tcGFjdC1wYWdpbmF0b3IuY29tcG9uZW50LUJnZENTbk5WLmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9wYWdpbmF0b3IvY29tcGFjdC1wYWdpbmF0b3IvY29tcGFjdC1wYWdpbmF0b3Iuc2Nzcz9saXQmaW5saW5lIiwiLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3BhZ2luYXRvci9jb21wYWN0LXBhZ2luYXRvci9jb21wYWN0LXBhZ2luYXRvci5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICBkaXNwbGF5OiBmbGV4O1xuICBnYXA6IHZhcigtLXNiYi1jb21wYWN0LXBhZ2luYXRvci1nYXApO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHZhcigtLXNiYi1wYWdpbmF0b3ItY29tcGFjdC1qdXN0aWZ5LWNvbnRlbnQsIHN0YXJ0KTtcbiAgbWluLWhlaWdodDogdmFyKC0tc2JiLWNvbXBhY3QtcGFnaW5hdG9yLWhlaWdodCk7XG59XG5cbjpob3N0KFtzaXplPSdzJ10pIHtcbiAgLS1zYmItY29tcGFjdC1wYWdpbmF0b3ItaGVpZ2h0OiB2YXIoLS1zYmItc2l6ZS1lbGVtZW50LXhzKTtcbn1cblxuOmhvc3QoW3NpemU9J20nXSkge1xuICAtLXNiYi1jb21wYWN0LXBhZ2luYXRvci1oZWlnaHQ6IHZhcigtLXNiYi1zaXplLWVsZW1lbnQtbSk7XG59XG5cbjpob3N0KFtuZWdhdGl2ZV0pIHtcbiAgLS1zYmItY29tcGFjdC1wYWdpbmF0b3ItY29sb3I6IHZhcigtLXNiYi1jb2xvci01KTtcbn1cblxuOmhvc3QoW3BhZ2VyLXBvc2l0aW9uPSdlbmQnXSkge1xuICAtLXNiYi1wYWdpbmF0b3ItY29tcGFjdC1qdXN0aWZ5LWNvbnRlbnQ6IGVuZDtcbn1cblxuLnNiYi1wYWdpbmF0b3JfX3BhZ2VzIHtcbiAgZm9udC1zaXplOiB2YXIoLS1zYmItY29tcGFjdC1wYWdpbmF0b3ItZm9udC1zaXplKTtcbiAgbGV0dGVyLXNwYWNpbmc6IHZhcigtLXNiYi10eXBvLWxldHRlci1zcGFjaW5nLXRleHQpO1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgZ2FwOiB2YXIoLS1zYmItY29tcGFjdC1wYWdpbmF0b3ItcGFnZXMtZ2FwKTtcbiAgY29sb3I6IHZhcigtLXNiYi1jb21wYWN0LXBhZ2luYXRvci1jb2xvcik7XG59XG5cbi5zYmItY29tcGFjdC1wYWdpbmF0b3JfX2RpdmlkZXIge1xuICBoZWlnaHQ6ICN7c2JiLnB4LXRvLXJlbS1idWlsZCgxNil9O1xufVxuIiwiaW1wb3J0IHR5cGUgeyBDU1NSZXN1bHRHcm91cCwgVGVtcGxhdGVSZXN1bHQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgaHRtbCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBzdHlsZU1hcCB9IGZyb20gJ2xpdC9kaXJlY3RpdmVzL3N0eWxlLW1hcC5qcyc7XG5cbmltcG9ydCB7IFNiYkVsZW1lbnQgfSBmcm9tICcuLi8uLi9jb3JlL2Jhc2UtZWxlbWVudHMudHMnO1xuaW1wb3J0IHsgaTE4blBhZ2UsIGkxOG5QYWdpbmF0b3JPZiB9IGZyb20gJy4uLy4uL2NvcmUvaTE4bi50cyc7XG5pbXBvcnQgeyBib3hTaXppbmdTdHlsZXMgfSBmcm9tICcuLi8uLi9jb3JlL3N0eWxlcy50cyc7XG5pbXBvcnQgeyBTYmJQYWdpbmF0b3JDb21tb25FbGVtZW50TWl4aW4gfSBmcm9tICcuLi9jb21tb24vcGFnaW5hdG9yLWNvbW1vbi50cyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL2NvbXBhY3QtcGFnaW5hdG9yLnNjc3M/bGl0JmlubGluZSc7XG5cbmltcG9ydCAnLi4vLi4vZGl2aWRlci50cyc7XG5pbXBvcnQgJy4uLy4uL3NjcmVlbi1yZWFkZXItb25seS50cyc7XG5cbi8qKlxuICogSXQgZGlzcGxheXMgYSBwYWdpbmF0b3IgY29tcG9uZW50IGluIGNvbXBhY3QgbW9kZS5cbiAqL1xuZXhwb3J0IGNsYXNzIFNiYkNvbXBhY3RQYWdpbmF0b3JFbGVtZW50IGV4dGVuZHMgU2JiUGFnaW5hdG9yQ29tbW9uRWxlbWVudE1peGluKFNiYkVsZW1lbnQpIHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSByZWFkb25seSBlbGVtZW50TmFtZTogc3RyaW5nID0gJ3NiYi1jb21wYWN0LXBhZ2luYXRvcic7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtib3hTaXppbmdTdHlsZXMsIHN0eWxlXTtcbiAgcHVibGljIHN0YXRpYyByZWFkb25seSBldmVudHM6IFJlY29yZDxzdHJpbmcsIHN0cmluZz4gPSB7XG4gICAgcGFnZTogJ3BhZ2UnLFxuICB9IGFzIGNvbnN0O1xuXG4gIHByaXZhdGUgX3JlbmRlclBhZ2VOdW1iZXJzKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxzcGFuIGNsYXNzPVwic2JiLXBhZ2luYXRvcl9fcGFnZXNcIiBhcmlhLWhpZGRlbj1cInRydWVcIlxuICAgICAgICA+JHt0aGlzLnBhZ2VJbmRleCArIDF9PHNiYi1kaXZpZGVyXG4gICAgICAgICAgb3JpZW50YXRpb249XCJ2ZXJ0aWNhbFwiXG4gICAgICAgICAgY2xhc3M9XCJzYmItY29tcGFjdC1wYWdpbmF0b3JfX2RpdmlkZXJcIlxuICAgICAgICAgIHN0eWxlPSR7c3R5bGVNYXAoeyAnLS1zYmItZGl2aWRlci1jb2xvcic6ICdjdXJyZW50Y29sb3InIH0pfVxuICAgICAgICAgID9uZWdhdGl2ZT0ke3RoaXMubmVnYXRpdmV9XG4gICAgICAgID48L3NiYi1kaXZpZGVyXG4gICAgICAgID4ke3RoaXMubnVtYmVyT2ZQYWdlcygpfTwvc3BhblxuICAgICAgPlxuICAgICAgPHNiYi1zY3JlZW4tcmVhZGVyLW9ubHk+XG4gICAgICAgICR7YCR7dGhpcy5hY2Nlc3NpYmlsaXR5UGFnZUxhYmVsID8gdGhpcy5hY2Nlc3NpYmlsaXR5UGFnZUxhYmVsIDogaTE4blBhZ2VbdGhpcy5sYW5ndWFnZS5jdXJyZW50XX0gJHt0aGlzLnBhZ2VJbmRleCArIDF9ICR7aTE4blBhZ2luYXRvck9mW3RoaXMubGFuZ3VhZ2UuY3VycmVudF19ICR7dGhpcy5udW1iZXJPZlBhZ2VzKCl9YH1cbiAgICAgIDwvc2JiLXNjcmVlbi1yZWFkZXItb25seT5cbiAgICBgO1xuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlclBhZ2luYXRvcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICAke3RoaXMucGFnZXJQb3NpdGlvbiA9PT0gJ3N0YXJ0J1xuICAgICAgICA/IGh0bWxgJHt0aGlzLnJlbmRlclByZXZOZXh0QnV0dG9ucygpfSAke3RoaXMuX3JlbmRlclBhZ2VOdW1iZXJzKCl9YFxuICAgICAgICA6IGh0bWxgJHt0aGlzLl9yZW5kZXJQYWdlTnVtYmVycygpfSAke3RoaXMucmVuZGVyUHJldk5leHRCdXR0b25zKCl9YH1cbiAgICBgO1xuICB9XG59XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIEhUTUxFbGVtZW50VGFnTmFtZU1hcCB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuICAgICdzYmItY29tcGFjdC1wYWdpbmF0b3InOiBTYmJDb21wYWN0UGFnaW5hdG9yRWxlbWVudDtcbiAgfVxufVxuIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQ2lCQSxJQUFhLDZCQUFiLGNBQWdELCtCQUErQixXQUFXLENBQUE7O0FBQ3hELE9BQUEsY0FBc0I7OztBQUMvQixPQUFBLFNBQXlCLENBQUMsaUJBQWlCLDBCQUFNOzs7QUFDakQsT0FBQSxTQUFpQyxFQUN0RCxNQUFNLFFBQ0U7O0NBRUYscUJBQWtCO0FBQ3hCLFNBQU8sSUFBSTs7V0FFSixLQUFLLFlBQVksRUFBQzs7O2tCQUdYLFNBQVMsRUFBRSx1QkFBdUIsZ0JBQWdCLENBQUMsQ0FBQTtzQkFDL0MsS0FBSyxTQUFBOztXQUVoQixLQUFLLGVBQWUsQ0FBQTs7O1VBR3JCLEdBQUcsS0FBSyx5QkFBeUIsS0FBSyx5QkFBeUIsU0FBUyxLQUFLLFNBQVMsU0FBUSxHQUFJLEtBQUssWUFBWSxFQUFDLEdBQUksZ0JBQWdCLEtBQUssU0FBUyxTQUFRLEdBQUksS0FBSyxlQUFlLEdBQUE7Ozs7Q0FLM0ssa0JBQWU7QUFDaEMsU0FBTyxJQUFJO1FBQ1AsS0FBSyxrQkFBa0IsVUFDckIsSUFBSSxHQUFHLEtBQUssdUJBQXVCLENBQUEsR0FBSSxLQUFLLG9CQUFvQixLQUNoRSxJQUFJLEdBQUcsS0FBSyxvQkFBb0IsQ0FBQSxHQUFJLEtBQUssdUJBQXVCLEdBQUEifQ==
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compact-paginator.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/paginator/compact-paginator/compact-paginator.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1D,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAOzD,OAAO,kBAAkB,CAAC;AAC1B,OAAO,6BAA6B,CAAC;;AAErC;;GAEG;AACH,qBAAa,0BAA2B,SAAQ,+BAA0C;IACxF,gBAAgC,WAAW,EAAE,MAAM,CAA2B;IAC9E,OAAuB,MAAM,EAAE,cAAc,CAA4B;IACzE,gBAAuB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAE1C;IAEX,OAAO,CAAC,kBAAkB;cAiBP,eAAe,IAAI,cAAc;
|
|
1
|
+
{"version":3,"file":"compact-paginator.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/paginator/compact-paginator/compact-paginator.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1D,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAOzD,OAAO,kBAAkB,CAAC;AAC1B,OAAO,6BAA6B,CAAC;;AAErC;;GAEG;AACH,qBAAa,0BAA2B,SAAQ,+BAA0C;IACxF,gBAAgC,WAAW,EAAE,MAAM,CAA2B;IAC9E,OAAuB,MAAM,EAAE,cAAc,CAA4B;IACzE,gBAAuB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAE1C;IAEX,OAAO,CAAC,kBAAkB;cAiBP,eAAe,IAAI,cAAc;CAOrD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,uBAAuB,EAAE,0BAA0B,CAAC;KACrD;CACF"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as SbbCompactPaginatorElement } from "../../compact-paginator.component-
|
|
1
|
+
import { t as SbbCompactPaginatorElement } from "../../compact-paginator.component-BgdCSnNV.js";
|
|
2
2
|
export { SbbCompactPaginatorElement };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as SbbCompactPaginatorElement } from "../compact-paginator.component-
|
|
1
|
+
import { t as SbbCompactPaginatorElement } from "../compact-paginator.component-BgdCSnNV.js";
|
|
2
2
|
//#region src/elements/paginator/compact-paginator.ts
|
|
3
3
|
/** @entrypoint */
|
|
4
4
|
SbbCompactPaginatorElement.define();
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as SbbPaginatorElement } from "../../paginator.component-
|
|
1
|
+
import { t as SbbPaginatorElement } from "../../paginator.component-C03vfQ7J.js";
|
|
2
2
|
export { SbbPaginatorElement };
|