@xwiki/cristal-electron-renderer 1.2.0 → 1.4.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/package.json +19 -19
- package/dist/AttachmentPreview-DNQ6Ebkw.css +0 -1
- package/dist/AttachmentPreview-Ecn8Pmvf.js +0 -2
- package/dist/AttachmentPreview-Ecn8Pmvf.js.map +0 -1
- package/dist/AuthServiceBanner-7KaHK0Au.js +0 -2
- package/dist/AuthServiceBanner-7KaHK0Au.js.map +0 -1
- package/dist/AuthServiceBanner-BArubXdu.css +0 -1
- package/dist/DeletePage-DA6E5XYv.js +0 -2
- package/dist/DeletePage-DA6E5XYv.js.map +0 -1
- package/dist/GitHubLoginMenu-Crh899SM.js +0 -2
- package/dist/GitHubLoginMenu-Crh899SM.js.map +0 -1
- package/dist/LoggedInMenu-kH3kWMGK.js +0 -2
- package/dist/LoggedInMenu-kH3kWMGK.js.map +0 -1
- package/dist/LoginMenu-D_c21AxX.js +0 -2
- package/dist/LoginMenu-D_c21AxX.js.map +0 -1
- package/dist/MovePage-BHS998Jm.css +0 -1
- package/dist/MovePage-Du2Z2i7H.js +0 -2
- package/dist/MovePage-Du2Z2i7H.js.map +0 -1
- package/dist/NextcloudLoginMenu-BTVdL-FM.js +0 -2
- package/dist/NextcloudLoginMenu-BTVdL-FM.js.map +0 -1
- package/dist/NextcloudLoginMenu-DGCgMCya.css +0 -1
- package/dist/RenamePage-CQF0H3Kh.js +0 -2
- package/dist/RenamePage-CQF0H3Kh.js.map +0 -1
- package/dist/SettingsConfigurations-B9GWI5mw.css +0 -1
- package/dist/SettingsConfigurations-Cy7Cfmm4.js +0 -2
- package/dist/SettingsConfigurations-Cy7Cfmm4.js.map +0 -1
- package/dist/c-config-menu-BGV5XXU8.css +0 -1
- package/dist/c-config-menu-C99poXWy.js +0 -2
- package/dist/c-config-menu-C99poXWy.js.map +0 -1
- package/dist/c-edit-blocknote-ByH5aYGe.js +0 -257
- package/dist/c-edit-blocknote-ByH5aYGe.js.map +0 -1
- package/dist/c-edit-blocknote-gIdUYHeV.css +0 -1
- package/dist/chunk.24ZZSBUF-BmQPh48m.js +0 -89
- package/dist/chunk.24ZZSBUF-BmQPh48m.js.map +0 -1
- package/dist/chunk.36O46B5H-Cv2poSyf.js +0 -64
- package/dist/chunk.36O46B5H-Cv2poSyf.js.map +0 -1
- package/dist/chunk.3LWOA5DF-D8Va5Pmw.js +0 -77
- package/dist/chunk.3LWOA5DF-D8Va5Pmw.js.map +0 -1
- package/dist/chunk.3RPBFEDE-DI7eSlIl.js +0 -2
- package/dist/chunk.3RPBFEDE-DI7eSlIl.js.map +0 -1
- package/dist/chunk.4TUIT776-BvlNwMXD.js +0 -18
- package/dist/chunk.4TUIT776-BvlNwMXD.js.map +0 -1
- package/dist/chunk.6CTB5ZDJ-9Su7bEUQ.js +0 -2
- package/dist/chunk.6CTB5ZDJ-9Su7bEUQ.js.map +0 -1
- package/dist/chunk.7E4JTYWU-Ci99jpyG.js +0 -75
- package/dist/chunk.7E4JTYWU-Ci99jpyG.js.map +0 -1
- package/dist/chunk.AJ3ENQ5C-zot94vv9.js +0 -2
- package/dist/chunk.AJ3ENQ5C-zot94vv9.js.map +0 -1
- package/dist/chunk.B4BZKR24-B0iVuGLD.js +0 -2
- package/dist/chunk.B4BZKR24-B0iVuGLD.js.map +0 -1
- package/dist/chunk.D5YQDJ7X-_UyNui_V.js +0 -2
- package/dist/chunk.D5YQDJ7X-_UyNui_V.js.map +0 -1
- package/dist/chunk.DFHYNK3F-bS0lNIuO.js +0 -86
- package/dist/chunk.DFHYNK3F-bS0lNIuO.js.map +0 -1
- package/dist/chunk.GMYPQTFK-BT1AAYXJ.js +0 -2
- package/dist/chunk.GMYPQTFK-BT1AAYXJ.js.map +0 -1
- package/dist/chunk.J5ZM7LIC-n6gjp3-L.js +0 -244
- package/dist/chunk.J5ZM7LIC-n6gjp3-L.js.map +0 -1
- package/dist/chunk.JCXLDPQF-BOaK9AtU.js +0 -622
- package/dist/chunk.JCXLDPQF-BOaK9AtU.js.map +0 -1
- package/dist/chunk.JHOXTQXA-CWkZ1weQ.js +0 -24
- package/dist/chunk.JHOXTQXA-CWkZ1weQ.js.map +0 -1
- package/dist/chunk.JQBT7BOV-BKSO0Hfn.js +0 -3378
- package/dist/chunk.JQBT7BOV-BKSO0Hfn.js.map +0 -1
- package/dist/chunk.JXOKFADN-DpK3Q_uU.js +0 -785
- package/dist/chunk.JXOKFADN-DpK3Q_uU.js.map +0 -1
- package/dist/chunk.KPLQLAWP-DUYDfZ7-.js +0 -163
- package/dist/chunk.KPLQLAWP-DUYDfZ7-.js.map +0 -1
- package/dist/chunk.LD4M4QGE-cX1_6HT7.js +0 -2
- package/dist/chunk.LD4M4QGE-cX1_6HT7.js.map +0 -1
- package/dist/chunk.NYIIDP5N-AHr3eTN0.js +0 -2
- package/dist/chunk.NYIIDP5N-AHr3eTN0.js.map +0 -1
- package/dist/chunk.R45OWEVP-WMyXo-Fn.js +0 -181
- package/dist/chunk.R45OWEVP-WMyXo-Fn.js.map +0 -1
- package/dist/chunk.RWUUFNUL-BJhNq5wM.js +0 -2
- package/dist/chunk.RWUUFNUL-BJhNq5wM.js.map +0 -1
- package/dist/chunk.RY756JLP-BUknFjxa.js +0 -22
- package/dist/chunk.RY756JLP-BUknFjxa.js.map +0 -1
- package/dist/chunk.SI4ACBFK-BB831ml8.js +0 -58
- package/dist/chunk.SI4ACBFK-BB831ml8.js.map +0 -1
- package/dist/chunk.TRHSUYII-DFnBKJNh.js +0 -140
- package/dist/chunk.TRHSUYII-DFnBKJNh.js.map +0 -1
- package/dist/chunk.XA43ZQPC-maNlqVLX.js +0 -395
- package/dist/chunk.XA43ZQPC-maNlqVLX.js.map +0 -1
- package/dist/chunk.XSFJLY2D-ldEKWtxN.js +0 -178
- package/dist/chunk.XSFJLY2D-ldEKWtxN.js.map +0 -1
- package/dist/chunk.YHLNUJ7P-BGNuPG1R.js +0 -109
- package/dist/chunk.YHLNUJ7P-BGNuPG1R.js.map +0 -1
- package/dist/chunk.ZGGPD2XJ-DD1S3h7C.js +0 -2
- package/dist/chunk.ZGGPD2XJ-DD1S3h7C.js.map +0 -1
- package/dist/chunk.ZH2AND3P-CzagA8cz.js +0 -288
- package/dist/chunk.ZH2AND3P-CzagA8cz.js.map +0 -1
- package/dist/class-map-DmaCJs8c.js +0 -2
- package/dist/class-map-DmaCJs8c.js.map +0 -1
- package/dist/filesystem-internal-link-serializer-BmtbMUwV.js +0 -2
- package/dist/filesystem-internal-link-serializer-BmtbMUwV.js.map +0 -1
- package/dist/floating-ui.dom-1S43Ew4Q.js +0 -2
- package/dist/floating-ui.dom-1S43Ew4Q.js.map +0 -1
- package/dist/github-CRi3Ye_z.js +0 -3
- package/dist/github-CRi3Ye_z.js.map +0 -1
- package/dist/github-internal-link-serializer-ChUBU16v.js +0 -2
- package/dist/github-internal-link-serializer-ChUBU16v.js.map +0 -1
- package/dist/hocuspocus-provider.esm-DpwNtHpL.js +0 -2
- package/dist/hocuspocus-provider.esm-DpwNtHpL.js.map +0 -1
- package/dist/if-defined-O-hFrvt0.js +0 -2
- package/dist/if-defined-O-hFrvt0.js.map +0 -1
- package/dist/index-B1WxkRNy.js +0 -254
- package/dist/index-B1WxkRNy.js.map +0 -1
- package/dist/index-BgL5UHSB.css +0 -1
- package/dist/index-DWPjg9z3.js +0 -2
- package/dist/index-DWPjg9z3.js.map +0 -1
- package/dist/index-qhuTooVL.js +0 -3
- package/dist/index-qhuTooVL.js.map +0 -1
- package/dist/index.html +0 -13
- package/dist/live-z5w0O4st.js +0 -2
- package/dist/live-z5w0O4st.js.map +0 -1
- package/dist/module-RjUF93sV.js +0 -717
- package/dist/module-RjUF93sV.js.map +0 -1
- package/dist/native-48B9X9Wg.js +0 -2
- package/dist/native-48B9X9Wg.js.map +0 -1
- package/dist/nextcloud-B3M7otLC.js +0 -31
- package/dist/nextcloud-B3M7otLC.js.map +0 -1
- package/dist/nextcloud-internal-link-serializer-6Syv5TEU.js +0 -7
- package/dist/nextcloud-internal-link-serializer-6Syv5TEU.js.map +0 -1
- package/dist/offline-3x82kJQp.js +0 -4
- package/dist/offline-3x82kJQp.js.map +0 -1
- package/dist/query-x48B6FB_.js +0 -2
- package/dist/query-x48B6FB_.js.map +0 -1
- package/dist/shoelace-ZF5apisL.js +0 -3
- package/dist/shoelace-ZF5apisL.js.map +0 -1
- package/dist/static-Dm20cmTz.js +0 -3
- package/dist/static-Dm20cmTz.js.map +0 -1
- package/dist/staticBuild-BOgweg16.js +0 -2
- package/dist/staticBuild-BOgweg16.js.map +0 -1
- package/dist/translations-D5nOIu3x.js +0 -2
- package/dist/translations-D5nOIu3x.js.map +0 -1
- package/dist/translations-Ds9OkLNv.js +0 -2
- package/dist/translations-Ds9OkLNv.js.map +0 -1
- package/dist/vuetify-BxGNBe1U.js +0 -19
- package/dist/vuetify-BxGNBe1U.js.map +0 -1
- package/dist/vuetify-DJa-zcj7.css +0 -1
- package/dist/worker-BgcG6AhJ.js +0 -202
- package/dist/worker-BgcG6AhJ.js.map +0 -1
- package/dist/x-alert-BeYgGEHw.js +0 -2
- package/dist/x-alert-BeYgGEHw.js.map +0 -1
- package/dist/x-alert-BhErtBtU.css +0 -1
- package/dist/x-alert-DfYpLdml.css +0 -1
- package/dist/x-alert-Dy2REhpp.js +0 -2
- package/dist/x-alert-Dy2REhpp.js.map +0 -1
- package/dist/x-avatar-2efH4gNX.css +0 -1
- package/dist/x-avatar-C4CTlSRd.js +0 -2
- package/dist/x-avatar-C4CTlSRd.js.map +0 -1
- package/dist/x-avatar-DzYlPdwz.js +0 -2
- package/dist/x-avatar-DzYlPdwz.js.map +0 -1
- package/dist/x-breadcrumb-3U5TzpgN.js +0 -2
- package/dist/x-breadcrumb-3U5TzpgN.js.map +0 -1
- package/dist/x-breadcrumb-BMSNlvvi.css +0 -1
- package/dist/x-breadcrumb-BYgHeSE3.js +0 -2
- package/dist/x-breadcrumb-BYgHeSE3.js.map +0 -1
- package/dist/x-btn-9AKb7ryY.js +0 -2
- package/dist/x-btn-9AKb7ryY.js.map +0 -1
- package/dist/x-btn-CWfGjEgy.js +0 -2
- package/dist/x-btn-CWfGjEgy.js.map +0 -1
- package/dist/x-btn-DPGq6Sd-.css +0 -1
- package/dist/x-btn.vue_vue_type_script_setup_true_lang-D3pg_1oq.js +0 -2
- package/dist/x-btn.vue_vue_type_script_setup_true_lang-D3pg_1oq.js.map +0 -1
- package/dist/x-card-BiFAsKLZ.js +0 -2
- package/dist/x-card-BiFAsKLZ.js.map +0 -1
- package/dist/x-card-blonMcP4.js +0 -2
- package/dist/x-card-blonMcP4.js.map +0 -1
- package/dist/x-checkbox-BoqoQxdA.css +0 -1
- package/dist/x-checkbox-CfFCxOCr.js +0 -2
- package/dist/x-checkbox-CfFCxOCr.js.map +0 -1
- package/dist/x-checkbox-VDSX4CX7.js +0 -2
- package/dist/x-checkbox-VDSX4CX7.js.map +0 -1
- package/dist/x-col-DsUQg5Gm.js +0 -2
- package/dist/x-col-DsUQg5Gm.js.map +0 -1
- package/dist/x-container-B1osS5wH.js +0 -2
- package/dist/x-container-B1osS5wH.js.map +0 -1
- package/dist/x-dialog-Bk9LE0HR.css +0 -1
- package/dist/x-dialog-Cwb1fieH.js +0 -2
- package/dist/x-dialog-Cwb1fieH.js.map +0 -1
- package/dist/x-dialog-VzzVz38L.css +0 -1
- package/dist/x-dialog-eOwazoAI.js +0 -2
- package/dist/x-dialog-eOwazoAI.js.map +0 -1
- package/dist/x-divider-Bf6b5P6D.js +0 -2
- package/dist/x-divider-Bf6b5P6D.js.map +0 -1
- package/dist/x-divider-D36BIsQM.js +0 -2
- package/dist/x-divider-D36BIsQM.js.map +0 -1
- package/dist/x-dropdown-CxWpPIwn.css +0 -1
- package/dist/x-dropdown-DfwjES9w.js +0 -2
- package/dist/x-dropdown-DfwjES9w.js.map +0 -1
- package/dist/x-dropdown-GNs7ILlc.css +0 -1
- package/dist/x-dropdown-ds5_iBZ4.js +0 -2
- package/dist/x-dropdown-ds5_iBZ4.js.map +0 -1
- package/dist/x-file-input-B9mfyR4z.js +0 -2
- package/dist/x-file-input-B9mfyR4z.js.map +0 -1
- package/dist/x-file-input-BSstA5LD.css +0 -1
- package/dist/x-file-input-DftepgSQ.js +0 -2
- package/dist/x-file-input-DftepgSQ.js.map +0 -1
- package/dist/x-form-C5eClK9q.js +0 -2
- package/dist/x-form-C5eClK9q.js.map +0 -1
- package/dist/x-form-CK24VrXN.css +0 -1
- package/dist/x-form-DGUS5Veh.css +0 -1
- package/dist/x-form-etxLXE0R.js +0 -2
- package/dist/x-form-etxLXE0R.js.map +0 -1
- package/dist/x-img-CNPL9bZj.js +0 -2
- package/dist/x-img-CNPL9bZj.js.map +0 -1
- package/dist/x-img-DYWmHySi.js +0 -2
- package/dist/x-img-DYWmHySi.js.map +0 -1
- package/dist/x-load-BlPeW_ej.css +0 -1
- package/dist/x-load-CM4p-BU2.css +0 -1
- package/dist/x-load-CatWwBSt.js +0 -2
- package/dist/x-load-CatWwBSt.js.map +0 -1
- package/dist/x-load-pklPPw3d.js +0 -2
- package/dist/x-load-pklPPw3d.js.map +0 -1
- package/dist/x-menu-BmuGyRjl.css +0 -1
- package/dist/x-menu-C0JNNHR2.js +0 -2
- package/dist/x-menu-C0JNNHR2.js.map +0 -1
- package/dist/x-menu-CKBWYMym.js +0 -2
- package/dist/x-menu-CKBWYMym.js.map +0 -1
- package/dist/x-menu-item-9k48D3Mw.js +0 -2
- package/dist/x-menu-item-9k48D3Mw.js.map +0 -1
- package/dist/x-menu-item-fSf-cD7q.js +0 -2
- package/dist/x-menu-item-fSf-cD7q.js.map +0 -1
- package/dist/x-menu-label-BDlCFsFH.js +0 -2
- package/dist/x-menu-label-BDlCFsFH.js.map +0 -1
- package/dist/x-menu-label-C8o6TwqC.js +0 -2
- package/dist/x-menu-label-C8o6TwqC.js.map +0 -1
- package/dist/x-menu-label-DhRAj-fk.css +0 -1
- package/dist/x-row-DsUQg5Gm.js +0 -2
- package/dist/x-row-DsUQg5Gm.js.map +0 -1
- package/dist/x-search-C6XAaOXg.js +0 -2
- package/dist/x-search-C6XAaOXg.js.map +0 -1
- package/dist/x-search-CmWnWxsP.js +0 -2
- package/dist/x-search-CmWnWxsP.js.map +0 -1
- package/dist/x-select-C8GSGs-Z.js +0 -2
- package/dist/x-select-C8GSGs-Z.js.map +0 -1
- package/dist/x-select-Da6f14h4.js +0 -2
- package/dist/x-select-Da6f14h4.js.map +0 -1
- package/dist/x-tab-BDpZS53n.js +0 -2
- package/dist/x-tab-BDpZS53n.js.map +0 -1
- package/dist/x-tab-DV937RB-.js +0 -2
- package/dist/x-tab-DV937RB-.js.map +0 -1
- package/dist/x-tab-group-C3YcH4jU.js +0 -2
- package/dist/x-tab-group-C3YcH4jU.js.map +0 -1
- package/dist/x-tab-group-CT7pAQGH.js +0 -2
- package/dist/x-tab-group-CT7pAQGH.js.map +0 -1
- package/dist/x-tab-panel--wEPqeL9.js +0 -2
- package/dist/x-tab-panel--wEPqeL9.js.map +0 -1
- package/dist/x-tab-panel-BV2Axw5I.js +0 -2
- package/dist/x-tab-panel-BV2Axw5I.js.map +0 -1
- package/dist/x-text-field-B0juKwq0.js +0 -2
- package/dist/x-text-field-B0juKwq0.js.map +0 -1
- package/dist/x-text-field-CNuOWA3c.js +0 -2
- package/dist/x-text-field-CNuOWA3c.js.map +0 -1
- package/dist/x-tree-Aj-ivC70.js +0 -2
- package/dist/x-tree-Aj-ivC70.js.map +0 -1
- package/dist/x-tree-CUnE9yj-.js +0 -2
- package/dist/x-tree-CUnE9yj-.js.map +0 -1
- package/dist/x-tree-D0WG-8EM.css +0 -1
- package/dist/x-tree-OLo4IKf9.css +0 -1
- package/dist/xwiki-BeDAdEBl.js +0 -4
- package/dist/xwiki-BeDAdEBl.js.map +0 -1
- package/dist/xwiki-internal-link-serializer-Cd8xorru-_7nXuj98.js +0 -2
- package/dist/xwiki-internal-link-serializer-Cd8xorru-_7nXuj98.js.map +0 -1
- package/dist/xwiki-logo-color-DZ9bdNW4.svg +0 -18
- package/dist/yjs-VtUl3AlT.js +0 -6
- package/dist/yjs-VtUl3AlT.js.map +0 -1
|
@@ -1,3378 +0,0 @@
|
|
|
1
|
-
import{S as Xt,a as Ee,o as jt}from"./chunk.JXOKFADN-DpK3Q_uU.js";import{i as E,c as I,_ as i,n as a,S as A,b as _,E as Ie,A as ne}from"./chunk.4TUIT776-BvlNwMXD.js";import{d as Kt,l as re}from"./live-z5w0O4st.js";import{f as qt}from"./chunk.SI4ACBFK-BB831ml8.js";import{F as Lt,c as Le,a as Pe,v as Re}from"./chunk.3RPBFEDE-DI7eSlIl.js";import{H as $t,g as Ve}from"./chunk.NYIIDP5N-AHr3eTN0.js";import{w as x}from"./chunk.GMYPQTFK-BT1AAYXJ.js";import{e as P,a as ye,i as we,t as _e}from"./class-map-DmaCJs8c.js";import{o as F}from"./if-defined-O-hFrvt0.js";import{r as L,S as _t,a as Fe}from"./chunk.YHLNUJ7P-BGNuPG1R.js";import{a as Oe,e as $}from"./query-x48B6FB_.js";import{c as U}from"./chunk.J5ZM7LIC-n6gjp3-L.js";import{L as K}from"./chunk.6CTB5ZDJ-9Su7bEUQ.js";import{S as Be,t as Yt}from"./chunk.ZH2AND3P-CzagA8cz.js";import{S as xe}from"./chunk.36O46B5H-Cv2poSyf.js";import{b as He,S as Ne}from"./chunk.JCXLDPQF-BOaK9AtU.js";import{u as Ue}from"./static-Dm20cmTz.js";import{S as ke}from"./chunk.7E4JTYWU-Ci99jpyG.js";import{M as Xe,g as Ke,a as qe}from"./chunk.KPLQLAWP-DUYDfZ7-.js";import{l as Qt,u as Zt}from"./chunk.RWUUFNUL-BJhNq5wM.js";import{b as Ye}from"./chunk.LD4M4QGE-cX1_6HT7.js";import{s as X,p as le,a as gt,g as it,b as ct,c as ce,d as de}from"./chunk.AJ3ENQ5C-zot94vv9.js";import{w as wt}from"./chunk.B4BZKR24-B0iVuGLD.js";import{S as Ge}from"./chunk.XA43ZQPC-maNlqVLX.js";function We(t){return(e,s)=>Oe(e,s,{async get(){return await this.updateComplete,this.renderRoot?.querySelector(t)??null}})}var je=E`
|
|
2
|
-
:host {
|
|
3
|
-
--max-width: 20rem;
|
|
4
|
-
--hide-delay: 0ms;
|
|
5
|
-
--show-delay: 150ms;
|
|
6
|
-
|
|
7
|
-
display: contents;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
.tooltip {
|
|
11
|
-
--arrow-size: var(--sl-tooltip-arrow-size);
|
|
12
|
-
--arrow-color: var(--sl-tooltip-background-color);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.tooltip::part(popup) {
|
|
16
|
-
z-index: var(--sl-z-index-tooltip);
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
.tooltip[placement^='top']::part(popup) {
|
|
20
|
-
transform-origin: bottom;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.tooltip[placement^='bottom']::part(popup) {
|
|
24
|
-
transform-origin: top;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
.tooltip[placement^='left']::part(popup) {
|
|
28
|
-
transform-origin: right;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
.tooltip[placement^='right']::part(popup) {
|
|
32
|
-
transform-origin: left;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
.tooltip__body {
|
|
36
|
-
display: block;
|
|
37
|
-
width: max-content;
|
|
38
|
-
max-width: var(--max-width);
|
|
39
|
-
border-radius: var(--sl-tooltip-border-radius);
|
|
40
|
-
background-color: var(--sl-tooltip-background-color);
|
|
41
|
-
font-family: var(--sl-tooltip-font-family);
|
|
42
|
-
font-size: var(--sl-tooltip-font-size);
|
|
43
|
-
font-weight: var(--sl-tooltip-font-weight);
|
|
44
|
-
line-height: var(--sl-tooltip-line-height);
|
|
45
|
-
text-align: start;
|
|
46
|
-
white-space: normal;
|
|
47
|
-
color: var(--sl-tooltip-color);
|
|
48
|
-
padding: var(--sl-tooltip-padding);
|
|
49
|
-
pointer-events: none;
|
|
50
|
-
user-select: none;
|
|
51
|
-
-webkit-user-select: none;
|
|
52
|
-
}
|
|
53
|
-
`,q=class extends A{constructor(){super(),this.localize=new K(this),this.content="",this.placement="top",this.disabled=!1,this.distance=8,this.open=!1,this.skidding=0,this.trigger="hover focus",this.hoist=!1,this.handleBlur=()=>{this.hasTrigger("focus")&&this.hide()},this.handleClick=()=>{this.hasTrigger("click")&&(this.open?this.hide():this.show())},this.handleFocus=()=>{this.hasTrigger("focus")&&this.show()},this.handleDocumentKeyDown=t=>{t.key==="Escape"&&(t.stopPropagation(),this.hide())},this.handleMouseOver=()=>{if(this.hasTrigger("hover")){const t=le(getComputedStyle(this).getPropertyValue("--show-delay"));clearTimeout(this.hoverTimeout),this.hoverTimeout=window.setTimeout(()=>this.show(),t)}},this.handleMouseOut=()=>{if(this.hasTrigger("hover")){const t=le(getComputedStyle(this).getPropertyValue("--hide-delay"));clearTimeout(this.hoverTimeout),this.hoverTimeout=window.setTimeout(()=>this.hide(),t)}},this.addEventListener("blur",this.handleBlur,!0),this.addEventListener("focus",this.handleFocus,!0),this.addEventListener("click",this.handleClick),this.addEventListener("mouseover",this.handleMouseOver),this.addEventListener("mouseout",this.handleMouseOut)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.closeWatcher)==null||t.destroy(),document.removeEventListener("keydown",this.handleDocumentKeyDown)}firstUpdated(){this.body.hidden=!this.open,this.open&&(this.popup.active=!0,this.popup.reposition())}hasTrigger(t){return this.trigger.split(" ").includes(t)}async handleOpenChange(){var t,e;if(this.open){if(this.disabled)return;this.emit("sl-show"),"CloseWatcher"in window?((t=this.closeWatcher)==null||t.destroy(),this.closeWatcher=new CloseWatcher,this.closeWatcher.onclose=()=>{this.hide()}):document.addEventListener("keydown",this.handleDocumentKeyDown),await gt(this.body),this.body.hidden=!1,this.popup.active=!0;const{keyframes:s,options:r}=it(this,"tooltip.show",{dir:this.localize.dir()});await ct(this.popup.popup,s,r),this.popup.reposition(),this.emit("sl-after-show")}else{this.emit("sl-hide"),(e=this.closeWatcher)==null||e.destroy(),document.removeEventListener("keydown",this.handleDocumentKeyDown),await gt(this.body);const{keyframes:s,options:r}=it(this,"tooltip.hide",{dir:this.localize.dir()});await ct(this.popup.popup,s,r),this.popup.active=!1,this.body.hidden=!0,this.emit("sl-after-hide")}}async handleOptionsChange(){this.hasUpdated&&(await this.updateComplete,this.popup.reposition())}handleDisabledChange(){this.disabled&&this.open&&this.hide()}async show(){if(!this.open)return this.open=!0,wt(this,"sl-after-show")}async hide(){if(this.open)return this.open=!1,wt(this,"sl-after-hide")}render(){return _`
|
|
54
|
-
<sl-popup
|
|
55
|
-
part="base"
|
|
56
|
-
exportparts="
|
|
57
|
-
popup:base__popup,
|
|
58
|
-
arrow:base__arrow
|
|
59
|
-
"
|
|
60
|
-
class=${P({tooltip:!0,"tooltip--open":this.open})}
|
|
61
|
-
placement=${this.placement}
|
|
62
|
-
distance=${this.distance}
|
|
63
|
-
skidding=${this.skidding}
|
|
64
|
-
strategy=${this.hoist?"fixed":"absolute"}
|
|
65
|
-
flip
|
|
66
|
-
shift
|
|
67
|
-
arrow
|
|
68
|
-
hover-bridge
|
|
69
|
-
>
|
|
70
|
-
${""}
|
|
71
|
-
<slot slot="anchor" aria-describedby="tooltip"></slot>
|
|
72
|
-
|
|
73
|
-
${""}
|
|
74
|
-
<div part="body" id="tooltip" class="tooltip__body" role="tooltip" aria-live=${this.open?"polite":"off"}>
|
|
75
|
-
<slot name="content">${this.content}</slot>
|
|
76
|
-
</div>
|
|
77
|
-
</sl-popup>
|
|
78
|
-
`}};q.styles=[I,je];q.dependencies={"sl-popup":Xt};i([$("slot:not([name])")],q.prototype,"defaultSlot",2);i([$(".tooltip__body")],q.prototype,"body",2);i([$("sl-popup")],q.prototype,"popup",2);i([a()],q.prototype,"content",2);i([a()],q.prototype,"placement",2);i([a({type:Boolean,reflect:!0})],q.prototype,"disabled",2);i([a({type:Number})],q.prototype,"distance",2);i([a({type:Boolean,reflect:!0})],q.prototype,"open",2);i([a({type:Number})],q.prototype,"skidding",2);i([a()],q.prototype,"trigger",2);i([a({type:Boolean})],q.prototype,"hoist",2);i([x("open",{waitUntilFirstUpdate:!0})],q.prototype,"handleOpenChange",1);i([x(["content","distance","hoist","placement","skidding"])],q.prototype,"handleOptionsChange",1);i([x("disabled")],q.prototype,"handleDisabledChange",1);X("tooltip.show",{keyframes:[{opacity:0,scale:.8},{opacity:1,scale:1}],options:{duration:150,easing:"ease"}});X("tooltip.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.8}],options:{duration:150,easing:"ease"}});q.define("sl-tooltip");var Qe=E`
|
|
79
|
-
:host(:not(:focus-within)) {
|
|
80
|
-
position: absolute !important;
|
|
81
|
-
width: 1px !important;
|
|
82
|
-
height: 1px !important;
|
|
83
|
-
clip: rect(0 0 0 0) !important;
|
|
84
|
-
clip-path: inset(50%) !important;
|
|
85
|
-
border: none !important;
|
|
86
|
-
overflow: hidden !important;
|
|
87
|
-
white-space: nowrap !important;
|
|
88
|
-
padding: 0 !important;
|
|
89
|
-
}
|
|
90
|
-
`,oe=class extends A{render(){return _` <slot></slot> `}};oe.styles=[I,Qe];oe.define("sl-visually-hidden");Ee.define("sl-tag");var Ze=E`
|
|
91
|
-
:host {
|
|
92
|
-
display: block;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.textarea {
|
|
96
|
-
display: grid;
|
|
97
|
-
align-items: center;
|
|
98
|
-
position: relative;
|
|
99
|
-
width: 100%;
|
|
100
|
-
font-family: var(--sl-input-font-family);
|
|
101
|
-
font-weight: var(--sl-input-font-weight);
|
|
102
|
-
line-height: var(--sl-line-height-normal);
|
|
103
|
-
letter-spacing: var(--sl-input-letter-spacing);
|
|
104
|
-
vertical-align: middle;
|
|
105
|
-
transition:
|
|
106
|
-
var(--sl-transition-fast) color,
|
|
107
|
-
var(--sl-transition-fast) border,
|
|
108
|
-
var(--sl-transition-fast) box-shadow,
|
|
109
|
-
var(--sl-transition-fast) background-color;
|
|
110
|
-
cursor: text;
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
/* Standard textareas */
|
|
114
|
-
.textarea--standard {
|
|
115
|
-
background-color: var(--sl-input-background-color);
|
|
116
|
-
border: solid var(--sl-input-border-width) var(--sl-input-border-color);
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
.textarea--standard:hover:not(.textarea--disabled) {
|
|
120
|
-
background-color: var(--sl-input-background-color-hover);
|
|
121
|
-
border-color: var(--sl-input-border-color-hover);
|
|
122
|
-
}
|
|
123
|
-
.textarea--standard:hover:not(.textarea--disabled) .textarea__control {
|
|
124
|
-
color: var(--sl-input-color-hover);
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
.textarea--standard.textarea--focused:not(.textarea--disabled) {
|
|
128
|
-
background-color: var(--sl-input-background-color-focus);
|
|
129
|
-
border-color: var(--sl-input-border-color-focus);
|
|
130
|
-
color: var(--sl-input-color-focus);
|
|
131
|
-
box-shadow: 0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color);
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
.textarea--standard.textarea--focused:not(.textarea--disabled) .textarea__control {
|
|
135
|
-
color: var(--sl-input-color-focus);
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
.textarea--standard.textarea--disabled {
|
|
139
|
-
background-color: var(--sl-input-background-color-disabled);
|
|
140
|
-
border-color: var(--sl-input-border-color-disabled);
|
|
141
|
-
opacity: 0.5;
|
|
142
|
-
cursor: not-allowed;
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
.textarea__control,
|
|
146
|
-
.textarea__size-adjuster {
|
|
147
|
-
grid-area: 1 / 1 / 2 / 2;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
.textarea__size-adjuster {
|
|
151
|
-
visibility: hidden;
|
|
152
|
-
pointer-events: none;
|
|
153
|
-
opacity: 0;
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
.textarea--standard.textarea--disabled .textarea__control {
|
|
157
|
-
color: var(--sl-input-color-disabled);
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
.textarea--standard.textarea--disabled .textarea__control::placeholder {
|
|
161
|
-
color: var(--sl-input-placeholder-color-disabled);
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
/* Filled textareas */
|
|
165
|
-
.textarea--filled {
|
|
166
|
-
border: none;
|
|
167
|
-
background-color: var(--sl-input-filled-background-color);
|
|
168
|
-
color: var(--sl-input-color);
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
.textarea--filled:hover:not(.textarea--disabled) {
|
|
172
|
-
background-color: var(--sl-input-filled-background-color-hover);
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
.textarea--filled.textarea--focused:not(.textarea--disabled) {
|
|
176
|
-
background-color: var(--sl-input-filled-background-color-focus);
|
|
177
|
-
outline: var(--sl-focus-ring);
|
|
178
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
179
|
-
}
|
|
180
|
-
|
|
181
|
-
.textarea--filled.textarea--disabled {
|
|
182
|
-
background-color: var(--sl-input-filled-background-color-disabled);
|
|
183
|
-
opacity: 0.5;
|
|
184
|
-
cursor: not-allowed;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.textarea__control {
|
|
188
|
-
font-family: inherit;
|
|
189
|
-
font-size: inherit;
|
|
190
|
-
font-weight: inherit;
|
|
191
|
-
line-height: 1.4;
|
|
192
|
-
color: var(--sl-input-color);
|
|
193
|
-
border: none;
|
|
194
|
-
background: none;
|
|
195
|
-
box-shadow: none;
|
|
196
|
-
cursor: inherit;
|
|
197
|
-
-webkit-appearance: none;
|
|
198
|
-
}
|
|
199
|
-
|
|
200
|
-
.textarea__control::-webkit-search-decoration,
|
|
201
|
-
.textarea__control::-webkit-search-cancel-button,
|
|
202
|
-
.textarea__control::-webkit-search-results-button,
|
|
203
|
-
.textarea__control::-webkit-search-results-decoration {
|
|
204
|
-
-webkit-appearance: none;
|
|
205
|
-
}
|
|
206
|
-
|
|
207
|
-
.textarea__control::placeholder {
|
|
208
|
-
color: var(--sl-input-placeholder-color);
|
|
209
|
-
user-select: none;
|
|
210
|
-
-webkit-user-select: none;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
.textarea__control:focus {
|
|
214
|
-
outline: none;
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
/*
|
|
218
|
-
* Size modifiers
|
|
219
|
-
*/
|
|
220
|
-
|
|
221
|
-
.textarea--small {
|
|
222
|
-
border-radius: var(--sl-input-border-radius-small);
|
|
223
|
-
font-size: var(--sl-input-font-size-small);
|
|
224
|
-
}
|
|
225
|
-
|
|
226
|
-
.textarea--small .textarea__control {
|
|
227
|
-
padding: 0.5em var(--sl-input-spacing-small);
|
|
228
|
-
}
|
|
229
|
-
|
|
230
|
-
.textarea--medium {
|
|
231
|
-
border-radius: var(--sl-input-border-radius-medium);
|
|
232
|
-
font-size: var(--sl-input-font-size-medium);
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
.textarea--medium .textarea__control {
|
|
236
|
-
padding: 0.5em var(--sl-input-spacing-medium);
|
|
237
|
-
}
|
|
238
|
-
|
|
239
|
-
.textarea--large {
|
|
240
|
-
border-radius: var(--sl-input-border-radius-large);
|
|
241
|
-
font-size: var(--sl-input-font-size-large);
|
|
242
|
-
}
|
|
243
|
-
|
|
244
|
-
.textarea--large .textarea__control {
|
|
245
|
-
padding: 0.5em var(--sl-input-spacing-large);
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
/*
|
|
249
|
-
* Resize types
|
|
250
|
-
*/
|
|
251
|
-
|
|
252
|
-
.textarea--resize-none .textarea__control {
|
|
253
|
-
resize: none;
|
|
254
|
-
}
|
|
255
|
-
|
|
256
|
-
.textarea--resize-vertical .textarea__control {
|
|
257
|
-
resize: vertical;
|
|
258
|
-
}
|
|
259
|
-
|
|
260
|
-
.textarea--resize-auto .textarea__control {
|
|
261
|
-
height: auto;
|
|
262
|
-
resize: none;
|
|
263
|
-
overflow-y: hidden;
|
|
264
|
-
}
|
|
265
|
-
`,D=class extends A{constructor(){super(...arguments),this.formControlController=new Lt(this,{assumeInteractionOn:["sl-blur","sl-input"]}),this.hasSlotController=new $t(this,"help-text","label"),this.hasFocus=!1,this.title="",this.name="",this.value="",this.size="medium",this.filled=!1,this.label="",this.helpText="",this.placeholder="",this.rows=4,this.resize="vertical",this.disabled=!1,this.readonly=!1,this.form="",this.required=!1,this.spellcheck=!0,this.defaultValue=""}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver(()=>this.setTextareaHeight()),this.updateComplete.then(()=>{this.setTextareaHeight(),this.resizeObserver.observe(this.input)})}firstUpdated(){this.formControlController.updateValidity()}disconnectedCallback(){var t;super.disconnectedCallback(),this.input&&((t=this.resizeObserver)==null||t.unobserve(this.input))}handleBlur(){this.hasFocus=!1,this.emit("sl-blur")}handleChange(){this.value=this.input.value,this.setTextareaHeight(),this.emit("sl-change")}handleFocus(){this.hasFocus=!0,this.emit("sl-focus")}handleInput(){this.value=this.input.value,this.emit("sl-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}setTextareaHeight(){this.resize==="auto"?(this.sizeAdjuster.style.height=`${this.input.clientHeight}px`,this.input.style.height="auto",this.input.style.height=`${this.input.scrollHeight}px`):this.input.style.height=""}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleRowsChange(){this.setTextareaHeight()}async handleValueChange(){await this.updateComplete,this.formControlController.updateValidity(),this.setTextareaHeight()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}scrollPosition(t){if(t){typeof t.top=="number"&&(this.input.scrollTop=t.top),typeof t.left=="number"&&(this.input.scrollLeft=t.left);return}return{top:this.input.scrollTop,left:this.input.scrollTop}}setSelectionRange(t,e,s="none"){this.input.setSelectionRange(t,e,s)}setRangeText(t,e,s,r="preserve"){const o=e??this.input.selectionStart,n=s??this.input.selectionEnd;this.input.setRangeText(t,o,n,r),this.value!==this.input.value&&(this.value=this.input.value,this.setTextareaHeight())}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){const t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),s=this.label?!0:!!t,r=this.helpText?!0:!!e;return _`
|
|
266
|
-
<div
|
|
267
|
-
part="form-control"
|
|
268
|
-
class=${P({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--has-label":s,"form-control--has-help-text":r})}
|
|
269
|
-
>
|
|
270
|
-
<label
|
|
271
|
-
part="form-control-label"
|
|
272
|
-
class="form-control__label"
|
|
273
|
-
for="input"
|
|
274
|
-
aria-hidden=${s?"false":"true"}
|
|
275
|
-
>
|
|
276
|
-
<slot name="label">${this.label}</slot>
|
|
277
|
-
</label>
|
|
278
|
-
|
|
279
|
-
<div part="form-control-input" class="form-control-input">
|
|
280
|
-
<div
|
|
281
|
-
part="base"
|
|
282
|
-
class=${P({textarea:!0,"textarea--small":this.size==="small","textarea--medium":this.size==="medium","textarea--large":this.size==="large","textarea--standard":!this.filled,"textarea--filled":this.filled,"textarea--disabled":this.disabled,"textarea--focused":this.hasFocus,"textarea--empty":!this.value,"textarea--resize-none":this.resize==="none","textarea--resize-vertical":this.resize==="vertical","textarea--resize-auto":this.resize==="auto"})}
|
|
283
|
-
>
|
|
284
|
-
<textarea
|
|
285
|
-
part="textarea"
|
|
286
|
-
id="input"
|
|
287
|
-
class="textarea__control"
|
|
288
|
-
title=${this.title}
|
|
289
|
-
name=${F(this.name)}
|
|
290
|
-
.value=${re(this.value)}
|
|
291
|
-
?disabled=${this.disabled}
|
|
292
|
-
?readonly=${this.readonly}
|
|
293
|
-
?required=${this.required}
|
|
294
|
-
placeholder=${F(this.placeholder)}
|
|
295
|
-
rows=${F(this.rows)}
|
|
296
|
-
minlength=${F(this.minlength)}
|
|
297
|
-
maxlength=${F(this.maxlength)}
|
|
298
|
-
autocapitalize=${F(this.autocapitalize)}
|
|
299
|
-
autocorrect=${F(this.autocorrect)}
|
|
300
|
-
?autofocus=${this.autofocus}
|
|
301
|
-
spellcheck=${F(this.spellcheck)}
|
|
302
|
-
enterkeyhint=${F(this.enterkeyhint)}
|
|
303
|
-
inputmode=${F(this.inputmode)}
|
|
304
|
-
aria-describedby="help-text"
|
|
305
|
-
@change=${this.handleChange}
|
|
306
|
-
@input=${this.handleInput}
|
|
307
|
-
@invalid=${this.handleInvalid}
|
|
308
|
-
@focus=${this.handleFocus}
|
|
309
|
-
@blur=${this.handleBlur}
|
|
310
|
-
></textarea>
|
|
311
|
-
<!-- This "adjuster" exists to prevent layout shifting. https://github.com/shoelace-style/shoelace/issues/2180 -->
|
|
312
|
-
<div part="textarea-adjuster" class="textarea__size-adjuster" ?hidden=${this.resize!=="auto"}></div>
|
|
313
|
-
</div>
|
|
314
|
-
</div>
|
|
315
|
-
|
|
316
|
-
<div
|
|
317
|
-
part="form-control-help-text"
|
|
318
|
-
id="help-text"
|
|
319
|
-
class="form-control__help-text"
|
|
320
|
-
aria-hidden=${r?"false":"true"}
|
|
321
|
-
>
|
|
322
|
-
<slot name="help-text">${this.helpText}</slot>
|
|
323
|
-
</div>
|
|
324
|
-
</div>
|
|
325
|
-
`}};D.styles=[I,qt,Ze];i([$(".textarea__control")],D.prototype,"input",2);i([$(".textarea__size-adjuster")],D.prototype,"sizeAdjuster",2);i([L()],D.prototype,"hasFocus",2);i([a()],D.prototype,"title",2);i([a()],D.prototype,"name",2);i([a()],D.prototype,"value",2);i([a({reflect:!0})],D.prototype,"size",2);i([a({type:Boolean,reflect:!0})],D.prototype,"filled",2);i([a()],D.prototype,"label",2);i([a({attribute:"help-text"})],D.prototype,"helpText",2);i([a()],D.prototype,"placeholder",2);i([a({type:Number})],D.prototype,"rows",2);i([a()],D.prototype,"resize",2);i([a({type:Boolean,reflect:!0})],D.prototype,"disabled",2);i([a({type:Boolean,reflect:!0})],D.prototype,"readonly",2);i([a({reflect:!0})],D.prototype,"form",2);i([a({type:Boolean,reflect:!0})],D.prototype,"required",2);i([a({type:Number})],D.prototype,"minlength",2);i([a({type:Number})],D.prototype,"maxlength",2);i([a()],D.prototype,"autocapitalize",2);i([a()],D.prototype,"autocorrect",2);i([a()],D.prototype,"autocomplete",2);i([a({type:Boolean})],D.prototype,"autofocus",2);i([a()],D.prototype,"enterkeyhint",2);i([a({type:Boolean,converter:{fromAttribute:t=>!(!t||t==="false"),toAttribute:t=>t?"true":"false"}})],D.prototype,"spellcheck",2);i([a()],D.prototype,"inputmode",2);i([Kt()],D.prototype,"defaultValue",2);i([x("disabled",{waitUntilFirstUpdate:!0})],D.prototype,"handleDisabledChange",1);i([x("rows",{waitUntilFirstUpdate:!0})],D.prototype,"handleRowsChange",1);i([x("value",{waitUntilFirstUpdate:!0})],D.prototype,"handleValueChange",1);D.define("sl-textarea");var Je=E`
|
|
326
|
-
:host {
|
|
327
|
-
--border-radius: var(--sl-border-radius-pill);
|
|
328
|
-
--color: var(--sl-color-neutral-200);
|
|
329
|
-
--sheen-color: var(--sl-color-neutral-300);
|
|
330
|
-
|
|
331
|
-
display: block;
|
|
332
|
-
position: relative;
|
|
333
|
-
}
|
|
334
|
-
|
|
335
|
-
.skeleton {
|
|
336
|
-
display: flex;
|
|
337
|
-
width: 100%;
|
|
338
|
-
height: 100%;
|
|
339
|
-
min-height: 1rem;
|
|
340
|
-
}
|
|
341
|
-
|
|
342
|
-
.skeleton__indicator {
|
|
343
|
-
flex: 1 1 auto;
|
|
344
|
-
background: var(--color);
|
|
345
|
-
border-radius: var(--border-radius);
|
|
346
|
-
}
|
|
347
|
-
|
|
348
|
-
.skeleton--sheen .skeleton__indicator {
|
|
349
|
-
background: linear-gradient(270deg, var(--sheen-color), var(--color), var(--color), var(--sheen-color));
|
|
350
|
-
background-size: 400% 100%;
|
|
351
|
-
animation: sheen 8s ease-in-out infinite;
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
.skeleton--pulse .skeleton__indicator {
|
|
355
|
-
animation: pulse 2s ease-in-out 0.5s infinite;
|
|
356
|
-
}
|
|
357
|
-
|
|
358
|
-
/* Forced colors mode */
|
|
359
|
-
@media (forced-colors: active) {
|
|
360
|
-
:host {
|
|
361
|
-
--color: GrayText;
|
|
362
|
-
}
|
|
363
|
-
}
|
|
364
|
-
|
|
365
|
-
@keyframes sheen {
|
|
366
|
-
0% {
|
|
367
|
-
background-position: 200% 0;
|
|
368
|
-
}
|
|
369
|
-
to {
|
|
370
|
-
background-position: -200% 0;
|
|
371
|
-
}
|
|
372
|
-
}
|
|
373
|
-
|
|
374
|
-
@keyframes pulse {
|
|
375
|
-
0% {
|
|
376
|
-
opacity: 1;
|
|
377
|
-
}
|
|
378
|
-
50% {
|
|
379
|
-
opacity: 0.4;
|
|
380
|
-
}
|
|
381
|
-
100% {
|
|
382
|
-
opacity: 1;
|
|
383
|
-
}
|
|
384
|
-
}
|
|
385
|
-
`,ae=class extends A{constructor(){super(...arguments),this.effect="none"}render(){return _`
|
|
386
|
-
<div
|
|
387
|
-
part="base"
|
|
388
|
-
class=${P({skeleton:!0,"skeleton--pulse":this.effect==="pulse","skeleton--sheen":this.effect==="sheen"})}
|
|
389
|
-
>
|
|
390
|
-
<div part="indicator" class="skeleton__indicator"></div>
|
|
391
|
-
</div>
|
|
392
|
-
`}};ae.styles=[I,Je];i([a()],ae.prototype,"effect",2);ae.define("sl-skeleton");var ts=E`
|
|
393
|
-
:host {
|
|
394
|
-
--divider-width: 4px;
|
|
395
|
-
--divider-hit-area: 12px;
|
|
396
|
-
--min: 0%;
|
|
397
|
-
--max: 100%;
|
|
398
|
-
|
|
399
|
-
display: grid;
|
|
400
|
-
}
|
|
401
|
-
|
|
402
|
-
.start,
|
|
403
|
-
.end {
|
|
404
|
-
overflow: hidden;
|
|
405
|
-
}
|
|
406
|
-
|
|
407
|
-
.divider {
|
|
408
|
-
flex: 0 0 var(--divider-width);
|
|
409
|
-
display: flex;
|
|
410
|
-
position: relative;
|
|
411
|
-
align-items: center;
|
|
412
|
-
justify-content: center;
|
|
413
|
-
background-color: var(--sl-color-neutral-200);
|
|
414
|
-
color: var(--sl-color-neutral-900);
|
|
415
|
-
z-index: 1;
|
|
416
|
-
}
|
|
417
|
-
|
|
418
|
-
.divider:focus {
|
|
419
|
-
outline: none;
|
|
420
|
-
}
|
|
421
|
-
|
|
422
|
-
:host(:not([disabled])) .divider:focus-visible {
|
|
423
|
-
background-color: var(--sl-color-primary-600);
|
|
424
|
-
color: var(--sl-color-neutral-0);
|
|
425
|
-
}
|
|
426
|
-
|
|
427
|
-
:host([disabled]) .divider {
|
|
428
|
-
cursor: not-allowed;
|
|
429
|
-
}
|
|
430
|
-
|
|
431
|
-
/* Horizontal */
|
|
432
|
-
:host(:not([vertical], [disabled])) .divider {
|
|
433
|
-
cursor: col-resize;
|
|
434
|
-
}
|
|
435
|
-
|
|
436
|
-
:host(:not([vertical])) .divider::after {
|
|
437
|
-
display: flex;
|
|
438
|
-
content: '';
|
|
439
|
-
position: absolute;
|
|
440
|
-
height: 100%;
|
|
441
|
-
left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);
|
|
442
|
-
width: var(--divider-hit-area);
|
|
443
|
-
}
|
|
444
|
-
|
|
445
|
-
/* Vertical */
|
|
446
|
-
:host([vertical]) {
|
|
447
|
-
flex-direction: column;
|
|
448
|
-
}
|
|
449
|
-
|
|
450
|
-
:host([vertical]:not([disabled])) .divider {
|
|
451
|
-
cursor: row-resize;
|
|
452
|
-
}
|
|
453
|
-
|
|
454
|
-
:host([vertical]) .divider::after {
|
|
455
|
-
content: '';
|
|
456
|
-
position: absolute;
|
|
457
|
-
width: 100%;
|
|
458
|
-
top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);
|
|
459
|
-
height: var(--divider-hit-area);
|
|
460
|
-
}
|
|
461
|
-
|
|
462
|
-
@media (forced-colors: active) {
|
|
463
|
-
.divider {
|
|
464
|
-
outline: solid 1px transparent;
|
|
465
|
-
}
|
|
466
|
-
}
|
|
467
|
-
`;function Et(t,e){function s(o){const n=t.getBoundingClientRect(),h=t.ownerDocument.defaultView,p=n.left+h.scrollX,l=n.top+h.scrollY,u=o.pageX-p,v=o.pageY-l;e?.onMove&&e.onMove(u,v)}function r(){document.removeEventListener("pointermove",s),document.removeEventListener("pointerup",r),e?.onStop&&e.onStop()}document.addEventListener("pointermove",s,{passive:!0}),document.addEventListener("pointerup",r),e?.initialEvent instanceof PointerEvent&&s(e.initialEvent)}var he=()=>null,rt=class extends A{constructor(){super(...arguments),this.isCollapsed=!1,this.localize=new K(this),this.positionBeforeCollapsing=0,this.position=50,this.vertical=!1,this.disabled=!1,this.snapValue="",this.snapFunction=he,this.snapThreshold=12}toSnapFunction(t){const e=t.split(" ");return({pos:s,size:r,snapThreshold:o,isRtl:n,vertical:h})=>{let p=s,l=Number.POSITIVE_INFINITY;return e.forEach(u=>{let v;if(u.startsWith("repeat(")){const d=t.substring(7,t.length-1),g=d.endsWith("%"),f=Number.parseFloat(d),y=g?r*(f/100):f;v=Math.round((n&&!h?r-s:s)/y)*y}else u.endsWith("%")?v=r*(Number.parseFloat(u)/100):v=Number.parseFloat(u);n&&!h&&(v=r-v);const c=Math.abs(s-v);c<=o&&c<l&&(p=v,l=c)}),p}}set snap(t){this.snapValue=t??"",t?this.snapFunction=typeof t=="string"?this.toSnapFunction(t):t:this.snapFunction=he}get snap(){return this.snapValue}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver(t=>this.handleResize(t)),this.updateComplete.then(()=>this.resizeObserver.observe(this)),this.detectSize(),this.cachedPositionInPixels=this.percentageToPixels(this.position)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.resizeObserver)==null||t.unobserve(this)}detectSize(){const{width:t,height:e}=this.getBoundingClientRect();this.size=this.vertical?e:t}percentageToPixels(t){return this.size*(t/100)}pixelsToPercentage(t){return t/this.size*100}handleDrag(t){const e=this.localize.dir()==="rtl";this.disabled||(t.cancelable&&t.preventDefault(),Et(this,{onMove:(s,r)=>{var o;let n=this.vertical?r:s;this.primary==="end"&&(n=this.size-n),n=(o=this.snapFunction({pos:n,size:this.size,snapThreshold:this.snapThreshold,isRtl:e,vertical:this.vertical}))!=null?o:n,this.position=U(this.pixelsToPercentage(n),0,100)},initialEvent:t}))}handleKeyDown(t){if(!this.disabled&&["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End","Enter"].includes(t.key)){let e=this.position;const s=(t.shiftKey?10:1)*(this.primary==="end"?-1:1);if(t.preventDefault(),(t.key==="ArrowLeft"&&!this.vertical||t.key==="ArrowUp"&&this.vertical)&&(e-=s),(t.key==="ArrowRight"&&!this.vertical||t.key==="ArrowDown"&&this.vertical)&&(e+=s),t.key==="Home"&&(e=this.primary==="end"?100:0),t.key==="End"&&(e=this.primary==="end"?0:100),t.key==="Enter")if(this.isCollapsed)e=this.positionBeforeCollapsing,this.isCollapsed=!1;else{const r=this.position;e=0,requestAnimationFrame(()=>{this.isCollapsed=!0,this.positionBeforeCollapsing=r})}this.position=U(e,0,100)}}handleResize(t){const{width:e,height:s}=t[0].contentRect;this.size=this.vertical?s:e,(isNaN(this.cachedPositionInPixels)||this.position===1/0)&&(this.cachedPositionInPixels=Number(this.getAttribute("position-in-pixels")),this.positionInPixels=Number(this.getAttribute("position-in-pixels")),this.position=this.pixelsToPercentage(this.positionInPixels)),this.primary&&(this.position=this.pixelsToPercentage(this.cachedPositionInPixels))}handlePositionChange(){this.cachedPositionInPixels=this.percentageToPixels(this.position),this.isCollapsed=!1,this.positionBeforeCollapsing=0,this.positionInPixels=this.percentageToPixels(this.position),this.emit("sl-reposition")}handlePositionInPixelsChange(){this.position=this.pixelsToPercentage(this.positionInPixels)}handleVerticalChange(){this.detectSize()}render(){const t=this.vertical?"gridTemplateRows":"gridTemplateColumns",e=this.vertical?"gridTemplateColumns":"gridTemplateRows",s=this.localize.dir()==="rtl",r=`
|
|
468
|
-
clamp(
|
|
469
|
-
0%,
|
|
470
|
-
clamp(
|
|
471
|
-
var(--min),
|
|
472
|
-
${this.position}% - var(--divider-width) / 2,
|
|
473
|
-
var(--max)
|
|
474
|
-
),
|
|
475
|
-
calc(100% - var(--divider-width))
|
|
476
|
-
)
|
|
477
|
-
`,o="auto";return this.primary==="end"?s&&!this.vertical?this.style[t]=`${r} var(--divider-width) ${o}`:this.style[t]=`${o} var(--divider-width) ${r}`:s&&!this.vertical?this.style[t]=`${o} var(--divider-width) ${r}`:this.style[t]=`${r} var(--divider-width) ${o}`,this.style[e]="",_`
|
|
478
|
-
<slot name="start" part="panel start" class="start"></slot>
|
|
479
|
-
|
|
480
|
-
<div
|
|
481
|
-
part="divider"
|
|
482
|
-
class="divider"
|
|
483
|
-
tabindex=${F(this.disabled?void 0:"0")}
|
|
484
|
-
role="separator"
|
|
485
|
-
aria-valuenow=${this.position}
|
|
486
|
-
aria-valuemin="0"
|
|
487
|
-
aria-valuemax="100"
|
|
488
|
-
aria-label=${this.localize.term("resize")}
|
|
489
|
-
@keydown=${this.handleKeyDown}
|
|
490
|
-
@mousedown=${this.handleDrag}
|
|
491
|
-
@touchstart=${this.handleDrag}
|
|
492
|
-
>
|
|
493
|
-
<slot name="divider"></slot>
|
|
494
|
-
</div>
|
|
495
|
-
|
|
496
|
-
<slot name="end" part="panel end" class="end"></slot>
|
|
497
|
-
`}};rt.styles=[I,ts];i([$(".divider")],rt.prototype,"divider",2);i([a({type:Number,reflect:!0})],rt.prototype,"position",2);i([a({attribute:"position-in-pixels",type:Number})],rt.prototype,"positionInPixels",2);i([a({type:Boolean,reflect:!0})],rt.prototype,"vertical",2);i([a({type:Boolean,reflect:!0})],rt.prototype,"disabled",2);i([a()],rt.prototype,"primary",2);i([a({reflect:!0})],rt.prototype,"snap",1);i([a({type:Number,attribute:"snap-threshold"})],rt.prototype,"snapThreshold",2);i([x("position")],rt.prototype,"handlePositionChange",1);i([x("positionInPixels")],rt.prototype,"handlePositionInPixelsChange",1);i([x("vertical")],rt.prototype,"handleVerticalChange",1);rt.define("sl-split-panel");var es=E`
|
|
498
|
-
:host {
|
|
499
|
-
display: inline-block;
|
|
500
|
-
}
|
|
501
|
-
|
|
502
|
-
:host([size='small']) {
|
|
503
|
-
--height: var(--sl-toggle-size-small);
|
|
504
|
-
--thumb-size: calc(var(--sl-toggle-size-small) + 4px);
|
|
505
|
-
--width: calc(var(--height) * 2);
|
|
506
|
-
|
|
507
|
-
font-size: var(--sl-input-font-size-small);
|
|
508
|
-
}
|
|
509
|
-
|
|
510
|
-
:host([size='medium']) {
|
|
511
|
-
--height: var(--sl-toggle-size-medium);
|
|
512
|
-
--thumb-size: calc(var(--sl-toggle-size-medium) + 4px);
|
|
513
|
-
--width: calc(var(--height) * 2);
|
|
514
|
-
|
|
515
|
-
font-size: var(--sl-input-font-size-medium);
|
|
516
|
-
}
|
|
517
|
-
|
|
518
|
-
:host([size='large']) {
|
|
519
|
-
--height: var(--sl-toggle-size-large);
|
|
520
|
-
--thumb-size: calc(var(--sl-toggle-size-large) + 4px);
|
|
521
|
-
--width: calc(var(--height) * 2);
|
|
522
|
-
|
|
523
|
-
font-size: var(--sl-input-font-size-large);
|
|
524
|
-
}
|
|
525
|
-
|
|
526
|
-
.switch {
|
|
527
|
-
position: relative;
|
|
528
|
-
display: inline-flex;
|
|
529
|
-
align-items: center;
|
|
530
|
-
font-family: var(--sl-input-font-family);
|
|
531
|
-
font-size: inherit;
|
|
532
|
-
font-weight: var(--sl-input-font-weight);
|
|
533
|
-
color: var(--sl-input-label-color);
|
|
534
|
-
vertical-align: middle;
|
|
535
|
-
cursor: pointer;
|
|
536
|
-
}
|
|
537
|
-
|
|
538
|
-
.switch__control {
|
|
539
|
-
flex: 0 0 auto;
|
|
540
|
-
position: relative;
|
|
541
|
-
display: inline-flex;
|
|
542
|
-
align-items: center;
|
|
543
|
-
justify-content: center;
|
|
544
|
-
width: var(--width);
|
|
545
|
-
height: var(--height);
|
|
546
|
-
background-color: var(--sl-color-neutral-400);
|
|
547
|
-
border: solid var(--sl-input-border-width) var(--sl-color-neutral-400);
|
|
548
|
-
border-radius: var(--height);
|
|
549
|
-
transition:
|
|
550
|
-
var(--sl-transition-fast) border-color,
|
|
551
|
-
var(--sl-transition-fast) background-color;
|
|
552
|
-
}
|
|
553
|
-
|
|
554
|
-
.switch__control .switch__thumb {
|
|
555
|
-
width: var(--thumb-size);
|
|
556
|
-
height: var(--thumb-size);
|
|
557
|
-
background-color: var(--sl-color-neutral-0);
|
|
558
|
-
border-radius: 50%;
|
|
559
|
-
border: solid var(--sl-input-border-width) var(--sl-color-neutral-400);
|
|
560
|
-
translate: calc((var(--width) - var(--height)) / -2);
|
|
561
|
-
transition:
|
|
562
|
-
var(--sl-transition-fast) translate ease,
|
|
563
|
-
var(--sl-transition-fast) background-color,
|
|
564
|
-
var(--sl-transition-fast) border-color,
|
|
565
|
-
var(--sl-transition-fast) box-shadow;
|
|
566
|
-
}
|
|
567
|
-
|
|
568
|
-
.switch__input {
|
|
569
|
-
position: absolute;
|
|
570
|
-
opacity: 0;
|
|
571
|
-
padding: 0;
|
|
572
|
-
margin: 0;
|
|
573
|
-
pointer-events: none;
|
|
574
|
-
}
|
|
575
|
-
|
|
576
|
-
/* Hover */
|
|
577
|
-
.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {
|
|
578
|
-
background-color: var(--sl-color-neutral-400);
|
|
579
|
-
border-color: var(--sl-color-neutral-400);
|
|
580
|
-
}
|
|
581
|
-
|
|
582
|
-
.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {
|
|
583
|
-
background-color: var(--sl-color-neutral-0);
|
|
584
|
-
border-color: var(--sl-color-neutral-400);
|
|
585
|
-
}
|
|
586
|
-
|
|
587
|
-
/* Focus */
|
|
588
|
-
.switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
|
|
589
|
-
background-color: var(--sl-color-neutral-400);
|
|
590
|
-
border-color: var(--sl-color-neutral-400);
|
|
591
|
-
}
|
|
592
|
-
|
|
593
|
-
.switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {
|
|
594
|
-
background-color: var(--sl-color-neutral-0);
|
|
595
|
-
border-color: var(--sl-color-primary-600);
|
|
596
|
-
outline: var(--sl-focus-ring);
|
|
597
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
598
|
-
}
|
|
599
|
-
|
|
600
|
-
/* Checked */
|
|
601
|
-
.switch--checked .switch__control {
|
|
602
|
-
background-color: var(--sl-color-primary-600);
|
|
603
|
-
border-color: var(--sl-color-primary-600);
|
|
604
|
-
}
|
|
605
|
-
|
|
606
|
-
.switch--checked .switch__control .switch__thumb {
|
|
607
|
-
background-color: var(--sl-color-neutral-0);
|
|
608
|
-
border-color: var(--sl-color-primary-600);
|
|
609
|
-
translate: calc((var(--width) - var(--height)) / 2);
|
|
610
|
-
}
|
|
611
|
-
|
|
612
|
-
/* Checked + hover */
|
|
613
|
-
.switch.switch--checked:not(.switch--disabled) .switch__control:hover {
|
|
614
|
-
background-color: var(--sl-color-primary-600);
|
|
615
|
-
border-color: var(--sl-color-primary-600);
|
|
616
|
-
}
|
|
617
|
-
|
|
618
|
-
.switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {
|
|
619
|
-
background-color: var(--sl-color-neutral-0);
|
|
620
|
-
border-color: var(--sl-color-primary-600);
|
|
621
|
-
}
|
|
622
|
-
|
|
623
|
-
/* Checked + focus */
|
|
624
|
-
.switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
|
|
625
|
-
background-color: var(--sl-color-primary-600);
|
|
626
|
-
border-color: var(--sl-color-primary-600);
|
|
627
|
-
}
|
|
628
|
-
|
|
629
|
-
.switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {
|
|
630
|
-
background-color: var(--sl-color-neutral-0);
|
|
631
|
-
border-color: var(--sl-color-primary-600);
|
|
632
|
-
outline: var(--sl-focus-ring);
|
|
633
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
634
|
-
}
|
|
635
|
-
|
|
636
|
-
/* Disabled */
|
|
637
|
-
.switch--disabled {
|
|
638
|
-
opacity: 0.5;
|
|
639
|
-
cursor: not-allowed;
|
|
640
|
-
}
|
|
641
|
-
|
|
642
|
-
.switch__label {
|
|
643
|
-
display: inline-block;
|
|
644
|
-
line-height: var(--height);
|
|
645
|
-
margin-inline-start: 0.5em;
|
|
646
|
-
user-select: none;
|
|
647
|
-
-webkit-user-select: none;
|
|
648
|
-
}
|
|
649
|
-
|
|
650
|
-
:host([required]) .switch__label::after {
|
|
651
|
-
content: var(--sl-input-required-content);
|
|
652
|
-
color: var(--sl-input-required-content-color);
|
|
653
|
-
margin-inline-start: var(--sl-input-required-content-offset);
|
|
654
|
-
}
|
|
655
|
-
|
|
656
|
-
@media (forced-colors: active) {
|
|
657
|
-
.switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb,
|
|
658
|
-
.switch--checked .switch__control .switch__thumb {
|
|
659
|
-
background-color: ButtonText;
|
|
660
|
-
}
|
|
661
|
-
}
|
|
662
|
-
`,Z=class extends A{constructor(){super(...arguments),this.formControlController=new Lt(this,{value:t=>t.checked?t.value||"on":void 0,defaultValue:t=>t.defaultChecked,setValue:(t,e)=>t.checked=e}),this.hasSlotController=new $t(this,"help-text"),this.hasFocus=!1,this.title="",this.name="",this.size="medium",this.disabled=!1,this.checked=!1,this.defaultChecked=!1,this.form="",this.required=!1,this.helpText=""}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}firstUpdated(){this.formControlController.updateValidity()}handleBlur(){this.hasFocus=!1,this.emit("sl-blur")}handleInput(){this.emit("sl-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}handleClick(){this.checked=!this.checked,this.emit("sl-change")}handleFocus(){this.hasFocus=!0,this.emit("sl-focus")}handleKeyDown(t){t.key==="ArrowLeft"&&(t.preventDefault(),this.checked=!1,this.emit("sl-change"),this.emit("sl-input")),t.key==="ArrowRight"&&(t.preventDefault(),this.checked=!0,this.emit("sl-change"),this.emit("sl-input"))}handleCheckedChange(){this.input.checked=this.checked,this.formControlController.updateValidity()}handleDisabledChange(){this.formControlController.setValidity(!0)}click(){this.input.click()}focus(t){this.input.focus(t)}blur(){this.input.blur()}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){const t=this.hasSlotController.test("help-text"),e=this.helpText?!0:!!t;return _`
|
|
663
|
-
<div
|
|
664
|
-
class=${P({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--has-help-text":e})}
|
|
665
|
-
>
|
|
666
|
-
<label
|
|
667
|
-
part="base"
|
|
668
|
-
class=${P({switch:!0,"switch--checked":this.checked,"switch--disabled":this.disabled,"switch--focused":this.hasFocus,"switch--small":this.size==="small","switch--medium":this.size==="medium","switch--large":this.size==="large"})}
|
|
669
|
-
>
|
|
670
|
-
<input
|
|
671
|
-
class="switch__input"
|
|
672
|
-
type="checkbox"
|
|
673
|
-
title=${this.title}
|
|
674
|
-
name=${this.name}
|
|
675
|
-
value=${F(this.value)}
|
|
676
|
-
.checked=${re(this.checked)}
|
|
677
|
-
.disabled=${this.disabled}
|
|
678
|
-
.required=${this.required}
|
|
679
|
-
role="switch"
|
|
680
|
-
aria-checked=${this.checked?"true":"false"}
|
|
681
|
-
aria-describedby="help-text"
|
|
682
|
-
@click=${this.handleClick}
|
|
683
|
-
@input=${this.handleInput}
|
|
684
|
-
@invalid=${this.handleInvalid}
|
|
685
|
-
@blur=${this.handleBlur}
|
|
686
|
-
@focus=${this.handleFocus}
|
|
687
|
-
@keydown=${this.handleKeyDown}
|
|
688
|
-
/>
|
|
689
|
-
|
|
690
|
-
<span part="control" class="switch__control">
|
|
691
|
-
<span part="thumb" class="switch__thumb"></span>
|
|
692
|
-
</span>
|
|
693
|
-
|
|
694
|
-
<div part="label" class="switch__label">
|
|
695
|
-
<slot></slot>
|
|
696
|
-
</div>
|
|
697
|
-
</label>
|
|
698
|
-
|
|
699
|
-
<div
|
|
700
|
-
aria-hidden=${e?"false":"true"}
|
|
701
|
-
class="form-control__help-text"
|
|
702
|
-
id="help-text"
|
|
703
|
-
part="form-control-help-text"
|
|
704
|
-
>
|
|
705
|
-
<slot name="help-text">${this.helpText}</slot>
|
|
706
|
-
</div>
|
|
707
|
-
</div>
|
|
708
|
-
`}};Z.styles=[I,qt,es];i([$('input[type="checkbox"]')],Z.prototype,"input",2);i([L()],Z.prototype,"hasFocus",2);i([a()],Z.prototype,"title",2);i([a()],Z.prototype,"name",2);i([a()],Z.prototype,"value",2);i([a({reflect:!0})],Z.prototype,"size",2);i([a({type:Boolean,reflect:!0})],Z.prototype,"disabled",2);i([a({type:Boolean,reflect:!0})],Z.prototype,"checked",2);i([Kt("checked")],Z.prototype,"defaultChecked",2);i([a({reflect:!0})],Z.prototype,"form",2);i([a({type:Boolean,reflect:!0})],Z.prototype,"required",2);i([a({attribute:"help-text"})],Z.prototype,"helpText",2);i([x("checked",{waitUntilFirstUpdate:!0})],Z.prototype,"handleCheckedChange",1);i([x("disabled",{waitUntilFirstUpdate:!0})],Z.prototype,"handleDisabledChange",1);Z.define("sl-switch");Be.define("sl-resize-observer");xe.define("sl-spinner");var ss=E`
|
|
709
|
-
:host {
|
|
710
|
-
--thumb-size: 20px;
|
|
711
|
-
--tooltip-offset: 10px;
|
|
712
|
-
--track-color-active: var(--sl-color-neutral-200);
|
|
713
|
-
--track-color-inactive: var(--sl-color-neutral-200);
|
|
714
|
-
--track-active-offset: 0%;
|
|
715
|
-
--track-height: 6px;
|
|
716
|
-
|
|
717
|
-
display: block;
|
|
718
|
-
}
|
|
719
|
-
|
|
720
|
-
.range {
|
|
721
|
-
position: relative;
|
|
722
|
-
}
|
|
723
|
-
|
|
724
|
-
.range__control {
|
|
725
|
-
--percent: 0%;
|
|
726
|
-
-webkit-appearance: none;
|
|
727
|
-
border-radius: 3px;
|
|
728
|
-
width: 100%;
|
|
729
|
-
height: var(--track-height);
|
|
730
|
-
background: transparent;
|
|
731
|
-
line-height: var(--sl-input-height-medium);
|
|
732
|
-
vertical-align: middle;
|
|
733
|
-
margin: 0;
|
|
734
|
-
|
|
735
|
-
background-image: linear-gradient(
|
|
736
|
-
to right,
|
|
737
|
-
var(--track-color-inactive) 0%,
|
|
738
|
-
var(--track-color-inactive) min(var(--percent), var(--track-active-offset)),
|
|
739
|
-
var(--track-color-active) min(var(--percent), var(--track-active-offset)),
|
|
740
|
-
var(--track-color-active) max(var(--percent), var(--track-active-offset)),
|
|
741
|
-
var(--track-color-inactive) max(var(--percent), var(--track-active-offset)),
|
|
742
|
-
var(--track-color-inactive) 100%
|
|
743
|
-
);
|
|
744
|
-
}
|
|
745
|
-
|
|
746
|
-
.range--rtl .range__control {
|
|
747
|
-
background-image: linear-gradient(
|
|
748
|
-
to left,
|
|
749
|
-
var(--track-color-inactive) 0%,
|
|
750
|
-
var(--track-color-inactive) min(var(--percent), var(--track-active-offset)),
|
|
751
|
-
var(--track-color-active) min(var(--percent), var(--track-active-offset)),
|
|
752
|
-
var(--track-color-active) max(var(--percent), var(--track-active-offset)),
|
|
753
|
-
var(--track-color-inactive) max(var(--percent), var(--track-active-offset)),
|
|
754
|
-
var(--track-color-inactive) 100%
|
|
755
|
-
);
|
|
756
|
-
}
|
|
757
|
-
|
|
758
|
-
/* Webkit */
|
|
759
|
-
.range__control::-webkit-slider-runnable-track {
|
|
760
|
-
width: 100%;
|
|
761
|
-
height: var(--track-height);
|
|
762
|
-
border-radius: 3px;
|
|
763
|
-
border: none;
|
|
764
|
-
}
|
|
765
|
-
|
|
766
|
-
.range__control::-webkit-slider-thumb {
|
|
767
|
-
border: none;
|
|
768
|
-
width: var(--thumb-size);
|
|
769
|
-
height: var(--thumb-size);
|
|
770
|
-
border-radius: 50%;
|
|
771
|
-
background-color: var(--sl-color-primary-600);
|
|
772
|
-
border: solid var(--sl-input-border-width) var(--sl-color-primary-600);
|
|
773
|
-
-webkit-appearance: none;
|
|
774
|
-
margin-top: calc(var(--thumb-size) / -2 + var(--track-height) / 2);
|
|
775
|
-
cursor: pointer;
|
|
776
|
-
}
|
|
777
|
-
|
|
778
|
-
.range__control:enabled::-webkit-slider-thumb:hover {
|
|
779
|
-
background-color: var(--sl-color-primary-500);
|
|
780
|
-
border-color: var(--sl-color-primary-500);
|
|
781
|
-
}
|
|
782
|
-
|
|
783
|
-
.range__control:enabled:focus-visible::-webkit-slider-thumb {
|
|
784
|
-
outline: var(--sl-focus-ring);
|
|
785
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
786
|
-
}
|
|
787
|
-
|
|
788
|
-
.range__control:enabled::-webkit-slider-thumb:active {
|
|
789
|
-
background-color: var(--sl-color-primary-500);
|
|
790
|
-
border-color: var(--sl-color-primary-500);
|
|
791
|
-
cursor: grabbing;
|
|
792
|
-
}
|
|
793
|
-
|
|
794
|
-
/* Firefox */
|
|
795
|
-
.range__control::-moz-focus-outer {
|
|
796
|
-
border: 0;
|
|
797
|
-
}
|
|
798
|
-
|
|
799
|
-
.range__control::-moz-range-progress {
|
|
800
|
-
background-color: var(--track-color-active);
|
|
801
|
-
border-radius: 3px;
|
|
802
|
-
height: var(--track-height);
|
|
803
|
-
}
|
|
804
|
-
|
|
805
|
-
.range__control::-moz-range-track {
|
|
806
|
-
width: 100%;
|
|
807
|
-
height: var(--track-height);
|
|
808
|
-
background-color: var(--track-color-inactive);
|
|
809
|
-
border-radius: 3px;
|
|
810
|
-
border: none;
|
|
811
|
-
}
|
|
812
|
-
|
|
813
|
-
.range__control::-moz-range-thumb {
|
|
814
|
-
border: none;
|
|
815
|
-
height: var(--thumb-size);
|
|
816
|
-
width: var(--thumb-size);
|
|
817
|
-
border-radius: 50%;
|
|
818
|
-
background-color: var(--sl-color-primary-600);
|
|
819
|
-
border-color: var(--sl-color-primary-600);
|
|
820
|
-
transition:
|
|
821
|
-
var(--sl-transition-fast) border-color,
|
|
822
|
-
var(--sl-transition-fast) background-color,
|
|
823
|
-
var(--sl-transition-fast) color,
|
|
824
|
-
var(--sl-transition-fast) box-shadow;
|
|
825
|
-
cursor: pointer;
|
|
826
|
-
}
|
|
827
|
-
|
|
828
|
-
.range__control:enabled::-moz-range-thumb:hover {
|
|
829
|
-
background-color: var(--sl-color-primary-500);
|
|
830
|
-
border-color: var(--sl-color-primary-500);
|
|
831
|
-
}
|
|
832
|
-
|
|
833
|
-
.range__control:enabled:focus-visible::-moz-range-thumb {
|
|
834
|
-
outline: var(--sl-focus-ring);
|
|
835
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
836
|
-
}
|
|
837
|
-
|
|
838
|
-
.range__control:enabled::-moz-range-thumb:active {
|
|
839
|
-
background-color: var(--sl-color-primary-500);
|
|
840
|
-
border-color: var(--sl-color-primary-500);
|
|
841
|
-
cursor: grabbing;
|
|
842
|
-
}
|
|
843
|
-
|
|
844
|
-
/* States */
|
|
845
|
-
.range__control:focus-visible {
|
|
846
|
-
outline: none;
|
|
847
|
-
}
|
|
848
|
-
|
|
849
|
-
.range__control:disabled {
|
|
850
|
-
opacity: 0.5;
|
|
851
|
-
}
|
|
852
|
-
|
|
853
|
-
.range__control:disabled::-webkit-slider-thumb {
|
|
854
|
-
cursor: not-allowed;
|
|
855
|
-
}
|
|
856
|
-
|
|
857
|
-
.range__control:disabled::-moz-range-thumb {
|
|
858
|
-
cursor: not-allowed;
|
|
859
|
-
}
|
|
860
|
-
|
|
861
|
-
/* Tooltip output */
|
|
862
|
-
.range__tooltip {
|
|
863
|
-
position: absolute;
|
|
864
|
-
z-index: var(--sl-z-index-tooltip);
|
|
865
|
-
left: 0;
|
|
866
|
-
border-radius: var(--sl-tooltip-border-radius);
|
|
867
|
-
background-color: var(--sl-tooltip-background-color);
|
|
868
|
-
font-family: var(--sl-tooltip-font-family);
|
|
869
|
-
font-size: var(--sl-tooltip-font-size);
|
|
870
|
-
font-weight: var(--sl-tooltip-font-weight);
|
|
871
|
-
line-height: var(--sl-tooltip-line-height);
|
|
872
|
-
color: var(--sl-tooltip-color);
|
|
873
|
-
opacity: 0;
|
|
874
|
-
padding: var(--sl-tooltip-padding);
|
|
875
|
-
transition: var(--sl-transition-fast) opacity;
|
|
876
|
-
pointer-events: none;
|
|
877
|
-
}
|
|
878
|
-
|
|
879
|
-
.range__tooltip:after {
|
|
880
|
-
content: '';
|
|
881
|
-
position: absolute;
|
|
882
|
-
width: 0;
|
|
883
|
-
height: 0;
|
|
884
|
-
left: 50%;
|
|
885
|
-
translate: calc(-1 * var(--sl-tooltip-arrow-size));
|
|
886
|
-
}
|
|
887
|
-
|
|
888
|
-
.range--tooltip-visible .range__tooltip {
|
|
889
|
-
opacity: 1;
|
|
890
|
-
}
|
|
891
|
-
|
|
892
|
-
/* Tooltip on top */
|
|
893
|
-
.range--tooltip-top .range__tooltip {
|
|
894
|
-
top: calc(-1 * var(--thumb-size) - var(--tooltip-offset));
|
|
895
|
-
}
|
|
896
|
-
|
|
897
|
-
.range--tooltip-top .range__tooltip:after {
|
|
898
|
-
border-top: var(--sl-tooltip-arrow-size) solid var(--sl-tooltip-background-color);
|
|
899
|
-
border-left: var(--sl-tooltip-arrow-size) solid transparent;
|
|
900
|
-
border-right: var(--sl-tooltip-arrow-size) solid transparent;
|
|
901
|
-
top: 100%;
|
|
902
|
-
}
|
|
903
|
-
|
|
904
|
-
/* Tooltip on bottom */
|
|
905
|
-
.range--tooltip-bottom .range__tooltip {
|
|
906
|
-
bottom: calc(-1 * var(--thumb-size) - var(--tooltip-offset));
|
|
907
|
-
}
|
|
908
|
-
|
|
909
|
-
.range--tooltip-bottom .range__tooltip:after {
|
|
910
|
-
border-bottom: var(--sl-tooltip-arrow-size) solid var(--sl-tooltip-background-color);
|
|
911
|
-
border-left: var(--sl-tooltip-arrow-size) solid transparent;
|
|
912
|
-
border-right: var(--sl-tooltip-arrow-size) solid transparent;
|
|
913
|
-
bottom: 100%;
|
|
914
|
-
}
|
|
915
|
-
|
|
916
|
-
@media (forced-colors: active) {
|
|
917
|
-
.range__control,
|
|
918
|
-
.range__tooltip {
|
|
919
|
-
border: solid 1px transparent;
|
|
920
|
-
}
|
|
921
|
-
|
|
922
|
-
.range__control::-webkit-slider-thumb {
|
|
923
|
-
border: solid 1px transparent;
|
|
924
|
-
}
|
|
925
|
-
|
|
926
|
-
.range__control::-moz-range-thumb {
|
|
927
|
-
border: solid 1px transparent;
|
|
928
|
-
}
|
|
929
|
-
|
|
930
|
-
.range__tooltip:after {
|
|
931
|
-
display: none;
|
|
932
|
-
}
|
|
933
|
-
}
|
|
934
|
-
`,O=class extends A{constructor(){super(...arguments),this.formControlController=new Lt(this),this.hasSlotController=new $t(this,"help-text","label"),this.localize=new K(this),this.hasFocus=!1,this.hasTooltip=!1,this.title="",this.name="",this.value=0,this.label="",this.helpText="",this.disabled=!1,this.min=0,this.max=100,this.step=1,this.tooltip="top",this.tooltipFormatter=t=>t.toString(),this.form="",this.defaultValue=0}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver(()=>this.syncRange()),this.value<this.min&&(this.value=this.min),this.value>this.max&&(this.value=this.max),this.updateComplete.then(()=>{this.syncRange(),this.resizeObserver.observe(this.input)})}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.resizeObserver)==null||t.unobserve(this.input)}handleChange(){this.emit("sl-change")}handleInput(){this.value=parseFloat(this.input.value),this.emit("sl-input"),this.syncRange()}handleBlur(){this.hasFocus=!1,this.hasTooltip=!1,this.emit("sl-blur")}handleFocus(){this.hasFocus=!0,this.hasTooltip=!0,this.emit("sl-focus")}handleThumbDragStart(){this.hasTooltip=!0}handleThumbDragEnd(){this.hasTooltip=!1}syncProgress(t){this.input.style.setProperty("--percent",`${t*100}%`)}syncTooltip(t){if(this.output!==null){const e=this.input.offsetWidth,s=this.output.offsetWidth,r=getComputedStyle(this.input).getPropertyValue("--thumb-size"),o=this.localize.dir()==="rtl",n=e*t;if(o){const h=`${e-n}px + ${t} * ${r}`;this.output.style.translate=`calc((${h} - ${s/2}px - ${r} / 2))`}else{const h=`${n}px - ${t} * ${r}`;this.output.style.translate=`calc(${h} - ${s/2}px + ${r} / 2)`}}}handleValueChange(){this.formControlController.updateValidity(),this.input.value=this.value.toString(),this.value=parseFloat(this.input.value),this.syncRange()}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}syncRange(){const t=Math.max(0,(this.value-this.min)/(this.max-this.min));this.syncProgress(t),this.tooltip!=="none"&&this.hasTooltip&&this.updateComplete.then(()=>this.syncTooltip(t))}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}focus(t){this.input.focus(t)}blur(){this.input.blur()}stepUp(){this.input.stepUp(),this.value!==Number(this.input.value)&&(this.value=Number(this.input.value))}stepDown(){this.input.stepDown(),this.value!==Number(this.input.value)&&(this.value=Number(this.input.value))}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){const t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),s=this.label?!0:!!t,r=this.helpText?!0:!!e;return _`
|
|
935
|
-
<div
|
|
936
|
-
part="form-control"
|
|
937
|
-
class=${P({"form-control":!0,"form-control--medium":!0,"form-control--has-label":s,"form-control--has-help-text":r})}
|
|
938
|
-
>
|
|
939
|
-
<label
|
|
940
|
-
part="form-control-label"
|
|
941
|
-
class="form-control__label"
|
|
942
|
-
for="input"
|
|
943
|
-
aria-hidden=${s?"false":"true"}
|
|
944
|
-
>
|
|
945
|
-
<slot name="label">${this.label}</slot>
|
|
946
|
-
</label>
|
|
947
|
-
|
|
948
|
-
<div part="form-control-input" class="form-control-input">
|
|
949
|
-
<div
|
|
950
|
-
part="base"
|
|
951
|
-
class=${P({range:!0,"range--disabled":this.disabled,"range--focused":this.hasFocus,"range--rtl":this.localize.dir()==="rtl","range--tooltip-visible":this.hasTooltip,"range--tooltip-top":this.tooltip==="top","range--tooltip-bottom":this.tooltip==="bottom"})}
|
|
952
|
-
@mousedown=${this.handleThumbDragStart}
|
|
953
|
-
@mouseup=${this.handleThumbDragEnd}
|
|
954
|
-
@touchstart=${this.handleThumbDragStart}
|
|
955
|
-
@touchend=${this.handleThumbDragEnd}
|
|
956
|
-
>
|
|
957
|
-
<input
|
|
958
|
-
part="input"
|
|
959
|
-
id="input"
|
|
960
|
-
class="range__control"
|
|
961
|
-
title=${this.title}
|
|
962
|
-
type="range"
|
|
963
|
-
name=${F(this.name)}
|
|
964
|
-
?disabled=${this.disabled}
|
|
965
|
-
min=${F(this.min)}
|
|
966
|
-
max=${F(this.max)}
|
|
967
|
-
step=${F(this.step)}
|
|
968
|
-
.value=${re(this.value.toString())}
|
|
969
|
-
aria-describedby="help-text"
|
|
970
|
-
@change=${this.handleChange}
|
|
971
|
-
@focus=${this.handleFocus}
|
|
972
|
-
@input=${this.handleInput}
|
|
973
|
-
@invalid=${this.handleInvalid}
|
|
974
|
-
@blur=${this.handleBlur}
|
|
975
|
-
/>
|
|
976
|
-
${this.tooltip!=="none"&&!this.disabled?_`
|
|
977
|
-
<output part="tooltip" class="range__tooltip">
|
|
978
|
-
${typeof this.tooltipFormatter=="function"?this.tooltipFormatter(this.value):this.value}
|
|
979
|
-
</output>
|
|
980
|
-
`:""}
|
|
981
|
-
</div>
|
|
982
|
-
</div>
|
|
983
|
-
|
|
984
|
-
<div
|
|
985
|
-
part="form-control-help-text"
|
|
986
|
-
id="help-text"
|
|
987
|
-
class="form-control__help-text"
|
|
988
|
-
aria-hidden=${r?"false":"true"}
|
|
989
|
-
>
|
|
990
|
-
<slot name="help-text">${this.helpText}</slot>
|
|
991
|
-
</div>
|
|
992
|
-
</div>
|
|
993
|
-
`}};O.styles=[I,qt,ss];i([$(".range__control")],O.prototype,"input",2);i([$(".range__tooltip")],O.prototype,"output",2);i([L()],O.prototype,"hasFocus",2);i([L()],O.prototype,"hasTooltip",2);i([a()],O.prototype,"title",2);i([a()],O.prototype,"name",2);i([a({type:Number})],O.prototype,"value",2);i([a()],O.prototype,"label",2);i([a({attribute:"help-text"})],O.prototype,"helpText",2);i([a({type:Boolean,reflect:!0})],O.prototype,"disabled",2);i([a({type:Number})],O.prototype,"min",2);i([a({type:Number})],O.prototype,"max",2);i([a({type:Number})],O.prototype,"step",2);i([a()],O.prototype,"tooltip",2);i([a({attribute:!1})],O.prototype,"tooltipFormatter",2);i([a({reflect:!0})],O.prototype,"form",2);i([Kt()],O.prototype,"defaultValue",2);i([Yt({passive:!0})],O.prototype,"handleThumbDragStart",1);i([x("value",{waitUntilFirstUpdate:!0})],O.prototype,"handleValueChange",1);i([x("disabled",{waitUntilFirstUpdate:!0})],O.prototype,"handleDisabledChange",1);i([x("hasTooltip",{waitUntilFirstUpdate:!0})],O.prototype,"syncRange",1);O.define("sl-range");var is=E`
|
|
994
|
-
:host {
|
|
995
|
-
--symbol-color: var(--sl-color-neutral-300);
|
|
996
|
-
--symbol-color-active: var(--sl-color-amber-500);
|
|
997
|
-
--symbol-size: 1.2rem;
|
|
998
|
-
--symbol-spacing: var(--sl-spacing-3x-small);
|
|
999
|
-
|
|
1000
|
-
display: inline-flex;
|
|
1001
|
-
}
|
|
1002
|
-
|
|
1003
|
-
.rating {
|
|
1004
|
-
position: relative;
|
|
1005
|
-
display: inline-flex;
|
|
1006
|
-
border-radius: var(--sl-border-radius-medium);
|
|
1007
|
-
vertical-align: middle;
|
|
1008
|
-
}
|
|
1009
|
-
|
|
1010
|
-
.rating:focus {
|
|
1011
|
-
outline: none;
|
|
1012
|
-
}
|
|
1013
|
-
|
|
1014
|
-
.rating:focus-visible {
|
|
1015
|
-
outline: var(--sl-focus-ring);
|
|
1016
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
1017
|
-
}
|
|
1018
|
-
|
|
1019
|
-
.rating__symbols {
|
|
1020
|
-
display: inline-flex;
|
|
1021
|
-
position: relative;
|
|
1022
|
-
font-size: var(--symbol-size);
|
|
1023
|
-
line-height: 0;
|
|
1024
|
-
color: var(--symbol-color);
|
|
1025
|
-
white-space: nowrap;
|
|
1026
|
-
cursor: pointer;
|
|
1027
|
-
}
|
|
1028
|
-
|
|
1029
|
-
.rating__symbols > * {
|
|
1030
|
-
padding: var(--symbol-spacing);
|
|
1031
|
-
}
|
|
1032
|
-
|
|
1033
|
-
.rating__symbol--active,
|
|
1034
|
-
.rating__partial--filled {
|
|
1035
|
-
color: var(--symbol-color-active);
|
|
1036
|
-
}
|
|
1037
|
-
|
|
1038
|
-
.rating__partial-symbol-container {
|
|
1039
|
-
position: relative;
|
|
1040
|
-
}
|
|
1041
|
-
|
|
1042
|
-
.rating__partial--filled {
|
|
1043
|
-
position: absolute;
|
|
1044
|
-
top: var(--symbol-spacing);
|
|
1045
|
-
left: var(--symbol-spacing);
|
|
1046
|
-
}
|
|
1047
|
-
|
|
1048
|
-
.rating__symbol {
|
|
1049
|
-
transition: var(--sl-transition-fast) scale;
|
|
1050
|
-
pointer-events: none;
|
|
1051
|
-
}
|
|
1052
|
-
|
|
1053
|
-
.rating__symbol--hover {
|
|
1054
|
-
scale: 1.2;
|
|
1055
|
-
}
|
|
1056
|
-
|
|
1057
|
-
.rating--disabled .rating__symbols,
|
|
1058
|
-
.rating--readonly .rating__symbols {
|
|
1059
|
-
cursor: default;
|
|
1060
|
-
}
|
|
1061
|
-
|
|
1062
|
-
.rating--disabled .rating__symbol--hover,
|
|
1063
|
-
.rating--readonly .rating__symbol--hover {
|
|
1064
|
-
scale: none;
|
|
1065
|
-
}
|
|
1066
|
-
|
|
1067
|
-
.rating--disabled {
|
|
1068
|
-
opacity: 0.5;
|
|
1069
|
-
}
|
|
1070
|
-
|
|
1071
|
-
.rating--disabled .rating__symbols {
|
|
1072
|
-
cursor: not-allowed;
|
|
1073
|
-
}
|
|
1074
|
-
|
|
1075
|
-
/* Forced colors mode */
|
|
1076
|
-
@media (forced-colors: active) {
|
|
1077
|
-
.rating__symbol--active {
|
|
1078
|
-
color: SelectedItem;
|
|
1079
|
-
}
|
|
1080
|
-
}
|
|
1081
|
-
`;const Ce="important",rs=" !"+Ce,tt=ye(class extends we{constructor(t){if(super(t),t.type!==_e.ATTRIBUTE||t.name!=="style"||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce((e,s)=>{const r=t[s];return r==null?e:e+`${s=s.includes("-")?s:s.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${r};`},"")}update(t,[e]){const{style:s}=t.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(e)),this.render(e);for(const r of this.ft)e[r]==null&&(this.ft.delete(r),r.includes("-")?s.removeProperty(r):s[r]=null);for(const r in e){const o=e[r];if(o!=null){this.ft.add(r);const n=typeof o=="string"&&o.endsWith(rs);r.includes("-")||n?s.setProperty(r,n?o.slice(0,-11):o,n?Ce:""):s[r]=o}}return Ie}});var J=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.hoverValue=0,this.isHovering=!1,this.label="",this.value=0,this.max=5,this.precision=1,this.readonly=!1,this.disabled=!1,this.getSymbol=()=>'<sl-icon name="star-fill" library="system"></sl-icon>'}getValueFromMousePosition(t){return this.getValueFromXCoordinate(t.clientX)}getValueFromTouchPosition(t){return this.getValueFromXCoordinate(t.touches[0].clientX)}getValueFromXCoordinate(t){const e=this.localize.dir()==="rtl",{left:s,right:r,width:o}=this.rating.getBoundingClientRect(),n=e?this.roundToPrecision((r-t)/o*this.max,this.precision):this.roundToPrecision((t-s)/o*this.max,this.precision);return U(n,0,this.max)}handleClick(t){this.disabled||(this.setValue(this.getValueFromMousePosition(t)),this.emit("sl-change"))}setValue(t){this.disabled||this.readonly||(this.value=t===this.value?0:t,this.isHovering=!1)}handleKeyDown(t){const e=this.localize.dir()==="ltr",s=this.localize.dir()==="rtl",r=this.value;if(!(this.disabled||this.readonly)){if(t.key==="ArrowDown"||e&&t.key==="ArrowLeft"||s&&t.key==="ArrowRight"){const o=t.shiftKey?1:this.precision;this.value=Math.max(0,this.value-o),t.preventDefault()}if(t.key==="ArrowUp"||e&&t.key==="ArrowRight"||s&&t.key==="ArrowLeft"){const o=t.shiftKey?1:this.precision;this.value=Math.min(this.max,this.value+o),t.preventDefault()}t.key==="Home"&&(this.value=0,t.preventDefault()),t.key==="End"&&(this.value=this.max,t.preventDefault()),this.value!==r&&this.emit("sl-change")}}handleMouseEnter(t){this.isHovering=!0,this.hoverValue=this.getValueFromMousePosition(t)}handleMouseMove(t){this.hoverValue=this.getValueFromMousePosition(t)}handleMouseLeave(){this.isHovering=!1}handleTouchStart(t){this.isHovering=!0,this.hoverValue=this.getValueFromTouchPosition(t),t.preventDefault()}handleTouchMove(t){this.hoverValue=this.getValueFromTouchPosition(t)}handleTouchEnd(t){this.isHovering=!1,this.setValue(this.hoverValue),this.emit("sl-change"),t.preventDefault()}roundToPrecision(t,e=.5){const s=1/e;return Math.ceil(t*s)/s}handleHoverValueChange(){this.emit("sl-hover",{detail:{phase:"move",value:this.hoverValue}})}handleIsHoveringChange(){this.emit("sl-hover",{detail:{phase:this.isHovering?"start":"end",value:this.hoverValue}})}focus(t){this.rating.focus(t)}blur(){this.rating.blur()}render(){const t=this.localize.dir()==="rtl",e=Array.from(Array(this.max).keys());let s=0;return this.disabled||this.readonly?s=this.value:s=this.isHovering?this.hoverValue:this.value,_`
|
|
1082
|
-
<div
|
|
1083
|
-
part="base"
|
|
1084
|
-
class=${P({rating:!0,"rating--readonly":this.readonly,"rating--disabled":this.disabled,"rating--rtl":t})}
|
|
1085
|
-
role="slider"
|
|
1086
|
-
aria-label=${this.label}
|
|
1087
|
-
aria-disabled=${this.disabled?"true":"false"}
|
|
1088
|
-
aria-readonly=${this.readonly?"true":"false"}
|
|
1089
|
-
aria-valuenow=${this.value}
|
|
1090
|
-
aria-valuemin=${0}
|
|
1091
|
-
aria-valuemax=${this.max}
|
|
1092
|
-
tabindex=${this.disabled||this.readonly?"-1":"0"}
|
|
1093
|
-
@click=${this.handleClick}
|
|
1094
|
-
@keydown=${this.handleKeyDown}
|
|
1095
|
-
@mouseenter=${this.handleMouseEnter}
|
|
1096
|
-
@touchstart=${this.handleTouchStart}
|
|
1097
|
-
@mouseleave=${this.handleMouseLeave}
|
|
1098
|
-
@touchend=${this.handleTouchEnd}
|
|
1099
|
-
@mousemove=${this.handleMouseMove}
|
|
1100
|
-
@touchmove=${this.handleTouchMove}
|
|
1101
|
-
>
|
|
1102
|
-
<span class="rating__symbols">
|
|
1103
|
-
${e.map(r=>s>r&&s<r+1?_`
|
|
1104
|
-
<span
|
|
1105
|
-
class=${P({rating__symbol:!0,"rating__partial-symbol-container":!0,"rating__symbol--hover":this.isHovering&&Math.ceil(s)===r+1})}
|
|
1106
|
-
role="presentation"
|
|
1107
|
-
>
|
|
1108
|
-
<div
|
|
1109
|
-
style=${tt({clipPath:t?`inset(0 ${(s-r)*100}% 0 0)`:`inset(0 0 0 ${(s-r)*100}%)`})}
|
|
1110
|
-
>
|
|
1111
|
-
${jt(this.getSymbol(r+1))}
|
|
1112
|
-
</div>
|
|
1113
|
-
<div
|
|
1114
|
-
class="rating__partial--filled"
|
|
1115
|
-
style=${tt({clipPath:t?`inset(0 0 0 ${100-(s-r)*100}%)`:`inset(0 ${100-(s-r)*100}% 0 0)`})}
|
|
1116
|
-
>
|
|
1117
|
-
${jt(this.getSymbol(r+1))}
|
|
1118
|
-
</div>
|
|
1119
|
-
</span>
|
|
1120
|
-
`:_`
|
|
1121
|
-
<span
|
|
1122
|
-
class=${P({rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(s)===r+1,"rating__symbol--active":s>=r+1})}
|
|
1123
|
-
role="presentation"
|
|
1124
|
-
>
|
|
1125
|
-
${jt(this.getSymbol(r+1))}
|
|
1126
|
-
</span>
|
|
1127
|
-
`)}
|
|
1128
|
-
</span>
|
|
1129
|
-
</div>
|
|
1130
|
-
`}};J.styles=[I,is];J.dependencies={"sl-icon":_t};i([$(".rating")],J.prototype,"rating",2);i([L()],J.prototype,"hoverValue",2);i([L()],J.prototype,"isHovering",2);i([a()],J.prototype,"label",2);i([a({type:Number})],J.prototype,"value",2);i([a({type:Number})],J.prototype,"max",2);i([a({type:Number})],J.prototype,"precision",2);i([a({type:Boolean,reflect:!0})],J.prototype,"readonly",2);i([a({type:Boolean,reflect:!0})],J.prototype,"disabled",2);i([a()],J.prototype,"getSymbol",2);i([Yt({passive:!0})],J.prototype,"handleTouchMove",1);i([x("hoverValue")],J.prototype,"handleHoverValueChange",1);i([x("isHovering")],J.prototype,"handleIsHoveringChange",1);J.define("sl-rating");var os=[{max:276e4,value:6e4,unit:"minute"},{max:72e6,value:36e5,unit:"hour"},{max:5184e5,value:864e5,unit:"day"},{max:24192e5,value:6048e5,unit:"week"},{max:28512e6,value:2592e6,unit:"month"},{max:1/0,value:31536e6,unit:"year"}],zt=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.isoTime="",this.relativeTime="",this.date=new Date,this.format="long",this.numeric="auto",this.sync=!1}disconnectedCallback(){super.disconnectedCallback(),clearTimeout(this.updateTimeout)}render(){const t=new Date,e=new Date(this.date);if(isNaN(e.getMilliseconds()))return this.relativeTime="",this.isoTime="","";const s=e.getTime()-t.getTime(),{unit:r,value:o}=os.find(n=>Math.abs(s)<n.max);if(this.isoTime=e.toISOString(),this.relativeTime=this.localize.relativeTime(Math.round(s/o),r,{numeric:this.numeric,style:this.format}),clearTimeout(this.updateTimeout),this.sync){let n;r==="minute"?n=Ot("second"):r==="hour"?n=Ot("minute"):r==="day"?n=Ot("hour"):n=Ot("day"),this.updateTimeout=window.setTimeout(()=>this.requestUpdate(),n)}return _` <time datetime=${this.isoTime}>${this.relativeTime}</time> `}};i([L()],zt.prototype,"isoTime",2);i([L()],zt.prototype,"relativeTime",2);i([a()],zt.prototype,"date",2);i([a()],zt.prototype,"format",2);i([a()],zt.prototype,"numeric",2);i([a({type:Boolean})],zt.prototype,"sync",2);function Ot(t){const s={second:1e3,minute:6e4,hour:36e5,day:864e5}[t];return s-Date.now()%s}zt.define("sl-relative-time");var as=E`
|
|
1131
|
-
${He}
|
|
1132
|
-
|
|
1133
|
-
.button__prefix,
|
|
1134
|
-
.button__suffix,
|
|
1135
|
-
.button__label {
|
|
1136
|
-
display: inline-flex;
|
|
1137
|
-
position: relative;
|
|
1138
|
-
align-items: center;
|
|
1139
|
-
}
|
|
1140
|
-
|
|
1141
|
-
/* We use a hidden input so constraint validation errors work, since they don't appear to show when used with buttons.
|
|
1142
|
-
We can't actually hide it, though, otherwise the messages will be suppressed by the browser. */
|
|
1143
|
-
.hidden-input {
|
|
1144
|
-
all: unset;
|
|
1145
|
-
position: absolute;
|
|
1146
|
-
top: 0;
|
|
1147
|
-
left: 0;
|
|
1148
|
-
bottom: 0;
|
|
1149
|
-
right: 0;
|
|
1150
|
-
outline: dotted 1px red;
|
|
1151
|
-
opacity: 0;
|
|
1152
|
-
z-index: -1;
|
|
1153
|
-
}
|
|
1154
|
-
`,dt=class extends A{constructor(){super(...arguments),this.hasSlotController=new $t(this,"[default]","prefix","suffix"),this.hasFocus=!1,this.checked=!1,this.disabled=!1,this.size="medium",this.pill=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","presentation")}handleBlur(){this.hasFocus=!1,this.emit("sl-blur")}handleClick(t){if(this.disabled){t.preventDefault(),t.stopPropagation();return}this.checked=!0}handleFocus(){this.hasFocus=!0,this.emit("sl-focus")}handleDisabledChange(){this.setAttribute("aria-disabled",this.disabled?"true":"false")}focus(t){this.input.focus(t)}blur(){this.input.blur()}render(){return Ue`
|
|
1155
|
-
<div part="base" role="presentation">
|
|
1156
|
-
<button
|
|
1157
|
-
part="${`button${this.checked?" button--checked":""}`}"
|
|
1158
|
-
role="radio"
|
|
1159
|
-
aria-checked="${this.checked}"
|
|
1160
|
-
class=${P({button:!0,"button--default":!0,"button--small":this.size==="small","button--medium":this.size==="medium","button--large":this.size==="large","button--checked":this.checked,"button--disabled":this.disabled,"button--focused":this.hasFocus,"button--outline":!0,"button--pill":this.pill,"button--has-label":this.hasSlotController.test("[default]"),"button--has-prefix":this.hasSlotController.test("prefix"),"button--has-suffix":this.hasSlotController.test("suffix")})}
|
|
1161
|
-
aria-disabled=${this.disabled}
|
|
1162
|
-
type="button"
|
|
1163
|
-
value=${F(this.value)}
|
|
1164
|
-
@blur=${this.handleBlur}
|
|
1165
|
-
@focus=${this.handleFocus}
|
|
1166
|
-
@click=${this.handleClick}
|
|
1167
|
-
>
|
|
1168
|
-
<slot name="prefix" part="prefix" class="button__prefix"></slot>
|
|
1169
|
-
<slot part="label" class="button__label"></slot>
|
|
1170
|
-
<slot name="suffix" part="suffix" class="button__suffix"></slot>
|
|
1171
|
-
</button>
|
|
1172
|
-
</div>
|
|
1173
|
-
`}};dt.styles=[I,as];i([$(".button")],dt.prototype,"input",2);i([$(".hidden-input")],dt.prototype,"hiddenInput",2);i([L()],dt.prototype,"hasFocus",2);i([a({type:Boolean,reflect:!0})],dt.prototype,"checked",2);i([a()],dt.prototype,"value",2);i([a({type:Boolean,reflect:!0})],dt.prototype,"disabled",2);i([a({reflect:!0})],dt.prototype,"size",2);i([a({type:Boolean,reflect:!0})],dt.prototype,"pill",2);i([x("disabled",{waitUntilFirstUpdate:!0})],dt.prototype,"handleDisabledChange",1);dt.define("sl-radio-button");var ns=E`
|
|
1174
|
-
:host {
|
|
1175
|
-
display: block;
|
|
1176
|
-
}
|
|
1177
|
-
|
|
1178
|
-
.form-control {
|
|
1179
|
-
position: relative;
|
|
1180
|
-
border: none;
|
|
1181
|
-
padding: 0;
|
|
1182
|
-
margin: 0;
|
|
1183
|
-
}
|
|
1184
|
-
|
|
1185
|
-
.form-control__label {
|
|
1186
|
-
padding: 0;
|
|
1187
|
-
}
|
|
1188
|
-
|
|
1189
|
-
.radio-group--required .radio-group__label::after {
|
|
1190
|
-
content: var(--sl-input-required-content);
|
|
1191
|
-
margin-inline-start: var(--sl-input-required-content-offset);
|
|
1192
|
-
}
|
|
1193
|
-
|
|
1194
|
-
.visually-hidden {
|
|
1195
|
-
position: absolute;
|
|
1196
|
-
width: 1px;
|
|
1197
|
-
height: 1px;
|
|
1198
|
-
padding: 0;
|
|
1199
|
-
margin: -1px;
|
|
1200
|
-
overflow: hidden;
|
|
1201
|
-
clip: rect(0, 0, 0, 0);
|
|
1202
|
-
white-space: nowrap;
|
|
1203
|
-
border: 0;
|
|
1204
|
-
}
|
|
1205
|
-
`,ls=E`
|
|
1206
|
-
:host {
|
|
1207
|
-
display: inline-block;
|
|
1208
|
-
}
|
|
1209
|
-
|
|
1210
|
-
.button-group {
|
|
1211
|
-
display: flex;
|
|
1212
|
-
flex-wrap: nowrap;
|
|
1213
|
-
}
|
|
1214
|
-
`,St=class extends A{constructor(){super(...arguments),this.disableRole=!1,this.label=""}handleFocus(t){const e=Dt(t.target);e?.toggleAttribute("data-sl-button-group__button--focus",!0)}handleBlur(t){const e=Dt(t.target);e?.toggleAttribute("data-sl-button-group__button--focus",!1)}handleMouseOver(t){const e=Dt(t.target);e?.toggleAttribute("data-sl-button-group__button--hover",!0)}handleMouseOut(t){const e=Dt(t.target);e?.toggleAttribute("data-sl-button-group__button--hover",!1)}handleSlotChange(){const t=[...this.defaultSlot.assignedElements({flatten:!0})];t.forEach(e=>{const s=t.indexOf(e),r=Dt(e);r&&(r.toggleAttribute("data-sl-button-group__button",!0),r.toggleAttribute("data-sl-button-group__button--first",s===0),r.toggleAttribute("data-sl-button-group__button--inner",s>0&&s<t.length-1),r.toggleAttribute("data-sl-button-group__button--last",s===t.length-1),r.toggleAttribute("data-sl-button-group__button--radio",r.tagName.toLowerCase()==="sl-radio-button"))})}render(){return _`
|
|
1215
|
-
<div
|
|
1216
|
-
part="base"
|
|
1217
|
-
class="button-group"
|
|
1218
|
-
role="${this.disableRole?"presentation":"group"}"
|
|
1219
|
-
aria-label=${this.label}
|
|
1220
|
-
@focusout=${this.handleBlur}
|
|
1221
|
-
@focusin=${this.handleFocus}
|
|
1222
|
-
@mouseover=${this.handleMouseOver}
|
|
1223
|
-
@mouseout=${this.handleMouseOut}
|
|
1224
|
-
>
|
|
1225
|
-
<slot @slotchange=${this.handleSlotChange}></slot>
|
|
1226
|
-
</div>
|
|
1227
|
-
`}};St.styles=[I,ls];i([$("slot")],St.prototype,"defaultSlot",2);i([L()],St.prototype,"disableRole",2);i([a()],St.prototype,"label",2);function Dt(t){var e;const s="sl-button, sl-radio-button";return(e=t.closest(s))!=null?e:t.querySelector(s)}var j=class extends A{constructor(){super(...arguments),this.formControlController=new Lt(this),this.hasSlotController=new $t(this,"help-text","label"),this.customValidityMessage="",this.hasButtonGroup=!1,this.errorMessage="",this.defaultValue="",this.label="",this.helpText="",this.name="option",this.value="",this.size="medium",this.form="",this.required=!1}get validity(){const t=this.required&&!this.value;return this.customValidityMessage!==""?Le:t?Pe:Re}get validationMessage(){const t=this.required&&!this.value;return this.customValidityMessage!==""?this.customValidityMessage:t?this.validationInput.validationMessage:""}connectedCallback(){super.connectedCallback(),this.defaultValue=this.value}firstUpdated(){this.formControlController.updateValidity()}getAllRadios(){return[...this.querySelectorAll("sl-radio, sl-radio-button")]}handleRadioClick(t){const e=t.target.closest("sl-radio, sl-radio-button"),s=this.getAllRadios(),r=this.value;!e||e.disabled||(this.value=e.value,s.forEach(o=>o.checked=o===e),this.value!==r&&(this.emit("sl-change"),this.emit("sl-input")))}handleKeyDown(t){var e;if(!["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"," "].includes(t.key))return;const s=this.getAllRadios().filter(p=>!p.disabled),r=(e=s.find(p=>p.checked))!=null?e:s[0],o=t.key===" "?0:["ArrowUp","ArrowLeft"].includes(t.key)?-1:1,n=this.value;let h=s.indexOf(r)+o;h<0&&(h=s.length-1),h>s.length-1&&(h=0),this.getAllRadios().forEach(p=>{p.checked=!1,this.hasButtonGroup||p.setAttribute("tabindex","-1")}),this.value=s[h].value,s[h].checked=!0,this.hasButtonGroup?s[h].shadowRoot.querySelector("button").focus():(s[h].setAttribute("tabindex","0"),s[h].focus()),this.value!==n&&(this.emit("sl-change"),this.emit("sl-input")),t.preventDefault()}handleLabelClick(){this.focus()}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}async syncRadioElements(){var t,e;const s=this.getAllRadios();if(await Promise.all(s.map(async r=>{await r.updateComplete,r.checked=r.value===this.value,r.size=this.size})),this.hasButtonGroup=s.some(r=>r.tagName.toLowerCase()==="sl-radio-button"),s.length>0&&!s.some(r=>r.checked))if(this.hasButtonGroup){const r=(t=s[0].shadowRoot)==null?void 0:t.querySelector("button");r&&r.setAttribute("tabindex","0")}else s[0].setAttribute("tabindex","0");if(this.hasButtonGroup){const r=(e=this.shadowRoot)==null?void 0:e.querySelector("sl-button-group");r&&(r.disableRole=!0)}}syncRadios(){if(customElements.get("sl-radio")&&customElements.get("sl-radio-button")){this.syncRadioElements();return}customElements.get("sl-radio")?this.syncRadioElements():customElements.whenDefined("sl-radio").then(()=>this.syncRadios()),customElements.get("sl-radio-button")?this.syncRadioElements():customElements.whenDefined("sl-radio-button").then(()=>this.syncRadios())}updateCheckedRadio(){this.getAllRadios().forEach(e=>e.checked=e.value===this.value),this.formControlController.setValidity(this.validity.valid)}handleSizeChange(){this.syncRadios()}handleValueChange(){this.hasUpdated&&this.updateCheckedRadio()}checkValidity(){const t=this.required&&!this.value,e=this.customValidityMessage!=="";return t||e?(this.formControlController.emitInvalidEvent(),!1):!0}getForm(){return this.formControlController.getForm()}reportValidity(){const t=this.validity.valid;return this.errorMessage=this.customValidityMessage||t?"":this.validationInput.validationMessage,this.formControlController.setValidity(t),this.validationInput.hidden=!0,clearTimeout(this.validationTimeout),t||(this.validationInput.hidden=!1,this.validationInput.reportValidity(),this.validationTimeout=setTimeout(()=>this.validationInput.hidden=!0,1e4)),t}setCustomValidity(t=""){this.customValidityMessage=t,this.errorMessage=t,this.validationInput.setCustomValidity(t),this.formControlController.updateValidity()}focus(t){const e=this.getAllRadios(),s=e.find(n=>n.checked),r=e.find(n=>!n.disabled),o=s||r;o&&o.focus(t)}render(){const t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),s=this.label?!0:!!t,r=this.helpText?!0:!!e,o=_`
|
|
1228
|
-
<slot @slotchange=${this.syncRadios} @click=${this.handleRadioClick} @keydown=${this.handleKeyDown}></slot>
|
|
1229
|
-
`;return _`
|
|
1230
|
-
<fieldset
|
|
1231
|
-
part="form-control"
|
|
1232
|
-
class=${P({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--radio-group":!0,"form-control--has-label":s,"form-control--has-help-text":r})}
|
|
1233
|
-
role="radiogroup"
|
|
1234
|
-
aria-labelledby="label"
|
|
1235
|
-
aria-describedby="help-text"
|
|
1236
|
-
aria-errormessage="error-message"
|
|
1237
|
-
>
|
|
1238
|
-
<label
|
|
1239
|
-
part="form-control-label"
|
|
1240
|
-
id="label"
|
|
1241
|
-
class="form-control__label"
|
|
1242
|
-
aria-hidden=${s?"false":"true"}
|
|
1243
|
-
@click=${this.handleLabelClick}
|
|
1244
|
-
>
|
|
1245
|
-
<slot name="label">${this.label}</slot>
|
|
1246
|
-
</label>
|
|
1247
|
-
|
|
1248
|
-
<div part="form-control-input" class="form-control-input">
|
|
1249
|
-
<div class="visually-hidden">
|
|
1250
|
-
<div id="error-message" aria-live="assertive">${this.errorMessage}</div>
|
|
1251
|
-
<label class="radio-group__validation">
|
|
1252
|
-
<input
|
|
1253
|
-
type="text"
|
|
1254
|
-
class="radio-group__validation-input"
|
|
1255
|
-
?required=${this.required}
|
|
1256
|
-
tabindex="-1"
|
|
1257
|
-
hidden
|
|
1258
|
-
@invalid=${this.handleInvalid}
|
|
1259
|
-
/>
|
|
1260
|
-
</label>
|
|
1261
|
-
</div>
|
|
1262
|
-
|
|
1263
|
-
${this.hasButtonGroup?_`
|
|
1264
|
-
<sl-button-group part="button-group" exportparts="base:button-group__base" role="presentation">
|
|
1265
|
-
${o}
|
|
1266
|
-
</sl-button-group>
|
|
1267
|
-
`:o}
|
|
1268
|
-
</div>
|
|
1269
|
-
|
|
1270
|
-
<div
|
|
1271
|
-
part="form-control-help-text"
|
|
1272
|
-
id="help-text"
|
|
1273
|
-
class="form-control__help-text"
|
|
1274
|
-
aria-hidden=${r?"false":"true"}
|
|
1275
|
-
>
|
|
1276
|
-
<slot name="help-text">${this.helpText}</slot>
|
|
1277
|
-
</div>
|
|
1278
|
-
</fieldset>
|
|
1279
|
-
`}};j.styles=[I,qt,ns];j.dependencies={"sl-button-group":St};i([$("slot:not([name])")],j.prototype,"defaultSlot",2);i([$(".radio-group__validation-input")],j.prototype,"validationInput",2);i([L()],j.prototype,"hasButtonGroup",2);i([L()],j.prototype,"errorMessage",2);i([L()],j.prototype,"defaultValue",2);i([a()],j.prototype,"label",2);i([a({attribute:"help-text"})],j.prototype,"helpText",2);i([a()],j.prototype,"name",2);i([a({reflect:!0})],j.prototype,"value",2);i([a({reflect:!0})],j.prototype,"size",2);i([a({reflect:!0})],j.prototype,"form",2);i([a({type:Boolean,reflect:!0})],j.prototype,"required",2);i([x("size",{waitUntilFirstUpdate:!0})],j.prototype,"handleSizeChange",1);i([x("value")],j.prototype,"handleValueChange",1);j.define("sl-radio-group");var cs=E`
|
|
1280
|
-
:host {
|
|
1281
|
-
--size: 128px;
|
|
1282
|
-
--track-width: 4px;
|
|
1283
|
-
--track-color: var(--sl-color-neutral-200);
|
|
1284
|
-
--indicator-width: var(--track-width);
|
|
1285
|
-
--indicator-color: var(--sl-color-primary-600);
|
|
1286
|
-
--indicator-transition-duration: 0.35s;
|
|
1287
|
-
|
|
1288
|
-
display: inline-flex;
|
|
1289
|
-
}
|
|
1290
|
-
|
|
1291
|
-
.progress-ring {
|
|
1292
|
-
display: inline-flex;
|
|
1293
|
-
align-items: center;
|
|
1294
|
-
justify-content: center;
|
|
1295
|
-
position: relative;
|
|
1296
|
-
}
|
|
1297
|
-
|
|
1298
|
-
.progress-ring__image {
|
|
1299
|
-
width: var(--size);
|
|
1300
|
-
height: var(--size);
|
|
1301
|
-
rotate: -90deg;
|
|
1302
|
-
transform-origin: 50% 50%;
|
|
1303
|
-
}
|
|
1304
|
-
|
|
1305
|
-
.progress-ring__track,
|
|
1306
|
-
.progress-ring__indicator {
|
|
1307
|
-
--radius: calc(var(--size) / 2 - max(var(--track-width), var(--indicator-width)) * 0.5);
|
|
1308
|
-
--circumference: calc(var(--radius) * 2 * 3.141592654);
|
|
1309
|
-
|
|
1310
|
-
fill: none;
|
|
1311
|
-
r: var(--radius);
|
|
1312
|
-
cx: calc(var(--size) / 2);
|
|
1313
|
-
cy: calc(var(--size) / 2);
|
|
1314
|
-
}
|
|
1315
|
-
|
|
1316
|
-
.progress-ring__track {
|
|
1317
|
-
stroke: var(--track-color);
|
|
1318
|
-
stroke-width: var(--track-width);
|
|
1319
|
-
}
|
|
1320
|
-
|
|
1321
|
-
.progress-ring__indicator {
|
|
1322
|
-
stroke: var(--indicator-color);
|
|
1323
|
-
stroke-width: var(--indicator-width);
|
|
1324
|
-
stroke-linecap: round;
|
|
1325
|
-
transition-property: stroke-dashoffset;
|
|
1326
|
-
transition-duration: var(--indicator-transition-duration);
|
|
1327
|
-
stroke-dasharray: var(--circumference) var(--circumference);
|
|
1328
|
-
stroke-dashoffset: calc(var(--circumference) - var(--percentage) * var(--circumference));
|
|
1329
|
-
}
|
|
1330
|
-
|
|
1331
|
-
.progress-ring__label {
|
|
1332
|
-
display: flex;
|
|
1333
|
-
align-items: center;
|
|
1334
|
-
justify-content: center;
|
|
1335
|
-
position: absolute;
|
|
1336
|
-
top: 0;
|
|
1337
|
-
left: 0;
|
|
1338
|
-
width: 100%;
|
|
1339
|
-
height: 100%;
|
|
1340
|
-
text-align: center;
|
|
1341
|
-
user-select: none;
|
|
1342
|
-
-webkit-user-select: none;
|
|
1343
|
-
}
|
|
1344
|
-
`,Mt=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.value=0,this.label=""}updated(t){if(super.updated(t),t.has("value")){const e=parseFloat(getComputedStyle(this.indicator).getPropertyValue("r")),s=2*Math.PI*e,r=s-this.value/100*s;this.indicatorOffset=`${r}px`}}render(){return _`
|
|
1345
|
-
<div
|
|
1346
|
-
part="base"
|
|
1347
|
-
class="progress-ring"
|
|
1348
|
-
role="progressbar"
|
|
1349
|
-
aria-label=${this.label.length>0?this.label:this.localize.term("progress")}
|
|
1350
|
-
aria-describedby="label"
|
|
1351
|
-
aria-valuemin="0"
|
|
1352
|
-
aria-valuemax="100"
|
|
1353
|
-
aria-valuenow="${this.value}"
|
|
1354
|
-
style="--percentage: ${this.value/100}"
|
|
1355
|
-
>
|
|
1356
|
-
<svg class="progress-ring__image">
|
|
1357
|
-
<circle class="progress-ring__track"></circle>
|
|
1358
|
-
<circle class="progress-ring__indicator" style="stroke-dashoffset: ${this.indicatorOffset}"></circle>
|
|
1359
|
-
</svg>
|
|
1360
|
-
|
|
1361
|
-
<slot id="label" part="label" class="progress-ring__label"></slot>
|
|
1362
|
-
</div>
|
|
1363
|
-
`}};Mt.styles=[I,cs];i([$(".progress-ring__indicator")],Mt.prototype,"indicator",2);i([L()],Mt.prototype,"indicatorOffset",2);i([a({type:Number,reflect:!0})],Mt.prototype,"value",2);i([a()],Mt.prototype,"label",2);Mt.define("sl-progress-ring");var ds=E`
|
|
1364
|
-
:host {
|
|
1365
|
-
display: inline-block;
|
|
1366
|
-
}
|
|
1367
|
-
`;let $e=null;class ze{}ze.render=function(t,e){$e(t,e)};self.QrCreator=ze;(function(t){function e(p,l,u,v){var c={},d=t(u,l);d.u(p),d.J(),v=v||0;var g=d.h(),f=d.h()+2*v;return c.text=p,c.level=l,c.version=u,c.O=f,c.a=function(y,T){return y-=v,T-=v,0>y||y>=g||0>T||T>=g?!1:d.a(y,T)},c}function s(p,l,u,v,c,d,g,f,y,T){function B(w,k,m,b,z,R,V){w?(p.lineTo(k+R,m+V),p.arcTo(k,m,b,z,d)):p.lineTo(k,m)}g?p.moveTo(l+d,u):p.moveTo(l,u),B(f,v,u,v,c,-d,0),B(y,v,c,l,c,0,-d),B(T,l,c,l,u,d,0),B(g,l,u,v,u,0,d)}function r(p,l,u,v,c,d,g,f,y,T){function B(w,k,m,b){p.moveTo(w+m,k),p.lineTo(w,k),p.lineTo(w,k+b),p.arcTo(w,k,w+m,k,d)}g&&B(l,u,d,d),f&&B(v,u,-d,d),y&&B(v,c,-d,-d),T&&B(l,c,d,-d)}function o(p,l){var u=l.fill;if(typeof u=="string")p.fillStyle=u;else{var v=u.type,c=u.colorStops;if(u=u.position.map(g=>Math.round(g*l.size)),v==="linear-gradient")var d=p.createLinearGradient.apply(p,u);else if(v==="radial-gradient")d=p.createRadialGradient.apply(p,u);else throw Error("Unsupported fill");c.forEach(([g,f])=>{d.addColorStop(g,f)}),p.fillStyle=d}}function n(p,l){t:{var u=l.text,v=l.v,c=l.N,d=l.K,g=l.P;for(c=Math.max(1,c||1),d=Math.min(40,d||40);c<=d;c+=1)try{var f=e(u,v,c,g);break t}catch{}f=void 0}if(!f)return null;for(u=p.getContext("2d"),l.background&&(u.fillStyle=l.background,u.fillRect(l.left,l.top,l.size,l.size)),v=f.O,d=l.size/v,u.beginPath(),g=0;g<v;g+=1)for(c=0;c<v;c+=1){var y=u,T=l.left+c*d,B=l.top+g*d,w=g,k=c,m=f.a,b=T+d,z=B+d,R=w-1,V=w+1,S=k-1,C=k+1,mt=Math.floor(Math.min(.5,Math.max(0,l.R))*d),yt=m(w,k),kt=m(R,S),Vt=m(R,k);R=m(R,C);var Ft=m(w,C);C=m(V,C),k=m(V,k),V=m(V,S),w=m(w,S),T=Math.round(T),B=Math.round(B),b=Math.round(b),z=Math.round(z),yt?s(y,T,B,b,z,mt,!Vt&&!w,!Vt&&!Ft,!k&&!Ft,!k&&!w):r(y,T,B,b,z,mt,Vt&&w&&kt,Vt&&Ft&&R,k&&Ft&&C,k&&w&&V)}return o(u,l),u.fill(),p}var h={minVersion:1,maxVersion:40,ecLevel:"L",left:0,top:0,size:200,fill:"#000",background:null,text:"no text",radius:.5,quiet:0};$e=function(p,l){var u={};Object.assign(u,h,p),u.N=u.minVersion,u.K=u.maxVersion,u.v=u.ecLevel,u.left=u.left,u.top=u.top,u.size=u.size,u.fill=u.fill,u.background=u.background,u.text=u.text,u.R=u.radius,u.P=u.quiet,l instanceof HTMLCanvasElement?((l.width!==u.size||l.height!==u.size)&&(l.width=u.size,l.height=u.size),l.getContext("2d").clearRect(0,0,l.width,l.height),n(l,u)):(p=document.createElement("canvas"),p.width=u.size,p.height=u.size,u=n(p,u),l.appendChild(u))}})((function(){function t(l){var u=s.s(l);return{S:function(){return 4},b:function(){return u.length},write:function(v){for(var c=0;c<u.length;c+=1)v.put(u[c],8)}}}function e(){var l=[],u=0,v={B:function(){return l},c:function(c){return(l[Math.floor(c/8)]>>>7-c%8&1)==1},put:function(c,d){for(var g=0;g<d;g+=1)v.m((c>>>d-g-1&1)==1)},f:function(){return u},m:function(c){var d=Math.floor(u/8);l.length<=d&&l.push(0),c&&(l[d]|=128>>>u%8),u+=1}};return v}function s(l,u){function v(w,k){for(var m=-1;7>=m;m+=1)if(!(-1>=w+m||f<=w+m))for(var b=-1;7>=b;b+=1)-1>=k+b||f<=k+b||(g[w+m][k+b]=0<=m&&6>=m&&(b==0||b==6)||0<=b&&6>=b&&(m==0||m==6)||2<=m&&4>=m&&2<=b&&4>=b)}function c(w,k){for(var m=f=4*l+17,b=Array(m),z=0;z<m;z+=1){b[z]=Array(m);for(var R=0;R<m;R+=1)b[z][R]=null}for(g=b,v(0,0),v(f-7,0),v(0,f-7),m=n.G(l),b=0;b<m.length;b+=1)for(z=0;z<m.length;z+=1){R=m[b];var V=m[z];if(g[R][V]==null)for(var S=-2;2>=S;S+=1)for(var C=-2;2>=C;C+=1)g[R+S][V+C]=S==-2||S==2||C==-2||C==2||S==0&&C==0}for(m=8;m<f-8;m+=1)g[m][6]==null&&(g[m][6]=m%2==0);for(m=8;m<f-8;m+=1)g[6][m]==null&&(g[6][m]=m%2==0);for(m=n.w(d<<3|k),b=0;15>b;b+=1)z=!w&&(m>>b&1)==1,g[6>b?b:8>b?b+1:f-15+b][8]=z,g[8][8>b?f-b-1:9>b?15-b:14-b]=z;if(g[f-8][8]=!w,7<=l){for(m=n.A(l),b=0;18>b;b+=1)z=!w&&(m>>b&1)==1,g[Math.floor(b/3)][b%3+f-8-3]=z;for(b=0;18>b;b+=1)z=!w&&(m>>b&1)==1,g[b%3+f-8-3][Math.floor(b/3)]=z}if(y==null){for(w=p.I(l,d),m=e(),b=0;b<T.length;b+=1)z=T[b],m.put(4,4),m.put(z.b(),n.f(4,l)),z.write(m);for(b=z=0;b<w.length;b+=1)z+=w[b].j;if(m.f()>8*z)throw Error("code length overflow. ("+m.f()+">"+8*z+")");for(m.f()+4<=8*z&&m.put(0,4);m.f()%8!=0;)m.m(!1);for(;!(m.f()>=8*z)&&(m.put(236,8),!(m.f()>=8*z));)m.put(17,8);var mt=0;for(z=b=0,R=Array(w.length),V=Array(w.length),S=0;S<w.length;S+=1){var yt=w[S].j,kt=w[S].o-yt;for(b=Math.max(b,yt),z=Math.max(z,kt),R[S]=Array(yt),C=0;C<R[S].length;C+=1)R[S][C]=255&m.B()[C+mt];for(mt+=yt,C=n.C(kt),yt=r(R[S],C.b()-1).l(C),V[S]=Array(C.b()-1),C=0;C<V[S].length;C+=1)kt=C+yt.b()-V[S].length,V[S][C]=0<=kt?yt.c(kt):0}for(C=m=0;C<w.length;C+=1)m+=w[C].o;for(m=Array(m),C=mt=0;C<b;C+=1)for(S=0;S<w.length;S+=1)C<R[S].length&&(m[mt]=R[S][C],mt+=1);for(C=0;C<z;C+=1)for(S=0;S<w.length;S+=1)C<V[S].length&&(m[mt]=V[S][C],mt+=1);y=m}for(w=y,m=-1,b=f-1,z=7,R=0,k=n.F(k),V=f-1;0<V;V-=2)for(V==6&&--V;;){for(S=0;2>S;S+=1)g[b][V-S]==null&&(C=!1,R<w.length&&(C=(w[R]>>>z&1)==1),k(b,V-S)&&(C=!C),g[b][V-S]=C,--z,z==-1&&(R+=1,z=7));if(b+=m,0>b||f<=b){b-=m,m=-m;break}}}var d=o[u],g=null,f=0,y=null,T=[],B={u:function(w){w=t(w),T.push(w),y=null},a:function(w,k){if(0>w||f<=w||0>k||f<=k)throw Error(w+","+k);return g[w][k]},h:function(){return f},J:function(){for(var w=0,k=0,m=0;8>m;m+=1){c(!0,m);var b=n.D(B);(m==0||w>b)&&(w=b,k=m)}c(!1,k)}};return B}function r(l,u){if(typeof l.length>"u")throw Error(l.length+"/"+u);var v=(function(){for(var d=0;d<l.length&&l[d]==0;)d+=1;for(var g=Array(l.length-d+u),f=0;f<l.length-d;f+=1)g[f]=l[f+d];return g})(),c={c:function(d){return v[d]},b:function(){return v.length},multiply:function(d){for(var g=Array(c.b()+d.b()-1),f=0;f<c.b();f+=1)for(var y=0;y<d.b();y+=1)g[f+y]^=h.i(h.g(c.c(f))+h.g(d.c(y)));return r(g,0)},l:function(d){if(0>c.b()-d.b())return c;for(var g=h.g(c.c(0))-h.g(d.c(0)),f=Array(c.b()),y=0;y<c.b();y+=1)f[y]=c.c(y);for(y=0;y<d.b();y+=1)f[y]^=h.i(h.g(d.c(y))+g);return r(f,0).l(d)}};return c}s.s=function(l){for(var u=[],v=0;v<l.length;v++){var c=l.charCodeAt(v);128>c?u.push(c):2048>c?u.push(192|c>>6,128|c&63):55296>c||57344<=c?u.push(224|c>>12,128|c>>6&63,128|c&63):(v++,c=65536+((c&1023)<<10|l.charCodeAt(v)&1023),u.push(240|c>>18,128|c>>12&63,128|c>>6&63,128|c&63))}return u};var o={L:1,M:0,Q:3,H:2},n=(function(){function l(c){for(var d=0;c!=0;)d+=1,c>>>=1;return d}var u=[[],[6,18],[6,22],[6,26],[6,30],[6,34],[6,22,38],[6,24,42],[6,26,46],[6,28,50],[6,30,54],[6,32,58],[6,34,62],[6,26,46,66],[6,26,48,70],[6,26,50,74],[6,30,54,78],[6,30,56,82],[6,30,58,86],[6,34,62,90],[6,28,50,72,94],[6,26,50,74,98],[6,30,54,78,102],[6,28,54,80,106],[6,32,58,84,110],[6,30,58,86,114],[6,34,62,90,118],[6,26,50,74,98,122],[6,30,54,78,102,126],[6,26,52,78,104,130],[6,30,56,82,108,134],[6,34,60,86,112,138],[6,30,58,86,114,142],[6,34,62,90,118,146],[6,30,54,78,102,126,150],[6,24,50,76,102,128,154],[6,28,54,80,106,132,158],[6,32,58,84,110,136,162],[6,26,54,82,110,138,166],[6,30,58,86,114,142,170]],v={w:function(c){for(var d=c<<10;0<=l(d)-l(1335);)d^=1335<<l(d)-l(1335);return(c<<10|d)^21522},A:function(c){for(var d=c<<12;0<=l(d)-l(7973);)d^=7973<<l(d)-l(7973);return c<<12|d},G:function(c){return u[c-1]},F:function(c){switch(c){case 0:return function(d,g){return(d+g)%2==0};case 1:return function(d){return d%2==0};case 2:return function(d,g){return g%3==0};case 3:return function(d,g){return(d+g)%3==0};case 4:return function(d,g){return(Math.floor(d/2)+Math.floor(g/3))%2==0};case 5:return function(d,g){return d*g%2+d*g%3==0};case 6:return function(d,g){return(d*g%2+d*g%3)%2==0};case 7:return function(d,g){return(d*g%3+(d+g)%2)%2==0};default:throw Error("bad maskPattern:"+c)}},C:function(c){for(var d=r([1],0),g=0;g<c;g+=1)d=d.multiply(r([1,h.i(g)],0));return d},f:function(c,d){if(c!=4||1>d||40<d)throw Error("mode: "+c+"; type: "+d);return 10>d?8:16},D:function(c){for(var d=c.h(),g=0,f=0;f<d;f+=1)for(var y=0;y<d;y+=1){for(var T=0,B=c.a(f,y),w=-1;1>=w;w+=1)if(!(0>f+w||d<=f+w))for(var k=-1;1>=k;k+=1)0>y+k||d<=y+k||(w!=0||k!=0)&&B==c.a(f+w,y+k)&&(T+=1);5<T&&(g+=3+T-5)}for(f=0;f<d-1;f+=1)for(y=0;y<d-1;y+=1)T=0,c.a(f,y)&&(T+=1),c.a(f+1,y)&&(T+=1),c.a(f,y+1)&&(T+=1),c.a(f+1,y+1)&&(T+=1),(T==0||T==4)&&(g+=3);for(f=0;f<d;f+=1)for(y=0;y<d-6;y+=1)c.a(f,y)&&!c.a(f,y+1)&&c.a(f,y+2)&&c.a(f,y+3)&&c.a(f,y+4)&&!c.a(f,y+5)&&c.a(f,y+6)&&(g+=40);for(y=0;y<d;y+=1)for(f=0;f<d-6;f+=1)c.a(f,y)&&!c.a(f+1,y)&&c.a(f+2,y)&&c.a(f+3,y)&&c.a(f+4,y)&&!c.a(f+5,y)&&c.a(f+6,y)&&(g+=40);for(y=T=0;y<d;y+=1)for(f=0;f<d;f+=1)c.a(f,y)&&(T+=1);return g+=Math.abs(100*T/d/d-50)/5*10}};return v})(),h=(function(){for(var l=Array(256),u=Array(256),v=0;8>v;v+=1)l[v]=1<<v;for(v=8;256>v;v+=1)l[v]=l[v-4]^l[v-5]^l[v-6]^l[v-8];for(v=0;255>v;v+=1)u[l[v]]=v;return{g:function(c){if(1>c)throw Error("glog("+c+")");return u[c]},i:function(c){for(;0>c;)c+=255;for(;256<=c;)c-=255;return l[c]}}})(),p=(function(){function l(c,d){switch(d){case o.L:return u[4*(c-1)];case o.M:return u[4*(c-1)+1];case o.Q:return u[4*(c-1)+2];case o.H:return u[4*(c-1)+3]}}var u=[[1,26,19],[1,26,16],[1,26,13],[1,26,9],[1,44,34],[1,44,28],[1,44,22],[1,44,16],[1,70,55],[1,70,44],[2,35,17],[2,35,13],[1,100,80],[2,50,32],[2,50,24],[4,25,9],[1,134,108],[2,67,43],[2,33,15,2,34,16],[2,33,11,2,34,12],[2,86,68],[4,43,27],[4,43,19],[4,43,15],[2,98,78],[4,49,31],[2,32,14,4,33,15],[4,39,13,1,40,14],[2,121,97],[2,60,38,2,61,39],[4,40,18,2,41,19],[4,40,14,2,41,15],[2,146,116],[3,58,36,2,59,37],[4,36,16,4,37,17],[4,36,12,4,37,13],[2,86,68,2,87,69],[4,69,43,1,70,44],[6,43,19,2,44,20],[6,43,15,2,44,16],[4,101,81],[1,80,50,4,81,51],[4,50,22,4,51,23],[3,36,12,8,37,13],[2,116,92,2,117,93],[6,58,36,2,59,37],[4,46,20,6,47,21],[7,42,14,4,43,15],[4,133,107],[8,59,37,1,60,38],[8,44,20,4,45,21],[12,33,11,4,34,12],[3,145,115,1,146,116],[4,64,40,5,65,41],[11,36,16,5,37,17],[11,36,12,5,37,13],[5,109,87,1,110,88],[5,65,41,5,66,42],[5,54,24,7,55,25],[11,36,12,7,37,13],[5,122,98,1,123,99],[7,73,45,3,74,46],[15,43,19,2,44,20],[3,45,15,13,46,16],[1,135,107,5,136,108],[10,74,46,1,75,47],[1,50,22,15,51,23],[2,42,14,17,43,15],[5,150,120,1,151,121],[9,69,43,4,70,44],[17,50,22,1,51,23],[2,42,14,19,43,15],[3,141,113,4,142,114],[3,70,44,11,71,45],[17,47,21,4,48,22],[9,39,13,16,40,14],[3,135,107,5,136,108],[3,67,41,13,68,42],[15,54,24,5,55,25],[15,43,15,10,44,16],[4,144,116,4,145,117],[17,68,42],[17,50,22,6,51,23],[19,46,16,6,47,17],[2,139,111,7,140,112],[17,74,46],[7,54,24,16,55,25],[34,37,13],[4,151,121,5,152,122],[4,75,47,14,76,48],[11,54,24,14,55,25],[16,45,15,14,46,16],[6,147,117,4,148,118],[6,73,45,14,74,46],[11,54,24,16,55,25],[30,46,16,2,47,17],[8,132,106,4,133,107],[8,75,47,13,76,48],[7,54,24,22,55,25],[22,45,15,13,46,16],[10,142,114,2,143,115],[19,74,46,4,75,47],[28,50,22,6,51,23],[33,46,16,4,47,17],[8,152,122,4,153,123],[22,73,45,3,74,46],[8,53,23,26,54,24],[12,45,15,28,46,16],[3,147,117,10,148,118],[3,73,45,23,74,46],[4,54,24,31,55,25],[11,45,15,31,46,16],[7,146,116,7,147,117],[21,73,45,7,74,46],[1,53,23,37,54,24],[19,45,15,26,46,16],[5,145,115,10,146,116],[19,75,47,10,76,48],[15,54,24,25,55,25],[23,45,15,25,46,16],[13,145,115,3,146,116],[2,74,46,29,75,47],[42,54,24,1,55,25],[23,45,15,28,46,16],[17,145,115],[10,74,46,23,75,47],[10,54,24,35,55,25],[19,45,15,35,46,16],[17,145,115,1,146,116],[14,74,46,21,75,47],[29,54,24,19,55,25],[11,45,15,46,46,16],[13,145,115,6,146,116],[14,74,46,23,75,47],[44,54,24,7,55,25],[59,46,16,1,47,17],[12,151,121,7,152,122],[12,75,47,26,76,48],[39,54,24,14,55,25],[22,45,15,41,46,16],[6,151,121,14,152,122],[6,75,47,34,76,48],[46,54,24,10,55,25],[2,45,15,64,46,16],[17,152,122,4,153,123],[29,74,46,14,75,47],[49,54,24,10,55,25],[24,45,15,46,46,16],[4,152,122,18,153,123],[13,74,46,32,75,47],[48,54,24,14,55,25],[42,45,15,32,46,16],[20,147,117,4,148,118],[40,75,47,7,76,48],[43,54,24,22,55,25],[10,45,15,67,46,16],[19,148,118,6,149,119],[18,75,47,31,76,48],[34,54,24,34,55,25],[20,45,15,61,46,16]],v={I:function(c,d){var g=l(c,d);if(typeof g>"u")throw Error("bad rs block @ typeNumber:"+c+"/errorCorrectLevel:"+d);c=g.length/3,d=[];for(var f=0;f<c;f+=1)for(var y=g[3*f],T=g[3*f+1],B=g[3*f+2],w=0;w<y;w+=1){var k=B,m={};m.o=T,m.j=k,d.push(m)}return d}};return v})();return s})());const hs=QrCreator;var ht=class extends A{constructor(){super(...arguments),this.value="",this.label="",this.size=128,this.fill="black",this.background="white",this.radius=0,this.errorCorrection="H"}firstUpdated(){this.generate()}generate(){this.hasUpdated&&hs.render({text:this.value,radius:this.radius,ecLevel:this.errorCorrection,fill:this.fill,background:this.background,size:this.size*2},this.canvas)}render(){var t;return _`
|
|
1368
|
-
<canvas
|
|
1369
|
-
part="base"
|
|
1370
|
-
class="qr-code"
|
|
1371
|
-
role="img"
|
|
1372
|
-
aria-label=${((t=this.label)==null?void 0:t.length)>0?this.label:this.value}
|
|
1373
|
-
style=${tt({width:`${this.size}px`,height:`${this.size}px`})}
|
|
1374
|
-
></canvas>
|
|
1375
|
-
`}};ht.styles=[I,ds];i([$("canvas")],ht.prototype,"canvas",2);i([a()],ht.prototype,"value",2);i([a()],ht.prototype,"label",2);i([a({type:Number})],ht.prototype,"size",2);i([a()],ht.prototype,"fill",2);i([a()],ht.prototype,"background",2);i([a({type:Number})],ht.prototype,"radius",2);i([a({attribute:"error-correction"})],ht.prototype,"errorCorrection",2);i([x(["background","errorCorrection","fill","radius","size","value"])],ht.prototype,"generate",1);ht.define("sl-qr-code");var us=E`
|
|
1376
|
-
:host {
|
|
1377
|
-
display: block;
|
|
1378
|
-
}
|
|
1379
|
-
|
|
1380
|
-
:host(:focus-visible) {
|
|
1381
|
-
outline: 0px;
|
|
1382
|
-
}
|
|
1383
|
-
|
|
1384
|
-
.radio {
|
|
1385
|
-
display: inline-flex;
|
|
1386
|
-
align-items: top;
|
|
1387
|
-
font-family: var(--sl-input-font-family);
|
|
1388
|
-
font-size: var(--sl-input-font-size-medium);
|
|
1389
|
-
font-weight: var(--sl-input-font-weight);
|
|
1390
|
-
color: var(--sl-input-label-color);
|
|
1391
|
-
vertical-align: middle;
|
|
1392
|
-
cursor: pointer;
|
|
1393
|
-
}
|
|
1394
|
-
|
|
1395
|
-
.radio--small {
|
|
1396
|
-
--toggle-size: var(--sl-toggle-size-small);
|
|
1397
|
-
font-size: var(--sl-input-font-size-small);
|
|
1398
|
-
}
|
|
1399
|
-
|
|
1400
|
-
.radio--medium {
|
|
1401
|
-
--toggle-size: var(--sl-toggle-size-medium);
|
|
1402
|
-
font-size: var(--sl-input-font-size-medium);
|
|
1403
|
-
}
|
|
1404
|
-
|
|
1405
|
-
.radio--large {
|
|
1406
|
-
--toggle-size: var(--sl-toggle-size-large);
|
|
1407
|
-
font-size: var(--sl-input-font-size-large);
|
|
1408
|
-
}
|
|
1409
|
-
|
|
1410
|
-
.radio__checked-icon {
|
|
1411
|
-
display: inline-flex;
|
|
1412
|
-
width: var(--toggle-size);
|
|
1413
|
-
height: var(--toggle-size);
|
|
1414
|
-
}
|
|
1415
|
-
|
|
1416
|
-
.radio__control {
|
|
1417
|
-
flex: 0 0 auto;
|
|
1418
|
-
position: relative;
|
|
1419
|
-
display: inline-flex;
|
|
1420
|
-
align-items: center;
|
|
1421
|
-
justify-content: center;
|
|
1422
|
-
width: var(--toggle-size);
|
|
1423
|
-
height: var(--toggle-size);
|
|
1424
|
-
border: solid var(--sl-input-border-width) var(--sl-input-border-color);
|
|
1425
|
-
border-radius: 50%;
|
|
1426
|
-
background-color: var(--sl-input-background-color);
|
|
1427
|
-
color: transparent;
|
|
1428
|
-
transition:
|
|
1429
|
-
var(--sl-transition-fast) border-color,
|
|
1430
|
-
var(--sl-transition-fast) background-color,
|
|
1431
|
-
var(--sl-transition-fast) color,
|
|
1432
|
-
var(--sl-transition-fast) box-shadow;
|
|
1433
|
-
}
|
|
1434
|
-
|
|
1435
|
-
.radio__input {
|
|
1436
|
-
position: absolute;
|
|
1437
|
-
opacity: 0;
|
|
1438
|
-
padding: 0;
|
|
1439
|
-
margin: 0;
|
|
1440
|
-
pointer-events: none;
|
|
1441
|
-
}
|
|
1442
|
-
|
|
1443
|
-
/* Hover */
|
|
1444
|
-
.radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover {
|
|
1445
|
-
border-color: var(--sl-input-border-color-hover);
|
|
1446
|
-
background-color: var(--sl-input-background-color-hover);
|
|
1447
|
-
}
|
|
1448
|
-
|
|
1449
|
-
/* Checked */
|
|
1450
|
-
.radio--checked .radio__control {
|
|
1451
|
-
color: var(--sl-color-neutral-0);
|
|
1452
|
-
border-color: var(--sl-color-primary-600);
|
|
1453
|
-
background-color: var(--sl-color-primary-600);
|
|
1454
|
-
}
|
|
1455
|
-
|
|
1456
|
-
/* Checked + hover */
|
|
1457
|
-
.radio.radio--checked:not(.radio--disabled) .radio__control:hover {
|
|
1458
|
-
border-color: var(--sl-color-primary-500);
|
|
1459
|
-
background-color: var(--sl-color-primary-500);
|
|
1460
|
-
}
|
|
1461
|
-
|
|
1462
|
-
/* Checked + focus */
|
|
1463
|
-
:host(:focus-visible) .radio__control {
|
|
1464
|
-
outline: var(--sl-focus-ring);
|
|
1465
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
1466
|
-
}
|
|
1467
|
-
|
|
1468
|
-
/* Disabled */
|
|
1469
|
-
.radio--disabled {
|
|
1470
|
-
opacity: 0.5;
|
|
1471
|
-
cursor: not-allowed;
|
|
1472
|
-
}
|
|
1473
|
-
|
|
1474
|
-
/* When the control isn't checked, hide the circle for Windows High Contrast mode a11y */
|
|
1475
|
-
.radio:not(.radio--checked) svg circle {
|
|
1476
|
-
opacity: 0;
|
|
1477
|
-
}
|
|
1478
|
-
|
|
1479
|
-
.radio__label {
|
|
1480
|
-
display: inline-block;
|
|
1481
|
-
color: var(--sl-input-label-color);
|
|
1482
|
-
line-height: var(--toggle-size);
|
|
1483
|
-
margin-inline-start: 0.5em;
|
|
1484
|
-
user-select: none;
|
|
1485
|
-
-webkit-user-select: none;
|
|
1486
|
-
}
|
|
1487
|
-
`,bt=class extends A{constructor(){super(),this.checked=!1,this.hasFocus=!1,this.size="medium",this.disabled=!1,this.handleBlur=()=>{this.hasFocus=!1,this.emit("sl-blur")},this.handleClick=()=>{this.disabled||(this.checked=!0)},this.handleFocus=()=>{this.hasFocus=!0,this.emit("sl-focus")},this.addEventListener("blur",this.handleBlur),this.addEventListener("click",this.handleClick),this.addEventListener("focus",this.handleFocus)}connectedCallback(){super.connectedCallback(),this.setInitialAttributes()}setInitialAttributes(){this.setAttribute("role","radio"),this.setAttribute("tabindex","-1"),this.setAttribute("aria-disabled",this.disabled?"true":"false")}handleCheckedChange(){this.setAttribute("aria-checked",this.checked?"true":"false"),this.setAttribute("tabindex",this.checked?"0":"-1")}handleDisabledChange(){this.setAttribute("aria-disabled",this.disabled?"true":"false")}render(){return _`
|
|
1488
|
-
<span
|
|
1489
|
-
part="base"
|
|
1490
|
-
class=${P({radio:!0,"radio--checked":this.checked,"radio--disabled":this.disabled,"radio--focused":this.hasFocus,"radio--small":this.size==="small","radio--medium":this.size==="medium","radio--large":this.size==="large"})}
|
|
1491
|
-
>
|
|
1492
|
-
<span part="${`control${this.checked?" control--checked":""}`}" class="radio__control">
|
|
1493
|
-
${this.checked?_` <sl-icon part="checked-icon" class="radio__checked-icon" library="system" name="radio"></sl-icon> `:""}
|
|
1494
|
-
</span>
|
|
1495
|
-
|
|
1496
|
-
<slot part="label" class="radio__label"></slot>
|
|
1497
|
-
</span>
|
|
1498
|
-
`}};bt.styles=[I,us];bt.dependencies={"sl-icon":_t};i([L()],bt.prototype,"checked",2);i([L()],bt.prototype,"hasFocus",2);i([a()],bt.prototype,"value",2);i([a({reflect:!0})],bt.prototype,"size",2);i([a({type:Boolean,reflect:!0})],bt.prototype,"disabled",2);i([x("checked")],bt.prototype,"handleCheckedChange",1);i([x("disabled",{waitUntilFirstUpdate:!0})],bt.prototype,"handleDisabledChange",1);bt.define("sl-radio");Xt.define("sl-popup");var ps=E`
|
|
1499
|
-
:host {
|
|
1500
|
-
--height: 1rem;
|
|
1501
|
-
--track-color: var(--sl-color-neutral-200);
|
|
1502
|
-
--indicator-color: var(--sl-color-primary-600);
|
|
1503
|
-
--label-color: var(--sl-color-neutral-0);
|
|
1504
|
-
|
|
1505
|
-
display: block;
|
|
1506
|
-
}
|
|
1507
|
-
|
|
1508
|
-
.progress-bar {
|
|
1509
|
-
position: relative;
|
|
1510
|
-
background-color: var(--track-color);
|
|
1511
|
-
height: var(--height);
|
|
1512
|
-
border-radius: var(--sl-border-radius-pill);
|
|
1513
|
-
box-shadow: inset var(--sl-shadow-small);
|
|
1514
|
-
overflow: hidden;
|
|
1515
|
-
}
|
|
1516
|
-
|
|
1517
|
-
.progress-bar__indicator {
|
|
1518
|
-
height: 100%;
|
|
1519
|
-
font-family: var(--sl-font-sans);
|
|
1520
|
-
font-size: 12px;
|
|
1521
|
-
font-weight: var(--sl-font-weight-normal);
|
|
1522
|
-
background-color: var(--indicator-color);
|
|
1523
|
-
color: var(--label-color);
|
|
1524
|
-
text-align: center;
|
|
1525
|
-
line-height: var(--height);
|
|
1526
|
-
white-space: nowrap;
|
|
1527
|
-
overflow: hidden;
|
|
1528
|
-
transition:
|
|
1529
|
-
400ms width,
|
|
1530
|
-
400ms background-color;
|
|
1531
|
-
user-select: none;
|
|
1532
|
-
-webkit-user-select: none;
|
|
1533
|
-
}
|
|
1534
|
-
|
|
1535
|
-
/* Indeterminate */
|
|
1536
|
-
.progress-bar--indeterminate .progress-bar__indicator {
|
|
1537
|
-
position: absolute;
|
|
1538
|
-
animation: indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);
|
|
1539
|
-
}
|
|
1540
|
-
|
|
1541
|
-
.progress-bar--indeterminate.progress-bar--rtl .progress-bar__indicator {
|
|
1542
|
-
animation-name: indeterminate-rtl;
|
|
1543
|
-
}
|
|
1544
|
-
|
|
1545
|
-
@media (forced-colors: active) {
|
|
1546
|
-
.progress-bar {
|
|
1547
|
-
outline: solid 1px SelectedItem;
|
|
1548
|
-
background-color: var(--sl-color-neutral-0);
|
|
1549
|
-
}
|
|
1550
|
-
|
|
1551
|
-
.progress-bar__indicator {
|
|
1552
|
-
outline: solid 1px SelectedItem;
|
|
1553
|
-
background-color: SelectedItem;
|
|
1554
|
-
}
|
|
1555
|
-
}
|
|
1556
|
-
|
|
1557
|
-
@keyframes indeterminate {
|
|
1558
|
-
0% {
|
|
1559
|
-
left: -50%;
|
|
1560
|
-
width: 50%;
|
|
1561
|
-
}
|
|
1562
|
-
75%,
|
|
1563
|
-
100% {
|
|
1564
|
-
left: 100%;
|
|
1565
|
-
width: 50%;
|
|
1566
|
-
}
|
|
1567
|
-
}
|
|
1568
|
-
|
|
1569
|
-
@keyframes indeterminate-rtl {
|
|
1570
|
-
0% {
|
|
1571
|
-
right: -50%;
|
|
1572
|
-
width: 50%;
|
|
1573
|
-
}
|
|
1574
|
-
75%,
|
|
1575
|
-
100% {
|
|
1576
|
-
right: 100%;
|
|
1577
|
-
width: 50%;
|
|
1578
|
-
}
|
|
1579
|
-
}
|
|
1580
|
-
`,Pt=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.value=0,this.indeterminate=!1,this.label=""}render(){return _`
|
|
1581
|
-
<div
|
|
1582
|
-
part="base"
|
|
1583
|
-
class=${P({"progress-bar":!0,"progress-bar--indeterminate":this.indeterminate,"progress-bar--rtl":this.localize.dir()==="rtl"})}
|
|
1584
|
-
role="progressbar"
|
|
1585
|
-
title=${F(this.title)}
|
|
1586
|
-
aria-label=${this.label.length>0?this.label:this.localize.term("progress")}
|
|
1587
|
-
aria-valuemin="0"
|
|
1588
|
-
aria-valuemax="100"
|
|
1589
|
-
aria-valuenow=${this.indeterminate?0:this.value}
|
|
1590
|
-
>
|
|
1591
|
-
<div part="indicator" class="progress-bar__indicator" style=${tt({width:`${this.value}%`})}>
|
|
1592
|
-
${this.indeterminate?"":_` <slot part="label" class="progress-bar__label"></slot> `}
|
|
1593
|
-
</div>
|
|
1594
|
-
</div>
|
|
1595
|
-
`}};Pt.styles=[I,ps];i([a({type:Number,reflect:!0})],Pt.prototype,"value",2);i([a({type:Boolean,reflect:!0})],Pt.prototype,"indeterminate",2);i([a()],Pt.prototype,"label",2);Pt.define("sl-progress-bar");var fs=E`
|
|
1596
|
-
:host {
|
|
1597
|
-
display: block;
|
|
1598
|
-
}
|
|
1599
|
-
|
|
1600
|
-
.menu-label {
|
|
1601
|
-
display: inline-block;
|
|
1602
|
-
font-family: var(--sl-font-sans);
|
|
1603
|
-
font-size: var(--sl-font-size-small);
|
|
1604
|
-
font-weight: var(--sl-font-weight-semibold);
|
|
1605
|
-
line-height: var(--sl-line-height-normal);
|
|
1606
|
-
letter-spacing: var(--sl-letter-spacing-normal);
|
|
1607
|
-
color: var(--sl-color-neutral-500);
|
|
1608
|
-
padding: var(--sl-spacing-2x-small) var(--sl-spacing-x-large);
|
|
1609
|
-
user-select: none;
|
|
1610
|
-
-webkit-user-select: none;
|
|
1611
|
-
}
|
|
1612
|
-
`,Se=class extends A{render(){return _` <slot part="base" class="menu-label"></slot> `}};Se.styles=[I,fs];Se.define("sl-menu-label");var ms=E`
|
|
1613
|
-
:host {
|
|
1614
|
-
display: contents;
|
|
1615
|
-
}
|
|
1616
|
-
`,vt=class extends A{constructor(){super(...arguments),this.attrOldValue=!1,this.charData=!1,this.charDataOldValue=!1,this.childList=!1,this.disabled=!1,this.handleMutation=t=>{this.emit("sl-mutation",{detail:{mutationList:t}})}}connectedCallback(){super.connectedCallback(),this.mutationObserver=new MutationObserver(this.handleMutation),this.disabled||this.startObserver()}disconnectedCallback(){super.disconnectedCallback(),this.stopObserver()}startObserver(){const t=typeof this.attr=="string"&&this.attr.length>0,e=t&&this.attr!=="*"?this.attr.split(" "):void 0;try{this.mutationObserver.observe(this,{subtree:!0,childList:this.childList,attributes:t,attributeFilter:e,attributeOldValue:this.attrOldValue,characterData:this.charData,characterDataOldValue:this.charDataOldValue})}catch{}}stopObserver(){this.mutationObserver.disconnect()}handleDisabledChange(){this.disabled?this.stopObserver():this.startObserver()}handleChange(){this.stopObserver(),this.startObserver()}render(){return _` <slot></slot> `}};vt.styles=[I,ms];i([a({reflect:!0})],vt.prototype,"attr",2);i([a({attribute:"attr-old-value",type:Boolean,reflect:!0})],vt.prototype,"attrOldValue",2);i([a({attribute:"char-data",type:Boolean,reflect:!0})],vt.prototype,"charData",2);i([a({attribute:"char-data-old-value",type:Boolean,reflect:!0})],vt.prototype,"charDataOldValue",2);i([a({attribute:"child-list",type:Boolean,reflect:!0})],vt.prototype,"childList",2);i([a({type:Boolean,reflect:!0})],vt.prototype,"disabled",2);i([x("disabled")],vt.prototype,"handleDisabledChange",1);i([x("attr",{waitUntilFirstUpdate:!0}),x("attr-old-value",{waitUntilFirstUpdate:!0}),x("char-data",{waitUntilFirstUpdate:!0}),x("char-data-old-value",{waitUntilFirstUpdate:!0}),x("childList",{waitUntilFirstUpdate:!0})],vt.prototype,"handleChange",1);vt.define("sl-mutation-observer");var gs=E`
|
|
1617
|
-
:host {
|
|
1618
|
-
--submenu-offset: -2px;
|
|
1619
|
-
|
|
1620
|
-
display: block;
|
|
1621
|
-
}
|
|
1622
|
-
|
|
1623
|
-
:host([inert]) {
|
|
1624
|
-
display: none;
|
|
1625
|
-
}
|
|
1626
|
-
|
|
1627
|
-
.menu-item {
|
|
1628
|
-
position: relative;
|
|
1629
|
-
display: flex;
|
|
1630
|
-
align-items: stretch;
|
|
1631
|
-
font-family: var(--sl-font-sans);
|
|
1632
|
-
font-size: var(--sl-font-size-medium);
|
|
1633
|
-
font-weight: var(--sl-font-weight-normal);
|
|
1634
|
-
line-height: var(--sl-line-height-normal);
|
|
1635
|
-
letter-spacing: var(--sl-letter-spacing-normal);
|
|
1636
|
-
color: var(--sl-color-neutral-700);
|
|
1637
|
-
padding: var(--sl-spacing-2x-small) var(--sl-spacing-2x-small);
|
|
1638
|
-
transition: var(--sl-transition-fast) fill;
|
|
1639
|
-
user-select: none;
|
|
1640
|
-
-webkit-user-select: none;
|
|
1641
|
-
white-space: nowrap;
|
|
1642
|
-
cursor: pointer;
|
|
1643
|
-
}
|
|
1644
|
-
|
|
1645
|
-
.menu-item.menu-item--disabled {
|
|
1646
|
-
outline: none;
|
|
1647
|
-
opacity: 0.5;
|
|
1648
|
-
cursor: not-allowed;
|
|
1649
|
-
}
|
|
1650
|
-
|
|
1651
|
-
.menu-item.menu-item--loading {
|
|
1652
|
-
outline: none;
|
|
1653
|
-
cursor: wait;
|
|
1654
|
-
}
|
|
1655
|
-
|
|
1656
|
-
.menu-item.menu-item--loading *:not(sl-spinner) {
|
|
1657
|
-
opacity: 0.5;
|
|
1658
|
-
}
|
|
1659
|
-
|
|
1660
|
-
.menu-item--loading sl-spinner {
|
|
1661
|
-
--indicator-color: currentColor;
|
|
1662
|
-
--track-width: 1px;
|
|
1663
|
-
position: absolute;
|
|
1664
|
-
font-size: 0.75em;
|
|
1665
|
-
top: calc(50% - 0.5em);
|
|
1666
|
-
left: 0.65rem;
|
|
1667
|
-
opacity: 1;
|
|
1668
|
-
}
|
|
1669
|
-
|
|
1670
|
-
.menu-item .menu-item__label {
|
|
1671
|
-
flex: 1 1 auto;
|
|
1672
|
-
display: inline-block;
|
|
1673
|
-
text-overflow: ellipsis;
|
|
1674
|
-
overflow: hidden;
|
|
1675
|
-
}
|
|
1676
|
-
|
|
1677
|
-
.menu-item .menu-item__prefix {
|
|
1678
|
-
flex: 0 0 auto;
|
|
1679
|
-
display: flex;
|
|
1680
|
-
align-items: center;
|
|
1681
|
-
}
|
|
1682
|
-
|
|
1683
|
-
.menu-item .menu-item__prefix::slotted(*) {
|
|
1684
|
-
margin-inline-end: var(--sl-spacing-x-small);
|
|
1685
|
-
}
|
|
1686
|
-
|
|
1687
|
-
.menu-item .menu-item__suffix {
|
|
1688
|
-
flex: 0 0 auto;
|
|
1689
|
-
display: flex;
|
|
1690
|
-
align-items: center;
|
|
1691
|
-
}
|
|
1692
|
-
|
|
1693
|
-
.menu-item .menu-item__suffix::slotted(*) {
|
|
1694
|
-
margin-inline-start: var(--sl-spacing-x-small);
|
|
1695
|
-
}
|
|
1696
|
-
|
|
1697
|
-
/* Safe triangle */
|
|
1698
|
-
.menu-item--submenu-expanded::after {
|
|
1699
|
-
content: '';
|
|
1700
|
-
position: fixed;
|
|
1701
|
-
z-index: calc(var(--sl-z-index-dropdown) - 1);
|
|
1702
|
-
top: 0;
|
|
1703
|
-
right: 0;
|
|
1704
|
-
bottom: 0;
|
|
1705
|
-
left: 0;
|
|
1706
|
-
clip-path: polygon(
|
|
1707
|
-
var(--safe-triangle-cursor-x, 0) var(--safe-triangle-cursor-y, 0),
|
|
1708
|
-
var(--safe-triangle-submenu-start-x, 0) var(--safe-triangle-submenu-start-y, 0),
|
|
1709
|
-
var(--safe-triangle-submenu-end-x, 0) var(--safe-triangle-submenu-end-y, 0)
|
|
1710
|
-
);
|
|
1711
|
-
}
|
|
1712
|
-
|
|
1713
|
-
:host(:focus-visible) {
|
|
1714
|
-
outline: none;
|
|
1715
|
-
}
|
|
1716
|
-
|
|
1717
|
-
:host(:hover:not([aria-disabled='true'], :focus-visible)) .menu-item,
|
|
1718
|
-
.menu-item--submenu-expanded {
|
|
1719
|
-
background-color: var(--sl-color-neutral-100);
|
|
1720
|
-
color: var(--sl-color-neutral-1000);
|
|
1721
|
-
}
|
|
1722
|
-
|
|
1723
|
-
:host(:focus-visible) .menu-item {
|
|
1724
|
-
outline: none;
|
|
1725
|
-
background-color: var(--sl-color-primary-600);
|
|
1726
|
-
color: var(--sl-color-neutral-0);
|
|
1727
|
-
opacity: 1;
|
|
1728
|
-
}
|
|
1729
|
-
|
|
1730
|
-
.menu-item .menu-item__check,
|
|
1731
|
-
.menu-item .menu-item__chevron {
|
|
1732
|
-
flex: 0 0 auto;
|
|
1733
|
-
display: flex;
|
|
1734
|
-
align-items: center;
|
|
1735
|
-
justify-content: center;
|
|
1736
|
-
width: 1.5em;
|
|
1737
|
-
visibility: hidden;
|
|
1738
|
-
}
|
|
1739
|
-
|
|
1740
|
-
.menu-item--checked .menu-item__check,
|
|
1741
|
-
.menu-item--has-submenu .menu-item__chevron {
|
|
1742
|
-
visibility: visible;
|
|
1743
|
-
}
|
|
1744
|
-
|
|
1745
|
-
/* Add elevation and z-index to submenus */
|
|
1746
|
-
sl-popup::part(popup) {
|
|
1747
|
-
box-shadow: var(--sl-shadow-large);
|
|
1748
|
-
z-index: var(--sl-z-index-dropdown);
|
|
1749
|
-
margin-left: var(--submenu-offset);
|
|
1750
|
-
}
|
|
1751
|
-
|
|
1752
|
-
.menu-item--rtl sl-popup::part(popup) {
|
|
1753
|
-
margin-left: calc(-1 * var(--submenu-offset));
|
|
1754
|
-
}
|
|
1755
|
-
|
|
1756
|
-
@media (forced-colors: active) {
|
|
1757
|
-
:host(:hover:not([aria-disabled='true'])) .menu-item,
|
|
1758
|
-
:host(:focus-visible) .menu-item {
|
|
1759
|
-
outline: dashed 1px SelectedItem;
|
|
1760
|
-
outline-offset: -1px;
|
|
1761
|
-
}
|
|
1762
|
-
}
|
|
1763
|
-
|
|
1764
|
-
::slotted(sl-menu) {
|
|
1765
|
-
max-width: var(--auto-size-available-width) !important;
|
|
1766
|
-
max-height: var(--auto-size-available-height) !important;
|
|
1767
|
-
}
|
|
1768
|
-
`;const It=(t,e)=>{const s=t._$AN;if(s===void 0)return!1;for(const r of s)r._$AO?.(e,!1),It(r,e);return!0},Ut=t=>{let e,s;do{if((e=t._$AM)===void 0)break;s=e._$AN,s.delete(t),t=e}while(s?.size===0)},Ae=t=>{for(let e;e=t._$AM;t=e){let s=e._$AN;if(s===void 0)e._$AN=s=new Set;else if(s.has(t))break;s.add(t),ys(e)}};function bs(t){this._$AN!==void 0?(Ut(this),this._$AM=t,Ae(this)):this._$AM=t}function vs(t,e=!1,s=0){const r=this._$AH,o=this._$AN;if(o!==void 0&&o.size!==0)if(e)if(Array.isArray(r))for(let n=s;n<r.length;n++)It(r[n],!1),Ut(r[n]);else r!=null&&(It(r,!1),Ut(r));else It(this,t)}const ys=t=>{t.type==_e.CHILD&&(t._$AP??=vs,t._$AQ??=bs)};class ws extends we{constructor(){super(...arguments),this._$AN=void 0}_$AT(e,s,r){super._$AT(e,s,r),Ae(this),this.isConnected=e._$AU}_$AO(e,s=!0){e!==this.isConnected&&(this.isConnected=e,e?this.reconnected?.():this.disconnected?.()),s&&(It(this,e),Ut(this))}setValue(e){if(Fe(this._$Ct))this._$Ct._$AI(e,this);else{const s=[...this._$Ct._$AH];s[this._$Ci]=e,this._$Ct._$AI(s,this,0)}}disconnected(){}reconnected(){}}const _s=()=>new xs;class xs{}const Jt=new WeakMap,ks=ye(class extends ws{render(t){return ne}update(t,[e]){const s=e!==this.G;return s&&this.G!==void 0&&this.rt(void 0),(s||this.lt!==this.ct)&&(this.G=e,this.ht=t.options?.host,this.rt(this.ct=t.element)),ne}rt(t){if(this.isConnected||(t=void 0),typeof this.G=="function"){const e=this.ht??globalThis;let s=Jt.get(e);s===void 0&&(s=new WeakMap,Jt.set(e,s)),s.get(this.G)!==void 0&&this.G.call(this.ht,void 0),s.set(this.G,t),t!==void 0&&this.G.call(this.ht,t)}else this.G.value=t}get lt(){return typeof this.G=="function"?Jt.get(this.ht??globalThis)?.get(this.G):this.G?.value}disconnected(){this.lt===this.ct&&this.rt(void 0)}reconnected(){this.rt(this.ct)}});var Cs=class{constructor(t,e){this.popupRef=_s(),this.enableSubmenuTimer=-1,this.isConnected=!1,this.isPopupConnected=!1,this.skidding=0,this.submenuOpenDelay=100,this.handleMouseMove=s=>{this.host.style.setProperty("--safe-triangle-cursor-x",`${s.clientX}px`),this.host.style.setProperty("--safe-triangle-cursor-y",`${s.clientY}px`)},this.handleMouseOver=()=>{this.hasSlotController.test("submenu")&&this.enableSubmenu()},this.handleKeyDown=s=>{switch(s.key){case"Escape":case"Tab":this.disableSubmenu();break;case"ArrowLeft":s.target!==this.host&&(s.preventDefault(),s.stopPropagation(),this.host.focus(),this.disableSubmenu());break;case"ArrowRight":case"Enter":case" ":this.handleSubmenuEntry(s);break}},this.handleClick=s=>{var r;s.target===this.host?(s.preventDefault(),s.stopPropagation()):s.target instanceof Element&&(s.target.tagName==="sl-menu-item"||(r=s.target.role)!=null&&r.startsWith("menuitem"))&&this.disableSubmenu()},this.handleFocusOut=s=>{s.relatedTarget&&s.relatedTarget instanceof Element&&this.host.contains(s.relatedTarget)||this.disableSubmenu()},this.handlePopupMouseover=s=>{s.stopPropagation()},this.handlePopupReposition=()=>{const s=this.host.renderRoot.querySelector("slot[name='submenu']"),r=s?.assignedElements({flatten:!0}).filter(u=>u.localName==="sl-menu")[0],o=getComputedStyle(this.host).direction==="rtl";if(!r)return;const{left:n,top:h,width:p,height:l}=r.getBoundingClientRect();this.host.style.setProperty("--safe-triangle-submenu-start-x",`${o?n+p:n}px`),this.host.style.setProperty("--safe-triangle-submenu-start-y",`${h}px`),this.host.style.setProperty("--safe-triangle-submenu-end-x",`${o?n+p:n}px`),this.host.style.setProperty("--safe-triangle-submenu-end-y",`${h+l}px`)},(this.host=t).addController(this),this.hasSlotController=e}hostConnected(){this.hasSlotController.test("submenu")&&!this.host.disabled&&this.addListeners()}hostDisconnected(){this.removeListeners()}hostUpdated(){this.hasSlotController.test("submenu")&&!this.host.disabled?(this.addListeners(),this.updateSkidding()):this.removeListeners()}addListeners(){this.isConnected||(this.host.addEventListener("mousemove",this.handleMouseMove),this.host.addEventListener("mouseover",this.handleMouseOver),this.host.addEventListener("keydown",this.handleKeyDown),this.host.addEventListener("click",this.handleClick),this.host.addEventListener("focusout",this.handleFocusOut),this.isConnected=!0),this.isPopupConnected||this.popupRef.value&&(this.popupRef.value.addEventListener("mouseover",this.handlePopupMouseover),this.popupRef.value.addEventListener("sl-reposition",this.handlePopupReposition),this.isPopupConnected=!0)}removeListeners(){this.isConnected&&(this.host.removeEventListener("mousemove",this.handleMouseMove),this.host.removeEventListener("mouseover",this.handleMouseOver),this.host.removeEventListener("keydown",this.handleKeyDown),this.host.removeEventListener("click",this.handleClick),this.host.removeEventListener("focusout",this.handleFocusOut),this.isConnected=!1),this.isPopupConnected&&this.popupRef.value&&(this.popupRef.value.removeEventListener("mouseover",this.handlePopupMouseover),this.popupRef.value.removeEventListener("sl-reposition",this.handlePopupReposition),this.isPopupConnected=!1)}handleSubmenuEntry(t){const e=this.host.renderRoot.querySelector("slot[name='submenu']");if(!e){console.error("Cannot activate a submenu if no corresponding menuitem can be found.",this);return}let s=null;for(const r of e.assignedElements())if(s=r.querySelectorAll("sl-menu-item, [role^='menuitem']"),s.length!==0)break;if(!(!s||s.length===0)){s[0].setAttribute("tabindex","0");for(let r=1;r!==s.length;++r)s[r].setAttribute("tabindex","-1");this.popupRef.value&&(t.preventDefault(),t.stopPropagation(),this.popupRef.value.active?s[0]instanceof HTMLElement&&s[0].focus():(this.enableSubmenu(!1),this.host.updateComplete.then(()=>{s[0]instanceof HTMLElement&&s[0].focus()}),this.host.requestUpdate()))}}setSubmenuState(t){this.popupRef.value&&this.popupRef.value.active!==t&&(this.popupRef.value.active=t,this.host.requestUpdate())}enableSubmenu(t=!0){t?(window.clearTimeout(this.enableSubmenuTimer),this.enableSubmenuTimer=window.setTimeout(()=>{this.setSubmenuState(!0)},this.submenuOpenDelay)):this.setSubmenuState(!0)}disableSubmenu(){window.clearTimeout(this.enableSubmenuTimer),this.setSubmenuState(!1)}updateSkidding(){var t;if(!((t=this.host.parentElement)!=null&&t.computedStyleMap))return;const e=this.host.parentElement.computedStyleMap(),r=["padding-top","border-top-width","margin-top"].reduce((o,n)=>{var h;const p=(h=e.get(n))!=null?h:new CSSUnitValue(0,"px"),u=(p instanceof CSSUnitValue?p:new CSSUnitValue(0,"px")).to("px");return o-u.value},0);this.skidding=r}isExpanded(){return this.popupRef.value?this.popupRef.value.active:!1}renderSubmenu(){const t=getComputedStyle(this.host).direction==="rtl";return this.isConnected?_`
|
|
1769
|
-
<sl-popup
|
|
1770
|
-
${ks(this.popupRef)}
|
|
1771
|
-
placement=${t?"left-start":"right-start"}
|
|
1772
|
-
anchor="anchor"
|
|
1773
|
-
flip
|
|
1774
|
-
flip-fallback-strategy="best-fit"
|
|
1775
|
-
skidding="${this.skidding}"
|
|
1776
|
-
strategy="fixed"
|
|
1777
|
-
auto-size="vertical"
|
|
1778
|
-
auto-size-padding="10"
|
|
1779
|
-
>
|
|
1780
|
-
<slot name="submenu"></slot>
|
|
1781
|
-
</sl-popup>
|
|
1782
|
-
`:_` <slot name="submenu" hidden></slot> `}},ot=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.type="normal",this.checked=!1,this.value="",this.loading=!1,this.disabled=!1,this.hasSlotController=new $t(this,"submenu"),this.submenuController=new Cs(this,this.hasSlotController),this.handleHostClick=t=>{this.disabled&&(t.preventDefault(),t.stopImmediatePropagation())},this.handleMouseOver=t=>{this.focus(),t.stopPropagation()}}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleHostClick),this.addEventListener("mouseover",this.handleMouseOver)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleHostClick),this.removeEventListener("mouseover",this.handleMouseOver)}handleDefaultSlotChange(){const t=this.getTextLabel();if(typeof this.cachedTextLabel>"u"){this.cachedTextLabel=t;return}t!==this.cachedTextLabel&&(this.cachedTextLabel=t,this.emit("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))}handleCheckedChange(){if(this.checked&&this.type!=="checkbox"){this.checked=!1,console.error('The checked attribute can only be used on menu items with type="checkbox"',this);return}this.type==="checkbox"?this.setAttribute("aria-checked",this.checked?"true":"false"):this.removeAttribute("aria-checked")}handleDisabledChange(){this.setAttribute("aria-disabled",this.disabled?"true":"false")}handleTypeChange(){this.type==="checkbox"?(this.setAttribute("role","menuitemcheckbox"),this.setAttribute("aria-checked",this.checked?"true":"false")):(this.setAttribute("role","menuitem"),this.removeAttribute("aria-checked"))}getTextLabel(){return Ve(this.defaultSlot)}isSubmenu(){return this.hasSlotController.test("submenu")}render(){const t=this.localize.dir()==="rtl",e=this.submenuController.isExpanded();return _`
|
|
1783
|
-
<div
|
|
1784
|
-
id="anchor"
|
|
1785
|
-
part="base"
|
|
1786
|
-
class=${P({"menu-item":!0,"menu-item--rtl":t,"menu-item--checked":this.checked,"menu-item--disabled":this.disabled,"menu-item--loading":this.loading,"menu-item--has-submenu":this.isSubmenu(),"menu-item--submenu-expanded":e})}
|
|
1787
|
-
?aria-haspopup="${this.isSubmenu()}"
|
|
1788
|
-
?aria-expanded="${!!e}"
|
|
1789
|
-
>
|
|
1790
|
-
<span part="checked-icon" class="menu-item__check">
|
|
1791
|
-
<sl-icon name="check" library="system" aria-hidden="true"></sl-icon>
|
|
1792
|
-
</span>
|
|
1793
|
-
|
|
1794
|
-
<slot name="prefix" part="prefix" class="menu-item__prefix"></slot>
|
|
1795
|
-
|
|
1796
|
-
<slot part="label" class="menu-item__label" @slotchange=${this.handleDefaultSlotChange}></slot>
|
|
1797
|
-
|
|
1798
|
-
<slot name="suffix" part="suffix" class="menu-item__suffix"></slot>
|
|
1799
|
-
|
|
1800
|
-
<span part="submenu-icon" class="menu-item__chevron">
|
|
1801
|
-
<sl-icon name=${t?"chevron-left":"chevron-right"} library="system" aria-hidden="true"></sl-icon>
|
|
1802
|
-
</span>
|
|
1803
|
-
|
|
1804
|
-
${this.submenuController.renderSubmenu()}
|
|
1805
|
-
${this.loading?_` <sl-spinner part="spinner" exportparts="base:spinner__base"></sl-spinner> `:""}
|
|
1806
|
-
</div>
|
|
1807
|
-
`}};ot.styles=[I,gs];ot.dependencies={"sl-icon":_t,"sl-popup":Xt,"sl-spinner":xe};i([$("slot:not([name])")],ot.prototype,"defaultSlot",2);i([$(".menu-item")],ot.prototype,"menuItem",2);i([a()],ot.prototype,"type",2);i([a({type:Boolean,reflect:!0})],ot.prototype,"checked",2);i([a()],ot.prototype,"value",2);i([a({type:Boolean,reflect:!0})],ot.prototype,"loading",2);i([a({type:Boolean,reflect:!0})],ot.prototype,"disabled",2);i([x("checked")],ot.prototype,"handleCheckedChange",1);i([x("disabled")],ot.prototype,"handleDisabledChange",1);i([x("type")],ot.prototype,"handleTypeChange",1);ot.define("sl-menu-item");var $s=E`
|
|
1808
|
-
:host {
|
|
1809
|
-
--divider-width: 2px;
|
|
1810
|
-
--handle-size: 2.5rem;
|
|
1811
|
-
|
|
1812
|
-
display: inline-block;
|
|
1813
|
-
position: relative;
|
|
1814
|
-
}
|
|
1815
|
-
|
|
1816
|
-
.image-comparer {
|
|
1817
|
-
max-width: 100%;
|
|
1818
|
-
max-height: 100%;
|
|
1819
|
-
overflow: hidden;
|
|
1820
|
-
}
|
|
1821
|
-
|
|
1822
|
-
.image-comparer__before,
|
|
1823
|
-
.image-comparer__after {
|
|
1824
|
-
display: block;
|
|
1825
|
-
pointer-events: none;
|
|
1826
|
-
}
|
|
1827
|
-
|
|
1828
|
-
.image-comparer__before::slotted(img),
|
|
1829
|
-
.image-comparer__after::slotted(img),
|
|
1830
|
-
.image-comparer__before::slotted(svg),
|
|
1831
|
-
.image-comparer__after::slotted(svg) {
|
|
1832
|
-
display: block;
|
|
1833
|
-
max-width: 100% !important;
|
|
1834
|
-
height: auto;
|
|
1835
|
-
}
|
|
1836
|
-
|
|
1837
|
-
.image-comparer__after {
|
|
1838
|
-
position: absolute;
|
|
1839
|
-
top: 0;
|
|
1840
|
-
left: 0;
|
|
1841
|
-
height: 100%;
|
|
1842
|
-
width: 100%;
|
|
1843
|
-
}
|
|
1844
|
-
|
|
1845
|
-
.image-comparer__divider {
|
|
1846
|
-
display: flex;
|
|
1847
|
-
align-items: center;
|
|
1848
|
-
justify-content: center;
|
|
1849
|
-
position: absolute;
|
|
1850
|
-
top: 0;
|
|
1851
|
-
width: var(--divider-width);
|
|
1852
|
-
height: 100%;
|
|
1853
|
-
background-color: var(--sl-color-neutral-0);
|
|
1854
|
-
translate: calc(var(--divider-width) / -2);
|
|
1855
|
-
cursor: ew-resize;
|
|
1856
|
-
}
|
|
1857
|
-
|
|
1858
|
-
.image-comparer__handle {
|
|
1859
|
-
display: flex;
|
|
1860
|
-
align-items: center;
|
|
1861
|
-
justify-content: center;
|
|
1862
|
-
position: absolute;
|
|
1863
|
-
top: calc(50% - (var(--handle-size) / 2));
|
|
1864
|
-
width: var(--handle-size);
|
|
1865
|
-
height: var(--handle-size);
|
|
1866
|
-
background-color: var(--sl-color-neutral-0);
|
|
1867
|
-
border-radius: var(--sl-border-radius-circle);
|
|
1868
|
-
font-size: calc(var(--handle-size) * 0.5);
|
|
1869
|
-
color: var(--sl-color-neutral-700);
|
|
1870
|
-
cursor: inherit;
|
|
1871
|
-
z-index: 10;
|
|
1872
|
-
}
|
|
1873
|
-
|
|
1874
|
-
.image-comparer__handle:focus-visible {
|
|
1875
|
-
outline: var(--sl-focus-ring);
|
|
1876
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
1877
|
-
}
|
|
1878
|
-
`,At=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.position=50}handleDrag(t){const{width:e}=this.base.getBoundingClientRect(),s=this.localize.dir()==="rtl";t.preventDefault(),Et(this.base,{onMove:r=>{this.position=parseFloat(U(r/e*100,0,100).toFixed(2)),s&&(this.position=100-this.position)},initialEvent:t})}handleKeyDown(t){const e=this.localize.dir()==="ltr",s=this.localize.dir()==="rtl";if(["ArrowLeft","ArrowRight","Home","End"].includes(t.key)){const r=t.shiftKey?10:1;let o=this.position;t.preventDefault(),(e&&t.key==="ArrowLeft"||s&&t.key==="ArrowRight")&&(o-=r),(e&&t.key==="ArrowRight"||s&&t.key==="ArrowLeft")&&(o+=r),t.key==="Home"&&(o=0),t.key==="End"&&(o=100),o=U(o,0,100),this.position=o}}handlePositionChange(){this.emit("sl-change")}render(){const t=this.localize.dir()==="rtl";return _`
|
|
1879
|
-
<div
|
|
1880
|
-
part="base"
|
|
1881
|
-
id="image-comparer"
|
|
1882
|
-
class=${P({"image-comparer":!0,"image-comparer--rtl":t})}
|
|
1883
|
-
@keydown=${this.handleKeyDown}
|
|
1884
|
-
>
|
|
1885
|
-
<div class="image-comparer__image">
|
|
1886
|
-
<div part="before" class="image-comparer__before">
|
|
1887
|
-
<slot name="before"></slot>
|
|
1888
|
-
</div>
|
|
1889
|
-
|
|
1890
|
-
<div
|
|
1891
|
-
part="after"
|
|
1892
|
-
class="image-comparer__after"
|
|
1893
|
-
style=${tt({clipPath:t?`inset(0 0 0 ${100-this.position}%)`:`inset(0 ${100-this.position}% 0 0)`})}
|
|
1894
|
-
>
|
|
1895
|
-
<slot name="after"></slot>
|
|
1896
|
-
</div>
|
|
1897
|
-
</div>
|
|
1898
|
-
|
|
1899
|
-
<div
|
|
1900
|
-
part="divider"
|
|
1901
|
-
class="image-comparer__divider"
|
|
1902
|
-
style=${tt({left:t?`${100-this.position}%`:`${this.position}%`})}
|
|
1903
|
-
@mousedown=${this.handleDrag}
|
|
1904
|
-
@touchstart=${this.handleDrag}
|
|
1905
|
-
>
|
|
1906
|
-
<div
|
|
1907
|
-
part="handle"
|
|
1908
|
-
class="image-comparer__handle"
|
|
1909
|
-
role="scrollbar"
|
|
1910
|
-
aria-valuenow=${this.position}
|
|
1911
|
-
aria-valuemin="0"
|
|
1912
|
-
aria-valuemax="100"
|
|
1913
|
-
aria-controls="image-comparer"
|
|
1914
|
-
tabindex="0"
|
|
1915
|
-
>
|
|
1916
|
-
<slot name="handle">
|
|
1917
|
-
<sl-icon library="system" name="grip-vertical"></sl-icon>
|
|
1918
|
-
</slot>
|
|
1919
|
-
</div>
|
|
1920
|
-
</div>
|
|
1921
|
-
</div>
|
|
1922
|
-
`}};At.styles=[I,$s];At.scopedElement={"sl-icon":_t};i([$(".image-comparer")],At.prototype,"base",2);i([$(".image-comparer__handle")],At.prototype,"handle",2);i([a({type:Number,reflect:!0})],At.prototype,"position",2);i([x("position",{waitUntilFirstUpdate:!0})],At.prototype,"handlePositionChange",1);At.define("sl-image-comparer");var zs=E`
|
|
1923
|
-
:host {
|
|
1924
|
-
display: block;
|
|
1925
|
-
}
|
|
1926
|
-
`,te=new Map;function Ss(t,e="cors"){const s=te.get(t);if(s!==void 0)return Promise.resolve(s);const r=fetch(t,{mode:e}).then(async o=>{const n={ok:o.ok,status:o.status,html:await o.text()};return te.set(t,n),n});return te.set(t,r),r}var Tt=class extends A{constructor(){super(...arguments),this.mode="cors",this.allowScripts=!1}executeScript(t){const e=document.createElement("script");[...t.attributes].forEach(s=>e.setAttribute(s.name,s.value)),e.textContent=t.textContent,t.parentNode.replaceChild(e,t)}async handleSrcChange(){try{const t=this.src,e=await Ss(t,this.mode);if(t!==this.src)return;if(!e.ok){this.emit("sl-error",{detail:{status:e.status}});return}this.innerHTML=e.html,this.allowScripts&&[...this.querySelectorAll("script")].forEach(s=>this.executeScript(s)),this.emit("sl-load")}catch{this.emit("sl-error",{detail:{status:-1}})}}render(){return _`<slot></slot>`}};Tt.styles=[I,zs];i([a()],Tt.prototype,"src",2);i([a()],Tt.prototype,"mode",2);i([a({attribute:"allow-scripts",type:Boolean})],Tt.prototype,"allowScripts",2);i([x("src")],Tt.prototype,"handleSrcChange",1);Tt.define("sl-include");ke.define("sl-icon-button");var Gt=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.value=0,this.unit="byte",this.display="short"}render(){if(isNaN(this.value))return"";const t=["","kilo","mega","giga","tera"],e=["","kilo","mega","giga","tera","peta"],s=this.unit==="bit"?t:e,r=Math.max(0,Math.min(Math.floor(Math.log10(this.value)/3),s.length-1)),o=s[r]+this.unit,n=parseFloat((this.value/Math.pow(1e3,r)).toPrecision(3));return this.localize.number(n,{style:"unit",unit:o,unitDisplay:this.display})}};i([a({type:Number})],Gt.prototype,"value",2);i([a()],Gt.prototype,"unit",2);i([a()],Gt.prototype,"display",2);Gt.define("sl-format-bytes");var at=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.date=new Date,this.hourFormat="auto"}render(){const t=new Date(this.date),e=this.hourFormat==="auto"?void 0:this.hourFormat==="12";if(!isNaN(t.getMilliseconds()))return _`
|
|
1927
|
-
<time datetime=${t.toISOString()}>
|
|
1928
|
-
${this.localize.date(t,{weekday:this.weekday,era:this.era,year:this.year,month:this.month,day:this.day,hour:this.hour,minute:this.minute,second:this.second,timeZoneName:this.timeZoneName,timeZone:this.timeZone,hour12:e})}
|
|
1929
|
-
</time>
|
|
1930
|
-
`}};i([a()],at.prototype,"date",2);i([a()],at.prototype,"weekday",2);i([a()],at.prototype,"era",2);i([a()],at.prototype,"year",2);i([a()],at.prototype,"month",2);i([a()],at.prototype,"day",2);i([a()],at.prototype,"hour",2);i([a()],at.prototype,"minute",2);i([a()],at.prototype,"second",2);i([a({attribute:"time-zone-name"})],at.prototype,"timeZoneName",2);i([a({attribute:"time-zone"})],at.prototype,"timeZone",2);i([a({attribute:"hour-format"})],at.prototype,"hourFormat",2);at.define("sl-format-date");var ut=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.value=0,this.type="decimal",this.noGrouping=!1,this.currency="USD",this.currencyDisplay="symbol"}render(){return isNaN(this.value)?"":this.localize.number(this.value,{style:this.type,currency:this.currency,currencyDisplay:this.currencyDisplay,useGrouping:!this.noGrouping,minimumIntegerDigits:this.minimumIntegerDigits,minimumFractionDigits:this.minimumFractionDigits,maximumFractionDigits:this.maximumFractionDigits,minimumSignificantDigits:this.minimumSignificantDigits,maximumSignificantDigits:this.maximumSignificantDigits})}};i([a({type:Number})],ut.prototype,"value",2);i([a()],ut.prototype,"type",2);i([a({attribute:"no-grouping",type:Boolean})],ut.prototype,"noGrouping",2);i([a()],ut.prototype,"currency",2);i([a({attribute:"currency-display"})],ut.prototype,"currencyDisplay",2);i([a({attribute:"minimum-integer-digits",type:Number})],ut.prototype,"minimumIntegerDigits",2);i([a({attribute:"minimum-fraction-digits",type:Number})],ut.prototype,"minimumFractionDigits",2);i([a({attribute:"maximum-fraction-digits",type:Number})],ut.prototype,"maximumFractionDigits",2);i([a({attribute:"minimum-significant-digits",type:Number})],ut.prototype,"minimumSignificantDigits",2);i([a({attribute:"maximum-significant-digits",type:Number})],ut.prototype,"maximumSignificantDigits",2);ut.define("sl-format-number");var As=E`
|
|
1931
|
-
:host {
|
|
1932
|
-
--color: var(--sl-panel-border-color);
|
|
1933
|
-
--width: var(--sl-panel-border-width);
|
|
1934
|
-
--spacing: var(--sl-spacing-medium);
|
|
1935
|
-
}
|
|
1936
|
-
|
|
1937
|
-
:host(:not([vertical])) {
|
|
1938
|
-
display: block;
|
|
1939
|
-
border-top: solid var(--width) var(--color);
|
|
1940
|
-
margin: var(--spacing) 0;
|
|
1941
|
-
}
|
|
1942
|
-
|
|
1943
|
-
:host([vertical]) {
|
|
1944
|
-
display: inline-block;
|
|
1945
|
-
height: 100%;
|
|
1946
|
-
border-left: solid var(--width) var(--color);
|
|
1947
|
-
margin: 0 var(--spacing);
|
|
1948
|
-
}
|
|
1949
|
-
`,Wt=class extends A{constructor(){super(...arguments),this.vertical=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","separator")}handleVerticalChange(){this.setAttribute("aria-orientation",this.vertical?"vertical":"horizontal")}};Wt.styles=[I,As];i([a({type:Boolean,reflect:!0})],Wt.prototype,"vertical",2);i([x("vertical")],Wt.prototype,"handleVerticalChange",1);Wt.define("sl-divider");var Ms=E`
|
|
1950
|
-
:host {
|
|
1951
|
-
--size: 25rem;
|
|
1952
|
-
--header-spacing: var(--sl-spacing-large);
|
|
1953
|
-
--body-spacing: var(--sl-spacing-large);
|
|
1954
|
-
--footer-spacing: var(--sl-spacing-large);
|
|
1955
|
-
|
|
1956
|
-
display: contents;
|
|
1957
|
-
}
|
|
1958
|
-
|
|
1959
|
-
.drawer {
|
|
1960
|
-
top: 0;
|
|
1961
|
-
inset-inline-start: 0;
|
|
1962
|
-
width: 100%;
|
|
1963
|
-
height: 100%;
|
|
1964
|
-
pointer-events: none;
|
|
1965
|
-
overflow: hidden;
|
|
1966
|
-
}
|
|
1967
|
-
|
|
1968
|
-
.drawer--contained {
|
|
1969
|
-
position: absolute;
|
|
1970
|
-
z-index: initial;
|
|
1971
|
-
}
|
|
1972
|
-
|
|
1973
|
-
.drawer--fixed {
|
|
1974
|
-
position: fixed;
|
|
1975
|
-
z-index: var(--sl-z-index-drawer);
|
|
1976
|
-
}
|
|
1977
|
-
|
|
1978
|
-
.drawer__panel {
|
|
1979
|
-
position: absolute;
|
|
1980
|
-
display: flex;
|
|
1981
|
-
flex-direction: column;
|
|
1982
|
-
z-index: 2;
|
|
1983
|
-
max-width: 100%;
|
|
1984
|
-
max-height: 100%;
|
|
1985
|
-
background-color: var(--sl-panel-background-color);
|
|
1986
|
-
box-shadow: var(--sl-shadow-x-large);
|
|
1987
|
-
overflow: auto;
|
|
1988
|
-
pointer-events: all;
|
|
1989
|
-
}
|
|
1990
|
-
|
|
1991
|
-
.drawer__panel:focus {
|
|
1992
|
-
outline: none;
|
|
1993
|
-
}
|
|
1994
|
-
|
|
1995
|
-
.drawer--top .drawer__panel {
|
|
1996
|
-
top: 0;
|
|
1997
|
-
inset-inline-end: auto;
|
|
1998
|
-
bottom: auto;
|
|
1999
|
-
inset-inline-start: 0;
|
|
2000
|
-
width: 100%;
|
|
2001
|
-
height: var(--size);
|
|
2002
|
-
}
|
|
2003
|
-
|
|
2004
|
-
.drawer--end .drawer__panel {
|
|
2005
|
-
top: 0;
|
|
2006
|
-
inset-inline-end: 0;
|
|
2007
|
-
bottom: auto;
|
|
2008
|
-
inset-inline-start: auto;
|
|
2009
|
-
width: var(--size);
|
|
2010
|
-
height: 100%;
|
|
2011
|
-
}
|
|
2012
|
-
|
|
2013
|
-
.drawer--bottom .drawer__panel {
|
|
2014
|
-
top: auto;
|
|
2015
|
-
inset-inline-end: auto;
|
|
2016
|
-
bottom: 0;
|
|
2017
|
-
inset-inline-start: 0;
|
|
2018
|
-
width: 100%;
|
|
2019
|
-
height: var(--size);
|
|
2020
|
-
}
|
|
2021
|
-
|
|
2022
|
-
.drawer--start .drawer__panel {
|
|
2023
|
-
top: 0;
|
|
2024
|
-
inset-inline-end: auto;
|
|
2025
|
-
bottom: auto;
|
|
2026
|
-
inset-inline-start: 0;
|
|
2027
|
-
width: var(--size);
|
|
2028
|
-
height: 100%;
|
|
2029
|
-
}
|
|
2030
|
-
|
|
2031
|
-
.drawer__header {
|
|
2032
|
-
display: flex;
|
|
2033
|
-
}
|
|
2034
|
-
|
|
2035
|
-
.drawer__title {
|
|
2036
|
-
flex: 1 1 auto;
|
|
2037
|
-
font: inherit;
|
|
2038
|
-
font-size: var(--sl-font-size-large);
|
|
2039
|
-
line-height: var(--sl-line-height-dense);
|
|
2040
|
-
padding: var(--header-spacing);
|
|
2041
|
-
margin: 0;
|
|
2042
|
-
}
|
|
2043
|
-
|
|
2044
|
-
.drawer__header-actions {
|
|
2045
|
-
flex-shrink: 0;
|
|
2046
|
-
display: flex;
|
|
2047
|
-
flex-wrap: wrap;
|
|
2048
|
-
justify-content: end;
|
|
2049
|
-
gap: var(--sl-spacing-2x-small);
|
|
2050
|
-
padding: 0 var(--header-spacing);
|
|
2051
|
-
}
|
|
2052
|
-
|
|
2053
|
-
.drawer__header-actions sl-icon-button,
|
|
2054
|
-
.drawer__header-actions ::slotted(sl-icon-button) {
|
|
2055
|
-
flex: 0 0 auto;
|
|
2056
|
-
display: flex;
|
|
2057
|
-
align-items: center;
|
|
2058
|
-
font-size: var(--sl-font-size-medium);
|
|
2059
|
-
}
|
|
2060
|
-
|
|
2061
|
-
.drawer__body {
|
|
2062
|
-
flex: 1 1 auto;
|
|
2063
|
-
display: block;
|
|
2064
|
-
padding: var(--body-spacing);
|
|
2065
|
-
overflow: auto;
|
|
2066
|
-
-webkit-overflow-scrolling: touch;
|
|
2067
|
-
}
|
|
2068
|
-
|
|
2069
|
-
.drawer__footer {
|
|
2070
|
-
text-align: right;
|
|
2071
|
-
padding: var(--footer-spacing);
|
|
2072
|
-
}
|
|
2073
|
-
|
|
2074
|
-
.drawer__footer ::slotted(sl-button:not(:last-of-type)) {
|
|
2075
|
-
margin-inline-end: var(--sl-spacing-x-small);
|
|
2076
|
-
}
|
|
2077
|
-
|
|
2078
|
-
.drawer:not(.drawer--has-footer) .drawer__footer {
|
|
2079
|
-
display: none;
|
|
2080
|
-
}
|
|
2081
|
-
|
|
2082
|
-
.drawer__overlay {
|
|
2083
|
-
display: block;
|
|
2084
|
-
position: fixed;
|
|
2085
|
-
top: 0;
|
|
2086
|
-
right: 0;
|
|
2087
|
-
bottom: 0;
|
|
2088
|
-
left: 0;
|
|
2089
|
-
background-color: var(--sl-overlay-background-color);
|
|
2090
|
-
pointer-events: all;
|
|
2091
|
-
}
|
|
2092
|
-
|
|
2093
|
-
.drawer--contained .drawer__overlay {
|
|
2094
|
-
display: none;
|
|
2095
|
-
}
|
|
2096
|
-
|
|
2097
|
-
@media (forced-colors: active) {
|
|
2098
|
-
.drawer__panel {
|
|
2099
|
-
border: solid 1px var(--sl-color-neutral-0);
|
|
2100
|
-
}
|
|
2101
|
-
}
|
|
2102
|
-
`;function ue(t){return t.charAt(0).toUpperCase()+t.slice(1)}var nt=class extends A{constructor(){super(...arguments),this.hasSlotController=new $t(this,"footer"),this.localize=new K(this),this.modal=new Xe(this),this.open=!1,this.label="",this.placement="end",this.contained=!1,this.noHeader=!1,this.handleDocumentKeyDown=t=>{this.contained||t.key==="Escape"&&this.modal.isActive()&&this.open&&(t.stopImmediatePropagation(),this.requestClose("keyboard"))}}firstUpdated(){this.drawer.hidden=!this.open,this.open&&(this.addOpenListeners(),this.contained||(this.modal.activate(),Qt(this)))}disconnectedCallback(){super.disconnectedCallback(),Zt(this),this.removeOpenListeners()}requestClose(t){if(this.emit("sl-request-close",{cancelable:!0,detail:{source:t}}).defaultPrevented){const s=it(this,"drawer.denyClose",{dir:this.localize.dir()});ct(this.panel,s.keyframes,s.options);return}this.hide()}addOpenListeners(){var t;"CloseWatcher"in window?((t=this.closeWatcher)==null||t.destroy(),this.contained||(this.closeWatcher=new CloseWatcher,this.closeWatcher.onclose=()=>this.requestClose("keyboard"))):document.addEventListener("keydown",this.handleDocumentKeyDown)}removeOpenListeners(){var t;document.removeEventListener("keydown",this.handleDocumentKeyDown),(t=this.closeWatcher)==null||t.destroy()}async handleOpenChange(){if(this.open){this.emit("sl-show"),this.addOpenListeners(),this.originalTrigger=document.activeElement,this.contained||(this.modal.activate(),Qt(this));const t=this.querySelector("[autofocus]");t&&t.removeAttribute("autofocus"),await Promise.all([gt(this.drawer),gt(this.overlay)]),this.drawer.hidden=!1,requestAnimationFrame(()=>{this.emit("sl-initial-focus",{cancelable:!0}).defaultPrevented||(t?t.focus({preventScroll:!0}):this.panel.focus({preventScroll:!0})),t&&t.setAttribute("autofocus","")});const e=it(this,`drawer.show${ue(this.placement)}`,{dir:this.localize.dir()}),s=it(this,"drawer.overlay.show",{dir:this.localize.dir()});await Promise.all([ct(this.panel,e.keyframes,e.options),ct(this.overlay,s.keyframes,s.options)]),this.emit("sl-after-show")}else{Ye(this),this.emit("sl-hide"),this.removeOpenListeners(),this.contained||(this.modal.deactivate(),Zt(this)),await Promise.all([gt(this.drawer),gt(this.overlay)]);const t=it(this,`drawer.hide${ue(this.placement)}`,{dir:this.localize.dir()}),e=it(this,"drawer.overlay.hide",{dir:this.localize.dir()});await Promise.all([ct(this.overlay,e.keyframes,e.options).then(()=>{this.overlay.hidden=!0}),ct(this.panel,t.keyframes,t.options).then(()=>{this.panel.hidden=!0})]),this.drawer.hidden=!0,this.overlay.hidden=!1,this.panel.hidden=!1;const s=this.originalTrigger;typeof s?.focus=="function"&&setTimeout(()=>s.focus()),this.emit("sl-after-hide")}}handleNoModalChange(){this.open&&!this.contained&&(this.modal.activate(),Qt(this)),this.open&&this.contained&&(this.modal.deactivate(),Zt(this))}async show(){if(!this.open)return this.open=!0,wt(this,"sl-after-show")}async hide(){if(this.open)return this.open=!1,wt(this,"sl-after-hide")}render(){return _`
|
|
2103
|
-
<div
|
|
2104
|
-
part="base"
|
|
2105
|
-
class=${P({drawer:!0,"drawer--open":this.open,"drawer--top":this.placement==="top","drawer--end":this.placement==="end","drawer--bottom":this.placement==="bottom","drawer--start":this.placement==="start","drawer--contained":this.contained,"drawer--fixed":!this.contained,"drawer--rtl":this.localize.dir()==="rtl","drawer--has-footer":this.hasSlotController.test("footer")})}
|
|
2106
|
-
>
|
|
2107
|
-
<div part="overlay" class="drawer__overlay" @click=${()=>this.requestClose("overlay")} tabindex="-1"></div>
|
|
2108
|
-
|
|
2109
|
-
<div
|
|
2110
|
-
part="panel"
|
|
2111
|
-
class="drawer__panel"
|
|
2112
|
-
role="dialog"
|
|
2113
|
-
aria-modal="true"
|
|
2114
|
-
aria-hidden=${this.open?"false":"true"}
|
|
2115
|
-
aria-label=${F(this.noHeader?this.label:void 0)}
|
|
2116
|
-
aria-labelledby=${F(this.noHeader?void 0:"title")}
|
|
2117
|
-
tabindex="0"
|
|
2118
|
-
>
|
|
2119
|
-
${this.noHeader?"":_`
|
|
2120
|
-
<header part="header" class="drawer__header">
|
|
2121
|
-
<h2 part="title" class="drawer__title" id="title">
|
|
2122
|
-
<!-- If there's no label, use an invisible character to prevent the header from collapsing -->
|
|
2123
|
-
<slot name="label"> ${this.label.length>0?this.label:"\uFEFF"} </slot>
|
|
2124
|
-
</h2>
|
|
2125
|
-
<div part="header-actions" class="drawer__header-actions">
|
|
2126
|
-
<slot name="header-actions"></slot>
|
|
2127
|
-
<sl-icon-button
|
|
2128
|
-
part="close-button"
|
|
2129
|
-
exportparts="base:close-button__base"
|
|
2130
|
-
class="drawer__close"
|
|
2131
|
-
name="x-lg"
|
|
2132
|
-
label=${this.localize.term("close")}
|
|
2133
|
-
library="system"
|
|
2134
|
-
@click=${()=>this.requestClose("close-button")}
|
|
2135
|
-
></sl-icon-button>
|
|
2136
|
-
</div>
|
|
2137
|
-
</header>
|
|
2138
|
-
`}
|
|
2139
|
-
|
|
2140
|
-
<slot part="body" class="drawer__body"></slot>
|
|
2141
|
-
|
|
2142
|
-
<footer part="footer" class="drawer__footer">
|
|
2143
|
-
<slot name="footer"></slot>
|
|
2144
|
-
</footer>
|
|
2145
|
-
</div>
|
|
2146
|
-
</div>
|
|
2147
|
-
`}};nt.styles=[I,Ms];nt.dependencies={"sl-icon-button":ke};i([$(".drawer")],nt.prototype,"drawer",2);i([$(".drawer__panel")],nt.prototype,"panel",2);i([$(".drawer__overlay")],nt.prototype,"overlay",2);i([a({type:Boolean,reflect:!0})],nt.prototype,"open",2);i([a({reflect:!0})],nt.prototype,"label",2);i([a({reflect:!0})],nt.prototype,"placement",2);i([a({type:Boolean,reflect:!0})],nt.prototype,"contained",2);i([a({attribute:"no-header",type:Boolean,reflect:!0})],nt.prototype,"noHeader",2);i([x("open",{waitUntilFirstUpdate:!0})],nt.prototype,"handleOpenChange",1);i([x("contained",{waitUntilFirstUpdate:!0})],nt.prototype,"handleNoModalChange",1);X("drawer.showTop",{keyframes:[{opacity:0,translate:"0 -100%"},{opacity:1,translate:"0 0"}],options:{duration:250,easing:"ease"}});X("drawer.hideTop",{keyframes:[{opacity:1,translate:"0 0"},{opacity:0,translate:"0 -100%"}],options:{duration:250,easing:"ease"}});X("drawer.showEnd",{keyframes:[{opacity:0,translate:"100%"},{opacity:1,translate:"0"}],rtlKeyframes:[{opacity:0,translate:"-100%"},{opacity:1,translate:"0"}],options:{duration:250,easing:"ease"}});X("drawer.hideEnd",{keyframes:[{opacity:1,translate:"0"},{opacity:0,translate:"100%"}],rtlKeyframes:[{opacity:1,translate:"0"},{opacity:0,translate:"-100%"}],options:{duration:250,easing:"ease"}});X("drawer.showBottom",{keyframes:[{opacity:0,translate:"0 100%"},{opacity:1,translate:"0 0"}],options:{duration:250,easing:"ease"}});X("drawer.hideBottom",{keyframes:[{opacity:1,translate:"0 0"},{opacity:0,translate:"0 100%"}],options:{duration:250,easing:"ease"}});X("drawer.showStart",{keyframes:[{opacity:0,translate:"-100%"},{opacity:1,translate:"0"}],rtlKeyframes:[{opacity:0,translate:"100%"},{opacity:1,translate:"0"}],options:{duration:250,easing:"ease"}});X("drawer.hideStart",{keyframes:[{opacity:1,translate:"0"},{opacity:0,translate:"-100%"}],rtlKeyframes:[{opacity:1,translate:"0"},{opacity:0,translate:"100%"}],options:{duration:250,easing:"ease"}});X("drawer.denyClose",{keyframes:[{scale:1},{scale:1.01},{scale:1}],options:{duration:250}});X("drawer.overlay.show",{keyframes:[{opacity:0},{opacity:1}],options:{duration:250}});X("drawer.overlay.hide",{keyframes:[{opacity:1},{opacity:0}],options:{duration:250}});nt.define("sl-drawer");var Ts=E`
|
|
2148
|
-
:host {
|
|
2149
|
-
display: inline-block;
|
|
2150
|
-
}
|
|
2151
|
-
|
|
2152
|
-
.dropdown::part(popup) {
|
|
2153
|
-
z-index: var(--sl-z-index-dropdown);
|
|
2154
|
-
}
|
|
2155
|
-
|
|
2156
|
-
.dropdown[data-current-placement^='top']::part(popup) {
|
|
2157
|
-
transform-origin: bottom;
|
|
2158
|
-
}
|
|
2159
|
-
|
|
2160
|
-
.dropdown[data-current-placement^='bottom']::part(popup) {
|
|
2161
|
-
transform-origin: top;
|
|
2162
|
-
}
|
|
2163
|
-
|
|
2164
|
-
.dropdown[data-current-placement^='left']::part(popup) {
|
|
2165
|
-
transform-origin: right;
|
|
2166
|
-
}
|
|
2167
|
-
|
|
2168
|
-
.dropdown[data-current-placement^='right']::part(popup) {
|
|
2169
|
-
transform-origin: left;
|
|
2170
|
-
}
|
|
2171
|
-
|
|
2172
|
-
.dropdown__trigger {
|
|
2173
|
-
display: block;
|
|
2174
|
-
}
|
|
2175
|
-
|
|
2176
|
-
.dropdown__panel {
|
|
2177
|
-
font-family: var(--sl-font-sans);
|
|
2178
|
-
font-size: var(--sl-font-size-medium);
|
|
2179
|
-
font-weight: var(--sl-font-weight-normal);
|
|
2180
|
-
box-shadow: var(--sl-shadow-large);
|
|
2181
|
-
border-radius: var(--sl-border-radius-medium);
|
|
2182
|
-
pointer-events: none;
|
|
2183
|
-
}
|
|
2184
|
-
|
|
2185
|
-
.dropdown--open .dropdown__panel {
|
|
2186
|
-
display: block;
|
|
2187
|
-
pointer-events: all;
|
|
2188
|
-
}
|
|
2189
|
-
|
|
2190
|
-
/* When users slot a menu, make sure it conforms to the popup's auto-size */
|
|
2191
|
-
::slotted(sl-menu) {
|
|
2192
|
-
max-width: var(--auto-size-available-width) !important;
|
|
2193
|
-
max-height: var(--auto-size-available-height) !important;
|
|
2194
|
-
}
|
|
2195
|
-
`,Q=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.open=!1,this.placement="bottom-start",this.disabled=!1,this.stayOpenOnSelect=!1,this.distance=0,this.skidding=0,this.hoist=!1,this.sync=void 0,this.handleKeyDown=t=>{this.open&&t.key==="Escape"&&(t.stopPropagation(),this.hide(),this.focusOnTrigger())},this.handleDocumentKeyDown=t=>{var e;if(t.key==="Escape"&&this.open&&!this.closeWatcher){t.stopPropagation(),this.focusOnTrigger(),this.hide();return}if(t.key==="Tab"){if(this.open&&((e=document.activeElement)==null?void 0:e.tagName.toLowerCase())==="sl-menu-item"){t.preventDefault(),this.hide(),this.focusOnTrigger();return}const s=(r,o)=>{if(!r)return null;const n=r.closest(o);if(n)return n;const h=r.getRootNode();return h instanceof ShadowRoot?s(h.host,o):null};setTimeout(()=>{var r;const o=((r=this.containingElement)==null?void 0:r.getRootNode())instanceof ShadowRoot?Ke():document.activeElement;(!this.containingElement||s(o,this.containingElement.tagName.toLowerCase())!==this.containingElement)&&this.hide()})}},this.handleDocumentMouseDown=t=>{const e=t.composedPath();this.containingElement&&!e.includes(this.containingElement)&&this.hide()},this.handlePanelSelect=t=>{const e=t.target;!this.stayOpenOnSelect&&e.tagName.toLowerCase()==="sl-menu"&&(this.hide(),this.focusOnTrigger())}}connectedCallback(){super.connectedCallback(),this.containingElement||(this.containingElement=this)}firstUpdated(){this.panel.hidden=!this.open,this.open&&(this.addOpenListeners(),this.popup.active=!0)}disconnectedCallback(){super.disconnectedCallback(),this.removeOpenListeners(),this.hide()}focusOnTrigger(){const t=this.trigger.assignedElements({flatten:!0})[0];typeof t?.focus=="function"&&t.focus()}getMenu(){return this.panel.assignedElements({flatten:!0}).find(t=>t.tagName.toLowerCase()==="sl-menu")}handleTriggerClick(){this.open?this.hide():(this.show(),this.focusOnTrigger())}async handleTriggerKeyDown(t){if([" ","Enter"].includes(t.key)){t.preventDefault(),this.handleTriggerClick();return}const e=this.getMenu();if(e){const s=e.getAllItems(),r=s[0],o=s[s.length-1];["ArrowDown","ArrowUp","Home","End"].includes(t.key)&&(t.preventDefault(),this.open||(this.show(),await this.updateComplete),s.length>0&&this.updateComplete.then(()=>{(t.key==="ArrowDown"||t.key==="Home")&&(e.setCurrentItem(r),r.focus()),(t.key==="ArrowUp"||t.key==="End")&&(e.setCurrentItem(o),o.focus())}))}}handleTriggerKeyUp(t){t.key===" "&&t.preventDefault()}handleTriggerSlotChange(){this.updateAccessibleTrigger()}updateAccessibleTrigger(){const e=this.trigger.assignedElements({flatten:!0}).find(r=>qe(r).start);let s;if(e){switch(e.tagName.toLowerCase()){case"sl-button":case"sl-icon-button":s=e.button;break;default:s=e}s.setAttribute("aria-haspopup","true"),s.setAttribute("aria-expanded",this.open?"true":"false")}}async show(){if(!this.open)return this.open=!0,wt(this,"sl-after-show")}async hide(){if(this.open)return this.open=!1,wt(this,"sl-after-hide")}reposition(){this.popup.reposition()}addOpenListeners(){var t;this.panel.addEventListener("sl-select",this.handlePanelSelect),"CloseWatcher"in window?((t=this.closeWatcher)==null||t.destroy(),this.closeWatcher=new CloseWatcher,this.closeWatcher.onclose=()=>{this.hide(),this.focusOnTrigger()}):this.panel.addEventListener("keydown",this.handleKeyDown),document.addEventListener("keydown",this.handleDocumentKeyDown),document.addEventListener("mousedown",this.handleDocumentMouseDown)}removeOpenListeners(){var t;this.panel&&(this.panel.removeEventListener("sl-select",this.handlePanelSelect),this.panel.removeEventListener("keydown",this.handleKeyDown)),document.removeEventListener("keydown",this.handleDocumentKeyDown),document.removeEventListener("mousedown",this.handleDocumentMouseDown),(t=this.closeWatcher)==null||t.destroy()}async handleOpenChange(){if(this.disabled){this.open=!1;return}if(this.updateAccessibleTrigger(),this.open){this.emit("sl-show"),this.addOpenListeners(),await gt(this),this.panel.hidden=!1,this.popup.active=!0;const{keyframes:t,options:e}=it(this,"dropdown.show",{dir:this.localize.dir()});await ct(this.popup.popup,t,e),this.emit("sl-after-show")}else{this.emit("sl-hide"),this.removeOpenListeners(),await gt(this);const{keyframes:t,options:e}=it(this,"dropdown.hide",{dir:this.localize.dir()});await ct(this.popup.popup,t,e),this.panel.hidden=!0,this.popup.active=!1,this.emit("sl-after-hide")}}render(){return _`
|
|
2196
|
-
<sl-popup
|
|
2197
|
-
part="base"
|
|
2198
|
-
exportparts="popup:base__popup"
|
|
2199
|
-
id="dropdown"
|
|
2200
|
-
placement=${this.placement}
|
|
2201
|
-
distance=${this.distance}
|
|
2202
|
-
skidding=${this.skidding}
|
|
2203
|
-
strategy=${this.hoist?"fixed":"absolute"}
|
|
2204
|
-
flip
|
|
2205
|
-
shift
|
|
2206
|
-
auto-size="vertical"
|
|
2207
|
-
auto-size-padding="10"
|
|
2208
|
-
sync=${F(this.sync?this.sync:void 0)}
|
|
2209
|
-
class=${P({dropdown:!0,"dropdown--open":this.open})}
|
|
2210
|
-
>
|
|
2211
|
-
<slot
|
|
2212
|
-
name="trigger"
|
|
2213
|
-
slot="anchor"
|
|
2214
|
-
part="trigger"
|
|
2215
|
-
class="dropdown__trigger"
|
|
2216
|
-
@click=${this.handleTriggerClick}
|
|
2217
|
-
@keydown=${this.handleTriggerKeyDown}
|
|
2218
|
-
@keyup=${this.handleTriggerKeyUp}
|
|
2219
|
-
@slotchange=${this.handleTriggerSlotChange}
|
|
2220
|
-
></slot>
|
|
2221
|
-
|
|
2222
|
-
<div aria-hidden=${this.open?"false":"true"} aria-labelledby="dropdown">
|
|
2223
|
-
<slot part="panel" class="dropdown__panel"></slot>
|
|
2224
|
-
</div>
|
|
2225
|
-
</sl-popup>
|
|
2226
|
-
`}};Q.styles=[I,Ts];Q.dependencies={"sl-popup":Xt};i([$(".dropdown")],Q.prototype,"popup",2);i([$(".dropdown__trigger")],Q.prototype,"trigger",2);i([$(".dropdown__panel")],Q.prototype,"panel",2);i([a({type:Boolean,reflect:!0})],Q.prototype,"open",2);i([a({reflect:!0})],Q.prototype,"placement",2);i([a({type:Boolean,reflect:!0})],Q.prototype,"disabled",2);i([a({attribute:"stay-open-on-select",type:Boolean,reflect:!0})],Q.prototype,"stayOpenOnSelect",2);i([a({attribute:!1})],Q.prototype,"containingElement",2);i([a({type:Number})],Q.prototype,"distance",2);i([a({type:Number})],Q.prototype,"skidding",2);i([a({type:Boolean})],Q.prototype,"hoist",2);i([a({reflect:!0})],Q.prototype,"sync",2);i([x("open",{waitUntilFirstUpdate:!0})],Q.prototype,"handleOpenChange",1);X("dropdown.show",{keyframes:[{opacity:0,scale:.9},{opacity:1,scale:1}],options:{duration:100,easing:"ease"}});X("dropdown.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.9}],options:{duration:100,easing:"ease"}});Q.define("sl-dropdown");var Ds=E`
|
|
2227
|
-
:host {
|
|
2228
|
-
--error-color: var(--sl-color-danger-600);
|
|
2229
|
-
--success-color: var(--sl-color-success-600);
|
|
2230
|
-
|
|
2231
|
-
display: inline-block;
|
|
2232
|
-
}
|
|
2233
|
-
|
|
2234
|
-
.copy-button__button {
|
|
2235
|
-
flex: 0 0 auto;
|
|
2236
|
-
display: flex;
|
|
2237
|
-
align-items: center;
|
|
2238
|
-
background: none;
|
|
2239
|
-
border: none;
|
|
2240
|
-
border-radius: var(--sl-border-radius-medium);
|
|
2241
|
-
font-size: inherit;
|
|
2242
|
-
color: inherit;
|
|
2243
|
-
padding: var(--sl-spacing-x-small);
|
|
2244
|
-
cursor: pointer;
|
|
2245
|
-
transition: var(--sl-transition-x-fast) color;
|
|
2246
|
-
}
|
|
2247
|
-
|
|
2248
|
-
.copy-button--success .copy-button__button {
|
|
2249
|
-
color: var(--success-color);
|
|
2250
|
-
}
|
|
2251
|
-
|
|
2252
|
-
.copy-button--error .copy-button__button {
|
|
2253
|
-
color: var(--error-color);
|
|
2254
|
-
}
|
|
2255
|
-
|
|
2256
|
-
.copy-button__button:focus-visible {
|
|
2257
|
-
outline: var(--sl-focus-ring);
|
|
2258
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
2259
|
-
}
|
|
2260
|
-
|
|
2261
|
-
.copy-button__button[disabled] {
|
|
2262
|
-
opacity: 0.5;
|
|
2263
|
-
cursor: not-allowed !important;
|
|
2264
|
-
}
|
|
2265
|
-
|
|
2266
|
-
slot {
|
|
2267
|
-
display: inline-flex;
|
|
2268
|
-
}
|
|
2269
|
-
`,Y=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.isCopying=!1,this.status="rest",this.value="",this.from="",this.disabled=!1,this.copyLabel="",this.successLabel="",this.errorLabel="",this.feedbackDuration=1e3,this.tooltipPlacement="top",this.hoist=!1}async handleCopy(){if(this.disabled||this.isCopying)return;this.isCopying=!0;let t=this.value;if(this.from){const e=this.getRootNode(),s=this.from.includes("."),r=this.from.includes("[")&&this.from.includes("]");let o=this.from,n="";s?[o,n]=this.from.trim().split("."):r&&([o,n]=this.from.trim().replace(/\]$/,"").split("["));const h="getElementById"in e?e.getElementById(o):null;h?r?t=h.getAttribute(n)||"":s?t=h[n]||"":t=h.textContent||"":(this.showStatus("error"),this.emit("sl-error"))}if(!t)this.showStatus("error"),this.emit("sl-error");else try{await navigator.clipboard.writeText(t),this.showStatus("success"),this.emit("sl-copy",{detail:{value:t}})}catch{this.showStatus("error"),this.emit("sl-error")}}async showStatus(t){const e=this.copyLabel||this.localize.term("copy"),s=this.successLabel||this.localize.term("copied"),r=this.errorLabel||this.localize.term("error"),o=t==="success"?this.successIcon:this.errorIcon,n=it(this,"copy.in",{dir:"ltr"}),h=it(this,"copy.out",{dir:"ltr"});this.tooltip.content=t==="success"?s:r,await this.copyIcon.animate(h.keyframes,h.options).finished,this.copyIcon.hidden=!0,this.status=t,o.hidden=!1,await o.animate(n.keyframes,n.options).finished,setTimeout(async()=>{await o.animate(h.keyframes,h.options).finished,o.hidden=!0,this.status="rest",this.copyIcon.hidden=!1,await this.copyIcon.animate(n.keyframes,n.options).finished,this.tooltip.content=e,this.isCopying=!1},this.feedbackDuration)}render(){const t=this.copyLabel||this.localize.term("copy");return _`
|
|
2270
|
-
<sl-tooltip
|
|
2271
|
-
class=${P({"copy-button":!0,"copy-button--success":this.status==="success","copy-button--error":this.status==="error"})}
|
|
2272
|
-
content=${t}
|
|
2273
|
-
placement=${this.tooltipPlacement}
|
|
2274
|
-
?disabled=${this.disabled}
|
|
2275
|
-
?hoist=${this.hoist}
|
|
2276
|
-
exportparts="
|
|
2277
|
-
base:tooltip__base,
|
|
2278
|
-
base__popup:tooltip__base__popup,
|
|
2279
|
-
base__arrow:tooltip__base__arrow,
|
|
2280
|
-
body:tooltip__body
|
|
2281
|
-
"
|
|
2282
|
-
>
|
|
2283
|
-
<button
|
|
2284
|
-
class="copy-button__button"
|
|
2285
|
-
part="button"
|
|
2286
|
-
type="button"
|
|
2287
|
-
?disabled=${this.disabled}
|
|
2288
|
-
@click=${this.handleCopy}
|
|
2289
|
-
>
|
|
2290
|
-
<slot part="copy-icon" name="copy-icon">
|
|
2291
|
-
<sl-icon library="system" name="copy"></sl-icon>
|
|
2292
|
-
</slot>
|
|
2293
|
-
<slot part="success-icon" name="success-icon" hidden>
|
|
2294
|
-
<sl-icon library="system" name="check"></sl-icon>
|
|
2295
|
-
</slot>
|
|
2296
|
-
<slot part="error-icon" name="error-icon" hidden>
|
|
2297
|
-
<sl-icon library="system" name="x-lg"></sl-icon>
|
|
2298
|
-
</slot>
|
|
2299
|
-
</button>
|
|
2300
|
-
</sl-tooltip>
|
|
2301
|
-
`}};Y.styles=[I,Ds];Y.dependencies={"sl-icon":_t,"sl-tooltip":q};i([$('slot[name="copy-icon"]')],Y.prototype,"copyIcon",2);i([$('slot[name="success-icon"]')],Y.prototype,"successIcon",2);i([$('slot[name="error-icon"]')],Y.prototype,"errorIcon",2);i([$("sl-tooltip")],Y.prototype,"tooltip",2);i([L()],Y.prototype,"isCopying",2);i([L()],Y.prototype,"status",2);i([a()],Y.prototype,"value",2);i([a()],Y.prototype,"from",2);i([a({type:Boolean,reflect:!0})],Y.prototype,"disabled",2);i([a({attribute:"copy-label"})],Y.prototype,"copyLabel",2);i([a({attribute:"success-label"})],Y.prototype,"successLabel",2);i([a({attribute:"error-label"})],Y.prototype,"errorLabel",2);i([a({attribute:"feedback-duration",type:Number})],Y.prototype,"feedbackDuration",2);i([a({attribute:"tooltip-placement"})],Y.prototype,"tooltipPlacement",2);i([a({type:Boolean})],Y.prototype,"hoist",2);X("copy.in",{keyframes:[{scale:".25",opacity:".25"},{scale:"1",opacity:"1"}],options:{duration:100}});X("copy.out",{keyframes:[{scale:"1",opacity:"1"},{scale:".25",opacity:"0"}],options:{duration:100}});Y.define("sl-copy-button");var Es=E`
|
|
2302
|
-
:host {
|
|
2303
|
-
display: block;
|
|
2304
|
-
}
|
|
2305
|
-
|
|
2306
|
-
.details {
|
|
2307
|
-
border: solid 1px var(--sl-color-neutral-200);
|
|
2308
|
-
border-radius: var(--sl-border-radius-medium);
|
|
2309
|
-
background-color: var(--sl-color-neutral-0);
|
|
2310
|
-
overflow-anchor: none;
|
|
2311
|
-
}
|
|
2312
|
-
|
|
2313
|
-
.details--disabled {
|
|
2314
|
-
opacity: 0.5;
|
|
2315
|
-
}
|
|
2316
|
-
|
|
2317
|
-
.details__header {
|
|
2318
|
-
display: flex;
|
|
2319
|
-
align-items: center;
|
|
2320
|
-
border-radius: inherit;
|
|
2321
|
-
padding: var(--sl-spacing-medium);
|
|
2322
|
-
user-select: none;
|
|
2323
|
-
-webkit-user-select: none;
|
|
2324
|
-
cursor: pointer;
|
|
2325
|
-
}
|
|
2326
|
-
|
|
2327
|
-
.details__header::-webkit-details-marker {
|
|
2328
|
-
display: none;
|
|
2329
|
-
}
|
|
2330
|
-
|
|
2331
|
-
.details__header:focus {
|
|
2332
|
-
outline: none;
|
|
2333
|
-
}
|
|
2334
|
-
|
|
2335
|
-
.details__header:focus-visible {
|
|
2336
|
-
outline: var(--sl-focus-ring);
|
|
2337
|
-
outline-offset: calc(1px + var(--sl-focus-ring-offset));
|
|
2338
|
-
}
|
|
2339
|
-
|
|
2340
|
-
.details--disabled .details__header {
|
|
2341
|
-
cursor: not-allowed;
|
|
2342
|
-
}
|
|
2343
|
-
|
|
2344
|
-
.details--disabled .details__header:focus-visible {
|
|
2345
|
-
outline: none;
|
|
2346
|
-
box-shadow: none;
|
|
2347
|
-
}
|
|
2348
|
-
|
|
2349
|
-
.details__summary {
|
|
2350
|
-
flex: 1 1 auto;
|
|
2351
|
-
display: flex;
|
|
2352
|
-
align-items: center;
|
|
2353
|
-
}
|
|
2354
|
-
|
|
2355
|
-
.details__summary-icon {
|
|
2356
|
-
flex: 0 0 auto;
|
|
2357
|
-
display: flex;
|
|
2358
|
-
align-items: center;
|
|
2359
|
-
transition: var(--sl-transition-medium) rotate ease;
|
|
2360
|
-
}
|
|
2361
|
-
|
|
2362
|
-
.details--open .details__summary-icon {
|
|
2363
|
-
rotate: 90deg;
|
|
2364
|
-
}
|
|
2365
|
-
|
|
2366
|
-
.details--open.details--rtl .details__summary-icon {
|
|
2367
|
-
rotate: -90deg;
|
|
2368
|
-
}
|
|
2369
|
-
|
|
2370
|
-
.details--open slot[name='expand-icon'],
|
|
2371
|
-
.details:not(.details--open) slot[name='collapse-icon'] {
|
|
2372
|
-
display: none;
|
|
2373
|
-
}
|
|
2374
|
-
|
|
2375
|
-
.details__body {
|
|
2376
|
-
overflow: hidden;
|
|
2377
|
-
}
|
|
2378
|
-
|
|
2379
|
-
.details__content {
|
|
2380
|
-
display: block;
|
|
2381
|
-
padding: var(--sl-spacing-medium);
|
|
2382
|
-
}
|
|
2383
|
-
`,pt=class extends A{constructor(){super(...arguments),this.localize=new K(this),this.open=!1,this.disabled=!1}firstUpdated(){this.body.style.height=this.open?"auto":"0",this.open&&(this.details.open=!0),this.detailsObserver=new MutationObserver(t=>{for(const e of t)e.type==="attributes"&&e.attributeName==="open"&&(this.details.open?this.show():this.hide())}),this.detailsObserver.observe(this.details,{attributes:!0})}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.detailsObserver)==null||t.disconnect()}handleSummaryClick(t){t.preventDefault(),this.disabled||(this.open?this.hide():this.show(),this.header.focus())}handleSummaryKeyDown(t){(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),this.open?this.hide():this.show()),(t.key==="ArrowUp"||t.key==="ArrowLeft")&&(t.preventDefault(),this.hide()),(t.key==="ArrowDown"||t.key==="ArrowRight")&&(t.preventDefault(),this.show())}async handleOpenChange(){if(this.open){if(this.details.open=!0,this.emit("sl-show",{cancelable:!0}).defaultPrevented){this.open=!1,this.details.open=!1;return}await gt(this.body);const{keyframes:e,options:s}=it(this,"details.show",{dir:this.localize.dir()});await ct(this.body,ce(e,this.body.scrollHeight),s),this.body.style.height="auto",this.emit("sl-after-show")}else{if(this.emit("sl-hide",{cancelable:!0}).defaultPrevented){this.details.open=!0,this.open=!0;return}await gt(this.body);const{keyframes:e,options:s}=it(this,"details.hide",{dir:this.localize.dir()});await ct(this.body,ce(e,this.body.scrollHeight),s),this.body.style.height="auto",this.details.open=!1,this.emit("sl-after-hide")}}async show(){if(!(this.open||this.disabled))return this.open=!0,wt(this,"sl-after-show")}async hide(){if(!(!this.open||this.disabled))return this.open=!1,wt(this,"sl-after-hide")}render(){const t=this.localize.dir()==="rtl";return _`
|
|
2384
|
-
<details
|
|
2385
|
-
part="base"
|
|
2386
|
-
class=${P({details:!0,"details--open":this.open,"details--disabled":this.disabled,"details--rtl":t})}
|
|
2387
|
-
>
|
|
2388
|
-
<summary
|
|
2389
|
-
part="header"
|
|
2390
|
-
id="header"
|
|
2391
|
-
class="details__header"
|
|
2392
|
-
role="button"
|
|
2393
|
-
aria-expanded=${this.open?"true":"false"}
|
|
2394
|
-
aria-controls="content"
|
|
2395
|
-
aria-disabled=${this.disabled?"true":"false"}
|
|
2396
|
-
tabindex=${this.disabled?"-1":"0"}
|
|
2397
|
-
@click=${this.handleSummaryClick}
|
|
2398
|
-
@keydown=${this.handleSummaryKeyDown}
|
|
2399
|
-
>
|
|
2400
|
-
<slot name="summary" part="summary" class="details__summary">${this.summary}</slot>
|
|
2401
|
-
|
|
2402
|
-
<span part="summary-icon" class="details__summary-icon">
|
|
2403
|
-
<slot name="expand-icon">
|
|
2404
|
-
<sl-icon library="system" name=${t?"chevron-left":"chevron-right"}></sl-icon>
|
|
2405
|
-
</slot>
|
|
2406
|
-
<slot name="collapse-icon">
|
|
2407
|
-
<sl-icon library="system" name=${t?"chevron-left":"chevron-right"}></sl-icon>
|
|
2408
|
-
</slot>
|
|
2409
|
-
</span>
|
|
2410
|
-
</summary>
|
|
2411
|
-
|
|
2412
|
-
<div class="details__body" role="region" aria-labelledby="header">
|
|
2413
|
-
<slot part="content" id="content" class="details__content"></slot>
|
|
2414
|
-
</div>
|
|
2415
|
-
</details>
|
|
2416
|
-
`}};pt.styles=[I,Es];pt.dependencies={"sl-icon":_t};i([$(".details")],pt.prototype,"details",2);i([$(".details__header")],pt.prototype,"header",2);i([$(".details__body")],pt.prototype,"body",2);i([$(".details__expand-icon-slot")],pt.prototype,"expandIconSlot",2);i([a({type:Boolean,reflect:!0})],pt.prototype,"open",2);i([a()],pt.prototype,"summary",2);i([a({type:Boolean,reflect:!0})],pt.prototype,"disabled",2);i([x("open",{waitUntilFirstUpdate:!0})],pt.prototype,"handleOpenChange",1);X("details.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:250,easing:"linear"}});X("details.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:250,easing:"linear"}});pt.define("sl-details");var Is=E`
|
|
2417
|
-
:host {
|
|
2418
|
-
--grid-width: 280px;
|
|
2419
|
-
--grid-height: 200px;
|
|
2420
|
-
--grid-handle-size: 16px;
|
|
2421
|
-
--slider-height: 15px;
|
|
2422
|
-
--slider-handle-size: 17px;
|
|
2423
|
-
--swatch-size: 25px;
|
|
2424
|
-
|
|
2425
|
-
display: inline-block;
|
|
2426
|
-
}
|
|
2427
|
-
|
|
2428
|
-
.color-picker {
|
|
2429
|
-
width: var(--grid-width);
|
|
2430
|
-
font-family: var(--sl-font-sans);
|
|
2431
|
-
font-size: var(--sl-font-size-medium);
|
|
2432
|
-
font-weight: var(--sl-font-weight-normal);
|
|
2433
|
-
color: var(--color);
|
|
2434
|
-
background-color: var(--sl-panel-background-color);
|
|
2435
|
-
border-radius: var(--sl-border-radius-medium);
|
|
2436
|
-
user-select: none;
|
|
2437
|
-
-webkit-user-select: none;
|
|
2438
|
-
}
|
|
2439
|
-
|
|
2440
|
-
.color-picker--inline {
|
|
2441
|
-
border: solid var(--sl-panel-border-width) var(--sl-panel-border-color);
|
|
2442
|
-
}
|
|
2443
|
-
|
|
2444
|
-
.color-picker--inline:focus-visible {
|
|
2445
|
-
outline: var(--sl-focus-ring);
|
|
2446
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
2447
|
-
}
|
|
2448
|
-
|
|
2449
|
-
.color-picker__grid {
|
|
2450
|
-
position: relative;
|
|
2451
|
-
height: var(--grid-height);
|
|
2452
|
-
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%),
|
|
2453
|
-
linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 100%);
|
|
2454
|
-
border-top-left-radius: var(--sl-border-radius-medium);
|
|
2455
|
-
border-top-right-radius: var(--sl-border-radius-medium);
|
|
2456
|
-
cursor: crosshair;
|
|
2457
|
-
forced-color-adjust: none;
|
|
2458
|
-
}
|
|
2459
|
-
|
|
2460
|
-
.color-picker__grid-handle {
|
|
2461
|
-
position: absolute;
|
|
2462
|
-
width: var(--grid-handle-size);
|
|
2463
|
-
height: var(--grid-handle-size);
|
|
2464
|
-
border-radius: 50%;
|
|
2465
|
-
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
|
|
2466
|
-
border: solid 2px white;
|
|
2467
|
-
margin-top: calc(var(--grid-handle-size) / -2);
|
|
2468
|
-
margin-left: calc(var(--grid-handle-size) / -2);
|
|
2469
|
-
transition: var(--sl-transition-fast) scale;
|
|
2470
|
-
}
|
|
2471
|
-
|
|
2472
|
-
.color-picker__grid-handle--dragging {
|
|
2473
|
-
cursor: none;
|
|
2474
|
-
scale: 1.5;
|
|
2475
|
-
}
|
|
2476
|
-
|
|
2477
|
-
.color-picker__grid-handle:focus-visible {
|
|
2478
|
-
outline: var(--sl-focus-ring);
|
|
2479
|
-
}
|
|
2480
|
-
|
|
2481
|
-
.color-picker__controls {
|
|
2482
|
-
padding: var(--sl-spacing-small);
|
|
2483
|
-
display: flex;
|
|
2484
|
-
align-items: center;
|
|
2485
|
-
}
|
|
2486
|
-
|
|
2487
|
-
.color-picker__sliders {
|
|
2488
|
-
flex: 1 1 auto;
|
|
2489
|
-
}
|
|
2490
|
-
|
|
2491
|
-
.color-picker__slider {
|
|
2492
|
-
position: relative;
|
|
2493
|
-
height: var(--slider-height);
|
|
2494
|
-
border-radius: var(--sl-border-radius-pill);
|
|
2495
|
-
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
|
|
2496
|
-
forced-color-adjust: none;
|
|
2497
|
-
}
|
|
2498
|
-
|
|
2499
|
-
.color-picker__slider:not(:last-of-type) {
|
|
2500
|
-
margin-bottom: var(--sl-spacing-small);
|
|
2501
|
-
}
|
|
2502
|
-
|
|
2503
|
-
.color-picker__slider-handle {
|
|
2504
|
-
position: absolute;
|
|
2505
|
-
top: calc(50% - var(--slider-handle-size) / 2);
|
|
2506
|
-
width: var(--slider-handle-size);
|
|
2507
|
-
height: var(--slider-handle-size);
|
|
2508
|
-
background-color: white;
|
|
2509
|
-
border-radius: 50%;
|
|
2510
|
-
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
|
|
2511
|
-
margin-left: calc(var(--slider-handle-size) / -2);
|
|
2512
|
-
}
|
|
2513
|
-
|
|
2514
|
-
.color-picker__slider-handle:focus-visible {
|
|
2515
|
-
outline: var(--sl-focus-ring);
|
|
2516
|
-
}
|
|
2517
|
-
|
|
2518
|
-
.color-picker__hue {
|
|
2519
|
-
background-image: linear-gradient(
|
|
2520
|
-
to right,
|
|
2521
|
-
rgb(255, 0, 0) 0%,
|
|
2522
|
-
rgb(255, 255, 0) 17%,
|
|
2523
|
-
rgb(0, 255, 0) 33%,
|
|
2524
|
-
rgb(0, 255, 255) 50%,
|
|
2525
|
-
rgb(0, 0, 255) 67%,
|
|
2526
|
-
rgb(255, 0, 255) 83%,
|
|
2527
|
-
rgb(255, 0, 0) 100%
|
|
2528
|
-
);
|
|
2529
|
-
}
|
|
2530
|
-
|
|
2531
|
-
.color-picker__alpha .color-picker__alpha-gradient {
|
|
2532
|
-
position: absolute;
|
|
2533
|
-
top: 0;
|
|
2534
|
-
left: 0;
|
|
2535
|
-
width: 100%;
|
|
2536
|
-
height: 100%;
|
|
2537
|
-
border-radius: inherit;
|
|
2538
|
-
}
|
|
2539
|
-
|
|
2540
|
-
.color-picker__preview {
|
|
2541
|
-
flex: 0 0 auto;
|
|
2542
|
-
display: inline-flex;
|
|
2543
|
-
align-items: center;
|
|
2544
|
-
justify-content: center;
|
|
2545
|
-
position: relative;
|
|
2546
|
-
width: 2.25rem;
|
|
2547
|
-
height: 2.25rem;
|
|
2548
|
-
border: none;
|
|
2549
|
-
border-radius: var(--sl-border-radius-circle);
|
|
2550
|
-
background: none;
|
|
2551
|
-
margin-left: var(--sl-spacing-small);
|
|
2552
|
-
cursor: copy;
|
|
2553
|
-
forced-color-adjust: none;
|
|
2554
|
-
}
|
|
2555
|
-
|
|
2556
|
-
.color-picker__preview:before {
|
|
2557
|
-
content: '';
|
|
2558
|
-
position: absolute;
|
|
2559
|
-
top: 0;
|
|
2560
|
-
left: 0;
|
|
2561
|
-
width: 100%;
|
|
2562
|
-
height: 100%;
|
|
2563
|
-
border-radius: inherit;
|
|
2564
|
-
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
|
|
2565
|
-
|
|
2566
|
-
/* We use a custom property in lieu of currentColor because of https://bugs.webkit.org/show_bug.cgi?id=216780 */
|
|
2567
|
-
background-color: var(--preview-color);
|
|
2568
|
-
}
|
|
2569
|
-
|
|
2570
|
-
.color-picker__preview:focus-visible {
|
|
2571
|
-
outline: var(--sl-focus-ring);
|
|
2572
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
2573
|
-
}
|
|
2574
|
-
|
|
2575
|
-
.color-picker__preview-color {
|
|
2576
|
-
position: absolute;
|
|
2577
|
-
top: 0;
|
|
2578
|
-
left: 0;
|
|
2579
|
-
width: 100%;
|
|
2580
|
-
height: 100%;
|
|
2581
|
-
border: solid 1px rgba(0, 0, 0, 0.125);
|
|
2582
|
-
}
|
|
2583
|
-
|
|
2584
|
-
.color-picker__preview-color--copied {
|
|
2585
|
-
animation: pulse 0.75s;
|
|
2586
|
-
}
|
|
2587
|
-
|
|
2588
|
-
@keyframes pulse {
|
|
2589
|
-
0% {
|
|
2590
|
-
box-shadow: 0 0 0 0 var(--sl-color-primary-500);
|
|
2591
|
-
}
|
|
2592
|
-
70% {
|
|
2593
|
-
box-shadow: 0 0 0 0.5rem transparent;
|
|
2594
|
-
}
|
|
2595
|
-
100% {
|
|
2596
|
-
box-shadow: 0 0 0 0 transparent;
|
|
2597
|
-
}
|
|
2598
|
-
}
|
|
2599
|
-
|
|
2600
|
-
.color-picker__user-input {
|
|
2601
|
-
display: flex;
|
|
2602
|
-
padding: 0 var(--sl-spacing-small) var(--sl-spacing-small) var(--sl-spacing-small);
|
|
2603
|
-
}
|
|
2604
|
-
|
|
2605
|
-
.color-picker__user-input sl-input {
|
|
2606
|
-
min-width: 0; /* fix input width in Safari */
|
|
2607
|
-
flex: 1 1 auto;
|
|
2608
|
-
}
|
|
2609
|
-
|
|
2610
|
-
.color-picker__user-input sl-button-group {
|
|
2611
|
-
margin-left: var(--sl-spacing-small);
|
|
2612
|
-
}
|
|
2613
|
-
|
|
2614
|
-
.color-picker__user-input sl-button {
|
|
2615
|
-
min-width: 3.25rem;
|
|
2616
|
-
max-width: 3.25rem;
|
|
2617
|
-
font-size: 1rem;
|
|
2618
|
-
}
|
|
2619
|
-
|
|
2620
|
-
.color-picker__swatches {
|
|
2621
|
-
display: grid;
|
|
2622
|
-
grid-template-columns: repeat(8, 1fr);
|
|
2623
|
-
grid-gap: 0.5rem;
|
|
2624
|
-
justify-items: center;
|
|
2625
|
-
border-top: solid 1px var(--sl-color-neutral-200);
|
|
2626
|
-
padding: var(--sl-spacing-small);
|
|
2627
|
-
forced-color-adjust: none;
|
|
2628
|
-
}
|
|
2629
|
-
|
|
2630
|
-
.color-picker__swatch {
|
|
2631
|
-
position: relative;
|
|
2632
|
-
width: var(--swatch-size);
|
|
2633
|
-
height: var(--swatch-size);
|
|
2634
|
-
border-radius: var(--sl-border-radius-small);
|
|
2635
|
-
}
|
|
2636
|
-
|
|
2637
|
-
.color-picker__swatch .color-picker__swatch-color {
|
|
2638
|
-
position: absolute;
|
|
2639
|
-
top: 0;
|
|
2640
|
-
left: 0;
|
|
2641
|
-
width: 100%;
|
|
2642
|
-
height: 100%;
|
|
2643
|
-
border: solid 1px rgba(0, 0, 0, 0.125);
|
|
2644
|
-
border-radius: inherit;
|
|
2645
|
-
cursor: pointer;
|
|
2646
|
-
}
|
|
2647
|
-
|
|
2648
|
-
.color-picker__swatch:focus-visible {
|
|
2649
|
-
outline: var(--sl-focus-ring);
|
|
2650
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
2651
|
-
}
|
|
2652
|
-
|
|
2653
|
-
.color-picker__transparent-bg {
|
|
2654
|
-
background-image: linear-gradient(45deg, var(--sl-color-neutral-300) 25%, transparent 25%),
|
|
2655
|
-
linear-gradient(45deg, transparent 75%, var(--sl-color-neutral-300) 75%),
|
|
2656
|
-
linear-gradient(45deg, transparent 75%, var(--sl-color-neutral-300) 75%),
|
|
2657
|
-
linear-gradient(45deg, var(--sl-color-neutral-300) 25%, transparent 25%);
|
|
2658
|
-
background-size: 10px 10px;
|
|
2659
|
-
background-position:
|
|
2660
|
-
0 0,
|
|
2661
|
-
0 0,
|
|
2662
|
-
-5px -5px,
|
|
2663
|
-
5px 5px;
|
|
2664
|
-
}
|
|
2665
|
-
|
|
2666
|
-
.color-picker--disabled {
|
|
2667
|
-
opacity: 0.5;
|
|
2668
|
-
cursor: not-allowed;
|
|
2669
|
-
}
|
|
2670
|
-
|
|
2671
|
-
.color-picker--disabled .color-picker__grid,
|
|
2672
|
-
.color-picker--disabled .color-picker__grid-handle,
|
|
2673
|
-
.color-picker--disabled .color-picker__slider,
|
|
2674
|
-
.color-picker--disabled .color-picker__slider-handle,
|
|
2675
|
-
.color-picker--disabled .color-picker__preview,
|
|
2676
|
-
.color-picker--disabled .color-picker__swatch,
|
|
2677
|
-
.color-picker--disabled .color-picker__swatch-color {
|
|
2678
|
-
pointer-events: none;
|
|
2679
|
-
}
|
|
2680
|
-
|
|
2681
|
-
/*
|
|
2682
|
-
* Color dropdown
|
|
2683
|
-
*/
|
|
2684
|
-
|
|
2685
|
-
.color-dropdown::part(panel) {
|
|
2686
|
-
max-height: none;
|
|
2687
|
-
background-color: var(--sl-panel-background-color);
|
|
2688
|
-
border: solid var(--sl-panel-border-width) var(--sl-panel-border-color);
|
|
2689
|
-
border-radius: var(--sl-border-radius-medium);
|
|
2690
|
-
overflow: visible;
|
|
2691
|
-
}
|
|
2692
|
-
|
|
2693
|
-
.color-dropdown__trigger {
|
|
2694
|
-
display: inline-block;
|
|
2695
|
-
position: relative;
|
|
2696
|
-
background-color: transparent;
|
|
2697
|
-
border: none;
|
|
2698
|
-
cursor: pointer;
|
|
2699
|
-
forced-color-adjust: none;
|
|
2700
|
-
}
|
|
2701
|
-
|
|
2702
|
-
.color-dropdown__trigger.color-dropdown__trigger--small {
|
|
2703
|
-
width: var(--sl-input-height-small);
|
|
2704
|
-
height: var(--sl-input-height-small);
|
|
2705
|
-
border-radius: var(--sl-border-radius-circle);
|
|
2706
|
-
}
|
|
2707
|
-
|
|
2708
|
-
.color-dropdown__trigger.color-dropdown__trigger--medium {
|
|
2709
|
-
width: var(--sl-input-height-medium);
|
|
2710
|
-
height: var(--sl-input-height-medium);
|
|
2711
|
-
border-radius: var(--sl-border-radius-circle);
|
|
2712
|
-
}
|
|
2713
|
-
|
|
2714
|
-
.color-dropdown__trigger.color-dropdown__trigger--large {
|
|
2715
|
-
width: var(--sl-input-height-large);
|
|
2716
|
-
height: var(--sl-input-height-large);
|
|
2717
|
-
border-radius: var(--sl-border-radius-circle);
|
|
2718
|
-
}
|
|
2719
|
-
|
|
2720
|
-
.color-dropdown__trigger:before {
|
|
2721
|
-
content: '';
|
|
2722
|
-
position: absolute;
|
|
2723
|
-
top: 0;
|
|
2724
|
-
left: 0;
|
|
2725
|
-
width: 100%;
|
|
2726
|
-
height: 100%;
|
|
2727
|
-
border-radius: inherit;
|
|
2728
|
-
background-color: currentColor;
|
|
2729
|
-
box-shadow:
|
|
2730
|
-
inset 0 0 0 2px var(--sl-input-border-color),
|
|
2731
|
-
inset 0 0 0 4px var(--sl-color-neutral-0);
|
|
2732
|
-
}
|
|
2733
|
-
|
|
2734
|
-
.color-dropdown__trigger--empty:before {
|
|
2735
|
-
background-color: transparent;
|
|
2736
|
-
}
|
|
2737
|
-
|
|
2738
|
-
.color-dropdown__trigger:focus-visible {
|
|
2739
|
-
outline: none;
|
|
2740
|
-
}
|
|
2741
|
-
|
|
2742
|
-
.color-dropdown__trigger:focus-visible:not(.color-dropdown__trigger--disabled) {
|
|
2743
|
-
outline: var(--sl-focus-ring);
|
|
2744
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
2745
|
-
}
|
|
2746
|
-
|
|
2747
|
-
.color-dropdown__trigger.color-dropdown__trigger--disabled {
|
|
2748
|
-
opacity: 0.5;
|
|
2749
|
-
cursor: not-allowed;
|
|
2750
|
-
}
|
|
2751
|
-
`;function W(t,e){Ls(t)&&(t="100%");const s=Ps(t);return t=e===360?t:Math.min(e,Math.max(0,parseFloat(t))),s&&(t=parseInt(String(t*e),10)/100),Math.abs(t-e)<1e-6?1:(e===360?t=(t<0?t%e+e:t%e)/parseFloat(String(e)):t=t%e/parseFloat(String(e)),t)}function Bt(t){return Math.min(1,Math.max(0,t))}function Ls(t){return typeof t=="string"&&t.indexOf(".")!==-1&&parseFloat(t)===1}function Ps(t){return typeof t=="string"&&t.indexOf("%")!==-1}function Me(t){return t=parseFloat(t),(isNaN(t)||t<0||t>1)&&(t=1),t}function Ht(t){return Number(t)<=1?`${Number(t)*100}%`:t}function Ct(t){return t.length===1?"0"+t:String(t)}function Rs(t,e,s){return{r:W(t,255)*255,g:W(e,255)*255,b:W(s,255)*255}}function pe(t,e,s){t=W(t,255),e=W(e,255),s=W(s,255);const r=Math.max(t,e,s),o=Math.min(t,e,s);let n=0,h=0;const p=(r+o)/2;if(r===o)h=0,n=0;else{const l=r-o;switch(h=p>.5?l/(2-r-o):l/(r+o),r){case t:n=(e-s)/l+(e<s?6:0);break;case e:n=(s-t)/l+2;break;case s:n=(t-e)/l+4;break}n/=6}return{h:n,s:h,l:p}}function ee(t,e,s){return s<0&&(s+=1),s>1&&(s-=1),s<1/6?t+(e-t)*(6*s):s<1/2?e:s<2/3?t+(e-t)*(2/3-s)*6:t}function Vs(t,e,s){let r,o,n;if(t=W(t,360),e=W(e,100),s=W(s,100),e===0)o=s,n=s,r=s;else{const h=s<.5?s*(1+e):s+e-s*e,p=2*s-h;r=ee(p,h,t+1/3),o=ee(p,h,t),n=ee(p,h,t-1/3)}return{r:r*255,g:o*255,b:n*255}}function fe(t,e,s){t=W(t,255),e=W(e,255),s=W(s,255);const r=Math.max(t,e,s),o=Math.min(t,e,s);let n=0;const h=r,p=r-o,l=r===0?0:p/r;if(r===o)n=0;else{switch(r){case t:n=(e-s)/p+(e<s?6:0);break;case e:n=(s-t)/p+2;break;case s:n=(t-e)/p+4;break}n/=6}return{h:n,s:l,v:h}}function Fs(t,e,s){t=W(t,360)*6,e=W(e,100),s=W(s,100);const r=Math.floor(t),o=t-r,n=s*(1-e),h=s*(1-o*e),p=s*(1-(1-o)*e),l=r%6,u=[s,h,n,n,p,s][l],v=[p,s,s,h,n,n][l],c=[n,n,p,s,s,h][l];return{r:u*255,g:v*255,b:c*255}}function me(t,e,s,r){const o=[Ct(Math.round(t).toString(16)),Ct(Math.round(e).toString(16)),Ct(Math.round(s).toString(16))];return r&&o[0].startsWith(o[0].charAt(1))&&o[1].startsWith(o[1].charAt(1))&&o[2].startsWith(o[2].charAt(1))?o[0].charAt(0)+o[1].charAt(0)+o[2].charAt(0):o.join("")}function Os(t,e,s,r,o){const n=[Ct(Math.round(t).toString(16)),Ct(Math.round(e).toString(16)),Ct(Math.round(s).toString(16)),Ct(Hs(r))];return o&&n[0].startsWith(n[0].charAt(1))&&n[1].startsWith(n[1].charAt(1))&&n[2].startsWith(n[2].charAt(1))&&n[3].startsWith(n[3].charAt(1))?n[0].charAt(0)+n[1].charAt(0)+n[2].charAt(0)+n[3].charAt(0):n.join("")}function Bs(t,e,s,r){const o=t/100,n=e/100,h=s/100,p=r/100,l=255*(1-o)*(1-p),u=255*(1-n)*(1-p),v=255*(1-h)*(1-p);return{r:l,g:u,b:v}}function ge(t,e,s){let r=1-t/255,o=1-e/255,n=1-s/255,h=Math.min(r,o,n);return h===1?(r=0,o=0,n=0):(r=(r-h)/(1-h)*100,o=(o-h)/(1-h)*100,n=(n-h)/(1-h)*100),h*=100,{c:Math.round(r),m:Math.round(o),y:Math.round(n),k:Math.round(h)}}function Hs(t){return Math.round(parseFloat(t)*255).toString(16)}function be(t){return st(t)/255}function st(t){return parseInt(t,16)}function Ns(t){return{r:t>>16,g:(t&65280)>>8,b:t&255}}const ie={aliceblue:"#f0f8ff",antiquewhite:"#faebd7",aqua:"#00ffff",aquamarine:"#7fffd4",azure:"#f0ffff",beige:"#f5f5dc",bisque:"#ffe4c4",black:"#000000",blanchedalmond:"#ffebcd",blue:"#0000ff",blueviolet:"#8a2be2",brown:"#a52a2a",burlywood:"#deb887",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",cornflowerblue:"#6495ed",cornsilk:"#fff8dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkgray:"#a9a9a9",darkgreen:"#006400",darkgrey:"#a9a9a9",darkkhaki:"#bdb76b",darkmagenta:"#8b008b",darkolivegreen:"#556b2f",darkorange:"#ff8c00",darkorchid:"#9932cc",darkred:"#8b0000",darksalmon:"#e9967a",darkseagreen:"#8fbc8f",darkslateblue:"#483d8b",darkslategray:"#2f4f4f",darkslategrey:"#2f4f4f",darkturquoise:"#00ced1",darkviolet:"#9400d3",deeppink:"#ff1493",deepskyblue:"#00bfff",dimgray:"#696969",dimgrey:"#696969",dodgerblue:"#1e90ff",firebrick:"#b22222",floralwhite:"#fffaf0",forestgreen:"#228b22",fuchsia:"#ff00ff",gainsboro:"#dcdcdc",ghostwhite:"#f8f8ff",goldenrod:"#daa520",gold:"#ffd700",gray:"#808080",green:"#008000",greenyellow:"#adff2f",grey:"#808080",honeydew:"#f0fff0",hotpink:"#ff69b4",indianred:"#cd5c5c",indigo:"#4b0082",ivory:"#fffff0",khaki:"#f0e68c",lavenderblush:"#fff0f5",lavender:"#e6e6fa",lawngreen:"#7cfc00",lemonchiffon:"#fffacd",lightblue:"#add8e6",lightcoral:"#f08080",lightcyan:"#e0ffff",lightgoldenrodyellow:"#fafad2",lightgray:"#d3d3d3",lightgreen:"#90ee90",lightgrey:"#d3d3d3",lightpink:"#ffb6c1",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",lightskyblue:"#87cefa",lightslategray:"#778899",lightslategrey:"#778899",lightsteelblue:"#b0c4de",lightyellow:"#ffffe0",lime:"#00ff00",limegreen:"#32cd32",linen:"#faf0e6",magenta:"#ff00ff",maroon:"#800000",mediumaquamarine:"#66cdaa",mediumblue:"#0000cd",mediumorchid:"#ba55d3",mediumpurple:"#9370db",mediumseagreen:"#3cb371",mediumslateblue:"#7b68ee",mediumspringgreen:"#00fa9a",mediumturquoise:"#48d1cc",mediumvioletred:"#c71585",midnightblue:"#191970",mintcream:"#f5fffa",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",navajowhite:"#ffdead",navy:"#000080",oldlace:"#fdf5e6",olive:"#808000",olivedrab:"#6b8e23",orange:"#ffa500",orangered:"#ff4500",orchid:"#da70d6",palegoldenrod:"#eee8aa",palegreen:"#98fb98",paleturquoise:"#afeeee",palevioletred:"#db7093",papayawhip:"#ffefd5",peachpuff:"#ffdab9",peru:"#cd853f",pink:"#ffc0cb",plum:"#dda0dd",powderblue:"#b0e0e6",purple:"#800080",rebeccapurple:"#663399",red:"#ff0000",rosybrown:"#bc8f8f",royalblue:"#4169e1",saddlebrown:"#8b4513",salmon:"#fa8072",sandybrown:"#f4a460",seagreen:"#2e8b57",seashell:"#fff5ee",sienna:"#a0522d",silver:"#c0c0c0",skyblue:"#87ceeb",slateblue:"#6a5acd",slategray:"#708090",slategrey:"#708090",snow:"#fffafa",springgreen:"#00ff7f",steelblue:"#4682b4",tan:"#d2b48c",teal:"#008080",thistle:"#d8bfd8",tomato:"#ff6347",turquoise:"#40e0d0",violet:"#ee82ee",wheat:"#f5deb3",white:"#ffffff",whitesmoke:"#f5f5f5",yellow:"#ffff00",yellowgreen:"#9acd32"};function Us(t){let e={r:0,g:0,b:0},s=1,r=null,o=null,n=null,h=!1,p=!1;return typeof t=="string"&&(t=qs(t)),typeof t=="object"&&(et(t.r)&&et(t.g)&&et(t.b)?(e=Rs(t.r,t.g,t.b),h=!0,p=String(t.r).substr(-1)==="%"?"prgb":"rgb"):et(t.h)&&et(t.s)&&et(t.v)?(r=Ht(t.s),o=Ht(t.v),e=Fs(t.h,r,o),h=!0,p="hsv"):et(t.h)&&et(t.s)&&et(t.l)?(r=Ht(t.s),n=Ht(t.l),e=Vs(t.h,r,n),h=!0,p="hsl"):et(t.c)&&et(t.m)&&et(t.y)&&et(t.k)&&(e=Bs(t.c,t.m,t.y,t.k),h=!0,p="cmyk"),Object.prototype.hasOwnProperty.call(t,"a")&&(s=t.a)),s=Me(s),{ok:h,format:t.format||p,r:Math.min(255,Math.max(e.r,0)),g:Math.min(255,Math.max(e.g,0)),b:Math.min(255,Math.max(e.b,0)),a:s}}const Xs="[-\\+]?\\d+%?",Ks="[-\\+]?\\d*\\.\\d+%?",xt="(?:"+Ks+")|(?:"+Xs+")",se="[\\s|\\(]+("+xt+")[,|\\s]+("+xt+")[,|\\s]+("+xt+")\\s*\\)?",Nt="[\\s|\\(]+("+xt+")[,|\\s]+("+xt+")[,|\\s]+("+xt+")[,|\\s]+("+xt+")\\s*\\)?",lt={CSS_UNIT:new RegExp(xt),rgb:new RegExp("rgb"+se),rgba:new RegExp("rgba"+Nt),hsl:new RegExp("hsl"+se),hsla:new RegExp("hsla"+Nt),hsv:new RegExp("hsv"+se),hsva:new RegExp("hsva"+Nt),cmyk:new RegExp("cmyk"+Nt),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/};function qs(t){if(t=t.trim().toLowerCase(),t.length===0)return!1;let e=!1;if(ie[t])t=ie[t],e=!0;else if(t==="transparent")return{r:0,g:0,b:0,a:0,format:"name"};let s=lt.rgb.exec(t);return s?{r:s[1],g:s[2],b:s[3]}:(s=lt.rgba.exec(t),s?{r:s[1],g:s[2],b:s[3],a:s[4]}:(s=lt.hsl.exec(t),s?{h:s[1],s:s[2],l:s[3]}:(s=lt.hsla.exec(t),s?{h:s[1],s:s[2],l:s[3],a:s[4]}:(s=lt.hsv.exec(t),s?{h:s[1],s:s[2],v:s[3]}:(s=lt.hsva.exec(t),s?{h:s[1],s:s[2],v:s[3],a:s[4]}:(s=lt.cmyk.exec(t),s?{c:s[1],m:s[2],y:s[3],k:s[4]}:(s=lt.hex8.exec(t),s?{r:st(s[1]),g:st(s[2]),b:st(s[3]),a:be(s[4]),format:e?"name":"hex8"}:(s=lt.hex6.exec(t),s?{r:st(s[1]),g:st(s[2]),b:st(s[3]),format:e?"name":"hex"}:(s=lt.hex4.exec(t),s?{r:st(s[1]+s[1]),g:st(s[2]+s[2]),b:st(s[3]+s[3]),a:be(s[4]+s[4]),format:e?"name":"hex8"}:(s=lt.hex3.exec(t),s?{r:st(s[1]+s[1]),g:st(s[2]+s[2]),b:st(s[3]+s[3]),format:e?"name":"hex"}:!1))))))))))}function et(t){return typeof t=="number"?!Number.isNaN(t):lt.CSS_UNIT.test(t)}class H{constructor(e="",s={}){if(e instanceof H)return e;typeof e=="number"&&(e=Ns(e)),this.originalInput=e;const r=Us(e);this.originalInput=e,this.r=r.r,this.g=r.g,this.b=r.b,this.a=r.a,this.roundA=Math.round(100*this.a)/100,this.format=s.format??r.format,this.gradientType=s.gradientType,this.r<1&&(this.r=Math.round(this.r)),this.g<1&&(this.g=Math.round(this.g)),this.b<1&&(this.b=Math.round(this.b)),this.isValid=r.ok}isDark(){return this.getBrightness()<128}isLight(){return!this.isDark()}getBrightness(){const e=this.toRgb();return(e.r*299+e.g*587+e.b*114)/1e3}getLuminance(){const e=this.toRgb();let s,r,o;const n=e.r/255,h=e.g/255,p=e.b/255;return n<=.03928?s=n/12.92:s=Math.pow((n+.055)/1.055,2.4),h<=.03928?r=h/12.92:r=Math.pow((h+.055)/1.055,2.4),p<=.03928?o=p/12.92:o=Math.pow((p+.055)/1.055,2.4),.2126*s+.7152*r+.0722*o}getAlpha(){return this.a}setAlpha(e){return this.a=Me(e),this.roundA=Math.round(100*this.a)/100,this}isMonochrome(){const{s:e}=this.toHsl();return e===0}toHsv(){const e=fe(this.r,this.g,this.b);return{h:e.h*360,s:e.s,v:e.v,a:this.a}}toHsvString(){const e=fe(this.r,this.g,this.b),s=Math.round(e.h*360),r=Math.round(e.s*100),o=Math.round(e.v*100);return this.a===1?`hsv(${s}, ${r}%, ${o}%)`:`hsva(${s}, ${r}%, ${o}%, ${this.roundA})`}toHsl(){const e=pe(this.r,this.g,this.b);return{h:e.h*360,s:e.s,l:e.l,a:this.a}}toHslString(){const e=pe(this.r,this.g,this.b),s=Math.round(e.h*360),r=Math.round(e.s*100),o=Math.round(e.l*100);return this.a===1?`hsl(${s}, ${r}%, ${o}%)`:`hsla(${s}, ${r}%, ${o}%, ${this.roundA})`}toHex(e=!1){return me(this.r,this.g,this.b,e)}toHexString(e=!1){return"#"+this.toHex(e)}toHex8(e=!1){return Os(this.r,this.g,this.b,this.a,e)}toHex8String(e=!1){return"#"+this.toHex8(e)}toHexShortString(e=!1){return this.a===1?this.toHexString(e):this.toHex8String(e)}toRgb(){return{r:Math.round(this.r),g:Math.round(this.g),b:Math.round(this.b),a:this.a}}toRgbString(){const e=Math.round(this.r),s=Math.round(this.g),r=Math.round(this.b);return this.a===1?`rgb(${e}, ${s}, ${r})`:`rgba(${e}, ${s}, ${r}, ${this.roundA})`}toPercentageRgb(){const e=s=>`${Math.round(W(s,255)*100)}%`;return{r:e(this.r),g:e(this.g),b:e(this.b),a:this.a}}toPercentageRgbString(){const e=s=>Math.round(W(s,255)*100);return this.a===1?`rgb(${e(this.r)}%, ${e(this.g)}%, ${e(this.b)}%)`:`rgba(${e(this.r)}%, ${e(this.g)}%, ${e(this.b)}%, ${this.roundA})`}toCmyk(){return{...ge(this.r,this.g,this.b)}}toCmykString(){const{c:e,m:s,y:r,k:o}=ge(this.r,this.g,this.b);return`cmyk(${e}, ${s}, ${r}, ${o})`}toName(){if(this.a===0)return"transparent";if(this.a<1)return!1;const e="#"+me(this.r,this.g,this.b,!1);for(const[s,r]of Object.entries(ie))if(e===r)return s;return!1}toString(e){const s=!!e;e=e??this.format;let r=!1;const o=this.a<1&&this.a>=0;return!s&&o&&(e.startsWith("hex")||e==="name")?e==="name"&&this.a===0?this.toName():this.toRgbString():(e==="rgb"&&(r=this.toRgbString()),e==="prgb"&&(r=this.toPercentageRgbString()),(e==="hex"||e==="hex6")&&(r=this.toHexString()),e==="hex3"&&(r=this.toHexString(!0)),e==="hex4"&&(r=this.toHex8String(!0)),e==="hex8"&&(r=this.toHex8String()),e==="name"&&(r=this.toName()),e==="hsl"&&(r=this.toHslString()),e==="hsv"&&(r=this.toHsvString()),e==="cmyk"&&(r=this.toCmykString()),r||this.toHexString())}toNumber(){return(Math.round(this.r)<<16)+(Math.round(this.g)<<8)+Math.round(this.b)}clone(){return new H(this.toString())}lighten(e=10){const s=this.toHsl();return s.l+=e/100,s.l=Bt(s.l),new H(s)}brighten(e=10){const s=this.toRgb();return s.r=Math.max(0,Math.min(255,s.r-Math.round(255*-(e/100)))),s.g=Math.max(0,Math.min(255,s.g-Math.round(255*-(e/100)))),s.b=Math.max(0,Math.min(255,s.b-Math.round(255*-(e/100)))),new H(s)}darken(e=10){const s=this.toHsl();return s.l-=e/100,s.l=Bt(s.l),new H(s)}tint(e=10){return this.mix("white",e)}shade(e=10){return this.mix("black",e)}desaturate(e=10){const s=this.toHsl();return s.s-=e/100,s.s=Bt(s.s),new H(s)}saturate(e=10){const s=this.toHsl();return s.s+=e/100,s.s=Bt(s.s),new H(s)}greyscale(){return this.desaturate(100)}spin(e){const s=this.toHsl(),r=(s.h+e)%360;return s.h=r<0?360+r:r,new H(s)}mix(e,s=50){const r=this.toRgb(),o=new H(e).toRgb(),n=s/100,h={r:(o.r-r.r)*n+r.r,g:(o.g-r.g)*n+r.g,b:(o.b-r.b)*n+r.b,a:(o.a-r.a)*n+r.a};return new H(h)}analogous(e=6,s=30){const r=this.toHsl(),o=360/s,n=[this];for(r.h=(r.h-(o*e>>1)+720)%360;--e;)r.h=(r.h+o)%360,n.push(new H(r));return n}complement(){const e=this.toHsl();return e.h=(e.h+180)%360,new H(e)}monochromatic(e=6){const s=this.toHsv(),{h:r}=s,{s:o}=s;let{v:n}=s;const h=[],p=1/e;for(;e--;)h.push(new H({h:r,s:o,v:n})),n=(n+p)%1;return h}splitcomplement(){const e=this.toHsl(),{h:s}=e;return[this,new H({h:(s+72)%360,s:e.s,l:e.l}),new H({h:(s+216)%360,s:e.s,l:e.l})]}onBackground(e){const s=this.toRgb(),r=new H(e).toRgb(),o=s.a+r.a*(1-s.a);return new H({r:(s.r*s.a+r.r*r.a*(1-s.a))/o,g:(s.g*s.a+r.g*r.a*(1-s.a))/o,b:(s.b*s.a+r.b*r.a*(1-s.a))/o,a:o})}triad(){return this.polyad(3)}tetrad(){return this.polyad(4)}polyad(e){const s=this.toHsl(),{h:r}=s,o=[this],n=360/e;for(let h=1;h<e;h++)o.push(new H({h:(r+h*n)%360,s:s.s,l:s.l}));return o}equals(e){const s=new H(e);return this.format==="cmyk"||s.format==="cmyk"?this.toCmykString()===s.toCmykString():this.toRgbString()===s.toRgbString()}}var ve="EyeDropper"in window,M=class extends A{constructor(){super(),this.formControlController=new Lt(this),this.isSafeValue=!1,this.localize=new K(this),this.hasFocus=!1,this.isDraggingGridHandle=!1,this.isEmpty=!1,this.inputValue="",this.hue=0,this.saturation=100,this.brightness=100,this.alpha=100,this.value="",this.defaultValue="",this.label="",this.format="hex",this.inline=!1,this.size="medium",this.noFormatToggle=!1,this.name="",this.disabled=!1,this.hoist=!1,this.opacity=!1,this.uppercase=!1,this.swatches="",this.form="",this.required=!1,this.handleFocusIn=()=>{this.hasFocus=!0,this.emit("sl-focus")},this.handleFocusOut=()=>{this.hasFocus=!1,this.emit("sl-blur")},this.addEventListener("focusin",this.handleFocusIn),this.addEventListener("focusout",this.handleFocusOut)}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}firstUpdated(){this.input.updateComplete.then(()=>{this.formControlController.updateValidity()})}handleCopy(){this.input.select(),document.execCommand("copy"),this.previewButton.focus(),this.previewButton.classList.add("color-picker__preview-color--copied"),this.previewButton.addEventListener("animationend",()=>{this.previewButton.classList.remove("color-picker__preview-color--copied")})}handleFormatToggle(){const t=["hex","rgb","hsl","hsv"],e=(t.indexOf(this.format)+1)%t.length;this.format=t[e],this.setColor(this.value),this.emit("sl-change"),this.emit("sl-input")}handleAlphaDrag(t){const e=this.shadowRoot.querySelector(".color-picker__slider.color-picker__alpha"),s=e.querySelector(".color-picker__slider-handle"),{width:r}=e.getBoundingClientRect();let o=this.value,n=this.value;s.focus(),t.preventDefault(),Et(e,{onMove:h=>{this.alpha=U(h/r*100,0,100),this.syncValues(),this.value!==n&&(n=this.value,this.emit("sl-input"))},onStop:()=>{this.value!==o&&(o=this.value,this.emit("sl-change"))},initialEvent:t})}handleHueDrag(t){const e=this.shadowRoot.querySelector(".color-picker__slider.color-picker__hue"),s=e.querySelector(".color-picker__slider-handle"),{width:r}=e.getBoundingClientRect();let o=this.value,n=this.value;s.focus(),t.preventDefault(),Et(e,{onMove:h=>{this.hue=U(h/r*360,0,360),this.syncValues(),this.value!==n&&(n=this.value,this.emit("sl-input"))},onStop:()=>{this.value!==o&&(o=this.value,this.emit("sl-change"))},initialEvent:t})}handleGridDrag(t){const e=this.shadowRoot.querySelector(".color-picker__grid"),s=e.querySelector(".color-picker__grid-handle"),{width:r,height:o}=e.getBoundingClientRect();let n=this.value,h=this.value;s.focus(),t.preventDefault(),this.isDraggingGridHandle=!0,Et(e,{onMove:(p,l)=>{this.saturation=U(p/r*100,0,100),this.brightness=U(100-l/o*100,0,100),this.syncValues(),this.value!==h&&(h=this.value,this.emit("sl-input"))},onStop:()=>{this.isDraggingGridHandle=!1,this.value!==n&&(n=this.value,this.emit("sl-change"))},initialEvent:t})}handleAlphaKeyDown(t){const e=t.shiftKey?10:1,s=this.value;t.key==="ArrowLeft"&&(t.preventDefault(),this.alpha=U(this.alpha-e,0,100),this.syncValues()),t.key==="ArrowRight"&&(t.preventDefault(),this.alpha=U(this.alpha+e,0,100),this.syncValues()),t.key==="Home"&&(t.preventDefault(),this.alpha=0,this.syncValues()),t.key==="End"&&(t.preventDefault(),this.alpha=100,this.syncValues()),this.value!==s&&(this.emit("sl-change"),this.emit("sl-input"))}handleHueKeyDown(t){const e=t.shiftKey?10:1,s=this.value;t.key==="ArrowLeft"&&(t.preventDefault(),this.hue=U(this.hue-e,0,360),this.syncValues()),t.key==="ArrowRight"&&(t.preventDefault(),this.hue=U(this.hue+e,0,360),this.syncValues()),t.key==="Home"&&(t.preventDefault(),this.hue=0,this.syncValues()),t.key==="End"&&(t.preventDefault(),this.hue=360,this.syncValues()),this.value!==s&&(this.emit("sl-change"),this.emit("sl-input"))}handleGridKeyDown(t){const e=t.shiftKey?10:1,s=this.value;t.key==="ArrowLeft"&&(t.preventDefault(),this.saturation=U(this.saturation-e,0,100),this.syncValues()),t.key==="ArrowRight"&&(t.preventDefault(),this.saturation=U(this.saturation+e,0,100),this.syncValues()),t.key==="ArrowUp"&&(t.preventDefault(),this.brightness=U(this.brightness+e,0,100),this.syncValues()),t.key==="ArrowDown"&&(t.preventDefault(),this.brightness=U(this.brightness-e,0,100),this.syncValues()),this.value!==s&&(this.emit("sl-change"),this.emit("sl-input"))}handleInputChange(t){const e=t.target,s=this.value;t.stopPropagation(),this.input.value?(this.setColor(e.value),e.value=this.value):this.value="",this.value!==s&&(this.emit("sl-change"),this.emit("sl-input"))}handleInputInput(t){this.formControlController.updateValidity(),t.stopPropagation()}handleInputKeyDown(t){if(t.key==="Enter"){const e=this.value;this.input.value?(this.setColor(this.input.value),this.input.value=this.value,this.value!==e&&(this.emit("sl-change"),this.emit("sl-input")),setTimeout(()=>this.input.select())):this.hue=0}}handleInputInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}handleTouchMove(t){t.preventDefault()}parseColor(t){const e=new H(t);if(!e.isValid)return null;const s=e.toHsl(),r={h:s.h,s:s.s*100,l:s.l*100,a:s.a},o=e.toRgb(),n=e.toHexString(),h=e.toHex8String(),p=e.toHsv(),l={h:p.h,s:p.s*100,v:p.v*100,a:p.a};return{hsl:{h:r.h,s:r.s,l:r.l,string:this.setLetterCase(`hsl(${Math.round(r.h)}, ${Math.round(r.s)}%, ${Math.round(r.l)}%)`)},hsla:{h:r.h,s:r.s,l:r.l,a:r.a,string:this.setLetterCase(`hsla(${Math.round(r.h)}, ${Math.round(r.s)}%, ${Math.round(r.l)}%, ${r.a.toFixed(2).toString()})`)},hsv:{h:l.h,s:l.s,v:l.v,string:this.setLetterCase(`hsv(${Math.round(l.h)}, ${Math.round(l.s)}%, ${Math.round(l.v)}%)`)},hsva:{h:l.h,s:l.s,v:l.v,a:l.a,string:this.setLetterCase(`hsva(${Math.round(l.h)}, ${Math.round(l.s)}%, ${Math.round(l.v)}%, ${l.a.toFixed(2).toString()})`)},rgb:{r:o.r,g:o.g,b:o.b,string:this.setLetterCase(`rgb(${Math.round(o.r)}, ${Math.round(o.g)}, ${Math.round(o.b)})`)},rgba:{r:o.r,g:o.g,b:o.b,a:o.a,string:this.setLetterCase(`rgba(${Math.round(o.r)}, ${Math.round(o.g)}, ${Math.round(o.b)}, ${o.a.toFixed(2).toString()})`)},hex:this.setLetterCase(n),hexa:this.setLetterCase(h)}}setColor(t){const e=this.parseColor(t);return e===null?!1:(this.hue=e.hsva.h,this.saturation=e.hsva.s,this.brightness=e.hsva.v,this.alpha=this.opacity?e.hsva.a*100:100,this.syncValues(),!0)}setLetterCase(t){return typeof t!="string"?"":this.uppercase?t.toUpperCase():t.toLowerCase()}async syncValues(){const t=this.parseColor(`hsva(${this.hue}, ${this.saturation}%, ${this.brightness}%, ${this.alpha/100})`);t!==null&&(this.format==="hsl"?this.inputValue=this.opacity?t.hsla.string:t.hsl.string:this.format==="rgb"?this.inputValue=this.opacity?t.rgba.string:t.rgb.string:this.format==="hsv"?this.inputValue=this.opacity?t.hsva.string:t.hsv.string:this.inputValue=this.opacity?t.hexa:t.hex,this.isSafeValue=!0,this.value=this.inputValue,await this.updateComplete,this.isSafeValue=!1)}handleAfterHide(){this.previewButton.classList.remove("color-picker__preview-color--copied")}handleEyeDropper(){if(!ve)return;new EyeDropper().open().then(e=>{const s=this.value;this.setColor(e.sRGBHex),this.value!==s&&(this.emit("sl-change"),this.emit("sl-input"))}).catch(()=>{})}selectSwatch(t){const e=this.value;this.disabled||(this.setColor(t),this.value!==e&&(this.emit("sl-change"),this.emit("sl-input")))}getHexString(t,e,s,r=100){const o=new H(`hsva(${t}, ${e}%, ${s}%, ${r/100})`);return o.isValid?o.toHex8String():""}stopNestedEventPropagation(t){t.stopImmediatePropagation()}handleFormatChange(){this.syncValues()}handleOpacityChange(){this.alpha=100}handleValueChange(t,e){if(this.isEmpty=!e,e||(this.hue=0,this.saturation=0,this.brightness=100,this.alpha=100),!this.isSafeValue){const s=this.parseColor(e);s!==null?(this.inputValue=this.value,this.hue=s.hsva.h,this.saturation=s.hsva.s,this.brightness=s.hsva.v,this.alpha=s.hsva.a*100,this.syncValues()):this.inputValue=t??""}}focus(t){this.inline?this.base.focus(t):this.trigger.focus(t)}blur(){var t;const e=this.inline?this.base:this.trigger;this.hasFocus&&(e.focus({preventScroll:!0}),e.blur()),(t=this.dropdown)!=null&&t.open&&this.dropdown.hide()}getFormattedValue(t="hex"){const e=this.parseColor(`hsva(${this.hue}, ${this.saturation}%, ${this.brightness}%, ${this.alpha/100})`);if(e===null)return"";switch(t){case"hex":return e.hex;case"hexa":return e.hexa;case"rgb":return e.rgb.string;case"rgba":return e.rgba.string;case"hsl":return e.hsl.string;case"hsla":return e.hsla.string;case"hsv":return e.hsv.string;case"hsva":return e.hsva.string;default:return""}}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return!this.inline&&!this.validity.valid?(this.dropdown.show(),this.addEventListener("sl-after-show",()=>this.input.reportValidity(),{once:!0}),this.disabled||this.formControlController.emitInvalidEvent(),!1):this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){const t=this.saturation,e=100-this.brightness,s=Array.isArray(this.swatches)?this.swatches:this.swatches.split(";").filter(o=>o.trim()!==""),r=_`
|
|
2752
|
-
<div
|
|
2753
|
-
part="base"
|
|
2754
|
-
class=${P({"color-picker":!0,"color-picker--inline":this.inline,"color-picker--disabled":this.disabled,"color-picker--focused":this.hasFocus})}
|
|
2755
|
-
aria-disabled=${this.disabled?"true":"false"}
|
|
2756
|
-
aria-labelledby="label"
|
|
2757
|
-
tabindex=${this.inline?"0":"-1"}
|
|
2758
|
-
>
|
|
2759
|
-
${this.inline?_`
|
|
2760
|
-
<sl-visually-hidden id="label">
|
|
2761
|
-
<slot name="label">${this.label}</slot>
|
|
2762
|
-
</sl-visually-hidden>
|
|
2763
|
-
`:null}
|
|
2764
|
-
|
|
2765
|
-
<div
|
|
2766
|
-
part="grid"
|
|
2767
|
-
class="color-picker__grid"
|
|
2768
|
-
style=${tt({backgroundColor:this.getHexString(this.hue,100,100)})}
|
|
2769
|
-
@pointerdown=${this.handleGridDrag}
|
|
2770
|
-
@touchmove=${this.handleTouchMove}
|
|
2771
|
-
>
|
|
2772
|
-
<span
|
|
2773
|
-
part="grid-handle"
|
|
2774
|
-
class=${P({"color-picker__grid-handle":!0,"color-picker__grid-handle--dragging":this.isDraggingGridHandle})}
|
|
2775
|
-
style=${tt({top:`${e}%`,left:`${t}%`,backgroundColor:this.getHexString(this.hue,this.saturation,this.brightness,this.alpha)})}
|
|
2776
|
-
role="application"
|
|
2777
|
-
aria-label="HSV"
|
|
2778
|
-
tabindex=${F(this.disabled?void 0:"0")}
|
|
2779
|
-
@keydown=${this.handleGridKeyDown}
|
|
2780
|
-
></span>
|
|
2781
|
-
</div>
|
|
2782
|
-
|
|
2783
|
-
<div class="color-picker__controls">
|
|
2784
|
-
<div class="color-picker__sliders">
|
|
2785
|
-
<div
|
|
2786
|
-
part="slider hue-slider"
|
|
2787
|
-
class="color-picker__hue color-picker__slider"
|
|
2788
|
-
@pointerdown=${this.handleHueDrag}
|
|
2789
|
-
@touchmove=${this.handleTouchMove}
|
|
2790
|
-
>
|
|
2791
|
-
<span
|
|
2792
|
-
part="slider-handle hue-slider-handle"
|
|
2793
|
-
class="color-picker__slider-handle"
|
|
2794
|
-
style=${tt({left:`${this.hue===0?0:100/(360/this.hue)}%`})}
|
|
2795
|
-
role="slider"
|
|
2796
|
-
aria-label="hue"
|
|
2797
|
-
aria-orientation="horizontal"
|
|
2798
|
-
aria-valuemin="0"
|
|
2799
|
-
aria-valuemax="360"
|
|
2800
|
-
aria-valuenow=${`${Math.round(this.hue)}`}
|
|
2801
|
-
tabindex=${F(this.disabled?void 0:"0")}
|
|
2802
|
-
@keydown=${this.handleHueKeyDown}
|
|
2803
|
-
></span>
|
|
2804
|
-
</div>
|
|
2805
|
-
|
|
2806
|
-
${this.opacity?_`
|
|
2807
|
-
<div
|
|
2808
|
-
part="slider opacity-slider"
|
|
2809
|
-
class="color-picker__alpha color-picker__slider color-picker__transparent-bg"
|
|
2810
|
-
@pointerdown="${this.handleAlphaDrag}"
|
|
2811
|
-
@touchmove=${this.handleTouchMove}
|
|
2812
|
-
>
|
|
2813
|
-
<div
|
|
2814
|
-
class="color-picker__alpha-gradient"
|
|
2815
|
-
style=${tt({backgroundImage:`linear-gradient(
|
|
2816
|
-
to right,
|
|
2817
|
-
${this.getHexString(this.hue,this.saturation,this.brightness,0)} 0%,
|
|
2818
|
-
${this.getHexString(this.hue,this.saturation,this.brightness,100)} 100%
|
|
2819
|
-
)`})}
|
|
2820
|
-
></div>
|
|
2821
|
-
<span
|
|
2822
|
-
part="slider-handle opacity-slider-handle"
|
|
2823
|
-
class="color-picker__slider-handle"
|
|
2824
|
-
style=${tt({left:`${this.alpha}%`})}
|
|
2825
|
-
role="slider"
|
|
2826
|
-
aria-label="alpha"
|
|
2827
|
-
aria-orientation="horizontal"
|
|
2828
|
-
aria-valuemin="0"
|
|
2829
|
-
aria-valuemax="100"
|
|
2830
|
-
aria-valuenow=${Math.round(this.alpha)}
|
|
2831
|
-
tabindex=${F(this.disabled?void 0:"0")}
|
|
2832
|
-
@keydown=${this.handleAlphaKeyDown}
|
|
2833
|
-
></span>
|
|
2834
|
-
</div>
|
|
2835
|
-
`:""}
|
|
2836
|
-
</div>
|
|
2837
|
-
|
|
2838
|
-
<button
|
|
2839
|
-
type="button"
|
|
2840
|
-
part="preview"
|
|
2841
|
-
class="color-picker__preview color-picker__transparent-bg"
|
|
2842
|
-
aria-label=${this.localize.term("copy")}
|
|
2843
|
-
style=${tt({"--preview-color":this.getHexString(this.hue,this.saturation,this.brightness,this.alpha)})}
|
|
2844
|
-
@click=${this.handleCopy}
|
|
2845
|
-
></button>
|
|
2846
|
-
</div>
|
|
2847
|
-
|
|
2848
|
-
<div class="color-picker__user-input" aria-live="polite">
|
|
2849
|
-
<sl-input
|
|
2850
|
-
part="input"
|
|
2851
|
-
type="text"
|
|
2852
|
-
name=${this.name}
|
|
2853
|
-
autocomplete="off"
|
|
2854
|
-
autocorrect="off"
|
|
2855
|
-
autocapitalize="off"
|
|
2856
|
-
spellcheck="false"
|
|
2857
|
-
value=${this.isEmpty?"":this.inputValue}
|
|
2858
|
-
?required=${this.required}
|
|
2859
|
-
?disabled=${this.disabled}
|
|
2860
|
-
aria-label=${this.localize.term("currentValue")}
|
|
2861
|
-
@keydown=${this.handleInputKeyDown}
|
|
2862
|
-
@sl-change=${this.handleInputChange}
|
|
2863
|
-
@sl-input=${this.handleInputInput}
|
|
2864
|
-
@sl-invalid=${this.handleInputInvalid}
|
|
2865
|
-
@sl-blur=${this.stopNestedEventPropagation}
|
|
2866
|
-
@sl-focus=${this.stopNestedEventPropagation}
|
|
2867
|
-
></sl-input>
|
|
2868
|
-
|
|
2869
|
-
<sl-button-group>
|
|
2870
|
-
${this.noFormatToggle?"":_`
|
|
2871
|
-
<sl-button
|
|
2872
|
-
part="format-button"
|
|
2873
|
-
aria-label=${this.localize.term("toggleColorFormat")}
|
|
2874
|
-
exportparts="
|
|
2875
|
-
base:format-button__base,
|
|
2876
|
-
prefix:format-button__prefix,
|
|
2877
|
-
label:format-button__label,
|
|
2878
|
-
suffix:format-button__suffix,
|
|
2879
|
-
caret:format-button__caret
|
|
2880
|
-
"
|
|
2881
|
-
@click=${this.handleFormatToggle}
|
|
2882
|
-
@sl-blur=${this.stopNestedEventPropagation}
|
|
2883
|
-
@sl-focus=${this.stopNestedEventPropagation}
|
|
2884
|
-
>
|
|
2885
|
-
${this.setLetterCase(this.format)}
|
|
2886
|
-
</sl-button>
|
|
2887
|
-
`}
|
|
2888
|
-
${ve?_`
|
|
2889
|
-
<sl-button
|
|
2890
|
-
part="eye-dropper-button"
|
|
2891
|
-
exportparts="
|
|
2892
|
-
base:eye-dropper-button__base,
|
|
2893
|
-
prefix:eye-dropper-button__prefix,
|
|
2894
|
-
label:eye-dropper-button__label,
|
|
2895
|
-
suffix:eye-dropper-button__suffix,
|
|
2896
|
-
caret:eye-dropper-button__caret
|
|
2897
|
-
"
|
|
2898
|
-
@click=${this.handleEyeDropper}
|
|
2899
|
-
@sl-blur=${this.stopNestedEventPropagation}
|
|
2900
|
-
@sl-focus=${this.stopNestedEventPropagation}
|
|
2901
|
-
>
|
|
2902
|
-
<sl-icon
|
|
2903
|
-
library="system"
|
|
2904
|
-
name="eyedropper"
|
|
2905
|
-
label=${this.localize.term("selectAColorFromTheScreen")}
|
|
2906
|
-
></sl-icon>
|
|
2907
|
-
</sl-button>
|
|
2908
|
-
`:""}
|
|
2909
|
-
</sl-button-group>
|
|
2910
|
-
</div>
|
|
2911
|
-
|
|
2912
|
-
${s.length>0?_`
|
|
2913
|
-
<div part="swatches" class="color-picker__swatches">
|
|
2914
|
-
${s.map(o=>{const n=this.parseColor(o);return n?_`
|
|
2915
|
-
<div
|
|
2916
|
-
part="swatch"
|
|
2917
|
-
class="color-picker__swatch color-picker__transparent-bg"
|
|
2918
|
-
tabindex=${F(this.disabled?void 0:"0")}
|
|
2919
|
-
role="button"
|
|
2920
|
-
aria-label=${o}
|
|
2921
|
-
@click=${()=>this.selectSwatch(o)}
|
|
2922
|
-
@keydown=${h=>!this.disabled&&h.key==="Enter"&&this.setColor(n.hexa)}
|
|
2923
|
-
>
|
|
2924
|
-
<div
|
|
2925
|
-
class="color-picker__swatch-color"
|
|
2926
|
-
style=${tt({backgroundColor:n.hexa})}
|
|
2927
|
-
></div>
|
|
2928
|
-
</div>
|
|
2929
|
-
`:(console.error(`Unable to parse swatch color: "${o}"`,this),"")})}
|
|
2930
|
-
</div>
|
|
2931
|
-
`:""}
|
|
2932
|
-
</div>
|
|
2933
|
-
`;return this.inline?r:_`
|
|
2934
|
-
<sl-dropdown
|
|
2935
|
-
class="color-dropdown"
|
|
2936
|
-
aria-disabled=${this.disabled?"true":"false"}
|
|
2937
|
-
.containingElement=${this}
|
|
2938
|
-
?disabled=${this.disabled}
|
|
2939
|
-
?hoist=${this.hoist}
|
|
2940
|
-
@sl-after-hide=${this.handleAfterHide}
|
|
2941
|
-
>
|
|
2942
|
-
<button
|
|
2943
|
-
part="trigger"
|
|
2944
|
-
slot="trigger"
|
|
2945
|
-
class=${P({"color-dropdown__trigger":!0,"color-dropdown__trigger--disabled":this.disabled,"color-dropdown__trigger--small":this.size==="small","color-dropdown__trigger--medium":this.size==="medium","color-dropdown__trigger--large":this.size==="large","color-dropdown__trigger--empty":this.isEmpty,"color-dropdown__trigger--focused":this.hasFocus,"color-picker__transparent-bg":!0})}
|
|
2946
|
-
style=${tt({color:this.getHexString(this.hue,this.saturation,this.brightness,this.alpha)})}
|
|
2947
|
-
type="button"
|
|
2948
|
-
>
|
|
2949
|
-
<sl-visually-hidden>
|
|
2950
|
-
<slot name="label">${this.label}</slot>
|
|
2951
|
-
</sl-visually-hidden>
|
|
2952
|
-
</button>
|
|
2953
|
-
${r}
|
|
2954
|
-
</sl-dropdown>
|
|
2955
|
-
`}};M.styles=[I,Is];M.dependencies={"sl-button-group":St,"sl-button":Ne,"sl-dropdown":Q,"sl-icon":_t,"sl-input":Ge,"sl-visually-hidden":oe};i([$('[part~="base"]')],M.prototype,"base",2);i([$('[part~="input"]')],M.prototype,"input",2);i([$(".color-dropdown")],M.prototype,"dropdown",2);i([$('[part~="preview"]')],M.prototype,"previewButton",2);i([$('[part~="trigger"]')],M.prototype,"trigger",2);i([L()],M.prototype,"hasFocus",2);i([L()],M.prototype,"isDraggingGridHandle",2);i([L()],M.prototype,"isEmpty",2);i([L()],M.prototype,"inputValue",2);i([L()],M.prototype,"hue",2);i([L()],M.prototype,"saturation",2);i([L()],M.prototype,"brightness",2);i([L()],M.prototype,"alpha",2);i([a()],M.prototype,"value",2);i([Kt()],M.prototype,"defaultValue",2);i([a()],M.prototype,"label",2);i([a()],M.prototype,"format",2);i([a({type:Boolean,reflect:!0})],M.prototype,"inline",2);i([a({reflect:!0})],M.prototype,"size",2);i([a({attribute:"no-format-toggle",type:Boolean})],M.prototype,"noFormatToggle",2);i([a()],M.prototype,"name",2);i([a({type:Boolean,reflect:!0})],M.prototype,"disabled",2);i([a({type:Boolean})],M.prototype,"hoist",2);i([a({type:Boolean})],M.prototype,"opacity",2);i([a({type:Boolean})],M.prototype,"uppercase",2);i([a()],M.prototype,"swatches",2);i([a({reflect:!0})],M.prototype,"form",2);i([a({type:Boolean,reflect:!0})],M.prototype,"required",2);i([Yt({passive:!1})],M.prototype,"handleTouchMove",1);i([x("format",{waitUntilFirstUpdate:!0})],M.prototype,"handleFormatChange",1);i([x("opacity",{waitUntilFirstUpdate:!0})],M.prototype,"handleOpacityChange",1);i([x("value")],M.prototype,"handleValueChange",1);M.define("sl-color-picker");var Ys=class{constructor(t,e){this.timerId=0,this.activeInteractions=0,this.paused=!1,this.stopped=!0,this.pause=()=>{this.activeInteractions++||(this.paused=!0,this.host.requestUpdate())},this.resume=()=>{--this.activeInteractions||(this.paused=!1,this.host.requestUpdate())},t.addController(this),this.host=t,this.tickCallback=e}hostConnected(){this.host.addEventListener("mouseenter",this.pause),this.host.addEventListener("mouseleave",this.resume),this.host.addEventListener("focusin",this.pause),this.host.addEventListener("focusout",this.resume),this.host.addEventListener("touchstart",this.pause,{passive:!0}),this.host.addEventListener("touchend",this.resume)}hostDisconnected(){this.stop(),this.host.removeEventListener("mouseenter",this.pause),this.host.removeEventListener("mouseleave",this.resume),this.host.removeEventListener("focusin",this.pause),this.host.removeEventListener("focusout",this.resume),this.host.removeEventListener("touchstart",this.pause),this.host.removeEventListener("touchend",this.resume)}start(t){this.stop(),this.stopped=!1,this.timerId=window.setInterval(()=>{this.paused||this.tickCallback()},t)}stop(){clearInterval(this.timerId),this.stopped=!0,this.host.requestUpdate()}},Gs=E`
|
|
2956
|
-
:host {
|
|
2957
|
-
--slide-gap: var(--sl-spacing-medium, 1rem);
|
|
2958
|
-
--aspect-ratio: 16 / 9;
|
|
2959
|
-
--scroll-hint: 0px;
|
|
2960
|
-
|
|
2961
|
-
display: flex;
|
|
2962
|
-
}
|
|
2963
|
-
|
|
2964
|
-
.carousel {
|
|
2965
|
-
display: grid;
|
|
2966
|
-
grid-template-columns: min-content 1fr min-content;
|
|
2967
|
-
grid-template-rows: 1fr min-content;
|
|
2968
|
-
grid-template-areas:
|
|
2969
|
-
'. slides .'
|
|
2970
|
-
'. pagination .';
|
|
2971
|
-
gap: var(--sl-spacing-medium);
|
|
2972
|
-
align-items: center;
|
|
2973
|
-
min-height: 100%;
|
|
2974
|
-
min-width: 100%;
|
|
2975
|
-
position: relative;
|
|
2976
|
-
}
|
|
2977
|
-
|
|
2978
|
-
.carousel__pagination {
|
|
2979
|
-
grid-area: pagination;
|
|
2980
|
-
display: flex;
|
|
2981
|
-
flex-wrap: wrap;
|
|
2982
|
-
justify-content: center;
|
|
2983
|
-
gap: var(--sl-spacing-small);
|
|
2984
|
-
}
|
|
2985
|
-
|
|
2986
|
-
.carousel__slides {
|
|
2987
|
-
grid-area: slides;
|
|
2988
|
-
|
|
2989
|
-
display: grid;
|
|
2990
|
-
height: 100%;
|
|
2991
|
-
width: 100%;
|
|
2992
|
-
align-items: center;
|
|
2993
|
-
justify-items: center;
|
|
2994
|
-
overflow: auto;
|
|
2995
|
-
overscroll-behavior-x: contain;
|
|
2996
|
-
scrollbar-width: none;
|
|
2997
|
-
aspect-ratio: calc(var(--aspect-ratio) * var(--slides-per-page));
|
|
2998
|
-
border-radius: var(--sl-border-radius-small);
|
|
2999
|
-
|
|
3000
|
-
--slide-size: calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));
|
|
3001
|
-
}
|
|
3002
|
-
|
|
3003
|
-
@media (prefers-reduced-motion) {
|
|
3004
|
-
:where(.carousel__slides) {
|
|
3005
|
-
scroll-behavior: auto;
|
|
3006
|
-
}
|
|
3007
|
-
}
|
|
3008
|
-
|
|
3009
|
-
.carousel__slides--horizontal {
|
|
3010
|
-
grid-auto-flow: column;
|
|
3011
|
-
grid-auto-columns: var(--slide-size);
|
|
3012
|
-
grid-auto-rows: 100%;
|
|
3013
|
-
column-gap: var(--slide-gap);
|
|
3014
|
-
scroll-snap-type: x mandatory;
|
|
3015
|
-
scroll-padding-inline: var(--scroll-hint);
|
|
3016
|
-
padding-inline: var(--scroll-hint);
|
|
3017
|
-
overflow-y: hidden;
|
|
3018
|
-
}
|
|
3019
|
-
|
|
3020
|
-
.carousel__slides--vertical {
|
|
3021
|
-
grid-auto-flow: row;
|
|
3022
|
-
grid-auto-columns: 100%;
|
|
3023
|
-
grid-auto-rows: var(--slide-size);
|
|
3024
|
-
row-gap: var(--slide-gap);
|
|
3025
|
-
scroll-snap-type: y mandatory;
|
|
3026
|
-
scroll-padding-block: var(--scroll-hint);
|
|
3027
|
-
padding-block: var(--scroll-hint);
|
|
3028
|
-
overflow-x: hidden;
|
|
3029
|
-
}
|
|
3030
|
-
|
|
3031
|
-
.carousel__slides--dragging {
|
|
3032
|
-
}
|
|
3033
|
-
|
|
3034
|
-
:host([vertical]) ::slotted(sl-carousel-item) {
|
|
3035
|
-
height: 100%;
|
|
3036
|
-
}
|
|
3037
|
-
|
|
3038
|
-
.carousel__slides::-webkit-scrollbar {
|
|
3039
|
-
display: none;
|
|
3040
|
-
}
|
|
3041
|
-
|
|
3042
|
-
.carousel__navigation {
|
|
3043
|
-
grid-area: navigation;
|
|
3044
|
-
display: contents;
|
|
3045
|
-
font-size: var(--sl-font-size-x-large);
|
|
3046
|
-
}
|
|
3047
|
-
|
|
3048
|
-
.carousel__navigation-button {
|
|
3049
|
-
flex: 0 0 auto;
|
|
3050
|
-
display: flex;
|
|
3051
|
-
align-items: center;
|
|
3052
|
-
background: none;
|
|
3053
|
-
border: none;
|
|
3054
|
-
border-radius: var(--sl-border-radius-small);
|
|
3055
|
-
font-size: inherit;
|
|
3056
|
-
color: var(--sl-color-neutral-600);
|
|
3057
|
-
padding: var(--sl-spacing-x-small);
|
|
3058
|
-
cursor: pointer;
|
|
3059
|
-
transition: var(--sl-transition-medium) color;
|
|
3060
|
-
appearance: none;
|
|
3061
|
-
}
|
|
3062
|
-
|
|
3063
|
-
.carousel__navigation-button--disabled {
|
|
3064
|
-
opacity: 0.5;
|
|
3065
|
-
cursor: not-allowed;
|
|
3066
|
-
}
|
|
3067
|
-
|
|
3068
|
-
.carousel__navigation-button--disabled::part(base) {
|
|
3069
|
-
pointer-events: none;
|
|
3070
|
-
}
|
|
3071
|
-
|
|
3072
|
-
.carousel__navigation-button--previous {
|
|
3073
|
-
grid-column: 1;
|
|
3074
|
-
grid-row: 1;
|
|
3075
|
-
}
|
|
3076
|
-
|
|
3077
|
-
.carousel__navigation-button--next {
|
|
3078
|
-
grid-column: 3;
|
|
3079
|
-
grid-row: 1;
|
|
3080
|
-
}
|
|
3081
|
-
|
|
3082
|
-
.carousel__pagination-item {
|
|
3083
|
-
display: block;
|
|
3084
|
-
cursor: pointer;
|
|
3085
|
-
background: none;
|
|
3086
|
-
border: 0;
|
|
3087
|
-
border-radius: var(--sl-border-radius-circle);
|
|
3088
|
-
width: var(--sl-spacing-small);
|
|
3089
|
-
height: var(--sl-spacing-small);
|
|
3090
|
-
background-color: var(--sl-color-neutral-300);
|
|
3091
|
-
padding: 0;
|
|
3092
|
-
margin: 0;
|
|
3093
|
-
}
|
|
3094
|
-
|
|
3095
|
-
.carousel__pagination-item--active {
|
|
3096
|
-
background-color: var(--sl-color-neutral-700);
|
|
3097
|
-
transform: scale(1.2);
|
|
3098
|
-
}
|
|
3099
|
-
|
|
3100
|
-
/* Focus styles */
|
|
3101
|
-
.carousel__slides:focus-visible,
|
|
3102
|
-
.carousel__navigation-button:focus-visible,
|
|
3103
|
-
.carousel__pagination-item:focus-visible {
|
|
3104
|
-
outline: var(--sl-focus-ring);
|
|
3105
|
-
outline-offset: var(--sl-focus-ring-offset);
|
|
3106
|
-
}
|
|
3107
|
-
`;function*Ws(t,e){if(t!==void 0){let s=0;for(const r of t)yield e(r,s++)}}function*js(t,e,s=1){const r=e===void 0?0:t;e??=t;for(let o=r;s>0?o<e:e<o;o+=s)yield o}var N=class extends A{constructor(){super(...arguments),this.loop=!1,this.navigation=!1,this.pagination=!1,this.autoplay=!1,this.autoplayInterval=3e3,this.slidesPerPage=1,this.slidesPerMove=1,this.orientation="horizontal",this.mouseDragging=!1,this.activeSlide=0,this.scrolling=!1,this.dragging=!1,this.autoplayController=new Ys(this,()=>this.next()),this.dragStartPosition=[-1,-1],this.localize=new K(this),this.pendingSlideChange=!1,this.handleMouseDrag=t=>{this.dragging||(this.scrollContainer.style.setProperty("scroll-snap-type","none"),this.dragging=!0,this.dragStartPosition=[t.clientX,t.clientY]),this.scrollContainer.scrollBy({left:-t.movementX,top:-t.movementY,behavior:"instant"})},this.handleMouseDragEnd=()=>{const t=this.scrollContainer;document.removeEventListener("pointermove",this.handleMouseDrag,{capture:!0});const e=t.scrollLeft,s=t.scrollTop;t.style.removeProperty("scroll-snap-type"),t.style.setProperty("overflow","hidden");const r=t.scrollLeft,o=t.scrollTop;t.style.removeProperty("overflow"),t.style.setProperty("scroll-snap-type","none"),t.scrollTo({left:e,top:s,behavior:"instant"}),requestAnimationFrame(async()=>{(e!==r||s!==o)&&(t.scrollTo({left:r,top:o,behavior:de()?"auto":"smooth"}),await wt(t,"scrollend")),t.style.removeProperty("scroll-snap-type"),this.dragging=!1,this.dragStartPosition=[-1,-1],this.handleScrollEnd()})},this.handleSlotChange=t=>{t.some(s=>[...s.addedNodes,...s.removedNodes].some(r=>this.isCarouselItem(r)&&!r.hasAttribute("data-clone")))&&this.initializeSlides(),this.requestUpdate()}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","region"),this.setAttribute("aria-label",this.localize.term("carousel"))}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.mutationObserver)==null||t.disconnect()}firstUpdated(){this.initializeSlides(),this.mutationObserver=new MutationObserver(this.handleSlotChange),this.mutationObserver.observe(this,{childList:!0,subtree:!0})}willUpdate(t){(t.has("slidesPerMove")||t.has("slidesPerPage"))&&(this.slidesPerMove=Math.min(this.slidesPerMove,this.slidesPerPage))}getPageCount(){const t=this.getSlides().length,{slidesPerPage:e,slidesPerMove:s,loop:r}=this,o=r?t/s:(t-e)/s+1;return Math.ceil(o)}getCurrentPage(){return Math.ceil(this.activeSlide/this.slidesPerMove)}canScrollNext(){return this.loop||this.getCurrentPage()<this.getPageCount()-1}canScrollPrev(){return this.loop||this.getCurrentPage()>0}getSlides({excludeClones:t=!0}={}){return[...this.children].filter(e=>this.isCarouselItem(e)&&(!t||!e.hasAttribute("data-clone")))}handleClick(t){if(this.dragging&&this.dragStartPosition[0]>0&&this.dragStartPosition[1]>0){const e=Math.abs(this.dragStartPosition[0]-t.clientX),s=Math.abs(this.dragStartPosition[1]-t.clientY);Math.sqrt(e*e+s*s)>=10&&t.preventDefault()}}handleKeyDown(t){if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(t.key)){const e=t.target,s=this.localize.dir()==="rtl",r=e.closest('[part~="pagination-item"]')!==null,o=t.key==="ArrowDown"||!s&&t.key==="ArrowRight"||s&&t.key==="ArrowLeft",n=t.key==="ArrowUp"||!s&&t.key==="ArrowLeft"||s&&t.key==="ArrowRight";t.preventDefault(),n&&this.previous(),o&&this.next(),t.key==="Home"&&this.goToSlide(0),t.key==="End"&&this.goToSlide(this.getSlides().length-1),r&&this.updateComplete.then(()=>{var h;const p=(h=this.shadowRoot)==null?void 0:h.querySelector('[part~="pagination-item--active"]');p&&p.focus()})}}handleMouseDragStart(t){this.mouseDragging&&t.button===0&&(t.preventDefault(),document.addEventListener("pointermove",this.handleMouseDrag,{capture:!0,passive:!0}),document.addEventListener("pointerup",this.handleMouseDragEnd,{capture:!0,once:!0}))}handleScroll(){this.scrolling=!0,this.pendingSlideChange||this.synchronizeSlides()}synchronizeSlides(){const t=new IntersectionObserver(e=>{t.disconnect();for(const p of e){const l=p.target;l.toggleAttribute("inert",!p.isIntersecting),l.classList.toggle("--in-view",p.isIntersecting),l.setAttribute("aria-hidden",p.isIntersecting?"false":"true")}const s=e.find(p=>p.isIntersecting);if(!s)return;const r=this.getSlides({excludeClones:!1}),o=this.getSlides().length,n=r.indexOf(s.target),h=this.loop?n-this.slidesPerPage:n;if(this.activeSlide=(Math.ceil(h/this.slidesPerMove)*this.slidesPerMove+o)%o,!this.scrolling&&this.loop&&s.target.hasAttribute("data-clone")){const p=Number(s.target.getAttribute("data-clone"));this.goToSlide(p,"instant")}},{root:this.scrollContainer,threshold:.6});this.getSlides({excludeClones:!1}).forEach(e=>{t.observe(e)})}handleScrollEnd(){!this.scrolling||this.dragging||(this.scrolling=!1,this.pendingSlideChange=!1,this.synchronizeSlides())}isCarouselItem(t){return t instanceof Element&&t.tagName.toLowerCase()==="sl-carousel-item"}initializeSlides(){this.getSlides({excludeClones:!1}).forEach((t,e)=>{t.classList.remove("--in-view"),t.classList.remove("--is-active"),t.setAttribute("role","group"),t.setAttribute("aria-label",this.localize.term("slideNum",e+1)),this.pagination&&(t.setAttribute("id",`slide-${e+1}`),t.setAttribute("role","tabpanel"),t.removeAttribute("aria-label"),t.setAttribute("aria-labelledby",`tab-${e+1}`)),t.hasAttribute("data-clone")&&t.remove()}),this.updateSlidesSnap(),this.loop&&this.createClones(),this.goToSlide(this.activeSlide,"auto"),this.synchronizeSlides()}createClones(){const t=this.getSlides(),e=this.slidesPerPage,s=t.slice(-e),r=t.slice(0,e);s.reverse().forEach((o,n)=>{const h=o.cloneNode(!0);h.setAttribute("data-clone",String(t.length-n-1)),this.prepend(h)}),r.forEach((o,n)=>{const h=o.cloneNode(!0);h.setAttribute("data-clone",String(n)),this.append(h)})}handleSlideChange(){const t=this.getSlides();t.forEach((e,s)=>{e.classList.toggle("--is-active",s===this.activeSlide)}),this.hasUpdated&&this.emit("sl-slide-change",{detail:{index:this.activeSlide,slide:t[this.activeSlide]}})}updateSlidesSnap(){const t=this.getSlides(),e=this.slidesPerMove;t.forEach((s,r)=>{(r+e)%e===0?s.style.removeProperty("scroll-snap-align"):s.style.setProperty("scroll-snap-align","none")})}handleAutoplayChange(){this.autoplayController.stop(),this.autoplay&&this.autoplayController.start(this.autoplayInterval)}previous(t="smooth"){this.goToSlide(this.activeSlide-this.slidesPerMove,t)}next(t="smooth"){this.goToSlide(this.activeSlide+this.slidesPerMove,t)}goToSlide(t,e="smooth"){const{slidesPerPage:s,loop:r}=this,o=this.getSlides(),n=this.getSlides({excludeClones:!1});if(!o.length)return;const h=r?(t+o.length)%o.length:U(t,0,o.length-s);this.activeSlide=h;const p=this.localize.dir()==="rtl",l=U(t+(r?s:0)+(p?s-1:0),0,n.length-1),u=n[l];this.scrollToSlide(u,de()?"auto":e)}scrollToSlide(t,e="smooth"){this.pendingSlideChange=!0,window.requestAnimationFrame(()=>{if(!this.scrollContainer)return;const s=this.scrollContainer,r=s.getBoundingClientRect(),o=t.getBoundingClientRect(),n=o.left-r.left,h=o.top-r.top;n||h?(this.pendingSlideChange=!0,s.scrollTo({left:n+s.scrollLeft,top:h+s.scrollTop,behavior:e})):this.pendingSlideChange=!1})}render(){const{slidesPerMove:t,scrolling:e}=this,s=this.getPageCount(),r=this.getCurrentPage(),o=this.canScrollPrev(),n=this.canScrollNext(),h=this.localize.dir()==="ltr";return _`
|
|
3108
|
-
<div part="base" class="carousel">
|
|
3109
|
-
<div
|
|
3110
|
-
id="scroll-container"
|
|
3111
|
-
part="scroll-container"
|
|
3112
|
-
class="${P({carousel__slides:!0,"carousel__slides--horizontal":this.orientation==="horizontal","carousel__slides--vertical":this.orientation==="vertical","carousel__slides--dragging":this.dragging})}"
|
|
3113
|
-
style="--slides-per-page: ${this.slidesPerPage};"
|
|
3114
|
-
aria-busy="${e?"true":"false"}"
|
|
3115
|
-
aria-atomic="true"
|
|
3116
|
-
tabindex="0"
|
|
3117
|
-
@keydown=${this.handleKeyDown}
|
|
3118
|
-
@mousedown="${this.handleMouseDragStart}"
|
|
3119
|
-
@scroll="${this.handleScroll}"
|
|
3120
|
-
@scrollend=${this.handleScrollEnd}
|
|
3121
|
-
@click=${this.handleClick}
|
|
3122
|
-
>
|
|
3123
|
-
<slot></slot>
|
|
3124
|
-
</div>
|
|
3125
|
-
|
|
3126
|
-
${this.navigation?_`
|
|
3127
|
-
<div part="navigation" class="carousel__navigation">
|
|
3128
|
-
<button
|
|
3129
|
-
part="navigation-button navigation-button--previous"
|
|
3130
|
-
class="${P({"carousel__navigation-button":!0,"carousel__navigation-button--previous":!0,"carousel__navigation-button--disabled":!o})}"
|
|
3131
|
-
aria-label="${this.localize.term("previousSlide")}"
|
|
3132
|
-
aria-controls="scroll-container"
|
|
3133
|
-
aria-disabled="${o?"false":"true"}"
|
|
3134
|
-
@click=${o?()=>this.previous():null}
|
|
3135
|
-
>
|
|
3136
|
-
<slot name="previous-icon">
|
|
3137
|
-
<sl-icon library="system" name="${h?"chevron-left":"chevron-right"}"></sl-icon>
|
|
3138
|
-
</slot>
|
|
3139
|
-
</button>
|
|
3140
|
-
|
|
3141
|
-
<button
|
|
3142
|
-
part="navigation-button navigation-button--next"
|
|
3143
|
-
class=${P({"carousel__navigation-button":!0,"carousel__navigation-button--next":!0,"carousel__navigation-button--disabled":!n})}
|
|
3144
|
-
aria-label="${this.localize.term("nextSlide")}"
|
|
3145
|
-
aria-controls="scroll-container"
|
|
3146
|
-
aria-disabled="${n?"false":"true"}"
|
|
3147
|
-
@click=${n?()=>this.next():null}
|
|
3148
|
-
>
|
|
3149
|
-
<slot name="next-icon">
|
|
3150
|
-
<sl-icon library="system" name="${h?"chevron-right":"chevron-left"}"></sl-icon>
|
|
3151
|
-
</slot>
|
|
3152
|
-
</button>
|
|
3153
|
-
</div>
|
|
3154
|
-
`:""}
|
|
3155
|
-
${this.pagination?_`
|
|
3156
|
-
<div part="pagination" role="tablist" class="carousel__pagination">
|
|
3157
|
-
${Ws(js(s),p=>{const l=p===r;return _`
|
|
3158
|
-
<button
|
|
3159
|
-
part="pagination-item ${l?"pagination-item--active":""}"
|
|
3160
|
-
class="${P({"carousel__pagination-item":!0,"carousel__pagination-item--active":l})}"
|
|
3161
|
-
role="tab"
|
|
3162
|
-
id="tab-${p+1}"
|
|
3163
|
-
aria-controls="slide-${p+1}"
|
|
3164
|
-
aria-selected="${l?"true":"false"}"
|
|
3165
|
-
aria-label="${l?this.localize.term("slideNum",p+1):this.localize.term("goToSlide",p+1,s)}"
|
|
3166
|
-
tabindex=${l?"0":"-1"}
|
|
3167
|
-
@click=${()=>this.goToSlide(p*t)}
|
|
3168
|
-
@keydown=${this.handleKeyDown}
|
|
3169
|
-
></button>
|
|
3170
|
-
`})}
|
|
3171
|
-
</div>
|
|
3172
|
-
`:""}
|
|
3173
|
-
</div>
|
|
3174
|
-
`}};N.styles=[I,Gs];N.dependencies={"sl-icon":_t};i([a({type:Boolean,reflect:!0})],N.prototype,"loop",2);i([a({type:Boolean,reflect:!0})],N.prototype,"navigation",2);i([a({type:Boolean,reflect:!0})],N.prototype,"pagination",2);i([a({type:Boolean,reflect:!0})],N.prototype,"autoplay",2);i([a({type:Number,attribute:"autoplay-interval"})],N.prototype,"autoplayInterval",2);i([a({type:Number,attribute:"slides-per-page"})],N.prototype,"slidesPerPage",2);i([a({type:Number,attribute:"slides-per-move"})],N.prototype,"slidesPerMove",2);i([a()],N.prototype,"orientation",2);i([a({type:Boolean,reflect:!0,attribute:"mouse-dragging"})],N.prototype,"mouseDragging",2);i([$(".carousel__slides")],N.prototype,"scrollContainer",2);i([$(".carousel__pagination")],N.prototype,"paginationContainer",2);i([L()],N.prototype,"activeSlide",2);i([L()],N.prototype,"scrolling",2);i([L()],N.prototype,"dragging",2);i([Yt({passive:!0})],N.prototype,"handleScroll",1);i([x("loop",{waitUntilFirstUpdate:!0}),x("slidesPerPage",{waitUntilFirstUpdate:!0})],N.prototype,"initializeSlides",1);i([x("activeSlide")],N.prototype,"handleSlideChange",1);i([x("slidesPerMove")],N.prototype,"updateSlidesSnap",1);i([x("autoplay")],N.prototype,"handleAutoplayChange",1);N.define("sl-carousel");var Qs=E`
|
|
3175
|
-
:host {
|
|
3176
|
-
--aspect-ratio: inherit;
|
|
3177
|
-
|
|
3178
|
-
display: flex;
|
|
3179
|
-
align-items: center;
|
|
3180
|
-
justify-content: center;
|
|
3181
|
-
flex-direction: column;
|
|
3182
|
-
width: 100%;
|
|
3183
|
-
max-height: 100%;
|
|
3184
|
-
aspect-ratio: var(--aspect-ratio);
|
|
3185
|
-
scroll-snap-align: start;
|
|
3186
|
-
scroll-snap-stop: always;
|
|
3187
|
-
}
|
|
3188
|
-
|
|
3189
|
-
::slotted(img) {
|
|
3190
|
-
width: 100% !important;
|
|
3191
|
-
height: 100% !important;
|
|
3192
|
-
object-fit: cover;
|
|
3193
|
-
}
|
|
3194
|
-
`,Te=class extends A{connectedCallback(){super.connectedCallback()}render(){return _` <slot></slot> `}};Te.styles=[I,Qs];Te.define("sl-carousel-item");St.define("sl-button-group");var Zs=E`
|
|
3195
|
-
:host {
|
|
3196
|
-
--control-box-size: 3rem;
|
|
3197
|
-
--icon-size: calc(var(--control-box-size) * 0.625);
|
|
3198
|
-
|
|
3199
|
-
display: inline-flex;
|
|
3200
|
-
position: relative;
|
|
3201
|
-
cursor: pointer;
|
|
3202
|
-
}
|
|
3203
|
-
|
|
3204
|
-
img {
|
|
3205
|
-
display: block;
|
|
3206
|
-
width: 100%;
|
|
3207
|
-
height: 100%;
|
|
3208
|
-
}
|
|
3209
|
-
|
|
3210
|
-
img[aria-hidden='true'] {
|
|
3211
|
-
display: none;
|
|
3212
|
-
}
|
|
3213
|
-
|
|
3214
|
-
.animated-image__control-box {
|
|
3215
|
-
display: flex;
|
|
3216
|
-
position: absolute;
|
|
3217
|
-
align-items: center;
|
|
3218
|
-
justify-content: center;
|
|
3219
|
-
top: calc(50% - var(--control-box-size) / 2);
|
|
3220
|
-
right: calc(50% - var(--control-box-size) / 2);
|
|
3221
|
-
width: var(--control-box-size);
|
|
3222
|
-
height: var(--control-box-size);
|
|
3223
|
-
font-size: var(--icon-size);
|
|
3224
|
-
background: none;
|
|
3225
|
-
border: solid 2px currentColor;
|
|
3226
|
-
background-color: rgb(0 0 0 /50%);
|
|
3227
|
-
border-radius: var(--sl-border-radius-circle);
|
|
3228
|
-
color: white;
|
|
3229
|
-
pointer-events: none;
|
|
3230
|
-
transition: var(--sl-transition-fast) opacity;
|
|
3231
|
-
}
|
|
3232
|
-
|
|
3233
|
-
:host([play]:hover) .animated-image__control-box {
|
|
3234
|
-
opacity: 1;
|
|
3235
|
-
}
|
|
3236
|
-
|
|
3237
|
-
:host([play]:not(:hover)) .animated-image__control-box {
|
|
3238
|
-
opacity: 0;
|
|
3239
|
-
}
|
|
3240
|
-
|
|
3241
|
-
:host([play]) slot[name='play-icon'],
|
|
3242
|
-
:host(:not([play])) slot[name='pause-icon'] {
|
|
3243
|
-
display: none;
|
|
3244
|
-
}
|
|
3245
|
-
`,ft=class extends A{constructor(){super(...arguments),this.isLoaded=!1}handleClick(){this.play=!this.play}handleLoad(){const t=document.createElement("canvas"),{width:e,height:s}=this.animatedImage;t.width=e,t.height=s,t.getContext("2d").drawImage(this.animatedImage,0,0,e,s),this.frozenFrame=t.toDataURL("image/gif"),this.isLoaded||(this.emit("sl-load"),this.isLoaded=!0)}handleError(){this.emit("sl-error")}handlePlayChange(){this.play&&(this.animatedImage.src="",this.animatedImage.src=this.src)}handleSrcChange(){this.isLoaded=!1}render(){return _`
|
|
3246
|
-
<div class="animated-image">
|
|
3247
|
-
<img
|
|
3248
|
-
class="animated-image__animated"
|
|
3249
|
-
src=${this.src}
|
|
3250
|
-
alt=${this.alt}
|
|
3251
|
-
crossorigin="anonymous"
|
|
3252
|
-
aria-hidden=${this.play?"false":"true"}
|
|
3253
|
-
@click=${this.handleClick}
|
|
3254
|
-
@load=${this.handleLoad}
|
|
3255
|
-
@error=${this.handleError}
|
|
3256
|
-
/>
|
|
3257
|
-
|
|
3258
|
-
${this.isLoaded?_`
|
|
3259
|
-
<img
|
|
3260
|
-
class="animated-image__frozen"
|
|
3261
|
-
src=${this.frozenFrame}
|
|
3262
|
-
alt=${this.alt}
|
|
3263
|
-
aria-hidden=${this.play?"true":"false"}
|
|
3264
|
-
@click=${this.handleClick}
|
|
3265
|
-
/>
|
|
3266
|
-
|
|
3267
|
-
<div part="control-box" class="animated-image__control-box">
|
|
3268
|
-
<slot name="play-icon"><sl-icon name="play-fill" library="system"></sl-icon></slot>
|
|
3269
|
-
<slot name="pause-icon"><sl-icon name="pause-fill" library="system"></sl-icon></slot>
|
|
3270
|
-
</div>
|
|
3271
|
-
`:""}
|
|
3272
|
-
</div>
|
|
3273
|
-
`}};ft.styles=[I,Zs];ft.dependencies={"sl-icon":_t};i([$(".animated-image__animated")],ft.prototype,"animatedImage",2);i([L()],ft.prototype,"frozenFrame",2);i([L()],ft.prototype,"isLoaded",2);i([a()],ft.prototype,"src",2);i([a()],ft.prototype,"alt",2);i([a({type:Boolean,reflect:!0})],ft.prototype,"play",2);i([x("play",{waitUntilFirstUpdate:!0})],ft.prototype,"handlePlayChange",1);i([x("src")],ft.prototype,"handleSrcChange",1);ft.define("sl-animated-image");var Js=E`
|
|
3274
|
-
:host {
|
|
3275
|
-
display: inline-flex;
|
|
3276
|
-
}
|
|
3277
|
-
|
|
3278
|
-
.badge {
|
|
3279
|
-
display: inline-flex;
|
|
3280
|
-
align-items: center;
|
|
3281
|
-
justify-content: center;
|
|
3282
|
-
font-size: max(12px, 0.75em);
|
|
3283
|
-
font-weight: var(--sl-font-weight-semibold);
|
|
3284
|
-
letter-spacing: var(--sl-letter-spacing-normal);
|
|
3285
|
-
line-height: 1;
|
|
3286
|
-
border-radius: var(--sl-border-radius-small);
|
|
3287
|
-
border: solid 1px var(--sl-color-neutral-0);
|
|
3288
|
-
white-space: nowrap;
|
|
3289
|
-
padding: 0.35em 0.6em;
|
|
3290
|
-
user-select: none;
|
|
3291
|
-
-webkit-user-select: none;
|
|
3292
|
-
cursor: inherit;
|
|
3293
|
-
}
|
|
3294
|
-
|
|
3295
|
-
/* Variant modifiers */
|
|
3296
|
-
.badge--primary {
|
|
3297
|
-
background-color: var(--sl-color-primary-600);
|
|
3298
|
-
color: var(--sl-color-neutral-0);
|
|
3299
|
-
}
|
|
3300
|
-
|
|
3301
|
-
.badge--success {
|
|
3302
|
-
background-color: var(--sl-color-success-600);
|
|
3303
|
-
color: var(--sl-color-neutral-0);
|
|
3304
|
-
}
|
|
3305
|
-
|
|
3306
|
-
.badge--neutral {
|
|
3307
|
-
background-color: var(--sl-color-neutral-600);
|
|
3308
|
-
color: var(--sl-color-neutral-0);
|
|
3309
|
-
}
|
|
3310
|
-
|
|
3311
|
-
.badge--warning {
|
|
3312
|
-
background-color: var(--sl-color-warning-600);
|
|
3313
|
-
color: var(--sl-color-neutral-0);
|
|
3314
|
-
}
|
|
3315
|
-
|
|
3316
|
-
.badge--danger {
|
|
3317
|
-
background-color: var(--sl-color-danger-600);
|
|
3318
|
-
color: var(--sl-color-neutral-0);
|
|
3319
|
-
}
|
|
3320
|
-
|
|
3321
|
-
/* Pill modifier */
|
|
3322
|
-
.badge--pill {
|
|
3323
|
-
border-radius: var(--sl-border-radius-pill);
|
|
3324
|
-
}
|
|
3325
|
-
|
|
3326
|
-
/* Pulse modifier */
|
|
3327
|
-
.badge--pulse {
|
|
3328
|
-
animation: pulse 1.5s infinite;
|
|
3329
|
-
}
|
|
3330
|
-
|
|
3331
|
-
.badge--pulse.badge--primary {
|
|
3332
|
-
--pulse-color: var(--sl-color-primary-600);
|
|
3333
|
-
}
|
|
3334
|
-
|
|
3335
|
-
.badge--pulse.badge--success {
|
|
3336
|
-
--pulse-color: var(--sl-color-success-600);
|
|
3337
|
-
}
|
|
3338
|
-
|
|
3339
|
-
.badge--pulse.badge--neutral {
|
|
3340
|
-
--pulse-color: var(--sl-color-neutral-600);
|
|
3341
|
-
}
|
|
3342
|
-
|
|
3343
|
-
.badge--pulse.badge--warning {
|
|
3344
|
-
--pulse-color: var(--sl-color-warning-600);
|
|
3345
|
-
}
|
|
3346
|
-
|
|
3347
|
-
.badge--pulse.badge--danger {
|
|
3348
|
-
--pulse-color: var(--sl-color-danger-600);
|
|
3349
|
-
}
|
|
3350
|
-
|
|
3351
|
-
@keyframes pulse {
|
|
3352
|
-
0% {
|
|
3353
|
-
box-shadow: 0 0 0 0 var(--pulse-color);
|
|
3354
|
-
}
|
|
3355
|
-
70% {
|
|
3356
|
-
box-shadow: 0 0 0 0.5rem transparent;
|
|
3357
|
-
}
|
|
3358
|
-
100% {
|
|
3359
|
-
box-shadow: 0 0 0 0 transparent;
|
|
3360
|
-
}
|
|
3361
|
-
}
|
|
3362
|
-
`,Rt=class extends A{constructor(){super(...arguments),this.variant="primary",this.pill=!1,this.pulse=!1}render(){return _`
|
|
3363
|
-
<span
|
|
3364
|
-
part="base"
|
|
3365
|
-
class=${P({badge:!0,"badge--primary":this.variant==="primary","badge--success":this.variant==="success","badge--neutral":this.variant==="neutral","badge--warning":this.variant==="warning","badge--danger":this.variant==="danger","badge--pill":this.pill,"badge--pulse":this.pulse})}
|
|
3366
|
-
role="status"
|
|
3367
|
-
>
|
|
3368
|
-
<slot></slot>
|
|
3369
|
-
</span>
|
|
3370
|
-
`}};Rt.styles=[I,Js];i([a({reflect:!0})],Rt.prototype,"variant",2);i([a({type:Boolean,reflect:!0})],Rt.prototype,"pill",2);i([a({type:Boolean,reflect:!0})],Rt.prototype,"pulse",2);Rt.define("sl-badge");const ti=[{offset:0,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)",transform:"translate3d(0, 0, 0)"},{offset:.2,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)",transform:"translate3d(0, 0, 0)"},{offset:.4,easing:"cubic-bezier(0.755, 0.05, 0.855, 0.06)",transform:"translate3d(0, -30px, 0) scaleY(1.1)"},{offset:.43,easing:"cubic-bezier(0.755, 0.05, 0.855, 0.06)",transform:"translate3d(0, -30px, 0) scaleY(1.1)"},{offset:.53,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)",transform:"translate3d(0, 0, 0)"},{offset:.7,easing:"cubic-bezier(0.755, 0.05, 0.855, 0.06)",transform:"translate3d(0, -15px, 0) scaleY(1.05)"},{offset:.8,"transition-timing-function":"cubic-bezier(0.215, 0.61, 0.355, 1)",transform:"translate3d(0, 0, 0) scaleY(0.95)"},{offset:.9,transform:"translate3d(0, -4px, 0) scaleY(1.02)"},{offset:1,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)",transform:"translate3d(0, 0, 0)"}],ei=[{offset:0,opacity:"1"},{offset:.25,opacity:"0"},{offset:.5,opacity:"1"},{offset:.75,opacity:"0"},{offset:1,opacity:"1"}],si=[{offset:0,transform:"translateX(0)"},{offset:.065,transform:"translateX(-6px) rotateY(-9deg)"},{offset:.185,transform:"translateX(5px) rotateY(7deg)"},{offset:.315,transform:"translateX(-3px) rotateY(-5deg)"},{offset:.435,transform:"translateX(2px) rotateY(3deg)"},{offset:.5,transform:"translateX(0)"}],ii=[{offset:0,transform:"scale(1)"},{offset:.14,transform:"scale(1.3)"},{offset:.28,transform:"scale(1)"},{offset:.42,transform:"scale(1.3)"},{offset:.7,transform:"scale(1)"}],ri=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:.111,transform:"translate3d(0, 0, 0)"},{offset:.222,transform:"skewX(-12.5deg) skewY(-12.5deg)"},{offset:.33299999999999996,transform:"skewX(6.25deg) skewY(6.25deg)"},{offset:.444,transform:"skewX(-3.125deg) skewY(-3.125deg)"},{offset:.555,transform:"skewX(1.5625deg) skewY(1.5625deg)"},{offset:.6659999999999999,transform:"skewX(-0.78125deg) skewY(-0.78125deg)"},{offset:.777,transform:"skewX(0.390625deg) skewY(0.390625deg)"},{offset:.888,transform:"skewX(-0.1953125deg) skewY(-0.1953125deg)"},{offset:1,transform:"translate3d(0, 0, 0)"}],oi=[{offset:0,transform:"scale3d(1, 1, 1)"},{offset:.5,transform:"scale3d(1.05, 1.05, 1.05)"},{offset:1,transform:"scale3d(1, 1, 1)"}],ai=[{offset:0,transform:"scale3d(1, 1, 1)"},{offset:.3,transform:"scale3d(1.25, 0.75, 1)"},{offset:.4,transform:"scale3d(0.75, 1.25, 1)"},{offset:.5,transform:"scale3d(1.15, 0.85, 1)"},{offset:.65,transform:"scale3d(0.95, 1.05, 1)"},{offset:.75,transform:"scale3d(1.05, 0.95, 1)"},{offset:1,transform:"scale3d(1, 1, 1)"}],ni=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:.1,transform:"translate3d(-10px, 0, 0)"},{offset:.2,transform:"translate3d(10px, 0, 0)"},{offset:.3,transform:"translate3d(-10px, 0, 0)"},{offset:.4,transform:"translate3d(10px, 0, 0)"},{offset:.5,transform:"translate3d(-10px, 0, 0)"},{offset:.6,transform:"translate3d(10px, 0, 0)"},{offset:.7,transform:"translate3d(-10px, 0, 0)"},{offset:.8,transform:"translate3d(10px, 0, 0)"},{offset:.9,transform:"translate3d(-10px, 0, 0)"},{offset:1,transform:"translate3d(0, 0, 0)"}],li=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:.1,transform:"translate3d(-10px, 0, 0)"},{offset:.2,transform:"translate3d(10px, 0, 0)"},{offset:.3,transform:"translate3d(-10px, 0, 0)"},{offset:.4,transform:"translate3d(10px, 0, 0)"},{offset:.5,transform:"translate3d(-10px, 0, 0)"},{offset:.6,transform:"translate3d(10px, 0, 0)"},{offset:.7,transform:"translate3d(-10px, 0, 0)"},{offset:.8,transform:"translate3d(10px, 0, 0)"},{offset:.9,transform:"translate3d(-10px, 0, 0)"},{offset:1,transform:"translate3d(0, 0, 0)"}],ci=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:.1,transform:"translate3d(0, -10px, 0)"},{offset:.2,transform:"translate3d(0, 10px, 0)"},{offset:.3,transform:"translate3d(0, -10px, 0)"},{offset:.4,transform:"translate3d(0, 10px, 0)"},{offset:.5,transform:"translate3d(0, -10px, 0)"},{offset:.6,transform:"translate3d(0, 10px, 0)"},{offset:.7,transform:"translate3d(0, -10px, 0)"},{offset:.8,transform:"translate3d(0, 10px, 0)"},{offset:.9,transform:"translate3d(0, -10px, 0)"},{offset:1,transform:"translate3d(0, 0, 0)"}],di=[{offset:.2,transform:"rotate3d(0, 0, 1, 15deg)"},{offset:.4,transform:"rotate3d(0, 0, 1, -10deg)"},{offset:.6,transform:"rotate3d(0, 0, 1, 5deg)"},{offset:.8,transform:"rotate3d(0, 0, 1, -5deg)"},{offset:1,transform:"rotate3d(0, 0, 1, 0deg)"}],hi=[{offset:0,transform:"scale3d(1, 1, 1)"},{offset:.1,transform:"scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)"},{offset:.2,transform:"scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)"},{offset:.3,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)"},{offset:.4,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)"},{offset:.5,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)"},{offset:.6,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)"},{offset:.7,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)"},{offset:.8,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)"},{offset:.9,transform:"scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)"},{offset:1,transform:"scale3d(1, 1, 1)"}],ui=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:.15,transform:"translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)"},{offset:.3,transform:"translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)"},{offset:.45,transform:"translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)"},{offset:.6,transform:"translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)"},{offset:.75,transform:"translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)"},{offset:1,transform:"translate3d(0, 0, 0)"}],pi=[{offset:0,transform:"translateY(-1200px) scale(0.7)",opacity:"0.7"},{offset:.8,transform:"translateY(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"scale(1)",opacity:"1"}],fi=[{offset:0,transform:"translateX(-2000px) scale(0.7)",opacity:"0.7"},{offset:.8,transform:"translateX(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"scale(1)",opacity:"1"}],mi=[{offset:0,transform:"translateX(2000px) scale(0.7)",opacity:"0.7"},{offset:.8,transform:"translateX(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"scale(1)",opacity:"1"}],gi=[{offset:0,transform:"translateY(1200px) scale(0.7)",opacity:"0.7"},{offset:.8,transform:"translateY(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"scale(1)",opacity:"1"}],bi=[{offset:0,transform:"scale(1)",opacity:"1"},{offset:.2,transform:"translateY(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"translateY(700px) scale(0.7)",opacity:"0.7"}],vi=[{offset:0,transform:"scale(1)",opacity:"1"},{offset:.2,transform:"translateX(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"translateX(-2000px) scale(0.7)",opacity:"0.7"}],yi=[{offset:0,transform:"scale(1)",opacity:"1"},{offset:.2,transform:"translateX(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"translateX(2000px) scale(0.7)",opacity:"0.7"}],wi=[{offset:0,transform:"scale(1)",opacity:"1"},{offset:.2,transform:"translateY(0px) scale(0.7)",opacity:"0.7"},{offset:1,transform:"translateY(-700px) scale(0.7)",opacity:"0.7"}],_i=[{offset:0,opacity:"0",transform:"scale3d(0.3, 0.3, 0.3)"},{offset:0,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.2,transform:"scale3d(1.1, 1.1, 1.1)"},{offset:.2,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.4,transform:"scale3d(0.9, 0.9, 0.9)"},{offset:.4,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.6,opacity:"1",transform:"scale3d(1.03, 1.03, 1.03)"},{offset:.6,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.8,transform:"scale3d(0.97, 0.97, 0.97)"},{offset:.8,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:1,opacity:"1",transform:"scale3d(1, 1, 1)"},{offset:1,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"}],xi=[{offset:0,opacity:"0",transform:"translate3d(0, -3000px, 0) scaleY(3)"},{offset:0,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.6,opacity:"1",transform:"translate3d(0, 25px, 0) scaleY(0.9)"},{offset:.6,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.75,transform:"translate3d(0, -10px, 0) scaleY(0.95)"},{offset:.75,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.9,transform:"translate3d(0, 5px, 0) scaleY(0.985)"},{offset:.9,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:1,transform:"translate3d(0, 0, 0)"},{offset:1,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"}],ki=[{offset:0,opacity:"0",transform:"translate3d(-3000px, 0, 0) scaleX(3)"},{offset:0,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.6,opacity:"1",transform:"translate3d(25px, 0, 0) scaleX(1)"},{offset:.6,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.75,transform:"translate3d(-10px, 0, 0) scaleX(0.98)"},{offset:.75,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.9,transform:"translate3d(5px, 0, 0) scaleX(0.995)"},{offset:.9,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:1,transform:"translate3d(0, 0, 0)"},{offset:1,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"}],Ci=[{offset:0,opacity:"0",transform:"translate3d(3000px, 0, 0) scaleX(3)"},{offset:0,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.6,opacity:"1",transform:"translate3d(-25px, 0, 0) scaleX(1)"},{offset:.6,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.75,transform:"translate3d(10px, 0, 0) scaleX(0.98)"},{offset:.75,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.9,transform:"translate3d(-5px, 0, 0) scaleX(0.995)"},{offset:.9,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:1,transform:"translate3d(0, 0, 0)"},{offset:1,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"}],$i=[{offset:0,opacity:"0",transform:"translate3d(0, 3000px, 0) scaleY(5)"},{offset:0,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.6,opacity:"1",transform:"translate3d(0, -20px, 0) scaleY(0.9)"},{offset:.6,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.75,transform:"translate3d(0, 10px, 0) scaleY(0.95)"},{offset:.75,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:.9,transform:"translate3d(0, -5px, 0) scaleY(0.985)"},{offset:.9,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"},{offset:1,transform:"translate3d(0, 0, 0)"},{offset:1,easing:"cubic-bezier(0.215, 0.61, 0.355, 1)"}],zi=[{offset:.2,transform:"scale3d(0.9, 0.9, 0.9)"},{offset:.5,opacity:"1",transform:"scale3d(1.1, 1.1, 1.1)"},{offset:.55,opacity:"1",transform:"scale3d(1.1, 1.1, 1.1)"},{offset:1,opacity:"0",transform:"scale3d(0.3, 0.3, 0.3)"}],Si=[{offset:.2,transform:"translate3d(0, 10px, 0) scaleY(0.985)"},{offset:.4,opacity:"1",transform:"translate3d(0, -20px, 0) scaleY(0.9)"},{offset:.45,opacity:"1",transform:"translate3d(0, -20px, 0) scaleY(0.9)"},{offset:1,opacity:"0",transform:"translate3d(0, 2000px, 0) scaleY(3)"}],Ai=[{offset:.2,opacity:"1",transform:"translate3d(20px, 0, 0) scaleX(0.9)"},{offset:1,opacity:"0",transform:"translate3d(-2000px, 0, 0) scaleX(2)"}],Mi=[{offset:.2,opacity:"1",transform:"translate3d(-20px, 0, 0) scaleX(0.9)"},{offset:1,opacity:"0",transform:"translate3d(2000px, 0, 0) scaleX(2)"}],Ti=[{offset:.2,transform:"translate3d(0, -10px, 0) scaleY(0.985)"},{offset:.4,opacity:"1",transform:"translate3d(0, 20px, 0) scaleY(0.9)"},{offset:.45,opacity:"1",transform:"translate3d(0, 20px, 0) scaleY(0.9)"},{offset:1,opacity:"0",transform:"translate3d(0, -2000px, 0) scaleY(3)"}],Di=[{offset:0,opacity:"0"},{offset:1,opacity:"1"}],Ei=[{offset:0,opacity:"0",transform:"translate3d(-100%, 100%, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Ii=[{offset:0,opacity:"0",transform:"translate3d(100%, 100%, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Li=[{offset:0,opacity:"0",transform:"translate3d(0, -100%, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Pi=[{offset:0,opacity:"0",transform:"translate3d(0, -2000px, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Ri=[{offset:0,opacity:"0",transform:"translate3d(-100%, 0, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Vi=[{offset:0,opacity:"0",transform:"translate3d(-2000px, 0, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Fi=[{offset:0,opacity:"0",transform:"translate3d(100%, 0, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Oi=[{offset:0,opacity:"0",transform:"translate3d(2000px, 0, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Bi=[{offset:0,opacity:"0",transform:"translate3d(-100%, -100%, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Hi=[{offset:0,opacity:"0",transform:"translate3d(100%, -100%, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Ni=[{offset:0,opacity:"0",transform:"translate3d(0, 100%, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Ui=[{offset:0,opacity:"0",transform:"translate3d(0, 2000px, 0)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Xi=[{offset:0,opacity:"1"},{offset:1,opacity:"0"}],Ki=[{offset:0,opacity:"1",transform:"translate3d(0, 0, 0)"},{offset:1,opacity:"0",transform:"translate3d(-100%, 100%, 0)"}],qi=[{offset:0,opacity:"1",transform:"translate3d(0, 0, 0)"},{offset:1,opacity:"0",transform:"translate3d(100%, 100%, 0)"}],Yi=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(0, 100%, 0)"}],Gi=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(0, 2000px, 0)"}],Wi=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(-100%, 0, 0)"}],ji=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(-2000px, 0, 0)"}],Qi=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(100%, 0, 0)"}],Zi=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(2000px, 0, 0)"}],Ji=[{offset:0,opacity:"1",transform:"translate3d(0, 0, 0)"},{offset:1,opacity:"0",transform:"translate3d(-100%, -100%, 0)"}],tr=[{offset:0,opacity:"1",transform:"translate3d(0, 0, 0)"},{offset:1,opacity:"0",transform:"translate3d(100%, -100%, 0)"}],er=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(0, -100%, 0)"}],sr=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(0, -2000px, 0)"}],ir=[{offset:0,transform:"perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg)",easing:"ease-out"},{offset:.4,transform:`perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
|
3371
|
-
rotate3d(0, 1, 0, -190deg)`,easing:"ease-out"},{offset:.5,transform:`perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
|
3372
|
-
rotate3d(0, 1, 0, -170deg)`,easing:"ease-in"},{offset:.8,transform:`perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
|
|
3373
|
-
rotate3d(0, 1, 0, 0deg)`,easing:"ease-in"},{offset:1,transform:"perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg)",easing:"ease-in"}],rr=[{offset:0,transform:"perspective(400px) rotate3d(1, 0, 0, 90deg)",easing:"ease-in",opacity:"0"},{offset:.4,transform:"perspective(400px) rotate3d(1, 0, 0, -20deg)",easing:"ease-in"},{offset:.6,transform:"perspective(400px) rotate3d(1, 0, 0, 10deg)",opacity:"1"},{offset:.8,transform:"perspective(400px) rotate3d(1, 0, 0, -5deg)"},{offset:1,transform:"perspective(400px)"}],or=[{offset:0,transform:"perspective(400px) rotate3d(0, 1, 0, 90deg)",easing:"ease-in",opacity:"0"},{offset:.4,transform:"perspective(400px) rotate3d(0, 1, 0, -20deg)",easing:"ease-in"},{offset:.6,transform:"perspective(400px) rotate3d(0, 1, 0, 10deg)",opacity:"1"},{offset:.8,transform:"perspective(400px) rotate3d(0, 1, 0, -5deg)"},{offset:1,transform:"perspective(400px)"}],ar=[{offset:0,transform:"perspective(400px)"},{offset:.3,transform:"perspective(400px) rotate3d(1, 0, 0, -20deg)",opacity:"1"},{offset:1,transform:"perspective(400px) rotate3d(1, 0, 0, 90deg)",opacity:"0"}],nr=[{offset:0,transform:"perspective(400px)"},{offset:.3,transform:"perspective(400px) rotate3d(0, 1, 0, -15deg)",opacity:"1"},{offset:1,transform:"perspective(400px) rotate3d(0, 1, 0, 90deg)",opacity:"0"}],lr=[{offset:0,transform:"translate3d(-100%, 0, 0) skewX(30deg)",opacity:"0"},{offset:.6,transform:"skewX(-20deg)",opacity:"1"},{offset:.8,transform:"skewX(5deg)"},{offset:1,transform:"translate3d(0, 0, 0)"}],cr=[{offset:0,transform:"translate3d(100%, 0, 0) skewX(-30deg)",opacity:"0"},{offset:.6,transform:"skewX(20deg)",opacity:"1"},{offset:.8,transform:"skewX(-5deg)"},{offset:1,transform:"translate3d(0, 0, 0)"}],dr=[{offset:0,opacity:"1"},{offset:1,transform:"translate3d(-100%, 0, 0) skewX(-30deg)",opacity:"0"}],hr=[{offset:0,opacity:"1"},{offset:1,transform:"translate3d(100%, 0, 0) skewX(30deg)",opacity:"0"}],ur=[{offset:0,transform:"rotate3d(0, 0, 1, -200deg)",opacity:"0"},{offset:1,transform:"translate3d(0, 0, 0)",opacity:"1"}],pr=[{offset:0,transform:"rotate3d(0, 0, 1, -45deg)",opacity:"0"},{offset:1,transform:"translate3d(0, 0, 0)",opacity:"1"}],fr=[{offset:0,transform:"rotate3d(0, 0, 1, 45deg)",opacity:"0"},{offset:1,transform:"translate3d(0, 0, 0)",opacity:"1"}],mr=[{offset:0,transform:"rotate3d(0, 0, 1, 45deg)",opacity:"0"},{offset:1,transform:"translate3d(0, 0, 0)",opacity:"1"}],gr=[{offset:0,transform:"rotate3d(0, 0, 1, -90deg)",opacity:"0"},{offset:1,transform:"translate3d(0, 0, 0)",opacity:"1"}],br=[{offset:0,opacity:"1"},{offset:1,transform:"rotate3d(0, 0, 1, 200deg)",opacity:"0"}],vr=[{offset:0,opacity:"1"},{offset:1,transform:"rotate3d(0, 0, 1, 45deg)",opacity:"0"}],yr=[{offset:0,opacity:"1"},{offset:1,transform:"rotate3d(0, 0, 1, -45deg)",opacity:"0"}],wr=[{offset:0,opacity:"1"},{offset:1,transform:"rotate3d(0, 0, 1, -45deg)",opacity:"0"}],_r=[{offset:0,opacity:"1"},{offset:1,transform:"rotate3d(0, 0, 1, 90deg)",opacity:"0"}],xr=[{offset:0,transform:"translate3d(0, -100%, 0)",visibility:"visible"},{offset:1,transform:"translate3d(0, 0, 0)"}],kr=[{offset:0,transform:"translate3d(-100%, 0, 0)",visibility:"visible"},{offset:1,transform:"translate3d(0, 0, 0)"}],Cr=[{offset:0,transform:"translate3d(100%, 0, 0)",visibility:"visible"},{offset:1,transform:"translate3d(0, 0, 0)"}],$r=[{offset:0,transform:"translate3d(0, 100%, 0)",visibility:"visible"},{offset:1,transform:"translate3d(0, 0, 0)"}],zr=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:1,visibility:"hidden",transform:"translate3d(0, 100%, 0)"}],Sr=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:1,visibility:"hidden",transform:"translate3d(-100%, 0, 0)"}],Ar=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:1,visibility:"hidden",transform:"translate3d(100%, 0, 0)"}],Mr=[{offset:0,transform:"translate3d(0, 0, 0)"},{offset:1,visibility:"hidden",transform:"translate3d(0, -100%, 0)"}],Tr=[{offset:0,easing:"ease-in-out"},{offset:.2,transform:"rotate3d(0, 0, 1, 80deg)",easing:"ease-in-out"},{offset:.4,transform:"rotate3d(0, 0, 1, 60deg)",easing:"ease-in-out",opacity:"1"},{offset:.6,transform:"rotate3d(0, 0, 1, 80deg)",easing:"ease-in-out"},{offset:.8,transform:"rotate3d(0, 0, 1, 60deg)",easing:"ease-in-out",opacity:"1"},{offset:1,transform:"translate3d(0, 700px, 0)",opacity:"0"}],Dr=[{offset:0,opacity:"0",transform:"scale(0.1) rotate(30deg)","transform-origin":"center bottom"},{offset:.5,transform:"rotate(-10deg)"},{offset:.7,transform:"rotate(3deg)"},{offset:1,opacity:"1",transform:"scale(1)"}],Er=[{offset:0,opacity:"0",transform:"translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)"},{offset:1,opacity:"1",transform:"translate3d(0, 0, 0)"}],Ir=[{offset:0,opacity:"1"},{offset:1,opacity:"0",transform:"translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)"}],Lr=[{offset:0,opacity:"0",transform:"scale3d(0.3, 0.3, 0.3)"},{offset:.5,opacity:"1"}],Pr=[{offset:0,opacity:"0",transform:"scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0)",easing:"cubic-bezier(0.55, 0.055, 0.675, 0.19)"},{offset:.6,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0)",easing:"cubic-bezier(0.175, 0.885, 0.32, 1)"}],Rr=[{offset:0,opacity:"0",transform:"scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0)",easing:"cubic-bezier(0.55, 0.055, 0.675, 0.19)"},{offset:.6,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0)",easing:"cubic-bezier(0.175, 0.885, 0.32, 1)"}],Vr=[{offset:0,opacity:"0",transform:"scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0)",easing:"cubic-bezier(0.55, 0.055, 0.675, 0.19)"},{offset:.6,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0)",easing:"cubic-bezier(0.175, 0.885, 0.32, 1)"}],Fr=[{offset:0,opacity:"0",transform:"scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0)",easing:"cubic-bezier(0.55, 0.055, 0.675, 0.19)"},{offset:.6,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0)",easing:"cubic-bezier(0.175, 0.885, 0.32, 1)"}],Or=[{offset:0,opacity:"1"},{offset:.5,opacity:"0",transform:"scale3d(0.3, 0.3, 0.3)"},{offset:1,opacity:"0"}],Br=[{offset:.4,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0)",easing:"cubic-bezier(0.55, 0.055, 0.675, 0.19)"},{offset:1,opacity:"0",transform:"scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0)",easing:"cubic-bezier(0.175, 0.885, 0.32, 1)"}],Hr=[{offset:.4,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0)"},{offset:1,opacity:"0",transform:"scale(0.1) translate3d(-2000px, 0, 0)"}],Nr=[{offset:.4,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0)"},{offset:1,opacity:"0",transform:"scale(0.1) translate3d(2000px, 0, 0)"}],Ur=[{offset:.4,opacity:"1",transform:"scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0)",easing:"cubic-bezier(0.55, 0.055, 0.675, 0.19)"},{offset:1,opacity:"0",transform:"scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0)",easing:"cubic-bezier(0.175, 0.885, 0.32, 1)"}],De={linear:"linear",ease:"ease",easeIn:"ease-in",easeOut:"ease-out",easeInOut:"ease-in-out",easeInSine:"cubic-bezier(0.47, 0, 0.745, 0.715)",easeOutSine:"cubic-bezier(0.39, 0.575, 0.565, 1)",easeInOutSine:"cubic-bezier(0.445, 0.05, 0.55, 0.95)",easeInQuad:"cubic-bezier(0.55, 0.085, 0.68, 0.53)",easeOutQuad:"cubic-bezier(0.25, 0.46, 0.45, 0.94)",easeInOutQuad:"cubic-bezier(0.455, 0.03, 0.515, 0.955)",easeInCubic:"cubic-bezier(0.55, 0.055, 0.675, 0.19)",easeOutCubic:"cubic-bezier(0.215, 0.61, 0.355, 1)",easeInOutCubic:"cubic-bezier(0.645, 0.045, 0.355, 1)",easeInQuart:"cubic-bezier(0.895, 0.03, 0.685, 0.22)",easeOutQuart:"cubic-bezier(0.165, 0.84, 0.44, 1)",easeInOutQuart:"cubic-bezier(0.77, 0, 0.175, 1)",easeInQuint:"cubic-bezier(0.755, 0.05, 0.855, 0.06)",easeOutQuint:"cubic-bezier(0.23, 1, 0.32, 1)",easeInOutQuint:"cubic-bezier(0.86, 0, 0.07, 1)",easeInExpo:"cubic-bezier(0.95, 0.05, 0.795, 0.035)",easeOutExpo:"cubic-bezier(0.19, 1, 0.22, 1)",easeInOutExpo:"cubic-bezier(1, 0, 0, 1)",easeInCirc:"cubic-bezier(0.6, 0.04, 0.98, 0.335)",easeOutCirc:"cubic-bezier(0.075, 0.82, 0.165, 1)",easeInOutCirc:"cubic-bezier(0.785, 0.135, 0.15, 0.86)",easeInBack:"cubic-bezier(0.6, -0.28, 0.735, 0.045)",easeOutBack:"cubic-bezier(0.175, 0.885, 0.32, 1.275)",easeInOutBack:"cubic-bezier(0.68, -0.55, 0.265, 1.55)"},Xr=Object.freeze(Object.defineProperty({__proto__:null,backInDown:pi,backInLeft:fi,backInRight:mi,backInUp:gi,backOutDown:bi,backOutLeft:vi,backOutRight:yi,backOutUp:wi,bounce:ti,bounceIn:_i,bounceInDown:xi,bounceInLeft:ki,bounceInRight:Ci,bounceInUp:$i,bounceOut:zi,bounceOutDown:Si,bounceOutLeft:Ai,bounceOutRight:Mi,bounceOutUp:Ti,easings:De,fadeIn:Di,fadeInBottomLeft:Ei,fadeInBottomRight:Ii,fadeInDown:Li,fadeInDownBig:Pi,fadeInLeft:Ri,fadeInLeftBig:Vi,fadeInRight:Fi,fadeInRightBig:Oi,fadeInTopLeft:Bi,fadeInTopRight:Hi,fadeInUp:Ni,fadeInUpBig:Ui,fadeOut:Xi,fadeOutBottomLeft:Ki,fadeOutBottomRight:qi,fadeOutDown:Yi,fadeOutDownBig:Gi,fadeOutLeft:Wi,fadeOutLeftBig:ji,fadeOutRight:Qi,fadeOutRightBig:Zi,fadeOutTopLeft:Ji,fadeOutTopRight:tr,fadeOutUp:er,fadeOutUpBig:sr,flash:ei,flip:ir,flipInX:rr,flipInY:or,flipOutX:ar,flipOutY:nr,headShake:si,heartBeat:ii,hinge:Tr,jackInTheBox:Dr,jello:ri,lightSpeedInLeft:lr,lightSpeedInRight:cr,lightSpeedOutLeft:dr,lightSpeedOutRight:hr,pulse:oi,rollIn:Er,rollOut:Ir,rotateIn:ur,rotateInDownLeft:pr,rotateInDownRight:fr,rotateInUpLeft:mr,rotateInUpRight:gr,rotateOut:br,rotateOutDownLeft:vr,rotateOutDownRight:yr,rotateOutUpLeft:wr,rotateOutUpRight:_r,rubberBand:ai,shake:ni,shakeX:li,shakeY:ci,slideInDown:xr,slideInLeft:kr,slideInRight:Cr,slideInUp:$r,slideOutDown:zr,slideOutLeft:Sr,slideOutRight:Ar,slideOutUp:Mr,swing:di,tada:hi,wobble:ui,zoomIn:Lr,zoomInDown:Pr,zoomInLeft:Rr,zoomInRight:Vr,zoomInUp:Fr,zoomOut:Or,zoomOutDown:Br,zoomOutLeft:Hr,zoomOutRight:Nr,zoomOutUp:Ur},Symbol.toStringTag,{value:"Module"}));var Kr=E`
|
|
3374
|
-
:host {
|
|
3375
|
-
display: contents;
|
|
3376
|
-
}
|
|
3377
|
-
`,G=class extends A{constructor(){super(...arguments),this.hasStarted=!1,this.name="none",this.play=!1,this.delay=0,this.direction="normal",this.duration=1e3,this.easing="linear",this.endDelay=0,this.fill="auto",this.iterations=1/0,this.iterationStart=0,this.playbackRate=1,this.handleAnimationFinish=()=>{this.play=!1,this.hasStarted=!1,this.emit("sl-finish")},this.handleAnimationCancel=()=>{this.play=!1,this.hasStarted=!1,this.emit("sl-cancel")}}get currentTime(){var t,e;return(e=(t=this.animation)==null?void 0:t.currentTime)!=null?e:0}set currentTime(t){this.animation&&(this.animation.currentTime=t)}connectedCallback(){super.connectedCallback(),this.createAnimation()}disconnectedCallback(){super.disconnectedCallback(),this.destroyAnimation()}handleSlotChange(){this.destroyAnimation(),this.createAnimation()}async createAnimation(){var t,e;const s=(t=De[this.easing])!=null?t:this.easing,r=(e=this.keyframes)!=null?e:Xr[this.name],n=(await this.defaultSlot).assignedElements()[0];return!n||!r?!1:(this.destroyAnimation(),this.animation=n.animate(r,{delay:this.delay,direction:this.direction,duration:this.duration,easing:s,endDelay:this.endDelay,fill:this.fill,iterationStart:this.iterationStart,iterations:this.iterations}),this.animation.playbackRate=this.playbackRate,this.animation.addEventListener("cancel",this.handleAnimationCancel),this.animation.addEventListener("finish",this.handleAnimationFinish),this.play?(this.hasStarted=!0,this.emit("sl-start")):this.animation.pause(),!0)}destroyAnimation(){this.animation&&(this.animation.cancel(),this.animation.removeEventListener("cancel",this.handleAnimationCancel),this.animation.removeEventListener("finish",this.handleAnimationFinish),this.hasStarted=!1)}handleAnimationChange(){this.hasUpdated&&this.createAnimation()}handlePlayChange(){return this.animation?(this.play&&!this.hasStarted&&(this.hasStarted=!0,this.emit("sl-start")),this.play?this.animation.play():this.animation.pause(),!0):!1}handlePlaybackRateChange(){this.animation&&(this.animation.playbackRate=this.playbackRate)}cancel(){var t;(t=this.animation)==null||t.cancel()}finish(){var t;(t=this.animation)==null||t.finish()}render(){return _` <slot @slotchange=${this.handleSlotChange}></slot> `}};G.styles=[I,Kr];i([We("slot")],G.prototype,"defaultSlot",2);i([a()],G.prototype,"name",2);i([a({type:Boolean,reflect:!0})],G.prototype,"play",2);i([a({type:Number})],G.prototype,"delay",2);i([a()],G.prototype,"direction",2);i([a({type:Number})],G.prototype,"duration",2);i([a()],G.prototype,"easing",2);i([a({attribute:"end-delay",type:Number})],G.prototype,"endDelay",2);i([a()],G.prototype,"fill",2);i([a({type:Number})],G.prototype,"iterations",2);i([a({attribute:"iteration-start",type:Number})],G.prototype,"iterationStart",2);i([a({attribute:!1})],G.prototype,"keyframes",2);i([a({attribute:"playback-rate",type:Number})],G.prototype,"playbackRate",2);i([x(["name","delay","direction","duration","easing","endDelay","fill","iterations","iterationsStart","keyframes"])],G.prototype,"handleAnimationChange",1);i([x("play")],G.prototype,"handlePlayChange",1);i([x("playbackRate")],G.prototype,"handlePlaybackRateChange",1);G.define("sl-animation");
|
|
3378
|
-
//# sourceMappingURL=chunk.JQBT7BOV-BKSO0Hfn.js.map
|