@tylertech/forge 2.2.1 → 2.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -5
- package/dist/esm/accordion/index.js +6 -5
- package/dist/esm/app-bar/help-button/index.js +9 -8
- package/dist/esm/app-bar/index.js +15 -14
- package/dist/esm/app-bar/menu-button/index.js +5 -4
- package/dist/esm/app-bar/notification-button/index.js +5 -4
- package/dist/esm/app-bar/profile-button/index.js +7 -6
- package/dist/esm/app-bar/search/index.js +4 -3
- package/dist/esm/autocomplete/index.js +10 -9
- package/dist/esm/banner/index.js +5 -4
- package/dist/esm/bottom-sheet/index.js +5 -4
- package/dist/esm/busy-indicator/index.js +5 -4
- package/dist/esm/button/index.js +3 -2
- package/dist/esm/calendar/calendar-dropdown/index.js +2 -1
- package/dist/esm/calendar/calendar-menu/index.js +2 -1
- package/dist/esm/calendar/index.js +6 -5
- package/dist/esm/checkbox/index.js +2 -1
- package/dist/esm/chip-field/index.js +7 -6
- package/dist/esm/chips/chip/index.js +5 -4
- package/dist/esm/chips/chip-set/index.js +5 -4
- package/dist/esm/chips/index.js +6 -5
- package/dist/esm/chunks/{chunk.DVYPTR7X.js → chunk.2TEHKM2X.js} +3 -3
- package/dist/esm/chunks/{chunk.DVYPTR7X.js.map → chunk.2TEHKM2X.js.map} +0 -0
- package/dist/esm/chunks/{chunk.3AK3VGRT.js → chunk.3GRDFAFV.js} +2 -2
- package/dist/esm/chunks/{chunk.3AK3VGRT.js.map → chunk.3GRDFAFV.js.map} +0 -0
- package/dist/esm/chunks/{chunk.V6TRG2CM.js → chunk.3MO6XU44.js} +2 -2
- package/dist/esm/chunks/{chunk.V6TRG2CM.js.map → chunk.3MO6XU44.js.map} +0 -0
- package/dist/esm/chunks/{chunk.47D77ELY.js → chunk.4FHBJXB7.js} +2 -2
- package/dist/esm/chunks/{chunk.47D77ELY.js.map → chunk.4FHBJXB7.js.map} +0 -0
- package/dist/esm/chunks/{chunk.DWURTRGM.js → chunk.5E6UZZKY.js} +6 -6
- package/dist/esm/chunks/{chunk.DWURTRGM.js.map → chunk.5E6UZZKY.js.map} +0 -0
- package/dist/esm/chunks/chunk.6EGTLHJS.js +16 -0
- package/dist/esm/chunks/chunk.6EGTLHJS.js.map +7 -0
- package/dist/esm/chunks/{chunk.VEC77KBM.js → chunk.AHBDISRG.js} +2 -2
- package/dist/esm/chunks/{chunk.VEC77KBM.js.map → chunk.AHBDISRG.js.map} +0 -0
- package/dist/esm/chunks/{chunk.I5JCM7RT.js → chunk.AHMBGV4N.js} +2 -2
- package/dist/esm/chunks/{chunk.I5JCM7RT.js.map → chunk.AHMBGV4N.js.map} +0 -0
- package/dist/esm/chunks/{chunk.3NOZRZ7R.js → chunk.ANNBOFGK.js} +2 -2
- package/dist/esm/chunks/{chunk.3NOZRZ7R.js.map → chunk.ANNBOFGK.js.map} +0 -0
- package/dist/esm/chunks/{chunk.4ZBBOR4H.js → chunk.APUL33GR.js} +2 -2
- package/dist/esm/chunks/{chunk.4ZBBOR4H.js.map → chunk.APUL33GR.js.map} +0 -0
- package/dist/esm/chunks/{chunk.Y2ORADJS.js → chunk.BVGIWAUP.js} +6 -6
- package/dist/esm/chunks/{chunk.Y2ORADJS.js.map → chunk.BVGIWAUP.js.map} +0 -0
- package/dist/esm/chunks/{chunk.JPARYEE4.js → chunk.CKVCNPLI.js} +23 -22
- package/dist/esm/chunks/chunk.CKVCNPLI.js.map +7 -0
- package/dist/esm/chunks/{chunk.5VNEDRVC.js → chunk.CLQS7CFC.js} +3 -3
- package/dist/esm/chunks/{chunk.5VNEDRVC.js.map → chunk.CLQS7CFC.js.map} +0 -0
- package/dist/esm/chunks/{chunk.IOKXLJST.js → chunk.DJX5CEYP.js} +4 -4
- package/dist/esm/chunks/{chunk.IOKXLJST.js.map → chunk.DJX5CEYP.js.map} +0 -0
- package/dist/esm/chunks/{chunk.YKNYR3NX.js → chunk.EJHMX24S.js} +2 -2
- package/dist/esm/chunks/{chunk.YKNYR3NX.js.map → chunk.EJHMX24S.js.map} +0 -0
- package/dist/esm/chunks/{chunk.X6O5VLTN.js → chunk.EKIW7VYG.js} +2 -2
- package/dist/esm/chunks/{chunk.X6O5VLTN.js.map → chunk.EKIW7VYG.js.map} +1 -1
- package/dist/esm/chunks/{chunk.V6Z2W3QQ.js → chunk.EL74HZRY.js} +5 -5
- package/dist/esm/chunks/{chunk.V6Z2W3QQ.js.map → chunk.EL74HZRY.js.map} +0 -0
- package/dist/esm/chunks/{chunk.LCAG7643.js → chunk.EXKNFD5S.js} +4 -4
- package/dist/esm/chunks/{chunk.LCAG7643.js.map → chunk.EXKNFD5S.js.map} +0 -0
- package/dist/esm/chunks/{chunk.W7XXZJPD.js → chunk.F2TZX24O.js} +42 -42
- package/dist/esm/chunks/{chunk.W7XXZJPD.js.map → chunk.F2TZX24O.js.map} +0 -0
- package/dist/esm/chunks/{chunk.IWXT6VVJ.js → chunk.GOWHXADJ.js} +15 -1
- package/dist/esm/chunks/chunk.GOWHXADJ.js.map +7 -0
- package/dist/esm/chunks/{chunk.B425FZOZ.js → chunk.HRZBANYY.js} +2 -2
- package/dist/esm/chunks/{chunk.B425FZOZ.js.map → chunk.HRZBANYY.js.map} +0 -0
- package/dist/esm/chunks/{chunk.VWSGCG2H.js → chunk.HZML57TK.js} +3 -3
- package/dist/esm/chunks/{chunk.VWSGCG2H.js.map → chunk.HZML57TK.js.map} +0 -0
- package/dist/esm/chunks/{chunk.5CZWANU6.js → chunk.ID2ITG5T.js} +3 -3
- package/dist/esm/chunks/{chunk.5CZWANU6.js.map → chunk.ID2ITG5T.js.map} +0 -0
- package/dist/esm/chunks/{chunk.NL6CT7BU.js → chunk.ISR3SND2.js} +2 -2
- package/dist/esm/chunks/{chunk.NL6CT7BU.js.map → chunk.ISR3SND2.js.map} +0 -0
- package/dist/esm/chunks/{chunk.XJVLHRVJ.js → chunk.JB2PM7FT.js} +2 -2
- package/dist/esm/chunks/{chunk.XJVLHRVJ.js.map → chunk.JB2PM7FT.js.map} +0 -0
- package/dist/esm/chunks/{chunk.PZ25GQD2.js → chunk.K7P3WRAY.js} +3 -3
- package/dist/esm/chunks/{chunk.PZ25GQD2.js.map → chunk.K7P3WRAY.js.map} +0 -0
- package/dist/esm/chunks/{chunk.7M3P4QES.js → chunk.L4N2DKAS.js} +6 -6
- package/dist/esm/chunks/{chunk.7M3P4QES.js.map → chunk.L4N2DKAS.js.map} +0 -0
- package/dist/esm/chunks/{chunk.C44LSSHS.js → chunk.LCVWXB3K.js} +2 -2
- package/dist/esm/chunks/{chunk.C44LSSHS.js.map → chunk.LCVWXB3K.js.map} +0 -0
- package/dist/esm/chunks/{chunk.HVD3BBQG.js → chunk.MIGASQA3.js} +2 -2
- package/dist/esm/chunks/{chunk.HVD3BBQG.js.map → chunk.MIGASQA3.js.map} +0 -0
- package/dist/esm/chunks/{chunk.RF5UPII7.js → chunk.N3ZPWKJ5.js} +6 -6
- package/dist/esm/chunks/{chunk.RF5UPII7.js.map → chunk.N3ZPWKJ5.js.map} +0 -0
- package/dist/esm/chunks/{chunk.H3WRHPWA.js → chunk.NF2CS4ZM.js} +3 -3
- package/dist/esm/chunks/{chunk.H3WRHPWA.js.map → chunk.NF2CS4ZM.js.map} +0 -0
- package/dist/esm/chunks/{chunk.ZIFMMVW6.js → chunk.NFUWLTHW.js} +3 -3
- package/dist/esm/chunks/{chunk.ZIFMMVW6.js.map → chunk.NFUWLTHW.js.map} +0 -0
- package/dist/esm/chunks/{chunk.D5HPOHQX.js → chunk.O62N7AHR.js} +2 -2
- package/dist/esm/chunks/{chunk.D5HPOHQX.js.map → chunk.O62N7AHR.js.map} +0 -0
- package/dist/esm/chunks/{chunk.IYOZSEZ3.js → chunk.P7SAJ6M7.js} +2 -2
- package/dist/esm/chunks/{chunk.IYOZSEZ3.js.map → chunk.P7SAJ6M7.js.map} +0 -0
- package/dist/esm/chunks/{chunk.3VR7VHL5.js → chunk.PM7D2SUE.js} +1 -1
- package/dist/esm/chunks/{chunk.3VR7VHL5.js.map → chunk.PM7D2SUE.js.map} +0 -0
- package/dist/esm/chunks/{chunk.KQB2BYBK.js → chunk.PQ5LOH7W.js} +3 -3
- package/dist/esm/chunks/{chunk.KQB2BYBK.js.map → chunk.PQ5LOH7W.js.map} +0 -0
- package/dist/esm/chunks/{chunk.ZPABBQEA.js → chunk.PSHHY3ER.js} +4 -4
- package/dist/esm/chunks/{chunk.ZPABBQEA.js.map → chunk.PSHHY3ER.js.map} +0 -0
- package/dist/esm/chunks/{chunk.EQCPRLUV.js → chunk.PXXLO4HJ.js} +2 -2
- package/dist/esm/chunks/{chunk.EQCPRLUV.js.map → chunk.PXXLO4HJ.js.map} +0 -0
- package/dist/esm/chunks/{chunk.MSCWHFJZ.js → chunk.QFPOG3VH.js} +5 -5
- package/dist/esm/chunks/{chunk.MSCWHFJZ.js.map → chunk.QFPOG3VH.js.map} +0 -0
- package/dist/esm/chunks/{chunk.L65L5VJ6.js → chunk.R4UKTXEK.js} +3 -3
- package/dist/esm/chunks/{chunk.L65L5VJ6.js.map → chunk.R4UKTXEK.js.map} +0 -0
- package/dist/esm/chunks/{chunk.LKUKESRQ.js → chunk.R5RVCPM2.js} +2 -2
- package/dist/esm/chunks/{chunk.LKUKESRQ.js.map → chunk.R5RVCPM2.js.map} +0 -0
- package/dist/esm/chunks/{chunk.C64YUJHS.js → chunk.S6QD4UJN.js} +2 -2
- package/dist/esm/chunks/{chunk.C64YUJHS.js.map → chunk.S6QD4UJN.js.map} +0 -0
- package/dist/esm/chunks/{chunk.P477KUJ4.js → chunk.SSFSLBBM.js} +2 -2
- package/dist/esm/chunks/{chunk.P477KUJ4.js.map → chunk.SSFSLBBM.js.map} +0 -0
- package/dist/esm/chunks/{chunk.D47KCZF7.js → chunk.SSXNS4NR.js} +4 -4
- package/dist/esm/chunks/{chunk.D47KCZF7.js.map → chunk.SSXNS4NR.js.map} +0 -0
- package/dist/esm/chunks/{chunk.RMVJBNCY.js → chunk.U2X7YAXC.js} +2 -2
- package/dist/esm/chunks/{chunk.RMVJBNCY.js.map → chunk.U2X7YAXC.js.map} +0 -0
- package/dist/esm/chunks/{chunk.BORNGK7Q.js → chunk.VDKKTHAJ.js} +2 -2
- package/dist/esm/chunks/{chunk.BORNGK7Q.js.map → chunk.VDKKTHAJ.js.map} +1 -1
- package/dist/esm/chunks/{chunk.U7HKGOBR.js → chunk.WVVWDQLQ.js} +3 -3
- package/dist/esm/chunks/{chunk.U7HKGOBR.js.map → chunk.WVVWDQLQ.js.map} +0 -0
- package/dist/esm/chunks/{chunk.UM3J4AZ7.js → chunk.XN65LPA3.js} +3 -3
- package/dist/esm/chunks/{chunk.UM3J4AZ7.js.map → chunk.XN65LPA3.js.map} +0 -0
- package/dist/esm/chunks/{chunk.D4VIYWFB.js → chunk.XPC7GINT.js} +2 -2
- package/dist/esm/chunks/{chunk.D4VIYWFB.js.map → chunk.XPC7GINT.js.map} +0 -0
- package/dist/esm/chunks/{chunk.DKHOY6QU.js → chunk.YMWBTMB6.js} +2 -2
- package/dist/esm/chunks/{chunk.DKHOY6QU.js.map → chunk.YMWBTMB6.js.map} +0 -0
- package/dist/esm/chunks/{chunk.HWWCD755.js → chunk.ZAAM3GTQ.js} +3 -3
- package/dist/esm/chunks/{chunk.HWWCD755.js.map → chunk.ZAAM3GTQ.js.map} +0 -0
- package/dist/esm/circular-progress/index.js +1 -1
- package/dist/esm/color-picker/index.js +5 -4
- package/dist/esm/core/index.js +5 -1
- package/dist/esm/core/utils/index.js +5 -1
- package/dist/esm/date-picker/index.js +8 -7
- package/dist/esm/date-range-picker/index.js +8 -7
- package/dist/esm/dialog/index.js +5 -4
- package/dist/esm/drawer/base/index.js +2 -1
- package/dist/esm/drawer/drawer/index.js +3 -2
- package/dist/esm/drawer/index.js +5 -4
- package/dist/esm/drawer/mini-drawer/index.js +3 -2
- package/dist/esm/drawer/modal-drawer/index.js +3 -2
- package/dist/esm/expansion-panel/index.js +5 -4
- package/dist/esm/file-picker/index.js +4 -3
- package/dist/esm/icon/index.js +3 -2
- package/dist/esm/icon-button/index.js +4 -3
- package/dist/esm/index.js +54 -50
- package/dist/esm/label-value/index.js +1 -1
- package/dist/esm/list-dropdown/index.js +4 -3
- package/dist/esm/menu/index.js +7 -6
- package/dist/esm/open-icon/index.js +4 -3
- package/dist/esm/paginator/index.js +12 -11
- package/dist/esm/profile-card/index.js +4 -3
- package/dist/esm/quantity-field/index.js +5 -4
- package/dist/esm/select/core/index.js +6 -5
- package/dist/esm/select/index.js +11 -10
- package/dist/esm/select/select/index.js +9 -8
- package/dist/esm/select/select-dropdown/index.js +9 -8
- package/dist/esm/slider/index.js +2 -1
- package/dist/esm/stepper/index.js +5 -4
- package/dist/esm/stepper/step/index.js +4 -3
- package/dist/esm/stepper/stepper/index.js +5 -4
- package/dist/esm/switch/index.js +2 -1
- package/dist/esm/table/index.js +6 -5
- package/dist/esm/tabs/index.js +5 -4
- package/dist/esm/tabs/tab-bar/index.js +5 -4
- package/dist/esm/time-picker/index.js +7 -6
- package/dist/esm/toast/index.js +6 -5
- package/dist/forge-dark.css +1 -1
- package/esm/circular-progress/circular-progress.js +1 -1
- package/esm/core/utils/event-utils.d.ts +12 -0
- package/esm/core/utils/event-utils.js +16 -0
- package/esm/core/utils/index.d.ts +1 -0
- package/esm/core/utils/index.js +1 -0
- package/esm/drawer/base/base-drawer-adapter.d.ts +5 -0
- package/esm/drawer/base/base-drawer-adapter.js +13 -0
- package/esm/drawer/base/base-drawer-foundation.js +2 -0
- package/esm/label-value/label-value.js +1 -1
- package/esm/select/select/select-adapter.js +12 -10
- package/esm/select/select/select-foundation.d.ts +2 -0
- package/esm/select/select/select-foundation.js +6 -2
- package/esm/select/select/select.d.ts +0 -2
- package/esm/select/select/select.js +2 -6
- package/package.json +1 -1
- package/styles/circular-progress/_mixins.scss +0 -1
- package/styles/circular-progress/_variables.scss +0 -1
- package/styles/label-value/_mixins.scss +10 -7
- package/styles/label-value/_variables.scss +1 -0
- package/styles/select/select/_selector.scss +4 -2
- package/styles/select/select/select.scss +4 -0
- package/styles/theme/_theme-values.scss +1 -1
- package/styles/theme/_theme.scss +2 -1
- package/dist/esm/chunks/chunk.IWXT6VVJ.js.map +0 -7
- package/dist/esm/chunks/chunk.JPARYEE4.js.map +0 -7
- package/styles/label-value/_base.scss +0 -252
- package/styles/label-value/_core.scss +0 -15
- package/styles/label-value/_selector.scss +0 -167
|
@@ -23,8 +23,8 @@ import {
|
|
|
23
23
|
secondsToMillis,
|
|
24
24
|
stripSecondsFromMillis,
|
|
25
25
|
timeStringToMillis
|
|
26
|
-
} from "../chunks/chunk.
|
|
27
|
-
import "../chunks/chunk.
|
|
26
|
+
} from "../chunks/chunk.L4N2DKAS.js";
|
|
27
|
+
import "../chunks/chunk.EJHMX24S.js";
|
|
28
28
|
import "../chunks/chunk.YCW56AVX.js";
|
|
29
29
|
import "../chunks/chunk.Q4YMHFRY.js";
|
|
30
30
|
import "../chunks/chunk.7I2XNJBL.js";
|
|
@@ -35,7 +35,7 @@ import "../chunks/chunk.7XGNGXLR.js";
|
|
|
35
35
|
import "../chunks/chunk.VTXXZ5KT.js";
|
|
36
36
|
import "../chunks/chunk.KCK3G74Y.js";
|
|
37
37
|
import "../chunks/chunk.2NUAEZY7.js";
|
|
38
|
-
import "../chunks/chunk.
|
|
38
|
+
import "../chunks/chunk.4FHBJXB7.js";
|
|
39
39
|
import "../chunks/chunk.EL6B2ODN.js";
|
|
40
40
|
import "../chunks/chunk.FZQCBRPK.js";
|
|
41
41
|
import "../chunks/chunk.4UKSUUTX.js";
|
|
@@ -45,20 +45,21 @@ import "../chunks/chunk.EY57VTRF.js";
|
|
|
45
45
|
import "../chunks/chunk.RNPIV3BY.js";
|
|
46
46
|
import "../chunks/chunk.LCWRP2UI.js";
|
|
47
47
|
import "../chunks/chunk.5EEEKOOK.js";
|
|
48
|
-
import "../chunks/chunk.
|
|
48
|
+
import "../chunks/chunk.XN65LPA3.js";
|
|
49
49
|
import "../chunks/chunk.C2MR3RDF.js";
|
|
50
50
|
import "../chunks/chunk.4HQ5VELO.js";
|
|
51
51
|
import "../chunks/chunk.5VKAVHLM.js";
|
|
52
52
|
import "../chunks/chunk.GS2AXUCN.js";
|
|
53
53
|
import "../chunks/chunk.BYN27JXZ.js";
|
|
54
54
|
import "../chunks/chunk.BKMWXPAS.js";
|
|
55
|
-
import "../chunks/chunk.
|
|
55
|
+
import "../chunks/chunk.3MO6XU44.js";
|
|
56
56
|
import "../chunks/chunk.6KTLOA7V.js";
|
|
57
57
|
import "../chunks/chunk.SKLCDWYQ.js";
|
|
58
58
|
import "../chunks/chunk.HZISALRH.js";
|
|
59
59
|
import "../chunks/chunk.WIYLQTSX.js";
|
|
60
60
|
import "../chunks/chunk.U6FJJGO3.js";
|
|
61
|
-
import "../chunks/chunk.
|
|
61
|
+
import "../chunks/chunk.PM7D2SUE.js";
|
|
62
|
+
import "../chunks/chunk.6EGTLHJS.js";
|
|
62
63
|
import "../chunks/chunk.WT4W2IFT.js";
|
|
63
64
|
import "../chunks/chunk.KZATVOA6.js";
|
|
64
65
|
import "../chunks/chunk.MMIZOYAS.js";
|
package/dist/esm/toast/index.js
CHANGED
|
@@ -9,20 +9,21 @@ import {
|
|
|
9
9
|
ToastComponent,
|
|
10
10
|
ToastFoundation,
|
|
11
11
|
defineToastComponent
|
|
12
|
-
} from "../chunks/chunk.
|
|
13
|
-
import "../chunks/chunk.
|
|
14
|
-
import "../chunks/chunk.
|
|
12
|
+
} from "../chunks/chunk.PSHHY3ER.js";
|
|
13
|
+
import "../chunks/chunk.SSFSLBBM.js";
|
|
14
|
+
import "../chunks/chunk.XN65LPA3.js";
|
|
15
15
|
import "../chunks/chunk.C2MR3RDF.js";
|
|
16
16
|
import "../chunks/chunk.4HQ5VELO.js";
|
|
17
17
|
import "../chunks/chunk.5VKAVHLM.js";
|
|
18
18
|
import "../chunks/chunk.GS2AXUCN.js";
|
|
19
|
-
import "../chunks/chunk.
|
|
19
|
+
import "../chunks/chunk.3MO6XU44.js";
|
|
20
20
|
import "../chunks/chunk.6KTLOA7V.js";
|
|
21
21
|
import "../chunks/chunk.SKLCDWYQ.js";
|
|
22
22
|
import "../chunks/chunk.HZISALRH.js";
|
|
23
23
|
import "../chunks/chunk.WIYLQTSX.js";
|
|
24
24
|
import "../chunks/chunk.U6FJJGO3.js";
|
|
25
|
-
import "../chunks/chunk.
|
|
25
|
+
import "../chunks/chunk.PM7D2SUE.js";
|
|
26
|
+
import "../chunks/chunk.6EGTLHJS.js";
|
|
26
27
|
import "../chunks/chunk.WT4W2IFT.js";
|
|
27
28
|
import "../chunks/chunk.KZATVOA6.js";
|
|
28
29
|
import "../chunks/chunk.MMIZOYAS.js";
|
package/dist/forge-dark.css
CHANGED
|
@@ -3,4 +3,4 @@
|
|
|
3
3
|
* Copyright 2022 Tyler Technologies, Inc.
|
|
4
4
|
* License: Apache-2.0
|
|
5
5
|
*/
|
|
6
|
-
:root{--mdc-theme-primary:#8c9eff;--mdc-theme-secondary:#ffe082;--mdc-theme-background:#212121;--mdc-theme-surface:#2c2c2c;--mdc-theme-error:#cf6679;--mdc-theme-on-primary:#000000;--mdc-theme-on-secondary:#000000;--mdc-theme-on-surface:#ffffff;--mdc-theme-on-error:#000000;--mdc-theme-text-primary-on-dark:#000000;--mdc-theme-text-primary-on-background:rgba(255, 255, 255, 0.87);--mdc-theme-text-secondary-on-background:rgba(255, 255, 255, 0.54);--mdc-theme-text-hint-on-background:rgba(255, 255, 255, 0.38);--mdc-theme-text-icon-on-background:rgba(255, 255, 255, 0.38);--mdc-theme-text-disabled-on-background:rgba(255, 255, 255, 0.12);--mdc-theme-text-disabled-on-light:rgba(255, 255, 255, 0.38);--mdc-theme-text-secondary-on-light:rgba(255, 255, 255, 0.54);--forge-theme-tertiary:#ffe082;--forge-theme-border-color
|
|
6
|
+
:root{--mdc-theme-primary:#8c9eff;--mdc-theme-secondary:#ffe082;--mdc-theme-background:#212121;--mdc-theme-surface:#2c2c2c;--mdc-theme-error:#cf6679;--mdc-theme-on-primary:#000000;--mdc-theme-on-secondary:#000000;--mdc-theme-on-surface:#ffffff;--mdc-theme-on-error:#000000;--mdc-theme-text-primary-on-dark:#000000;--mdc-theme-text-primary-on-background:rgba(255, 255, 255, 0.87);--mdc-theme-text-secondary-on-background:rgba(255, 255, 255, 0.54);--mdc-theme-text-hint-on-background:rgba(255, 255, 255, 0.38);--mdc-theme-text-icon-on-background:rgba(255, 255, 255, 0.38);--mdc-theme-text-disabled-on-background:rgba(255, 255, 255, 0.12);--mdc-theme-text-disabled-on-light:rgba(255, 255, 255, 0.38);--mdc-theme-text-secondary-on-light:rgba(255, 255, 255, 0.54);--forge-theme-tertiary:#ffe082;--forge-theme-border-color:#464646;--forge-theme-form-field-icon-disabled-on-background:rgba(255, 255, 255, 0.26);--forge-theme-form-field-disabled-on-background:#353535;--forge-theme-form-field-text-disabled-on-background:rgba(255, 255, 255, 0.6);--forge-theme-form-field-label-on-background:rgba(255, 255, 255, 0.65);--forge-theme-label-disabled-on-background:rgba(255, 255, 255, 0.38);--forge-theme-scrollbar-thumb:#757575;--forge-theme-scrollbar-thumb-hover:#9e9e9e;--forge-theme-scrollbar-track:#3a3a3a;--forge-theme-scrollbar-track-hover:#424242;--forge-theme-elevated-surface:#363636;--forge-theme-on-elevated-surface:rgba(255, 255, 255, 0.87);--forge-theme-popup-elevation:0px 8px 10px -5px rgba(0, 0, 0, 0.2),0px 16px 24px 2px rgba(0, 0, 0, 0.14),0px 6px 30px 5px rgba(0, 0, 0, 0.12);--forge-app-bar-theme-background:#212121;--forge-app-bar-theme-on-background:#ffffff;--forge-backdrop-theme-background:rgba(255, 255, 255, 0.54);--forge-skeleton-theme-gradient:rgba(255, 255, 255, 0.12);--forge-skeleton-theme-background:rgba(255, 255, 255, 0.12);--forge-linear-progress-theme-buffer:#7c704c;--forge-linear-progress-theme-buffer-dots:opacity(0.5);--forge-toast-theme-background:#eee;--forge-toast-theme-on-background:rgba(0, 0, 0, 0.87);--forge-toast-theme-action:#3d5afe;--forge-table-theme-row-hover-background:rgba(255, 255, 255, 0.04);--forge-table-theme-row-active-background:rgba(255, 255, 255, 0.08);--forge-table-theme-row-selected-background:rgba(140, 158, 255, 0.16);--forge-table-theme-row-selected-hover-background:rgba(140, 158, 255, 0.24);--forge-table-theme-row-selected-active-background:rgba(140, 158, 255, 0.32);--forge-badge-theme-default-muted-background:#ffc107;--forge-badge-theme-default-strong-background:#3f51b5;--forge-badge-theme-default-muted-color:#000000;--forge-badge-theme-default-strong-color:rgba(255, 255, 255, 0.87);--forge-badge-theme-success-muted-background:#175a2a;--forge-badge-theme-success-strong-background:#007425;--forge-badge-theme-success-muted-color:#ffffff;--forge-badge-theme-success-strong-color:#ffffff;--forge-badge-theme-warning-muted-background:#933600;--forge-badge-theme-warning-strong-background:#cc3900;--forge-badge-theme-warning-muted-color:#ffffff;--forge-badge-theme-warning-strong-color:#ffffff;--forge-badge-theme-danger-muted-background:#810022;--forge-badge-theme-danger-strong-background:#ae0019;--forge-badge-theme-danger-muted-color:#ffffff;--forge-badge-theme-danger-strong-color:#ffffff;--forge-badge-theme-info-primary-muted-background:#bbdefb;--forge-badge-theme-info-primary-muted-color:#1a237e;--forge-badge-theme-info-primary-strong-background:#1a237e;--forge-badge-theme-info-primary-strong-color:#ffffff;--forge-badge-theme-info-secondary-muted-background:#424242;--forge-badge-theme-info-secondary-strong-background:#5a5a5a;--forge-badge-theme-info-secondary-muted-color:#ffffff;--forge-badge-theme-info-secondary-strong-color:#ffffff;--forge-banner-theme-default-background:#3f51b5;--forge-banner-theme-default-font-color:#ffffff;--forge-banner-theme-default-icon-color:#ffffff;--forge-banner-theme-success-background:#175a2a;--forge-banner-theme-success-font-color:#ffffff;--forge-banner-theme-success-icon-color:#ffffff;--forge-banner-theme-warning-background:#933600;--forge-banner-theme-warning-font-color:#ffffff;--forge-banner-theme-warning-icon-color:#ffffff;--forge-banner-theme-danger-background:#810022;--forge-banner-theme-danger-font-color:#ffffff;--forge-banner-theme-danger-icon-color:#ffffff;--forge-banner-theme-info-primary-background:#0a3b71;--forge-banner-theme-info-primary-font-color:#ffffff;--forge-banner-theme-info-primary-icon-color:#ffffff;--forge-banner-theme-info-secondary-background:#424242;--forge-banner-theme-info-secondary-font-color:#ffffff;--forge-banner-theme-info-secondary-icon-color:#ffffff;--forge-inline-message-theme-success-background:#175a2a;--forge-inline-message-theme-success-font-color:#ffffff;--forge-inline-message-theme-success-icon-color:#ffffff;--forge-inline-message-theme-warning-background:#933600;--forge-inline-message-theme-warning-font-color:#ffffff;--forge-inline-message-theme-warning-icon-color:#ffffff;--forge-inline-message-theme-danger-background:#810022;--forge-inline-message-theme-danger-font-color:#ffffff;--forge-inline-message-theme-danger-icon-color:#ffffff;--forge-inline-message-theme-info-primary-background:#0a3b71;--forge-inline-message-theme-info-primary-font-color:#ffffff;--forge-inline-message-theme-info-primary-icon-color:#ffffff;--forge-inline-message-theme-info-secondary-background:#424242;--forge-inline-message-theme-info-secondary-font-color:#ffffff;--forge-inline-message-theme-info-secondary-icon-color:#ffffff;--mdc-switch-selected-handle-color:#ffc107;--mdc-switch-selected-hover-handle-color:#bf9107;--mdc-switch-selected-focus-handle-color:#bf9107;--mdc-switch-selected-pressed-handle-color:#bf9107;--mdc-switch-selected-focus-state-layer-color:#ffc107;--mdc-switch-selected-hover-state-layer-color:#ffc107;--mdc-switch-selected-pressed-state-layer-color:#ffc107;--mdc-switch-selected-focus-track-color:#fff0c1;--mdc-switch-selected-hover-track-color:#fff0c1;--mdc-switch-selected-pressed-track-color:#fff0c1;--mdc-switch-selected-track-color:#fff0c1;--mdc-switch-unselected-hover-handle-color:rgba(255, 255, 255, 0.54);--mdc-switch-unselected-focus-handle-color:rgba(255, 255, 255, 0.87);--mdc-switch-unselected-pressed-handle-color:rgba(255, 255, 255, 0.54);--mdc-switch-unselected-focus-state-layer-color:rgba(255, 255, 255, 0.87);--mdc-switch-unselected-hover-state-layer-color:rgba(255, 255, 255, 0.87);--mdc-switch-unselected-pressed-state-layer-color:rgba(255, 255, 255, 0.87);--mdc-switch-disabled-handle-opacity:0.54;--mdc-switch-disabled-selected-handle-color:#fff0c1;--mdc-switch-disabled-selected-icon-opacity:0.54;--mdc-switch-disabled-selected-track-color:#fff0c1;--mdc-switch-disabled-track-opacity:0.38;--mdc-switch-disabled-unselected-handle-color:rgba(255, 255, 255, 0.38);--mdc-switch-disabled-unselected-icon-color:on-primary;--mdc-switch-disabled-unselected-icon-opacity:0.54;--mdc-switch-disabled-unselected-track-color:rgba(255, 255, 255, 0.38)}
|
|
@@ -10,7 +10,7 @@ import { CircularProgressFoundation } from './circular-progress-foundation';
|
|
|
10
10
|
import { CIRCULAR_PROGRESS_CONSTANTS } from './circular-progress-constants';
|
|
11
11
|
import { BaseComponent } from '../core/base/base-component';
|
|
12
12
|
const template = '<template><div class=\"mdc-circular-progress mdc-circular-progress--indeterminate\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuemax=\"1\" part=\"root\"><slot></slot><div class=\"mdc-circular-progress__determinate-container\" part=\"determinate-container\"><svg class=\"mdc-circular-progress__determinate-circle-graphic\" viewBox=\"0 0 48 48\" xmlns=\"http://www.w3.org/2000/svg\" part=\"determinate-svg\"><circle class=\"mdc-circular-progress__determinate-track\" cx=\"24\" cy=\"24\" r=\"18\" stroke-width=\"4\" part=\"determinate-svg-circle-track\"/><circle class=\"mdc-circular-progress__determinate-circle\" cx=\"24\" cy=\"24\" r=\"18\" stroke-dasharray=\"113.097\" stroke-dashoffset=\"113.097\" stroke-width=\"4\" part=\"determinate-svg-circle\"/></svg></div><div class=\"mdc-circular-progress__indeterminate-container\" part=\"indeterminate-container\"><div class=\"mdc-circular-progress__spinner-layer\" part=\"spinner-container\"><div class=\"mdc-circular-progress__circle-clipper mdc-circular-progress__circle-left\" part=\"spinner-circle-left\"><svg class=\"mdc-circular-progress__indeterminate-circle-graphic\" viewBox=\"0 0 48 48\" xmlns=\"http://www.w3.org/2000/svg\" part=\"spinner-circle-left-svg\"><circle cx=\"24\" cy=\"24\" r=\"18\" stroke-dasharray=\"113.097\" stroke-dashoffset=\"56.549\" stroke-width=\"4\" part=\"spinner-circle-left-svg-circle\"/></svg></div><div class=\"mdc-circular-progress__gap-patch\" part=\"spinner-gap\"><svg class=\"mdc-circular-progress__indeterminate-circle-graphic\" viewBox=\"0 0 48 48\" xmlns=\"http://www.w3.org/2000/svg\" part=\"spinner-gap-svg\"><circle cx=\"24\" cy=\"24\" r=\"18\" stroke-dasharray=\"113.097\" stroke-dashoffset=\"56.549\" stroke-width=\"3.2\" part=\"spinner-gap-svg-circle\"/></svg></div><div class=\"mdc-circular-progress__circle-clipper mdc-circular-progress__circle-right\" part=\"spinner-circle-right\"><svg class=\"mdc-circular-progress__indeterminate-circle-graphic\" viewBox=\"0 0 48 48\" xmlns=\"http://www.w3.org/2000/svg\" part=\"spinner-circle-right-svg\"><circle cx=\"24\" cy=\"24\" r=\"18\" stroke-dasharray=\"113.097\" stroke-dashoffset=\"56.549\" stroke-width=\"4\" part=\"spinner-circle-right-svg-circle\"/></svg></div></div></div></div></template>';
|
|
13
|
-
const styles = '.mdc-circular-progress__determinate-circle,.mdc-circular-progress__indeterminate-circle-graphic{stroke:#3d5afe;stroke:var(--forge-theme-tertiary,#3d5afe)}.mdc-circular-progress__determinate-track{stroke:transparent;stroke:var(--forge-circular-progress-track-color,transparent)}@-webkit-keyframes mdc-circular-progress-container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes mdc-circular-progress-container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes mdc-circular-progress-spinner-layer-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}100%{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@keyframes mdc-circular-progress-spinner-layer-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}100%{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes mdc-circular-progress-color-1-fade-in-out{from{opacity:.99}25%{opacity:.99}26%{opacity:0}89%{opacity:0}90%{opacity:.99}to{opacity:.99}}@keyframes mdc-circular-progress-color-1-fade-in-out{from{opacity:.99}25%{opacity:.99}26%{opacity:0}89%{opacity:0}90%{opacity:.99}to{opacity:.99}}@-webkit-keyframes mdc-circular-progress-color-2-fade-in-out{from{opacity:0}15%{opacity:0}25%{opacity:.99}50%{opacity:.99}51%{opacity:0}to{opacity:0}}@keyframes mdc-circular-progress-color-2-fade-in-out{from{opacity:0}15%{opacity:0}25%{opacity:.99}50%{opacity:.99}51%{opacity:0}to{opacity:0}}@-webkit-keyframes mdc-circular-progress-color-3-fade-in-out{from{opacity:0}40%{opacity:0}50%{opacity:.99}75%{opacity:.99}76%{opacity:0}to{opacity:0}}@keyframes mdc-circular-progress-color-3-fade-in-out{from{opacity:0}40%{opacity:0}50%{opacity:.99}75%{opacity:.99}76%{opacity:0}to{opacity:0}}@-webkit-keyframes mdc-circular-progress-color-4-fade-in-out{from{opacity:0}65%{opacity:0}75%{opacity:.99}90%{opacity:.99}to{opacity:0}}@keyframes mdc-circular-progress-color-4-fade-in-out{from{opacity:0}65%{opacity:0}75%{opacity:.99}90%{opacity:.99}to{opacity:0}}@-webkit-keyframes mdc-circular-progress-left-spin{from{-webkit-transform:rotate(265deg);transform:rotate(265deg)}50%{-webkit-transform:rotate(130deg);transform:rotate(130deg)}to{-webkit-transform:rotate(265deg);transform:rotate(265deg)}}@keyframes mdc-circular-progress-left-spin{from{-webkit-transform:rotate(265deg);transform:rotate(265deg)}50%{-webkit-transform:rotate(130deg);transform:rotate(130deg)}to{-webkit-transform:rotate(265deg);transform:rotate(265deg)}}@-webkit-keyframes mdc-circular-progress-right-spin{from{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}50%{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}to{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}}@keyframes mdc-circular-progress-right-spin{from{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}50%{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}to{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}}.mdc-circular-progress{height:72px;height:var(--forge-circular-progress-size,72px);width:72px;width:var(--forge-circular-progress-size,72px);display:-webkit-inline-box;display:inline-flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;position:relative;direction:ltr;-webkit-transition:opacity 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:opacity 250ms 0s cubic-bezier(.4, 0, .6, 1)}.mdc-circular-progress circle{stroke-width:4;stroke-width:var(--forge-circular-progress-stroke-width,4)
|
|
13
|
+
const styles = '.mdc-circular-progress__determinate-circle,.mdc-circular-progress__indeterminate-circle-graphic{stroke:#3d5afe;stroke:var(--forge-theme-tertiary,#3d5afe)}.mdc-circular-progress__determinate-track{stroke:transparent;stroke:var(--forge-circular-progress-track-color,transparent)}@-webkit-keyframes mdc-circular-progress-container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes mdc-circular-progress-container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes mdc-circular-progress-spinner-layer-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}100%{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@keyframes mdc-circular-progress-spinner-layer-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}100%{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes mdc-circular-progress-color-1-fade-in-out{from{opacity:.99}25%{opacity:.99}26%{opacity:0}89%{opacity:0}90%{opacity:.99}to{opacity:.99}}@keyframes mdc-circular-progress-color-1-fade-in-out{from{opacity:.99}25%{opacity:.99}26%{opacity:0}89%{opacity:0}90%{opacity:.99}to{opacity:.99}}@-webkit-keyframes mdc-circular-progress-color-2-fade-in-out{from{opacity:0}15%{opacity:0}25%{opacity:.99}50%{opacity:.99}51%{opacity:0}to{opacity:0}}@keyframes mdc-circular-progress-color-2-fade-in-out{from{opacity:0}15%{opacity:0}25%{opacity:.99}50%{opacity:.99}51%{opacity:0}to{opacity:0}}@-webkit-keyframes mdc-circular-progress-color-3-fade-in-out{from{opacity:0}40%{opacity:0}50%{opacity:.99}75%{opacity:.99}76%{opacity:0}to{opacity:0}}@keyframes mdc-circular-progress-color-3-fade-in-out{from{opacity:0}40%{opacity:0}50%{opacity:.99}75%{opacity:.99}76%{opacity:0}to{opacity:0}}@-webkit-keyframes mdc-circular-progress-color-4-fade-in-out{from{opacity:0}65%{opacity:0}75%{opacity:.99}90%{opacity:.99}to{opacity:0}}@keyframes mdc-circular-progress-color-4-fade-in-out{from{opacity:0}65%{opacity:0}75%{opacity:.99}90%{opacity:.99}to{opacity:0}}@-webkit-keyframes mdc-circular-progress-left-spin{from{-webkit-transform:rotate(265deg);transform:rotate(265deg)}50%{-webkit-transform:rotate(130deg);transform:rotate(130deg)}to{-webkit-transform:rotate(265deg);transform:rotate(265deg)}}@keyframes mdc-circular-progress-left-spin{from{-webkit-transform:rotate(265deg);transform:rotate(265deg)}50%{-webkit-transform:rotate(130deg);transform:rotate(130deg)}to{-webkit-transform:rotate(265deg);transform:rotate(265deg)}}@-webkit-keyframes mdc-circular-progress-right-spin{from{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}50%{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}to{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}}@keyframes mdc-circular-progress-right-spin{from{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}50%{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}to{-webkit-transform:rotate(-265deg);transform:rotate(-265deg)}}.mdc-circular-progress{height:72px;height:var(--forge-circular-progress-size,72px);width:72px;width:var(--forge-circular-progress-size,72px);display:-webkit-inline-box;display:inline-flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;position:relative;direction:ltr;-webkit-transition:opacity 250ms 0s cubic-bezier(.4, 0, .6, 1);transition:opacity 250ms 0s cubic-bezier(.4, 0, .6, 1)}.mdc-circular-progress circle{stroke-width:4;stroke-width:var(--forge-circular-progress-stroke-width,4)}.mdc-circular-progress ::slotted(*){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-body1-font-size, 1rem);line-height:1.5rem;line-height:var(--mdc-typography-body1-line-height, 1.5rem);font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit)}.mdc-circular-progress__determinate-container,.mdc-circular-progress__indeterminate-circle-graphic,.mdc-circular-progress__indeterminate-container,.mdc-circular-progress__spinner-layer{position:absolute;width:100%;height:100%}.mdc-circular-progress__determinate-container{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.mdc-circular-progress__indeterminate-container{font-size:0;letter-spacing:0;white-space:nowrap;opacity:0}.mdc-circular-progress__determinate-circle-graphic,.mdc-circular-progress__indeterminate-circle-graphic{fill:transparent}.mdc-circular-progress__determinate-circle{-webkit-transition:stroke-dashoffset .5s 0s cubic-bezier(0, 0, .2, 1);transition:stroke-dashoffset .5s 0s cubic-bezier(0, 0, .2, 1)}.mdc-circular-progress__gap-patch{position:absolute;top:0;left:47.5%;-webkit-box-sizing:border-box;box-sizing:border-box;width:5%;height:100%;overflow:hidden}.mdc-circular-progress__gap-patch .mdc-circular-progress__indeterminate-circle-graphic{left:-900%;width:2000%;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.mdc-circular-progress__circle-clipper{display:-webkit-inline-box;display:inline-flex;position:relative;width:50%;height:100%;overflow:hidden}.mdc-circular-progress__circle-clipper .mdc-circular-progress__indeterminate-circle-graphic{width:200%}.mdc-circular-progress__circle-right .mdc-circular-progress__indeterminate-circle-graphic{left:-100%}.mdc-circular-progress--indeterminate .mdc-circular-progress__determinate-container{opacity:0}.mdc-circular-progress--indeterminate .mdc-circular-progress__indeterminate-container{opacity:1}.mdc-circular-progress--indeterminate .mdc-circular-progress__indeterminate-container{-webkit-animation:mdc-circular-progress-container-rotate 1.568s linear infinite;animation:mdc-circular-progress-container-rotate 1.568s linear infinite}.mdc-circular-progress--indeterminate .mdc-circular-progress__spinner-layer{-webkit-animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both;animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--indeterminate .mdc-circular-progress__color-1{-webkit-animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both;animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--indeterminate .mdc-circular-progress__color-2{-webkit-animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both;animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--indeterminate .mdc-circular-progress__color-3{-webkit-animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both;animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--indeterminate .mdc-circular-progress__color-4{-webkit-animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both;animation:mdc-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,mdc-circular-progress-color-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--indeterminate .mdc-circular-progress__circle-left .mdc-circular-progress__indeterminate-circle-graphic{animation:mdc-circular-progress-left-spin 1333ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--indeterminate .mdc-circular-progress__circle-right .mdc-circular-progress__indeterminate-circle-graphic{animation:mdc-circular-progress-right-spin 1333ms cubic-bezier(.4,0,.2,1) infinite both}.mdc-circular-progress--closed{opacity:0}';
|
|
14
14
|
let CircularProgressComponent = class CircularProgressComponent extends BaseComponent {
|
|
15
15
|
constructor() {
|
|
16
16
|
super();
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2022 Tyler Technologies, Inc.
|
|
4
|
+
* License: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Proxies a `scroll` event from an element and dispatches it from another element.
|
|
8
|
+
* Typically used when proxying the event from an element within a shadow root from its host element in the light dom.
|
|
9
|
+
* @param originalEl The element that the `scroll` event originated from.
|
|
10
|
+
* @param targetEl The element to manually dispatch (proxy) the `scroll` event from.
|
|
11
|
+
*/
|
|
12
|
+
export declare function proxyShadowScrollEvent(shadowEl: Node, proxyEl: Node): () => void;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2022 Tyler Technologies, Inc.
|
|
4
|
+
* License: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Proxies a `scroll` event from an element and dispatches it from another element.
|
|
8
|
+
* Typically used when proxying the event from an element within a shadow root from its host element in the light dom.
|
|
9
|
+
* @param originalEl The element that the `scroll` event originated from.
|
|
10
|
+
* @param targetEl The element to manually dispatch (proxy) the `scroll` event from.
|
|
11
|
+
*/
|
|
12
|
+
export function proxyShadowScrollEvent(shadowEl, proxyEl) {
|
|
13
|
+
const scrollListenerFn = () => proxyEl.dispatchEvent(new Event('scroll'));
|
|
14
|
+
shadowEl.addEventListener('scroll', scrollListenerFn, true);
|
|
15
|
+
return () => shadowEl.removeEventListener('scroll', scrollListenerFn, true);
|
|
16
|
+
}
|
package/esm/core/utils/index.js
CHANGED
|
@@ -7,6 +7,8 @@ import { BaseAdapter, IBaseAdapter } from '../../core/base/base-adapter';
|
|
|
7
7
|
import { IBaseDrawerComponent } from './base-drawer';
|
|
8
8
|
import { DrawerDirection } from './base-drawer-constants';
|
|
9
9
|
export interface IBaseDrawerAdapter extends IBaseAdapter {
|
|
10
|
+
proxyScrollEvent(): void;
|
|
11
|
+
tryUnproxyScrollEvent(): void;
|
|
10
12
|
setDirection(direction: DrawerDirection): void;
|
|
11
13
|
removeDrawerClass(className: string | string[]): void;
|
|
12
14
|
setDrawerClass(className: string | string[]): void;
|
|
@@ -16,7 +18,10 @@ export declare class BaseDrawerAdapter extends BaseAdapter<IBaseDrawerComponent>
|
|
|
16
18
|
protected _component: IBaseDrawerComponent;
|
|
17
19
|
protected _drawerElement: HTMLElement;
|
|
18
20
|
private _activeTransitionListener;
|
|
21
|
+
private _unproxyScrollEventCb;
|
|
19
22
|
constructor(_component: IBaseDrawerComponent);
|
|
23
|
+
proxyScrollEvent(): void;
|
|
24
|
+
tryUnproxyScrollEvent(): void;
|
|
20
25
|
setDirection(direction: DrawerDirection): void;
|
|
21
26
|
removeDrawerClass(className: string | string[]): void;
|
|
22
27
|
setDrawerClass(className: string | string[]): void;
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
* License: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { addClass, getShadowElement, removeClass } from '@tylertech/forge-core';
|
|
7
|
+
import { proxyShadowScrollEvent } from '../../core/utils/event-utils';
|
|
7
8
|
import { BaseAdapter } from '../../core/base/base-adapter';
|
|
8
9
|
import { BASE_DRAWER_CONSTANTS } from './base-drawer-constants';
|
|
9
10
|
export class BaseDrawerAdapter extends BaseAdapter {
|
|
@@ -12,6 +13,18 @@ export class BaseDrawerAdapter extends BaseAdapter {
|
|
|
12
13
|
this._component = _component;
|
|
13
14
|
this._drawerElement = getShadowElement(this._component, BASE_DRAWER_CONSTANTS.selectors.DRAWER);
|
|
14
15
|
}
|
|
16
|
+
proxyScrollEvent() {
|
|
17
|
+
// We proxy the scroll event because our internal scroll container does not dispatch this event outside of the shadow root to any listeners.
|
|
18
|
+
// This is a problem because if we have any components that need to react to the scroll event, such as our popup elements, they will not be
|
|
19
|
+
// notified. This will ensure we always proxy this event out from the host.
|
|
20
|
+
this.tryUnproxyScrollEvent();
|
|
21
|
+
this._unproxyScrollEventCb = proxyShadowScrollEvent(this._component.shadowRoot, this._component);
|
|
22
|
+
}
|
|
23
|
+
tryUnproxyScrollEvent() {
|
|
24
|
+
if (this._unproxyScrollEventCb) {
|
|
25
|
+
this._unproxyScrollEventCb();
|
|
26
|
+
}
|
|
27
|
+
}
|
|
15
28
|
setDirection(direction) {
|
|
16
29
|
switch (direction) {
|
|
17
30
|
case 'left':
|
|
@@ -17,9 +17,11 @@ export class BaseDrawerFoundation {
|
|
|
17
17
|
connect() {
|
|
18
18
|
this._applyOpen();
|
|
19
19
|
this._applyDirection();
|
|
20
|
+
this._adapter.proxyScrollEvent();
|
|
20
21
|
this._hasInitialized = true;
|
|
21
22
|
}
|
|
22
23
|
disconnect() {
|
|
24
|
+
this._adapter.tryUnproxyScrollEvent();
|
|
23
25
|
this._hasInitialized = false;
|
|
24
26
|
}
|
|
25
27
|
_applyDirection() {
|
|
@@ -10,7 +10,7 @@ import { LabelValueFoundation } from './label-value-foundation';
|
|
|
10
10
|
import { LABEL_VALUE_CONSTANTS } from './label-value-constants';
|
|
11
11
|
import { BaseComponent } from '../core/base/base-component';
|
|
12
12
|
const template = '<template><div class=\"forge-label-value\" part=\"root\"><div class=\"forge-label-value__icon-container\" part=\"icon-container\"><slot name=\"icon\"></slot></div><div class=\"forge-label-value__container\" part=\"container\"><div class=\"forge-label-value__label\" part=\"label-container\"><slot name=\"label\"></slot></div><div class=\"forge-label-value__value\" part=\"value-container\"><slot name=\"value\"></slot></div></div></div></template>';
|
|
13
|
-
const styles = ':host{display:block;min-width:0}:host([hidden]){display:none}.forge-label-value{display:-webkit-box;display:flex;min-height:3rem}.forge-label-value__container{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-flex:1;flex:1}.forge-label-value__icon-container{display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start}.forge-label-value__icon-container ::slotted([slot=icon]){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));font-size:1.25rem!important;margin-right:8px;margin-top:4px}.forge-label-value--align-center .forge-label-value__container{-webkit-box-align:center;align-items:center}.forge-label-value--align-right .forge-label-value__container{-webkit-box-align:end;align-items:flex-end}.forge-label-value__label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size
|
|
13
|
+
const styles = ':host{display:block;min-width:0}:host([hidden]){display:none}.forge-label-value{display:-webkit-box;display:flex;min-height:3rem}.forge-label-value__container{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-flex:1;flex:1}.forge-label-value__icon-container{display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start}.forge-label-value__icon-container ::slotted([slot=icon]){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));font-size:1.25rem!important;margin-right:8px;margin-top:4px}.forge-label-value--align-center .forge-label-value__container{-webkit-box-align:center;align-items:center}.forge-label-value--align-right .forge-label-value__container{-webkit-box-align:end;align-items:flex-end}.forge-label-value__label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.8125rem;height:.8125rem;line-height:.8125rem;margin-top:.5rem}.forge-label-value__value{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-body1-font-size, 1rem);line-height:1.5rem;line-height:var(--mdc-typography-body1-line-height, 1.5rem);font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);line-height:1rem;margin-top:.375rem}.forge-label-value--roomy{min-height:3.5rem}.forge-label-value--roomy .forge-label-value__label{margin-top:.625rem}.forge-label-value--roomy .forge-label-value__value{margin-top:.5rem}.forge-label-value--roomy ::slotted([slot=icon]){margin-top:6px}.forge-label-value--dense{min-height:1.5rem}.forge-label-value--dense .forge-label-value__container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}.forge-label-value--dense .forge-label-value__container .forge-label-value__label{margin-top:0;margin-right:8px}.forge-label-value--dense .forge-label-value__container .forge-label-value__value{margin-top:0;font-size:.875rem}.forge-label-value--dense ::slotted([slot=icon]){margin-top:2px}.forge-label-value--empty .forge-label-value__value{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-style:italic}.forge-label-value--ellipsis .forge-label-value__container{overflow:hidden}.forge-label-value--ellipsis .forge-label-value__container .forge-label-value__label,.forge-label-value--ellipsis .forge-label-value__container .forge-label-value__value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}';
|
|
14
14
|
let LabelValueComponent = class LabelValueComponent extends BaseComponent {
|
|
15
15
|
constructor() {
|
|
16
16
|
super();
|
|
@@ -28,10 +28,12 @@ export class SelectAdapter extends BaseSelectAdapter {
|
|
|
28
28
|
}
|
|
29
29
|
initializeAccessibility() {
|
|
30
30
|
this._component.setAttribute('role', 'combobox');
|
|
31
|
-
this._component.setAttribute('aria-live', 'assertive');
|
|
32
|
-
this._component.setAttribute('aria-atomic', 'true');
|
|
33
31
|
this._component.setAttribute('aria-haspopup', 'true');
|
|
34
32
|
this._component.setAttribute('aria-expanded', 'false');
|
|
33
|
+
// We need to ensure the host element receives a non-negative tabindex for our interactions to work properly
|
|
34
|
+
if (!this._component.hasAttribute('tabindex') || this._component.tabIndex === -1) {
|
|
35
|
+
this._component.tabIndex = 0;
|
|
36
|
+
}
|
|
35
37
|
}
|
|
36
38
|
initializeFloatingLabel() {
|
|
37
39
|
return new FloatingLabel(this._labelElement);
|
|
@@ -52,22 +54,22 @@ export class SelectAdapter extends BaseSelectAdapter {
|
|
|
52
54
|
toggleAttribute(this._selectedTextElement, !!value, 'placeholder', value);
|
|
53
55
|
}
|
|
54
56
|
addClickListener(listener) {
|
|
55
|
-
this.
|
|
57
|
+
this._component.addEventListener('click', listener);
|
|
56
58
|
}
|
|
57
59
|
removeClickListener(listener) {
|
|
58
|
-
this.
|
|
60
|
+
this._component.removeEventListener('click', listener);
|
|
59
61
|
}
|
|
60
62
|
addMouseDownListener(listener) {
|
|
61
|
-
this.
|
|
63
|
+
this._component.addEventListener('mousedown', listener);
|
|
62
64
|
}
|
|
63
65
|
removeMouseDownListener(listener) {
|
|
64
|
-
this.
|
|
66
|
+
this._component.removeEventListener('mousedown', listener);
|
|
65
67
|
}
|
|
66
68
|
addTargetListener(type, listener) {
|
|
67
|
-
this.
|
|
69
|
+
this._component.addEventListener(type, listener);
|
|
68
70
|
}
|
|
69
71
|
removeTargetListener(type, listener) {
|
|
70
|
-
this.
|
|
72
|
+
this._component.removeEventListener(type, listener);
|
|
71
73
|
}
|
|
72
74
|
open(config) {
|
|
73
75
|
super.open(config);
|
|
@@ -106,7 +108,7 @@ export class SelectAdapter extends BaseSelectAdapter {
|
|
|
106
108
|
setDisabled(isDisabled) {
|
|
107
109
|
toggleClass(this._selectElement, isDisabled, FIELD_CONSTANTS.classes.DISABLED);
|
|
108
110
|
toggleAttribute(this._component, isDisabled, 'aria-disabled', 'true');
|
|
109
|
-
this.
|
|
111
|
+
this._component.tabIndex = isDisabled ? -1 : 0;
|
|
110
112
|
}
|
|
111
113
|
setInvalid(isInvalid) {
|
|
112
114
|
toggleClass(this._selectElement, isInvalid, FIELD_CONSTANTS.classes.INVALID);
|
|
@@ -150,7 +152,7 @@ export class SelectAdapter extends BaseSelectAdapter {
|
|
|
150
152
|
return this._addonEndSlot.assignedNodes().length > 0;
|
|
151
153
|
}
|
|
152
154
|
setFocus() {
|
|
153
|
-
this.
|
|
155
|
+
this._component.focus();
|
|
154
156
|
}
|
|
155
157
|
isWithinSelf(element) {
|
|
156
158
|
const isShadowChild = !!this._component.shadowRoot && this._component.shadowRoot.contains(element);
|
|
@@ -61,6 +61,8 @@ export declare class SelectFoundation extends BaseSelectFoundation<ISelectAdapte
|
|
|
61
61
|
* @param {number} optionIndex The index of the selected option.
|
|
62
62
|
*/
|
|
63
63
|
protected _onSelect(option: ISelectOption, optionIndex: number, closeDropdown?: boolean): Promise<boolean>;
|
|
64
|
+
/** Updates the state of the component to contain focus. */
|
|
65
|
+
private _setFocused;
|
|
64
66
|
/** Updates the state of the component to not contain focus. */
|
|
65
67
|
private _setBlurred;
|
|
66
68
|
/** Resets the state of the component to original values. */
|
|
@@ -142,8 +142,7 @@ export class SelectFoundation extends BaseSelectFoundation {
|
|
|
142
142
|
if (this._disabled) {
|
|
143
143
|
return;
|
|
144
144
|
}
|
|
145
|
-
this.
|
|
146
|
-
this._floatLabel(true);
|
|
145
|
+
this._setFocused();
|
|
147
146
|
super._onFocus(evt);
|
|
148
147
|
}
|
|
149
148
|
_floatLabel(value) {
|
|
@@ -188,6 +187,11 @@ export class SelectFoundation extends BaseSelectFoundation {
|
|
|
188
187
|
}
|
|
189
188
|
return result;
|
|
190
189
|
}
|
|
190
|
+
/** Updates the state of the component to contain focus. */
|
|
191
|
+
_setFocused() {
|
|
192
|
+
this._adapter.addRootClass(FIELD_CONSTANTS.classes.FOCUSED);
|
|
193
|
+
this._floatLabel(true);
|
|
194
|
+
}
|
|
191
195
|
/** Updates the state of the component to not contain focus. */
|
|
192
196
|
_setBlurred() {
|
|
193
197
|
var _a;
|
|
@@ -20,8 +20,8 @@ import { ScaffoldComponent } from '../../scaffold';
|
|
|
20
20
|
import { ToolbarComponent } from '../../toolbar';
|
|
21
21
|
import { IconButtonComponent } from '../../icon-button';
|
|
22
22
|
import { FIELD_CONSTANTS } from '../../field/field-constants';
|
|
23
|
-
const template = '<template><div class=\"forge-select__wrapper\" part=\"root\"><div class=\"forge-select forge-field\" part=\"container\"><div class=\"forge-select__leading-container\" part=\"leading-container\"><slot name=\"leading\"></slot></div><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><div id=\"selected-text\" class=\"forge-select__selected-text\"
|
|
24
|
-
const styles = '.forge-select{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:relative;z-index:1;z-index:var(--forge-z-index-surface,1);margin-top:0;margin-top:var(--forge-select-margin-top,0)}.forge-select.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-select:not(.forge-field--dense):not(.forge-field--roomy){height:3rem;height:var(--forge-select-height,3rem)}.forge-select.forge-field--roomy:not(.forge-field--dense){height:3.5rem;height:var(--forge-select-height,3.5rem)}.forge-select.forge-field--dense:not(.forge-field--roomy){height:1.5rem;height:var(--forge-select-height,1.5rem)}.forge-field::before{content:\"\";display:-webkit-box;display:flex;position:absolute;top:0;right:0;left:0;z-index:-1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:100%;height:100%;pointer-events:none;border-style:solid;border-width:1px;-webkit-transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);background-color:transparent;background-color:var(--forge-select-theme-background,transparent);text-align:left}.forge-field[dir=rtl]::before,[dir=rtl] .forge-field::before{text-align:right}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused)::before{border-color:rgba(0,0,0,.38);border-color:var(--mdc-theme-text-icon-on-background,rgba(0,0,0,.38))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused):hover::before{border-color:rgba(0,0,0,.87);border-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled)::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5)}.forge-field--invalid:not(.forge-field--disabled)::before{border-color:#b00020;border-color:var(--mdc-theme-error,#b00020)}.forge-field--invalid:not(.forge-field--disabled):not(.forge-field--focused):hover::before{border-color:#db8a98;border-color:var(--forge-theme-error-hover,#db8a98)}.forge-field--disabled::before{border-color:rgba(0,0,0,.12);border-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--shape-rounded){border-radius:4px}.forge-field:not(.forge-field--shape-rounded)::before{border-radius:4px}.forge-field--shape-rounded{border-radius:28px}.forge-field--shape-rounded::before{border-radius:28px}.forge-field--disabled::before{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5)}.forge-field--focused::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5);border-width:2px}.forge-field__label-input-container{position:relative;-webkit-box-flex:1;flex:1 1 0.0001px;height:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;min-width:0}.forge-field~::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);display:block;height:auto}.forge-field~::slotted([slot=helper-text])::before{display:inline-block;width:0;height:16px;content:\"\";vertical-align:0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field--roomy:not(.forge-field--dense)~::slotted([slot=helper-text]){font-size:.875rem}.forge-field--dense:not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field~::slotted([slot=helper-text]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled)~::slotted([slot=helper-text]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field:not(.forge-field--shape-rounded)~::slotted([slot=helper-text]){margin-left:12px}.forge-field--shape-rounded~::slotted([slot=helper-text]){margin-left:32px}.forge-field ::slotted([slot=leading]){display:-webkit-box;display:flex;align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=leading]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=leading]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=leading]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=leading]){margin:0 4px}.forge-field ::slotted([slot=leading]:not(forge-icon-button)){padding:6px}.forge-field__addon-end-container{display:none}.forge-field--addon-end .forge-field__addon-end-container{height:100%;width:auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:0 4px;border-left-width:1px;border-left-style:solid;-webkit-transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.54);border-left-color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container:hover{border-left-color:rgba(0,0,0,.87);border-left-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#3f51b5;border-left-color:var(--mdc-theme-primary,#3f51b5)}.forge-field.forge-field--invalid:not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#b00020;border-left-color:var(--mdc-theme-error,#b00020)}.forge-field.forge-field--invalid:not(.forge-field--focused):not(.forge-field--disabled) .forge-field__addon-end-container:hover{border-left-color:#db8a98;border-left-color:var(--forge-theme-error-hover,#db8a98)}.forge-field.forge-field--disabled .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.12);border-left-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=addon-end]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=addon-end]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=addon-end]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-select__leading-container{display:-webkit-box;display:flex;align-self:center}.forge-field label{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65));pointer-events:none;right:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);font-size:var(--mdc-typography-subtitle1-font-size, 1rem);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.1rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;-webkit-transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field label[dir=rtl],[dir=rtl] .forge-field label{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) label{display:none}.forge-field--required label::after{content:none}.forge-field--required label::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{font-size:1rem}.forge-field--roomy:not(.forge-field--dense) label{font-size:1rem}.forge-field--disabled label{color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}.forge-field--invalid:not(.forge-field--disabled) label{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{top:1rem}.forge-field--roomy:not(.forge-field--dense) label{top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) label{left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) label{left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) label{padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded label{padding-right:32px}.forge-field label.forge-floating-label--float-above{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65))}.forge-field--disabled label.forge-floating-label--float-above{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6))}.forge-field--invalid:not(.forge-field--disabled) label.forge-floating-label--float-above{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label.forge-floating-label--float-above{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above{-webkit-transform:translateY(-.54rem) scale(.8125);transform:translateY(-.54rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above{-webkit-transform:translateY(-.72rem) scale(.8125);transform:translateY(-.72rem) scale(.8125);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.62rem) scale(1);transform:translateY(-.62rem) scale(1);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.8rem) scale(1);transform:translateY(-.8rem) scale(1);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.62rem) scale(.8125);transform:translateY(-.62rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.8rem) scale(.8125);transform:translateY(-.8rem) scale(.8125);cursor:auto}.forge-field .forge-select__selected-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));display:block;overflow:hidden;text-overflow:ellipsis;align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;white-space:nowrap;-webkit-transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);border:none;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0;font-size:var(--forge-select-font-size, 1rem);padding:0 12px;padding-right:0}.forge-field:not(.forge-field--disabled) .forge-select__selected-text{color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled .forge-select__selected-text{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{font-size:1rem}.forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{font-size:1rem}.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{font-size:.875rem}.forge-field .forge-select__selected-text{padding:0 12px}.forge-field--label .forge-select__selected-text{padding-top:24px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-top:29px}.forge-field--shape-rounded:not(.forge-field--leading) .forge-select__selected-text{padding-left:32px}.forge-field--leading .forge-select__selected-text{padding-left:0}.forge-field--label .forge-select__selected-text{padding-bottom:3px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-bottom:8px}.forge-field:not(.forge-field--label):not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height, 3rem)}.forge-field:not(.forge-field--label).forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{line-height:var(--forge-select-height-roomy, 3.5rem)}.forge-field:not(.forge-field--label).forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height-dense, 1.5rem)}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{padding:0 8px}.forge-field .forge-select__selected-text:empty::before{content:attr(placeholder);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field .forge-select__selected-text{padding-top:25px}.forge-field .forge-select__dropdown-icon{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;width:24px;height:100%;-webkit-box-flex:0;flex:none;-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);pointer-events:none;margin-right:8px}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) .forge-select__dropdown-icon{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) .forge-select__dropdown-icon{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled .forge-select__dropdown-icon{color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__dropdown-icon{margin-right:4px}:host{display:block;contain:layout}:host([hidden]){display:none}';
|
|
23
|
+
const template = '<template><div class=\"forge-select__wrapper\" part=\"root\"><div class=\"forge-select forge-field\" part=\"container\"><div class=\"forge-select__leading-container\" part=\"leading-container\"><slot name=\"leading\"></slot></div><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><div id=\"selected-text\" class=\"forge-select__selected-text\" part=\"text\"></div><label id=\"select-label\" aria-hidden=\"true\" part=\"label\"></label></div><forge-icon class=\"forge-select__dropdown-icon\" name=\"arrow_drop_down\" part=\"icon\"></forge-icon><div class=\"forge-field__addon-end-container\" part=\"addon-end-container\"><slot name=\"addon-end\"></slot></div></div><slot name=\"helper-text\"></slot></div></template>';
|
|
24
|
+
const styles = '.forge-select{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:relative;z-index:1;z-index:var(--forge-z-index-surface,1);margin-top:0;margin-top:var(--forge-select-margin-top,0)}.forge-select.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-select:not(.forge-field--dense):not(.forge-field--roomy){height:3rem;height:var(--forge-select-height,3rem)}.forge-select.forge-field--roomy:not(.forge-field--dense){height:3.5rem;height:var(--forge-select-height,3.5rem)}.forge-select.forge-field--dense:not(.forge-field--roomy){height:1.5rem;height:var(--forge-select-height,1.5rem)}.forge-field::before{content:\"\";display:-webkit-box;display:flex;position:absolute;top:0;right:0;left:0;z-index:-1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:100%;height:100%;pointer-events:none;border-style:solid;border-width:1px;-webkit-transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);background-color:transparent;background-color:var(--forge-select-theme-background,transparent);text-align:left}.forge-field[dir=rtl]::before,[dir=rtl] .forge-field::before{text-align:right}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused)::before{border-color:rgba(0,0,0,.38);border-color:var(--mdc-theme-text-icon-on-background,rgba(0,0,0,.38))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused):hover::before{border-color:rgba(0,0,0,.87);border-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled)::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5)}.forge-field--invalid:not(.forge-field--disabled)::before{border-color:#b00020;border-color:var(--mdc-theme-error,#b00020)}.forge-field--invalid:not(.forge-field--disabled):not(.forge-field--focused):hover::before{border-color:#db8a98;border-color:var(--forge-theme-error-hover,#db8a98)}.forge-field--disabled::before{border-color:rgba(0,0,0,.12);border-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--shape-rounded){border-radius:4px}.forge-field:not(.forge-field--shape-rounded)::before{border-radius:4px}.forge-field--shape-rounded{border-radius:28px}.forge-field--shape-rounded::before{border-radius:28px}.forge-field--disabled::before{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5)}.forge-field--focused::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5);border-width:2px}.forge-field__label-input-container{position:relative;-webkit-box-flex:1;flex:1 1 0.0001px;height:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;min-width:0}.forge-field~::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);display:block;height:auto}.forge-field~::slotted([slot=helper-text])::before{display:inline-block;width:0;height:16px;content:\"\";vertical-align:0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field--roomy:not(.forge-field--dense)~::slotted([slot=helper-text]){font-size:.875rem}.forge-field--dense:not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field~::slotted([slot=helper-text]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled)~::slotted([slot=helper-text]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field:not(.forge-field--shape-rounded)~::slotted([slot=helper-text]){margin-left:12px}.forge-field--shape-rounded~::slotted([slot=helper-text]){margin-left:32px}.forge-field ::slotted([slot=leading]){display:-webkit-box;display:flex;align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=leading]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=leading]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=leading]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=leading]){margin:0 4px}.forge-field ::slotted([slot=leading]:not(forge-icon-button)){padding:6px}.forge-field__addon-end-container{display:none}.forge-field--addon-end .forge-field__addon-end-container{height:100%;width:auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:0 4px;border-left-width:1px;border-left-style:solid;-webkit-transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.54);border-left-color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container:hover{border-left-color:rgba(0,0,0,.87);border-left-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#3f51b5;border-left-color:var(--mdc-theme-primary,#3f51b5)}.forge-field.forge-field--invalid:not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#b00020;border-left-color:var(--mdc-theme-error,#b00020)}.forge-field.forge-field--invalid:not(.forge-field--focused):not(.forge-field--disabled) .forge-field__addon-end-container:hover{border-left-color:#db8a98;border-left-color:var(--forge-theme-error-hover,#db8a98)}.forge-field.forge-field--disabled .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.12);border-left-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=addon-end]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=addon-end]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=addon-end]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-select__leading-container{display:-webkit-box;display:flex;align-self:center}.forge-field label{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65));pointer-events:none;right:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);font-size:var(--mdc-typography-subtitle1-font-size, 1rem);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.1rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;-webkit-transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field label[dir=rtl],[dir=rtl] .forge-field label{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) label{display:none}.forge-field--required label::after{content:none}.forge-field--required label::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{font-size:1rem}.forge-field--roomy:not(.forge-field--dense) label{font-size:1rem}.forge-field--disabled label{color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}.forge-field--invalid:not(.forge-field--disabled) label{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label{top:1rem}.forge-field--roomy:not(.forge-field--dense) label{top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) label{left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) label{left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) label{padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded label{padding-right:32px}.forge-field label.forge-floating-label--float-above{color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65))}.forge-field--disabled label.forge-floating-label--float-above{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6))}.forge-field--invalid:not(.forge-field--disabled) label.forge-floating-label--float-above{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) label.forge-floating-label--float-above{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above{-webkit-transform:translateY(-.54rem) scale(.8125);transform:translateY(-.54rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above{-webkit-transform:translateY(-.72rem) scale(.8125);transform:translateY(-.72rem) scale(.8125);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.62rem) scale(1);transform:translateY(-.62rem) scale(1);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe{-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.8rem) scale(1);transform:translateY(-.8rem) scale(1);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.62rem) scale(.8125);transform:translateY(-.62rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) label.forge-floating-label--unfloat-above-start-keyframe{-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.8rem) scale(.8125);transform:translateY(-.8rem) scale(.8125);cursor:auto}.forge-field .forge-select__selected-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));display:block;overflow:hidden;text-overflow:ellipsis;align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;white-space:nowrap;-webkit-transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);border:none;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0;font-size:var(--forge-select-font-size, 1rem);padding:0 12px;padding-right:0}.forge-field:not(.forge-field--disabled) .forge-select__selected-text{color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled .forge-select__selected-text{color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{font-size:1rem}.forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{font-size:1rem}.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{font-size:.875rem}.forge-field .forge-select__selected-text{padding:0 12px}.forge-field--label .forge-select__selected-text{padding-top:24px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-top:29px}.forge-field--shape-rounded:not(.forge-field--leading) .forge-select__selected-text{padding-left:32px}.forge-field--leading .forge-select__selected-text{padding-left:0}.forge-field--label .forge-select__selected-text{padding-bottom:3px}.forge-field--roomy.forge-field--label .forge-select__selected-text{padding-bottom:8px}.forge-field:not(.forge-field--label):not(.forge-field--dense):not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height, 3rem)}.forge-field:not(.forge-field--label).forge-field--roomy:not(.forge-field--dense) .forge-select__selected-text{line-height:var(--forge-select-height-roomy, 3.5rem)}.forge-field:not(.forge-field--label).forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{line-height:var(--forge-select-height-dense, 1.5rem)}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__selected-text{padding:0 8px}.forge-field .forge-select__selected-text:empty::before{content:attr(placeholder);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field .forge-select--label .forge-select__selected-text{padding-top:25px}.forge-field .forge-select__dropdown-icon{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;width:24px;height:100%;-webkit-box-flex:0;flex:none;-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);pointer-events:none;margin-right:8px}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-select--opened .forge-field .forge-select__dropdown-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) .forge-select__dropdown-icon{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) .forge-select__dropdown-icon{color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled .forge-select__dropdown-icon{color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field.forge-field--dense:not(.forge-field--roomy) .forge-select__dropdown-icon{margin-right:4px}:host{display:block;contain:layout}:host(:focus){outline:0}:host([hidden]){display:none}';
|
|
25
25
|
/**
|
|
26
26
|
* The custom element class behind the `<forge-select>` component.
|
|
27
27
|
*/
|
|
@@ -80,10 +80,6 @@ let SelectComponent = class SelectComponent extends BaseSelectComponent {
|
|
|
80
80
|
}
|
|
81
81
|
super.attributeChangedCallback(name, oldValue, newValue);
|
|
82
82
|
}
|
|
83
|
-
/** Sets focus to the internal button element. */
|
|
84
|
-
focus() {
|
|
85
|
-
this._foundation.setFocus();
|
|
86
|
-
}
|
|
87
83
|
};
|
|
88
84
|
__decorate([
|
|
89
85
|
FoundationProperty()
|
package/package.json
CHANGED
|
@@ -81,7 +81,6 @@
|
|
|
81
81
|
// FORGE (new): added custom properties for setting stroke-width and radius
|
|
82
82
|
circle {
|
|
83
83
|
@include theme.css-custom-property(stroke-width, --forge-circular-progress-stroke-width, variables.$stroke-width);
|
|
84
|
-
@include theme.css-custom-property(r, --forge-circular-progress-radius, variables.$radius);
|
|
85
84
|
}
|
|
86
85
|
|
|
87
86
|
::slotted(*) {
|
|
@@ -29,7 +29,6 @@ $color: tertiary !default; // FORGE (modify): use tertiary theme by default
|
|
|
29
29
|
$track-color: transparent !default;
|
|
30
30
|
$size: 72px !default; // FORGE (new): added default size
|
|
31
31
|
$stroke-width: 4; // FORGE (new): added default stroke-width
|
|
32
|
-
$radius: 22px; // FORGE (new): added default radius
|
|
33
32
|
|
|
34
33
|
/// The rotation position of the arcs that corresponds to their fully contracted state
|
|
35
34
|
$base-angle: 135deg !default;
|
|
@@ -46,14 +46,17 @@
|
|
|
46
46
|
@include mdc-typography.typography(caption);
|
|
47
47
|
@include mdc-theme.property(color, text-secondary-on-background);
|
|
48
48
|
|
|
49
|
-
font-size:
|
|
50
|
-
|
|
49
|
+
font-size: variables.$label-size;
|
|
50
|
+
height: variables.$label-size;
|
|
51
|
+
line-height: variables.$label-size;
|
|
52
|
+
margin-top: 0.5rem;
|
|
51
53
|
}
|
|
52
54
|
|
|
53
55
|
@mixin value() {
|
|
54
56
|
@include mdc-typography.typography(body1);
|
|
55
57
|
|
|
56
|
-
line-height:
|
|
58
|
+
line-height: 1rem;
|
|
59
|
+
margin-top: 0.375rem;
|
|
57
60
|
}
|
|
58
61
|
|
|
59
62
|
@mixin roomy() {
|
|
@@ -70,21 +73,21 @@
|
|
|
70
73
|
}
|
|
71
74
|
|
|
72
75
|
@mixin dense-label() {
|
|
73
|
-
|
|
76
|
+
margin-top: 0;
|
|
74
77
|
margin-right: 8px;
|
|
75
78
|
}
|
|
76
79
|
|
|
77
80
|
@mixin dense-value() {
|
|
78
|
-
|
|
81
|
+
margin-top: 0;
|
|
79
82
|
font-size: 0.875rem;
|
|
80
83
|
}
|
|
81
84
|
|
|
82
85
|
@mixin roomy-label() {
|
|
83
|
-
|
|
86
|
+
margin-top: 0.625rem;
|
|
84
87
|
}
|
|
85
88
|
|
|
86
89
|
@mixin roomy-value() {
|
|
87
|
-
|
|
90
|
+
margin-top: 0.5rem;
|
|
88
91
|
}
|
|
89
92
|
|
|
90
93
|
@mixin empty-value() {
|
|
@@ -49,8 +49,10 @@
|
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
// Padding
|
|
52
|
-
.forge-
|
|
53
|
-
|
|
52
|
+
.forge-select--label {
|
|
53
|
+
.forge-select__selected-text {
|
|
54
|
+
padding-top: 25px; // Override the default field padding styles to align text content
|
|
55
|
+
}
|
|
54
56
|
}
|
|
55
57
|
}
|
|
56
58
|
|