diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/.npmignore b/node_modules/@duckduckgo/privacy-dashboard/build/app/.npmignore new file mode 100644 index 000000000000..f9be8dfe0908 --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/.npmignore @@ -0,0 +1 @@ +!* diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/font/.npmignore b/node_modules/@duckduckgo/privacy-dashboard/build/app/font/.npmignore new file mode 100644 index 000000000000..f9be8dfe0908 --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/font/.npmignore @@ -0,0 +1 @@ +!* diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/html/.npmignore b/node_modules/@duckduckgo/privacy-dashboard/build/app/html/.npmignore new file mode 100644 index 000000000000..f9be8dfe0908 --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/html/.npmignore @@ -0,0 +1 @@ +!* diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/html/iframe.html b/node_modules/@duckduckgo/privacy-dashboard/build/app/html/iframe.html new file mode 100644 index 000000000000..d9775b4af4d8 --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/html/iframe.html @@ -0,0 +1,13 @@ + + + + + Debug + + + + +
+ + + diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/img/.npmignore b/node_modules/@duckduckgo/privacy-dashboard/build/app/img/.npmignore new file mode 100644 index 000000000000..f9be8dfe0908 --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/img/.npmignore @@ -0,0 +1 @@ +!* diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/img/refresh-assets/Success-128.svg b/node_modules/@duckduckgo/privacy-dashboard/build/app/img/refresh-assets/Success-128.svg new file mode 100644 index 000000000000..7c8856b2409b --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/img/refresh-assets/Success-128.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/img/refresh-assets/chrevron--down.svg b/node_modules/@duckduckgo/privacy-dashboard/build/app/img/refresh-assets/chrevron--down.svg new file mode 100644 index 000000000000..cc56c0d0f41f --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/img/refresh-assets/chrevron--down.svg @@ -0,0 +1,3 @@ + + + diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/.npmignore b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/.npmignore new file mode 100644 index 000000000000..f9be8dfe0908 --- /dev/null +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/.npmignore @@ -0,0 +1 @@ +!* diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/base.css b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/base.css index 2721c686a2f4..ed05839d21dd 100644 --- a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/base.css +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/base.css @@ -8,6 +8,21 @@ /* CSS Arrow */ /* links */ /** Separators */ +/** Latest color pallette as CSS custom properties */ +body { + --color-blue-0: #ccdaff; + --color-blue-10: #adc2fc; + --color-blue-20: #8fabf9; + --color-blue-30: #7295f6; + --color-blue-40: #557ff3; + --color-blue-50: #3969ef; + --color-blue-60: #2b55ca; + --color-blue-70: #1e42a4; + --color-blue-80: #14307e; + --color-blue-90: #0b2059; + --color-blue-100: #051133; +} + /* Status icons */ /* Colors */ /* Dark theme */ @@ -18,6 +33,21 @@ /* CSS Arrow */ /* links */ /** Separators */ +/** Latest color pallette as CSS custom properties */ +body { + --color-blue-0: #ccdaff; + --color-blue-10: #adc2fc; + --color-blue-20: #8fabf9; + --color-blue-30: #7295f6; + --color-blue-40: #557ff3; + --color-blue-50: #3969ef; + --color-blue-60: #2b55ca; + --color-blue-70: #1e42a4; + --color-blue-80: #14307e; + --color-blue-90: #0b2059; + --color-blue-100: #051133; +} + /* Logo */ /* Font groupings */ .uppercase { diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/popup.css b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/popup.css index 4d02f2bf9b19..8b7eabaedd12 100644 --- a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/popup.css +++ b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/css/popup.css @@ -9,6 +9,21 @@ /* CSS Arrow */ /* links */ /** Separators */ +/** Latest color pallette as CSS custom properties */ +body { + --color-blue-0: #ccdaff; + --color-blue-10: #adc2fc; + --color-blue-20: #8fabf9; + --color-blue-30: #7295f6; + --color-blue-40: #557ff3; + --color-blue-50: #3969ef; + --color-blue-60: #2b55ca; + --color-blue-70: #1e42a4; + --color-blue-80: #14307e; + --color-blue-90: #0b2059; + --color-blue-100: #051133; +} + /* Status icons */ /* Colors */ /* Dark theme */ @@ -19,6 +34,21 @@ /* CSS Arrow */ /* links */ /** Separators */ +/** Latest color pallette as CSS custom properties */ +body { + --color-blue-0: #ccdaff; + --color-blue-10: #adc2fc; + --color-blue-20: #8fabf9; + --color-blue-30: #7295f6; + --color-blue-40: #557ff3; + --color-blue-50: #3969ef; + --color-blue-60: #2b55ca; + --color-blue-70: #1e42a4; + --color-blue-80: #14307e; + --color-blue-90: #0b2059; + --color-blue-100: #051133; +} + /* Logo */ /* Font groupings */ .uppercase { @@ -145,26 +175,10 @@ line-height: 20px; } -.token-breakage-form-body { - font-size: 13px; - font-weight: 400; - line-height: 16px; -} -.environment--android .token-breakage-form-body { - font-size: 16px; - font-weight: 400; - line-height: 20px; - letter-spacing: 0em; -} -.environment--browser .token-breakage-form-body { - font-size: 14px; - font-weight: 400; - line-height: 18px; -} -.environment--windows .token-breakage-form-body { - font-size: 14px; - font-weight: 400; - line-height: 20px; +.token-headline-2 { + font-size: 20px; + font-weight: 500; + line-height: 1.2; } .token-headline-2 { @@ -223,6 +237,7 @@ body { --page-outer-bg: #eee; --color-text-primary: rgba(0, 0, 0, 0.84); --color-text-secondary: rgba(0, 0, 0, 0.6); + --color-button-primary: #fff; --color-accent-blue: #3969ef; --color-accent-blue-active: #1e42a4; --color-lines-light: rgba(0, 0, 0, 0.12); @@ -289,6 +304,7 @@ body.body--theme-dark { --page-outer-bg: #34383b; --color-text-primary: rgba(255, 255, 255, 0.84); --color-text-secondary: rgba(255, 255, 255, 0.6); + --color-button-primary: rgba(0, 0, 0, 0.84); --color-accent-blue: #7295f6; --color-accent-blue-active: #8fabf9; --color-lines-light: rgba(255, 255, 255, 0.18); @@ -1042,11 +1058,14 @@ body.environment--windows { .key-insight[data-suffix=about-link] { padding-bottom: 12px; } +.environment--android .key-insight, .environment--ios .key-insight { + padding-top: 24px; +} .environment--browser .key-insight { background-color: transparent; } -.environment--ios .key-insight { - padding-top: 6px; +.environment--macos .key-insight, .environment--windows .key-insight { + padding-top: 32px; } .key-insight .token-title-3-em { margin-bottom: 8px; @@ -1056,27 +1075,11 @@ body.environment--windows { height: 96px; background-position: center center; background-repeat: no-repeat; - margin-bottom: 24px; + margin-bottom: 8px; background-size: contain; } -.environment--macos .key-insight__icon { - margin-bottom: 20px; -} -.environment--windows .key-insight__icon { - margin-bottom: 20px; -} -.environment--browser .key-insight__icon { - margin-bottom: 12px; -} - -.environment--macos .key-insight--main { - padding-bottom: 20px; -} -.environment--windows .key-insight--main { - padding-bottom: 20px; -} -.environment--browser .key-insight--main { - padding-bottom: 12px; +.environment--browser .key-insight__icon, .environment--macos .key-insight__icon, .environment--windows .key-insight__icon { + margin-bottom: 6px; } .key-insight--breakage { @@ -1093,7 +1096,7 @@ body { --nav-height: 56px; } body.environment--macos, body.environment--browser, body.environment--windows, body.environment--example { - --nav-height: var(--size-unit-double); + --nav-height: 48px; } .top-nav { @@ -1112,7 +1115,7 @@ body.environment--macos, body.environment--browser, body.environment--windows, b .top-nav__back { position: absolute; padding: var(--size-unit-half); - left: var(--size-unit-half); + left: var(--size-unit); top: 50%; transform: translateY(-50%); display: flex; @@ -1134,24 +1137,19 @@ body.environment--macos, body.environment--browser, body.environment--windows, b opacity: 0.5; } .environment--macos .top-nav__back, .environment--browser .top-nav__back, .environment--windows .top-nav__back, .environment--example .top-nav__back { + align-items: center; border-radius: 0; bottom: 0; + display: flex; + height: var(--nav-height); padding: 0; - height: 32px; - width: 32px; -} -.environment--macos .top-nav__back .icon, .environment--browser .top-nav__back .icon, .environment--windows .top-nav__back .icon, .environment--example .top-nav__back .icon { - position: absolute; - left: 50%; - transform: translateX(-50%) translateY(100%); - width: 15px; - height: 15px; + width: var(--nav-height); } .top-nav__done { position: absolute; padding: 0 var(--size-unit-half); - right: var(--size-unit-half); + right: var(--size-unit); height: var(--nav-height); line-height: var(--nav-height); color: var(--color-text-primary); @@ -1167,11 +1165,6 @@ body.environment--macos, body.environment--browser, body.environment--windows, b .environment--ios .top-nav__done:active { opacity: 0.5; } -.environment--macos .top-nav__done { - height: auto; - line-height: normal; - bottom: 0; -} .top-nav__cancel { position: absolute; @@ -3152,17 +3145,15 @@ body.environment--macos, body.environment--browser, body.environment--windows, b border-top: 1px solid var(--color-lines-lighter); } -.environment--browser .breakage-form { - padding-bottom: 0; +.breakage-screen { + max-height: 100vh; + /* Prevents macOS popover from shrinking too much */ } - -.breakage-form__content { - z-index: 1; - position: relative; - text-align: center; +.breakage-screen--choice { + padding-bottom: 16px; } -[data-state=sent] .breakage-form__content { - display: none; +.environment--macos .breakage-screen--form { + min-height: 500px; } .breakage-form__close-container { @@ -3178,9 +3169,6 @@ body.environment--macos, body.environment--browser, body.environment--windows, b } .breakage-form__element { - display: flex; - flex-direction: column; - gap: 24px; opacity: 1; transition: all 0.2s ease-in-out; } @@ -3206,12 +3194,6 @@ body.environment--macos, body.environment--browser, body.environment--windows, b text-align: left; } -.form__group { - display: flex; - flex-direction: column; - gap: 16px; -} - .form__select { width: 100%; } @@ -3231,90 +3213,203 @@ body.environment--macos, body.environment--browser, body.environment--windows, b min-height: 34px; } -.form__textarea { - resize: none; - width: 100%; - height: 88px; - display: block; - box-sizing: border-box; - padding: var(--size-unit-half) var(--size-unit); - border: 1px solid var(--color-lines-light); - border-radius: 4px; - font-size: 13px; - line-height: 16px; +.form__error-message { + color: #eb102d; + font-size: 12px; + line-height: 1.3333333333; + padding: 0 16px; } -.form__textarea::placeholder { - color: rgba(0, 0, 0, 0.6); +.body--theme-dark .form__error-message { + color: #ff545a; } -.body--theme-dark .form__textarea { - background-color: rgba(255, 255, 255, 0.12); - border-color: var(--color-lines-light); + +.form__description-prompt { + color: rgba(0, 0, 0, 0.6); + font-size: 12px; + line-height: 1.3333333333; + list-style: none; } -.body--theme-dark .form__textarea::placeholder { - color: rgba(255, 255, 255, 0.6); +.body--theme-dark .form__description-prompt { + color: rgba(255, 255, 255, 0.5); } -.environment--macos .form__textarea { - height: 102px; +.form__description-prompt li { + display: inline; } -.environment--windows .form__textarea { - height: 102px; - line-height: 20px; +.form__description-prompt li::after { + content: " "; } +/* TODO: Move button to shared component, primary variant */ .form__submit { - text-align: center; - padding: 10px 12px; + --submit-button-background: var(--color-accent-blue); + --submit-button-border-radius: 8px; + --submit-button-border: none; + --submit-button-box-shadow: none; + --submit-button-color: var(--color-button-primary); + --submit-button-font-size: 15px; + --submit-button-font-weight: 600; + --submit-button-height: 50px; + --submit-button-line-height: calc(20 / 15); + --submit-button-opacity: 1; + --submit-button-padding: 0 24px; + background: var(--submit-button-background); + border: var(--submit-button-border); + border-radius: var(--submit-button-border-radius); + box-shadow: var(--submit-button-box-shadow); + color: var(--submit-button-color); + font-size: var(--submit-button-font-size); + font-weight: var(--submit-button-font-weight); + height: var(--submit-button-height); + line-height: var(--submit-button-line-height); + opacity: var(--submit-button-opacity); + padding: var(--submit-button-padding); cursor: pointer; display: block; + font-family: system, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + text-align: center; text-decoration: none; width: 100%; - box-shadow: var(--btn-accent-shadow); - border-radius: var(--btn-accent-border-radius); - border: var(--btn-accent-border); - color: var(--btn-accent-color); - background: var(--btn-accent-bg); - /* https://www.figma.com/file/DBZiXJRgTTJTuBeWAPyE5h/Desktop-Components?node-id=9113%3A130956&t=de8DMDVt8GbRBQub-0 */ + /* Platform-specific button styles */ } .form__submit:hover { - background: var(--btn-accent-bg-hover); + --submit-button-background: var(--color-blue-60); } .form__submit:active { - background: var(--btn-accent-bg-active); + --submit-button-background: var(--color-blue-70); +} +.form__submit:disabled { + --submit-button-background: rgba(0, 0, 0, 0.06); + --submit-button-color: rgba(0, 0, 0, 0.36); + cursor: default; +} +.body--theme-dark .form__submit:hover { + --submit-button-background: var(--color-blue-40); +} +.body--theme-dark .form__submit:active { + --submit-button-background: var(--color-blue-50); +} +.body--theme-dark .form__submit:disabled { + --submit-button-background: rgba(255, 255, 255, 0.18); + --submit-button-color: rgba(255, 255, 255, 0.36); +} +.environment--android .form__submit { + --submit-button-font-size: 15px; + --submit-button-font-weight: 700; + --submit-button-line-height: calc(20 / 15); + --submit-button-height: 48px; +} +.environment--browser .form__submit { + --submit-button-font-size: 16px; + --submit-button-font-weight: 700; + --submit-button-line-height: normal; + --submit-button-height: 44px; + --submit-button-padding: 0 20px; +} +.environment--ios .form__submit { + --submit-button-font-size: 15px; + --submit-button-font-weight: 600; + --submit-button-line-height: calc(20 / 15); + --submit-button-height: 50px; +} +.environment--macos .form__submit { + --submit-button-background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%), #2749db; + --submit-button-border-radius: 6px; + --submit-button-box-shadow: 0px 0.5px 0px 0px rgba(255, 255, 255, 0) inset, 0px 1px 0px 0px rgba(255, 255, 255, 0) inset, + 0px 0px 0px 0.5px rgba(0, 122, 255, 0.05), 0px 0px 1px 0px rgba(0, 122, 255, 0.05), 0px 1px 1px 0px rgba(0, 122, 255, 0.1); + --submit-button-color: #fff; + --submit-button-font-size: 13px; + --submit-button-font-weight: 400; + --submit-button-height: 32px; + --submit-button-line-height: 1; + --submit-button-padding: 0 16px; +} +.environment--macos .form__submit:focus { + --submit-button-box-shadow: 0px 0px 0px 2.5px rgba(57, 105, 239, 0.55), 0px 0px 0px 1px rgba(57, 105, 239, 0.55) inset, + 0px 0px 1px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.1); +} +.environment--macos .form__submit:active { + --submit-button-background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%), #1743d1; + --submit-button-box-shadow: 0px 0.5px 0px 0px rgba(255, 255, 255, 0) inset, 0px 1px 0px 0px rgba(255, 255, 255, 0) inset, + 0px 0px 0px 0.5px rgba(0, 122, 255, 0.05), 0px 0px 1px 0px rgba(0, 122, 255, 0.05), 0px 1px 1px 0px rgba(0, 122, 255, 0.1); + --submit-button-color: rgba(255, 255, 255, 0.8); +} +.environment--macos .form__submit:disabled { + --submit-button-background: #fff; + --submit-button-box-shadow: 0px 0.5px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 0px 0px rgba(255, 255, 255, 0.05) inset, + 0px 0px 0px 0.5px rgba(0, 0, 0, 0.1), 0px 0px 1px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.2); + --submit-button-color: rgba(0, 0, 0, 0.84); + --submit-button-opacity: 0.4; +} +.body--theme-dark.environment--macos .form__submit { + --submit-button-background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%), #2749db; + --submit-button-box-shadow: 0px 0.5px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 0px 0px rgba(255, 255, 255, 0.05) inset, + 0px 0px 0px 0.5px rgba(0, 0, 0, 0.1), 0px 0px 1px 0px rgba(0, 0, 0, 0.1), 0px 1px 1px 0px rgba(0, 0, 0, 0.15); +} +.body--theme-dark.environment--macos .form__submit:focus { + --submit-button-box-shadow: 0px 0px 0px 2.5px rgba(57, 105, 239, 0.55), 0px 0px 0px 1px rgba(57, 105, 239, 0.55) inset, + 0px 0px 1px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.1); +} +.body--theme-dark.environment--macos .form__submit:active { + --submit-button-background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%), #3259c9; + --submit-button-box-shadow: 0px 0.5px 0px 0px rgba(255, 255, 255, 0.2) inset, + 0px 1px 0px 0px rgba(255, 255, 255, 0.05) inset, 0px 0px 0px 0.5px rgba(0, 0, 0, 0.1), + 0px 0px 1px 0px rgba(0, 0, 0, 0.1), 0px 1px 1px 0px rgba(0, 0, 0, 0.15); + --submit-button-color: rgba(255, 255, 255, 0.8); +} +.body--theme-dark.environment--macos .form__submit:disabled { + --submit-button-background: rgba(255, 255, 255, 0.28); + --submit-button-box-shadow: 0px 0.5px 0px 0px rgba(255, 255, 255, 0.2) inset, + 0px 1px 0px 0px rgba(255, 255, 255, 0.05) inset, 0px 0px 0px 0.5px rgba(0, 0, 0, 0.1), + 0px 0px 1px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.2); + --submit-button-color: rgba(255, 255, 255, 0.84); } + .environment--windows .form__submit { - /* Windows/Label */ - box-shadow: none; - font-style: normal; - font-weight: 400; - font-size: 14px; - line-height: 19px; - border-radius: 4px; + --submit-button-border-radius: 6px; + --submit-button-font-size: 14px; + --submit-button-font-weight: 400; + --submit-button-line-height: normal; + --submit-button-height: 40px; + --submit-button-padding: 0 16px; } .environment--windows .form__submit:focus { - /* todo(Shane): where does this live? */ - box-shadow: 0px 0px 0px 1px #ffffff, 0px 0px 0px 3px #3969ef; + --submit-button-box-shadow: 0px 0px 0px 1px #fff, 0px 0px 0px 3px var(--color-blue-50); } .environment--windows .form__submit:active { - box-shadow: none; + --submit-button-box-shadow: none; } - -.breakage-form__footer { - padding-bottom: 24px; - padding-top: 24px; - text-align: center; +.environment--windows .form__submit:disabled { + --submit-button-background: rgba(0, 0, 0, 0.36); + --submit-button-color: rgba(255, 255, 255, 0.4); } -.body--theme-dark .breakage-form__footer { - color: rgba(255, 255, 255, 0.5); +.body--theme-dark.environment--windows .form__submit { + --submit-button-background: var(--color-blue-20); } -.environment--browser .breakage-form__footer { - margin-top: auto; +.body--theme-dark.environment--windows .form__submit:hover { + --submit-button-background: var(--color-blue-30); } -[data-state=sent] .breakage-form__footer { - display: none; +.body--theme-dark.environment--windows .form__submit:focus { + --submit-button-box-shadow: 0px 0px 0px 1px #0b2059, 0px 0px 0px 3px #fff; +} +.body--theme-dark.environment--windows .form__submit:active { + --submit-button-background: var(--color-blue-40); + --submit-button-box-shadow: none; +} +.body--theme-dark.environment--windows .form__submit:disabled { + --submit-button-background: rgba(255, 255, 255, 0.36); + --submit-button-color: rgba(0, 0, 0, 0.84); +} + +.breakage-form__footer { + position: sticky; + bottom: 0; + background-color: var(--page-bg); + margin-inline: -16px; + padding: 16px; + margin-top: -16px; } .breakage-form__inner { - height: calc(100% - var(--nav-height)); display: flex; flex-direction: column; } @@ -3357,70 +3452,100 @@ body.environment--macos, body.environment--browser, body.environment--windows, b line-height: 20px; } -/* Android-specific styles */ -.environment--android { - --btn-accent-bg: #3969ef; - --btn-accent-bg-hover: #1e42a4; - --btn-accent-bg-active: #1e42a4; - --btn-accent-color: #fff; - --form-select-bg: none; - --form-select-color: rgba(0, 0, 0, 0.6); - --form-select-border-color: rgba(0, 0, 0, 0.3); - --form-select-chevron: url("../../img/refresh-assets/chevron.svg"); - /** - * prevent the empty element from taking any screen height - */ -} -.environment--android ddg-android-breakage-dialog { - position: absolute; +/* Disclosure Message */ +.disclosure-message { + border: 1px solid rgba(0, 0, 0, 0.12); + border-radius: 8px; + overflow: hidden; + transition: height 300ms ease-in-out; } -.environment--android .breakage-form .form__submit { - height: calc(var(--size-unit) * 3); +.body--theme-dark .disclosure-message { + border-color: rgba(255, 255, 255, 0.18); } -.environment--android .breakage-form .breakage-form__input--dropdown { - position: relative; +.disclosure-message .control__text--open { + display: none; } -.environment--android .breakage-form .breakage-form__input--dropdown select { - appearance: none; - background: var(--form-select-bg); - border: 1px solid var(--form-select-border-color); - border-radius: var(--size-unit-half); - color: var(--form-select-color); - font-size: var(--size-unit); - padding: var(--size-unit); -} -.environment--android .breakage-form .breakage-form__input--dropdown::after { - content: ""; - position: absolute; - right: var(--size-unit); - top: calc(1.25 * var(--size-unit)); - background-image: var(--form-select-chevron); - width: 8px; - height: 14px; - transform: rotate(90deg); - opacity: 0.75; +.disclosure-message[open] .control__text--open { + display: inline; } -.environment--android .breakage-form textarea { - border-radius: var(--size-unit-half); - border-color: var(--form-select-border-color); - font-size: var(--size-unit); - line-height: 1.25; - height: calc(var(--size-unit) * 7); - padding: var(--size-unit); - background: none; +.disclosure-message[open] .control__text--closed { + display: none; } -.environment--android .breakage-form .breakage-form__content.padding-x-double { - padding-left: var(--size-unit); - padding-right: var(--size-unit); +.disclosure-message[open] .control__chevron { + transform: rotate(180deg); } -.environment--android.body--theme-dark { - --btn-accent-bg: #7295f6; - --btn-accent-bg-hover: #3969ef; - --btn-accent-bg-active: #3969ef; - --btn-accent-color: rgba(0, 0, 0, 0.84); - --form-select-color: rgba(255, 255, 255, 0.9); - --form-select-border-color: rgba(255, 255, 255, 0.3); - --form-select-chevron: url("../../img/refresh-assets/chevron--light.svg"); + +.disclosure-message__summary { + align-items: center; + cursor: pointer; + display: flex; + justify-content: space-between; + min-height: 48px; + padding-inline: 16px; + position: sticky; + top: 0; +} +.disclosure-message__summary::marker, .disclosure-message__summary::-webkit-details-marker { + display: none; +} + +.disclosure-message__control { + align-items: center; + color: rgba(0, 0, 0, 0.6); + display: flex; + gap: 4px; +} +.body--theme-dark .disclosure-message__control { + color: rgba(255, 255, 255, 0.6); +} + +.control__text { + display: inline-block; + font-size: 14px; + font-weight: 600; + line-height: 1.4285714286; +} + +.control__chevron { + height: 18px; + width: 18px; +} + +.disclosure-message__content { + color: rgba(0, 0, 0, 0.6); + font-size: 13px; + line-height: 1.3846153846; + overflow-y: auto; + padding-inline: 16px; + padding-block: 0 16px; +} +.body--theme-dark .disclosure-message__content { + color: rgba(255, 255, 255, 0.6); +} + +.disclosure-message__title { + font-size: 14px; + font-weight: 600; + line-height: 1.4285714286; +} + +.success__container { + display: flex; + flex-flow: column; + gap: 8px; + align-items: center; + text-align: center; + padding: 0 16px 24px; +} + +.success__icon { + background: url("../../img/refresh-assets/Success-128.svg") no-repeat; + height: 106px; + width: 128px; +} + +.success__message { + white-space: pre-line; } .email-alias { @@ -3777,6 +3902,128 @@ body.environment--macos, body.environment--browser, body.environment--windows, b padding: 12px 16px; } +.textarea { + --textarea-background: #fff; + --textarea-border-radius: 8px; + --textarea-border: 1px solid rgba(0, 0, 0, 0.3); + --textarea-box-shadow: none; + --textarea-color: rgba(0, 0, 0, 0.84); + --textarea-font-size: 14px; + --textarea-height: 120px; + --textarea-line-height: calc(18 / 14); + --textarea-outline: none; + --textarea-padding: 12px 16px; + --textarea-placeholder-color: rgba(0, 0, 0, 0.6); + --textarea-background--dark: #222; + --textarea-border--dark: 1px solid rgba(255, 255, 255, 0.3); + --textarea-box-shadow--dark: none; + --textarea-color--dark: rgba(255, 255, 255, 0.84); + --textarea-placeholder-color--dark: rgba(255, 255, 255, 0.6); + --textarea-box-shadow--invalid: 0 0 0 2px #eb102d; + --textarea-box-shadow--invalid--dark: 0 0 0 2px #ff545a; + background: var(--textarea-background); + border-radius: var(--textarea-border-radius); + border: var(--textarea-border); + box-shadow: var(--textarea-box-shadow); + box-sizing: border-box; + color: var(--textarea-color); + display: block; + font-size: var(--textarea-font-size); + height: var(--textarea-height); + line-height: var(--textarea-line-height); + padding: var(--textarea-padding); + resize: none; + width: 100%; +} +.textarea::placeholder { + color: var(--textarea-placeholder-color); +} +.textarea:focus { + color: var(--textarea-color--focus, var(--textarea-color)); + background: var(--textarea-background--focus, var(--textarea-background)); + border: var(--textarea-border--focus, var(--textarea-border)); + box-shadow: var(--textarea-box-shadow--focus, var(--textarea-box-shadow)); + outline: var(--textarea-outline--focus, var(--textarea-outline)); +} +.textarea:invalid, .textarea.invalid { + color: var(--textarea-color--invalid, var(--textarea-color)); + box-shadow: var(--textarea-box-shadow--invalid, var(--textarea-box-shadow)); +} +.textarea:invalid::placeholder, .textarea.invalid::placeholder { + color: var(--textarea-placeholder-color--invalid, var(--textarea-placeholder-color)); +} +.body--theme-dark .textarea { + background: var(--textarea-background--dark, var(--textarea-background)); + border: var(--textarea-border--dark, var(--textarea-border)); + box-shadow: var(--textarea-box-shadow--dark, var(--textarea-box-shadow)); + color: var(--textarea-color--dark, var(--textarea-color)); +} +.body--theme-dark .textarea::placeholder { + color: var(--textarea-placeholder-color--dark, var(--textarea-placeholder-color)); +} +.body--theme-dark .textarea:focus { + background: var(--textarea-background--focus--dark, var(--textarea-background--focus, var(--textarea-background--dark))); + border: var(--textarea-border--focus--dark, var(--textarea-border--focus, var(--textarea-border--dark))); + box-shadow: var(--textarea-box-shadow--focus--dark, var(--textarea-box-shadow--focus, var(--textarea-box-shadow--dark))); + color: var(--textarea-color--focus--dark, var(--textarea-color--focus, var(--textarea-color--dark))); + outline: var(--textarea-outline--focus--dark, var(--textarea-outline--focus, var(--textarea-outline--dark))); +} +.body--theme-dark .textarea:invalid, .body--theme-dark .textarea.invalid { + color: var(--textarea-color--invalid--dark, var(--textarea-color--invalid, var(--textarea-color--dark))); + box-shadow: var(--textarea-box-shadow--invalid--dark, var(--textarea-box-shadow--invalid)); +} +.body--theme-dark .textarea:invalid::placeholder, .body--theme-dark .textarea.invalid::placeholder { + color: var(--textarea-placeholder-color--invalid--dark, var(--textarea-placeholder-color--invalid, var(--textarea-placeholder-color--dark))); +} +.environment--android .textarea { + --textarea-background: transparent; + --textarea-background--dark: transparent; + --textarea-background--focus: transparent; + --textarea-border--focus: 1px solid transparent; + --textarea-box-shadow--focus: 0 0 0 2px #3969ef; + --textarea-background--focus--dark: transparent; + --textarea-border--focus--dark: 1px solid transparent; + --textarea-box-shadow--focus--dark: 0 0 0 2px #7295f6; + --textarea-color--invalid: #eb102d; + --textarea-placeholder-color--invalid: #eb102d; + --textarea-color--invalid--dark: #ff545a; + --textarea-placeholder-color--invalid--dark: #ff545a; +} +.environment--ios .textarea { + --textarea-background: #eaeaea; + --textarea-border: 0; + --textarea-background--dark: #444; + --textarea-border--dark: 0; + --textarea-background--focus: #eaeaea; + --textarea-background--focus--dark: #444; +} +.environment--windows .textarea { + --textarea-border: 1px solid rgba(0, 0, 0, 0.12); + --textarea-border--dark: 1px solid rgba(255, 255, 255, 0.18); + --textarea-border--focus: 1px solid transparent; + --textarea-box-shadow--focus: 0 0 0 2px #3969ef; + --textarea-border--focus--dark: 1px solid transparent; + --textarea-box-shadow--focus--dark: 0 0 0 2px #8fabf9; +} +.environment--macos .textarea { + --textarea-border: 1px solid rgba(0, 0, 0, 0.1); + --textarea-box-shadow: 0px 1px 0px -0.5px rgba(0, 0, 0, 0.1), 0px 0.5px 0px -0.5px rgba(0, 0, 0, 0.1); + --textarea-border--dark: 1px solid rgba(0, 0, 0, 0.1); + --textarea-box-shadow--dark: 0px 1px 0px -0.5px rgba(0, 0, 0, 0.1), 0px 0.5px 0px -0.5px rgba(0, 0, 0, 0.1); + --textarea-border--focus: 1px solid rgba(0, 0, 0, 0.1); + --textarea-box-shadow--focus: 0px 0px 0px 1px rgba(57, 105, 239, 0.55) inset, 0px 0px 0px 2.5px rgba(57, 105, 239, 0.55); + --textarea-border--focus--dark: 1px solid rgba(0, 0, 0, 0.2); + --textarea-box-shadow--focus--dark: 0px 0px 0px 1px rgba(57, 105, 239, 0.55) inset, 0px 0px 0px 2.5px rgba(57, 105, 239, 0.55); + --textarea-border--invalid: var(--textarea-border); + --textarea-border--invalid--dark: var(--textarea-border--dark); +} +.environment--browser .textarea { + --textarea-border: 1px solid rgba(0, 0, 0, 0.12); + --textarea-border--dark: 1px solid rgba(255, 255, 255, 0.18); + --textarea-border--focus: 1px solid rgba(0, 0, 0, 0.12); + --textarea-border--focus--dark: 1px solid rgba(255, 255, 255, 0.18); +} + /* Generic menu list styling */ .default-list { list-style-type: none; @@ -3820,15 +4067,23 @@ body.environment--macos, body.environment--browser, body.environment--windows, b width: var(--width); height: var(--height); box-sizing: border-box; + /* Prevents flash of window background on macOS */ } .sliding-subview-v2:not(.sliding-subview-v2--root) { overflow-y: auto; } +.environment--macos .sliding-subview-v2 { + background: var(--page-bg); +} .sliding-subview-v2--root { position: absolute; top: 0; left: 0; + /* Prevents flash of window background on macOS */ +} +.environment--macos .sliding-subview-v2--root { + background: var(--page-bg); } .sliding-subview-v2--animating { @@ -3928,6 +4183,41 @@ body.environment--macos, body.environment--browser, body.environment--windows, b background: rgba(57, 105, 239, 0.2); color: var(--color-accent-blue-active); } +.button[data-variant=standard] { + text-align: center; + padding: 10px 12px; + cursor: pointer; + display: block; + text-decoration: none; + width: 100%; + box-shadow: var(--btn-accent-shadow); + border-radius: var(--btn-accent-border-radius); + border: var(--btn-accent-border); + color: var(--btn-accent-color); + background: var(--btn-accent-bg); +} +.button[data-variant=standard]:hover { + background: var(--btn-accent-bg-hover); +} +.button[data-variant=standard]:active { + background: var(--btn-accent-bg-active); +} +.environment--windows .button[data-variant=standard] { + /* Windows/Label */ + box-shadow: none; + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 19px; + border-radius: 4px; +} +.environment--windows .button[data-variant=standard]:focus { + /* todo(Shane): where does this live? */ + box-shadow: 0px 0px 0px 1px #ffffff, 0px 0px 0px 3px #3969ef; +} +.environment--windows .button[data-variant=standard]:active { + box-shadow: none; +} .button-bar[data-layout=horizontal] { display: grid; diff --git a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/js/android-breakage-dialog.js b/node_modules/@duckduckgo/privacy-dashboard/build/app/public/js/android-breakage-dialog.js deleted file mode 100644 index 1900913d49e9..000000000000 --- a/node_modules/@duckduckgo/privacy-dashboard/build/app/public/js/android-breakage-dialog.js +++ /dev/null @@ -1,5042 +0,0 @@ -"use strict"; -(() => { - var __defProp = Object.defineProperty; - var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; - var __publicField = (obj, key, value) => { - __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value); - return value; - }; - - // node_modules/@lit/reactive-element/css-tag.js - var t = globalThis; - var e = t.ShadowRoot && (void 0 === t.ShadyCSS || t.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype; - var s = Symbol(); - var o = /* @__PURE__ */ new WeakMap(); - var n = class { - constructor(t4, e6, o5) { - if (this._$cssResult$ = true, o5 !== s) - throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead."); - this.cssText = t4, this.t = e6; - } - get styleSheet() { - let t4 = this.o; - const s2 = this.t; - if (e && void 0 === t4) { - const e6 = void 0 !== s2 && 1 === s2.length; - e6 && (t4 = o.get(s2)), void 0 === t4 && ((this.o = t4 = new CSSStyleSheet()).replaceSync(this.cssText), e6 && o.set(s2, t4)); - } - return t4; - } - toString() { - return this.cssText; - } - }; - var r = (t4) => new n("string" == typeof t4 ? t4 : t4 + "", void 0, s); - var i = (t4, ...e6) => { - const o5 = 1 === t4.length ? t4[0] : e6.reduce((e7, s2, o6) => e7 + ((t5) => { - if (true === t5._$cssResult$) - return t5.cssText; - if ("number" == typeof t5) - return t5; - throw Error("Value passed to 'css' function must be a 'css' function result: " + t5 + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security."); - })(s2) + t4[o6 + 1], t4[0]); - return new n(o5, t4, s); - }; - var S = (s2, o5) => { - if (e) - s2.adoptedStyleSheets = o5.map((t4) => t4 instanceof CSSStyleSheet ? t4 : t4.styleSheet); - else - for (const e6 of o5) { - const o6 = document.createElement("style"), n5 = t.litNonce; - void 0 !== n5 && o6.setAttribute("nonce", n5), o6.textContent = e6.cssText, s2.appendChild(o6); - } - }; - var c = e ? (t4) => t4 : (t4) => t4 instanceof CSSStyleSheet ? ((t5) => { - let e6 = ""; - for (const s2 of t5.cssRules) - e6 += s2.cssText; - return r(e6); - })(t4) : t4; - - // node_modules/@lit/reactive-element/reactive-element.js - var { is: i2, defineProperty: e2, getOwnPropertyDescriptor: r2, getOwnPropertyNames: h, getOwnPropertySymbols: o2, getPrototypeOf: n2 } = Object; - var a = globalThis; - var c2 = a.trustedTypes; - var l = c2 ? c2.emptyScript : ""; - var p = a.reactiveElementPolyfillSupport; - var d = (t4, s2) => t4; - var u = { toAttribute(t4, s2) { - switch (s2) { - case Boolean: - t4 = t4 ? l : null; - break; - case Object: - case Array: - t4 = null == t4 ? t4 : JSON.stringify(t4); - } - return t4; - }, fromAttribute(t4, s2) { - let i4 = t4; - switch (s2) { - case Boolean: - i4 = null !== t4; - break; - case Number: - i4 = null === t4 ? null : Number(t4); - break; - case Object: - case Array: - try { - i4 = JSON.parse(t4); - } catch (t5) { - i4 = null; - } - } - return i4; - } }; - var f = (t4, s2) => !i2(t4, s2); - var y = { attribute: true, type: String, converter: u, reflect: false, hasChanged: f }; - Symbol.metadata ??= Symbol("metadata"), a.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap(); - var b = class extends HTMLElement { - static addInitializer(t4) { - this._$Ei(), (this.l ??= []).push(t4); - } - static get observedAttributes() { - return this.finalize(), this._$Eh && [...this._$Eh.keys()]; - } - static createProperty(t4, s2 = y) { - if (s2.state && (s2.attribute = false), this._$Ei(), this.elementProperties.set(t4, s2), !s2.noAccessor) { - const i4 = Symbol(), r5 = this.getPropertyDescriptor(t4, i4, s2); - void 0 !== r5 && e2(this.prototype, t4, r5); - } - } - static getPropertyDescriptor(t4, s2, i4) { - const { get: e6, set: h4 } = r2(this.prototype, t4) ?? { get() { - return this[s2]; - }, set(t5) { - this[s2] = t5; - } }; - return { get() { - return e6?.call(this); - }, set(s3) { - const r5 = e6?.call(this); - h4.call(this, s3), this.requestUpdate(t4, r5, i4); - }, configurable: true, enumerable: true }; - } - static getPropertyOptions(t4) { - return this.elementProperties.get(t4) ?? y; - } - static _$Ei() { - if (this.hasOwnProperty(d("elementProperties"))) - return; - const t4 = n2(this); - t4.finalize(), void 0 !== t4.l && (this.l = [...t4.l]), this.elementProperties = new Map(t4.elementProperties); - } - static finalize() { - if (this.hasOwnProperty(d("finalized"))) - return; - if (this.finalized = true, this._$Ei(), this.hasOwnProperty(d("properties"))) { - const t5 = this.properties, s2 = [...h(t5), ...o2(t5)]; - for (const i4 of s2) - this.createProperty(i4, t5[i4]); - } - const t4 = this[Symbol.metadata]; - if (null !== t4) { - const s2 = litPropertyMetadata.get(t4); - if (void 0 !== s2) - for (const [t5, i4] of s2) - this.elementProperties.set(t5, i4); - } - this._$Eh = /* @__PURE__ */ new Map(); - for (const [t5, s2] of this.elementProperties) { - const i4 = this._$Eu(t5, s2); - void 0 !== i4 && this._$Eh.set(i4, t5); - } - this.elementStyles = this.finalizeStyles(this.styles); - } - static finalizeStyles(s2) { - const i4 = []; - if (Array.isArray(s2)) { - const e6 = new Set(s2.flat(1 / 0).reverse()); - for (const s3 of e6) - i4.unshift(c(s3)); - } else - void 0 !== s2 && i4.push(c(s2)); - return i4; - } - static _$Eu(t4, s2) { - const i4 = s2.attribute; - return false === i4 ? void 0 : "string" == typeof i4 ? i4 : "string" == typeof t4 ? t4.toLowerCase() : void 0; - } - constructor() { - super(), this._$Ep = void 0, this.isUpdatePending = false, this.hasUpdated = false, this._$Em = null, this._$Ev(); - } - _$Ev() { - this._$ES = new Promise((t4) => this.enableUpdating = t4), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach((t4) => t4(this)); - } - addController(t4) { - (this._$EO ??= /* @__PURE__ */ new Set()).add(t4), void 0 !== this.renderRoot && this.isConnected && t4.hostConnected?.(); - } - removeController(t4) { - this._$EO?.delete(t4); - } - _$E_() { - const t4 = /* @__PURE__ */ new Map(), s2 = this.constructor.elementProperties; - for (const i4 of s2.keys()) - this.hasOwnProperty(i4) && (t4.set(i4, this[i4]), delete this[i4]); - t4.size > 0 && (this._$Ep = t4); - } - createRenderRoot() { - const t4 = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions); - return S(t4, this.constructor.elementStyles), t4; - } - connectedCallback() { - this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(true), this._$EO?.forEach((t4) => t4.hostConnected?.()); - } - enableUpdating(t4) { - } - disconnectedCallback() { - this._$EO?.forEach((t4) => t4.hostDisconnected?.()); - } - attributeChangedCallback(t4, s2, i4) { - this._$AK(t4, i4); - } - _$EC(t4, s2) { - const i4 = this.constructor.elementProperties.get(t4), e6 = this.constructor._$Eu(t4, i4); - if (void 0 !== e6 && true === i4.reflect) { - const r5 = (void 0 !== i4.converter?.toAttribute ? i4.converter : u).toAttribute(s2, i4.type); - this._$Em = t4, null == r5 ? this.removeAttribute(e6) : this.setAttribute(e6, r5), this._$Em = null; - } - } - _$AK(t4, s2) { - const i4 = this.constructor, e6 = i4._$Eh.get(t4); - if (void 0 !== e6 && this._$Em !== e6) { - const t5 = i4.getPropertyOptions(e6), r5 = "function" == typeof t5.converter ? { fromAttribute: t5.converter } : void 0 !== t5.converter?.fromAttribute ? t5.converter : u; - this._$Em = e6, this[e6] = r5.fromAttribute(s2, t5.type), this._$Em = null; - } - } - requestUpdate(t4, s2, i4) { - if (void 0 !== t4) { - if (i4 ??= this.constructor.getPropertyOptions(t4), !(i4.hasChanged ?? f)(this[t4], s2)) - return; - this.P(t4, s2, i4); - } - false === this.isUpdatePending && (this._$ES = this._$ET()); - } - P(t4, s2, i4) { - this._$AL.has(t4) || this._$AL.set(t4, s2), true === i4.reflect && this._$Em !== t4 && (this._$Ej ??= /* @__PURE__ */ new Set()).add(t4); - } - async _$ET() { - this.isUpdatePending = true; - try { - await this._$ES; - } catch (t5) { - Promise.reject(t5); - } - const t4 = this.scheduleUpdate(); - return null != t4 && await t4, !this.isUpdatePending; - } - scheduleUpdate() { - return this.performUpdate(); - } - performUpdate() { - if (!this.isUpdatePending) - return; - if (!this.hasUpdated) { - if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) { - for (const [t6, s3] of this._$Ep) - this[t6] = s3; - this._$Ep = void 0; - } - const t5 = this.constructor.elementProperties; - if (t5.size > 0) - for (const [s3, i4] of t5) - true !== i4.wrapped || this._$AL.has(s3) || void 0 === this[s3] || this.P(s3, this[s3], i4); - } - let t4 = false; - const s2 = this._$AL; - try { - t4 = this.shouldUpdate(s2), t4 ? (this.willUpdate(s2), this._$EO?.forEach((t5) => t5.hostUpdate?.()), this.update(s2)) : this._$EU(); - } catch (s3) { - throw t4 = false, this._$EU(), s3; - } - t4 && this._$AE(s2); - } - willUpdate(t4) { - } - _$AE(t4) { - this._$EO?.forEach((t5) => t5.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = true, this.firstUpdated(t4)), this.updated(t4); - } - _$EU() { - this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = false; - } - get updateComplete() { - return this.getUpdateComplete(); - } - getUpdateComplete() { - return this._$ES; - } - shouldUpdate(t4) { - return true; - } - update(t4) { - this._$Ej &&= this._$Ej.forEach((t5) => this._$EC(t5, this[t5])), this._$EU(); - } - updated(t4) { - } - firstUpdated(t4) { - } - }; - b.elementStyles = [], b.shadowRootOptions = { mode: "open" }, b[d("elementProperties")] = /* @__PURE__ */ new Map(), b[d("finalized")] = /* @__PURE__ */ new Map(), p?.({ ReactiveElement: b }), (a.reactiveElementVersions ??= []).push("2.0.4"); - - // node_modules/lit-html/lit-html.js - var n3 = globalThis; - var c3 = n3.trustedTypes; - var h2 = c3 ? c3.createPolicy("lit-html", { createHTML: (t4) => t4 }) : void 0; - var f2 = "$lit$"; - var v = `lit$${Math.random().toFixed(9).slice(2)}$`; - var m = "?" + v; - var _ = `<${m}>`; - var w = document; - var lt = () => w.createComment(""); - var st = (t4) => null === t4 || "object" != typeof t4 && "function" != typeof t4; - var g = Array.isArray; - var $ = (t4) => g(t4) || "function" == typeof t4?.[Symbol.iterator]; - var x = "[ \n\f\r]"; - var T = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g; - var E = /-->/g; - var k = />/g; - var O = RegExp(`>|${x}(?:([^\\s"'>=/]+)(${x}*=${x}*(?:[^ -\f\r"'\`<>=]|("|')|))|$)`, "g"); - var S2 = /'/g; - var j = /"/g; - var M = /^(?:script|style|textarea|title)$/i; - var P = (t4) => (i4, ...s2) => ({ _$litType$: t4, strings: i4, values: s2 }); - var ke = P(1); - var Oe = P(2); - var Se = P(3); - var R = Symbol.for("lit-noChange"); - var D = Symbol.for("lit-nothing"); - var V = /* @__PURE__ */ new WeakMap(); - var I = w.createTreeWalker(w, 129); - function N(t4, i4) { - if (!g(t4) || !t4.hasOwnProperty("raw")) - throw Error("invalid template strings array"); - return void 0 !== h2 ? h2.createHTML(i4) : i4; - } - var U = (t4, i4) => { - const s2 = t4.length - 1, e6 = []; - let h4, o5 = 2 === i4 ? "" : 3 === i4 ? "" : "", n5 = T; - for (let i5 = 0; i5 < s2; i5++) { - const s3 = t4[i5]; - let r5, l2, c4 = -1, a2 = 0; - for (; a2 < s3.length && (n5.lastIndex = a2, l2 = n5.exec(s3), null !== l2); ) - a2 = n5.lastIndex, n5 === T ? "!--" === l2[1] ? n5 = E : void 0 !== l2[1] ? n5 = k : void 0 !== l2[2] ? (M.test(l2[2]) && (h4 = RegExp("" === l2[0] ? (n5 = h4 ?? T, c4 = -1) : void 0 === l2[1] ? c4 = -2 : (c4 = n5.lastIndex - l2[2].length, r5 = l2[1], n5 = void 0 === l2[3] ? O : '"' === l2[3] ? j : S2) : n5 === j || n5 === S2 ? n5 = O : n5 === E || n5 === k ? n5 = T : (n5 = O, h4 = void 0); - const u2 = n5 === O && t4[i5 + 1].startsWith("/>") ? " " : ""; - o5 += n5 === T ? s3 + _ : c4 >= 0 ? (e6.push(r5), s3.slice(0, c4) + f2 + s3.slice(c4) + v + u2) : s3 + v + (-2 === c4 ? i5 : u2); - } - return [N(t4, o5 + (t4[s2] || "") + (2 === i4 ? "" : 3 === i4 ? "" : "")), e6]; - }; - var B = class _B { - constructor({ strings: t4, _$litType$: i4 }, s2) { - let e6; - this.parts = []; - let h4 = 0, o5 = 0; - const n5 = t4.length - 1, r5 = this.parts, [l2, a2] = U(t4, i4); - if (this.el = _B.createElement(l2, s2), I.currentNode = this.el.content, 2 === i4 || 3 === i4) { - const t5 = this.el.content.firstChild; - t5.replaceWith(...t5.childNodes); - } - for (; null !== (e6 = I.nextNode()) && r5.length < n5; ) { - if (1 === e6.nodeType) { - if (e6.hasAttributes()) - for (const t5 of e6.getAttributeNames()) - if (t5.endsWith(f2)) { - const i5 = a2[o5++], s3 = e6.getAttribute(t5).split(v), n6 = /([.?@])?(.*)/.exec(i5); - r5.push({ type: 1, index: h4, name: n6[2], strings: s3, ctor: "." === n6[1] ? Y : "?" === n6[1] ? Z : "@" === n6[1] ? q : G }), e6.removeAttribute(t5); - } else - t5.startsWith(v) && (r5.push({ type: 6, index: h4 }), e6.removeAttribute(t5)); - if (M.test(e6.tagName)) { - const t5 = e6.textContent.split(v), i5 = t5.length - 1; - if (i5 > 0) { - e6.textContent = c3 ? c3.emptyScript : ""; - for (let s3 = 0; s3 < i5; s3++) - e6.append(t5[s3], lt()), I.nextNode(), r5.push({ type: 2, index: ++h4 }); - e6.append(t5[i5], lt()); - } - } - } else if (8 === e6.nodeType) - if (e6.data === m) - r5.push({ type: 2, index: h4 }); - else { - let t5 = -1; - for (; -1 !== (t5 = e6.data.indexOf(v, t5 + 1)); ) - r5.push({ type: 7, index: h4 }), t5 += v.length - 1; - } - h4++; - } - } - static createElement(t4, i4) { - const s2 = w.createElement("template"); - return s2.innerHTML = t4, s2; - } - }; - function z(t4, i4, s2 = t4, e6) { - if (i4 === R) - return i4; - let h4 = void 0 !== e6 ? s2.o?.[e6] : s2.l; - const o5 = st(i4) ? void 0 : i4._$litDirective$; - return h4?.constructor !== o5 && (h4?._$AO?.(false), void 0 === o5 ? h4 = void 0 : (h4 = new o5(t4), h4._$AT(t4, s2, e6)), void 0 !== e6 ? (s2.o ??= [])[e6] = h4 : s2.l = h4), void 0 !== h4 && (i4 = z(t4, h4._$AS(t4, i4.values), h4, e6)), i4; - } - var F = class { - constructor(t4, i4) { - this._$AV = [], this._$AN = void 0, this._$AD = t4, this._$AM = i4; - } - get parentNode() { - return this._$AM.parentNode; - } - get _$AU() { - return this._$AM._$AU; - } - u(t4) { - const { el: { content: i4 }, parts: s2 } = this._$AD, e6 = (t4?.creationScope ?? w).importNode(i4, true); - I.currentNode = e6; - let h4 = I.nextNode(), o5 = 0, n5 = 0, r5 = s2[0]; - for (; void 0 !== r5; ) { - if (o5 === r5.index) { - let i5; - 2 === r5.type ? i5 = new et(h4, h4.nextSibling, this, t4) : 1 === r5.type ? i5 = new r5.ctor(h4, r5.name, r5.strings, this, t4) : 6 === r5.type && (i5 = new K(h4, this, t4)), this._$AV.push(i5), r5 = s2[++n5]; - } - o5 !== r5?.index && (h4 = I.nextNode(), o5++); - } - return I.currentNode = w, e6; - } - p(t4) { - let i4 = 0; - for (const s2 of this._$AV) - void 0 !== s2 && (void 0 !== s2.strings ? (s2._$AI(t4, s2, i4), i4 += s2.strings.length - 2) : s2._$AI(t4[i4])), i4++; - } - }; - var et = class _et { - get _$AU() { - return this._$AM?._$AU ?? this.v; - } - constructor(t4, i4, s2, e6) { - this.type = 2, this._$AH = D, this._$AN = void 0, this._$AA = t4, this._$AB = i4, this._$AM = s2, this.options = e6, this.v = e6?.isConnected ?? true; - } - get parentNode() { - let t4 = this._$AA.parentNode; - const i4 = this._$AM; - return void 0 !== i4 && 11 === t4?.nodeType && (t4 = i4.parentNode), t4; - } - get startNode() { - return this._$AA; - } - get endNode() { - return this._$AB; - } - _$AI(t4, i4 = this) { - t4 = z(this, t4, i4), st(t4) ? t4 === D || null == t4 || "" === t4 ? (this._$AH !== D && this._$AR(), this._$AH = D) : t4 !== this._$AH && t4 !== R && this._(t4) : void 0 !== t4._$litType$ ? this.$(t4) : void 0 !== t4.nodeType ? this.T(t4) : $(t4) ? this.k(t4) : this._(t4); - } - O(t4) { - return this._$AA.parentNode.insertBefore(t4, this._$AB); - } - T(t4) { - this._$AH !== t4 && (this._$AR(), this._$AH = this.O(t4)); - } - _(t4) { - this._$AH !== D && st(this._$AH) ? this._$AA.nextSibling.data = t4 : this.T(w.createTextNode(t4)), this._$AH = t4; - } - $(t4) { - const { values: i4, _$litType$: s2 } = t4, e6 = "number" == typeof s2 ? this._$AC(t4) : (void 0 === s2.el && (s2.el = B.createElement(N(s2.h, s2.h[0]), this.options)), s2); - if (this._$AH?._$AD === e6) - this._$AH.p(i4); - else { - const t5 = new F(e6, this), s3 = t5.u(this.options); - t5.p(i4), this.T(s3), this._$AH = t5; - } - } - _$AC(t4) { - let i4 = V.get(t4.strings); - return void 0 === i4 && V.set(t4.strings, i4 = new B(t4)), i4; - } - k(t4) { - g(this._$AH) || (this._$AH = [], this._$AR()); - const i4 = this._$AH; - let s2, e6 = 0; - for (const h4 of t4) - e6 === i4.length ? i4.push(s2 = new _et(this.O(lt()), this.O(lt()), this, this.options)) : s2 = i4[e6], s2._$AI(h4), e6++; - e6 < i4.length && (this._$AR(s2 && s2._$AB.nextSibling, e6), i4.length = e6); - } - _$AR(t4 = this._$AA.nextSibling, i4) { - for (this._$AP?.(false, true, i4); t4 && t4 !== this._$AB; ) { - const i5 = t4.nextSibling; - t4.remove(), t4 = i5; - } - } - setConnected(t4) { - void 0 === this._$AM && (this.v = t4, this._$AP?.(t4)); - } - }; - var G = class { - get tagName() { - return this.element.tagName; - } - get _$AU() { - return this._$AM._$AU; - } - constructor(t4, i4, s2, e6, h4) { - this.type = 1, this._$AH = D, this._$AN = void 0, this.element = t4, this.name = i4, this._$AM = e6, this.options = h4, s2.length > 2 || "" !== s2[0] || "" !== s2[1] ? (this._$AH = Array(s2.length - 1).fill(new String()), this.strings = s2) : this._$AH = D; - } - _$AI(t4, i4 = this, s2, e6) { - const h4 = this.strings; - let o5 = false; - if (void 0 === h4) - t4 = z(this, t4, i4, 0), o5 = !st(t4) || t4 !== this._$AH && t4 !== R, o5 && (this._$AH = t4); - else { - const e7 = t4; - let n5, r5; - for (t4 = h4[0], n5 = 0; n5 < h4.length - 1; n5++) - r5 = z(this, e7[s2 + n5], i4, n5), r5 === R && (r5 = this._$AH[n5]), o5 ||= !st(r5) || r5 !== this._$AH[n5], r5 === D ? t4 = D : t4 !== D && (t4 += (r5 ?? "") + h4[n5 + 1]), this._$AH[n5] = r5; - } - o5 && !e6 && this.j(t4); - } - j(t4) { - t4 === D ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t4 ?? ""); - } - }; - var Y = class extends G { - constructor() { - super(...arguments), this.type = 3; - } - j(t4) { - this.element[this.name] = t4 === D ? void 0 : t4; - } - }; - var Z = class extends G { - constructor() { - super(...arguments), this.type = 4; - } - j(t4) { - this.element.toggleAttribute(this.name, !!t4 && t4 !== D); - } - }; - var q = class extends G { - constructor(t4, i4, s2, e6, h4) { - super(t4, i4, s2, e6, h4), this.type = 5; - } - _$AI(t4, i4 = this) { - if ((t4 = z(this, t4, i4, 0) ?? D) === R) - return; - const s2 = this._$AH, e6 = t4 === D && s2 !== D || t4.capture !== s2.capture || t4.once !== s2.once || t4.passive !== s2.passive, h4 = t4 !== D && (s2 === D || e6); - e6 && this.element.removeEventListener(this.name, this, s2), h4 && this.element.addEventListener(this.name, this, t4), this._$AH = t4; - } - handleEvent(t4) { - "function" == typeof this._$AH ? this._$AH.call(this.options?.host ?? this.element, t4) : this._$AH.handleEvent(t4); - } - }; - var K = class { - constructor(t4, i4, s2) { - this.element = t4, this.type = 6, this._$AN = void 0, this._$AM = i4, this.options = s2; - } - get _$AU() { - return this._$AM._$AU; - } - _$AI(t4) { - z(this, t4); - } - }; - var si = { M: f2, P: v, A: m, C: 1, L: U, R: F, D: $, V: z, I: et, H: G, N: Z, U: q, B: Y, F: K }; - var Re = n3.litHtmlPolyfillSupport; - Re?.(B, et), (n3.litHtmlVersions ??= []).push("3.2.0"); - var Q = (t4, i4, s2) => { - const e6 = s2?.renderBefore ?? i4; - let h4 = e6._$litPart$; - if (void 0 === h4) { - const t5 = s2?.renderBefore ?? null; - e6._$litPart$ = h4 = new et(i4.insertBefore(lt(), t5), t5, void 0, s2 ?? {}); - } - return h4._$AI(t4), h4; - }; - - // node_modules/lit-element/lit-element.js - var h3 = class extends b { - constructor() { - super(...arguments), this.renderOptions = { host: this }, this.o = void 0; - } - createRenderRoot() { - const t4 = super.createRenderRoot(); - return this.renderOptions.renderBefore ??= t4.firstChild, t4; - } - update(t4) { - const e6 = this.render(); - this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t4), this.o = Q(e6, this.renderRoot, this.renderOptions); - } - connectedCallback() { - super.connectedCallback(), this.o?.setConnected(true); - } - disconnectedCallback() { - super.disconnectedCallback(), this.o?.setConnected(false); - } - render() { - return R; - } - }; - h3._$litElement$ = true, h3["finalized"] = true, globalThis.litElementHydrateSupport?.({ LitElement: h3 }); - var f3 = globalThis.litElementPolyfillSupport; - f3?.({ LitElement: h3 }); - (globalThis.litElementVersions ??= []).push("4.1.0"); - - // node_modules/lit-html/is-server.js - var co = false; - - // node_modules/lit-html/directives/map.js - function* oo(o5, f4) { - if (void 0 !== o5) { - let i4 = 0; - for (const t4 of o5) - yield f4(t4, i4++); - } - } - - // node_modules/tslib/tslib.es6.js - function __decorate(decorators, target, key, desc) { - var c4 = arguments.length, r5 = c4 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d2; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") - r5 = Reflect.decorate(decorators, target, key, desc); - else - for (var i4 = decorators.length - 1; i4 >= 0; i4--) - if (d2 = decorators[i4]) - r5 = (c4 < 3 ? d2(r5) : c4 > 3 ? d2(target, key, r5) : d2(target, key)) || r5; - return c4 > 3 && r5 && Object.defineProperty(target, key, r5), r5; - } - - // node_modules/@lit/reactive-element/decorators/custom-element.js - var t2 = (t4) => (e6, o5) => { - void 0 !== o5 ? o5.addInitializer(() => { - customElements.define(t4, e6); - }) : customElements.define(t4, e6); - }; - - // node_modules/@lit/reactive-element/decorators/property.js - var o3 = { attribute: true, type: String, converter: u, reflect: false, hasChanged: f }; - var r3 = (t4 = o3, e6, r5) => { - const { kind: n5, metadata: i4 } = r5; - let s2 = globalThis.litPropertyMetadata.get(i4); - if (void 0 === s2 && globalThis.litPropertyMetadata.set(i4, s2 = /* @__PURE__ */ new Map()), s2.set(r5.name, t4), "accessor" === n5) { - const { name: o5 } = r5; - return { set(r6) { - const n6 = e6.get.call(this); - e6.set.call(this, r6), this.requestUpdate(o5, n6, t4); - }, init(e7) { - return void 0 !== e7 && this.P(o5, void 0, t4), e7; - } }; - } - if ("setter" === n5) { - const { name: o5 } = r5; - return function(r6) { - const n6 = this[o5]; - e6.call(this, r6), this.requestUpdate(o5, n6, t4); - }; - } - throw Error("Unsupported decorator location: " + n5); - }; - function n4(t4) { - return (e6, o5) => "object" == typeof o5 ? r3(t4, e6, o5) : ((t5, e7, o6) => { - const r5 = e7.hasOwnProperty(o6); - return e7.constructor.createProperty(o6, r5 ? { ...t5, wrapped: true } : t5), r5 ? Object.getOwnPropertyDescriptor(e7, o6) : void 0; - })(t4, e6, o5); - } - - // node_modules/@lit/reactive-element/decorators/state.js - function r4(r5) { - return n4({ ...r5, state: true, attribute: false }); - } - - // node_modules/@lit/reactive-element/decorators/base.js - var e3 = (e6, t4, c4) => (c4.configurable = true, c4.enumerable = true, Reflect.decorate && "object" != typeof t4 && Object.defineProperty(e6, t4, c4), c4); - - // node_modules/@lit/reactive-element/decorators/query.js - function e4(e6, r5) { - return (n5, s2, i4) => { - const o5 = (t4) => t4.renderRoot?.querySelector(e6) ?? null; - if (r5) { - const { get: e7, set: r6 } = "object" == typeof s2 ? n5 : i4 ?? (() => { - const t4 = Symbol(); - return { get() { - return this[t4]; - }, set(e8) { - this[t4] = e8; - } }; - })(); - return e3(n5, s2, { get() { - let t4 = e7.call(this); - return void 0 === t4 && (t4 = o5(this), (null !== t4 || this.hasUpdated) && r6.call(this, t4)), t4; - } }); - } - return e3(n5, s2, { get() { - return o5(this); - } }); - }; - } - - // node_modules/@lit/reactive-element/decorators/query-assigned-elements.js - function o4(o5) { - return (e6, n5) => { - const { slot: r5, selector: s2 } = o5 ?? {}, c4 = "slot" + (r5 ? `[name=${r5}]` : ":not([name])"); - return e3(e6, n5, { get() { - const t4 = this.renderRoot?.querySelector(c4), e7 = t4?.assignedElements(o5) ?? []; - return void 0 === s2 ? e7 : e7.filter((t5) => t5.matches(s2)); - } }); - }; - } - - // node_modules/@material/web/elevation/internal/elevation.js - var Elevation = class extends h3 { - connectedCallback() { - super.connectedCallback(); - this.setAttribute("aria-hidden", "true"); - } - render() { - return ke``; - } - }; - - // node_modules/@material/web/elevation/internal/elevation-styles.js - var styles = i`:host,.shadow,.shadow::before,.shadow::after{border-radius:inherit;inset:0;position:absolute;transition-duration:inherit;transition-property:inherit;transition-timing-function:inherit}:host{display:flex;pointer-events:none;transition-property:box-shadow,opacity}.shadow::before,.shadow::after{content:"";transition-property:box-shadow,opacity;--_level: var(--md-elevation-level, 0);--_shadow-color: var(--md-elevation-shadow-color, var(--md-sys-color-shadow, #000))}.shadow::before{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 3,1) + 2*clamp(0,var(--_level) - 4,1))) calc(1px*(2*clamp(0,var(--_level),1) + clamp(0,var(--_level) - 2,1) + clamp(0,var(--_level) - 4,1))) 0px var(--_shadow-color);opacity:.3}.shadow::after{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 1,1) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(3*clamp(0,var(--_level),2) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(clamp(0,var(--_level),4) + 2*clamp(0,var(--_level) - 4,1))) var(--_shadow-color);opacity:.15} -`; - - // node_modules/@material/web/elevation/elevation.js - var MdElevation = class MdElevation2 extends Elevation { - }; - MdElevation.styles = [styles]; - MdElevation = __decorate([ - t2("md-elevation") - ], MdElevation); - - // node_modules/@material/web/internal/controller/attachable-controller.js - var ATTACHABLE_CONTROLLER = Symbol("attachableController"); - var FOR_ATTRIBUTE_OBSERVER; - if (!co) { - FOR_ATTRIBUTE_OBSERVER = new MutationObserver((records) => { - for (const record of records) { - record.target[ATTACHABLE_CONTROLLER]?.hostConnected(); - } - }); - } - var AttachableController = class { - get htmlFor() { - return this.host.getAttribute("for"); - } - set htmlFor(htmlFor) { - if (htmlFor === null) { - this.host.removeAttribute("for"); - } else { - this.host.setAttribute("for", htmlFor); - } - } - get control() { - if (this.host.hasAttribute("for")) { - if (!this.htmlFor || !this.host.isConnected) { - return null; - } - return this.host.getRootNode().querySelector(`#${this.htmlFor}`); - } - return this.currentControl || this.host.parentElement; - } - set control(control) { - if (control) { - this.attach(control); - } else { - this.detach(); - } - } - /** - * Creates a new controller for an `Attachable` element. - * - * @param host The `Attachable` element. - * @param onControlChange A callback with two parameters for the previous and - * next control. An `Attachable` element may perform setup or teardown - * logic whenever the control changes. - */ - constructor(host, onControlChange) { - this.host = host; - this.onControlChange = onControlChange; - this.currentControl = null; - host.addController(this); - host[ATTACHABLE_CONTROLLER] = this; - FOR_ATTRIBUTE_OBSERVER?.observe(host, { attributeFilter: ["for"] }); - } - attach(control) { - if (control === this.currentControl) { - return; - } - this.setCurrentControl(control); - this.host.removeAttribute("for"); - } - detach() { - this.setCurrentControl(null); - this.host.setAttribute("for", ""); - } - /** @private */ - hostConnected() { - this.setCurrentControl(this.control); - } - /** @private */ - hostDisconnected() { - this.setCurrentControl(null); - } - setCurrentControl(control) { - this.onControlChange(this.currentControl, control); - this.currentControl = control; - } - }; - - // node_modules/@material/web/focus/internal/focus-ring.js - var EVENTS = ["focusin", "focusout", "pointerdown"]; - var FocusRing = class extends h3 { - constructor() { - super(...arguments); - this.visible = false; - this.inward = false; - this.attachableController = new AttachableController(this, this.onControlChange.bind(this)); - } - get htmlFor() { - return this.attachableController.htmlFor; - } - set htmlFor(htmlFor) { - this.attachableController.htmlFor = htmlFor; - } - get control() { - return this.attachableController.control; - } - set control(control) { - this.attachableController.control = control; - } - attach(control) { - this.attachableController.attach(control); - } - detach() { - this.attachableController.detach(); - } - connectedCallback() { - super.connectedCallback(); - this.setAttribute("aria-hidden", "true"); - } - /** @private */ - handleEvent(event) { - if (event[HANDLED_BY_FOCUS_RING]) { - return; - } - switch (event.type) { - default: - return; - case "focusin": - this.visible = this.control?.matches(":focus-visible") ?? false; - break; - case "focusout": - case "pointerdown": - this.visible = false; - break; - } - event[HANDLED_BY_FOCUS_RING] = true; - } - onControlChange(prev, next) { - if (co) - return; - for (const event of EVENTS) { - prev?.removeEventListener(event, this); - next?.addEventListener(event, this); - } - } - update(changed) { - if (changed.has("visible")) { - this.dispatchEvent(new Event("visibility-changed")); - } - super.update(changed); - } - }; - __decorate([ - n4({ type: Boolean, reflect: true }) - ], FocusRing.prototype, "visible", void 0); - __decorate([ - n4({ type: Boolean, reflect: true }) - ], FocusRing.prototype, "inward", void 0); - var HANDLED_BY_FOCUS_RING = Symbol("handledByFocusRing"); - - // node_modules/@material/web/focus/internal/focus-ring-styles.js - var styles2 = i`:host{animation-delay:0s,calc(var(--md-focus-ring-duration, 600ms)*.25);animation-duration:calc(var(--md-focus-ring-duration, 600ms)*.25),calc(var(--md-focus-ring-duration, 600ms)*.75);animation-timing-function:cubic-bezier(0.2, 0, 0, 1);box-sizing:border-box;color:var(--md-focus-ring-color, var(--md-sys-color-secondary, #625b71));display:none;pointer-events:none;position:absolute}:host([visible]){display:flex}:host(:not([inward])){animation-name:outward-grow,outward-shrink;border-end-end-radius:calc(var(--md-focus-ring-shape-end-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-end-start-radius:calc(var(--md-focus-ring-shape-end-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-start-end-radius:calc(var(--md-focus-ring-shape-start-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-start-start-radius:calc(var(--md-focus-ring-shape-start-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));inset:calc(-1*var(--md-focus-ring-outward-offset, 2px));outline:var(--md-focus-ring-width, 3px) solid currentColor}:host([inward]){animation-name:inward-grow,inward-shrink;border-end-end-radius:calc(var(--md-focus-ring-shape-end-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-end-start-radius:calc(var(--md-focus-ring-shape-end-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-start-end-radius:calc(var(--md-focus-ring-shape-start-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-start-start-radius:calc(var(--md-focus-ring-shape-start-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border:var(--md-focus-ring-width, 3px) solid currentColor;inset:var(--md-focus-ring-inward-offset, 0px)}@keyframes outward-grow{from{outline-width:0}to{outline-width:var(--md-focus-ring-active-width, 8px)}}@keyframes outward-shrink{from{outline-width:var(--md-focus-ring-active-width, 8px)}}@keyframes inward-grow{from{border-width:0}to{border-width:var(--md-focus-ring-active-width, 8px)}}@keyframes inward-shrink{from{border-width:var(--md-focus-ring-active-width, 8px)}}@media(prefers-reduced-motion){:host{animation:none}} -`; - - // node_modules/@material/web/focus/md-focus-ring.js - var MdFocusRing = class MdFocusRing2 extends FocusRing { - }; - MdFocusRing.styles = [styles2]; - MdFocusRing = __decorate([ - t2("md-focus-ring") - ], MdFocusRing); - - // node_modules/lit-html/directive.js - var t3 = { ATTRIBUTE: 1, CHILD: 2, PROPERTY: 3, BOOLEAN_ATTRIBUTE: 4, EVENT: 5, ELEMENT: 6 }; - var e5 = (t4) => (...e6) => ({ _$litDirective$: t4, values: e6 }); - var i3 = class { - constructor(t4) { - } - get _$AU() { - return this._$AM._$AU; - } - _$AT(t4, e6, i4) { - this.t = t4, this._$AM = e6, this.i = i4; - } - _$AS(t4, e6) { - return this.update(t4, e6); - } - update(t4, e6) { - return this.render(...e6); - } - }; - - // node_modules/lit-html/directives/class-map.js - var Rt = e5(class extends i3 { - constructor(s2) { - if (super(s2), s2.type !== t3.ATTRIBUTE || "class" !== s2.name || s2.strings?.length > 2) - throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute."); - } - render(t4) { - return " " + Object.keys(t4).filter((s2) => t4[s2]).join(" ") + " "; - } - update(t4, [s2]) { - if (void 0 === this.st) { - this.st = /* @__PURE__ */ new Set(), void 0 !== t4.strings && (this.nt = new Set(t4.strings.join(" ").split(/\s/).filter((t5) => "" !== t5))); - for (const t5 in s2) - s2[t5] && !this.nt?.has(t5) && this.st.add(t5); - return this.render(s2); - } - const i4 = t4.element.classList; - for (const t5 of this.st) - t5 in s2 || (i4.remove(t5), this.st.delete(t5)); - for (const t5 in s2) { - const r5 = !!s2[t5]; - r5 === this.st.has(t5) || this.nt?.has(t5) || (r5 ? (i4.add(t5), this.st.add(t5)) : (i4.remove(t5), this.st.delete(t5))); - } - return R; - } - }); - - // node_modules/@material/web/internal/motion/animation.js - var EASING = { - STANDARD: "cubic-bezier(0.2, 0, 0, 1)", - STANDARD_ACCELERATE: "cubic-bezier(.3,0,1,1)", - STANDARD_DECELERATE: "cubic-bezier(0,0,0,1)", - EMPHASIZED: "cubic-bezier(.3,0,0,1)", - EMPHASIZED_ACCELERATE: "cubic-bezier(.3,0,.8,.15)", - EMPHASIZED_DECELERATE: "cubic-bezier(.05,.7,.1,1)" - }; - - // node_modules/@material/web/ripple/internal/ripple.js - var PRESS_GROW_MS = 450; - var MINIMUM_PRESS_MS = 225; - var INITIAL_ORIGIN_SCALE = 0.2; - var PADDING = 10; - var SOFT_EDGE_MINIMUM_SIZE = 75; - var SOFT_EDGE_CONTAINER_RATIO = 0.35; - var PRESS_PSEUDO = "::after"; - var ANIMATION_FILL = "forwards"; - var State; - (function(State2) { - State2[State2["INACTIVE"] = 0] = "INACTIVE"; - State2[State2["TOUCH_DELAY"] = 1] = "TOUCH_DELAY"; - State2[State2["HOLDING"] = 2] = "HOLDING"; - State2[State2["WAITING_FOR_CLICK"] = 3] = "WAITING_FOR_CLICK"; - })(State || (State = {})); - var EVENTS2 = [ - "click", - "contextmenu", - "pointercancel", - "pointerdown", - "pointerenter", - "pointerleave", - "pointerup" - ]; - var TOUCH_DELAY_MS = 150; - var FORCED_COLORS = co ? null : window.matchMedia("(forced-colors: active)"); - var Ripple = class extends h3 { - constructor() { - super(...arguments); - this.disabled = false; - this.hovered = false; - this.pressed = false; - this.rippleSize = ""; - this.rippleScale = ""; - this.initialSize = 0; - this.state = State.INACTIVE; - this.checkBoundsAfterContextMenu = false; - this.attachableController = new AttachableController(this, this.onControlChange.bind(this)); - } - get htmlFor() { - return this.attachableController.htmlFor; - } - set htmlFor(htmlFor) { - this.attachableController.htmlFor = htmlFor; - } - get control() { - return this.attachableController.control; - } - set control(control) { - this.attachableController.control = control; - } - attach(control) { - this.attachableController.attach(control); - } - detach() { - this.attachableController.detach(); - } - connectedCallback() { - super.connectedCallback(); - this.setAttribute("aria-hidden", "true"); - } - render() { - const classes = { - "hovered": this.hovered, - "pressed": this.pressed - }; - return ke`
`; - } - update(changedProps) { - if (changedProps.has("disabled") && this.disabled) { - this.hovered = false; - this.pressed = false; - } - super.update(changedProps); - } - /** - * TODO(b/269799771): make private - * @private only public for slider - */ - handlePointerenter(event) { - if (!this.shouldReactToEvent(event)) { - return; - } - this.hovered = true; - } - /** - * TODO(b/269799771): make private - * @private only public for slider - */ - handlePointerleave(event) { - if (!this.shouldReactToEvent(event)) { - return; - } - this.hovered = false; - if (this.state !== State.INACTIVE) { - this.endPressAnimation(); - } - } - handlePointerup(event) { - if (!this.shouldReactToEvent(event)) { - return; - } - if (this.state === State.HOLDING) { - this.state = State.WAITING_FOR_CLICK; - return; - } - if (this.state === State.TOUCH_DELAY) { - this.state = State.WAITING_FOR_CLICK; - this.startPressAnimation(this.rippleStartEvent); - return; - } - } - async handlePointerdown(event) { - if (!this.shouldReactToEvent(event)) { - return; - } - this.rippleStartEvent = event; - if (!this.isTouch(event)) { - this.state = State.WAITING_FOR_CLICK; - this.startPressAnimation(event); - return; - } - if (this.checkBoundsAfterContextMenu && !this.inBounds(event)) { - return; - } - this.checkBoundsAfterContextMenu = false; - this.state = State.TOUCH_DELAY; - await new Promise((resolve) => { - setTimeout(resolve, TOUCH_DELAY_MS); - }); - if (this.state !== State.TOUCH_DELAY) { - return; - } - this.state = State.HOLDING; - this.startPressAnimation(event); - } - handleClick() { - if (this.disabled) { - return; - } - if (this.state === State.WAITING_FOR_CLICK) { - this.endPressAnimation(); - return; - } - if (this.state === State.INACTIVE) { - this.startPressAnimation(); - this.endPressAnimation(); - } - } - handlePointercancel(event) { - if (!this.shouldReactToEvent(event)) { - return; - } - this.endPressAnimation(); - } - handleContextmenu() { - if (this.disabled) { - return; - } - this.checkBoundsAfterContextMenu = true; - this.endPressAnimation(); - } - determineRippleSize() { - const { height, width } = this.getBoundingClientRect(); - const maxDim = Math.max(height, width); - const softEdgeSize = Math.max(SOFT_EDGE_CONTAINER_RATIO * maxDim, SOFT_EDGE_MINIMUM_SIZE); - const initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE); - const hypotenuse = Math.sqrt(width ** 2 + height ** 2); - const maxRadius = hypotenuse + PADDING; - this.initialSize = initialSize; - this.rippleScale = `${(maxRadius + softEdgeSize) / initialSize}`; - this.rippleSize = `${initialSize}px`; - } - getNormalizedPointerEventCoords(pointerEvent) { - const { scrollX, scrollY } = window; - const { left, top } = this.getBoundingClientRect(); - const documentX = scrollX + left; - const documentY = scrollY + top; - const { pageX, pageY } = pointerEvent; - return { x: pageX - documentX, y: pageY - documentY }; - } - getTranslationCoordinates(positionEvent) { - const { height, width } = this.getBoundingClientRect(); - const endPoint = { - x: (width - this.initialSize) / 2, - y: (height - this.initialSize) / 2 - }; - let startPoint; - if (positionEvent instanceof PointerEvent) { - startPoint = this.getNormalizedPointerEventCoords(positionEvent); - } else { - startPoint = { - x: width / 2, - y: height / 2 - }; - } - startPoint = { - x: startPoint.x - this.initialSize / 2, - y: startPoint.y - this.initialSize / 2 - }; - return { startPoint, endPoint }; - } - startPressAnimation(positionEvent) { - if (!this.mdRoot) { - return; - } - this.pressed = true; - this.growAnimation?.cancel(); - this.determineRippleSize(); - const { startPoint, endPoint } = this.getTranslationCoordinates(positionEvent); - const translateStart = `${startPoint.x}px, ${startPoint.y}px`; - const translateEnd = `${endPoint.x}px, ${endPoint.y}px`; - this.growAnimation = this.mdRoot.animate({ - top: [0, 0], - left: [0, 0], - height: [this.rippleSize, this.rippleSize], - width: [this.rippleSize, this.rippleSize], - transform: [ - `translate(${translateStart}) scale(1)`, - `translate(${translateEnd}) scale(${this.rippleScale})` - ] - }, { - pseudoElement: PRESS_PSEUDO, - duration: PRESS_GROW_MS, - easing: EASING.STANDARD, - fill: ANIMATION_FILL - }); - } - async endPressAnimation() { - this.rippleStartEvent = void 0; - this.state = State.INACTIVE; - const animation = this.growAnimation; - let pressAnimationPlayState = Infinity; - if (typeof animation?.currentTime === "number") { - pressAnimationPlayState = animation.currentTime; - } else if (animation?.currentTime) { - pressAnimationPlayState = animation.currentTime.to("ms").value; - } - if (pressAnimationPlayState >= MINIMUM_PRESS_MS) { - this.pressed = false; - return; - } - await new Promise((resolve) => { - setTimeout(resolve, MINIMUM_PRESS_MS - pressAnimationPlayState); - }); - if (this.growAnimation !== animation) { - return; - } - this.pressed = false; - } - /** - * Returns `true` if - * - the ripple element is enabled - * - the pointer is primary for the input type - * - the pointer is the pointer that started the interaction, or will start - * the interaction - * - the pointer is a touch, or the pointer state has the primary button - * held, or the pointer is hovering - */ - shouldReactToEvent(event) { - if (this.disabled || !event.isPrimary) { - return false; - } - if (this.rippleStartEvent && this.rippleStartEvent.pointerId !== event.pointerId) { - return false; - } - if (event.type === "pointerenter" || event.type === "pointerleave") { - return !this.isTouch(event); - } - const isPrimaryButton = event.buttons === 1; - return this.isTouch(event) || isPrimaryButton; - } - /** - * Check if the event is within the bounds of the element. - * - * This is only needed for the "stuck" contextmenu longpress on Chrome. - */ - inBounds({ x: x2, y: y2 }) { - const { top, left, bottom, right } = this.getBoundingClientRect(); - return x2 >= left && x2 <= right && y2 >= top && y2 <= bottom; - } - isTouch({ pointerType }) { - return pointerType === "touch"; - } - /** @private */ - async handleEvent(event) { - if (FORCED_COLORS?.matches) { - return; - } - switch (event.type) { - case "click": - this.handleClick(); - break; - case "contextmenu": - this.handleContextmenu(); - break; - case "pointercancel": - this.handlePointercancel(event); - break; - case "pointerdown": - await this.handlePointerdown(event); - break; - case "pointerenter": - this.handlePointerenter(event); - break; - case "pointerleave": - this.handlePointerleave(event); - break; - case "pointerup": - this.handlePointerup(event); - break; - default: - break; - } - } - onControlChange(prev, next) { - if (co) - return; - for (const event of EVENTS2) { - prev?.removeEventListener(event, this); - next?.addEventListener(event, this); - } - } - }; - __decorate([ - n4({ type: Boolean, reflect: true }) - ], Ripple.prototype, "disabled", void 0); - __decorate([ - r4() - ], Ripple.prototype, "hovered", void 0); - __decorate([ - r4() - ], Ripple.prototype, "pressed", void 0); - __decorate([ - e4(".surface") - ], Ripple.prototype, "mdRoot", void 0); - - // node_modules/@material/web/ripple/internal/ripple-styles.js - var styles3 = i`:host{display:flex;margin:auto;pointer-events:none}:host([disabled]){display:none}@media(forced-colors: active){:host{display:none}}:host,.surface{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.surface{-webkit-tap-highlight-color:rgba(0,0,0,0)}.surface::before,.surface::after{content:"";opacity:0;position:absolute}.surface::before{background-color:var(--md-ripple-hover-color, var(--md-sys-color-on-surface, #1d1b20));inset:0;transition:opacity 15ms linear,background-color 15ms linear}.surface::after{background:radial-gradient(closest-side, var(--md-ripple-pressed-color, var(--md-sys-color-on-surface, #1d1b20)) max(100% - 70px, 65%), transparent 100%);transform-origin:center center;transition:opacity 375ms linear}.hovered::before{background-color:var(--md-ripple-hover-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-ripple-hover-opacity, 0.08)}.pressed::after{opacity:var(--md-ripple-pressed-opacity, 0.12);transition-duration:105ms} -`; - - // node_modules/@material/web/ripple/ripple.js - var MdRipple = class MdRipple2 extends Ripple { - }; - MdRipple.styles = [styles3]; - MdRipple = __decorate([ - t2("md-ripple") - ], MdRipple); - - // node_modules/@material/web/internal/aria/aria.js - var ARIA_PROPERTIES = [ - "role", - "ariaAtomic", - "ariaAutoComplete", - "ariaBusy", - "ariaChecked", - "ariaColCount", - "ariaColIndex", - "ariaColSpan", - "ariaCurrent", - "ariaDisabled", - "ariaExpanded", - "ariaHasPopup", - "ariaHidden", - "ariaInvalid", - "ariaKeyShortcuts", - "ariaLabel", - "ariaLevel", - "ariaLive", - "ariaModal", - "ariaMultiLine", - "ariaMultiSelectable", - "ariaOrientation", - "ariaPlaceholder", - "ariaPosInSet", - "ariaPressed", - "ariaReadOnly", - "ariaRequired", - "ariaRoleDescription", - "ariaRowCount", - "ariaRowIndex", - "ariaRowSpan", - "ariaSelected", - "ariaSetSize", - "ariaSort", - "ariaValueMax", - "ariaValueMin", - "ariaValueNow", - "ariaValueText" - ]; - var ARIA_ATTRIBUTES = ARIA_PROPERTIES.map(ariaPropertyToAttribute); - function isAriaAttribute(attribute) { - return ARIA_ATTRIBUTES.includes(attribute); - } - function ariaPropertyToAttribute(property) { - return property.replace("aria", "aria-").replace(/Elements?/g, "").toLowerCase(); - } - - // node_modules/@material/web/internal/aria/delegate.js - var privateIgnoreAttributeChangesFor = Symbol("privateIgnoreAttributeChangesFor"); - function mixinDelegatesAria(base) { - var _a2; - if (co) { - return base; - } - class WithDelegatesAriaElement extends base { - constructor() { - super(...arguments); - this[_a2] = /* @__PURE__ */ new Set(); - } - attributeChangedCallback(name, oldValue, newValue) { - if (!isAriaAttribute(name)) { - super.attributeChangedCallback(name, oldValue, newValue); - return; - } - if (this[privateIgnoreAttributeChangesFor].has(name)) { - return; - } - this[privateIgnoreAttributeChangesFor].add(name); - this.removeAttribute(name); - this[privateIgnoreAttributeChangesFor].delete(name); - const dataProperty = ariaAttributeToDataProperty(name); - if (newValue === null) { - delete this.dataset[dataProperty]; - } else { - this.dataset[dataProperty] = newValue; - } - this.requestUpdate(ariaAttributeToDataProperty(name), oldValue); - } - getAttribute(name) { - if (isAriaAttribute(name)) { - return super.getAttribute(ariaAttributeToDataAttribute(name)); - } - return super.getAttribute(name); - } - removeAttribute(name) { - super.removeAttribute(name); - if (isAriaAttribute(name)) { - super.removeAttribute(ariaAttributeToDataAttribute(name)); - this.requestUpdate(); - } - } - } - _a2 = privateIgnoreAttributeChangesFor; - setupDelegatesAriaProperties(WithDelegatesAriaElement); - return WithDelegatesAriaElement; - } - function setupDelegatesAriaProperties(ctor) { - for (const ariaProperty of ARIA_PROPERTIES) { - const ariaAttribute = ariaPropertyToAttribute(ariaProperty); - const dataAttribute = ariaAttributeToDataAttribute(ariaAttribute); - const dataProperty = ariaAttributeToDataProperty(ariaAttribute); - ctor.createProperty(ariaProperty, { - attribute: ariaAttribute, - noAccessor: true - }); - ctor.createProperty(Symbol(dataAttribute), { - attribute: dataAttribute, - noAccessor: true - }); - Object.defineProperty(ctor.prototype, ariaProperty, { - configurable: true, - enumerable: true, - get() { - return this.dataset[dataProperty] ?? null; - }, - set(value) { - const prevValue = this.dataset[dataProperty] ?? null; - if (value === prevValue) { - return; - } - if (value === null) { - delete this.dataset[dataProperty]; - } else { - this.dataset[dataProperty] = value; - } - this.requestUpdate(ariaProperty, prevValue); - } - }); - } - } - function ariaAttributeToDataAttribute(ariaAttribute) { - return `data-${ariaAttribute}`; - } - function ariaAttributeToDataProperty(ariaAttribute) { - return ariaAttribute.replace(/-\w/, (dashLetter) => dashLetter[1].toUpperCase()); - } - - // node_modules/@material/web/labs/behaviors/element-internals.js - var internals = Symbol("internals"); - var privateInternals = Symbol("privateInternals"); - function mixinElementInternals(base) { - class WithElementInternalsElement extends base { - get [internals]() { - if (!this[privateInternals]) { - this[privateInternals] = this.attachInternals(); - } - return this[privateInternals]; - } - } - return WithElementInternalsElement; - } - - // node_modules/@material/web/internal/controller/form-submitter.js - function setupFormSubmitter(ctor) { - if (co) { - return; - } - ctor.addInitializer((instance) => { - const submitter = instance; - submitter.addEventListener("click", async (event) => { - const { type, [internals]: elementInternals } = submitter; - const { form } = elementInternals; - if (!form || type === "button") { - return; - } - await new Promise((resolve) => { - setTimeout(resolve); - }); - if (event.defaultPrevented) { - return; - } - if (type === "reset") { - form.reset(); - return; - } - form.addEventListener("submit", (submitEvent) => { - Object.defineProperty(submitEvent, "submitter", { - configurable: true, - enumerable: true, - get: () => submitter - }); - }, { capture: true, once: true }); - elementInternals.setFormValue(submitter.value); - form.requestSubmit(); - }); - }); - } - - // node_modules/@material/web/internal/events/form-label-activation.js - function dispatchActivationClick(element) { - const event = new MouseEvent("click", { bubbles: true }); - element.dispatchEvent(event); - return event; - } - function isActivationClick(event) { - if (event.currentTarget !== event.target) { - return false; - } - if (event.composedPath()[0] !== event.target) { - return false; - } - if (event.target.disabled) { - return false; - } - return !squelchEvent(event); - } - function squelchEvent(event) { - const squelched = isSquelchingEvents; - if (squelched) { - event.preventDefault(); - event.stopImmediatePropagation(); - } - squelchEventsForMicrotask(); - return squelched; - } - var isSquelchingEvents = false; - async function squelchEventsForMicrotask() { - isSquelchingEvents = true; - await null; - isSquelchingEvents = false; - } - - // node_modules/@material/web/button/internal/button.js - var buttonBaseClass = mixinDelegatesAria(mixinElementInternals(h3)); - var Button = class extends buttonBaseClass { - get name() { - return this.getAttribute("name") ?? ""; - } - set name(name) { - this.setAttribute("name", name); - } - /** - * The associated form element with which this element's value will submit. - */ - get form() { - return this[internals].form; - } - constructor() { - super(); - this.disabled = false; - this.softDisabled = false; - this.href = ""; - this.target = ""; - this.trailingIcon = false; - this.hasIcon = false; - this.type = "submit"; - this.value = ""; - if (!co) { - this.addEventListener("click", this.handleClick.bind(this)); - } - } - focus() { - this.buttonElement?.focus(); - } - blur() { - this.buttonElement?.blur(); - } - render() { - const isRippleDisabled = !this.href && (this.disabled || this.softDisabled); - const buttonOrLink = this.href ? this.renderLink() : this.renderButton(); - const buttonId = this.href ? "link" : "button"; - return ke` - ${this.renderElevationOrOutline?.()} -
- - - ${buttonOrLink} - `; - } - renderButton() { - const { ariaLabel, ariaHasPopup, ariaExpanded } = this; - return ke``; - } - renderLink() { - const { ariaLabel, ariaHasPopup, ariaExpanded } = this; - return ke`${this.renderContent()} - `; - } - renderContent() { - const icon = ke``; - return ke` - - ${this.trailingIcon ? D : icon} - - ${this.trailingIcon ? icon : D} - `; - } - handleClick(event) { - if (!this.href && this.softDisabled) { - event.stopImmediatePropagation(); - event.preventDefault(); - return; - } - if (!isActivationClick(event) || !this.buttonElement) { - return; - } - this.focus(); - dispatchActivationClick(this.buttonElement); - } - handleSlotChange() { - this.hasIcon = this.assignedIcons.length > 0; - } - }; - (() => { - setupFormSubmitter(Button); - })(); - Button.formAssociated = true; - Button.shadowRootOptions = { - mode: "open", - delegatesFocus: true - }; - __decorate([ - n4({ type: Boolean, reflect: true }) - ], Button.prototype, "disabled", void 0); - __decorate([ - n4({ type: Boolean, attribute: "soft-disabled", reflect: true }) - ], Button.prototype, "softDisabled", void 0); - __decorate([ - n4() - ], Button.prototype, "href", void 0); - __decorate([ - n4() - ], Button.prototype, "target", void 0); - __decorate([ - n4({ type: Boolean, attribute: "trailing-icon", reflect: true }) - ], Button.prototype, "trailingIcon", void 0); - __decorate([ - n4({ type: Boolean, attribute: "has-icon", reflect: true }) - ], Button.prototype, "hasIcon", void 0); - __decorate([ - n4() - ], Button.prototype, "type", void 0); - __decorate([ - n4({ reflect: true }) - ], Button.prototype, "value", void 0); - __decorate([ - e4(".button") - ], Button.prototype, "buttonElement", void 0); - __decorate([ - o4({ slot: "icon", flatten: true }) - ], Button.prototype, "assignedIcons", void 0); - - // node_modules/@material/web/button/internal/filled-button.js - var FilledButton = class extends Button { - renderElevationOrOutline() { - return ke``; - } - }; - - // node_modules/@material/web/button/internal/filled-styles.js - var styles4 = i`:host{--_container-color: var(--md-filled-button-container-color, var(--md-sys-color-primary, #6750a4));--_container-elevation: var(--md-filled-button-container-elevation, 0);--_container-height: var(--md-filled-button-container-height, 40px);--_container-shadow-color: var(--md-filled-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_disabled-container-color: var(--md-filled-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-filled-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-filled-button-disabled-container-opacity, 0.12);--_disabled-label-text-color: var(--md-filled-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filled-button-disabled-label-text-opacity, 0.38);--_focus-container-elevation: var(--md-filled-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-filled-button-focus-label-text-color, var(--md-sys-color-on-primary, #fff));--_hover-container-elevation: var(--md-filled-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-filled-button-hover-label-text-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-color: var(--md-filled-button-hover-state-layer-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-opacity: var(--md-filled-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-filled-button-label-text-color, var(--md-sys-color-on-primary, #fff));--_label-text-font: var(--md-filled-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filled-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filled-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-filled-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-container-elevation: var(--md-filled-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-filled-button-pressed-label-text-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-color: var(--md-filled-button-pressed-state-layer-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-opacity: var(--md-filled-button-pressed-state-layer-opacity, 0.12);--_disabled-icon-color: var(--md-filled-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-button-disabled-icon-opacity, 0.38);--_focus-icon-color: var(--md-filled-button-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_hover-icon-color: var(--md-filled-button-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-color: var(--md-filled-button-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-size: var(--md-filled-button-icon-size, 18px);--_pressed-icon-color: var(--md-filled-button-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_container-shape-start-start: var(--md-filled-button-container-shape-start-start, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-button-container-shape-start-end, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-button-container-shape-end-end, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-button-container-shape-end-start, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-filled-button-leading-space, 24px);--_trailing-space: var(--md-filled-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-filled-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-filled-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-filled-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-filled-button-with-trailing-icon-trailing-space, 16px)} -`; - - // node_modules/@material/web/button/internal/shared-elevation-styles.js - var styles5 = i`md-elevation{transition-duration:280ms}:host(:is([disabled],[soft-disabled])) md-elevation{transition:none}md-elevation{--md-elevation-level: var(--_container-elevation);--md-elevation-shadow-color: var(--_container-shadow-color)}:host(:focus-within) md-elevation{--md-elevation-level: var(--_focus-container-elevation)}:host(:hover) md-elevation{--md-elevation-level: var(--_hover-container-elevation)}:host(:active) md-elevation{--md-elevation-level: var(--_pressed-container-elevation)}:host(:is([disabled],[soft-disabled])) md-elevation{--md-elevation-level: var(--_disabled-container-elevation)} -`; - - // node_modules/@material/web/button/internal/shared-styles.js - var styles6 = i`:host{border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end);box-sizing:border-box;cursor:pointer;display:inline-flex;gap:8px;min-height:var(--_container-height);outline:none;padding-block:calc((var(--_container-height) - max(var(--_label-text-line-height),var(--_icon-size)))/2);padding-inline-start:var(--_leading-space);padding-inline-end:var(--_trailing-space);place-content:center;place-items:center;position:relative;font-family:var(--_label-text-font);font-size:var(--_label-text-size);line-height:var(--_label-text-line-height);font-weight:var(--_label-text-weight);text-overflow:ellipsis;text-wrap:nowrap;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);vertical-align:top;--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}:host(:is([disabled],[soft-disabled])){cursor:default;pointer-events:none}.button{border-radius:inherit;cursor:inherit;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;-webkit-appearance:none;vertical-align:middle;background:rgba(0,0,0,0);text-decoration:none;min-width:calc(64px - var(--_leading-space) - var(--_trailing-space));width:100%;z-index:0;height:100%;font:inherit;color:var(--_label-text-color);padding:0;gap:inherit;text-transform:inherit}.button::-moz-focus-inner{padding:0;border:0}:host(:hover) .button{color:var(--_hover-label-text-color)}:host(:focus-within) .button{color:var(--_focus-label-text-color)}:host(:active) .button{color:var(--_pressed-label-text-color)}.background{background-color:var(--_container-color);border-radius:inherit;inset:0;position:absolute}.label{overflow:hidden}:is(.button,.label,.label slot),.label ::slotted(*){text-overflow:inherit}:host(:is([disabled],[soft-disabled])) .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}:host(:is([disabled],[soft-disabled])) .background{background-color:var(--_disabled-container-color);opacity:var(--_disabled-container-opacity)}@media(forced-colors: active){.background{border:1px solid CanvasText}:host(:is([disabled],[soft-disabled])){--_disabled-icon-color: GrayText;--_disabled-icon-opacity: 1;--_disabled-container-opacity: 1;--_disabled-label-text-color: GrayText;--_disabled-label-text-opacity: 1}}:host([has-icon]:not([trailing-icon])){padding-inline-start:var(--_with-leading-icon-leading-space);padding-inline-end:var(--_with-leading-icon-trailing-space)}:host([has-icon][trailing-icon]){padding-inline-start:var(--_with-trailing-icon-leading-space);padding-inline-end:var(--_with-trailing-icon-trailing-space)}::slotted([slot=icon]){display:inline-flex;position:relative;writing-mode:horizontal-tb;fill:currentColor;flex-shrink:0;color:var(--_icon-color);font-size:var(--_icon-size);inline-size:var(--_icon-size);block-size:var(--_icon-size)}:host(:hover) ::slotted([slot=icon]){color:var(--_hover-icon-color)}:host(:focus-within) ::slotted([slot=icon]){color:var(--_focus-icon-color)}:host(:active) ::slotted([slot=icon]){color:var(--_pressed-icon-color)}:host(:is([disabled],[soft-disabled])) ::slotted([slot=icon]){color:var(--_disabled-icon-color);opacity:var(--_disabled-icon-opacity)}.touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) 0}:host([touch-target=none]) .touch{display:none} -`; - - // node_modules/@material/web/button/filled-button.js - var MdFilledButton = class MdFilledButton2 extends FilledButton { - }; - MdFilledButton.styles = [ - styles6, - styles5, - styles4 - ]; - MdFilledButton = __decorate([ - t2("md-filled-button") - ], MdFilledButton); - - // node_modules/@material/web/button/internal/filled-tonal-button.js - var FilledTonalButton = class extends Button { - renderElevationOrOutline() { - return ke``; - } - }; - - // node_modules/@material/web/button/internal/filled-tonal-styles.js - var styles7 = i`:host{--_container-color: var(--md-filled-tonal-button-container-color, var(--md-sys-color-secondary-container, #e8def8));--_container-elevation: var(--md-filled-tonal-button-container-elevation, 0);--_container-height: var(--md-filled-tonal-button-container-height, 40px);--_container-shadow-color: var(--md-filled-tonal-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_disabled-container-color: var(--md-filled-tonal-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-filled-tonal-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-filled-tonal-button-disabled-container-opacity, 0.12);--_disabled-label-text-color: var(--md-filled-tonal-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filled-tonal-button-disabled-label-text-opacity, 0.38);--_focus-container-elevation: var(--md-filled-tonal-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-filled-tonal-button-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-container-elevation: var(--md-filled-tonal-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-filled-tonal-button-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-color: var(--md-filled-tonal-button-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-opacity: var(--md-filled-tonal-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-filled-tonal-button-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_label-text-font: var(--md-filled-tonal-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filled-tonal-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filled-tonal-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-filled-tonal-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-container-elevation: var(--md-filled-tonal-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-filled-tonal-button-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-color: var(--md-filled-tonal-button-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-filled-tonal-button-pressed-state-layer-opacity, 0.12);--_disabled-icon-color: var(--md-filled-tonal-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-tonal-button-disabled-icon-opacity, 0.38);--_focus-icon-color: var(--md-filled-tonal-button-focus-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-icon-color: var(--md-filled-tonal-button-hover-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_icon-color: var(--md-filled-tonal-button-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_icon-size: var(--md-filled-tonal-button-icon-size, 18px);--_pressed-icon-color: var(--md-filled-tonal-button-pressed-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_container-shape-start-start: var(--md-filled-tonal-button-container-shape-start-start, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-tonal-button-container-shape-start-end, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-tonal-button-container-shape-end-end, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-tonal-button-container-shape-end-start, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-filled-tonal-button-leading-space, 24px);--_trailing-space: var(--md-filled-tonal-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-filled-tonal-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-filled-tonal-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-filled-tonal-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-filled-tonal-button-with-trailing-icon-trailing-space, 16px)} -`; - - // node_modules/@material/web/button/filled-tonal-button.js - var MdFilledTonalButton = class MdFilledTonalButton2 extends FilledTonalButton { - }; - MdFilledTonalButton.styles = [ - styles6, - styles5, - styles7 - ]; - MdFilledTonalButton = __decorate([ - t2("md-filled-tonal-button") - ], MdFilledTonalButton); - - // node_modules/@material/web/button/internal/text-button.js - var TextButton = class extends Button { - }; - - // node_modules/@material/web/button/internal/text-styles.js - var styles8 = i`:host{--_container-height: var(--md-text-button-container-height, 40px);--_disabled-label-text-color: var(--md-text-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-text-button-disabled-label-text-opacity, 0.38);--_focus-label-text-color: var(--md-text-button-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-label-text-color: var(--md-text-button-hover-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-color: var(--md-text-button-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-opacity: var(--md-text-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-text-button-label-text-color, var(--md-sys-color-primary, #6750a4));--_label-text-font: var(--md-text-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-text-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-text-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-text-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-label-text-color: var(--md-text-button-pressed-label-text-color, var(--md-sys-color-primary, #6750a4));--_pressed-state-layer-color: var(--md-text-button-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_pressed-state-layer-opacity: var(--md-text-button-pressed-state-layer-opacity, 0.12);--_disabled-icon-color: var(--md-text-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-text-button-disabled-icon-opacity, 0.38);--_focus-icon-color: var(--md-text-button-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-icon-color: var(--md-text-button-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-color: var(--md-text-button-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-text-button-icon-size, 18px);--_pressed-icon-color: var(--md-text-button-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var(--md-text-button-container-shape-start-start, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-text-button-container-shape-start-end, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-text-button-container-shape-end-end, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-text-button-container-shape-end-start, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-text-button-leading-space, 12px);--_trailing-space: var(--md-text-button-trailing-space, 12px);--_with-leading-icon-leading-space: var(--md-text-button-with-leading-icon-leading-space, 12px);--_with-leading-icon-trailing-space: var(--md-text-button-with-leading-icon-trailing-space, 16px);--_with-trailing-icon-leading-space: var(--md-text-button-with-trailing-icon-leading-space, 16px);--_with-trailing-icon-trailing-space: var(--md-text-button-with-trailing-icon-trailing-space, 12px);--_container-color: none;--_disabled-container-color: none;--_disabled-container-opacity: 0} -`; - - // node_modules/@material/web/button/text-button.js - var MdTextButton = class MdTextButton2 extends TextButton { - }; - MdTextButton.styles = [styles6, styles8]; - MdTextButton = __decorate([ - t2("md-text-button") - ], MdTextButton); - - // node_modules/@material/web/divider/internal/divider.js - var Divider = class extends h3 { - constructor() { - super(...arguments); - this.inset = false; - this.insetStart = false; - this.insetEnd = false; - } - }; - __decorate([ - n4({ type: Boolean, reflect: true }) - ], Divider.prototype, "inset", void 0); - __decorate([ - n4({ type: Boolean, reflect: true, attribute: "inset-start" }) - ], Divider.prototype, "insetStart", void 0); - __decorate([ - n4({ type: Boolean, reflect: true, attribute: "inset-end" }) - ], Divider.prototype, "insetEnd", void 0); - - // node_modules/@material/web/divider/internal/divider-styles.js - var styles9 = i`:host{box-sizing:border-box;color:var(--md-divider-color, var(--md-sys-color-outline-variant, #cac4d0));display:flex;height:var(--md-divider-thickness, 1px);width:100%}:host([inset]),:host([inset-start]){padding-inline-start:16px}:host([inset]),:host([inset-end]){padding-inline-end:16px}:host::before{background:currentColor;content:"";height:100%;width:100%}@media(forced-colors: active){:host::before{background:CanvasText}} -`; - - // node_modules/@material/web/divider/divider.js - var MdDivider = class MdDivider2 extends Divider { - }; - MdDivider.styles = [styles9]; - MdDivider = __decorate([ - t2("md-divider") - ], MdDivider); - - // node_modules/@material/web/internal/events/redispatch-event.js - function redispatchEvent(element, event) { - if (event.bubbles && (!element.shadowRoot || event.composed)) { - event.stopPropagation(); - } - const copy = Reflect.construct(event.constructor, [event.type, event]); - const dispatched = element.dispatchEvent(copy); - if (!dispatched) { - event.preventDefault(); - } - return dispatched; - } - - // node_modules/@material/web/dialog/internal/animations.js - var DIALOG_DEFAULT_OPEN_ANIMATION = { - dialog: [ - [ - // Dialog slide down - [{ "transform": "translateY(-50px)" }, { "transform": "translateY(0)" }], - { duration: 500, easing: EASING.EMPHASIZED } - ] - ], - scrim: [ - [ - // Scrim fade in - [{ "opacity": 0 }, { "opacity": 0.32 }], - { duration: 500, easing: "linear" } - ] - ], - container: [ - [ - // Container fade in - [{ "opacity": 0 }, { "opacity": 1 }], - { duration: 50, easing: "linear", pseudoElement: "::before" } - ], - [ - // Container grow - // Note: current spec says to grow from 0dp->100% and shrink from - // 100%->35%. We change this to 35%->100% to simplify the animation that - // is supposed to clip content as it grows. From 0dp it's possible to see - // text/actions appear before the container has fully grown. - [{ "height": "35%" }, { "height": "100%" }], - { duration: 500, easing: EASING.EMPHASIZED, pseudoElement: "::before" } - ] - ], - headline: [ - [ - // Headline fade in - [{ "opacity": 0 }, { "opacity": 0, offset: 0.2 }, { "opacity": 1 }], - { duration: 250, easing: "linear", fill: "forwards" } - ] - ], - content: [ - [ - // Content fade in - [{ "opacity": 0 }, { "opacity": 0, offset: 0.2 }, { "opacity": 1 }], - { duration: 250, easing: "linear", fill: "forwards" } - ] - ], - actions: [ - [ - // Actions fade in - [{ "opacity": 0 }, { "opacity": 0, offset: 0.5 }, { "opacity": 1 }], - { duration: 300, easing: "linear", fill: "forwards" } - ] - ] - }; - var DIALOG_DEFAULT_CLOSE_ANIMATION = { - dialog: [ - [ - // Dialog slide up - [{ "transform": "translateY(0)" }, { "transform": "translateY(-50px)" }], - { duration: 150, easing: EASING.EMPHASIZED_ACCELERATE } - ] - ], - scrim: [ - [ - // Scrim fade out - [{ "opacity": 0.32 }, { "opacity": 0 }], - { duration: 150, easing: "linear" } - ] - ], - container: [ - [ - // Container shrink - [{ "height": "100%" }, { "height": "35%" }], - { - duration: 150, - easing: EASING.EMPHASIZED_ACCELERATE, - pseudoElement: "::before" - } - ], - [ - // Container fade out - [{ "opacity": "1" }, { "opacity": "0" }], - { delay: 100, duration: 50, easing: "linear", pseudoElement: "::before" } - ] - ], - headline: [ - [ - // Headline fade out - [{ "opacity": 1 }, { "opacity": 0 }], - { duration: 100, easing: "linear", fill: "forwards" } - ] - ], - content: [ - [ - // Content fade out - [{ "opacity": 1 }, { "opacity": 0 }], - { duration: 100, easing: "linear", fill: "forwards" } - ] - ], - actions: [ - [ - // Actions fade out - [{ "opacity": 1 }, { "opacity": 0 }], - { duration: 100, easing: "linear", fill: "forwards" } - ] - ] - }; - - // node_modules/@material/web/dialog/internal/dialog.js - var dialogBaseClass = mixinDelegatesAria(h3); - var Dialog = class extends dialogBaseClass { - // We do not use `delegatesFocus: true` due to a Chromium bug with - // selecting text. - // See https://bugs.chromium.org/p/chromium/issues/detail?id=950357 - /** - * Opens the dialog when set to `true` and closes it when set to `false`. - */ - get open() { - return this.isOpen; - } - set open(open) { - if (open === this.isOpen) { - return; - } - this.isOpen = open; - if (open) { - this.setAttribute("open", ""); - this.show(); - } else { - this.removeAttribute("open"); - this.close(); - } - } - constructor() { - super(); - this.quick = false; - this.returnValue = ""; - this.noFocusTrap = false; - this.getOpenAnimation = () => DIALOG_DEFAULT_OPEN_ANIMATION; - this.getCloseAnimation = () => DIALOG_DEFAULT_CLOSE_ANIMATION; - this.isOpen = false; - this.isOpening = false; - this.isConnectedPromise = this.getIsConnectedPromise(); - this.isAtScrollTop = false; - this.isAtScrollBottom = false; - this.nextClickIsFromContent = false; - this.hasHeadline = false; - this.hasActions = false; - this.hasIcon = false; - this.escapePressedWithoutCancel = false; - this.treewalker = co ? null : document.createTreeWalker(this, NodeFilter.SHOW_ELEMENT); - if (!co) { - this.addEventListener("submit", this.handleSubmit); - } - } - /** - * Opens the dialog and fires a cancelable `open` event. After a dialog's - * animation, an `opened` event is fired. - * - * Add an `autofocus` attribute to a child of the dialog that should - * receive focus after opening. - * - * @return A Promise that resolves after the animation is finished and the - * `opened` event was fired. - */ - async show() { - this.isOpening = true; - await this.isConnectedPromise; - await this.updateComplete; - const dialog = this.dialog; - if (dialog.open || !this.isOpening) { - this.isOpening = false; - return; - } - const preventOpen = !this.dispatchEvent(new Event("open", { cancelable: true })); - if (preventOpen) { - this.open = false; - this.isOpening = false; - return; - } - dialog.showModal(); - this.open = true; - if (this.scroller) { - this.scroller.scrollTop = 0; - } - this.querySelector("[autofocus]")?.focus(); - await this.animateDialog(this.getOpenAnimation()); - this.dispatchEvent(new Event("opened")); - this.isOpening = false; - } - /** - * Closes the dialog and fires a cancelable `close` event. After a dialog's - * animation, a `closed` event is fired. - * - * @param returnValue A return value usually indicating which button was used - * to close a dialog. If a dialog is canceled by clicking the scrim or - * pressing Escape, it will not change the return value after closing. - * @return A Promise that resolves after the animation is finished and the - * `closed` event was fired. - */ - async close(returnValue = this.returnValue) { - this.isOpening = false; - if (!this.isConnected) { - this.open = false; - return; - } - await this.updateComplete; - const dialog = this.dialog; - if (!dialog.open || this.isOpening) { - this.open = false; - return; - } - const prevReturnValue = this.returnValue; - this.returnValue = returnValue; - const preventClose = !this.dispatchEvent(new Event("close", { cancelable: true })); - if (preventClose) { - this.returnValue = prevReturnValue; - return; - } - await this.animateDialog(this.getCloseAnimation()); - dialog.close(returnValue); - this.open = false; - this.dispatchEvent(new Event("closed")); - } - connectedCallback() { - super.connectedCallback(); - this.isConnectedPromiseResolve(); - } - disconnectedCallback() { - super.disconnectedCallback(); - this.isConnectedPromise = this.getIsConnectedPromise(); - } - render() { - const scrollable = this.open && !(this.isAtScrollTop && this.isAtScrollBottom); - const classes = { - "has-headline": this.hasHeadline, - "has-actions": this.hasActions, - "has-icon": this.hasIcon, - "scrollable": scrollable, - "show-top-divider": scrollable && !this.isAtScrollTop, - "show-bottom-divider": scrollable && !this.isAtScrollBottom - }; - const showFocusTrap = this.open && !this.noFocusTrap; - const focusTrap = ke` - - `; - const { ariaLabel } = this; - return ke` -
- - ${showFocusTrap ? focusTrap : D} -
-
- -

- -

- -
-
-
-
- -
-
-
-
- - -
-
- ${showFocusTrap ? focusTrap : D} - - `; - } - firstUpdated() { - this.intersectionObserver = new IntersectionObserver((entries) => { - for (const entry of entries) { - this.handleAnchorIntersection(entry); - } - }, { root: this.scroller }); - this.intersectionObserver.observe(this.topAnchor); - this.intersectionObserver.observe(this.bottomAnchor); - } - handleDialogClick() { - if (this.nextClickIsFromContent) { - this.nextClickIsFromContent = false; - return; - } - const preventDefault = !this.dispatchEvent(new Event("cancel", { cancelable: true })); - if (preventDefault) { - return; - } - this.close(); - } - handleContentClick() { - this.nextClickIsFromContent = true; - } - handleSubmit(event) { - const form = event.target; - const { submitter } = event; - if (form.method !== "dialog" || !submitter) { - return; - } - this.close(submitter.getAttribute("value") ?? this.returnValue); - } - handleCancel(event) { - if (event.target !== this.dialog) { - return; - } - this.escapePressedWithoutCancel = false; - const preventDefault = !redispatchEvent(this, event); - event.preventDefault(); - if (preventDefault) { - return; - } - this.close(); - } - handleClose() { - if (!this.escapePressedWithoutCancel) { - return; - } - this.escapePressedWithoutCancel = false; - this.dialog?.dispatchEvent(new Event("cancel", { cancelable: true })); - } - handleKeydown(event) { - if (event.key !== "Escape") { - return; - } - this.escapePressedWithoutCancel = true; - setTimeout(() => { - this.escapePressedWithoutCancel = false; - }); - } - async animateDialog(animation) { - this.cancelAnimations?.abort(); - this.cancelAnimations = new AbortController(); - if (this.quick) { - return; - } - const { dialog, scrim, container, headline, content, actions } = this; - if (!dialog || !scrim || !container || !headline || !content || !actions) { - return; - } - const { container: containerAnimate, dialog: dialogAnimate, scrim: scrimAnimate, headline: headlineAnimate, content: contentAnimate, actions: actionsAnimate } = animation; - const elementAndAnimation = [ - [dialog, dialogAnimate ?? []], - [scrim, scrimAnimate ?? []], - [container, containerAnimate ?? []], - [headline, headlineAnimate ?? []], - [content, contentAnimate ?? []], - [actions, actionsAnimate ?? []] - ]; - const animations = []; - for (const [element, animation2] of elementAndAnimation) { - for (const animateArgs of animation2) { - const animation3 = element.animate(...animateArgs); - this.cancelAnimations.signal.addEventListener("abort", () => { - animation3.cancel(); - }); - animations.push(animation3); - } - } - await Promise.all(animations.map((animation2) => animation2.finished.catch(() => { - }))); - } - handleHeadlineChange(event) { - const slot = event.target; - this.hasHeadline = slot.assignedElements().length > 0; - } - handleActionsChange(event) { - const slot = event.target; - this.hasActions = slot.assignedElements().length > 0; - } - handleIconChange(event) { - const slot = event.target; - this.hasIcon = slot.assignedElements().length > 0; - } - handleAnchorIntersection(entry) { - const { target, isIntersecting } = entry; - if (target === this.topAnchor) { - this.isAtScrollTop = isIntersecting; - } - if (target === this.bottomAnchor) { - this.isAtScrollBottom = isIntersecting; - } - } - getIsConnectedPromise() { - return new Promise((resolve) => { - this.isConnectedPromiseResolve = resolve; - }); - } - handleFocusTrapFocus(event) { - const [firstFocusableChild, lastFocusableChild] = this.getFirstAndLastFocusableChildren(); - if (!firstFocusableChild || !lastFocusableChild) { - this.dialog?.focus(); - return; - } - const isFirstFocusTrap = event.target === this.firstFocusTrap; - const isLastFocusTrap = !isFirstFocusTrap; - const focusCameFromFirstChild = event.relatedTarget === firstFocusableChild; - const focusCameFromLastChild = event.relatedTarget === lastFocusableChild; - const focusCameFromOutsideDialog = !focusCameFromFirstChild && !focusCameFromLastChild; - const shouldFocusFirstChild = isLastFocusTrap && focusCameFromLastChild || isFirstFocusTrap && focusCameFromOutsideDialog; - if (shouldFocusFirstChild) { - firstFocusableChild.focus(); - return; - } - const shouldFocusLastChild = isFirstFocusTrap && focusCameFromFirstChild || isLastFocusTrap && focusCameFromOutsideDialog; - if (shouldFocusLastChild) { - lastFocusableChild.focus(); - return; - } - } - getFirstAndLastFocusableChildren() { - if (!this.treewalker) { - return [null, null]; - } - let firstFocusableChild = null; - let lastFocusableChild = null; - this.treewalker.currentNode = this.treewalker.root; - while (this.treewalker.nextNode()) { - const nextChild = this.treewalker.currentNode; - if (!isFocusable(nextChild)) { - continue; - } - if (!firstFocusableChild) { - firstFocusableChild = nextChild; - } - lastFocusableChild = nextChild; - } - return [firstFocusableChild, lastFocusableChild]; - } - }; - __decorate([ - n4({ type: Boolean }) - ], Dialog.prototype, "open", null); - __decorate([ - n4({ type: Boolean }) - ], Dialog.prototype, "quick", void 0); - __decorate([ - n4({ attribute: false }) - ], Dialog.prototype, "returnValue", void 0); - __decorate([ - n4() - ], Dialog.prototype, "type", void 0); - __decorate([ - n4({ type: Boolean, attribute: "no-focus-trap" }) - ], Dialog.prototype, "noFocusTrap", void 0); - __decorate([ - e4("dialog") - ], Dialog.prototype, "dialog", void 0); - __decorate([ - e4(".scrim") - ], Dialog.prototype, "scrim", void 0); - __decorate([ - e4(".container") - ], Dialog.prototype, "container", void 0); - __decorate([ - e4(".headline") - ], Dialog.prototype, "headline", void 0); - __decorate([ - e4(".content") - ], Dialog.prototype, "content", void 0); - __decorate([ - e4(".actions") - ], Dialog.prototype, "actions", void 0); - __decorate([ - r4() - ], Dialog.prototype, "isAtScrollTop", void 0); - __decorate([ - r4() - ], Dialog.prototype, "isAtScrollBottom", void 0); - __decorate([ - e4(".scroller") - ], Dialog.prototype, "scroller", void 0); - __decorate([ - e4(".top.anchor") - ], Dialog.prototype, "topAnchor", void 0); - __decorate([ - e4(".bottom.anchor") - ], Dialog.prototype, "bottomAnchor", void 0); - __decorate([ - e4(".focus-trap") - ], Dialog.prototype, "firstFocusTrap", void 0); - __decorate([ - r4() - ], Dialog.prototype, "hasHeadline", void 0); - __decorate([ - r4() - ], Dialog.prototype, "hasActions", void 0); - __decorate([ - r4() - ], Dialog.prototype, "hasIcon", void 0); - function isFocusable(element) { - const knownFocusableElements = ":is(button,input,select,textarea,object,:is(a,area)[href],[tabindex],[contenteditable=true])"; - const notDisabled = ":not(:disabled,[disabled])"; - const notNegativeTabIndex = ':not([tabindex^="-"])'; - if (element.matches(knownFocusableElements + notDisabled + notNegativeTabIndex)) { - return true; - } - const isCustomElement = element.localName.includes("-"); - if (!isCustomElement) { - return false; - } - if (!element.matches(notDisabled)) { - return false; - } - return element.shadowRoot?.delegatesFocus ?? false; - } - - // node_modules/@material/web/dialog/internal/dialog-styles.js - var styles10 = i`:host{border-start-start-radius:var(--md-dialog-container-shape-start-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-start-end-radius:var(--md-dialog-container-shape-start-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-end-radius:var(--md-dialog-container-shape-end-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-start-radius:var(--md-dialog-container-shape-end-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));display:flex;flex-direction:column;font-family:var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));font-size:var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));line-height:var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));font-weight:var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));fill:currentColor;font-size:var(--md-dialog-icon-size, 24px);margin-top:24px;height:var(--md-dialog-icon-size, 24px);width:var(--md-dialog-icon-size, 24px)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));border-radius:inherit;content:"";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));font-family:var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));line-height:var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));flex:1;font-weight:var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}} -`; - - // node_modules/@material/web/dialog/dialog.js - var MdDialog = class MdDialog2 extends Dialog { - }; - MdDialog.styles = [styles10]; - MdDialog = __decorate([ - t2("md-dialog") - ], MdDialog); - - // node_modules/@material/web/icon/internal/icon.js - var Icon = class extends h3 { - render() { - return ke``; - } - connectedCallback() { - super.connectedCallback(); - const ariaHidden = this.getAttribute("aria-hidden"); - if (ariaHidden === "false") { - this.removeAttribute("aria-hidden"); - return; - } - this.setAttribute("aria-hidden", "true"); - } - }; - - // node_modules/@material/web/icon/internal/icon-styles.js - var styles11 = i`:host{font-size:var(--md-icon-size, 24px);width:var(--md-icon-size, 24px);height:var(--md-icon-size, 24px);color:inherit;font-variation-settings:inherit;font-weight:400;font-family:var(--md-icon-font, Material Symbols Outlined);display:inline-flex;font-style:normal;place-items:center;place-content:center;line-height:1;overflow:hidden;letter-spacing:normal;text-transform:none;user-select:none;white-space:nowrap;word-wrap:normal;flex-shrink:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}::slotted(svg){fill:currentColor}::slotted(*){height:100%;width:100%} -`; - - // node_modules/@material/web/icon/icon.js - var MdIcon = class MdIcon2 extends Icon { - }; - MdIcon.styles = [styles11]; - MdIcon = __decorate([ - t2("md-icon") - ], MdIcon); - - // node_modules/lit-html/static.js - var $e = Symbol.for(""); - var xe = (t4) => { - if (t4?.r === $e) - return t4?._$litStatic$; - }; - var er = (t4, ...r5) => ({ _$litStatic$: r5.reduce((r6, e6, a2) => r6 + ((t5) => { - if (void 0 !== t5._$litStatic$) - return t5._$litStatic$; - throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t5}. Use 'unsafeStatic' to pass non-literal values, but - take care to ensure page security.`); - })(e6) + t4[a2 + 1], t4[0]), r: $e }); - var Te = /* @__PURE__ */ new Map(); - var Ee = (t4) => (r5, ...e6) => { - const a2 = e6.length; - let o5, s2; - const i4 = [], l2 = []; - let n5, u2 = 0, c4 = false; - for (; u2 < a2; ) { - for (n5 = r5[u2]; u2 < a2 && void 0 !== (s2 = e6[u2], o5 = xe(s2)); ) - n5 += o5 + r5[++u2], c4 = true; - u2 !== a2 && l2.push(s2), i4.push(n5), u2++; - } - if (u2 === a2 && i4.push(r5[a2]), c4) { - const t5 = i4.join("$$lit$$"); - void 0 === (r5 = Te.get(t5)) && (i4.raw = i4, Te.set(t5, r5 = i4)), e6 = l2; - } - return t4(r5, ...e6); - }; - var ke2 = Ee(ke); - var Oe2 = Ee(Oe); - var Se2 = Ee(Se); - - // node_modules/@material/web/internal/controller/is-rtl.js - function isRtl(el, shouldCheck = true) { - return shouldCheck && getComputedStyle(el).getPropertyValue("direction").trim() === "rtl"; - } - - // node_modules/@material/web/iconbutton/internal/icon-button.js - var iconButtonBaseClass = mixinDelegatesAria(mixinElementInternals(h3)); - var IconButton = class extends iconButtonBaseClass { - get name() { - return this.getAttribute("name") ?? ""; - } - set name(name) { - this.setAttribute("name", name); - } - /** - * The associated form element with which this element's value will submit. - */ - get form() { - return this[internals].form; - } - /** - * The labels this element is associated with. - */ - get labels() { - return this[internals].labels; - } - constructor() { - super(); - this.disabled = false; - this.softDisabled = false; - this.flipIconInRtl = false; - this.href = ""; - this.target = ""; - this.ariaLabelSelected = ""; - this.toggle = false; - this.selected = false; - this.type = "submit"; - this.value = ""; - this.flipIcon = isRtl(this, this.flipIconInRtl); - if (!co) { - this.addEventListener("click", this.handleClick.bind(this)); - } - } - willUpdate() { - if (this.href) { - this.disabled = false; - this.softDisabled = false; - } - } - render() { - const tag = this.href ? er`div` : er`button`; - const { ariaLabel, ariaHasPopup, ariaExpanded } = this; - const hasToggledAriaLabel = ariaLabel && this.ariaLabelSelected; - const ariaPressedValue = !this.toggle ? D : this.selected; - let ariaLabelValue = D; - if (!this.href) { - ariaLabelValue = hasToggledAriaLabel && this.selected ? this.ariaLabelSelected : ariaLabel; - } - return ke2`<${tag} - class="icon-button ${Rt(this.getRenderClasses())}" - id="button" - aria-label="${ariaLabelValue || D}" - aria-haspopup="${!this.href && ariaHasPopup || D}" - aria-expanded="${!this.href && ariaExpanded || D}" - aria-pressed="${ariaPressedValue}" - aria-disabled=${!this.href && this.softDisabled || D} - ?disabled="${!this.href && this.disabled}" - @click="${this.handleClickOnChild}"> - ${this.renderFocusRing()} - ${this.renderRipple()} - ${!this.selected ? this.renderIcon() : D} - ${this.selected ? this.renderSelectedIcon() : D} - ${this.renderTouchTarget()} - ${this.href && this.renderLink()} - `; - } - renderLink() { - const { ariaLabel } = this; - return ke` - - `; - } - getRenderClasses() { - return { - "flip-icon": this.flipIcon, - "selected": this.toggle && this.selected - }; - } - renderIcon() { - return ke``; - } - renderSelectedIcon() { - return ke``; - } - renderTouchTarget() { - return ke``; - } - renderFocusRing() { - return ke``; - } - renderRipple() { - const isRippleDisabled = !this.href && (this.disabled || this.softDisabled); - return ke``; - } - connectedCallback() { - this.flipIcon = isRtl(this, this.flipIconInRtl); - super.connectedCallback(); - } - /** Handles a click on this element. */ - handleClick(event) { - if (!this.href && this.softDisabled) { - event.stopImmediatePropagation(); - event.preventDefault(); - return; - } - } - /** - * Handles a click on the child
or