+
+ ${title(model.tab.domain)} ${description((0, import_raw2.default)(text))}
+
+ `;
}
}[state]();
}
@@ -15604,356 +15843,6 @@
return /* @__PURE__ */ y("a", { href: "javascript:void(0)", className: classes.join(" "), draggable: false, ...rest }, children);
}
- // node_modules/@material/switch/constants.js
- var CssClasses;
- (function(CssClasses2) {
- CssClasses2["PROCESSING"] = "mdc-switch--processing";
- CssClasses2["SELECTED"] = "mdc-switch--selected";
- CssClasses2["UNSELECTED"] = "mdc-switch--unselected";
- })(CssClasses || (CssClasses = {}));
- var Selectors;
- (function(Selectors2) {
- Selectors2["RIPPLE"] = ".mdc-switch__ripple";
- })(Selectors || (Selectors = {}));
-
- // node_modules/@material/base/observer.js
- function observeProperty(target, property, observer) {
- var targetObservers = installObserver(target, property);
- var observers = targetObservers.getObservers(property);
- observers.push(observer);
- return function() {
- observers.splice(observers.indexOf(observer), 1);
- };
- }
- var allTargetObservers = /* @__PURE__ */ new WeakMap();
- function installObserver(target, property) {
- var observersMap = /* @__PURE__ */ new Map();
- if (!allTargetObservers.has(target)) {
- allTargetObservers.set(target, {
- isEnabled: true,
- getObservers: function(key) {
- var observers = observersMap.get(key) || [];
- if (!observersMap.has(key)) {
- observersMap.set(key, observers);
- }
- return observers;
- },
- installedProperties: /* @__PURE__ */ new Set()
- });
- }
- var targetObservers = allTargetObservers.get(target);
- if (targetObservers.installedProperties.has(property)) {
- return targetObservers;
- }
- var descriptor = getDescriptor(target, property) || {
- configurable: true,
- enumerable: true,
- value: target[property],
- writable: true
- };
- var observedDescriptor = __assign({}, descriptor);
- var descGet = descriptor.get, descSet = descriptor.set;
- if ("value" in descriptor) {
- delete observedDescriptor.value;
- delete observedDescriptor.writable;
- var value_1 = descriptor.value;
- descGet = function() {
- return value_1;
- };
- if (descriptor.writable) {
- descSet = function(newValue) {
- value_1 = newValue;
- };
- }
- }
- if (descGet) {
- observedDescriptor.get = function() {
- return descGet.call(this);
- };
- }
- if (descSet) {
- observedDescriptor.set = function(newValue) {
- var e_4, _a2;
- var previous = descGet ? descGet.call(this) : newValue;
- descSet.call(this, newValue);
- if (targetObservers.isEnabled && (!descGet || newValue !== previous)) {
- try {
- for (var _b = __values(targetObservers.getObservers(property)), _c = _b.next(); !_c.done; _c = _b.next()) {
- var observer = _c.value;
- observer(newValue, previous);
- }
- } catch (e_4_1) {
- e_4 = { error: e_4_1 };
- } finally {
- try {
- if (_c && !_c.done && (_a2 = _b.return))
- _a2.call(_b);
- } finally {
- if (e_4)
- throw e_4.error;
- }
- }
- }
- };
- }
- targetObservers.installedProperties.add(property);
- Object.defineProperty(target, property, observedDescriptor);
- return targetObservers;
- }
- function getDescriptor(target, property) {
- var descriptorTarget = target;
- var descriptor;
- while (descriptorTarget) {
- descriptor = Object.getOwnPropertyDescriptor(descriptorTarget, property);
- if (descriptor) {
- break;
- }
- descriptorTarget = Object.getPrototypeOf(descriptorTarget);
- }
- return descriptor;
- }
- function setObserversEnabled(target, enabled) {
- var targetObservers = allTargetObservers.get(target);
- if (targetObservers) {
- targetObservers.isEnabled = enabled;
- }
- }
-
- // node_modules/@material/base/observer-foundation.js
- var MDCObserverFoundation = (
- /** @class */
- function(_super) {
- __extends(MDCObserverFoundation2, _super);
- function MDCObserverFoundation2(adapter) {
- var _this = _super.call(this, adapter) || this;
- _this.unobserves = /* @__PURE__ */ new Set();
- return _this;
- }
- MDCObserverFoundation2.prototype.destroy = function() {
- _super.prototype.destroy.call(this);
- this.unobserve();
- };
- MDCObserverFoundation2.prototype.observe = function(target, observers) {
- var e_1, _a2;
- var _this = this;
- var cleanup = [];
- try {
- for (var _b = __values(Object.keys(observers)), _c = _b.next(); !_c.done; _c = _b.next()) {
- var property = _c.value;
- var observer = observers[property].bind(this);
- cleanup.push(this.observeProperty(target, property, observer));
- }
- } catch (e_1_1) {
- e_1 = { error: e_1_1 };
- } finally {
- try {
- if (_c && !_c.done && (_a2 = _b.return))
- _a2.call(_b);
- } finally {
- if (e_1)
- throw e_1.error;
- }
- }
- var unobserve = function() {
- var e_2, _a3;
- try {
- for (var cleanup_1 = __values(cleanup), cleanup_1_1 = cleanup_1.next(); !cleanup_1_1.done; cleanup_1_1 = cleanup_1.next()) {
- var cleanupFn = cleanup_1_1.value;
- cleanupFn();
- }
- } catch (e_2_1) {
- e_2 = { error: e_2_1 };
- } finally {
- try {
- if (cleanup_1_1 && !cleanup_1_1.done && (_a3 = cleanup_1.return))
- _a3.call(cleanup_1);
- } finally {
- if (e_2)
- throw e_2.error;
- }
- }
- _this.unobserves.delete(unobserve);
- };
- this.unobserves.add(unobserve);
- return unobserve;
- };
- MDCObserverFoundation2.prototype.observeProperty = function(target, property, observer) {
- return observeProperty(target, property, observer);
- };
- MDCObserverFoundation2.prototype.setObserversEnabled = function(target, enabled) {
- setObserversEnabled(target, enabled);
- };
- MDCObserverFoundation2.prototype.unobserve = function() {
- var e_3, _a2;
- try {
- for (var _b = __values(__spreadArray([], __read(this.unobserves))), _c = _b.next(); !_c.done; _c = _b.next()) {
- var unobserve = _c.value;
- unobserve();
- }
- } catch (e_3_1) {
- e_3 = { error: e_3_1 };
- } finally {
- try {
- if (_c && !_c.done && (_a2 = _b.return))
- _a2.call(_b);
- } finally {
- if (e_3)
- throw e_3.error;
- }
- }
- };
- return MDCObserverFoundation2;
- }(MDCFoundation)
- );
-
- // node_modules/@material/switch/foundation.js
- var MDCSwitchFoundation = (
- /** @class */
- function(_super) {
- __extends(MDCSwitchFoundation2, _super);
- function MDCSwitchFoundation2(adapter) {
- var _this = _super.call(this, adapter) || this;
- _this.handleClick = _this.handleClick.bind(_this);
- return _this;
- }
- MDCSwitchFoundation2.prototype.init = function() {
- this.observe(this.adapter.state, {
- disabled: this.stopProcessingIfDisabled,
- processing: this.stopProcessingIfDisabled
- });
- };
- MDCSwitchFoundation2.prototype.handleClick = function() {
- if (this.adapter.state.disabled) {
- return;
- }
- this.adapter.state.selected = !this.adapter.state.selected;
- };
- MDCSwitchFoundation2.prototype.stopProcessingIfDisabled = function() {
- if (this.adapter.state.disabled) {
- this.adapter.state.processing = false;
- }
- };
- return MDCSwitchFoundation2;
- }(MDCObserverFoundation)
- );
- var MDCSwitchRenderFoundation = (
- /** @class */
- function(_super) {
- __extends(MDCSwitchRenderFoundation2, _super);
- function MDCSwitchRenderFoundation2() {
- return _super !== null && _super.apply(this, arguments) || this;
- }
- MDCSwitchRenderFoundation2.prototype.init = function() {
- _super.prototype.init.call(this);
- this.observe(this.adapter.state, {
- disabled: this.onDisabledChange,
- processing: this.onProcessingChange,
- selected: this.onSelectedChange
- });
- };
- MDCSwitchRenderFoundation2.prototype.initFromDOM = function() {
- this.setObserversEnabled(this.adapter.state, false);
- this.adapter.state.selected = this.adapter.hasClass(CssClasses.SELECTED);
- this.onSelectedChange();
- this.adapter.state.disabled = this.adapter.isDisabled();
- this.adapter.state.processing = this.adapter.hasClass(CssClasses.PROCESSING);
- this.setObserversEnabled(this.adapter.state, true);
- this.stopProcessingIfDisabled();
- };
- MDCSwitchRenderFoundation2.prototype.onDisabledChange = function() {
- this.adapter.setDisabled(this.adapter.state.disabled);
- };
- MDCSwitchRenderFoundation2.prototype.onProcessingChange = function() {
- this.toggleClass(this.adapter.state.processing, CssClasses.PROCESSING);
- };
- MDCSwitchRenderFoundation2.prototype.onSelectedChange = function() {
- this.adapter.setAriaChecked(String(this.adapter.state.selected));
- this.toggleClass(this.adapter.state.selected, CssClasses.SELECTED);
- this.toggleClass(!this.adapter.state.selected, CssClasses.UNSELECTED);
- };
- MDCSwitchRenderFoundation2.prototype.toggleClass = function(addClass, className) {
- if (addClass) {
- this.adapter.addClass(className);
- } else {
- this.adapter.removeClass(className);
- }
- };
- return MDCSwitchRenderFoundation2;
- }(MDCSwitchFoundation)
- );
-
- // node_modules/@material/switch/component.js
- var MDCSwitch = (
- /** @class */
- function(_super) {
- __extends(MDCSwitch2, _super);
- function MDCSwitch2(root, foundation) {
- var _this = _super.call(this, root, foundation) || this;
- _this.root = root;
- return _this;
- }
- MDCSwitch2.attachTo = function(root) {
- return new MDCSwitch2(root);
- };
- MDCSwitch2.prototype.initialize = function() {
- this.ripple = new MDCRipple(this.root, this.createRippleFoundation());
- };
- MDCSwitch2.prototype.initialSyncWithDOM = function() {
- var rippleElement = this.root.querySelector(Selectors.RIPPLE);
- if (!rippleElement) {
- throw new Error("Switch " + Selectors.RIPPLE + " element is required.");
- }
- this.rippleElement = rippleElement;
- this.root.addEventListener("click", this.foundation.handleClick);
- this.foundation.initFromDOM();
- };
- MDCSwitch2.prototype.destroy = function() {
- _super.prototype.destroy.call(this);
- this.ripple.destroy();
- this.root.removeEventListener("click", this.foundation.handleClick);
- };
- MDCSwitch2.prototype.getDefaultFoundation = function() {
- return new MDCSwitchRenderFoundation(this.createAdapter());
- };
- MDCSwitch2.prototype.createAdapter = function() {
- var _this = this;
- return {
- addClass: function(className) {
- _this.root.classList.add(className);
- },
- hasClass: function(className) {
- return _this.root.classList.contains(className);
- },
- isDisabled: function() {
- return _this.root.disabled;
- },
- removeClass: function(className) {
- _this.root.classList.remove(className);
- },
- setAriaChecked: function(ariaChecked) {
- return _this.root.setAttribute("aria-checked", ariaChecked);
- },
- setDisabled: function(disabled) {
- _this.root.disabled = disabled;
- },
- state: this
- };
- };
- MDCSwitch2.prototype.createRippleFoundation = function() {
- return new MDCRippleFoundation(this.createRippleAdapter());
- };
- MDCSwitch2.prototype.createRippleAdapter = function() {
- var _this = this;
- return __assign(__assign({}, MDCRipple.createAdapter(this)), { computeBoundingRect: function() {
- return _this.rippleElement.getBoundingClientRect();
- }, isUnbounded: function() {
- return true;
- } });
- };
- return MDCSwitch2;
- }(MDCComponent)
- );
-
// shared/js/ui/components/toggle.jsx
function ProtectionToggle(props) {
const [toggleState, toggle] = useToggleState(props.model, props.toggle);
@@ -16014,48 +15903,7 @@
const labelEnabled = ns.site("enableProtectionsSwitch.title");
const labelDisabled = ns.site("disableProtectionsSwitch.title");
const label = toggleState.active ? labelDisabled : labelEnabled;
- return isAndroid() ? /* @__PURE__ */ y(AndroidToggle, { toggleState, onToggle: props.onToggle, label }) : /* @__PURE__ */ y(DefaultToggleButton, { toggleState, label, onToggle: props.onToggle });
- }
- function AndroidToggle(props) {
- const ref = _(null);
- const className = `mdc-switch mdc-switch--${props.toggleState.active ? "selected" : "unselected"}`;
- y2(() => {
- if (!ref.current)
- return;
- const elem = (
- /** @type {HTMLButtonElement} */
- ref.current
- );
- if (!(elem instanceof HTMLButtonElement))
- return;
- const switchInstance = new MDCSwitch(ref.current);
- switchInstance.listen("click", () => {
- const pressed = elem.getAttribute("aria-checked");
- const next = pressed === "true" ? "false" : "true";
- elem.setAttribute("aria-checked", next);
- props.onToggle();
- switchInstance.destroy();
- });
- return () => {
- switchInstance.destroy();
- };
- }, []);
- return /* @__PURE__ */ y(
- "button",
- {
- ref,
- id: "basic-switch",
- class: className,
- type: "button",
- role: "switch",
- "aria-checked": "false",
- "aria-label": props.label,
- disabled: props.toggleState.disabled
- },
- /* @__PURE__ */ y("div", { class: "mdc-switch__track" }),
- /* @__PURE__ */ y("div", { class: "mdc-switch__handle-track" }, /* @__PURE__ */ y("div", { class: "mdc-switch__handle" }, /* @__PURE__ */ y("div", { class: "mdc-switch__shadow" }, /* @__PURE__ */ y("div", { class: "mdc-elevation-overlay" })), /* @__PURE__ */ y("div", { class: "mdc-switch__ripple" }))),
- /* @__PURE__ */ y("span", { class: "mdc-switch__focus-ring-wrapper" }, /* @__PURE__ */ y("div", { class: "mdc-switch__focus-ring" }))
- );
+ return /* @__PURE__ */ y(DefaultToggleButton, { toggleState, label, onToggle: props.onToggle });
}
function DefaultToggleButton(props) {
const { toggleState, label } = props;
@@ -16652,6 +16500,164 @@
return arr2;
}
+ // v2/components/custom-element-loader.jsx
+ function CustomElementLoader(props) {
+ const [state, dispatch] = s2(reducer, { status: "idle" });
+ p2(() => {
+ if (state.status === "idle") {
+ if (window.__ddg_did_load && window.__ddg_did_load.includes(props.element)) {
+ dispatch({ kind: "skip-loading" });
+ } else {
+ dispatch({ kind: "load-script", element: props.element });
+ }
+ return;
+ }
+ if (state.status === "script-ready") {
+ dispatch({ kind: "load-element" });
+ customElements.whenDefined(props.element).then(() => {
+ if (!window.__ddg_did_load)
+ window.__ddg_did_load = [];
+ window.__ddg_did_load.push(props.element);
+ dispatch({ kind: "element-loaded" });
+ });
+ }
+ }, [state.status, props.src, props.element]);
+ if (state.status === "element-ready") {
+ return props.children;
+ }
+ if (state.status === "script-pending") {
+ return /* @__PURE__ */ y("script", { src: props.src, onLoad: () => dispatch({ kind: "script-loaded" }) });
+ }
+ return (
+ /** @type {any} */
+ null
+ );
+ }
+ function reducer(state, event) {
+ console.log("incoming", event, "current", state);
+ switch (state.status) {
+ case "idle": {
+ switch (event.kind) {
+ case "load-script": {
+ return { ...state, status: (
+ /** @type {const} */
+ "script-pending"
+ ) };
+ }
+ case "skip-loading": {
+ return { ...state, status: (
+ /** @type {const} */
+ "element-ready"
+ ) };
+ }
+ }
+ break;
+ }
+ case "script-pending": {
+ switch (event.kind) {
+ case "script-loaded": {
+ return { ...state, status: (
+ /** @type {const} */
+ "script-ready"
+ ) };
+ }
+ }
+ break;
+ }
+ case "script-ready": {
+ switch (event.kind) {
+ case "load-element": {
+ return { ...state, status: (
+ /** @type {const} */
+ "element-pending"
+ ) };
+ }
+ }
+ break;
+ }
+ case "element-pending": {
+ switch (event.kind) {
+ case "element-loaded": {
+ return { ...state, status: (
+ /** @type {const} */
+ "element-ready"
+ ) };
+ }
+ }
+ }
+ }
+ return state;
+ }
+
+ // v2/components/android-breakage-modal-wrapper.jsx
+ var DDG_DIALOG_NAME = "ddg-android-breakage-dialog";
+ var DDG_DIALOG_PATH = "../public/js/android-breakage-dialog.js";
+ function FormSelectElementWithDialog() {
+ const platformFeatures = useFeatures();
+ const randomised = F(() => {
+ const f3 = createBreakageFeaturesFrom(platformFeatures);
+ return f3.categoryList();
+ }, [platformFeatures]);
+ const selectRef = _(null);
+ function onClick(e3) {
+ e3.preventDefault();
+ e3.stopImmediatePropagation();
+ const elem = document.querySelector(DDG_DIALOG_NAME);
+ if (!elem)
+ return console.warn("could not find custom element", "ddg-android-breakage-dialog");
+ if (!selectRef.current)
+ return console.warn("could not find select ref");
+ elem.show(selectRef.current.value);
+ }
+ return /* @__PURE__ */ y(k, null, /* @__PURE__ */ y(CustomElementLoader, { src: DDG_DIALOG_PATH, element: DDG_DIALOG_NAME }, /* @__PURE__ */ y(
+ AndroidBreakageDialogWrapper,
+ {
+ items: randomised,
+ onSelect: (value) => {
+ if (!selectRef.current)
+ return;
+ selectRef.current.value = value;
+ }
+ }
+ )), /* @__PURE__ */ y("div", { className: "form__select breakage-form__input--dropdown", onClick, "data-testid": "select-click-capture" }, /* @__PURE__ */ y("select", { name: "category", ref: selectRef }, /* @__PURE__ */ y("option", { value: "", selected: true, disabled: true }, ns.report("pickYourIssueFromTheList.title")), randomised.map(([key, value]) => {
+ return /* @__PURE__ */ y("option", { value: key }, value);
+ }))));
+ }
+ function AndroidBreakageDialogWrapper({ items, onSelect }) {
+ const ref = _(null);
+ p2(() => {
+ const controller = new AbortController();
+ ref.current?.addEventListener(
+ "did-select",
+ (e3) => {
+ const selection = (
+ /** @type {{value: string}} */
+ e3.detail
+ );
+ const matched = items.find(([name]) => name === selection.value);
+ if (!matched)
+ throw new Error("value did not match a variant");
+ const [value] = matched;
+ onSelect(value);
+ },
+ { signal: controller.signal }
+ );
+ return () => {
+ return controller.abort();
+ };
+ }, []);
+ return /* @__PURE__ */ y(
+ "ddg-android-breakage-dialog",
+ {
+ items,
+ ref,
+ title: ns.report("pickYourIssueFromTheList.title"),
+ cancelText: ns.site("navigationCancel.title"),
+ okText: ns.site("okDialogAction.title")
+ }
+ );
+ }
+
// v2/screens/breakage-form-screen.jsx
function BreakageFormScreen({ includeToggle }) {
const data = useData();
@@ -16678,17 +16684,17 @@
});
setState("sent");
}
- let topNav2 = /* @__PURE__ */ y(SecondaryTopNav, null);
+ let topNav2 = platformSwitch({
+ android: () => /* @__PURE__ */ y(SecondaryTopNav, null, /* @__PURE__ */ y(Title, null, ns.site("websiteNotWorkingCta.title"))),
+ default: () => /* @__PURE__ */ y(SecondaryTopNav, null)
+ });
if (!canPop) {
topNav2 = platformSwitch({
ios: () => /* @__PURE__ */ y(TopNav, { done: /* @__PURE__ */ y(Done, { onClick: onClose }) }),
+ android: () => /* @__PURE__ */ y(TopNav, { back: /* @__PURE__ */ y(Back, { onClick: onClose }) }, /* @__PURE__ */ y(Title, null, ns.site("websiteNotWorkingCta.title"))),
default: () => /* @__PURE__ */ y(TopNav, { done: /* @__PURE__ */ y(Close, { onClick: onClose }) })
});
}
- const randomised = F(() => {
- const f3 = createBreakageFeaturesFrom(platformFeatures);
- return f3.categoryList();
- }, [platformFeatures]);
return /* @__PURE__ */ y("div", { className: "breakage-form page-inner" }, topNav2, /* @__PURE__ */ y("div", { className: "breakage-form__inner", "data-state": state }, includeToggle && /* @__PURE__ */ y("div", { class: "header header--breakage" }, /* @__PURE__ */ y(
ProtectionHeader,
{
@@ -16701,12 +16707,20 @@
FormElement,
{
onSubmit: submit,
- before: /* @__PURE__ */ y("div", { className: "form__select breakage-form__input--dropdown" }, /* @__PURE__ */ y("select", { name: "category" }, /* @__PURE__ */ y("option", { value: "" }, ns.report("pickYourIssueFromTheList.title")), "$", randomised.map(([key, value]) => {
- return /* @__PURE__ */ y("option", { value: key }, value);
- })))
+ before: platformFeatures.breakageFormCategorySelect === "material-web-dialog" ? /* @__PURE__ */ y(FormSelectElementWithDialog, null) : /* @__PURE__ */ y(DefaultSelectElement, null)
}
)), /* @__PURE__ */ y("div", { className: "breakage-form__footer padding-x-double token-breakage-form-body" }, ns.report("reportsAreAnonymousDesc.title"))));
}
+ function DefaultSelectElement() {
+ const platformFeatures = useFeatures();
+ const randomised = F(() => {
+ const f3 = createBreakageFeaturesFrom(platformFeatures);
+ return f3.categoryList();
+ }, [platformFeatures]);
+ return /* @__PURE__ */ y("div", { className: "form__select breakage-form__input--dropdown" }, /* @__PURE__ */ y("select", { name: "category" }, /* @__PURE__ */ y("option", { value: "", selected: true, disabled: true }, ns.report("pickYourIssueFromTheList.title")), randomised.map(([key, value]) => {
+ return /* @__PURE__ */ y("option", { value: key }, value);
+ })));
+ }
function FormElement({ onSubmit, before, after, placeholder }) {
let bullet = "\n \u2022 ";
placeholder = placeholder || ns.report("tellUsMoreDesc.title", { bullet });
@@ -16879,6 +16893,7 @@
}
// shared/js/ui/components/toggle-report/toggle-report-provider.jsx
+ init_schema_parsers();
var ToggleReportContext = G({
value: (
/** @type {import('../../../../../schema/__generated__/schema.types').ToggleReportScreen} */
@@ -16907,7 +16922,17 @@
p2(() => {
const msg = new FetchToggleReportOptions();
model.fetch(msg)?.then((data) => {
- dispatch({ status: "ready", value: data });
+ const parsed = toggleReportScreenSchema.safeParse(data);
+ if (parsed.success) {
+ dispatch({ status: "ready", value: data });
+ } else {
+ console.group("ToggleReportProvider");
+ console.error("the response for FetchToggleReportOptions did not match the schema");
+ console.error("response:", data);
+ console.error("error:", parsed.error.toString());
+ console.groupEnd();
+ dispatch({ status: "error", error: parsed.error.toString() });
+ }
}).catch((e3) => {
dispatch({ status: "error", error: e3.toString() });
});
@@ -17167,17 +17192,56 @@
// shared/js/ui/components/toggle-report.jsx
function ToggleReport() {
- const buttonVariant = platform.name === "ios" ? "ios-secondary" : "macos-standard";
- const buttonLayout = platform.name === "ios" ? "vertical" : "horizontal";
- const buttonSize = platform.name === "ios" ? "big" : "small";
const innerGap = platform.name === "ios" ? "24px" : "16px";
+ const desktop = platform.name === "macos" || platform.name === "windows";
+ const extension = platform.name === "browser";
const { value, didClickSuccessScreen } = q2(ToggleReportContext);
const [state, dispatch] = useToggleReportState();
useIosAnimation(state, dispatch);
- if (state.value === "sent" && platform.name === "macos") {
- return /* @__PURE__ */ y(ToggleReportWrapper, { state: state.value }, /* @__PURE__ */ y(ToggleReportSent, { onClick: didClickSuccessScreen }));
+ if (state.value === "sent" && (desktop || extension)) {
+ return /* @__PURE__ */ y(ToggleReportWrapper, { state: state.value }, extension && /* @__PURE__ */ y(SetAutoHeight, null), /* @__PURE__ */ y(ToggleReportSent, { onClick: didClickSuccessScreen }));
+ }
+ if (desktop || extension) {
+ return /* @__PURE__ */ y(ToggleReportWrapper, { state: state.value }, extension && /* @__PURE__ */ y(SetAutoHeight, null), /* @__PURE__ */ y(Stack, { gap: "40px" }, /* @__PURE__ */ y(Stack, { gap: "24px" }, /* @__PURE__ */ y(Stack, { gap: innerGap }, /* @__PURE__ */ y("div", { className: "medium-icon-container hero-icon--toggle-report" }), /* @__PURE__ */ y(ToggleReportTitle, null, ns.toggleReport("siteNotWorkingTitle.title")), /* @__PURE__ */ y("div", null, /* @__PURE__ */ y("h2", { className: "token-title-3 text--center" }, ns.toggleReport("siteNotWorkingSubTitle.title")), /* @__PURE__ */ y(DesktopRevealText, { state, toggle: () => dispatch("toggle") }))), state.value === "showing" && /* @__PURE__ */ y(Scrollable, null, /* @__PURE__ */ y(ToggleReportDataList, { rows: value.data })), /* @__PURE__ */ y(ToggleReportButtons, { send: () => dispatch("send"), reject: () => dispatch("reject") }))));
+ }
+ if (platform.name === "ios") {
+ return /* @__PURE__ */ y(ToggleReportWrapper, { state: state.value }, /* @__PURE__ */ y(Stack, { gap: "40px" }, /* @__PURE__ */ y(Stack, { gap: "24px" }, /* @__PURE__ */ y(Stack, { gap: innerGap }, /* @__PURE__ */ y("div", { className: "medium-icon-container hero-icon--toggle-report" }), /* @__PURE__ */ y(ToggleReportTitle, null, ns.toggleReport("siteNotWorkingTitle.title")), /* @__PURE__ */ y("div", null, /* @__PURE__ */ y("h2", { className: "token-title-3 text--center" }, ns.toggleReport("siteNotWorkingSubTitle.title")))), /* @__PURE__ */ y(ToggleReportButtons, { send: () => dispatch("send"), reject: () => dispatch("reject") }), state.value !== "showing" && /* @__PURE__ */ y(RevealText, { toggle: () => dispatch("toggle-ios") })), state.value === "showing" && /* @__PURE__ */ y("div", { className: "ios-separator" }, /* @__PURE__ */ y(ToggleReportDataList, { rows: value.data }))));
}
- return /* @__PURE__ */ y(ToggleReportWrapper, { state: state.value }, /* @__PURE__ */ y(Stack, { gap: "40px" }, /* @__PURE__ */ y(Stack, { gap: "24px" }, /* @__PURE__ */ y(Stack, { gap: innerGap }, /* @__PURE__ */ y("div", { className: "medium-icon-container hero-icon--toggle-report" }), /* @__PURE__ */ y(ToggleReportTitle, null, ns.toggleReport("siteNotWorkingTitle.title")), /* @__PURE__ */ y("div", null, /* @__PURE__ */ y("h2", { className: "token-title-3 text--center" }, ns.toggleReport("siteNotWorkingSubTitle.title")), platform.name === "macos" && /* @__PURE__ */ y("div", null, /* @__PURE__ */ y("p", { className: "text--center token-title-3" }, /* @__PURE__ */ y(PlainTextLink, { onClick: () => dispatch("toggle") }, state.value === "hiding" && ns.toggleReport("siteNotWorkingInfoReveal.title"), state.value === "showing" && ns.toggleReport("siteNotWorkingInfoHide.title")))))), platform.name === "macos" && state.value === "showing" && /* @__PURE__ */ y(Scrollable, null, /* @__PURE__ */ y(ToggleReportDataList, { rows: value.data })), /* @__PURE__ */ y(ButtonBar, { layout: buttonLayout }, /* @__PURE__ */ y(Button, { variant: buttonVariant, btnSize: buttonSize, onClick: () => dispatch("reject") }, ns.toggleReport("dontSendReport.title")), /* @__PURE__ */ y(Button, { variant: buttonVariant, btnSize: buttonSize, onClick: () => dispatch("send") }, ns.report("sendReport.title"))), platform.name === "ios" && state.value !== "showing" && /* @__PURE__ */ y("p", { className: "text--center token-title-3" }, /* @__PURE__ */ y(PlainTextLink, { onClick: () => dispatch("toggle-ios"), className: "token-bold" }, ns.toggleReport("siteNotWorkingInfoReveal.title")))), platform.name === "ios" && state.value === "showing" && /* @__PURE__ */ y("div", { className: "ios-separator" }, /* @__PURE__ */ y(ToggleReportDataList, { rows: value.data }))));
+ return /* @__PURE__ */ y("p", null, "unsupported platform: ", platform.name);
+ }
+ function SetAutoHeight() {
+ p2(() => {
+ const inner = (
+ /** @type {HTMLElement} */
+ document.querySelector('[data-screen="toggleReport"] .page-inner')
+ );
+ if (inner) {
+ inner.style.height = "auto";
+ const height = getContentHeight();
+ document.body.style.setProperty("--height", `${height}px`);
+ const unsub = setupMutationObserverForExtensions((height2) => {
+ document.body.style.setProperty("--height", `${height2}px`);
+ });
+ return () => {
+ unsub();
+ };
+ } else {
+ console.warn("Could not select the required element");
+ }
+ }, []);
+ return null;
+ }
+ function ToggleReportButtons({ send, reject }) {
+ const buttonVariant = platform.name === "ios" ? "ios-secondary" : "macos-standard";
+ const buttonLayout = platform.name === "ios" ? "vertical" : "horizontal";
+ const buttonSize = platform.name === "ios" ? "big" : "small";
+ return /* @__PURE__ */ y(ButtonBar, { layout: buttonLayout }, /* @__PURE__ */ y(Button, { variant: buttonVariant, btnSize: buttonSize, onClick: reject }, ns.toggleReport("dontSendReport.title")), /* @__PURE__ */ y(Button, { variant: buttonVariant, btnSize: buttonSize, onClick: send }, ns.report("sendReport.title")));
+ }
+ function RevealText({ toggle }) {
+ return /* @__PURE__ */ y("p", { className: "text--center token-title-3" }, /* @__PURE__ */ y(PlainTextLink, { onClick: toggle, className: "token-bold" }, ns.toggleReport("siteNotWorkingInfoReveal.title")));
+ }
+ function DesktopRevealText({ state, toggle }) {
+ return /* @__PURE__ */ y("div", null, /* @__PURE__ */ y("p", { className: "text--center token-title-3" }, /* @__PURE__ */ y(PlainTextLink, { onClick: toggle }, state.value === "hiding" && ns.toggleReport("siteNotWorkingInfoReveal.title"), state.value === "showing" && ns.toggleReport("siteNotWorkingInfoHide.title"))));
}
// v2/screens/toggle-report-screen.jsx
@@ -17185,6 +17249,8 @@
const fetcher = useFetcher();
const features = useFeatures();
const onClose = useClose();
+ const connectionCount = useConnectionCount();
+ const connectionId = `connection-${connectionCount}`;
p2(() => {
document.body.dataset.screen = "toggleReport";
return () => {
@@ -17193,9 +17259,14 @@
}, []);
const done = platformSwitch({
ios: () => /* @__PURE__ */ y(Done, { onClick: onClose }),
- default: () => /* @__PURE__ */ y(Close, { onClick: onClose })
+ macos: () => /* @__PURE__ */ y(Close, { onClick: onClose }),
+ default: () => null
+ });
+ const back = platformSwitch({
+ android: () => /* @__PURE__ */ y(Back, { onClick: onClose }),
+ default: () => null
});
- return /* @__PURE__ */ y("div", { "data-toggle-report": "parent", class: "toggle-report page-inner", "data-opener": features.opener }, features.opener === "menu" ? /* @__PURE__ */ y(TopNav, { done }) : /* @__PURE__ */ y(TopNav, null), /* @__PURE__ */ y("div", { "data-testid": "toggle-report" }, /* @__PURE__ */ y(ToggleReportProvider, { model: { fetch: fetcher }, screen: features.initialScreen }, /* @__PURE__ */ y(ToggleReport, null))));
+ return /* @__PURE__ */ y("div", { "data-toggle-report": "parent", class: "toggle-report page-inner", "data-opener": features.opener }, features.opener === "menu" ? /* @__PURE__ */ y(TopNav, { back, done }) : /* @__PURE__ */ y(TopNav, null), /* @__PURE__ */ y("div", { "data-testid": "toggle-report" }, /* @__PURE__ */ y(ToggleReportProvider, { key: connectionId, model: { fetch: fetcher }, screen: features.initialScreen }, /* @__PURE__ */ y(ToggleReport, null))));
}
// v2/components/nav.jsx
@@ -17352,6 +17423,7 @@
}
// v2/navigation.jsx
+ init_schema_parsers();
var availableScreens = {
primaryScreen: { kind: "root", component: () => /* @__PURE__ */ y(PrimaryScreen, null) },
// screens that would load immediately
@@ -17369,6 +17441,10 @@
consentManaged: { kind: "subview", component: () => /* @__PURE__ */ y(ConsentManagedScreen, { cosmetic: false }) },
cookieHidden: { kind: "subview", component: () => /* @__PURE__ */ y(ConsentManagedScreen, { cosmetic: true }) }
};
+ var entries = (
+ /** @type {[ScreenName, { kind: 'subview' | 'root', component: () => any}][]} */
+ Object.entries(availableScreens)
+ );
var NavContext = G({
/** @type {(name: ScreenName, params?: Record