@maggioli-design-system/mds-paginator 3.5.0 → 3.5.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{index-b95e44b9.js → index-ec2d8ba2.js} +60 -23
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mds-paginator.cjs.entry.js +47 -47
- package/dist/cjs/mds-paginator.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/common/aria.js +18 -18
- package/dist/collection/common/keyboard-manager.js +38 -38
- package/dist/collection/common/unit.js +7 -7
- package/dist/collection/components/mds-paginator/mds-paginator.css +4 -0
- package/dist/collection/components/mds-paginator/mds-paginator.js +118 -118
- package/dist/collection/components/mds-paginator/test/mds-paginator.e2e.js +9 -7
- package/dist/collection/components/mds-paginator/test/mds-paginator.stories.js +13 -13
- package/dist/collection/dictionary/autocomplete.js +56 -56
- package/dist/collection/dictionary/button.js +19 -19
- package/dist/collection/dictionary/color.js +14 -14
- package/dist/collection/dictionary/floating-ui.js +14 -14
- package/dist/collection/dictionary/input.js +31 -15
- package/dist/collection/dictionary/loading.js +2 -2
- package/dist/collection/dictionary/typography.js +46 -46
- package/dist/collection/dictionary/variant.js +54 -54
- package/dist/collection/fixtures/cities.js +107 -107
- package/dist/components/mds-paginator.d.ts +2 -2
- package/dist/components/mds-paginator.js +63 -63
- package/dist/documentation.json +2 -2
- package/dist/esm/{index-4d6926fe.js → index-0becd821.js} +60 -23
- package/dist/esm/loader.js +2 -2
- package/dist/esm/mds-paginator.entry.js +47 -47
- package/dist/esm/mds-paginator.js +3 -3
- package/dist/esm-es5/index-0becd821.js +1 -0
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/mds-paginator.entry.js +1 -1
- package/dist/esm-es5/mds-paginator.js +1 -1
- package/dist/mds-paginator/mds-paginator.esm.js +1 -1
- package/dist/mds-paginator/mds-paginator.js +15 -15
- package/dist/mds-paginator/{p-fa98c4e8.system.js → p-307f11cd.system.js} +1 -1
- package/dist/mds-paginator/p-3e79a595.system.entry.js +1 -0
- package/dist/mds-paginator/p-6e98b0fc.js +2 -0
- package/dist/mds-paginator/p-b32f0ea9.entry.js +1 -0
- package/dist/mds-paginator/p-de5ca806.system.js +2 -0
- package/dist/stats.json +30 -30
- package/dist/types/common/keyboard-manager.d.ts +9 -9
- package/dist/types/components/mds-paginator/mds-paginator.d.ts +17 -17
- package/dist/types/components/mds-paginator/test/mds-paginator.stories.d.ts +16 -16
- package/dist/types/dictionary/input.d.ts +2 -1
- package/dist/types/interface/input-value.d.ts +1 -1
- package/dist/types/stencil-public-runtime.d.ts +8 -0
- package/documentation.json +14 -4
- package/package.json +4 -4
- package/src/components/mds-paginator/mds-paginator.css +3 -3
- package/src/components/mds-paginator/test/mds-paginator.e2e.ts +2 -0
- package/src/dictionary/input.ts +18 -0
- package/src/fixtures/icons.json +3 -0
- package/src/fixtures/iconsauce.json +3 -0
- package/www/build/mds-paginator.esm.js +1 -1
- package/www/build/mds-paginator.js +15 -15
- package/www/build/{p-fa98c4e8.system.js → p-307f11cd.system.js} +1 -1
- package/www/build/p-3e79a595.system.entry.js +1 -0
- package/www/build/p-6e98b0fc.js +2 -0
- package/www/build/p-b32f0ea9.entry.js +1 -0
- package/www/build/p-de5ca806.system.js +2 -0
- package/dist/esm-es5/index-4d6926fe.js +0 -1
- package/dist/mds-paginator/p-4214627d.js +0 -2
- package/dist/mds-paginator/p-c339f377.system.js +0 -2
- package/dist/mds-paginator/p-d6d7631c.system.entry.js +0 -1
- package/dist/mds-paginator/p-eea359c7.entry.js +0 -1
- package/www/build/p-4214627d.js +0 -2
- package/www/build/p-c339f377.system.js +0 -2
- package/www/build/p-d6d7631c.system.entry.js +0 -1
- package/www/build/p-eea359c7.entry.js +0 -1
|
@@ -49,6 +49,13 @@ const uniqueTime = (key, measureText) => {
|
|
|
49
49
|
}
|
|
50
50
|
};
|
|
51
51
|
const HYDRATED_CSS = '{visibility:hidden}[hydrated]{visibility:inherit}';
|
|
52
|
+
/**
|
|
53
|
+
* Constant for styles to be globally applied to `slot-fb` elements for pseudo-slot behavior.
|
|
54
|
+
*
|
|
55
|
+
* Two cascading rules must be used instead of a `:not()` selector due to Stencil browser
|
|
56
|
+
* support as of Stencil v4.
|
|
57
|
+
*/
|
|
58
|
+
const SLOT_FB_CSS = 'slot-fb{display:contents}slot-fb[hidden]{display:none}';
|
|
52
59
|
/**
|
|
53
60
|
* Default style mode id
|
|
54
61
|
*/
|
|
@@ -286,6 +293,10 @@ const addStyle = (styleContainerNode, cmpMeta, mode) => {
|
|
|
286
293
|
}
|
|
287
294
|
styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
|
|
288
295
|
}
|
|
296
|
+
// Add styles for `slot-fb` elements if we're using slots outside the Shadow DOM
|
|
297
|
+
if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
|
|
298
|
+
styleElm.innerHTML += SLOT_FB_CSS;
|
|
299
|
+
}
|
|
289
300
|
if (appliedStyles) {
|
|
290
301
|
appliedStyles.add(scopeId);
|
|
291
302
|
}
|
|
@@ -419,7 +430,11 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
|
419
430
|
elm[memberName] = newValue;
|
|
420
431
|
}
|
|
421
432
|
}
|
|
422
|
-
catch (e) {
|
|
433
|
+
catch (e) {
|
|
434
|
+
/**
|
|
435
|
+
* in case someone tries to set a read-only property, e.g. "namespaceURI", we just ignore it
|
|
436
|
+
*/
|
|
437
|
+
}
|
|
423
438
|
}
|
|
424
439
|
if (newValue == null || newValue === false) {
|
|
425
440
|
if (newValue !== false || elm.getAttribute(memberName) === '') {
|
|
@@ -438,6 +453,11 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
|
438
453
|
}
|
|
439
454
|
};
|
|
440
455
|
const parseClassListRegex = /\s/;
|
|
456
|
+
/**
|
|
457
|
+
* Parsed a string of classnames into an array
|
|
458
|
+
* @param value className string, e.g. "foo bar baz"
|
|
459
|
+
* @returns list of classes, e.g. ["foo", "bar", "baz"]
|
|
460
|
+
*/
|
|
441
461
|
const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
|
|
442
462
|
const CAPTURE_EVENT_SUFFIX = 'Capture';
|
|
443
463
|
const CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + '$');
|
|
@@ -1181,10 +1201,10 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
|
|
|
1181
1201
|
*/
|
|
1182
1202
|
const proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
1183
1203
|
var _a;
|
|
1204
|
+
const prototype = Cstr.prototype;
|
|
1184
1205
|
if (cmpMeta.$members$) {
|
|
1185
1206
|
// It's better to have a const than two Object.entries()
|
|
1186
1207
|
const members = Object.entries(cmpMeta.$members$);
|
|
1187
|
-
const prototype = Cstr.prototype;
|
|
1188
1208
|
members.map(([memberName, [memberFlags]]) => {
|
|
1189
1209
|
if ((memberFlags & 31 /* MEMBER_FLAGS.Prop */ ||
|
|
1190
1210
|
((flags & 2 /* PROXY_FLAGS.proxyState */) && memberFlags & 32 /* MEMBER_FLAGS.State */))) {
|
|
@@ -1207,6 +1227,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
|
1207
1227
|
const attrNameToPropName = new Map();
|
|
1208
1228
|
prototype.attributeChangedCallback = function (attrName, oldValue, newValue) {
|
|
1209
1229
|
plt.jmp(() => {
|
|
1230
|
+
var _a;
|
|
1210
1231
|
const propName = attrNameToPropName.get(attrName);
|
|
1211
1232
|
// In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
|
|
1212
1233
|
// in the case where an attribute was set inline.
|
|
@@ -1262,11 +1283,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
|
1262
1283
|
// 1. The instance is ready
|
|
1263
1284
|
// 2. The watchers are ready
|
|
1264
1285
|
// 3. The value has changed
|
|
1265
|
-
if (
|
|
1286
|
+
if (flags &&
|
|
1287
|
+
!(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
|
|
1266
1288
|
flags & 128 /* HOST_FLAGS.isWatchReady */ &&
|
|
1267
1289
|
newValue !== oldValue) {
|
|
1268
1290
|
const instance = hostRef.$lazyInstance$ ;
|
|
1269
|
-
const entry = cmpMeta.$watchers$[attrName];
|
|
1291
|
+
const entry = (_a = cmpMeta.$watchers$) === null || _a === void 0 ? void 0 : _a[attrName];
|
|
1270
1292
|
entry === null || entry === void 0 ? void 0 : entry.forEach((callbackName) => {
|
|
1271
1293
|
if (instance[callbackName] != null) {
|
|
1272
1294
|
instance[callbackName].call(instance, newValue, oldValue, attrName);
|
|
@@ -1288,10 +1310,11 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
|
1288
1310
|
...members
|
|
1289
1311
|
.filter(([_, m]) => m[0] & 15 /* MEMBER_FLAGS.HasAttribute */)
|
|
1290
1312
|
.map(([propName, m]) => {
|
|
1313
|
+
var _a;
|
|
1291
1314
|
const attrName = m[1] || propName;
|
|
1292
1315
|
attrNameToPropName.set(attrName, propName);
|
|
1293
1316
|
if (m[0] & 512 /* MEMBER_FLAGS.ReflectAttr */) {
|
|
1294
|
-
cmpMeta.$attrsToReflect
|
|
1317
|
+
(_a = cmpMeta.$attrsToReflect$) === null || _a === void 0 ? void 0 : _a.push([propName, attrName]);
|
|
1295
1318
|
}
|
|
1296
1319
|
return attrName;
|
|
1297
1320
|
}),
|
|
@@ -1449,12 +1472,13 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1449
1472
|
const customElements = win.customElements;
|
|
1450
1473
|
const head = doc.head;
|
|
1451
1474
|
const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
|
|
1452
|
-
const
|
|
1475
|
+
const dataStyles = /*@__PURE__*/ doc.createElement('style');
|
|
1453
1476
|
const deferredConnectedCallbacks = [];
|
|
1454
1477
|
let appLoadFallback;
|
|
1455
1478
|
let isBootstrapping = true;
|
|
1456
1479
|
Object.assign(plt, options);
|
|
1457
1480
|
plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
|
|
1481
|
+
let hasSlotRelocation = false;
|
|
1458
1482
|
lazyBundles.map((lazyBundle) => {
|
|
1459
1483
|
lazyBundle[1].map((compactMeta) => {
|
|
1460
1484
|
const cmpMeta = {
|
|
@@ -1463,6 +1487,11 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1463
1487
|
$members$: compactMeta[2],
|
|
1464
1488
|
$listeners$: compactMeta[3],
|
|
1465
1489
|
};
|
|
1490
|
+
// Check if we are using slots outside the shadow DOM in this component.
|
|
1491
|
+
// We'll use this information later to add styles for `slot-fb` elements
|
|
1492
|
+
if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
|
|
1493
|
+
hasSlotRelocation = true;
|
|
1494
|
+
}
|
|
1466
1495
|
{
|
|
1467
1496
|
cmpMeta.$members$ = compactMeta[2];
|
|
1468
1497
|
}
|
|
@@ -1516,15 +1545,23 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1516
1545
|
}
|
|
1517
1546
|
});
|
|
1518
1547
|
});
|
|
1548
|
+
// Add styles for `slot-fb` elements if any of our components are using slots outside the Shadow DOM
|
|
1549
|
+
if (hasSlotRelocation) {
|
|
1550
|
+
dataStyles.innerHTML += SLOT_FB_CSS;
|
|
1551
|
+
}
|
|
1552
|
+
// Add hydration styles
|
|
1519
1553
|
{
|
|
1520
|
-
|
|
1521
|
-
|
|
1554
|
+
dataStyles.innerHTML += cmpTags + HYDRATED_CSS;
|
|
1555
|
+
}
|
|
1556
|
+
// If we have styles, add them to the DOM
|
|
1557
|
+
if (dataStyles.innerHTML.length) {
|
|
1558
|
+
dataStyles.setAttribute('data-styles', '');
|
|
1559
|
+
head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
|
|
1522
1560
|
// Apply CSP nonce to the style tag if it exists
|
|
1523
1561
|
const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
|
|
1524
1562
|
if (nonce != null) {
|
|
1525
|
-
|
|
1563
|
+
dataStyles.setAttribute('nonce', nonce);
|
|
1526
1564
|
}
|
|
1527
|
-
head.insertBefore(visibilityStyle, metaCharset ? metaCharset.nextSibling : head.firstChild);
|
|
1528
1565
|
}
|
|
1529
1566
|
// Process deferred connectedCallbacks now all components have been registered
|
|
1530
1567
|
isBootstrapping = false;
|
|
@@ -1602,19 +1639,19 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
|
|
|
1602
1639
|
return module[exportName];
|
|
1603
1640
|
}
|
|
1604
1641
|
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1642
|
+
if (!hmrVersionId || !BUILD.hotModuleReplacement) {
|
|
1643
|
+
const processMod = importedModule => {
|
|
1644
|
+
cmpModules.set(bundleId, importedModule);
|
|
1645
|
+
return importedModule[exportName];
|
|
1646
|
+
}
|
|
1647
|
+
switch(bundleId) {
|
|
1648
|
+
|
|
1649
|
+
case 'mds-paginator.cjs':
|
|
1650
|
+
return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
|
|
1651
|
+
/* webpackMode: "lazy" */
|
|
1652
|
+
'./mds-paginator.cjs.entry.js')); }).then(processMod, consoleError);
|
|
1653
|
+
}
|
|
1616
1654
|
}
|
|
1617
|
-
}
|
|
1618
1655
|
return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
|
|
1619
1656
|
/* @vite-ignore */
|
|
1620
1657
|
/* webpackInclude: /\.entry\.js$/ */
|
|
@@ -1689,7 +1726,7 @@ const flush = () => {
|
|
|
1689
1726
|
}
|
|
1690
1727
|
}
|
|
1691
1728
|
};
|
|
1692
|
-
const nextTick =
|
|
1729
|
+
const nextTick = (cb) => promiseResolve().then(cb);
|
|
1693
1730
|
const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
|
|
1694
1731
|
|
|
1695
1732
|
exports.Host = Host;
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-ec2d8ba2.js');
|
|
6
6
|
|
|
7
7
|
const defineCustomElements = (win, options) => {
|
|
8
8
|
if (typeof window === 'undefined') return undefined;
|
|
@@ -2,56 +2,56 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-ec2d8ba2.js');
|
|
6
6
|
|
|
7
|
-
const mdsPaginatorCss = "@tailwind components; .fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-paginator-background:rgb(var(--tone-neutral-09));gap:0.25rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}.pages{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;margin-left:0.5rem;margin-right:0.5rem;border-radius:9999px;padding:0.5rem;-ms-flex-align:center;align-items:center;background-color:var(--mds-paginator-background);display:-ms-flexbox;display:flex;-ms-flex-negative:1;flex-shrink:1;gap:2px;overflow:auto;scroll-behavior:smooth}.pages::-webkit-scrollbar{display:none}";
|
|
7
|
+
const mdsPaginatorCss = "@tailwind components; .fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.text{font-size:1rem}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-paginator-background:rgb(var(--tone-neutral-09));gap:0.25rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}.pages{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;margin-left:0.5rem;margin-right:0.5rem;border-radius:9999px;padding:0.5rem;-ms-flex-align:center;align-items:center;background-color:var(--mds-paginator-background);display:-ms-flexbox;display:flex;-ms-flex-negative:1;flex-shrink:1;gap:2px;overflow:auto;scroll-behavior:smooth}.pages::-webkit-scrollbar{display:none}";
|
|
8
8
|
|
|
9
9
|
const MdsPaginator = class {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
10
|
+
constructor(hostRef) {
|
|
11
|
+
index.registerInstance(this, hostRef);
|
|
12
|
+
this.pageChangedEvent = index.createEvent(this, "mdsPaginatorChange", 7);
|
|
13
|
+
this.scrollPage = () => {
|
|
14
|
+
var _a;
|
|
15
|
+
const elementIndex = this.currentPage - 2;
|
|
16
|
+
const pagesElement = (_a = this.element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.pages');
|
|
17
|
+
const pagesItems = pagesElement === null || pagesElement === void 0 ? void 0 : pagesElement.querySelectorAll('mds-paginator-item');
|
|
18
|
+
if (!pagesElement || !pagesItems)
|
|
19
|
+
return;
|
|
20
|
+
if (elementIndex < 0) {
|
|
21
|
+
pagesElement.scrollLeft = 0;
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
if (elementIndex > pagesItems.length - 1) {
|
|
25
|
+
const pageItem = pagesItems[pagesItems.length - 1];
|
|
26
|
+
pagesElement.scrollLeft = pageItem.offsetLeft - pagesElement.offsetLeft;
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
const pageItem = pagesItems[elementIndex];
|
|
30
|
+
pagesElement.scrollLeft = pageItem.offsetLeft - pagesElement.offsetLeft - (pagesElement.offsetWidth / 2) + (pageItem.offsetWidth / 2);
|
|
31
|
+
};
|
|
32
|
+
this.goToPage = (selectedPage, caller) => {
|
|
33
|
+
if (selectedPage < 1 || selectedPage > this.pages) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
this.currentPage = selectedPage;
|
|
37
|
+
if (this.pages > 2) {
|
|
38
|
+
this.scrollPage();
|
|
39
|
+
}
|
|
40
|
+
this.pageChangedEvent.emit({ page: this.currentPage, caller });
|
|
41
|
+
};
|
|
42
|
+
this.pages = 0;
|
|
43
|
+
this.currentPage = 1;
|
|
44
|
+
}
|
|
45
|
+
componentDidLoad() {
|
|
46
|
+
setTimeout(() => {
|
|
47
|
+
this.goToPage(this.currentPage);
|
|
48
|
+
}, 10);
|
|
49
|
+
}
|
|
50
|
+
render() {
|
|
51
|
+
return (index.h(index.Host, null, index.h("mds-paginator-item", { icon: "mi/baseline/arrow-back", disabled: this.currentPage === 1, onClick: ev => this.goToPage(this.currentPage - 1, ev.target) }), this.pages > 0 && index.h("mds-paginator-item", { selected: this.currentPage === 1, onClick: ev => this.goToPage(1, ev.target) }, "1"), this.pages > 2 &&
|
|
52
|
+
index.h("div", { class: "pages" }, Array.from(Array(this.pages - 2).keys()).map(i => index.h("mds-paginator-item", { key: i, selected: this.currentPage === i + 2, onClick: ev => this.goToPage(i + 2, ev.target) }, i + 2))), this.pages > 1 && index.h("mds-paginator-item", { selected: this.currentPage === this.pages, onClick: ev => this.goToPage(this.pages, ev.target) }, this.pages), index.h("mds-paginator-item", { icon: "mi/baseline/arrow-forward", disabled: this.currentPage === this.pages, onClick: ev => this.goToPage(this.currentPage + 1, ev.target) })));
|
|
53
|
+
}
|
|
54
|
+
get element() { return index.getElement(this); }
|
|
55
55
|
};
|
|
56
56
|
MdsPaginator.style = mdsPaginatorCss;
|
|
57
57
|
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-ec2d8ba2.js');
|
|
6
6
|
|
|
7
7
|
/*
|
|
8
|
-
Stencil Client Patch Browser v4.
|
|
8
|
+
Stencil Client Patch Browser v4.8.0 | MIT Licensed | https://stenciljs.com
|
|
9
9
|
*/
|
|
10
10
|
const patchBrowser = () => {
|
|
11
11
|
const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('mds-paginator.cjs.js', document.baseURI).href));
|
|
@@ -1,29 +1,29 @@
|
|
|
1
1
|
const hash = (s) => {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
let i, h;
|
|
3
|
+
for (i = 0, h = 0; i < s.length; i++) {
|
|
4
|
+
h = Math.imul(31, h) + s.charCodeAt(i) | 0;
|
|
5
|
+
}
|
|
6
|
+
return h.toString();
|
|
7
7
|
};
|
|
8
8
|
const randomInt = (max) => Math.floor(Math.random() * max);
|
|
9
9
|
const unslugName = (name) => {
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
var _a, _b, _c;
|
|
11
|
+
return (_c = (_b = (_a = name.split('/')) === null || _a === void 0 ? void 0 : _a.slice(-1).pop()) === null || _b === void 0 ? void 0 : _b.replace(/-/g, ' ')) !== null && _c !== void 0 ? _c : name;
|
|
12
12
|
};
|
|
13
13
|
const setAttributeIfEmpty = (element, attribute, value) => {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
14
|
+
var _a;
|
|
15
|
+
if (element.hasAttribute(attribute)) {
|
|
16
|
+
return (_a = element.getAttribute(attribute)) !== null && _a !== void 0 ? _a : '';
|
|
17
|
+
}
|
|
18
|
+
element.setAttribute(attribute, value);
|
|
19
|
+
return value;
|
|
20
20
|
};
|
|
21
21
|
const hashValue = (value) => `${value}-${hash(value)}`;
|
|
22
22
|
const hashRandomValue = (value) => {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
23
|
+
const randomValue = randomInt(1000000);
|
|
24
|
+
if (value) {
|
|
25
|
+
return `${value}-${hash(randomValue.toString())}`;
|
|
26
|
+
}
|
|
27
|
+
return hash(randomValue.toString());
|
|
28
28
|
};
|
|
29
29
|
export { unslugName, setAttributeIfEmpty, hashRandomValue, hashValue, };
|
|
@@ -1,40 +1,40 @@
|
|
|
1
1
|
export class KeyboardManager {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
2
|
+
constructor() {
|
|
3
|
+
this.elements = [];
|
|
4
|
+
this.handleClickBehaviorDispatchEvent = (event) => {
|
|
5
|
+
if (event.code === 'Space' || event.code === 'Enter' || event.code === 'NumpadEnter') {
|
|
6
|
+
event.target.click();
|
|
7
|
+
}
|
|
8
|
+
};
|
|
9
|
+
this.handleEscapeBehaviorDispatchEvent = (event) => {
|
|
10
|
+
if (event.code === 'Escape' && this.escapeCallback) {
|
|
11
|
+
this.escapeCallback();
|
|
12
|
+
}
|
|
13
|
+
};
|
|
14
|
+
this.addElement = (el, name = 'element') => {
|
|
15
|
+
this.elements[name] = el;
|
|
16
|
+
};
|
|
17
|
+
this.attachClickBehavior = (name = 'element') => {
|
|
18
|
+
if (this.elements[name]) {
|
|
19
|
+
this.elements[name].addEventListener('keydown', this.handleClickBehaviorDispatchEvent);
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
this.detachClickBehavior = (name = 'element') => {
|
|
23
|
+
if (this.elements[name]) {
|
|
24
|
+
this.elements[name].removeEventListener('keydown', this.handleClickBehaviorDispatchEvent);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
this.attachEscapeBehavior = (callBack) => {
|
|
28
|
+
this.escapeCallback = callBack;
|
|
29
|
+
if (window !== undefined) {
|
|
30
|
+
window.addEventListener('keydown', this.handleEscapeBehaviorDispatchEvent.bind(this));
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
this.detachEscapeBehavior = () => {
|
|
34
|
+
this.escapeCallback = () => { return; };
|
|
35
|
+
if (window !== undefined) {
|
|
36
|
+
window.removeEventListener('keydown', this.handleEscapeBehaviorDispatchEvent.bind(this));
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
40
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
const cssDurationToMilliseconds = (duration, defaultValue = 1000) => {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
2
|
+
if (duration.includes('s')) {
|
|
3
|
+
return Number(duration.replace('s', '')) * 1000;
|
|
4
|
+
}
|
|
5
|
+
if (duration.includes('ms')) {
|
|
6
|
+
return Number(duration.replace('s', ''));
|
|
7
|
+
}
|
|
8
|
+
return defaultValue;
|
|
9
9
|
};
|
|
10
10
|
export { cssDurationToMilliseconds, };
|