<style include="settings-shared">
.list-item:not(:last-of-type) {
border-bottom: var(--cr-separator-line);
}
.list-frame {
padding-bottom: 8px;
padding-top: 8px;
}
.separator {
margin: 0;
}
</style>
<template is="dom-if" if="[[showPrivacyHubLocationControl_]]" restamp>
<cr-link-row
id="geolocationAreaLinkRow"
start-icon="app-management:location"
on-click="onGeolocationAreaClick_"
label="$i18n{geolocationAreaTitle}"
sub-label="[[locationSubLabel_]]"
role-description="$i18n{subpageArrowRoleDescription}"
deep-link-focus-id$="[[Setting.kGeolocationOnOff]]"
using-slotted-label>
</div>
</cr-link-row>
</template>
<div id="cameraSection">
<template is="dom-if" if="[[!showAppPermissions_]]">
<div class="hr"></div>
<settings-toggle-button
id="cameraToggle"
pref="{{prefs.ash.user.camera_allowed}}"
label="$i18n{cameraToggleTitle}"
sub-label="[[cameraSubLabel_]]"
deep-link-focus-id$="[[Setting.kCameraOnOff]]"
disabled="[[shouldDisableCameraToggle_]]"
on-change="onCameraToggleChanged_">
</settings-toggle-button>
<div class="list-frame">
<template is="dom-if" if="[[isCameraListEmpty_]]" restamp>
<div id="noCamera" class="list-item">
$i18n{noCameraConnectedText}
</div>
</template>
<template is="dom-if" if="[[!isCameraListEmpty_]]" restamp>
<template id="cameraList" is="dom-repeat"
items="[[connectedCameraNames_]]">
<div class="list-item">
[[item]]
</div>
</template>
</template>
</div>
</template>
<template is="dom-if" if="[[showAppPermissions_]]">
<div id="cameraRow" class="settings-box no-padding">
<cr-link-row id="cameraSubpageLink"
start-icon="app-management:camera"
label="$i18n{cameraToggleTitle}"
sub-label="[[cameraRowSubtext_]]"
on-click="onCameraSubpageLinkClick_"
role-description="$i18n{subpageArrowRoleDescription}">
</cr-link-row>
<div class="separator"></div>
<div id="cameraToggleWrapper">
<cr-toggle
id="cameraToggle"
class="margin-matches-padding"
checked="{{prefs.ash.user.camera_allowed.value}}"
disabled="[[shouldDisableCameraToggle_]]"
aria-label="$i18n{cameraToggleTitle}"
aria-description="[[cameraRowSubtext_]]">
</cr-toggle>
</div>
<paper-tooltip
id="cameraToggleTooltip"
hidden="[[!isCameraListEmpty_]]"
aria-hidden="true"
for="cameraToggleWrapper"
fit-to-visible-bounds>
$i18n{privacyHubNoCameraConnectedTooltipText}
</paper-tooltip>
</div>
</template>
</div>
<div id="microphoneSection">
<template is="dom-if" if="[[!showAppPermissions_]]">
<div class="hr"></div>
<settings-toggle-button
id="microphoneToggle"
pref="{{prefs.ash.user.microphone_allowed}}"
label="$i18n{microphoneToggleTitle}"
deep-link-focus-id$="[[Setting.kMicrophoneOnOff]]"
sub-label="$i18n{microphoneToggleSubtext}"
disabled="[[shouldDisableMicrophoneToggle_]]"
on-change="onMicrophoneToggleChanged_">
<cr-tooltip-icon
hidden$="[[!microphoneHardwareToggleActive_]]"
tooltip-text="$i18n{microphoneHwToggleTooltip}"
icon-class="cr:info-outline"
slot="more-actions">
</cr-tooltip-icon>
</settings-toggle-button>
<div class="list-frame">
<template is="dom-if" if="[[isMicListEmpty_]]" restamp>
<div id="noMic" class="list-item">
$i18n{noMicrophoneConnectedText}
</div>
</template>
<template is="dom-if" if="[[!isMicListEmpty_]]" restamp>
<template
id="micList"
is="dom-repeat"
items="[[connectedMicrophoneNames_]]">
<div class="list-item">
[[item]]
</div>
</template>
</template>
</div>
</template>
<template is="dom-if" if="[[showAppPermissions_]]">
<div id="microphoneRow" class="settings-box no-padding">
<cr-link-row id="microphoneSubpageLink"
start-icon="app-management:microphone"
label="$i18n{microphoneToggleTitle}"
sub-label="[[microphoneRowSubtext_]]"
on-click="onMicrophoneSubpageLinkClick_"
role-description="$i18n{subpageArrowRoleDescription}">
</cr-link-row>
<div class="separator"></div>
<div id="microphoneToggleWrapper">
<cr-toggle
id="microphoneToggle"
class="margin-matches-padding"
checked="{{prefs.ash.user.microphone_allowed.value}}"
disabled="[[shouldDisableMicrophoneToggle_]]"
aria-label="$i18n{microphoneToggleTitle}"
aria-description="[[microphoneRowSubtext_]]">
</cr-toggle>
</div>
<paper-tooltip
id="microphoneToggleTooltip"
hidden="[[!shouldDisableMicrophoneToggle_]]"
aria-hidden="true"
for="microphoneToggleWrapper"
fit-to-visible-bounds>
[[microphoneToggleTooltipText_]]
</paper-tooltip>
</div>
</template>
</div>
<template is="dom-if" if="[[showSpeakOnMuteDetectionPage_]]" restamp>
<div class="hr"></div>
<settings-toggle-button
pref="{{prefs.ash.user.speak_on_mute_detection_enabled}}"
id="speakonmuteDetectionToggle"
label="$i18n{speakOnMuteDetectionToggleTitle}"
sub-label="$i18n{speakOnMuteDetectionToggleSubtext}"
deep-link-focus-id$="[[Setting.kSpeakOnMuteDetectionOnOff]]"
learn-more-url="$i18n{speakOnMuteDetectionLearnMoreURL}">
</settings-toggle-button>
</template>
<if expr="_google_chrome">
<div class="hr"></div>
<settings-metrics-consent-toggle-button
id="metricsConsentToggle"
deep-link-focus-id$="[[Setting.kUsageStatsAndCrashReports]]"
prefs="{{prefs}}">
</settings-metrics-consent-toggle-button>
</if>
<div class="hr"></div>
<settings-toggle-button id="contentRecommendationsToggle"
pref="{{prefs.settings.suggested_content_enabled}}"
label="$i18n{enableSuggestedContent}"
sub-label="$i18n{enableSuggestedContentDesc}"
learn-more-url="$i18n{suggestedContentLearnMoreURL}">
</settings-toggle-button>