@covalent/components 6.2.1 → 6.2.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/action-ribbon.js +6 -6
- package/action-ribbon.mjs +34 -29
- package/alert.js +6 -6
- package/alert.mjs +18 -13
- package/app-shell.js +8 -8
- package/app-shell.mjs +9 -3
- package/base-element.mjs +5 -0
- package/button.js +9 -9
- package/button.mjs +23 -14
- package/card.js +8 -8
- package/card.mjs +17 -15
- package/check-list-item.js +9 -9
- package/check-list-item.mjs +20 -11
- package/checkbox.js +2 -2
- package/checkbox.mjs +26 -17
- package/circular-progress.js +29 -29
- package/circular-progress.mjs +13 -9
- package/class-map.mjs +9 -0
- package/code-snippet.js +9 -9
- package/code-snippet.mjs +10 -7
- package/dialog.js +1 -1
- package/dialog.mjs +14 -14
- package/dialog2.mjs +55 -49
- package/directive-helpers.mjs +1 -1
- package/drawer.js +3 -3
- package/drawer.mjs +13 -7
- package/empty-state.js +5 -5
- package/empty-state.mjs +5 -3
- package/event-options.mjs +5 -0
- package/form-element.mjs +2 -2
- package/foundation.mjs +2 -2
- package/icon-button.js +8 -8
- package/icon-button.mjs +23 -14
- package/icon-check-toggle.js +9 -9
- package/icon-check-toggle.mjs +15 -6
- package/icon-radio-toggle.js +5 -5
- package/icon-radio-toggle.mjs +30 -21
- package/icon.js +2 -2
- package/icon.mjs +8 -7
- package/if-defined.mjs +1 -1
- package/index.js +1 -1
- package/index.mjs +100 -90
- package/linear-progress.js +12 -12
- package/linear-progress.mjs +23 -17
- package/list-expansion.js +8 -8
- package/list-expansion.mjs +38 -29
- package/list-item.js +1 -1
- package/list-item.mjs +6 -6
- package/list-item2.mjs +16 -15
- package/list.js +1 -1
- package/list.mjs +2 -2
- package/list2.mjs +6 -5
- package/menu.js +2 -2
- package/menu.mjs +25 -16
- package/mwc-checkbox-base.mjs +6 -6
- package/mwc-checkbox.css.mjs +2 -2
- package/mwc-drawer-base.mjs +11 -11
- package/mwc-icon.mjs +3 -3
- package/mwc-line-ripple-directive.mjs +16 -16
- package/mwc-list-base.mjs +25 -25
- package/mwc-list-item-base.mjs +11 -11
- package/mwc-list-item.css.mjs +3 -3
- package/mwc-menu-base.mjs +20 -20
- package/mwc-radio-base.mjs +11 -11
- package/mwc-radio.css.mjs +2 -2
- package/mwc-slider.css.mjs +20 -20
- package/mwc-tab-base.mjs +22 -22
- package/mwc-top-app-bar-base.mjs +10 -10
- package/nav-list-item.js +10 -10
- package/nav-list-item.mjs +32 -24
- package/package.json +1 -1
- package/property.mjs +5 -0
- package/query-assigned-elements.mjs +33 -0
- package/query-assigned-nodes.mjs +5 -0
- package/query.mjs +5 -0
- package/radio-list-item.js +10 -10
- package/radio-list-item.mjs +27 -18
- package/radio.js +2 -2
- package/radio.mjs +22 -13
- package/ripple-handlers.mjs +104 -2
- package/select.js +28 -28
- package/select.mjs +25 -15
- package/side-sheet.js +4 -4
- package/side-sheet.mjs +12 -6
- package/slider-range.js +7 -7
- package/slider-range.mjs +69 -61
- package/slider.js +3 -3
- package/slider.mjs +26 -18
- package/snackbar.js +15 -15
- package/snackbar.mjs +26 -20
- package/state.mjs +5 -0
- package/status-header-item.js +4 -4
- package/status-header-item.mjs +14 -13
- package/status-header.js +6 -6
- package/status-header.mjs +9 -7
- package/style-map.mjs +5 -0
- package/switch.js +18 -18
- package/switch.mjs +30 -21
- package/tab-bar.js +21 -21
- package/tab-bar.mjs +22 -13
- package/tab.js +3 -3
- package/tab.mjs +13 -4
- package/text-lockup.js +5 -5
- package/text-lockup.mjs +8 -6
- package/textarea.js +14 -14
- package/textarea.mjs +23 -15
- package/textfield.js +3 -3
- package/textfield.mjs +39 -39
- package/textfield2.mjs +26 -19
- package/toolbar.js +3 -3
- package/toolbar.mjs +9 -3
- package/tooltip.js +12 -12
- package/tooltip.mjs +12 -8
- package/top-app-bar-fixed.js +5 -5
- package/top-app-bar-fixed.mjs +29 -23
- package/top-app-bar.js +3 -3
- package/top-app-bar.mjs +2 -2
- package/top-app-bar2.mjs +1 -1
- package/tree-list-item.js +8 -8
- package/tree-list-item.mjs +5 -3
- package/tree-list.js +3 -3
- package/tree-list.mjs +4 -4
- package/tslib.es6.mjs +1 -0
- package/typography.js +4 -4
- package/typography.mjs +12 -11
- package/utils.mjs +5 -0
- package/mwc-ripple.mjs +0 -175
package/select.mjs
CHANGED
@@ -1,13 +1,23 @@
|
|
1
|
-
import {
|
2
|
-
import {
|
3
|
-
import {
|
1
|
+
import { i as P, e as Y, y as x, b as w, r as ee } from "./query-assigned-elements.mjs";
|
2
|
+
import { _ as o, a as te, b as V } from "./tslib.es6.mjs";
|
3
|
+
import { f as ie, l as le } from "./mwc-line-ripple-directive.mjs";
|
4
|
+
import { M as de } from "./mwc-menu-base.mjs";
|
4
5
|
import "./mwc-icon.mjs";
|
5
|
-
import { F as
|
6
|
+
import { F as ce } from "./form-element.mjs";
|
6
7
|
import { o as R } from "./observer.mjs";
|
8
|
+
import { a as ne, i as oe } from "./utils.mjs";
|
9
|
+
import { e as g } from "./property.mjs";
|
10
|
+
import { t as S } from "./state.mjs";
|
11
|
+
import { e as re } from "./event-options.mjs";
|
12
|
+
import { i as v } from "./query.mjs";
|
13
|
+
import { o as M } from "./class-map.mjs";
|
7
14
|
import { l as z } from "./if-defined.mjs";
|
15
|
+
import "./base-element.mjs";
|
8
16
|
import "./mwc-list-base.mjs";
|
9
17
|
import "./mwc-list-item-base.mjs";
|
10
18
|
import "./ripple-handlers.mjs";
|
19
|
+
import "./style-map.mjs";
|
20
|
+
import "./query-assigned-nodes.mjs";
|
11
21
|
/**
|
12
22
|
* @license
|
13
23
|
* Copyright 2021 Google LLC
|
@@ -19,7 +29,7 @@ const ae = P`mwc-list ::slotted([mwc-list-item]:not([twoline])),mwc-list ::slott
|
|
19
29
|
* Copyright 2020 Google LLC
|
20
30
|
* SPDX-License-Identifier: Apache-2.0
|
21
31
|
*/
|
22
|
-
let F = class extends
|
32
|
+
let F = class extends de {
|
23
33
|
};
|
24
34
|
F.styles = [ae];
|
25
35
|
F = o([
|
@@ -488,7 +498,7 @@ var p = {
|
|
488
498
|
var ge = (
|
489
499
|
/** @class */
|
490
500
|
function(l) {
|
491
|
-
|
501
|
+
te(e, l);
|
492
502
|
function e(t, i) {
|
493
503
|
i === void 0 && (i = {});
|
494
504
|
var d = l.call(this, V(V({}, e.defaultAdapter), t)) || this;
|
@@ -742,7 +752,7 @@ const X = (l = {}) => {
|
|
742
752
|
e[t] = l[t];
|
743
753
|
return Object.assign({ badInput: !1, customError: !1, patternMismatch: !1, rangeOverflow: !1, rangeUnderflow: !1, stepMismatch: !1, tooLong: !1, tooShort: !1, typeMismatch: !1, valid: !0, valueMissing: !1 }, e);
|
744
754
|
};
|
745
|
-
class r extends
|
755
|
+
class r extends ce {
|
746
756
|
constructor() {
|
747
757
|
super(...arguments), this.mdcFoundationClass = ve, this.disabled = !1, this.outlined = !1, this.label = "", this.outlineOpen = !1, this.outlineWidth = 0, this.value = "", this.name = "", this.selectedText = "", this.icon = "", this.menuOpen = !1, this.helper = "", this.validateOnInitialRender = !1, this.validationMessage = "", this.required = !1, this.naturalMenuWidth = !1, this.isUiValid = !0, this.fixedMenuPosition = !1, this.typeaheadState = pe(), this.sortedIndexByFirstChar = /* @__PURE__ */ new Map(), this.menuElement_ = null, this.listeners = [], this.onBodyClickBound = () => {
|
748
758
|
}, this._menuUpdateComplete = null, this.valueSetDirectly = !1, this.validityTransform = null, this._validity = X();
|
@@ -877,7 +887,7 @@ class r extends re {
|
|
877
887
|
renderLabel() {
|
878
888
|
return this.label ? x`
|
879
889
|
<span
|
880
|
-
.floatingLabelFoundation=${
|
890
|
+
.floatingLabelFoundation=${ie(this.label)}
|
881
891
|
id="label">${this.label}</span>
|
882
892
|
` : w;
|
883
893
|
}
|
@@ -886,7 +896,7 @@ class r extends re {
|
|
886
896
|
}
|
887
897
|
renderLineRipple() {
|
888
898
|
return this.outlined ? w : x`
|
889
|
-
<span .lineRippleFoundation=${
|
899
|
+
<span .lineRippleFoundation=${le()}></span>
|
890
900
|
`;
|
891
901
|
}
|
892
902
|
renderHelperText() {
|
@@ -901,7 +911,7 @@ class r extends re {
|
|
901
911
|
id="helper-text">${e ? this.validationMessage : this.helper}</p>`;
|
902
912
|
}
|
903
913
|
createAdapter() {
|
904
|
-
return Object.assign(Object.assign({},
|
914
|
+
return Object.assign(Object.assign({}, ne(this.mdcRoot)), { activateBottomLine: () => {
|
905
915
|
this.lineRippleElement && this.lineRippleElement.lineRippleFoundation.activate();
|
906
916
|
}, deactivateBottomLine: () => {
|
907
917
|
this.lineRippleElement && this.lineRippleElement.lineRippleFoundation.deactivate();
|
@@ -1084,7 +1094,7 @@ class r extends re {
|
|
1084
1094
|
handleTypeahead(e) {
|
1085
1095
|
if (!this.menuElement)
|
1086
1096
|
return;
|
1087
|
-
const t = this.menuElement.getFocusedItemIndex(), i =
|
1097
|
+
const t = this.menuElement.getFocusedItemIndex(), i = oe(e.target) ? e.target : null, d = i ? i.hasAttribute("mwc-list-item") : !1, c = {
|
1088
1098
|
event: e,
|
1089
1099
|
focusItemAtIndex: (a) => {
|
1090
1100
|
this.menuElement.focusItemAtIndex(a);
|
@@ -1227,7 +1237,7 @@ o([
|
|
1227
1237
|
g({ type: Boolean })
|
1228
1238
|
], r.prototype, "fixedMenuPosition", void 0);
|
1229
1239
|
o([
|
1230
|
-
|
1240
|
+
re({ capture: !0 })
|
1231
1241
|
], r.prototype, "handleTypeahead", null);
|
1232
1242
|
/**
|
1233
1243
|
* @license
|
@@ -1243,12 +1253,12 @@ var ye = Object.defineProperty, Ie = Object.getOwnPropertyDescriptor, Te = (l, e
|
|
1243
1253
|
};
|
1244
1254
|
let O = class extends r {
|
1245
1255
|
};
|
1246
|
-
O.styles = [P`${
|
1256
|
+
O.styles = [P`${ee(Ee)}`, xe];
|
1247
1257
|
O = Te([
|
1248
1258
|
Y("cv-select")
|
1249
1259
|
], O);
|
1250
|
-
const
|
1260
|
+
const Ye = O;
|
1251
1261
|
export {
|
1252
1262
|
O as CovalentSelect,
|
1253
|
-
|
1263
|
+
Ye as default
|
1254
1264
|
};
|
package/side-sheet.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
2
|
-
`;var
|
3
|
-
${
|
4
|
-
`];s([
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./query-assigned-elements.mjs"),c=require("./property.mjs"),l=require("./dialog.mjs");require("./tslib.es6.mjs");require("./inert.esm.mjs");require("./base-element.mjs");require("./utils.mjs");require("./observer.mjs");require("./query.mjs");require("./class-map.mjs");const h=`:host{--cv-side-sheet-width: 800px;--mdc-dialog-heading-ink-color: var(--mdc-theme-text-primary-on-background)}.mdc-dialog{justify-content:flex-end}.mdc-dialog .mdc-dialog__surface{border-radius:0;height:100%;min-height:inherit;max-height:inherit;min-width:var(--cv-side-sheet-width, 400px)}.mdc-dialog--opening .mdc-dialog__container{transform:translate(100%);transition:transform .15s cubic-bezier(.4,0,1,1)}.mdc-dialog--open .mdc-dialog__container{transform:translate(0)}.mdc-dialog--closing .mdc-dialog__container{opacity:1;transform:translate(100%);transition:transform .15s cubic-bezier(0,0,.2,1)}:host([pushed]) .mdc-dialog__surface{min-width:100vw}:host([noPadding]) .mdc-dialog .mdc-dialog__content{padding:0}
|
2
|
+
`;var u=Object.defineProperty,g=Object.getOwnPropertyDescriptor,s=(r,t,o,i)=>{for(var e=i>1?void 0:i?g(t,o):t,n=r.length-1,a;n>=0;n--)(a=r[n])&&(e=(i?a(t,o,e):a(e))||e);return i&&e&&u(t,o,e),e};exports.CovalentSideSheet=class extends l.CovalentDialog{constructor(){super(),this.pushed=!1,this.noPadding=!1,this.hideActions=!0}};exports.CovalentSideSheet.styles=[l.styles,d.i`
|
3
|
+
${d.r(h)}
|
4
|
+
`];s([c.e({type:Boolean,reflect:!0})],exports.CovalentSideSheet.prototype,"pushed",2);s([c.e({type:Boolean,reflect:!0})],exports.CovalentSideSheet.prototype,"noPadding",2);exports.CovalentSideSheet=s([d.e("cv-side-sheet")],exports.CovalentSideSheet);
|
package/side-sheet.mjs
CHANGED
@@ -1,7 +1,13 @@
|
|
1
|
-
import {
|
2
|
-
import {
|
1
|
+
import { i as m, r as l, e as p } from "./query-assigned-elements.mjs";
|
2
|
+
import { e as c } from "./property.mjs";
|
3
|
+
import { s as h, C as g } from "./dialog2.mjs";
|
4
|
+
import "./tslib.es6.mjs";
|
3
5
|
import "./inert.esm.mjs";
|
6
|
+
import "./base-element.mjs";
|
7
|
+
import "./utils.mjs";
|
4
8
|
import "./observer.mjs";
|
9
|
+
import "./query.mjs";
|
10
|
+
import "./class-map.mjs";
|
5
11
|
const f = `:host{--cv-side-sheet-width: 800px;--mdc-dialog-heading-ink-color: var(--mdc-theme-text-primary-on-background)}.mdc-dialog{justify-content:flex-end}.mdc-dialog .mdc-dialog__surface{border-radius:0;height:100%;min-height:inherit;max-height:inherit;min-width:var(--cv-side-sheet-width, 400px)}.mdc-dialog--opening .mdc-dialog__container{transform:translate(100%);transition:transform .15s cubic-bezier(.4,0,1,1)}.mdc-dialog--open .mdc-dialog__container{transform:translate(0)}.mdc-dialog--closing .mdc-dialog__container{opacity:1;transform:translate(100%);transition:transform .15s cubic-bezier(0,0,.2,1)}:host([pushed]) .mdc-dialog__surface{min-width:100vw}:host([noPadding]) .mdc-dialog .mdc-dialog__content{padding:0}
|
6
12
|
`;
|
7
13
|
var _ = Object.defineProperty, u = Object.getOwnPropertyDescriptor, n = (d, i, r, o) => {
|
@@ -15,9 +21,9 @@ let t = class extends g {
|
|
15
21
|
}
|
16
22
|
};
|
17
23
|
t.styles = [
|
18
|
-
|
19
|
-
|
20
|
-
${
|
24
|
+
h,
|
25
|
+
m`
|
26
|
+
${l(f)}
|
21
27
|
`
|
22
28
|
];
|
23
29
|
n([
|
@@ -27,7 +33,7 @@ n([
|
|
27
33
|
c({ type: Boolean, reflect: !0 })
|
28
34
|
], t.prototype, "noPadding", 2);
|
29
35
|
t = n([
|
30
|
-
|
36
|
+
p("cv-side-sheet")
|
31
37
|
], t);
|
32
38
|
export {
|
33
39
|
t as CovalentSideSheet
|
package/slider-range.js
CHANGED
@@ -1,15 +1,15 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("./tslib.es6.mjs"),T=require("./ripple-handlers.mjs"),v=require("./utils.mjs"),i=require("./mwc-slider.css.mjs"),l=require("./query-assigned-elements.mjs"),S=require("./property.mjs"),o=require("./state.mjs"),h=require("./query.mjs"),b=require("./class-map.mjs"),n=require("./if-defined.mjs"),p=require("./style-map.mjs");require("./base-element.mjs");require("./aria-property.mjs");require("./form-element.mjs");/**
|
2
2
|
* @license
|
3
3
|
* Copyright 2021 Google LLC
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
5
|
-
*/class
|
5
|
+
*/class s extends i.SliderBase{constructor(){super(...arguments),this.valueStart=0,this.startThumbWithIndicator=!1,this.startThumbTop=!1,this.shouldRenderStartRipple=!1,this.startThumbTransformStyle="",this.startThumbTransitionStyle="",this.startThumbCssProperties={},this.startRippleHandlers=new T.RippleHandlers(()=>(this.shouldRenderStartRipple=!0,this.startRipple))}update(t){if(t.has("valueStart")&&this.mdcFoundation){this.mdcFoundation.setValueStart(this.valueStart);const e=this.mdcFoundation.getValueStart();e!==this.valueStart&&(this.valueStart=e)}super.update(t)}renderRootEl(t){const e=b.o({"mdc-slider--disabled":this.disabled,"mdc-slider--discrete":this.discrete});return l.y`
|
6
6
|
<div
|
7
7
|
class="mdc-slider mdc-slider--range ${e}"
|
8
8
|
@pointerdown=${this.onPointerdown}
|
9
9
|
@pointerup=${this.onPointerup}
|
10
10
|
@contextmenu=${this.onContextmenu}>
|
11
11
|
${t}
|
12
|
-
</div>`}renderStartInput(){var t;return
|
12
|
+
</div>`}renderStartInput(){var t;return l.y`
|
13
13
|
<input
|
14
14
|
class="mdc-slider__input start"
|
15
15
|
type="range"
|
@@ -25,7 +25,7 @@
|
|
25
25
|
aria-labelledby=${n.l(this.ariaLabelledBy)}
|
26
26
|
aria-describedby=${n.l(this.ariaDescribedBy)}
|
27
27
|
aria-valuetext=${n.l((t=this.valueToAriaTextTransform)===null||t===void 0?void 0:t.call(this,this.valueStart))}>
|
28
|
-
`}renderEndInput(){var t;return
|
28
|
+
`}renderEndInput(){var t;return l.y`
|
29
29
|
<input
|
30
30
|
class="mdc-slider__input end"
|
31
31
|
type="range"
|
@@ -42,7 +42,7 @@
|
|
42
42
|
aria-labelledby=${n.l(this.ariaLabelledBy)}
|
43
43
|
aria-describedby=${n.l(this.ariaDescribedBy)}
|
44
44
|
aria-valuetext=${n.l((t=this.valueToAriaTextTransform)===null||t===void 0?void 0:t.call(this,this.valueEnd))}>
|
45
|
-
`}renderTrack(){const t=
|
45
|
+
`}renderTrack(){const t=p.i({"transform-origin":this.trackTransformOriginStyle,left:this.trackLeftStyle?this.trackLeftStyle:getComputedStyle(this).direction==="rtl"?"":`calc(${(this.valueStart-this.min)/(this.max-this.min)*100}%)`,right:this.trackRightStyle?this.trackRightStyle:getComputedStyle(this).direction!=="rtl"?"":`calc(${(this.valueStart-this.min)/(this.max-this.min)*100}%)`,"-webkit-transform":`scaleX(${(this.valueEnd-this.valueStart)/(this.max-this.min)})`,transform:`scaleX(${(this.valueEnd-this.valueStart)/(this.max-this.min)})`,"-webkit-transition":this.trackTransitionStyle,transition:this.trackTransitionStyle});return l.y`
|
46
46
|
<div class="mdc-slider__track">
|
47
47
|
<div class="mdc-slider__track--inactive"></div>
|
48
48
|
<div class="mdc-slider__track--active">
|
@@ -51,7 +51,7 @@
|
|
51
51
|
style=${t}>
|
52
52
|
</div>
|
53
53
|
</div>
|
54
|
-
</div>`}renderStartThumb(){const t=
|
54
|
+
</div>`}renderStartThumb(){const t=b.o({"mdc-slider__thumb--with-indicator":this.startThumbWithIndicator,"mdc-slider__thumb--top":this.startThumbTop}),e=p.i(Object.assign({"-webkit-transform":this.startThumbTransformStyle,transform:this.startThumbTransformStyle,"-webkit-transition":this.startThumbTransitionStyle,transition:this.startThumbTransitionStyle,left:this.startThumbTransformStyle||getComputedStyle(this).direction==="rtl"?"":`calc(${(this.valueStart-this.min)/(this.max-this.min)*100}% - 24px)`,right:this.startThumbTransformStyle||getComputedStyle(this).direction!=="rtl"?"":`calc(${(this.valueStart-this.min)/(this.max-this.min)*100}% - 24px)`},this.startThumbCssProperties)),r=this.shouldRenderStartRipple?l.y`<mwc-ripple class="ripple" unbounded></mwc-ripple>`:l.b;return l.y`
|
55
55
|
<div
|
56
56
|
class="mdc-slider__thumb start ${t}"
|
57
57
|
style=${e}
|
@@ -61,4 +61,4 @@
|
|
61
61
|
${this.renderValueIndicator(this.valueToValueIndicatorTransform(this.valueStart))}
|
62
62
|
<div class="mdc-slider__thumb-knob"></div>
|
63
63
|
</div>
|
64
|
-
`}createAdapter(){return{addClass:t=>{switch(t){case"mdc-slider--disabled":this.disabled=!0;break}},removeClass:t=>{switch(t){case"mdc-slider--disabled":this.disabled=!1;break}},hasClass:t=>{switch(t){case"mdc-slider--disabled":return this.disabled;case"mdc-slider--range":return!0;case"mdc-slider--discrete":return this.discrete;default:return!1}},addThumbClass:(t,e)=>{if(e===
|
64
|
+
`}createAdapter(){return{addClass:t=>{switch(t){case"mdc-slider--disabled":this.disabled=!0;break}},removeClass:t=>{switch(t){case"mdc-slider--disabled":this.disabled=!1;break}},hasClass:t=>{switch(t){case"mdc-slider--disabled":return this.disabled;case"mdc-slider--range":return!0;case"mdc-slider--discrete":return this.discrete;default:return!1}},addThumbClass:(t,e)=>{if(e===i.Thumb.START)switch(t){case"mdc-slider__thumb--with-indicator":this.startThumbWithIndicator=!0;break;case"mdc-slider__thumb--top":this.startThumbTop=!0;break}else switch(t){case"mdc-slider__thumb--with-indicator":this.endThumbWithIndicator=!0;break;case"mdc-slider__thumb--top":this.endThumbTop=!0;break}},removeThumbClass:(t,e)=>{if(e===i.Thumb.START)switch(t){case"mdc-slider__thumb--with-indicator":this.startThumbWithIndicator=!1;break;case"mdc-slider__thumb--top":this.startThumbTop=!1;break}else switch(t){case"mdc-slider__thumb--with-indicator":this.endThumbWithIndicator=!1;break;case"mdc-slider__thumb--top":this.endThumbTop=!1;break}},registerEventHandler:()=>{},deregisterEventHandler:()=>{},registerBodyEventHandler:(t,e)=>{document.body.addEventListener(t,e)},deregisterBodyEventHandler:(t,e)=>{document.body.removeEventListener(t,e)},registerInputEventHandler:(t,e,r)=>{t===i.Thumb.START?this.startInput.addEventListener(e,r):this.formElement.addEventListener(e,r)},deregisterInputEventHandler:(t,e,r)=>{t===i.Thumb.START?this.startInput.removeEventListener(e,r):this.formElement.removeEventListener(e,r)},registerThumbEventHandler:()=>{},deregisterThumbEventHandler:()=>{},registerWindowEventHandler:(t,e)=>{window.addEventListener(t,e)},deregisterWindowEventHandler:(t,e)=>{window.removeEventListener(t,e)},emitChangeEvent:(t,e)=>{const r=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:t,thumb:e}});this.dispatchEvent(r)},emitDragEndEvent:(t,e)=>{e===i.Thumb.START?this.startRippleHandlers.endPress():this.endRippleHandlers.endPress()},emitDragStartEvent:(t,e)=>{e===i.Thumb.START?this.startRippleHandlers.startPress():this.endRippleHandlers.startPress()},emitInputEvent:(t,e)=>{const r=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:t,thumb:e}});this.dispatchEvent(r)},focusInput:t=>{t===i.Thumb.START?this.startInput.focus():this.formElement.focus()},getAttribute:()=>"",getBoundingClientRect:()=>this.mdcRoot.getBoundingClientRect(),getInputAttribute:(t,e)=>{if(e===i.Thumb.START)switch(t){case"min":return this.min.toString();case"max":return this.valueEnd.toString();case"value":return this.valueStart.toString();case"step":return this.step.toString();default:return null}switch(t){case"min":return this.valueStart.toString();case"max":return this.max.toString();case"value":return this.valueEnd.toString();case"step":return this.step.toString();default:return null}},getInputValue:t=>t===i.Thumb.START?this.valueStart.toString():this.valueEnd.toString(),getThumbBoundingClientRect:t=>t===i.Thumb.START?this.startThumb.getBoundingClientRect():this.endThumb.getBoundingClientRect(),getThumbKnobWidth:t=>t===i.Thumb.START?this.startThumbKnob.getBoundingClientRect().width:this.endThumbKnob.getBoundingClientRect().width,getValueIndicatorContainerWidth:t=>t===i.Thumb.START?this.startValueIndicatorContainer.getBoundingClientRect().width:this.endValueIndicatorContainer.getBoundingClientRect().width,getValueToAriaValueTextFn:()=>this.valueToAriaTextTransform,isInputFocused:t=>{const e=v.deepActiveElementPath(),r=e[e.length-1];return t===i.Thumb.START?r===this.startInput:r===this.formElement},isRTL:()=>getComputedStyle(this).direction==="rtl",setInputAttribute:(t,e,r)=>{i.Thumb.START},removeInputAttribute:t=>{},setThumbStyleProperty:(t,e,r)=>{if(r===i.Thumb.START)switch(t){case"transform":case"-webkit-transform":this.startThumbTransformStyle=e;break;case"transition":case"-webkit-transition":this.startThumbTransitionStyle=e;break;default:t.startsWith("--")&&(this.startThumbCssProperties[t]=e)}else switch(t){case"transform":case"-webkit-transform":this.endThumbTransformStyle=e;break;case"transition":case"-webkit-transition":this.endThumbTransitionStyle=e;break;default:t.startsWith("--")&&(this.endThumbCssProperties[t]=e)}},removeThumbStyleProperty:(t,e)=>{if(e===i.Thumb.START)switch(t){case"left":case"right":break;case"transition":case"-webkit-transition":this.startThumbTransitionStyle="";break}else switch(t){case"left":case"right":break;case"transition":case"-webkit-transition":this.endThumbTransitionStyle="";break}},setTrackActiveStyleProperty:(t,e)=>{switch(t){case"transform-origin":this.trackTransformOriginStyle=e;break;case"left":this.trackLeftStyle=e;break;case"right":this.trackRightStyle=e;break;case"transform":case"-webkit-transform":break;case"transition":case"-webkit-transition":this.trackTransitionStyle=e;break}},removeTrackActiveStyleProperty:t=>{switch(t){case"transition":case"-webkit-transition":this.trackTransitionStyle="";break}},setInputValue:(t,e)=>{e===i.Thumb.START?this.valueStart=Number(t):this.valueEnd=Number(t)},setPointerCapture:t=>{this.mdcRoot.setPointerCapture(t)},setValueIndicatorText:()=>{},updateTickMarks:t=>{this.tickMarks=t}}}onStartChange(t){var e;this.valueStart=Number(t.target.value),(e=this.mdcFoundation)===null||e===void 0||e.handleInputChange(i.Thumb.START)}onStartFocus(){var t;(t=this.mdcFoundation)===null||t===void 0||t.handleInputFocus(i.Thumb.START),this.startRippleHandlers.startFocus()}onStartBlur(){var t;(t=this.mdcFoundation)===null||t===void 0||t.handleInputBlur(i.Thumb.START),this.startRippleHandlers.endFocus()}onStartMouseenter(){var t;(t=this.mdcFoundation)===null||t===void 0||t.handleThumbMouseenter(),this.startRippleHandlers.startHover()}onStartMouseleave(){var t;(t=this.mdcFoundation)===null||t===void 0||t.handleThumbMouseleave(),this.startRippleHandlers.endHover()}setFormData(t){this.name&&(t.append(`${this.name}-start`,`${this.valueStart}`),t.append(`${this.name}-end`,`${this.valueEnd}`))}}a.__decorate([h.i("input.start")],s.prototype,"startInput",void 0);a.__decorate([h.i(".start.mdc-slider__thumb")],s.prototype,"startThumb",void 0);a.__decorate([h.i(".start.mdc-slider__thumb .mdc-slider__thumb-knob")],s.prototype,"startThumbKnob",void 0);a.__decorate([h.i(".start.mdc-slider__thumb .mdc-slider__value-indicator-container")],s.prototype,"startValueIndicatorContainer",void 0);a.__decorate([T.e(".start .ripple")],s.prototype,"startRipple",void 0);a.__decorate([S.e({type:Number})],s.prototype,"valueStart",void 0);a.__decorate([o.t()],s.prototype,"startThumbWithIndicator",void 0);a.__decorate([o.t()],s.prototype,"startThumbTop",void 0);a.__decorate([o.t()],s.prototype,"shouldRenderStartRipple",void 0);a.__decorate([o.t()],s.prototype,"startThumbTransformStyle",void 0);a.__decorate([o.t()],s.prototype,"startThumbTransitionStyle",void 0);a.__decorate([o.t()],s.prototype,"startThumbCssProperties",void 0);var g=Object.defineProperty,_=Object.getOwnPropertyDescriptor,f=(u,t,e,r)=>{for(var d=r>1?void 0:r?_(t,e):t,c=u.length-1,m;c>=0;c--)(m=u[c])&&(d=(r?m(t,e,d):m(d))||d);return r&&d&&g(t,e,d),d};exports.CovalentSliderRange=class extends s{};exports.CovalentSliderRange.styles=[i.styles];exports.CovalentSliderRange=f([l.e("cv-slider-range")],exports.CovalentSliderRange);const y=exports.CovalentSliderRange;exports.default=y;
|
package/slider-range.mjs
CHANGED
@@ -1,7 +1,15 @@
|
|
1
|
-
import { _ as a
|
2
|
-
import { R as
|
3
|
-
import {
|
1
|
+
import { _ as a } from "./tslib.es6.mjs";
|
2
|
+
import { e as T, R as S } from "./ripple-handlers.mjs";
|
3
|
+
import { d as f } from "./utils.mjs";
|
4
|
+
import { S as g, T as r, s as y } from "./mwc-slider.css.mjs";
|
5
|
+
import { y as d, b as _, e as R } from "./query-assigned-elements.mjs";
|
6
|
+
import { e as k } from "./property.mjs";
|
7
|
+
import { t as l } from "./state.mjs";
|
8
|
+
import { i as u } from "./query.mjs";
|
9
|
+
import { o as b } from "./class-map.mjs";
|
4
10
|
import { l as n } from "./if-defined.mjs";
|
11
|
+
import { i as v } from "./style-map.mjs";
|
12
|
+
import "./base-element.mjs";
|
5
13
|
import "./aria-property.mjs";
|
6
14
|
import "./form-element.mjs";
|
7
15
|
/**
|
@@ -9,9 +17,9 @@ import "./form-element.mjs";
|
|
9
17
|
* Copyright 2021 Google LLC
|
10
18
|
* SPDX-License-Identifier: Apache-2.0
|
11
19
|
*/
|
12
|
-
class
|
20
|
+
class s extends g {
|
13
21
|
constructor() {
|
14
|
-
super(...arguments), this.valueStart = 0, this.startThumbWithIndicator = !1, this.startThumbTop = !1, this.shouldRenderStartRipple = !1, this.startThumbTransformStyle = "", this.startThumbTransitionStyle = "", this.startThumbCssProperties = {}, this.startRippleHandlers = new
|
22
|
+
super(...arguments), this.valueStart = 0, this.startThumbWithIndicator = !1, this.startThumbTop = !1, this.shouldRenderStartRipple = !1, this.startThumbTransformStyle = "", this.startThumbTransitionStyle = "", this.startThumbCssProperties = {}, this.startRippleHandlers = new S(() => (this.shouldRenderStartRipple = !0, this.startRipple));
|
15
23
|
}
|
16
24
|
update(t) {
|
17
25
|
if (t.has("valueStart") && this.mdcFoundation) {
|
@@ -22,11 +30,11 @@ class r extends R {
|
|
22
30
|
super.update(t);
|
23
31
|
}
|
24
32
|
renderRootEl(t) {
|
25
|
-
const e =
|
33
|
+
const e = b({
|
26
34
|
"mdc-slider--disabled": this.disabled,
|
27
35
|
"mdc-slider--discrete": this.discrete
|
28
36
|
});
|
29
|
-
return
|
37
|
+
return d`
|
30
38
|
<div
|
31
39
|
class="mdc-slider mdc-slider--range ${e}"
|
32
40
|
@pointerdown=${this.onPointerdown}
|
@@ -37,7 +45,7 @@ class r extends R {
|
|
37
45
|
}
|
38
46
|
renderStartInput() {
|
39
47
|
var t;
|
40
|
-
return
|
48
|
+
return d`
|
41
49
|
<input
|
42
50
|
class="mdc-slider__input start"
|
43
51
|
type="range"
|
@@ -57,7 +65,7 @@ class r extends R {
|
|
57
65
|
}
|
58
66
|
renderEndInput() {
|
59
67
|
var t;
|
60
|
-
return
|
68
|
+
return d`
|
61
69
|
<input
|
62
70
|
class="mdc-slider__input end"
|
63
71
|
type="range"
|
@@ -86,7 +94,7 @@ class r extends R {
|
|
86
94
|
"-webkit-transition": this.trackTransitionStyle,
|
87
95
|
transition: this.trackTransitionStyle
|
88
96
|
});
|
89
|
-
return
|
97
|
+
return d`
|
90
98
|
<div class="mdc-slider__track">
|
91
99
|
<div class="mdc-slider__track--inactive"></div>
|
92
100
|
<div class="mdc-slider__track--active">
|
@@ -98,11 +106,11 @@ class r extends R {
|
|
98
106
|
</div>`;
|
99
107
|
}
|
100
108
|
renderStartThumb() {
|
101
|
-
const t =
|
109
|
+
const t = b({
|
102
110
|
"mdc-slider__thumb--with-indicator": this.startThumbWithIndicator,
|
103
111
|
"mdc-slider__thumb--top": this.startThumbTop
|
104
|
-
}), e = v(Object.assign({ "-webkit-transform": this.startThumbTransformStyle, transform: this.startThumbTransformStyle, "-webkit-transition": this.startThumbTransitionStyle, transition: this.startThumbTransitionStyle, left: this.startThumbTransformStyle || getComputedStyle(this).direction === "rtl" ? "" : `calc(${(this.valueStart - this.min) / (this.max - this.min) * 100}% - 24px)`, right: this.startThumbTransformStyle || getComputedStyle(this).direction !== "rtl" ? "" : `calc(${(this.valueStart - this.min) / (this.max - this.min) * 100}% - 24px)` }, this.startThumbCssProperties)), i = this.shouldRenderStartRipple ?
|
105
|
-
return
|
112
|
+
}), e = v(Object.assign({ "-webkit-transform": this.startThumbTransformStyle, transform: this.startThumbTransformStyle, "-webkit-transition": this.startThumbTransitionStyle, transition: this.startThumbTransitionStyle, left: this.startThumbTransformStyle || getComputedStyle(this).direction === "rtl" ? "" : `calc(${(this.valueStart - this.min) / (this.max - this.min) * 100}% - 24px)`, right: this.startThumbTransformStyle || getComputedStyle(this).direction !== "rtl" ? "" : `calc(${(this.valueStart - this.min) / (this.max - this.min) * 100}% - 24px)` }, this.startThumbCssProperties)), i = this.shouldRenderStartRipple ? d`<mwc-ripple class="ripple" unbounded></mwc-ripple>` : _;
|
113
|
+
return d`
|
106
114
|
<div
|
107
115
|
class="mdc-slider__thumb start ${t}"
|
108
116
|
style=${e}
|
@@ -143,7 +151,7 @@ class r extends R {
|
|
143
151
|
}
|
144
152
|
},
|
145
153
|
addThumbClass: (t, e) => {
|
146
|
-
if (e ===
|
154
|
+
if (e === r.START)
|
147
155
|
switch (t) {
|
148
156
|
case "mdc-slider__thumb--with-indicator":
|
149
157
|
this.startThumbWithIndicator = !0;
|
@@ -163,7 +171,7 @@ class r extends R {
|
|
163
171
|
}
|
164
172
|
},
|
165
173
|
removeThumbClass: (t, e) => {
|
166
|
-
if (e ===
|
174
|
+
if (e === r.START)
|
167
175
|
switch (t) {
|
168
176
|
case "mdc-slider__thumb--with-indicator":
|
169
177
|
this.startThumbWithIndicator = !1;
|
@@ -193,10 +201,10 @@ class r extends R {
|
|
193
201
|
document.body.removeEventListener(t, e);
|
194
202
|
},
|
195
203
|
registerInputEventHandler: (t, e, i) => {
|
196
|
-
t ===
|
204
|
+
t === r.START ? this.startInput.addEventListener(e, i) : this.formElement.addEventListener(e, i);
|
197
205
|
},
|
198
206
|
deregisterInputEventHandler: (t, e, i) => {
|
199
|
-
t ===
|
207
|
+
t === r.START ? this.startInput.removeEventListener(e, i) : this.formElement.removeEventListener(e, i);
|
200
208
|
},
|
201
209
|
registerThumbEventHandler: () => {
|
202
210
|
},
|
@@ -213,22 +221,22 @@ class r extends R {
|
|
213
221
|
this.dispatchEvent(i);
|
214
222
|
},
|
215
223
|
emitDragEndEvent: (t, e) => {
|
216
|
-
e ===
|
224
|
+
e === r.START ? this.startRippleHandlers.endPress() : this.endRippleHandlers.endPress();
|
217
225
|
},
|
218
226
|
emitDragStartEvent: (t, e) => {
|
219
|
-
e ===
|
227
|
+
e === r.START ? this.startRippleHandlers.startPress() : this.endRippleHandlers.startPress();
|
220
228
|
},
|
221
229
|
emitInputEvent: (t, e) => {
|
222
230
|
const i = new CustomEvent("input", { bubbles: !0, composed: !0, detail: { value: t, thumb: e } });
|
223
231
|
this.dispatchEvent(i);
|
224
232
|
},
|
225
233
|
focusInput: (t) => {
|
226
|
-
t ===
|
234
|
+
t === r.START ? this.startInput.focus() : this.formElement.focus();
|
227
235
|
},
|
228
236
|
getAttribute: () => "",
|
229
237
|
getBoundingClientRect: () => this.mdcRoot.getBoundingClientRect(),
|
230
238
|
getInputAttribute: (t, e) => {
|
231
|
-
if (e ===
|
239
|
+
if (e === r.START)
|
232
240
|
switch (t) {
|
233
241
|
case "min":
|
234
242
|
return this.min.toString();
|
@@ -254,23 +262,23 @@ class r extends R {
|
|
254
262
|
return null;
|
255
263
|
}
|
256
264
|
},
|
257
|
-
getInputValue: (t) => t ===
|
258
|
-
getThumbBoundingClientRect: (t) => t ===
|
259
|
-
getThumbKnobWidth: (t) => t ===
|
260
|
-
getValueIndicatorContainerWidth: (t) => t ===
|
265
|
+
getInputValue: (t) => t === r.START ? this.valueStart.toString() : this.valueEnd.toString(),
|
266
|
+
getThumbBoundingClientRect: (t) => t === r.START ? this.startThumb.getBoundingClientRect() : this.endThumb.getBoundingClientRect(),
|
267
|
+
getThumbKnobWidth: (t) => t === r.START ? this.startThumbKnob.getBoundingClientRect().width : this.endThumbKnob.getBoundingClientRect().width,
|
268
|
+
getValueIndicatorContainerWidth: (t) => t === r.START ? this.startValueIndicatorContainer.getBoundingClientRect().width : this.endValueIndicatorContainer.getBoundingClientRect().width,
|
261
269
|
getValueToAriaValueTextFn: () => this.valueToAriaTextTransform,
|
262
270
|
isInputFocused: (t) => {
|
263
|
-
const e =
|
264
|
-
return t ===
|
271
|
+
const e = f(), i = e[e.length - 1];
|
272
|
+
return t === r.START ? i === this.startInput : i === this.formElement;
|
265
273
|
},
|
266
274
|
isRTL: () => getComputedStyle(this).direction === "rtl",
|
267
275
|
setInputAttribute: (t, e, i) => {
|
268
|
-
|
276
|
+
r.START;
|
269
277
|
},
|
270
278
|
removeInputAttribute: (t) => {
|
271
279
|
},
|
272
280
|
setThumbStyleProperty: (t, e, i) => {
|
273
|
-
if (i ===
|
281
|
+
if (i === r.START)
|
274
282
|
switch (t) {
|
275
283
|
case "transform":
|
276
284
|
case "-webkit-transform":
|
@@ -298,7 +306,7 @@ class r extends R {
|
|
298
306
|
}
|
299
307
|
},
|
300
308
|
removeThumbStyleProperty: (t, e) => {
|
301
|
-
if (e ===
|
309
|
+
if (e === r.START)
|
302
310
|
switch (t) {
|
303
311
|
case "left":
|
304
312
|
case "right":
|
@@ -348,7 +356,7 @@ class r extends R {
|
|
348
356
|
}
|
349
357
|
},
|
350
358
|
setInputValue: (t, e) => {
|
351
|
-
e ===
|
359
|
+
e === r.START ? this.valueStart = Number(t) : this.valueEnd = Number(t);
|
352
360
|
},
|
353
361
|
setPointerCapture: (t) => {
|
354
362
|
this.mdcRoot.setPointerCapture(t);
|
@@ -362,15 +370,15 @@ class r extends R {
|
|
362
370
|
}
|
363
371
|
onStartChange(t) {
|
364
372
|
var e;
|
365
|
-
this.valueStart = Number(t.target.value), (e = this.mdcFoundation) === null || e === void 0 || e.handleInputChange(
|
373
|
+
this.valueStart = Number(t.target.value), (e = this.mdcFoundation) === null || e === void 0 || e.handleInputChange(r.START);
|
366
374
|
}
|
367
375
|
onStartFocus() {
|
368
376
|
var t;
|
369
|
-
(t = this.mdcFoundation) === null || t === void 0 || t.handleInputFocus(
|
377
|
+
(t = this.mdcFoundation) === null || t === void 0 || t.handleInputFocus(r.START), this.startRippleHandlers.startFocus();
|
370
378
|
}
|
371
379
|
onStartBlur() {
|
372
380
|
var t;
|
373
|
-
(t = this.mdcFoundation) === null || t === void 0 || t.handleInputBlur(
|
381
|
+
(t = this.mdcFoundation) === null || t === void 0 || t.handleInputBlur(r.START), this.startRippleHandlers.endFocus();
|
374
382
|
}
|
375
383
|
onStartMouseenter() {
|
376
384
|
var t;
|
@@ -386,53 +394,53 @@ class r extends R {
|
|
386
394
|
}
|
387
395
|
a([
|
388
396
|
u("input.start")
|
389
|
-
],
|
397
|
+
], s.prototype, "startInput", void 0);
|
390
398
|
a([
|
391
399
|
u(".start.mdc-slider__thumb")
|
392
|
-
],
|
400
|
+
], s.prototype, "startThumb", void 0);
|
393
401
|
a([
|
394
402
|
u(".start.mdc-slider__thumb .mdc-slider__thumb-knob")
|
395
|
-
],
|
403
|
+
], s.prototype, "startThumbKnob", void 0);
|
396
404
|
a([
|
397
405
|
u(".start.mdc-slider__thumb .mdc-slider__value-indicator-container")
|
398
|
-
],
|
406
|
+
], s.prototype, "startValueIndicatorContainer", void 0);
|
399
407
|
a([
|
400
408
|
T(".start .ripple")
|
401
|
-
],
|
409
|
+
], s.prototype, "startRipple", void 0);
|
402
410
|
a([
|
403
|
-
|
404
|
-
],
|
411
|
+
k({ type: Number })
|
412
|
+
], s.prototype, "valueStart", void 0);
|
405
413
|
a([
|
406
|
-
|
407
|
-
],
|
414
|
+
l()
|
415
|
+
], s.prototype, "startThumbWithIndicator", void 0);
|
408
416
|
a([
|
409
|
-
|
410
|
-
],
|
417
|
+
l()
|
418
|
+
], s.prototype, "startThumbTop", void 0);
|
411
419
|
a([
|
412
|
-
|
413
|
-
],
|
420
|
+
l()
|
421
|
+
], s.prototype, "shouldRenderStartRipple", void 0);
|
414
422
|
a([
|
415
|
-
|
416
|
-
],
|
423
|
+
l()
|
424
|
+
], s.prototype, "startThumbTransformStyle", void 0);
|
417
425
|
a([
|
418
|
-
|
419
|
-
],
|
426
|
+
l()
|
427
|
+
], s.prototype, "startThumbTransitionStyle", void 0);
|
420
428
|
a([
|
421
|
-
|
422
|
-
],
|
429
|
+
l()
|
430
|
+
], s.prototype, "startThumbCssProperties", void 0);
|
423
431
|
var w = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, E = (c, t, e, i) => {
|
424
|
-
for (var
|
425
|
-
(
|
426
|
-
return i &&
|
432
|
+
for (var o = i > 1 ? void 0 : i ? $(t, e) : t, m = c.length - 1, p; m >= 0; m--)
|
433
|
+
(p = c[m]) && (o = (i ? p(t, e, o) : p(o)) || o);
|
434
|
+
return i && o && w(t, e, o), o;
|
427
435
|
};
|
428
|
-
let h = class extends
|
436
|
+
let h = class extends s {
|
429
437
|
};
|
430
|
-
h.styles = [
|
438
|
+
h.styles = [y];
|
431
439
|
h = E([
|
432
|
-
|
440
|
+
R("cv-slider-range")
|
433
441
|
], h);
|
434
|
-
const
|
442
|
+
const K = h;
|
435
443
|
export {
|
436
444
|
h as CovalentSliderRange,
|
437
|
-
|
445
|
+
K as default
|
438
446
|
};
|
package/slider.js
CHANGED
@@ -1,8 +1,8 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("./tslib.es6.mjs");require("./ripple-handlers.mjs");const o=require("./utils.mjs"),r=require("./mwc-slider.css.mjs"),d=require("./query-assigned-elements.mjs"),h=require("./property.mjs"),m=require("./style-map.mjs");require("./base-element.mjs");require("./state.mjs");require("./query.mjs");require("./class-map.mjs");require("./aria-property.mjs");require("./form-element.mjs");require("./if-defined.mjs");/**
|
2
2
|
* @license
|
3
3
|
* Copyright 2018 Google LLC
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
5
|
-
*/class l extends r.SliderBase{get value(){return this.valueEnd}set value(e){this.valueEnd=e}renderTrack(){const e=
|
5
|
+
*/class l extends r.SliderBase{get value(){return this.valueEnd}set value(e){this.valueEnd=e}renderTrack(){const e=m.i({"transform-origin":this.trackTransformOriginStyle,left:this.trackLeftStyle,right:this.trackRightStyle,"-webkit-transform":`scaleX(${(this.valueEnd-this.min)/(this.max-this.min)})`,transform:`scaleX(${(this.valueEnd-this.min)/(this.max-this.min)})`,"-webkit-transition":this.trackTransitionStyle,transition:this.trackTransitionStyle});return d.y`
|
6
6
|
<div class="mdc-slider__track">
|
7
7
|
<div class="mdc-slider__track--inactive"></div>
|
8
8
|
<div class="mdc-slider__track--active">
|
@@ -11,4 +11,4 @@
|
|
11
11
|
style=${e}>
|
12
12
|
</div>
|
13
13
|
</div>
|
14
|
-
</div>`}createAdapter(){return{addClass:e=>{switch(e){case"mdc-slider--disabled":this.disabled=!0;break}},removeClass:e=>{switch(e){case"mdc-slider--disabled":this.disabled=!1;break}},hasClass:e=>{switch(e){case"mdc-slider--disabled":return this.disabled;case"mdc-slider--discrete":return this.discrete;default:return!1}},addThumbClass:(e,t)=>{if(t!==r.Thumb.START)switch(e){case"mdc-slider__thumb--with-indicator":this.endThumbWithIndicator=!0;break}},removeThumbClass:(e,t)=>{if(t!==r.Thumb.START)switch(e){case"mdc-slider__thumb--with-indicator":this.endThumbWithIndicator=!1;break}},registerEventHandler:()=>{},deregisterEventHandler:()=>{},registerBodyEventHandler:(e,t)=>{document.body.addEventListener(e,t)},deregisterBodyEventHandler:(e,t)=>{document.body.removeEventListener(e,t)},registerInputEventHandler:(e,t,i)=>{e!==r.Thumb.START&&this.formElement.addEventListener(t,i)},deregisterInputEventHandler:(e,t,i)=>{e!==r.Thumb.START&&this.formElement.removeEventListener(t,i)},registerThumbEventHandler:()=>{},deregisterThumbEventHandler:()=>{},registerWindowEventHandler:(e,t)=>{window.addEventListener(e,t)},deregisterWindowEventHandler:(e,t)=>{window.addEventListener(e,t)},emitChangeEvent:(e,t)=>{if(t===r.Thumb.START)return;const i=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:e,thumb:t}});this.dispatchEvent(i)},emitDragEndEvent:(e,t)=>{t!==r.Thumb.START&&this.endRippleHandlers.endPress()},emitDragStartEvent:(e,t)=>{t!==r.Thumb.START&&this.endRippleHandlers.startPress()},emitInputEvent:(e,t)=>{if(t===r.Thumb.START)return;const i=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:e,thumb:t}});this.dispatchEvent(i)},focusInput:e=>{e!==r.Thumb.START&&this.formElement.focus()},getAttribute:()=>"",getBoundingClientRect:()=>this.mdcRoot.getBoundingClientRect(),getInputAttribute:(e,t)=>{if(t===r.Thumb.START)return null;switch(e){case"min":return this.min.toString();case"max":return this.max.toString();case"value":return this.valueEnd.toString();case"step":return this.step.toString();default:return null}},getInputValue:e=>e===r.Thumb.START?"":this.valueEnd.toString(),getThumbBoundingClientRect:e=>e===r.Thumb.START?this.getBoundingClientRect():this.endThumb.getBoundingClientRect(),getThumbKnobWidth:e=>e===r.Thumb.START?0:this.endThumbKnob.getBoundingClientRect().width,getValueIndicatorContainerWidth:e=>e===r.Thumb.START?0:this.endValueIndicatorContainer.getBoundingClientRect().width,getValueToAriaValueTextFn:()=>this.valueToAriaTextTransform,isInputFocused:e=>{if(e===r.Thumb.START)return!1;const t=
|
14
|
+
</div>`}createAdapter(){return{addClass:e=>{switch(e){case"mdc-slider--disabled":this.disabled=!0;break}},removeClass:e=>{switch(e){case"mdc-slider--disabled":this.disabled=!1;break}},hasClass:e=>{switch(e){case"mdc-slider--disabled":return this.disabled;case"mdc-slider--discrete":return this.discrete;default:return!1}},addThumbClass:(e,t)=>{if(t!==r.Thumb.START)switch(e){case"mdc-slider__thumb--with-indicator":this.endThumbWithIndicator=!0;break}},removeThumbClass:(e,t)=>{if(t!==r.Thumb.START)switch(e){case"mdc-slider__thumb--with-indicator":this.endThumbWithIndicator=!1;break}},registerEventHandler:()=>{},deregisterEventHandler:()=>{},registerBodyEventHandler:(e,t)=>{document.body.addEventListener(e,t)},deregisterBodyEventHandler:(e,t)=>{document.body.removeEventListener(e,t)},registerInputEventHandler:(e,t,i)=>{e!==r.Thumb.START&&this.formElement.addEventListener(t,i)},deregisterInputEventHandler:(e,t,i)=>{e!==r.Thumb.START&&this.formElement.removeEventListener(t,i)},registerThumbEventHandler:()=>{},deregisterThumbEventHandler:()=>{},registerWindowEventHandler:(e,t)=>{window.addEventListener(e,t)},deregisterWindowEventHandler:(e,t)=>{window.addEventListener(e,t)},emitChangeEvent:(e,t)=>{if(t===r.Thumb.START)return;const i=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:e,thumb:t}});this.dispatchEvent(i)},emitDragEndEvent:(e,t)=>{t!==r.Thumb.START&&this.endRippleHandlers.endPress()},emitDragStartEvent:(e,t)=>{t!==r.Thumb.START&&this.endRippleHandlers.startPress()},emitInputEvent:(e,t)=>{if(t===r.Thumb.START)return;const i=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:e,thumb:t}});this.dispatchEvent(i)},focusInput:e=>{e!==r.Thumb.START&&this.formElement.focus()},getAttribute:()=>"",getBoundingClientRect:()=>this.mdcRoot.getBoundingClientRect(),getInputAttribute:(e,t)=>{if(t===r.Thumb.START)return null;switch(e){case"min":return this.min.toString();case"max":return this.max.toString();case"value":return this.valueEnd.toString();case"step":return this.step.toString();default:return null}},getInputValue:e=>e===r.Thumb.START?"":this.valueEnd.toString(),getThumbBoundingClientRect:e=>e===r.Thumb.START?this.getBoundingClientRect():this.endThumb.getBoundingClientRect(),getThumbKnobWidth:e=>e===r.Thumb.START?0:this.endThumbKnob.getBoundingClientRect().width,getValueIndicatorContainerWidth:e=>e===r.Thumb.START?0:this.endValueIndicatorContainer.getBoundingClientRect().width,getValueToAriaValueTextFn:()=>this.valueToAriaTextTransform,isInputFocused:e=>{if(e===r.Thumb.START)return!1;const t=o.deepActiveElementPath();return t[t.length-1]===this.formElement},isRTL:()=>getComputedStyle(this).direction==="rtl",setInputAttribute:(e,t,i)=>{r.Thumb.START},removeInputAttribute:e=>{},setThumbStyleProperty:(e,t,i)=>{if(i!==r.Thumb.START)switch(e){case"transform":case"-webkit-transform":this.endThumbTransformStyle=t;break;case"transition":case"-webkit-transition":this.endThumbTransitionStyle=t;break;default:e.startsWith("--")&&(this.endThumbCssProperties[e]=t)}},removeThumbStyleProperty:(e,t)=>{if(t!==r.Thumb.START)switch(e){case"left":case"right":break;case"transition":case"-webkit-transition":this.endThumbTransitionStyle="";break}},setTrackActiveStyleProperty:(e,t)=>{switch(e){case"transform-origin":this.trackTransformOriginStyle=t;break;case"left":this.trackLeftStyle=t;break;case"right":this.trackRightStyle=t;break;case"transform":case"-webkit-transform":break;case"transition":case"-webkit-transition":this.trackTransitionStyle=t;break}},removeTrackActiveStyleProperty:e=>{switch(e){case"transition":case"-webkit-transition":this.trackTransitionStyle="";break}},setInputValue:(e,t)=>{t!==r.Thumb.START&&(this.valueEnd=Number(e))},setPointerCapture:e=>{this.mdcRoot.setPointerCapture(e)},setValueIndicatorText:()=>{},updateTickMarks:e=>{this.tickMarks=e}}}}c.__decorate([h.e({type:Number})],l.prototype,"value",null);var T=Object.defineProperty,b=Object.getOwnPropertyDescriptor,v=(s,e,t,i)=>{for(var n=i>1?void 0:i?b(e,t):e,a=s.length-1,u;a>=0;a--)(u=s[a])&&(n=(i?u(e,t,n):u(n))||n);return i&&n&&T(e,t,n),n};exports.CovalentSlider=class extends l{};exports.CovalentSlider.styles=[r.styles];exports.CovalentSlider=v([d.e("cv-slider")],exports.CovalentSlider);const f=exports.CovalentSlider;exports.default=f;
|