@tylertech/forge 2.8.0 → 2.9.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/custom-elements.json +4350 -82
- package/dist/esm/accordion/index.js +7 -7
- package/dist/esm/app-bar/help-button/index.js +9 -9
- package/dist/esm/app-bar/index.js +15 -15
- package/dist/esm/app-bar/menu-button/index.js +6 -6
- package/dist/esm/app-bar/notification-button/index.js +6 -6
- package/dist/esm/app-bar/profile-button/index.js +7 -7
- package/dist/esm/app-bar/search/index.js +5 -5
- package/dist/esm/autocomplete/index.js +13 -13
- package/dist/esm/banner/index.js +6 -6
- package/dist/esm/bottom-sheet/index.js +5 -5
- package/dist/esm/busy-indicator/index.js +4 -4
- package/dist/esm/button/index.js +3 -3
- package/dist/esm/calendar/calendar-dropdown/index.js +2 -2
- package/dist/esm/calendar/calendar-menu/index.js +2 -2
- package/dist/esm/calendar/index.js +7 -7
- package/dist/esm/checkbox/index.js +2 -2
- package/dist/esm/chip-field/index.js +9 -9
- package/dist/esm/chips/chip/index.js +6 -6
- package/dist/esm/chips/chip-set/index.js +6 -6
- package/dist/esm/chips/index.js +7 -7
- package/dist/esm/chunks/{chunk.VXVE7KEM.js → chunk.2QB3WXEH.js} +4 -4
- package/dist/esm/chunks/{chunk.VXVE7KEM.js.map → chunk.2QB3WXEH.js.map} +0 -0
- package/dist/esm/chunks/{chunk.3QXCVTCP.js → chunk.2Z23LQVW.js} +2 -2
- package/dist/esm/chunks/{chunk.3QXCVTCP.js.map → chunk.2Z23LQVW.js.map} +0 -0
- package/dist/esm/chunks/{chunk.BEAJZPWS.js → chunk.3TFBNPQF.js} +2 -2
- package/dist/esm/chunks/{chunk.BEAJZPWS.js.map → chunk.3TFBNPQF.js.map} +0 -0
- package/dist/esm/chunks/{chunk.2MBI5DLT.js → chunk.3ULPDQ2I.js} +71 -15
- package/dist/esm/chunks/chunk.3ULPDQ2I.js.map +7 -0
- package/dist/esm/chunks/{chunk.JC2PZ4TS.js → chunk.5DJS3K7V.js} +10 -8
- package/dist/esm/chunks/chunk.5DJS3K7V.js.map +7 -0
- package/dist/esm/chunks/{chunk.GHZ75UPO.js → chunk.5EBM357P.js} +3 -3
- package/dist/esm/chunks/{chunk.GHZ75UPO.js.map → chunk.5EBM357P.js.map} +0 -0
- package/dist/esm/chunks/{chunk.J5NUYQ4D.js → chunk.5XUOWRCK.js} +3 -3
- package/dist/esm/chunks/{chunk.J5NUYQ4D.js.map → chunk.5XUOWRCK.js.map} +0 -0
- package/dist/esm/chunks/{chunk.6EGTLHJS.js → chunk.65ZCTZEM.js} +6 -2
- package/dist/esm/chunks/{chunk.6EGTLHJS.js.map → chunk.65ZCTZEM.js.map} +2 -2
- package/dist/esm/chunks/chunk.A5GIQB6E.js +20 -0
- package/dist/esm/chunks/{chunk.2NMHSTAO.js.map → chunk.A5GIQB6E.js.map} +3 -3
- package/dist/esm/chunks/{chunk.PM7D2SUE.js → chunk.A6YZB7UK.js} +33 -2
- package/dist/esm/chunks/{chunk.PM7D2SUE.js.map → chunk.A6YZB7UK.js.map} +2 -2
- package/dist/esm/chunks/chunk.AJJILT3A.js +6 -0
- package/dist/esm/chunks/chunk.AJJILT3A.js.map +7 -0
- package/dist/esm/chunks/chunk.CGKWQIL3.js +1236 -0
- package/dist/esm/chunks/chunk.CGKWQIL3.js.map +7 -0
- package/dist/esm/chunks/chunk.CGOYP37Z.js +345 -0
- package/dist/esm/chunks/chunk.CGOYP37Z.js.map +7 -0
- package/dist/esm/chunks/{chunk.QYWAZCBX.js → chunk.CTMCTMRO.js} +2 -2
- package/dist/esm/chunks/{chunk.QYWAZCBX.js.map → chunk.CTMCTMRO.js.map} +0 -0
- package/dist/esm/chunks/{chunk.2NMHSTAO.js → chunk.D2AL6QLF.js} +10 -13
- package/dist/esm/chunks/chunk.D2AL6QLF.js.map +7 -0
- package/dist/esm/chunks/{chunk.U5ECVIX5.js → chunk.D3MXPNTL.js} +2 -2
- package/dist/esm/chunks/{chunk.U5ECVIX5.js.map → chunk.D3MXPNTL.js.map} +0 -0
- package/dist/esm/chunks/{chunk.HAWYW54W.js → chunk.D45QN7JA.js} +5 -5
- package/dist/esm/chunks/{chunk.HAWYW54W.js.map → chunk.D45QN7JA.js.map} +0 -0
- package/dist/esm/chunks/{chunk.2WBHHTUM.js → chunk.EFQZGAM5.js} +2 -2
- package/dist/esm/chunks/{chunk.2WBHHTUM.js.map → chunk.EFQZGAM5.js.map} +0 -0
- package/dist/esm/chunks/{chunk.BLZJIYMG.js → chunk.F5O63UF4.js} +2 -2
- package/dist/esm/chunks/{chunk.BLZJIYMG.js.map → chunk.F5O63UF4.js.map} +0 -0
- package/dist/esm/chunks/{chunk.RL7ZFLMG.js → chunk.FRT7RD5L.js} +2 -2
- package/dist/esm/chunks/{chunk.RL7ZFLMG.js.map → chunk.FRT7RD5L.js.map} +0 -0
- package/dist/esm/chunks/{chunk.LK2DN5KX.js → chunk.GG3O42UP.js} +4 -4
- package/dist/esm/chunks/{chunk.LK2DN5KX.js.map → chunk.GG3O42UP.js.map} +0 -0
- package/dist/esm/chunks/{chunk.WSH4S3GM.js → chunk.GVR5LXMJ.js} +2 -2
- package/dist/esm/chunks/{chunk.WSH4S3GM.js.map → chunk.GVR5LXMJ.js.map} +0 -0
- package/dist/esm/chunks/{chunk.LHWZ4KZU.js → chunk.HL2ORG3A.js} +4 -4
- package/dist/esm/chunks/{chunk.LHWZ4KZU.js.map → chunk.HL2ORG3A.js.map} +1 -1
- package/dist/esm/chunks/{chunk.ELAJS33V.js → chunk.J2FCOFOE.js} +2 -2
- package/dist/esm/chunks/{chunk.ELAJS33V.js.map → chunk.J2FCOFOE.js.map} +0 -0
- package/dist/esm/chunks/{chunk.PKZ43JNW.js → chunk.JM6SZSUI.js} +50 -4
- package/dist/esm/chunks/{chunk.PKZ43JNW.js.map → chunk.JM6SZSUI.js.map} +2 -2
- package/dist/esm/chunks/{chunk.VXAPRFMK.js → chunk.K4B7NJ2G.js} +4 -4
- package/dist/esm/chunks/{chunk.VXAPRFMK.js.map → chunk.K4B7NJ2G.js.map} +0 -0
- package/dist/esm/chunks/{chunk.67B6JDOJ.js → chunk.KVOXJKCU.js} +3 -3
- package/dist/esm/chunks/{chunk.67B6JDOJ.js.map → chunk.KVOXJKCU.js.map} +0 -0
- package/dist/esm/chunks/{chunk.ITQ55IPH.js → chunk.LTN47GWQ.js} +4 -4
- package/dist/esm/chunks/{chunk.ITQ55IPH.js.map → chunk.LTN47GWQ.js.map} +0 -0
- package/dist/esm/chunks/{chunk.UPW5HUKB.js → chunk.NU3XRT37.js} +5 -5
- package/dist/esm/chunks/{chunk.UPW5HUKB.js.map → chunk.NU3XRT37.js.map} +0 -0
- package/dist/esm/chunks/{chunk.I6PJGNJS.js → chunk.NWPH4FRE.js} +6 -6
- package/dist/esm/chunks/chunk.NWPH4FRE.js.map +7 -0
- package/dist/esm/chunks/{chunk.KNR5DXE4.js → chunk.OTJJU35B.js} +2 -2
- package/dist/esm/chunks/{chunk.KNR5DXE4.js.map → chunk.OTJJU35B.js.map} +0 -0
- package/dist/esm/chunks/{chunk.BVGJFMEG.js → chunk.PRRL5C6Z.js} +7 -7
- package/dist/esm/chunks/{chunk.BVGJFMEG.js.map → chunk.PRRL5C6Z.js.map} +0 -0
- package/dist/esm/chunks/{chunk.TIUNGGBF.js → chunk.QFG7SPQV.js} +3 -3
- package/dist/esm/chunks/{chunk.TIUNGGBF.js.map → chunk.QFG7SPQV.js.map} +0 -0
- package/dist/esm/chunks/{chunk.XE7ZMJBZ.js → chunk.QKCIMRRG.js} +32 -17
- package/dist/esm/chunks/chunk.QKCIMRRG.js.map +7 -0
- package/dist/esm/chunks/{chunk.IGBDDH3J.js → chunk.QRGWP6Z2.js} +3 -3
- package/dist/esm/chunks/chunk.QRGWP6Z2.js.map +7 -0
- package/dist/esm/chunks/{chunk.MUP3NY6M.js → chunk.QSFE3J74.js} +5 -5
- package/dist/esm/chunks/{chunk.MUP3NY6M.js.map → chunk.QSFE3J74.js.map} +0 -0
- package/dist/esm/chunks/{chunk.UFMUXBT4.js → chunk.R357QRWX.js} +53 -49
- package/dist/esm/chunks/chunk.R357QRWX.js.map +7 -0
- package/dist/esm/chunks/{chunk.46BED43J.js → chunk.SVS3G6Y7.js} +5 -19
- package/dist/esm/chunks/chunk.SVS3G6Y7.js.map +7 -0
- package/dist/esm/chunks/{chunk.S3UVF647.js → chunk.TBQ72CBS.js} +3 -3
- package/dist/esm/chunks/{chunk.S3UVF647.js.map → chunk.TBQ72CBS.js.map} +0 -0
- package/dist/esm/chunks/{chunk.ZSHQMR4O.js → chunk.TSHHEAIC.js} +2 -2
- package/dist/esm/chunks/{chunk.ZSHQMR4O.js.map → chunk.TSHHEAIC.js.map} +0 -0
- package/dist/esm/chunks/{chunk.EBC2HGO3.js → chunk.UAW46BWM.js} +3 -3
- package/dist/esm/chunks/{chunk.EBC2HGO3.js.map → chunk.UAW46BWM.js.map} +0 -0
- package/dist/esm/chunks/{chunk.FJJVIMZ2.js → chunk.V6ESTGWD.js} +5 -5
- package/dist/esm/chunks/chunk.V6ESTGWD.js.map +7 -0
- package/dist/esm/chunks/{chunk.5OYAJ36F.js → chunk.VLAUYV76.js} +2 -2
- package/dist/esm/chunks/{chunk.5OYAJ36F.js.map → chunk.VLAUYV76.js.map} +0 -0
- package/dist/esm/chunks/{chunk.L4OUV7W6.js → chunk.VSKPHQZE.js} +4 -4
- package/dist/esm/chunks/{chunk.L4OUV7W6.js.map → chunk.VSKPHQZE.js.map} +0 -0
- package/dist/esm/chunks/{chunk.GS2AXUCN.js → chunk.WOL4KRZK.js} +6 -1
- package/dist/esm/chunks/{chunk.GS2AXUCN.js.map → chunk.WOL4KRZK.js.map} +1 -1
- package/dist/esm/chunks/{chunk.TM46MNYN.js → chunk.WQRR5OGK.js} +5 -5
- package/dist/esm/chunks/{chunk.TM46MNYN.js.map → chunk.WQRR5OGK.js.map} +0 -0
- package/dist/esm/chunks/chunk.X2RP4QW3.js +6 -0
- package/dist/esm/chunks/chunk.X2RP4QW3.js.map +7 -0
- package/dist/esm/chunks/{chunk.K7OLG7CS.js → chunk.X3TV6IHS.js} +2 -2
- package/dist/esm/chunks/{chunk.K7OLG7CS.js.map → chunk.X3TV6IHS.js.map} +0 -0
- package/dist/esm/chunks/{chunk.U37G47LH.js → chunk.XC56O73Q.js} +6 -6
- package/dist/esm/chunks/{chunk.U37G47LH.js.map → chunk.XC56O73Q.js.map} +0 -0
- package/dist/esm/chunks/{chunk.QWW6A7AF.js → chunk.XRK62M5E.js} +2 -2
- package/dist/esm/chunks/{chunk.QWW6A7AF.js.map → chunk.XRK62M5E.js.map} +0 -0
- package/dist/esm/chunks/{chunk.ZLF2G3YT.js → chunk.XSS7BYJS.js} +3 -3
- package/dist/esm/chunks/{chunk.ZLF2G3YT.js.map → chunk.XSS7BYJS.js.map} +0 -0
- package/dist/esm/chunks/{chunk.PNKLV3BK.js → chunk.YCHKXJLN.js} +2 -2
- package/dist/esm/chunks/{chunk.PNKLV3BK.js.map → chunk.YCHKXJLN.js.map} +0 -0
- package/dist/esm/chunks/{chunk.UQ3QTUUB.js → chunk.YMP3JQQQ.js} +2 -2
- package/dist/esm/chunks/{chunk.UQ3QTUUB.js.map → chunk.YMP3JQQQ.js.map} +0 -0
- package/dist/esm/chunks/{chunk.7I2XNJBL.js → chunk.YTFOQNFU.js} +6 -16
- package/dist/esm/chunks/chunk.YTFOQNFU.js.map +7 -0
- package/dist/esm/chunks/{chunk.IJW2YKP3.js → chunk.Z5KLXKMB.js} +21 -15
- package/dist/esm/chunks/chunk.Z5KLXKMB.js.map +7 -0
- package/dist/esm/chunks/{chunk.MBZLA635.js → chunk.ZIZGRSAX.js} +6 -6
- package/dist/esm/chunks/{chunk.MBZLA635.js.map → chunk.ZIZGRSAX.js.map} +1 -1
- package/dist/esm/chunks/{chunk.CLEUHAZ6.js → chunk.ZLX3L6KW.js} +2 -2
- package/dist/esm/chunks/{chunk.CLEUHAZ6.js.map → chunk.ZLX3L6KW.js.map} +0 -0
- package/dist/esm/color-picker/index.js +6 -6
- package/dist/esm/core/index.js +14 -2
- package/dist/esm/core/utils/index.js +14 -2
- package/dist/esm/date-picker/index.js +11 -11
- package/dist/esm/date-range-picker/index.js +11 -11
- package/dist/esm/dialog/index.js +5 -5
- package/dist/esm/drawer/base/index.js +2 -2
- package/dist/esm/drawer/drawer/index.js +3 -3
- package/dist/esm/drawer/index.js +5 -5
- package/dist/esm/drawer/mini-drawer/index.js +3 -3
- package/dist/esm/drawer/modal-drawer/index.js +3 -3
- package/dist/esm/expansion-panel/index.js +6 -6
- package/dist/esm/file-picker/index.js +4 -4
- package/dist/esm/icon/index.js +3 -3
- package/dist/esm/icon-button/index.js +4 -4
- package/dist/esm/index.js +168 -93
- package/dist/esm/list-dropdown/index.js +5 -5
- package/dist/esm/menu/index.js +7 -7
- package/dist/esm/open-icon/index.js +5 -5
- package/dist/esm/paginator/index.js +12 -12
- package/dist/esm/profile-card/index.js +4 -4
- package/dist/esm/quantity-field/index.js +6 -7
- package/dist/esm/select/core/index.js +7 -7
- package/dist/esm/select/index.js +11 -11
- package/dist/esm/select/select/index.js +9 -9
- package/dist/esm/select/select-dropdown/index.js +9 -9
- package/dist/esm/slider/index.js +2 -2
- package/dist/esm/split-view/core/index.js +7 -0
- package/dist/esm/split-view/core/index.js.map +7 -0
- package/dist/esm/split-view/index.js +92 -0
- package/dist/esm/split-view/index.js.map +7 -0
- package/dist/esm/split-view/split-view/index.js +44 -0
- package/dist/esm/split-view/split-view/index.js.map +7 -0
- package/dist/esm/split-view/split-view-panel/index.js +78 -0
- package/dist/esm/split-view/split-view-panel/index.js.map +7 -0
- package/dist/esm/stepper/index.js +6 -6
- package/dist/esm/stepper/step/index.js +5 -5
- package/dist/esm/stepper/stepper/index.js +6 -6
- package/dist/esm/switch/index.js +2 -2
- package/dist/esm/table/index.js +7 -7
- package/dist/esm/tabs/index.js +6 -6
- package/dist/esm/tabs/tab-bar/index.js +6 -6
- package/dist/esm/text-field/index.js +2 -2
- package/dist/esm/time-picker/index.js +11 -10
- package/dist/esm/toast/index.js +7 -7
- package/esm/app-bar/profile-button/app-bar-profile-button-adapter.d.ts +6 -1
- package/esm/app-bar/profile-button/app-bar-profile-button-adapter.js +30 -12
- package/esm/app-bar/profile-button/app-bar-profile-button-constants.d.ts +4 -0
- package/esm/app-bar/profile-button/app-bar-profile-button-constants.js +2 -0
- package/esm/app-bar/profile-button/app-bar-profile-button-foundation.d.ts +8 -0
- package/esm/app-bar/profile-button/app-bar-profile-button-foundation.js +22 -0
- package/esm/app-bar/profile-button/app-bar-profile-button.d.ts +4 -0
- package/esm/app-bar/profile-button/app-bar-profile-button.js +14 -0
- package/esm/autocomplete/autocomplete-adapter.d.ts +2 -0
- package/esm/autocomplete/autocomplete-adapter.js +4 -0
- package/esm/autocomplete/autocomplete-foundation.js +10 -7
- package/esm/chip-field/chip-field-adapter.d.ts +1 -1
- package/esm/chip-field/chip-field-adapter.js +2 -2
- package/esm/chip-field/chip-field.js +1 -1
- package/esm/chips/chip/chip.js +1 -1
- package/esm/core/utils/event-utils.d.ts +1 -0
- package/esm/core/utils/event-utils.js +3 -0
- package/esm/core/utils/utils.d.ts +36 -0
- package/esm/core/utils/utils.js +57 -0
- package/esm/date-picker/date-picker-foundation.js +3 -1
- package/esm/field/field-adapter.d.ts +4 -4
- package/esm/field/field-adapter.js +4 -13
- package/esm/field/field-foundation.js +2 -2
- package/esm/index.d.ts +1 -0
- package/esm/index.js +3 -0
- package/esm/profile-card/profile-card-adapter.d.ts +4 -0
- package/esm/profile-card/profile-card-adapter.js +6 -0
- package/esm/profile-card/profile-card-constants.d.ts +4 -0
- package/esm/profile-card/profile-card-constants.js +5 -1
- package/esm/profile-card/profile-card-foundation.d.ts +6 -0
- package/esm/profile-card/profile-card-foundation.js +22 -0
- package/esm/profile-card/profile-card.d.ts +4 -0
- package/esm/profile-card/profile-card.js +15 -1
- package/esm/quantity-field/quantity-field-adapter.d.ts +0 -2
- package/esm/quantity-field/quantity-field-adapter.js +1 -13
- package/esm/quantity-field/quantity-field-foundation.js +0 -1
- package/esm/quantity-field/quantity-field.js +1 -1
- package/esm/select/select/select.js +1 -1
- package/esm/split-view/core/index.d.ts +6 -0
- package/esm/split-view/core/index.js +6 -0
- package/esm/split-view/core/split-view-base.d.ts +14 -0
- package/esm/split-view/core/split-view-base.js +6 -0
- package/esm/split-view/index.d.ts +8 -0
- package/esm/split-view/index.js +8 -0
- package/esm/split-view/split-view/index.d.ts +10 -0
- package/esm/split-view/split-view/index.js +14 -0
- package/esm/split-view/split-view/split-view-adapter.d.ts +29 -0
- package/esm/split-view/split-view/split-view-adapter.js +62 -0
- package/esm/split-view/split-view/split-view-constants.d.ts +41 -0
- package/esm/split-view/split-view/split-view-constants.js +40 -0
- package/esm/split-view/split-view/split-view-foundation.d.ts +86 -0
- package/esm/split-view/split-view/split-view-foundation.js +179 -0
- package/esm/split-view/split-view/split-view.d.ts +67 -0
- package/esm/split-view/split-view/split-view.js +103 -0
- package/esm/split-view/split-view-panel/index.d.ts +11 -0
- package/esm/split-view/split-view-panel/index.js +15 -0
- package/esm/split-view/split-view-panel/split-view-panel-adapter.d.ts +171 -0
- package/esm/split-view/split-view-panel/split-view-panel-adapter.js +295 -0
- package/esm/split-view/split-view-panel/split-view-panel-constants.d.ts +97 -0
- package/esm/split-view/split-view-panel/split-view-panel-constants.js +78 -0
- package/esm/split-view/split-view-panel/split-view-panel-foundation.d.ts +235 -0
- package/esm/split-view/split-view-panel/split-view-panel-foundation.js +667 -0
- package/esm/split-view/split-view-panel/split-view-panel-utils.d.ts +130 -0
- package/esm/split-view/split-view-panel/split-view-panel-utils.js +300 -0
- package/esm/split-view/split-view-panel/split-view-panel.d.ts +105 -0
- package/esm/split-view/split-view-panel/split-view-panel.js +173 -0
- package/esm/table/table-utils.d.ts +2 -2
- package/esm/table/table-utils.js +30 -14
- package/esm/text-field/text-field-adapter.d.ts +1 -1
- package/esm/text-field/text-field-adapter.js +2 -2
- package/esm/text-field/text-field.js +1 -1
- package/package.json +2 -2
- package/styles/chip-field/_base.scss +2 -2
- package/styles/chip-field/_selector.scss +1 -1
- package/styles/chip-field/_variables.scss +1 -1
- package/styles/chips/chip/_mixins.scss +4 -3
- package/styles/chips/chip/_variables.scss +3 -2
- package/styles/field/_base.scss +16 -4
- package/styles/field/_selector.scss +4 -4
- package/styles/quantity-field/_mixins.scss +1 -1
- package/styles/select/select/_selector.scss +1 -1
- package/styles/split-view/split-view/_mixins.scss +48 -0
- package/styles/split-view/split-view/split-view.scss +25 -0
- package/styles/split-view/split-view-panel/_mixins.scss +260 -0
- package/styles/split-view/split-view-panel/_variables.scss +7 -0
- package/styles/split-view/split-view-panel/split-view-panel.scss +23 -0
- package/dist/esm/chunks/chunk.2MBI5DLT.js.map +0 -7
- package/dist/esm/chunks/chunk.46BED43J.js.map +0 -7
- package/dist/esm/chunks/chunk.7I2XNJBL.js.map +0 -7
- package/dist/esm/chunks/chunk.FJJVIMZ2.js.map +0 -7
- package/dist/esm/chunks/chunk.I6PJGNJS.js.map +0 -7
- package/dist/esm/chunks/chunk.IGBDDH3J.js.map +0 -7
- package/dist/esm/chunks/chunk.IJW2YKP3.js.map +0 -7
- package/dist/esm/chunks/chunk.JC2PZ4TS.js.map +0 -7
- package/dist/esm/chunks/chunk.UFMUXBT4.js.map +0 -7
- package/dist/esm/chunks/chunk.XE7ZMJBZ.js.map +0 -7
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2022 Tyler Technologies, Inc.
|
|
4
|
+
* License: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
import { __decorate } from "tslib";
|
|
7
|
+
import { CustomElement, attachShadowTemplate, FoundationProperty, coerceBoolean, coerceNumber } from '@tylertech/forge-core';
|
|
8
|
+
import { tylIconDragVerticalVariant } from '@tylertech/tyler-icons/extended';
|
|
9
|
+
import { tylIconDragHandle } from '@tylertech/tyler-icons/standard';
|
|
10
|
+
import { BaseComponent } from '../../core/base/base-component';
|
|
11
|
+
import { SPLIT_VIEW_PANEL_CONSTANTS } from './split-view-panel-constants';
|
|
12
|
+
import { SplitViewPanelFoundation } from './split-view-panel-foundation';
|
|
13
|
+
import { SplitViewPanelAdapter } from './split-view-panel-adapter';
|
|
14
|
+
import { IconComponent, IconRegistry } from '../../icon';
|
|
15
|
+
import { RippleComponent } from '../../ripple';
|
|
16
|
+
const template = '<template><div class=\"forge-split-view-panel\" id=\"root\" part=\"root\"><div class=\"forge-split-view-panel__handle\" id=\"handle\" part=\"handle\" role=\"separator\" aria-controls=\"content\" aria-grabbed=\"false\" tabindex=\"0\"><forge-icon class=\"forge-split-view-panel__icon\" id=\"icon\" part=\"icon\"></forge-icon><forge-ripple id=\"ripple\" part=\"ripple\"></forge-ripple></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
|
|
17
|
+
const styles = '@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-ripple-surface{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity;position:relative;outline:0;overflow:hidden}.mdc-ripple-surface::after,.mdc-ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-ripple-surface::before{-webkit-transition:opacity 15ms linear,background-color 15ms linear;transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards;animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:mdc-ripple-fg-opacity-out 150ms;animation:mdc-ripple-fg-opacity-out 150ms;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface::after,.mdc-ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-upgraded--unbounded::after,.mdc-ripple-upgraded--unbounded::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{background-color:#000;background-color:var(--mdc-ripple-color,#000)}.mdc-ripple-surface.mdc-ripple-surface--hover::before,.mdc-ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{--mdc-ripple-color:var(--mdc-theme-on-surface)}.forge-split-view-panel{display:-webkit-box;display:flex;width:100%;height:100%;overflow:hidden;contain:paint size}.forge-split-view-panel__handle{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-light,rgba(0,0,0,.54));background-color:#e0e0e0;background-color:var(--forge-theme-border-color,#e0e0e0);display:-webkit-box;display:flex;flex-shrink:0;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;outline:0}.forge-split-view-panel__content{-webkit-box-flex:1;flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:8px;min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:8px;width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uz9zuy8;animation-name:uz9zuy8;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uz9zuy8{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes uz9zuy8{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:uz9zuye;animation-name:uz9zuye;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uz9zuye{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes uz9zuye{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uz9zuyf;animation-name:uz9zuyf;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uz9zuyf{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes uz9zuyf{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;-webkit-animation-name:uz9zuyr;animation-name:uz9zuyr;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uz9zuyr{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes uz9zuyr{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:8px;min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:8px;height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uz9zuzr;animation-name:uz9zuzr;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uz9zuzr{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes uz9zuzr{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:uz9zv05;animation-name:uz9zv05;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1)}@-webkit-keyframes uz9zv05{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes uz9zv05{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;-webkit-animation-name:uz9zv0c;animation-name:uz9zv0c;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uz9zv0c{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes uz9zv0c{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;-webkit-animation-name:uz9zv0x;animation-name:uz9zv0x;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-direction:reverse}@-webkit-keyframes uz9zv0x{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes uz9zv0x{from{-webkit-transform:none;transform:none}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;-webkit-box-flex:0;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){-webkit-box-flex:1;flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}';
|
|
18
|
+
let SplitViewPanelComponent = class SplitViewPanelComponent extends BaseComponent {
|
|
19
|
+
constructor() {
|
|
20
|
+
super();
|
|
21
|
+
IconRegistry.define([tylIconDragVerticalVariant, tylIconDragHandle]);
|
|
22
|
+
attachShadowTemplate(this, template, styles);
|
|
23
|
+
this._foundation = new SplitViewPanelFoundation(new SplitViewPanelAdapter(this));
|
|
24
|
+
}
|
|
25
|
+
static get observedAttributes() {
|
|
26
|
+
return [
|
|
27
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.RESIZABLE,
|
|
28
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.SIZE,
|
|
29
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.MIN,
|
|
30
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.MAX,
|
|
31
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.ACCESSIBLE_LABEL,
|
|
32
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.OPEN,
|
|
33
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.DISABLED,
|
|
34
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.ALLOW_CLOSE,
|
|
35
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.AUTO_CLOSE,
|
|
36
|
+
SPLIT_VIEW_PANEL_CONSTANTS.attributes.AUTO_CLOSE_THRESHOLD
|
|
37
|
+
];
|
|
38
|
+
}
|
|
39
|
+
connectedCallback() {
|
|
40
|
+
this._foundation.initialize();
|
|
41
|
+
}
|
|
42
|
+
disconnectedCallback() {
|
|
43
|
+
this._foundation.disconnect();
|
|
44
|
+
}
|
|
45
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
46
|
+
switch (name) {
|
|
47
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.RESIZABLE:
|
|
48
|
+
this.resizable = newValue;
|
|
49
|
+
break;
|
|
50
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.SIZE:
|
|
51
|
+
this.size = newValue;
|
|
52
|
+
break;
|
|
53
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.MIN:
|
|
54
|
+
this.min = newValue;
|
|
55
|
+
break;
|
|
56
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.MAX:
|
|
57
|
+
if (newValue) {
|
|
58
|
+
this.max = newValue;
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
this.max = undefined;
|
|
62
|
+
}
|
|
63
|
+
break;
|
|
64
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.ACCESSIBLE_LABEL:
|
|
65
|
+
this.accessibleLabel = newValue;
|
|
66
|
+
break;
|
|
67
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.OPEN:
|
|
68
|
+
this.open = coerceBoolean(newValue);
|
|
69
|
+
break;
|
|
70
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.DISABLED:
|
|
71
|
+
if (this.hasAttribute(name)) {
|
|
72
|
+
this.disabled = coerceBoolean(newValue);
|
|
73
|
+
}
|
|
74
|
+
else {
|
|
75
|
+
this.disabled = undefined;
|
|
76
|
+
}
|
|
77
|
+
break;
|
|
78
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.ALLOW_CLOSE:
|
|
79
|
+
if (this.hasAttribute(name)) {
|
|
80
|
+
this.allowClose = coerceBoolean(newValue);
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
this.allowClose = undefined;
|
|
84
|
+
}
|
|
85
|
+
break;
|
|
86
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.AUTO_CLOSE:
|
|
87
|
+
if (this.hasAttribute(name)) {
|
|
88
|
+
this.autoClose = coerceBoolean(newValue);
|
|
89
|
+
}
|
|
90
|
+
else {
|
|
91
|
+
this.autoClose = undefined;
|
|
92
|
+
}
|
|
93
|
+
break;
|
|
94
|
+
case SPLIT_VIEW_PANEL_CONSTANTS.attributes.AUTO_CLOSE_THRESHOLD:
|
|
95
|
+
if (newValue) {
|
|
96
|
+
this.autoCloseThreshold = coerceNumber(newValue);
|
|
97
|
+
}
|
|
98
|
+
else {
|
|
99
|
+
this.autoCloseThreshold = undefined;
|
|
100
|
+
}
|
|
101
|
+
break;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
/**
|
|
105
|
+
* Gets the size of content along the axis of orientation.
|
|
106
|
+
* @returns The size of content in pixels.
|
|
107
|
+
*/
|
|
108
|
+
getContentSize() {
|
|
109
|
+
return this._foundation.getContentSize();
|
|
110
|
+
}
|
|
111
|
+
/**
|
|
112
|
+
* Gets the amount that the content can shrink along the axis of orientation before reaching its
|
|
113
|
+
* min size.
|
|
114
|
+
* @returns The amount that content can shrink in pixels.
|
|
115
|
+
*/
|
|
116
|
+
getCollapsibleSize() {
|
|
117
|
+
return this._foundation.getCollapsibleSize();
|
|
118
|
+
}
|
|
119
|
+
/**
|
|
120
|
+
* Sets the size of content along the axis of orientation.
|
|
121
|
+
* @param size The new size of content in pixels.
|
|
122
|
+
*/
|
|
123
|
+
setContentSize(size) {
|
|
124
|
+
this._foundation.setContentSize(size);
|
|
125
|
+
}
|
|
126
|
+
/**
|
|
127
|
+
* Updates the provided characteristics.
|
|
128
|
+
* @param config An update configuration.
|
|
129
|
+
*/
|
|
130
|
+
update(config) {
|
|
131
|
+
this._foundation.update(config);
|
|
132
|
+
}
|
|
133
|
+
};
|
|
134
|
+
__decorate([
|
|
135
|
+
FoundationProperty()
|
|
136
|
+
], SplitViewPanelComponent.prototype, "resizable", void 0);
|
|
137
|
+
__decorate([
|
|
138
|
+
FoundationProperty()
|
|
139
|
+
], SplitViewPanelComponent.prototype, "size", void 0);
|
|
140
|
+
__decorate([
|
|
141
|
+
FoundationProperty()
|
|
142
|
+
], SplitViewPanelComponent.prototype, "min", void 0);
|
|
143
|
+
__decorate([
|
|
144
|
+
FoundationProperty()
|
|
145
|
+
], SplitViewPanelComponent.prototype, "max", void 0);
|
|
146
|
+
__decorate([
|
|
147
|
+
FoundationProperty()
|
|
148
|
+
], SplitViewPanelComponent.prototype, "accessibleLabel", void 0);
|
|
149
|
+
__decorate([
|
|
150
|
+
FoundationProperty()
|
|
151
|
+
], SplitViewPanelComponent.prototype, "open", void 0);
|
|
152
|
+
__decorate([
|
|
153
|
+
FoundationProperty()
|
|
154
|
+
], SplitViewPanelComponent.prototype, "disabled", void 0);
|
|
155
|
+
__decorate([
|
|
156
|
+
FoundationProperty()
|
|
157
|
+
], SplitViewPanelComponent.prototype, "allowClose", void 0);
|
|
158
|
+
__decorate([
|
|
159
|
+
FoundationProperty()
|
|
160
|
+
], SplitViewPanelComponent.prototype, "autoClose", void 0);
|
|
161
|
+
__decorate([
|
|
162
|
+
FoundationProperty()
|
|
163
|
+
], SplitViewPanelComponent.prototype, "autoCloseThreshold", void 0);
|
|
164
|
+
SplitViewPanelComponent = __decorate([
|
|
165
|
+
CustomElement({
|
|
166
|
+
name: SPLIT_VIEW_PANEL_CONSTANTS.elementName,
|
|
167
|
+
dependencies: [
|
|
168
|
+
IconComponent,
|
|
169
|
+
RippleComponent
|
|
170
|
+
]
|
|
171
|
+
})
|
|
172
|
+
], SplitViewPanelComponent);
|
|
173
|
+
export { SplitViewPanelComponent };
|
|
@@ -192,10 +192,10 @@ export declare class TableUtils {
|
|
|
192
192
|
*/
|
|
193
193
|
private static _getCheckboxElement;
|
|
194
194
|
/**
|
|
195
|
-
* Retrieves the checkbox element from the given table row. Used in select mode only.
|
|
195
|
+
* Retrieves the select all checkbox element from the given table row. Used in select mode only.
|
|
196
196
|
* @param rowElement
|
|
197
197
|
*/
|
|
198
|
-
private static
|
|
198
|
+
private static _tryGetSelectAllCheckboxElement;
|
|
199
199
|
/**
|
|
200
200
|
* Sets the checked state of the select checkbox.
|
|
201
201
|
* @param checkboxElement
|
package/esm/table/table-utils.js
CHANGED
|
@@ -482,7 +482,7 @@ export class TableUtils {
|
|
|
482
482
|
}
|
|
483
483
|
static _attachRowSelectListener(row, clickListener) {
|
|
484
484
|
const checkboxElement = TableUtils._getCheckboxElement(row);
|
|
485
|
-
checkboxElement.addEventListener('click', clickListener);
|
|
485
|
+
checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.addEventListener('click', clickListener);
|
|
486
486
|
}
|
|
487
487
|
/**
|
|
488
488
|
* Removes the select listeners from every table row.
|
|
@@ -492,9 +492,7 @@ export class TableUtils {
|
|
|
492
492
|
static _detachRowSelectListeners(tbodyElement, clickListener) {
|
|
493
493
|
Array.from(tbodyElement.rows).forEach(row => {
|
|
494
494
|
const checkboxElement = TableUtils._getCheckboxElement(row);
|
|
495
|
-
|
|
496
|
-
checkboxElement.removeEventListener('click', clickListener);
|
|
497
|
-
}
|
|
495
|
+
checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.removeEventListener('click', clickListener);
|
|
498
496
|
});
|
|
499
497
|
}
|
|
500
498
|
/**
|
|
@@ -524,7 +522,7 @@ export class TableUtils {
|
|
|
524
522
|
*/
|
|
525
523
|
static _tryAttachSelectAllTemplateListener(theadElement, listener) {
|
|
526
524
|
const lastTheadRow = theadElement.rows[theadElement.rows.length - 1];
|
|
527
|
-
const checkboxElement = TableUtils.
|
|
525
|
+
const checkboxElement = TableUtils._tryGetSelectAllCheckboxElement(lastTheadRow);
|
|
528
526
|
if (checkboxElement) {
|
|
529
527
|
checkboxElement.addEventListener('change', listener);
|
|
530
528
|
}
|
|
@@ -536,7 +534,7 @@ export class TableUtils {
|
|
|
536
534
|
*/
|
|
537
535
|
static _detachSelectAllListener(theadElement, listener) {
|
|
538
536
|
const lastTheadRow = theadElement.rows[theadElement.rows.length - 1];
|
|
539
|
-
const checkboxElement = TableUtils.
|
|
537
|
+
const checkboxElement = TableUtils._tryGetSelectAllCheckboxElement(lastTheadRow);
|
|
540
538
|
if (!checkboxElement) {
|
|
541
539
|
return;
|
|
542
540
|
}
|
|
@@ -698,14 +696,23 @@ export class TableUtils {
|
|
|
698
696
|
* @param rowElement
|
|
699
697
|
*/
|
|
700
698
|
static _getCheckboxElement(rowElement) {
|
|
701
|
-
|
|
699
|
+
const selectCell = rowElement.querySelector(`.${TABLE_CONSTANTS.classes.TABLE_CELL_SELECT}`);
|
|
700
|
+
if (!selectCell) {
|
|
701
|
+
return null;
|
|
702
|
+
}
|
|
703
|
+
return selectCell.querySelector(TABLE_CONSTANTS.selectors.CHECKBOX_INPUT);
|
|
702
704
|
}
|
|
703
705
|
/**
|
|
704
|
-
* Retrieves the checkbox element from the given table row. Used in select mode only.
|
|
706
|
+
* Retrieves the select all checkbox element from the given table row. Used in select mode only.
|
|
705
707
|
* @param rowElement
|
|
706
708
|
*/
|
|
707
|
-
static
|
|
708
|
-
|
|
709
|
+
static _tryGetSelectAllCheckboxElement(rowElement) {
|
|
710
|
+
const selectAllCell = rowElement.querySelector(`.${TABLE_CONSTANTS.classes.TABLE_CELL_SELECT}`);
|
|
711
|
+
if (!selectAllCell) {
|
|
712
|
+
return null;
|
|
713
|
+
}
|
|
714
|
+
return selectAllCell.querySelector(TABLE_CONSTANTS.selectors.CHECKBOX_INPUT) ||
|
|
715
|
+
selectAllCell.querySelector(TABLE_CONSTANTS.selectors.SELECT_ALL_TEMPLATE_CHECKBOX_INPUT);
|
|
709
716
|
}
|
|
710
717
|
/**
|
|
711
718
|
* Sets the checked state of the select checkbox.
|
|
@@ -761,7 +768,10 @@ export class TableUtils {
|
|
|
761
768
|
*/
|
|
762
769
|
static updateSelectedState(rowElement, isSelected) {
|
|
763
770
|
TableUtils._setRowSelectedState(rowElement, isSelected);
|
|
764
|
-
TableUtils.
|
|
771
|
+
const selectCheckbox = TableUtils._getCheckboxElement(rowElement);
|
|
772
|
+
if (selectCheckbox) {
|
|
773
|
+
TableUtils._setSelectedCheckboxState(selectCheckbox, isSelected);
|
|
774
|
+
}
|
|
765
775
|
}
|
|
766
776
|
/**
|
|
767
777
|
* Get a row from the first table body by index.
|
|
@@ -779,7 +789,7 @@ export class TableUtils {
|
|
|
779
789
|
return;
|
|
780
790
|
}
|
|
781
791
|
const lastTheadRow = tableElement.tHead.rows[tableElement.tHead.rows.length - 1];
|
|
782
|
-
const selectAllCheckboxElement = TableUtils.
|
|
792
|
+
const selectAllCheckboxElement = TableUtils._tryGetSelectAllCheckboxElement(lastTheadRow);
|
|
783
793
|
if (selectAllCheckboxElement) {
|
|
784
794
|
TableUtils._setSelectedCheckboxState(selectAllCheckboxElement, isAllSelected);
|
|
785
795
|
TableUtils._setIndeterminateCheckboxState(selectAllCheckboxElement, !!isIndeterminate);
|
|
@@ -808,7 +818,10 @@ export class TableUtils {
|
|
|
808
818
|
const existingSelection = findWhere(selectedRows, createPredicate(key, rowData));
|
|
809
819
|
if (existingSelection) {
|
|
810
820
|
TableUtils._setRowSelectedState(row, true);
|
|
811
|
-
TableUtils.
|
|
821
|
+
const selectCheckbox = TableUtils._getCheckboxElement(row);
|
|
822
|
+
if (selectCheckbox) {
|
|
823
|
+
TableUtils._setSelectedCheckboxState(selectCheckbox, true);
|
|
824
|
+
}
|
|
812
825
|
selectedRowCount++;
|
|
813
826
|
}
|
|
814
827
|
});
|
|
@@ -826,7 +839,10 @@ export class TableUtils {
|
|
|
826
839
|
const nonExpandedRows = TableUtils._getNonExpandedRows(tableElement.tBodies[0].rows);
|
|
827
840
|
nonExpandedRows.forEach(row => {
|
|
828
841
|
TableUtils._setRowSelectedState(row, false);
|
|
829
|
-
TableUtils.
|
|
842
|
+
const selectCheckbox = TableUtils._getCheckboxElement(row);
|
|
843
|
+
if (selectCheckbox) {
|
|
844
|
+
TableUtils._setSelectedCheckboxState(selectCheckbox, false);
|
|
845
|
+
}
|
|
830
846
|
});
|
|
831
847
|
}
|
|
832
848
|
/**
|
|
@@ -12,7 +12,7 @@ export declare class TextFieldAdapter extends FieldAdapter implements ITextField
|
|
|
12
12
|
protected _inputElements: Array<HTMLInputElement | HTMLTextAreaElement>;
|
|
13
13
|
protected _inputMutationObserverInstances: MutationObserver[];
|
|
14
14
|
constructor(component: ITextFieldComponent);
|
|
15
|
-
initialize(
|
|
15
|
+
initialize(): void;
|
|
16
16
|
destroy(): void;
|
|
17
17
|
detectTextarea(): void;
|
|
18
18
|
ensureLabelOrder(): void;
|
|
@@ -12,8 +12,8 @@ export class TextFieldAdapter extends FieldAdapter {
|
|
|
12
12
|
super(component);
|
|
13
13
|
this._inputMutationObserverInstances = [];
|
|
14
14
|
}
|
|
15
|
-
initialize(
|
|
16
|
-
super.initialize(
|
|
15
|
+
initialize() {
|
|
16
|
+
super.initialize(TEXT_FIELD_CONSTANTS.selectors.ROOT);
|
|
17
17
|
this._inputElements = Array.from(this._component.querySelectorAll('input:not([type=checkbox]):not([type=radio]), textarea'));
|
|
18
18
|
if (this._inputElements.length > 1) {
|
|
19
19
|
this._handleMultiInputs();
|
|
@@ -10,7 +10,7 @@ import { TextFieldFoundation } from './text-field-foundation';
|
|
|
10
10
|
import { TEXT_FIELD_CONSTANTS } from './text-field-constants';
|
|
11
11
|
import { FieldComponent } from '../field/field';
|
|
12
12
|
const template = '<template><div class=\"forge-text-field__wrapper\" part=\"root\"><div class=\"forge-text-field forge-field\" part=\"container\"><div class=\"forge-text-field__leading-container\" part=\"leading-container\"><slot name=\"leading\"></slot></div><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><slot></slot><slot name=\"label\"></slot></div><slot name=\"trailing\"></slot><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>';
|
|
13
|
-
const styles = '.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-text-field-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(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 ::slotted(label[dir=rtl]),[dir=rtl] .forge-field ::slotted(label){right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) ::slotted(label){display:none}.forge-field--required ::slotted(label)::after{content:none}.forge-field--required ::slotted(label)::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){font-size:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){font-size:1rem}.forge-field--disabled ::slotted(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) ::slotted(label){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) ::slotted(label){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){top:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) ::slotted(label){left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) ::slotted(label){left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) ::slotted(label){padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded ::slotted(label){padding-right:32px}.forge-field ::slotted(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 ::slotted(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) ::slotted(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) ::slotted(label.forge-floating-label--float-above){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(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) ::slotted(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) ::slotted(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) ::slotted(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) ::slotted(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) ::slotted(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 ::slotted(input){-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);align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;-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;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0}.forge-field ::slotted(input)::-webkit-input-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 ::slotted(input)::-moz-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 ::slotted(input):-ms-input-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 ::slotted(input)::-ms-input-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 ::slotted(input)::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 ::slotted(input):invalid{-webkit-box-shadow:none;box-shadow:none}.forge-field ::slotted(input):-webkit-autofill{z-index:auto!important}.forge-field:not(.forge-field--disabled) ::slotted(input){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled ::slotted(input){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) ::slotted(input){font-size:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){font-size:1rem}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){font-size:.875rem}.forge-field ::slotted(input){padding:0 12px}.forge-field--label ::slotted(input){padding-top:24px}.forge-field--roomy.forge-field--label ::slotted(input){padding-top:29px}.forge-field--shape-rounded:not(.forge-field--leading) ::slotted(input){padding-left:32px}.forge-field--leading ::slotted(input){padding-left:0}.forge-field--label ::slotted(input){padding-bottom:3px}.forge-field--roomy.forge-field--label ::slotted(input){padding-bottom:8px}.forge-field--shape-rounded:not(.forge-field--trailing):not(.forge-field--addon-end) ::slotted(input){padding-right:32px}.forge-field--addon-end ::slotted(input),.forge-field--trailing ::slotted(input){padding-right: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 ::slotted([slot=trailing]){align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=trailing]){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=trailing]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=trailing]){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=trailing]){margin:0 4px}.forge-field ::slotted([slot=trailing]: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-text-field{-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-text-field-margin-top,0)}.forge-text-field.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-text-field:not(.forge-text-field--textarea):not(.forge-field--dense):not(.forge-field--roomy){height:3rem;height:var(--forge-text-field-height,3rem)}.forge-text-field:not(.forge-text-field--textarea).forge-field--roomy:not(.forge-field--dense){height:3.5rem;height:var(--forge-text-field-height,3.5rem)}.forge-text-field:not(.forge-text-field--textarea).forge-field--dense:not(.forge-field--roomy){height:1.5rem;height:var(--forge-text-field-height,1.5rem)}.forge-text-field__leading-container{display:-webkit-box;display:flex;align-self:center}.forge-text-field--multi-input ::slotted(input:first-of-type){padding-right:0;max-width:110px;min-width:110px;width:110px}.forge-text-field--multi-input ::slotted(input:last-of-type)::-webkit-input-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type)::-moz-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type):-ms-input-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type)::-ms-input-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type)::placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted([data-forge-multi-input-separator]){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));border:transparent}.forge-text-field--multi-input.forge-field--label ::slotted([data-forge-multi-input-separator]){margin:20px 0 0 4px}.forge-text-field--multi-input:not(.forge-field--label) ::slotted([data-forge-multi-input-separator]){margin:0 0 0 4px}.forge-text-field.forge-text-field--textarea{height:auto;padding-right:2px;min-height:3rem;min-height:var(--forge-text-field-height,3rem)}.forge-text-field.forge-text-field--textarea ::slotted(textarea){-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);align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;-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;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0;font-size:1rem;margin:28px 0 0;padding:0 12px 8px;overflow:auto;resize:vertical}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::-webkit-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::-moz-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea):-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea):invalid{-webkit-box-shadow:none;box-shadow:none}.forge-text-field.forge-text-field--textarea ::slotted(textarea):-webkit-autofill{z-index:auto!important}.forge-text-field.forge-text-field--textarea:not(.forge-field--disabled) ::slotted(textarea){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-text-field.forge-text-field--textarea.forge-field--disabled ::slotted(textarea){color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}:host{display:block;contain:layout}:host([hidden]){display:none}';
|
|
13
|
+
const styles = '.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-text-field-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(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 ::slotted(label[dir=rtl]),[dir=rtl] .forge-field ::slotted(label){right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) ::slotted(label){display:none}.forge-field--required ::slotted(label)::after{content:none}.forge-field--required ::slotted(label)::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){font-size:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){font-size:1rem}.forge-field--disabled ::slotted(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) ::slotted(label){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) ::slotted(label){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){top:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) ::slotted(label){left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) ::slotted(label){left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) ::slotted(label){padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded ::slotted(label){padding-right:32px}.forge-field ::slotted(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 ::slotted(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) ::slotted(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) ::slotted(label.forge-floating-label--float-above){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(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) ::slotted(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) ::slotted(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) ::slotted(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) ::slotted(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) ::slotted(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 ::slotted(input){-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);align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;-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;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0}.forge-field ::slotted(input)::-webkit-input-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 ::slotted(input)::-moz-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 ::slotted(input):-ms-input-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 ::slotted(input)::-ms-input-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 ::slotted(input)::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 ::slotted(input):invalid{-webkit-box-shadow:none;box-shadow:none}.forge-field ::slotted(input):-webkit-autofill{z-index:auto!important}.forge-field:not(.forge-field--disabled) ::slotted(input){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled ::slotted(input){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) ::slotted(input){font-size:1rem;font-size:var(--forge-field-font-size, 1rem)}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){font-size:1rem;font-size:var(--forge-field-font-size, 1rem)}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){font-size:.875rem;font-size:var(--forge-field-font-size, .875rem)}.forge-field ::slotted(input){padding:0 12px}.forge-field--label ::slotted(input){padding-top:24px}.forge-field--roomy.forge-field--label ::slotted(input){padding-top:29px}.forge-field--shape-rounded:not(.forge-field--leading) ::slotted(input){padding-left:32px}.forge-field--leading ::slotted(input){padding-left:0}.forge-field--label ::slotted(input){padding-bottom:3px}.forge-field--roomy.forge-field--label ::slotted(input){padding-bottom:8px}.forge-field--shape-rounded:not(.forge-field--trailing):not(.forge-field--addon-end) ::slotted(input){padding-right:32px}.forge-field--addon-end ::slotted(input),.forge-field--trailing ::slotted(input){padding-right: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 ::slotted([slot=trailing]){align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=trailing]){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=trailing]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=trailing]){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=trailing]){margin:0 4px}.forge-field ::slotted([slot=trailing]: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-text-field{-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-text-field-margin-top,0)}.forge-text-field.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-text-field:not(.forge-text-field--textarea):not(.forge-field--dense):not(.forge-field--roomy){height:3rem;height:var(--forge-text-field-height,3rem)}.forge-text-field:not(.forge-text-field--textarea).forge-field--roomy:not(.forge-field--dense){height:3.5rem;height:var(--forge-text-field-height,3.5rem)}.forge-text-field:not(.forge-text-field--textarea).forge-field--dense:not(.forge-field--roomy){height:1.5rem;height:var(--forge-text-field-height,1.5rem)}.forge-text-field__leading-container{display:-webkit-box;display:flex;align-self:center}.forge-text-field--multi-input ::slotted(input:first-of-type){padding-right:0;max-width:110px;min-width:110px;width:110px}.forge-text-field--multi-input ::slotted(input:last-of-type)::-webkit-input-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type)::-moz-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type):-ms-input-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type)::-ms-input-placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted(input:last-of-type)::placeholder{padding-left:6px}.forge-text-field--multi-input ::slotted([data-forge-multi-input-separator]){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));border:transparent}.forge-text-field--multi-input.forge-field--label ::slotted([data-forge-multi-input-separator]){margin:20px 0 0 4px}.forge-text-field--multi-input:not(.forge-field--label) ::slotted([data-forge-multi-input-separator]){margin:0 0 0 4px}.forge-text-field.forge-text-field--textarea{height:auto;padding-right:2px;min-height:3rem;min-height:var(--forge-text-field-height,3rem)}.forge-text-field.forge-text-field--textarea ::slotted(textarea){-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);align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;-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;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0;font-size:1rem;margin:28px 0 0;padding:0 12px 8px;overflow:auto;resize:vertical}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::-webkit-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::-moz-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea):-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea)::placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-text-field.forge-text-field--textarea ::slotted(textarea):invalid{-webkit-box-shadow:none;box-shadow:none}.forge-text-field.forge-text-field--textarea ::slotted(textarea):-webkit-autofill{z-index:auto!important}.forge-text-field.forge-text-field--textarea:not(.forge-field--disabled) ::slotted(textarea){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-text-field.forge-text-field--textarea.forge-field--disabled ::slotted(textarea){color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}:host{display:block;contain:layout}:host([hidden]){display:none}';
|
|
14
14
|
/**
|
|
15
15
|
* The web component class behind the `<forge-text-field>` custom element.
|
|
16
16
|
*
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tylertech/forge",
|
|
3
3
|
"description": "Forge Web Components library",
|
|
4
|
-
"version": "2.
|
|
4
|
+
"version": "2.9.0",
|
|
5
5
|
"author": "Tyler Technologies, Inc.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"repository": {
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"typings": "esm/index.d.ts",
|
|
14
14
|
"sideEffects": false,
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@tylertech/forge-core": "^2.
|
|
16
|
+
"@tylertech/forge-core": "^2.1.0",
|
|
17
17
|
"@tylertech/tyler-icons": "^1.12.0",
|
|
18
18
|
"imask": "^6.4.2",
|
|
19
19
|
"material-components-web": "^14.0.0",
|
|
@@ -167,11 +167,11 @@
|
|
|
167
167
|
|
|
168
168
|
// Default
|
|
169
169
|
@if $layout-state == default or $layout-state == shape-rounded {
|
|
170
|
-
--forge-chip-height: #{map.get(variables.$member, height, default)};
|
|
170
|
+
--forge-chip-min-height: #{map.get(variables.$member, min-height, default)};
|
|
171
171
|
}
|
|
172
172
|
// Dense
|
|
173
173
|
@else if $layout-state == dense or $layout-state == shape-rounded-dense {
|
|
174
|
-
--forge-chip-height: #{map.get(variables.$member, height, dense)};
|
|
174
|
+
--forge-chip-min-height: #{map.get(variables.$member, min-height, dense)};
|
|
175
175
|
}
|
|
176
176
|
// Roomy uses the default chip height
|
|
177
177
|
@include field-utils.error-layout-state(member-height, $layout-state);
|
|
@@ -125,7 +125,7 @@
|
|
|
125
125
|
@mixin input {
|
|
126
126
|
// Base
|
|
127
127
|
// chip-field input should have no padding, so we exclude padding from the base.
|
|
128
|
-
@include field-selector.input('::slotted(input)', $exclude: (padding, padding-top, padding-right, padding-bottom, padding-left));
|
|
128
|
+
@include field-selector.input('::slotted(input)', $exclude: (padding, padding-top, padding-right, padding-bottom, padding-left), $component-name: 'forge-chip-field');
|
|
129
129
|
// Core
|
|
130
130
|
::slotted(input) {
|
|
131
131
|
@include base.input-core;
|
|
@@ -138,7 +138,7 @@
|
|
|
138
138
|
@include dense;
|
|
139
139
|
|
|
140
140
|
&.forge-chip--field {
|
|
141
|
-
@include theme.css-custom-property(height, --forge-chip-height,
|
|
141
|
+
@include theme.css-custom-property(min-height, --forge-chip-min-height, variables.$dense-field-min-height);
|
|
142
142
|
padding: 0;
|
|
143
143
|
margin: 0;
|
|
144
144
|
display: flex;
|
|
@@ -192,7 +192,8 @@
|
|
|
192
192
|
@include button-mixins.outlined;
|
|
193
193
|
@include mdc-chip-theme.shape-radius(50%);
|
|
194
194
|
@include theme.css-custom-property(width, --forge-chip-width, auto);
|
|
195
|
-
@include theme.css-custom-property(height, --forge-chip-height,
|
|
195
|
+
@include theme.css-custom-property(height, --forge-chip-height, auto);
|
|
196
|
+
@include theme.css-custom-property(min-height, --forge-chip-min-height, variables.$min-height);
|
|
196
197
|
|
|
197
198
|
box-sizing: border-box;
|
|
198
199
|
transition: mdc-animation.enter(background-color, 150ms);
|
|
@@ -273,5 +274,5 @@
|
|
|
273
274
|
}
|
|
274
275
|
|
|
275
276
|
@mixin dense() {
|
|
276
|
-
@include theme.css-custom-property(height, --forge-chip-height, variables.$dense-height);
|
|
277
|
+
@include theme.css-custom-property(min-height, --forge-chip-min-height, variables.$dense-min-height);
|
|
277
278
|
}
|
package/styles/field/_base.scss
CHANGED
|
@@ -380,18 +380,30 @@
|
|
|
380
380
|
@include utils.error-theme-state(input-color, $theme-state);
|
|
381
381
|
}
|
|
382
382
|
|
|
383
|
-
@mixin input-font-size($layout-state) {
|
|
383
|
+
@mixin input-font-size($layout-state, $custom-prop-font-size) {
|
|
384
384
|
// Default
|
|
385
385
|
@if $layout-state == default or $layout-state == shape-rounded {
|
|
386
|
-
|
|
386
|
+
@include theme.css-custom-property(
|
|
387
|
+
font-size,
|
|
388
|
+
$custom-prop-font-size,
|
|
389
|
+
map.get(variables.$input, font-size, default)
|
|
390
|
+
);
|
|
387
391
|
}
|
|
388
392
|
// Roomy
|
|
389
393
|
@else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
|
|
390
|
-
|
|
394
|
+
@include theme.css-custom-property(
|
|
395
|
+
font-size,
|
|
396
|
+
$custom-prop-font-size,
|
|
397
|
+
map.get(variables.$input, font-size, roomy)
|
|
398
|
+
);
|
|
391
399
|
}
|
|
392
400
|
// Dense
|
|
393
401
|
@else if $layout-state == dense or $layout-state == shape-rounded-dense {
|
|
394
|
-
|
|
402
|
+
@include theme.css-custom-property(
|
|
403
|
+
font-size,
|
|
404
|
+
$custom-prop-font-size,
|
|
405
|
+
map.get(variables.$input, font-size, dense)
|
|
406
|
+
);
|
|
395
407
|
}
|
|
396
408
|
@include utils.error-layout-state(input-font-size, $layout-state);
|
|
397
409
|
}
|
|
@@ -272,7 +272,7 @@
|
|
|
272
272
|
}
|
|
273
273
|
}
|
|
274
274
|
|
|
275
|
-
@mixin input($input-selector: '::slotted(input)', $exclude: ()) {
|
|
275
|
+
@mixin input($input-selector: '::slotted(input)', $exclude: (), $component-name: 'forge-field') {
|
|
276
276
|
// Core
|
|
277
277
|
@if list.index($exclude, core) == null {
|
|
278
278
|
#{$input-selector} {
|
|
@@ -296,17 +296,17 @@
|
|
|
296
296
|
@if list.index($exclude, font-size) == null {
|
|
297
297
|
&:not(.forge-field--dense):not(.forge-field--roomy) {
|
|
298
298
|
#{$input-selector} {
|
|
299
|
-
@include base.input-font-size(default);
|
|
299
|
+
@include base.input-font-size(default, --#{$component-name}-font-size);
|
|
300
300
|
}
|
|
301
301
|
}
|
|
302
302
|
&--roomy:not(.forge-field--dense) {
|
|
303
303
|
#{$input-selector} {
|
|
304
|
-
@include base.input-font-size(roomy);
|
|
304
|
+
@include base.input-font-size(roomy, --#{$component-name}-font-size);
|
|
305
305
|
}
|
|
306
306
|
}
|
|
307
307
|
&--dense:not(.forge-field--roomy) {
|
|
308
308
|
#{$input-selector} {
|
|
309
|
-
@include base.input-font-size(dense);
|
|
309
|
+
@include base.input-font-size(dense, --#{$component-name}-font-size);
|
|
310
310
|
}
|
|
311
311
|
}
|
|
312
312
|
}
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
// Field Input Styles
|
|
24
|
-
@include field-selector.input('.forge-select__selected-text', $exclude: (core, padding-right));
|
|
24
|
+
@include field-selector.input('.forge-select__selected-text', $exclude: (core, padding-right), $component-name: 'forge-select');
|
|
25
25
|
|
|
26
26
|
// Line Height
|
|
27
27
|
&:not(.forge-field--label) {
|