HTML-popover-ja.html

<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8">
<title>HTML Standard — User interaction（日本語訳）</title>

<link rel="stylesheet" href="common.css" type="text/css">
<link rel="stylesheet" href="common-whatwg.css" type="text/css">

<script src="common0.js"></script>
<script src="common1.js" async></script>

<script>

Util.ready = function(){
	const source_data = {
		toc_main: 'editing',
		generate: expand
	};
	Util.switchWordsInit(source_data);
}

function expand(){
	const class_map = this.class_map;
	const tag_map = this.tag_map;
	const link_map = this.link_map;

	return this.html.replace(
		/%[\w\-~一-鿆あ-ー々]+|`(.+?)([$@\^])(\w*)/g,
		create_html
	);

	function create_html(match, key, indicator, klass){

if(!key) {//%
	return `<var>${match.slice(1)}</var>`;
}

let href = '';
let href1 = '';
{
	const n = key.indexOf('＠');
	if(n > 0) {
		href1 = key.slice(n + 1);
		key = key.slice(0, n);
	}
}
let text = key;

switch(klass){
case 'r':
	text = `[${key}]`;
	href = `HTML-references.html#refs${key}`;
	break;
case 'l':
	text = `"<code class="literal">${text}</code>"`;
	break;
case 'm':
	const n = text.indexOf('(');
	if(n > 0){
		key = text.slice(0, n);
		text = key + text.slice(n).replace(/\w+/g, '<var>$&</var>');
	}
	break;
case 'xCode':
	return `<a id="_ex-html-${key}">＊</a>`;
	break;
case 'ps': 
	text = `:${key}`;
	break;
case 'en':
	return `<span lang="en">${key}</span>`;
	break;
}

let tag = tag_map[klass];
if(tag) {
	let classname = class_map[klass];
	classname = classname ? ` class="${classname}"` : '';
	text = `<${tag}${classname}>${text}</${tag}>`;
}

if(indicator !== '^'){
	href = href1 || link_map[ klass ? `${klass}.${key}` : key ] || href;
	if(!href){
		console.log(match); // check error
		return match;
	}

	switch(indicator){
	case '$':
		text = `<a href="${href}">${text}</a>`;
		break;
	case '@':
		text = `<dfn id="${href.slice(1)}">${text}</dfn>`;
		break;
	}
}

return text;


	}
}

</script>


<script type="text/plain" id="_source_data">


●●options

spec_date:2025-03-14
trans_update:2025-03-15
source_checked:250113
page_state_key:HTML
spec_status:LS
original_url:https://html.spec.whatwg.org/multipage/popover.html
	abbr_url:HTMLpopover
site_nav:uievents,html
nav_prev:HTMLdnd
nav_next:ORIGIN
trans_1st_pub:2023-01-30

●●class_map
e:element
a:attr
et:event-type
p:property
st:attr-state
v:value
E:error

●●tag_map
I:code
m:code
mb:code
E:code
c:code
e:code
a:code
et:code
st:i
p:code
v:code
i:i
em:em
cite:cite

●●original_id_map
_popover-target-attribute:the-popover-target-attributes

●●mdn_urls

●●link_map


	●idl

CEReactions:~HEcustom#cereactions

E.InvalidStateError:~WEBIDL#invalidstateerror
E.NotSupportedError:~WEBIDL#notsupportederror

I.PopoverInvokerElement:#popoverinvokerelement
I.ToggleEvent:~HTMLinteraction#toggleevent
I.PointerEvent:~POINTEREVENTS#pointerevent-interface
	I.Element:~DOM4#interface-element → 要素
	I.Document:~HTMLdom#document → 文書
	I.Node:~DOM4#interface-node → ~node$

m.popover:#dom-popover
m.showPopover:#dom-showpopover
m.hidePopover:#dom-hidepopover
m.togglePopover:#dom-togglepopover
m.popoverTargetElement:#dom-popovertargetelement
m.popoverTargetAction:#dom-popovertargetaction
m.newState:~HTMLinteraction#dom-toggleevent-newstate
m.oldState:~HTMLinteraction#dom-toggleevent-oldstate

m.cancelable:~DOM4#dom-event-cancelable
m.isTrusted:~DOM4#dom-event-istrusted
m.type:~DOM4#dom-event-type

mb.source:~HTMLdom#dom-showpopoveroptions-source
mb.force:~HTMLdom#dom-togglepopoveroptions-force

	●code

e.button:~HEforms#the-button-element
e.dialog:~HEinteractive#the-dialog-element
e.div:~HEgrouping#the-div-element
e.map:~HEimages#the-map-element
e.output:~HEforms#the-output-element

a.popover:#attr-popover
a.popovertarget:#attr-popovertarget
a.popovertargetaction:#attr-popovertargetaction
a.autofocus:~HTMLinteraction#attr-fe-autofocus

v.auto:#attr-popover-auto
v.manual:#attr-popover-manual
v.hint:#attr-popover-hint
v.show:#attr-popovertargetaction-show
v.hide:#attr-popovertargetaction-hide
v.toggle:#attr-popovertargetaction-toggle

et.pointerdown:~POINTEREVENTS#the-pointerdown-event
et.pointerup:~POINTEREVENTS#the-pointerup-event
et.beforetoggle:~HTMLindex#event-beforetoggle
et.toggle:~HTMLindex#event-toggle

p.display:~CSSDISP#propdef-display

	●用語
~popover要素:#_popover-element

st.自動:#attr-popover-auto-state
st.手動:#attr-popover-manual-state
st.~hint:#attr-popover-hint-state
st.~popoverなし:#attr-popover-none-state
st.示す:#attr-popovertargetaction-show-state
st.隠す:#attr-popovertargetaction-hide-state
st.~toggleする:#attr-popovertargetaction-toggle-state

~popover可視性~状態:#popover-visibility-state
i.隠している:#popover-hidden-state
i.示している:#popover-showing-state
文書が示している~popover~listを取得する:#_document-popover-list
doc.示している自動~popover~list:#auto-popover-list
doc.示している~hint~popover~list:#showing-hint-popover-list
doc.~popover~pointerdown~target:#popover-pointerdown-target
el.~popover呼出元:#popover-invoker
el.~popover用の~toggle~task追跡子:#popover-toggle-task-tracker
el.~popoverを示すまたは隠す途中か:#popover-showing-or-hiding
el.~popover閉-注視器:#popover-close-watcher
el.~popover~mode:#opened-in-popover-mode
~popover~target属性:#_popover-target-attribute
~popover用の~toggle~event~taskを~queueする:#queue-a-popover-toggle-event-task
~popoverを示す:#show-popover
~popoverを隠す:#hide-popover-algorithm
ある所までの~popoverをすべて隠す:#hide-all-popovers-until
ある所までの~popover~stackを隠す:#hide-popover-stack-until
~popover~list全体を閉じる:#close-entire-popover-list
~popover~stack位置を取得する:#get-the-popover-stack-position
~popoverを~focusする:#popover-focusing-steps
~popoverの妥当性を検査する:#check-popover-validity
~popover~target属性~作動化の挙動:#popover-target-attribute-activation-behavior
~popover~target要素:#popover-target-element
開な~popoverたちを軽く退ける:#light-dismiss-open-popovers
軽く退ける:#popover-light-dismiss
最上層な~popover先祖を見出す:#topmost-popover-ancestor
最上層な自動または~hint~popoverを見出す:#topmost-auto-popover
最上層な~clickされた~popoverを見出す:#topmost-clicked-popover
広義-先祖のうち最も近い開な~popoverを見出す:#nearest-inclusive-open-popover
呼出元~用の最も近い広義-~target~popoverを見出す:#nearest-inclusive-target-popover-for-invoker

	●用語（HTML
	~DOM~interface:~HTMLdom#concept-element-dom
文書:~HTMLdom#the-document-object

~HTML要素:~HTMLINFRA#html-elements
切断-:~HTMLINFRA#becomes-disconnected

列挙d属性:~HTMLcms#enumerated-attribute
妥当でない値~用の既定の状態:~HTMLcms#invalid-value-default
欠落~値~用の既定の状態:~HTMLcms#missing-value-default

既知な値のみに制限され:~HTMLcdom#limited-to-only-known-values
反映する:~HTMLcdom#reflect
結付けられた要素を取得する~algo:~HTMLcdom#attr-associated-element

~button:~HEforms#concept-button
提出-~button:~HEforms#concept-submit-button

fe.不能化されて:~HTMLforms#concept-fe-disabled
~form所有者:~HTMLforms#form-owner

前回に~focusされた要素:~HEinteractive#previously-focused-element
~dialogを~focusする:~HEinteractive#dialog-focusing-steps
~modalか:~HEinteractive#is-modal

~toggle~task追跡子:~HTMLinteraction#toggle-task-tracker
tTk.旧-状態:~HTMLinteraction#toggle-task-old-state
tTk.~task:~HTMLinteraction#toggle-task-task
~DOM~anchor:~HTMLinteraction#dom-anchor
自動focus候補~群:~HTMLinteraction#autofocus-candidates
自動focusは処理-済みか:~HTMLinteraction#autofocus-processed-flag
自動focus委任-先:~HTMLinteraction#autofocus-delegate
~focusを許容する手続き:~HTMLinteraction#allow-focus-steps
~objを~focusする:~HTMLinteraction#focusing-steps
doc.指名する被focus区画:~HTMLinteraction#focused-area-of-the-document
閉-注視器:~HTMLinteraction#close-watcher
閉-注視器を確立する:~HTMLinteraction#establish-a-close-watcher
閉-注視器を破壊する:~HTMLinteraction#close-watcher-destroy
閉-要請:~HTMLinteraction#close-request

同一-生成元:~ORIGIN#same-origin

bc.作動中な文書:~HTMLds#active-document
全部的に作動中:~HTMLds#fully-active
属する閲覧~文脈:~HTMLds#concept-document-bc
~top-level閲覧~文脈:~HTMLds#top-level-browsing-context

関連な大域~obj:~WAPI#concept-relevant-global
要素~taskを~queueする:~WAPI#queue-an-element-task
~task:~WAPI#concept-task
~task~queue:~WAPI#task-queue
~DOM操作~task~source:~WAPI#dom-manipulation-task-source
利用者~対話~task~source:~WAPI#user-interaction-task-source
~event~handler:~WAPI#event-handlers

	●用語（外部
~list:~INFRA#list
~size:~INFRA#list-size
付加する:~INFRA#list-append
空にする:~INFRA#list-empty
空:~INFRA#list-is-empty
構造体:~INFRA#struct
有順序~map:~INFRA#ordered-map

~tree:~DOM4#concept-tree
~node:~DOM4#concept-node
要素:~DOM4#concept-element
~shadowも含めた子孫:~DOM4#concept-shadow-including-descendant
~shadowも含めた広義-子孫:~DOM4#concept-shadow-including-inclusive-descendant
属性~変更-時の手続き:~DOM4#concept-element-attributes-change-ext
接続されて:~DOM4#connected
~eventを発火する:~DOM4#concept-event-fire
~ID:~DOM4#concept-id
~node文書:~DOM4#concept-node-document
doc.生成元:~DOM4#concept-document-origin
~target:~DOM4#event-target
	誤）~target:~DOM4#concept-event-target

平坦~tree:~CSSSCOPING#flat-tree
表示域:~CSS2J#viewport

暗黙的な~anchor要素:~CSSANCHOR#implicit-anchor-element

上端~層:~CSSPOS4#document-top-layer
上端~層に要素を追加する:~CSSPOS4#add-an-element-to-the-top-layer
上端~層から要素を除去するよう要請する:~CSSPOS4#request-an-element-to-be-removed-from-the-top-layer
上端~層から要素を即時に除去する:~CSSPOS4#remove-an-element-from-the-top-layer-immediately

~fullscreenか:~FULLSCREEN#fullscreen-flag

	コレ:~WEBIDL#this

●●words_table1

●●words_table

	●UI／呈示／accessibility
popover:
自動focus:autofocus::自動 focus:自動フォーカス
開な:openな:開いた
開いた:openした:開いた
	開な:opened
	開いたまま残され:stay open
	最初に開いた方:the first one to open
開かれ:openされ:~
開け:openでき:~
閉な:closedな:閉じた
閉じる:closeする:~
閉じな:closeしな:~
閉じれ:closeでき:~
示す:showする:~
示して:showして:~
	示している:showing
示され:showされ:~
	示していない:non-showing

隠す:hideする:~
隠し:hideし:~
	隠している:hidden
退ける:dismissする:~
	軽く退けるふるまい:light dismiss
	軽く退ける:light dismiss
	軽く退ける:light-dismiss
被focus:focused::被 focus:被フォーカス
pointerdown:
fullscreen::::全スクリーン
押下げる:pressする:~
矢印:arrow:~
露呈-:reveal:露わに
発声-:announce:~
ARIA:
支援技術:assistive technology:~
reader::::リーダ
確認-:confirm:~
閉-:close:閉じ
注視器:watcher::~

	軽い:light
	最も後に来る:latest
	先に来る:earlier
	煩わしい:annoying
	~menu~item:menuitem

	●構造／関係
呼出元:invoker:呼び出し元
広義-:inclusive:~
終端点:endpoint:~
循環な:cyclicな:循環する
最上層:topmost:~
	上層:top of
指名-:designate::~
	~popover~target属性$:anchor attribute
	~popover~target属性$:anchor
先祖-:ancestral::~
経路:path:~
	指して:pointing
	自身を指している:points back

	●処理
旧-:old:~
新-:new:~
候補:candidate:~
切断-:disconnect::~
復旧-:restore:~
追跡子:tracker::~::トラッカー

	起:happen
	調べて:look

	●変数
	%名前空間:namespace
	%局所~名:localName
	%旧-値:oldValue
	%値:value
	%要素:element
	%要素:this element
	%例外を投出するか:throwExceptions
	%文書:document
	%元の種別:originalType
	%先祖:ancestor
	%元々~focusされた要素:originallyFocusedElement
	%旧-状態:oldState
	%新-状態:newState
	%前回に~focusした要素を~focusするか:focusPreviousElement
	%~eventを発火するか:fireEvents
	%前回に~focusされた要素:previouslyFocusedElement
	%~popover:popover
	%~popoverであるか:isPopover
	%隠し残した~popover:lastToHide
	%新たな~popover:newPopover
	%~popover位置~群:popoverPositions
	%~index:~index
	%最上層な~popover先祖:topmostPopoverAncestor
	%先祖を検査する:checkAncestor
	%候補:candidate
	%候補~先祖:candidateAncestor
	%候補~位置:candidatePosition
	%~focusを復旧するべきか:shouldRestoreFocus
	%~node:node
	%~node:currentNode
	%~node:newPopoverOrTopLayerElement
	%~subject:~subject
	%~control:~control0
	%~top-level文書:topDocument
	%期待される可視性~状態:expectedToBeShowing
	%~popover群:popovers
	%~popover要素:popoverElement
	%~event:~event
	%~target:~target
	%最上層な~popover:topmostPopover
	%同じ~targetか:sameTarget
	%~clickされた~popover:clickedPopover
	%呼出元~popover:invokerPopover
	%呼出元:invoker
	%~popover~list:popoverList
	%~popover~list:-
	%~target~popover:targetPopover
	%終端点:endpoint
	%取消されなかったか:-
	%~toggle~task:-
	%~task:the just queued task
	%属性~状態:-
	%可視性~状態:-
	%期待される文書:expectedDocument
	-:cleanupShowingFlag
	-:cleanupSteps
	%入子な示すか:nestedShow
	%入子な隠すか:nestedHide
	%自動~popover~listは要素を包含するか:autoPopoverListContainsElement
	%~event~target:eventTarget
	%自動~先祖:autoAncestor
	%~hint先祖:hintAncestor
	%自動~list:autoList
	%自動~list:-
	%~hint~list:hintList
	%~hint~list:-
	%繰返すか:repeatingHide
	%付加-先~stack:stackToAppendTo
	~WHILE 無条件 + BREAK:okNesting

	●仕様
排-:eliminate:~
概略的:brief:~
柔軟性:flexibility:~
基底的:baseline:~

	きちんと:well-
	と称する:call it
	助け:help
	に対する追加である:is in addition to

	●未分類
頻度:frequency:~

	起:happen
	いずれかの:two
	直後:immediately after
	成否:success

●●html_code_list

■popover-attribute-1
<ul>
  <li>
    <a href=...>すべての製品</a>
    <button popovertarget=sub-nav>
     <img src=down-arrow.png alt="Product pages">
    </button>
    <ul popover id=sub-nav>
     <li><a href=...>シャツ</a>
     <li><a href=...>靴</a>
     <li><a href=...>帽子その他</a>
    </ul>
  </li>
  <!-- 他のリストアイテムとリンク -->
</ul>

<ul>
  <li>
    <a href=...>All Products</a>
    <button popovertarget=sub-nav>
     <img src=down-arrow.png alt="Product pages">
    </button>
    <ul popover id=sub-nav>
     <li><a href=...>Shirts</a>
     <li><a href=...>Shoes</a>
     <li><a href=...>Hats etc.</a>
    </ul>
  </li>
  <!-- other list items and links here -->
</ul>

■popover-attribute-2
<button popovertarget=m>動作</button>
<div role=menu id=m popover>
  <button role=menuitem tabindex=-1 autofocus>編集する</button>
  <button role=menuitem tabindex=-1>隠す</button>
  <button role=menuitem tabindex=-1>削除する</button>
</div>

<button popovertarget=m>Actions</button>
<div role=menu id=m popover>
  <button role=menuitem tabindex=-1 autofocus>Edit</button>
  <button role=menuitem tabindex=-1>Hide</button>
  <button role=menuitem tabindex=-1>Delete</button>
</div>

■popover-target-attribute-1
<button popovertarget="foo" popovertargetaction="show">
  Show a popover
</button>
％
<article popover="auto" id="foo">
  This is a popover article!
  <button popovertarget="foo" popovertargetaction="hide">Close</button>
</article>

■popover-target-attribute-2
<input type="button" popovertarget="foo" value="Toggle the popover">
％
<div popover=manual id="foo">
  This is a popover!
</div>

●●images

●●trans_metadata
<p>
~THIS_PAGEは、
~WHATWGによる HTML 仕様の
<a href="~SPEC_URL">§ The popover attribute</a>
を日本語に翻訳したものです。
~PUB
</p>

</script>
</head>
<body>

<header>
	<hgroup>
<h1>HTML — <code class="attr">popover</code> 属性</h1>
	</hgroup>
</header>

<main id="MAIN" hidden>

		<section id="_conventions">
<h3>【この訳に特有な表記規約】</h3>

◎表記記号

		</section>
		<section id="the-popover-attribute">
<h3 title="The popover attribute">6.12. `popover^a 属性</h3>

<p>
`popover@a
内容~属性は、
どの`~HTML要素$に設定してもヨイ。
指定された場合、
当の要素は，［
示されるようになる
］まで具現化されなくなり、
そうなった時点で，他の~page内容の上層に具現化される。
◎
All HTML elements may have the popover content attribute set. When specified, the element won't be rendered until it becomes shown, at which point it will be rendered on top of other page content.
</p>

<p class="trans-note">【
`popover^en の意味：
他のもの越しに（ `over^en ）飛び出る（ `pop^en ）。
】【
既定の具現化-法（~UA~stylesheet）は、
`§ 具現化 内の § ~flow内容＠~HTMLrendering#flow-content-3$にて見出せる。
具現化（~layout）を もっと詳細に制御する方法は、
従来からある `CSS Positioned Layout＠~CSSPOS$cite に加えて，
`CSS Anchor Positioning＠~CSSANCHOR$cite
が受持つことになろう。
】</p>

<div class="example">
<p>
`popover$a 属性は、
大域~属性であり，［
~popoverの機能性を最も関連な意味論を伴う要素に適用できるようにする
］ことを確保する柔軟性を作者に許容する。
◎
The popover attribute is a global attribute that allows authors flexibility to ensure popover functionality can be applied to elements with the most relevant semantics.
</p>

<p>
［
~web~site用の大域的な~navi
］の中に~popover下位-~navi用の［
~linkたちが成す~list
］をどう作成するかを次にデモる：
◎
The following demonstrates how one might create a popover sub-navigation list of links, within the global navigation for a website.
</p>

`popover-attribute-1^xCode
</div>

<p>
作者は、
~accessibilityの意味論を伴わない要素
— 一例として `div$e 要素 —
に対し `popover$a を利用するときには、
適切な~ARIA属性を利用して，
当の~popoverが~access可能になることを確保するベキである。
◎
When using popover on elements without accessibility semantics, for instance the div element, authors should use the appropriate ARIA attributes to ensure the popover is accessible.
</p>

<div class="example">
<p>
~custom~menu（ `menu^v ）用の~popoverを作成する基底的~markupを次に示す
— そこでは、
~popoverが呼出されたとき，
1 個目の~menu~item（ `menuitem^v ）が［
`autofocus$a 属性の利用に因り，~keyboard~focusを受取る
］ことになる。
それでも、［
矢印~UIkeyで各~menu~itemへ~navigateすること
］および［
各~menu~item用の作動化の挙動
］には，作者による~scriptingが必要になる。
~custom~menuを伴う~widgetを築くための追加的な要件は、
`WAI-ARIA 仕様＠~ARIA1#menu$にて定義される。
◎
The following shows the baseline markup to create a custom menu popover, where the first menuitem will receive keyboard focus when the popover is invoked due to the use of the autofocus attribute. Navigating the menuitems with arrow keys and activation behaviors would still need author scripting. Additional requirements for building custom menus widgets are defined in the WAI-ARIA specification.
</p>

`popover-attribute-2^xCode

<p>
~popoverは［
状態s~messageを具現化する／
利用者が遂行した動作を確認する
］ためにも有用になり得る。
`output$e 要素~内に~popoverを露呈する方法を次にデモる。
◎
A popover can be useful for rendering a status message, confirming the action performed by the user. The following demonstrates how one could reveal a popover in an output element.
</p>

<pre class="lang-html">
&lt;button id=submit&gt;Submit&lt;/button&gt;
&lt;p&gt;&lt;output&gt;&lt;span popover=manual&gt;&lt;/span&gt;&lt;/output&gt;&lt;/p&gt;

&lt;script&gt;
 const %sBtn = document.getElementById("submit");
 const %outSpan = document.querySelector("output [popover=manual]");
 let %successMessage;
 let %errorMessage;

 /* <span class="comment">
動作の成否を決定するための~logicを定義して，利用する適切な［
成功／~error
］~messageを決定する。
◎
define logic for determining success of action and determining the appropriate success or error messages to use
</span> */

 %sBtn.addEventListener("click", ()=&gt; {
  if ( %success ) {
   %outSpan.textContent = %successMessage;
  }
  else {
   %outSpan.textContent = %errorMessage;
  }
  %outSpan.showPopover();

  setTimeout(function () {
   %outSpan.hidePopover();
  }, 10000);
 });
&lt;/script&gt;
</pre>
</div>

<p class="note">注記：
`output$e 要素の中へ~popover要素を挿入すると、
一般に，［
それが可視になるとき，~screen~readerに内容を発声させる
］ことになる。
これは、
これらの支援技術の利用者にとって
— 内容の複階性や可視になる頻度に依存して —
有用にも煩わしくもなり得る。
`output$e 要素~その他の~ARIA~live領域を利用しているときは、
このことを念頭に置いて，最良な利用者~体験を確保すること。
◎
Inserting a popover element into an output element will generally cause screen readers to announce the content when it becomes visible. Depending on the complexity or frequency of the content, this could be either useful or annoying to users of these assistive technologies. Keep this in mind when using the output element or other ARIA live regions to ensure the best user experience.
</p>

<p>
`popover$a 属性は，`列挙d属性$であり、
次に挙げる~keyword, とり得る状態, それらの対応付けが定義される：
◎
The popover attribute is an enumerated attribute with the following keywords and states:
</p>

<div>
<table><thead>
<tr><th>~keyword
<th>状態
<th>概略的な記述
<tbody>

<tr><td>`auto@v
<td rowspan="2">`自動@st
<td rowspan="2">
開かれたときは、
他の~popoverを閉じる。
`軽く退ける$ふるまいを伴う。

<tr><td>空~文字列

<tr><td>`manual@v
<td>`手動@st
<td>
他の~popoverを閉じない。
`軽く退ける$ふるまいを伴わず，`閉-要請$に応答しない。

<tr><td>`hint@v
<td>`~hint@st
<td>
開かれたときは、
他の~hint~popoverを閉じるが，他の自動~popoverを閉じない。
`軽く退ける$ふるまいを伴い，`閉-要請$に応答する。

<tr><td>
<td>`~popoverなし@st
<td>
【~popoverとして挙動しない。】
</table>
◎
Keyword｜State｜Brief description
auto｜auto｜Closes other popovers when opened; has light dismiss.
(the empty string)｜↑｜↑
manual｜manual｜Does not close other popovers; does not light dismiss or respond to close requests.
hint｜hint｜Closes other hint popovers when opened, but not other auto popovers; has light dismiss and responds to close requests.
</div>

<p>
`popover$a 属性の
⇒＃
`欠落~値~用の既定の状態$は `~popoverなし$st とする。
`妥当でない値~用の既定の状態$は `手動$st とする。
◎
The attribute's missing value default is the no popover state, and its invalid value default is the manual state.
</p>

<p>
`~popover要素@
とは、
`~HTML要素$のうち［
その `popover$a 属性の状態 ~NEQ `~popoverなし$st
］を満たすもの
（言い換えれば， `popover$a 属性を有するもの）をいう。
【この用語は、他所を簡便に述べるための，この訳による追加。】
</p>

<p>
`popover@m
~IDL属性は、
`既知な値のみに制限され$る下で，
`popover$a 属性を`反映する$モノトスル。
◎
The popover IDL attribute must reflect the popover attribute, limited to only known values.
</p>

<p>
各`~HTML要素$には、
`~popover可視性~状態@
がある
— その値は，［
`隠している@i
／
`示している@i
］いずれかであり、
初期~時は， `隠している$i とする。
◎
Every HTML element has a popover visibility state, initially hidden, with these potential values:
• hidden
• showing
</p>

<p>
各`文書$は、
`~popover~pointerdown~target@doc
を有する
— それは、［
ある`~HTML要素$／ ~NULL
］であり，初期~時は ~NULL とする。
◎
Every Document has a popover pointerdown target, which is an HTML element or null, initially null.
</p>

<p>
各`~HTML要素$は、
次に挙げるものを有する
◎
↓</p>
<ul>
	<li>
`~popover呼出元@el
⇒
~NULL ／
ある`~HTML要素$
— 初期~時は ~NULL とする。
◎
Every HTML element has a popover invoker, which is an HTML element or null, initially set to null.
</li>
	<li>
`~popoverを示すまたは隠す途中か@el
⇒
真偽値
— 初期~時は ~F とする。
◎
Every HTML element has a popover showing or hiding, which is a boolean, initially set to false.
</li>
	<li>
`~popover用の~toggle~task追跡子@el
⇒
~NULL ／
ある`~toggle~task追跡子$
— 初期~時は ~NULL とする。
◎
Every HTML element popover toggle task tracker, which is a toggle task tracker or null, initially null.
</li>
	<li>
`~popover閉-注視器@el
⇒
~NULL ／
ある`閉-注視器$
— 初期~時は~NULL とする。
◎
Every HTML element has a popover close watcher, which is a close watcher or null, initially null.
</li>
	<li>
<p>
`~popover~mode@el
⇒
~NULL ／文字列
— 初期~時は~NULL とする。
</p>

<p class="trans-note">【
~NULL の場合、
当の要素は~popoverとして開かれていない
— 他の場合、
どの~modeで開かれたかを指示する。
（この用語は，素直に和訳すると “~popover~modeで開かれた” の様になるが、
真偽-~flagと紛らわしくなるので，このように改めることにする。）
】</p>
◎
Every HTML element has an opened in popover mode, which is a string or null, initially null.
</li>
</ul>

<div class="algo">
<p>
すべての`~HTML要素$ %要素 は、
`属性~変更-時の手続き$として次を利用する
— それは、
所与の
( %局所~名, %旧-値, %値, %名前空間 )
に対し：
◎
The following attribute change steps, given element, localName, oldValue, value, and namespace, are used for all HTML elements:
</p>
<ol>
	<li>
~IF［
%名前空間 ~NEQ ~NULL
］
⇒
~RET
◎
If namespace is not null, then return.
</li>
	<li>
~IF［
%局所~名 ~NEQ "`popover$a"
］
⇒
~RET
◎
If localName is not popover, then return.
</li>
	<li>
~IF［
%要素 の`~popover可視性~状態$ ~EQ `示している$i
］~AND［
`popover$a 属性が［
%旧-値 をとるときの状態, %値 をとるときの状態
］は異なる
］
⇒
`~popoverを隠す$( %要素, ~T, ~T, ~F )
◎
If element's popover visibility state is in the showing state and oldValue and value are in different states, then run the hide popover algorithm given element, true, true, and false.
</li>
</ol>
</div>

<dl class="domintro">
	<dt>%element.`showPopover()$m</dt>
	<dd>
`~popover要素$ %element を`上端~層$に追加することにより，
%element を示す。
%element の `popover$a 属性の状態 ~EQ `自動$stならば、
これは，同じ状態にある他の要素のうち［
`最上層な~popover先祖を見出す$~algoに則って，
%element の先祖であるもの
］を除くすべてを閉じることになる。
◎
Shows the popover element by adding it to the top layer. If element's popover attribute is in the auto state, then this will also close all other auto popovers unless they are an ancestor of element according to the topmost popover ancestor algorithm.
</dd>

	<dt>%element.`hidePopover()$m</dt>
	<dd>
`~popover要素$ %element を`上端~層$から除去した上で、［
%element に
<code class="css">`display$p: `none^v</code>
を適用する
］ことにより，
%element を隠す。
◎
Hides the popover element by removing it from the top layer and applying display: none to it.
</dd>

	<dt>%element.`togglePopover()$m</dt>
	<dd>
`~popover要素$ %element を［
隠しているならば示す／
示しているならば隠す
］。
この~methodは、
~callした後において当の~popoverを［
示しているならば ~T ／
隠しているならば ~F
］を返す。
◎
If the popover element is not showing, then this method shows it. Otherwise, this method hides it. This method returns true if the popover is open after calling it, otherwise false.
</dd>
</dl>

<div class="algo">
<p>
`showPopover(options)@m
~method手続きは：
◎
The showPopover(options) method steps are:
</p>
<ol>
	<li>
%呼出元 ~LET %options[ "`source$mb" ]
◎
Let invoker be options["source"] if it exists;＼
</li>
	<li>
~IF［
%呼出元 ~EQ ε
］
⇒
%呼出元 ~SET ~NULL
◎
otherwise, null.
</li>
	<li>
`~popoverを示す$( コレ, ~T, %呼出元 )
◎
Run show popover given this, true, and invoker.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popoverを示す@
~algoは、
所与の
( `~HTML要素$ %要素, 真偽値 %例外を投出するか, ［
`~HTML要素$ ／ ~NULL
］ %呼出元 )
に対し：
◎
To show popover, given an HTML element element, a boolean throwExceptions, and an HTML element or null invoker:
</p>
<ol>
	<li>
~IF［
`~popoverの妥当性を検査する$( %要素, `隠している$i, %例外を投出するか, ~NULL ) ~EQ ~F
］
⇒
~RET
◎
If the result of running check popover validity given element, false, throwExceptions, and null is false, then return.
</li>
	<li>
%文書 ~LET %要素 の`~node文書$
◎
Let document be element's node document.
</li>
	<li>
~Assert：
%要素 の`~popover呼出元$el ~NEQ ~NULL
◎
Assert: element's popover invoker is null.
</li>
	<li>
~Assert：
%要素 ~NIN %文書 の`上端~層$
◎
Assert: element is not in document's top layer.
</li>
	<li>
%入子な示すか ~LET %要素 の`~popoverを示すまたは隠す途中か$el
◎
Let nestedShow be element's popover showing or hiding.
</li>
	<li>
%~eventを発火するか ~LET ~IS［
%入子な示すか ~EQ ~F
］
◎
Let fireEvents be the boolean negation of nestedShow.
</li>
	<li>
%要素 の`~popoverを示すまたは隠す途中か$el ~SET ~T
◎
Set element's popover showing or hiding to true.
</li>
	<li>
%取消されなかったか ~LET `~eventを発火する$( %要素, `beforetoggle$et, `ToggleEvent$I )
— 次のように初期化して
⇒＃
`cancelable$m 属性 ~SET ~T
`oldState$m 属性 ~SET `closed^l,
`newState$m 属性 ~SET `open^l
◎
↓ Let cleanupShowingFlag be the following steps:
• If nestedShow is false, then set element's popover showing or hiding to false.
◎
If the result of firing an event named beforetoggle, using ToggleEvent, with the cancelable attribute initialized to true, the oldState attribute initialized to "closed", and the newState attribute initialized to "open" at element＼
</li>
	<li>
<p>
~IF［
%取消されなかったか ~EQ ~F
］
⇒
~GOTO `最後の段^i
</p>

<p class="trans-note">【
この訳では、
この段~以降において ~GOTO を利用して，
原文による入子な手続き（ %cleanupShowingFlag ）を伴う制御~flowを少し単純~化する。
】</p>
◎
is false,＼
↓↓ then run cleanupShowingFlag and return.
</li>
	<li>
<p>
~IF［
`~popoverの妥当性を検査する$( %要素, `隠している$i, %例外を投出するか, %文書 ) ~EQ ~F
］
⇒
~GOTO `最後の段^i
◎
If the result of running check popover validity given element, false, throwExceptions, and document is false,＼
↓↓ then run cleanupShowingFlag and return.
</p>

<p class="note">注記：
ここで再び`~popoverの妥当性を検査する$わけは、［
上で発火した `beforetoggle$et ~event
］用の`~event~handler$が［
%要素 を`切断-$し得る／
%要素 の `popover$a 属性を変更し得る
］からである。
◎
Check popover validity is called again because firing the beforetoggle event could have disconnected this element or changed its popover attribute.
</p>
	</li>
	<li>
%~focusを復旧するべきか ~LET ~F
◎
Let shouldRestoreFocus be false.
</li>
	<li>
%元の種別 ~LET %要素 の`popover$a 属性の状態
◎
Let originalType be the current state of element's popover attribute.
</li>
	<li>
%付加-先~stack ~LET ~NULL
◎
Let stackToAppendTo be null.
</li>
	<li>
%自動~list ~LET `文書が示している~popover~listを取得する$( %文書, `auto^l )
◎
↓</li>
	<li>
%~hint~list ~LET `文書が示している~popover~listを取得する$( %文書, `hint^l )
◎
↓</li>
	<li>
%自動~先祖 ~LET `最上層な~popover先祖を見出す$( ↓ )
⇒＃
%要素,
%自動~list,
%呼出元,
~T
◎
Let autoAncestor be the result of running the topmost popover ancestor algorithm given element, document's showing auto popover list, invoker, and true.
</li>
	<li>
%~hint先祖 ~LET `最上層な~popover先祖を見出す$( ↓ )
⇒＃
%要素,
%~hint~list,
%呼出元,
~T
◎
Let hintAncestor be the result of running the topmost popover ancestor algorithm given element, document's showing hint popover list, invoker, and true.
</li>
	<li>
<p>
~IF［
%元の種別 ~EQ `自動$st
］：
◎
If originalType is the auto state, then:
</p>
		<ol>
			<li>
`~popover~list全体を閉じる$( ↓ )
⇒＃
%~hint~list,
%~focusを復旧するべきか,
%~eventを発火するか
◎
Run close entire popover list given document's showing hint popover list, shouldRestoreFocus, and fireEvents.
</li>
			<li>
%先祖 ~LET `最上層な~popover先祖を見出す$( ↓ )
⇒＃
%要素,
%自動~list,
%呼出元,
~T
◎
Let ancestor be the result of running the topmost popover ancestor algorithm given element, document's showing auto popover list, invoker, and true.
</li>
			<li>
~IF［
%先祖 ~EQ ~NULL
］
⇒
%先祖 ~SET %文書
◎
If ancestor is null, then set ancestor to document.
</li>
			<li>
`ある所までの~popoverをすべて隠す$( %先祖, %~focusを復旧するべきか, %~eventを発火するか )
◎
Run hide all popovers until given ancestor, shouldRestoreFocus, and fireEvents.
</li>
			<li>
%付加-先~stack ~SET `auto^l
◎
Set stackToAppendTo to "auto".
</li>
		</ol>
	</li>
	<li>
<p>
~ELIF［
%元の種別 ~EQ `~hint$st
］：
◎
If originalType is the hint state, then:
</p>
		<ol>
			<li>
<p>
~IF［
%~hint先祖 ~NEQ ~NULL
］：
◎
If hintAncestor is not null, then:
</p>
				<ol>
					<li>
`ある所までの~popoverをすべて隠す$( %~hint先祖, %~focusを復旧するべきか, %~eventを発火するか )
◎
Run hide all popovers until given hintAncestor, shouldRestoreFocus, and fireEvents.
</li>
					<li>
%付加-先~stack ~SET `hint^l
◎
Set stackToAppendTo to "hint".
</li>
				</ol>
			</li>
			<li>
<p>
~ELSE：
◎
Otherwise:
</p>
				<ol>
					<li>
`~popover~list全体を閉じる$( ↓ )
⇒＃
%~hint~list,
%~focusを復旧するべきか,
%~eventを発火するか
◎
Run close entire popover list given document's showing hint popover list, shouldRestoreFocus, and fireEvents.
</li>
					<li>
<p>
~IF［
%自動~先祖 ~NEQ ~NULL
］：
◎
If autoAncestor is not null, then:
</p>
						<ol>
							<li>
`ある所までの~popoverをすべて隠す$( %自動~先祖, %~focusを復旧するべきか, %~eventを発火するか )
◎
Run hide all popovers until given autoAncestor, shouldRestoreFocus, and fireEvents.
</li>
							<li>
%付加-先~stack ~SET `auto^l
◎
Set stackToAppendTo to "auto".
</li>
						</ol>
					</li>
					<li>
~ELSE
⇒
%付加-先~stack ~SET `hint^l
◎
Otherwise, set stackToAppendTo to "hint".
</li>
				</ol>
			</li>
		</ol>
	</li>
	<li>
<p>
~IF［
%元の種別 ~IN { `自動$st, `~hint$st }
］：
◎
If originalType is auto or hint, then:
</p>
		<ol>
			<li>
~Assert：
%付加-先~stack ~NEQ ~NULL
◎
Assert: stackToAppendTo is not null.
</li>
			<li>
<p>
~IF［
%元の種別 ~NEQ %要素 の `popover$a 属性の値
］：
◎
If originalType is not equal to the value of element's popover attribute, then:
</p>
				<ol>
					<li>
~IF［
%例外を投出するか ~EQ ~T
］
⇒
~THROW `InvalidStateError$E
◎
If throwExceptions is true, then throw a "InvalidStateError" DOMException.
</li>
					<li>
~RET
◎
Return.
</li>
				</ol>
			</li>
			<li>
<p>
~IF［
`~popoverの妥当性を検査する$( %要素, `隠している$i, %例外を投出するか, %文書 ) ~EQ ~F
］
⇒
~GOTO `最後の段^i
◎
If the result of running check popover validity given element, false, throwExceptions, and document is false, then run cleanupShowingFlag and return.
</p>

<p class="note">注記：
ここで再び`~popoverの妥当性を検査する$わけは、［
上で`ある所までの~popoverをすべて隠す$ときに発火され得る `beforetoggle$et ~event
］用の`~event~handler$が［
%要素 を`切断-$し得る／
%要素 の `popover$a 属性を変更し得る
］からである。
◎
Check popover validity is called again because running hide all popovers until above could have fired the beforetoggle event, and an event handler could have disconnected this element or changed its popover attribute.
</p>
			</li>
			<li>
<p>
~IF［
`最上層な自動または~hint~popoverを見出す$( %文書 ) ~EQ ~NULL
］
⇒
%~focusを復旧するべきか ~SET ~T
◎
If the result of running topmost auto or hint popover on document is null, then set shouldRestoreFocus to true.
</p>

<p class="note">注記：
これは、［
当の~stackを成す最初の~popover用に限り，
前回に~focusした要素に~focusを返す
］ことを確保する。
◎
This ensures that focus is returned to the previously-focused element only for the first popover in a stack.
</p>
			</li>
			<li>
~Assert：
%付加-先~stack ~IN { `auto^l, `hint^l }
◎
↓</li>
			<li>
~Assert：
%要素 ~NIN 次の結果
⇒
`文書が示している~popover~listを取得する$( %文書, %付加-先~stack )
◎
↓</li>
			<li>
%要素 の`~popover~mode$el ~SET %付加-先~stack
◎
If stackToAppendTo is "auto":
• Assert: document's showing auto popover list does not contain element.
• Set element's opened in popover mode to "auto".
◎
Otherwise:
• Assert: stackToAppendTo is "hint".
• Assert: document's showing hint popover list does not contain element.
• Set element's opened in popover mode to "hint".
</li>
			<li id="canceling-popovers">
<p>
%要素 の`~popover閉-注視器$el ~SET `閉-注視器を確立する$( %要素 に`関連な大域~obj$ )
— 次も与える下で：
◎
Set element's popover close watcher to the result of establishing a close watcher given element's relevant global object, with:
</p>
				<ul>
					<li class="algo">
`取消-動作^i は
⇒
~RET ~T
◎
cancelAction being to return true.
</li>
					<li class="algo">
`閉-動作^i は
⇒
`~popoverを隠す$( %要素, ~T, ~T, ~F )
◎
closeAction being to hide a popover given element, true, true, and false.
</li>
			<li class="algo">
`可能化~状態を取得する^i は
⇒
~RET ~T
◎
getEnabledState being to return true.
</li>
				</ul>
			</li>
		</ol>
	</li>
	<li>
%要素 の`前回に~focusされた要素$ ~SET ~NULL
◎
Set element's previously focused element to null.
</li>
	<li>
%元々~focusされた要素 ~LET %文書 が`指名する被focus区画$docの`~DOM~anchor$
◎
Let originallyFocusedElement be document's focused area of the document's DOM anchor.
</li>
	<li>
`上端~層に要素を追加する$( %要素 )
◎
Add an element to the top layer given element.
</li>
	<li>
%要素 の`~popover可視性~状態$ ~SET `示している$i
◎
Set element's popover visibility state to showing.
</li>
	<li>
%要素 の`~popover呼出元$el ~SET %呼出元
◎
Set element's popover invoker to invoker.
</li>
	<li>
%要素 の`暗黙的な~anchor要素$ ~SET %呼出元
◎
Set element's implicit anchor element to invoker.
</li>
	<li>
`~popoverを~focusする$( %要素 )
◎
Run the popover focusing steps given element.
</li>
	<li>
~IF［
%~focusを復旧するべきか ~EQ ~T
］~AND［
%要素 は`~popover要素$である
］
⇒
%要素 の`前回に~focusされた要素$ ~SET %元々~focusされた要素
◎
If shouldRestoreFocus is true and element's popover attribute is not in the no popover state, then set element's previously focused element to originallyFocusedElement.
</li>
	<li>
`~popover用の~toggle~event~taskを~queueする$( %要素, `closed^l, `open^l )
◎
Queue a popover toggle event task given element, "closed", and "open".
</li>
	<li>
`最後の段^i
⇒
~IF［
%入子な示すか ~EQ ~F
］
⇒
%要素 の`~popoverを示すまたは隠す途中か$el ~SET ~F
◎
↑↑ Run cleanupShowingFlag.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popover用の~toggle~event~taskを~queueする@
~algoは、
所与の
( 要素 %要素, 文字列 %旧-状態, 文字列 %新-状態 )
に対し：
◎
To queue a popover toggle event task given an element element, a string oldState, and a string newState:
</p>
<ol>
	<li>
%~toggle~task ~LET %要素 の`~popover用の~toggle~task追跡子$el
◎
↓</li>
	<li>
<p>
~IF［
%~toggle~task ~NEQ ~NULL
］：
◎
If element's popover toggle task tracker is not null, then:
</p>
		<ol>
			<li>
%旧-状態 ~SET %~toggle~task の`旧-状態$tTk
◎
Set oldState to element's popover toggle task tracker's old state.
</li>
			<li>
%~toggle~task の`~task$tTkを それが属する`~task~queue$から除去する
◎
Remove element's popover toggle task tracker's task from its task queue.
</li>
			<li>
%要素 の`~popover用の~toggle~task追跡子$el ~SET ~NULL
◎
Set element's popover toggle task tracker to null.
</li>
		</ol>
	</li>
	<li>
<p>
%~task ~LET `要素~taskを~queueする$( `~DOM操作~task~source$, %要素, 次の手続き )
◎
Queue an element task given the DOM manipulation task source and element＼
</p>

<div class="algo">
<p>
手続きは：
◎
to run the following steps:
</p>
		<ol>
			<li>
`~eventを発火する$( %要素, `toggle$et, `ToggleEvent$I )
— 次のように初期化して
⇒＃
`oldState$m 属性 ~SET %旧-状態,
`newState$m 属性 ~SET %新-状態
◎
Fire an event named toggle at element, using ToggleEvent, with the oldState attribute initialized to oldState and the newState attribute initialized to newState.
</li>
			<li>
%要素 の`~popover用の~toggle~task追跡子$el ~SET ~NULL
◎
Set element's popover toggle task tracker to null.
</li>
		</ol>
</div>
	</li>
	<li>
%要素 の`~popover用の~toggle~task追跡子$el ~SET 次に挙げる~itemからなる`構造体$
⇒＃
`~task$tTk ~SET %~task,
`旧-状態$tTk ~SET %旧-状態
◎
Set element's popover toggle task tracker to a struct with task set to the just-queued task and old state set to oldState.
</li>
</ol>
</div>

<div class="algo">
<p>
`hidePopover()@m
~method手続きは：
◎
The hidePopover() method steps are:
</p>
<ol>
	<li>
`~popoverを隠す$( コレ, ~T, ~T, ~T )
◎
Run the hide popover algorithm given this, true, true, and true.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popoverを隠す@
~algoは、
所与の
⇒＃
`~HTML要素$ %要素,
真偽値 %前回に~focusした要素を~focusするか,
真偽値 %~eventを発火するか,
真偽値 %例外を投出するか
◎終
に対し：
◎
To hide a popover given an HTML element element, a boolean focusPreviousElement, a boolean fireEvents, and a boolean throwExceptions:
</p>
<ol>
	<li>
~IF［
`~popoverの妥当性を検査する$( %要素, `示している$i, %例外を投出するか, ~NULL ) ~EQ ~F
］
⇒
~RET
◎
If the result of running check popover validity given element, true, throwExceptions, and null is false, then return.
</li>
	<li>
%文書 ~LET %要素 の`~node文書$
◎
Let document be element's node document.
</li>
	<li>
%入子な隠すか ~LET %要素 の`~popoverを示すまたは隠す途中か$el
◎
Let nestedHide be element's popover showing or hiding.
</li>
	<li>
%要素 の`~popoverを示すまたは隠す途中か$el ~SET ~T
◎
Set element's popover showing or hiding to true.
</li>
	<li>
<p>
~IF［
%入子な隠すか ~EQ ~T
］
⇒
%~eventを発火するか ~SET ~F
</p>

<p class="trans-note">【
この訳では、
以降において ~GOTO を利用して，
原文による入子な手続き（ %cleanupSteps ）を伴う制御~flowを少し単純~化する。
】</p>
◎
If nestedHide is true, then set fireEvents to false.
◎
↓↓ Let cleanupSteps be the following steps:
• If nestedHide is false, then set element's popover showing or hiding to false.
•• If element's popover close watcher is not null, then:
••• Destroy element's popover close watcher.
••• Set element's popover close watcher to null.
</li>
	<li>
<p>
~IF［
%要素 の `popover$a 属性の状態 ~IN { `自動$st, `~hint$st }
］：
◎
If element's popover attribute is in the auto state or the hint state, then:
</p>
		<ol>
			<li>
`ある所までの~popoverをすべて隠す$( %要素, %前回に~focusした要素を~focusするか, %~eventを発火するか )
◎
Run hide all popovers until given element, focusPreviousElement, and fireEvents.
</li>
			<li>
<p>
~IF［
`~popoverの妥当性を検査する$( %要素, `示している$i, %例外を投出するか ) ~EQ ~F
］
⇒
~GOTO `最後の段^i
◎
If the result of running check popover validity given element, true, and throwExceptions is false,＼
↓↓ then run cleanupSteps and return.
</p>

<p class="note">注記：
ここで再び`~popoverの妥当性を検査する$わけは、
上で`ある所までの~popoverをすべて隠す$ときに［
%要素 を`切断-$し得る／
%要素 の `popover$a 属性を変更し得る
］からである。
◎
Check popover validity is called again because running hide all popovers until could have disconnected element or changed its popover attribute.
</p>
			</li>
		</ol>
	</li>
	<li>
%自動~popover~listは要素を包含するか ~LET ~IS［
次の結果を成す最後の~item ~EQ %要素
］
⇒
`文書が示している~popover~listを取得する$( %文書, `auto^l )
◎
Let autoPopoverListContainsElement be true if document's showing auto popover list's last item is element, otherwise false.
</li>
	<li>
%要素 の`~popover呼出元$el ~SET ~NULL
◎
Set element's popover invoker to null.
</li>
	<li>
<p>
~IF［
%~eventを発火するか ~EQ ~T
］：
◎
If fireEvents is true:
</p>
		<ol>
			<li>
`~eventを発火する$( %要素, `beforetoggle$et, `ToggleEvent$I )
— 次のように初期化して
⇒＃
`oldState$m 属性 ~SET `open^l,
`newState$m 属性 ~SET `closed^l
◎
Fire an event named beforetoggle, using ToggleEvent, with the oldState attribute initialized to "open" and the newState attribute initialized to "closed" at element.
</li>
			<li>
<p>
~IF［
~AND↓
］…
</p>
				<ul>
					<li>
%自動~popover~listは要素を包含するか ~EQ ~T
</li>
					<li>
次の結果を成す最後の~item ~NEQ %要素
⇒
`文書が示している~popover~listを取得する$( `auto^l )
</li>
				</ul>
<p>
…ならば
⇒
`ある所までの~popoverをすべて隠す$( %要素, %前回に~focusした要素を~focusするか, ~F )
</p>
◎
If autoPopoverListContainsElement is true and document's showing auto popover list's last item is not element, then run hide all popovers until given element, focusPreviousElement, and false.
</li>
			<li>
<p>
~IF［
`~popoverの妥当性を検査する$( %要素, `示している$i, %例外を投出するか, ~NULL ) ~EQ ~F
］
⇒
~GOTO `最後の段^i
◎
If the result of running check popover validity given element, true, throwExceptions, and null is false,＼
↓↓ then run cleanupSteps and return.
</p>

<p class="note">注記：
ここで再び`~popoverの妥当性を検査する$わけは、［
上で発火した `beforetoggle$et ~event
］用の`~event~handler$が［
%要素 を`切断-$し得る／
%要素 の `popover$a 属性を変更し得る
］からである。
◎
Check popover validity is called again because firing the beforetoggle event could have disconnected element or changed its popover attribute.
</p>
			</li>
			<li>
`上端~層から要素を除去するよう要請する$( %要素 )
◎
Request an element to be removed from the top layer given element.
</li>
			<li>
%要素 の`暗黙的な~anchor要素$ ~SET ~NULL
◎
Set element's implicit anchor element to null.
</li>
		</ol>
	</li>
	<li>
~ELSE
⇒
`上端~層から要素を即時に除去する$( %要素 )
◎
Otherwise, remove an element from the top layer immediately given element.
</li>
	<li>
%要素 の`~popover~mode$el ~SET ~NULL
◎
Set element's opened in popover mode to null.
</li>
	<li>
%要素 の`~popover可視性~状態$ ~SET `隠している$i
◎
Set element's popover visibility state to hidden.
</li>
	<li>
~IF［
%~eventを発火するか ~EQ ~T
］
⇒
`~popover用の~toggle~event~taskを~queueする$( %要素, `open^l, `closed^l )
◎
If fireEvents is true, then queue a popover toggle event task given element, "open", and "closed".
</li>
	<li>
%前回に~focusされた要素 ~LET %要素 の`前回に~focusされた要素$
◎
Let previouslyFocusedElement be element's previously focused element.
</li>
	<li>
<p>
~IF［
%前回に~focusされた要素 ~NEQ ~NULL
］：
◎
If previouslyFocusedElement is not null, then:
</p>
		<ol>
			<li>
%要素 の`前回に~focusされた要素$ ~SET ~NULL
◎
Set element's previously focused element to null.
</li>
			<li>
<p>
~IF［
%前回に~focusした要素を~focusするか ~EQ ~T
］~AND［
%文書 が`指名する被focus区画$docの`~DOM~anchor$は，
%要素 の`~shadowも含めた広義-子孫$である
］
⇒
`~objを~focusする$( %前回に~focusされた要素 )
◎
If focusPreviousElement is true and document's focused area of the document's DOM anchor is a shadow-including inclusive descendant of element, then run the focusing steps for previouslyFocusedElement;＼
</p>

<p>
この段を行うときは、
`表示域$は~scrollされるベキでない。
◎
the viewport should not be scrolled by doing this step.
</p>
			</li>
		</ol>
	</li>
	<li>
<p>
`最後の段^i：
</p>
		<ol>
			<li>
~IF［
%入子な隠すか ~EQ ~F
］
⇒
%要素 の`~popoverを示すまたは隠す途中か$el ~SET ~F
</li>
			<li>
<p>
~IF［
%要素 の`~popover閉-注視器$el ~NEQ ~NULL
］：
</p>
				<ol>
					<li>
`閉-注視器を破壊する$( %要素 の`~popover閉-注視器$el )
</li>
					<li>
%要素 の`~popover閉-注視器$el ~SET ~NULL
</li>
				</ol>
			</li>
		</ol>
◎
↑↑ Run cleanupSteps.
</li>
</ol>
</div>

<div class="algo">
<p>
`togglePopover(options)@m
~method手続きは：
◎
The togglePopover(options) method steps are:
</p>
<ol>
	<li>
%force ~LET %options に応じて
⇒＃
真偽値であるならば %options ／
~ELSE_ %options[ "`force$mb" ]
◎
Let force be null.
◎
If options is a boolean, set force to options.
◎
Otherwise, if options["force"] exists, set force to options["force"].
</li>
	<li>
%呼出元 ~LET %options[ "`source$mb" ]
◎
Let invoker be options["source"] if it exists;＼
</li>
	<li>
~IF［
%呼出元 ~EQ ε
］
⇒
%呼出元 ~SET ~NULL
◎
otherwise, null.
</li>
	<li>
~IF［
コレの`~popover可視性~状態$ ~EQ `示している$i
］~AND［
%force ~IN { ε【！null】, ~F }
］
⇒
`~popoverを隠す$( コレ, ~T, ~T, ~T )
◎
If this's popover visibility state is showing, and force is null or false, then run the hide popover algorithm given this, true, true, and true.
</li>
	<li>
~ELIF［
%force ~IN { ε【！null】, ~T }
］
⇒
`~popoverを示す$( コレ, ~T, %呼出元 )
◎
Otherwise, if force is null or true, then run show popover given this, true, and invoker.
</li>
	<li>
<p>
~ELSE
⇒
`~popoverの妥当性を検査する$( コレ, コレの`~popover可視性~状態$, ~T, ~NULL )
◎
Otherwise:
• Let expectedToBeShowing be true if this's popover visibility state is showing; otherwise false.
• Run check popover validity given expectedToBeShowing, true, and null.
</li>
	<li>
~RET ~IS［
コレの`~popover可視性~状態$ ~EQ `示している$i
］
◎
Return true if this's popover visibility state is showing; otherwise false.
</li>
</ol>
</div>

<div class="algo">
<p>
`ある所までの~popoverをすべて隠す@
~algoは、
所与の
⇒＃
［`~HTML要素$／`文書$］ %終端点,
真偽値 %前回に~focusした要素を~focusするか,
真偽値 %~eventを発火するか
◎終
に対し：
◎
To hide all popovers until, given an HTML element or Document endpoint, a boolean focusPreviousElement, and a boolean fireEvents:
</p>
<ol>
	<li>
~IF［
%終端点 は`~HTML要素$である
］~AND［
%終端点 の`~popover可視性~状態$ ~NEQ `示している$i
］
⇒
~RET
◎
If endpoint is an HTML element and endpoint is not in the popover showing state, then return.
</li>
	<li>
%文書 ~LET %終端点 の`~node文書$
◎
Let document be endpoint's node document.
</li>
	<li>
<p>
~Assert：
~OR↓：
</p>
		<ul>
			<li>
%終端点 は`文書$である
</li>
			<li>
［
%終端点 の`~popover可視性~状態$ ~EQ `示している$i
］~AND［
%終端点 の `popover$a 属性の状態 ~IN { `自動$st, `~hint$st }
］
</li>
		</ul>
◎
Assert: endpoint is a Document or endpoint's popover visibility state is showing.
◎
Assert: endpoint is a Document or endpoint's popover attribute is in the auto state or endpoint's popover attribute is in the hint state.
</li>
	<li>
%~hint~list ~LET `文書が示している~popover~listを取得する$( %文書, `hint^l )
◎
↓</li>
	<li>
<p>
~IF［
%終端点 は`文書$である
］：
◎
If endpoint is a Document:
</p>
		<ol>
			<li>
`~popover~list全体を閉じる$( ↓ )
⇒＃
%~hint~list,
%前回に~focusした要素を~focusするか,
%~eventを発火するか
◎
Run close entire popover list given document's showing hint popover list, focusPreviousElement, and fireEvents.
</li>
			<li>
%自動~list ~LET `文書が示している~popover~listを取得する$( %文書, `auto^l )
◎
↓</li>
			<li>
`~popover~list全体を閉じる$( ↓ )
⇒＃
%自動~list,
%前回に~focusした要素を~focusするか,
%~eventを発火するか
◎
Run close entire popover list given document's showing auto popover list, focusPreviousElement, and fireEvents.
</li>
			<li>
~RET
◎
Return.
</li>
		</ol>
	</li>
	<li>
<p>
~IF［
%終端点 ~IN %~hint~list
］：
◎
If document's showing hint popover list contains endpoint:
</p>
		<ol>
			<li>
~Assert：
%終端点 の `popover$a 属性の状態 ~EQ `~hint$st
◎
Assert: endpoint's popover attribute is in the hint state.
</li>
			<li>
`ある所までの~popover~stackを隠す$( ↓ )
⇒＃
%終端点,
%~hint~list,
%前回に~focusした要素を~focusするか,
%~eventを発火するか
◎
Run hide popover stack until given endpoint, document's showing hint popover list, focusPreviousElement, and fireEvents.
</li>
			<li>
~RET
◎
Return.
</li>
		</ol>
	</li>
	<li>
`~popover~list全体を閉じる$( ↓ )
⇒＃
%~hint~list,
%前回に~focusした要素を~focusするか,
%~eventを発火するか
◎
Run close entire popover list given document's showing hint popover list, focusPreviousElement, and fireEvents.
</li>
	<li>
%自動~list ~LET `文書が示している~popover~listを取得する$( %文書, `auto^l )
◎
↓</li>
	<li>
~IF［
%終端点 ~IN %自動~list
］
⇒
`ある所までの~popover~stackを隠す$( ↓ )
⇒＃
%終端点,
%自動~list,
%前回に~focusした要素を~focusするか,
%~eventを発火するか
◎
If document's showing auto popover list does not contain endpoint, then return.
◎
Run hide popover stack until given endpoint, document's showing auto popover list, focusPreviousElement, and fireEvents.
</li>
</ol>
</div>

<div class="algo">
<p>
`ある所までの~popover~stackを隠す@
~algoは、
所与の
⇒＃
`~HTML要素$ %終端点,
`~list$ %~popover~list,
真偽値 %前回に~focusした要素を~focusするか,
真偽値 %~eventを発火するか
◎終
に対し：
◎
To hide popover stack until, given an HTML element endpoint, a list popoverList, a boolean focusPreviousElement, and a boolean fireEvents:
</p>
<ol>
	<li>
%繰返すか ~LET ~F
◎
↓↓ Let repeatingHide be false.
</li>
	<li>
<p>
~WHILE 無条件：
◎
Perform the following steps at least once:
</p>
		<ol>
			<li>
%隠し残した~popover ~LET ~NULL
◎
Let lastToHide be null.
</li>
			<li>
<p>
%~popover~list を成す
~EACH( %~popover )
に対し：
◎
For each popover in popoverList:
</p>
				<ol>
					<li>
~IF［
%~popover ~EQ %終端点
］
⇒
~BREAK
◎
If popover is endpoint, then break.
</li>
					<li>
%隠し残した~popover ~SET %~popover
◎
Set lastToHide to popover.
</li>
				</ol>
			</li>
			<li>
~IF［
%隠し残した~popover ~EQ ~NULL
］
⇒
~RET
◎
If lastToHide is null, then return.
</li>
			<li>
<p>
~WHILE［
%隠し残した~popover の`~popover可視性~状態$ ~EQ `示している$i
］：
◎
While lastToHide's popover visibility state is showing:
</p>
				<ol>
					<li>
~Assert：
%~popover~list は空でない。
◎
Assert: popoverList is not empty.
</li>
					<li>
`~popoverを隠す$( ↓ )
⇒＃
%~popover~list を成す最後の~item,
%前回に~focusした要素を~focusするか,
%~eventを発火するか,
~F
◎
Run the hide popover algorithm given the last item in popoverList, focusPreviousElement, fireEvents, and false.
</li>
				</ol>
			</li>
			<li>
~Assert：
［
%繰返すか ~EQ ~F
］~OR［［
%~popover~list は空でない
］~AND［
%終端点 ~EQ %~popover~list を成す最後の~item
］］
◎
Assert: repeatingHide is false or popoverList's last item is endpoint.
</li>
			<li>
%繰返すか ~LET ~IS［
%終端点 ~IN %~popover~list
］~AND［
%終端点 ~NEQ %~popover~list を成す最後の~item
］
◎
Set repeatingHide to true if popoverList contains endpoint and popoverList's last item is not endpoint, otherwise false.
</li>
			<li>
~IF［
%繰返すか ~EQ ~F
］
⇒
~BREAK
◎
↓</li>
			<li>
%~eventを発火するか ~SET ~F
◎
If repeatingHide is true, then set fireEvents to false.
◎
and keep performing them while repeatingHide is true.
</li>
		</ol>
	</li>
</ol>


<p class="note">注記：
`ある所までの~popoverをすべて隠す$~algoは、
いくつかの事例で，~popoverのうち［
何かが起きたときでも，開いたまま残されるもの
］以外のものをすべて隠すために利用される。
例えば，この~algoは、
~popoverを`軽く退ける$間は，~popoverのうち［
利用者により~clickされた~nodeに関係しないもの
］に限り閉じることを確保する。
◎
The hide all popovers until algorithm is used in several cases to hide all popovers that don't stay open when something happens. For example, during light-dismiss of a popover, this algorithm ensures that we close only the popovers that aren't related to the node clicked by the user.
</p>
</div>

<div class="algo">
<p>
`最上層な~popover先祖を見出す@
~algoは、
所与の
⇒＃
`~node$ %~node,
`~list$ %~popover~list,
［ `~HTML要素$／ ~NULL ］ %呼出元,
真偽値 %~popoverであるか
◎終
に対し，［
`~HTML要素$ ／ ~NULL
］を返す：
◎
To find the topmost popover ancestor, given a Node newPopoverOrTopLayerElement, a list popoverList, an HTML element or null invoker, and a boolean isPopover, perform the following steps. They return an HTML element or null.
</p>

<div class="note">
<p>注記：
`最上層な~popover先祖を見出す$~algoは、
供された %~node
— 新たな~popover, または`上端~層$を成す要素 —
用に，最上層な
（`示している自動~popover~list$doc内で最も後に来る）
先祖~popoverを返すことになる。
◎
The topmost popover ancestor algorithm will return the topmost (latest in the showing auto popover list) ancestor popover for the provided popover or top layer element.＼
</p>

<p>
~popoverたちは、
いくつかの仕方で互いに関係し得ることにより，それらが成す~treeを作成する。
ある~popover（以下では “子” ~popoverと称する）は、
次に挙げる経路を通して，
ある最上層な先祖~popover（以下では “親” ~popover と称する）を有し得る：
◎
Popovers can be related to each other in several ways, creating a tree of popovers. There are two paths through which one popover (call it the "child" popover) can have a topmost ancestor popover (call it the "parent" popover):
</p>
<ul>
	<li>
~node~treeの中で，ある~popoverを別の~popoverが入子にしているとき。
この事例では、
子孫である~popoverが “子”, その最上層な先祖である~popoverが “親” になる。
◎
The popovers are nested within each other in the node tree. In this case, the descendant popover is the "child" and its topmost ancestor popover is the "parent".
</li>
	<li>
何かを呼出している要素 %要素 （例： `button$e ）が，
`popovertarget$a 属性を有していて、
それは，ある~popoverを指しているとき。
この事例では、
当の~popoverが “子” になり，
%要素 を包含している~popover下位treeが “親” になる
— %要素 【！invoker】は［
ある~popover内に在って，ある開な~popoverを参照する
］必要がある。
◎
An invoking element (e.g., a button) has a popovertarget attribute pointing to a popover. In this case, the popover is the "child", and the popover subtree the invoking element is in is the "parent". The invoker has to be in a popover and reference an open popover.
</li>
</ul>

<p>
上により形成される各~関係性において、
親~popoverは，
`示している自動~popover~list$doc内で，子~popoverより厳密に先に来る必要がある
— さもなければ、
妥当な先祖-関係性を形成しない。
これは、［
示していない~popover,
自己-~pointer
（例：上に挙げた 2 つ目の関係性において、
%要素 が指している~popoverと %要素 を包含している~popoverが同じである）
］を排することに加え，［
（場合によっては循環な）接続たちが成す~graphから，きちんと形成された~treeを構築する
］ことを許容する。
ここで考慮されるのは、［
`popover$a 属性の状態 ~EQ `自動$st
］を満たす~popoverに限られる。
◎
In each of the relationships formed above, the parent popover has to be strictly earlier in the showing auto popover list than the child popover, or it does not form a valid ancestral relationship. This eliminates non-showing popovers and self-pointers (e.g., a popover containing an invoking element that points back to the containing popover), and it allows for the construction of a well-formed tree from the (possibly cyclic) graph of connections. Only auto popovers are considered.
</p>

<p>
供された %~node は上端~層を成す要素である場合
（~popoverとして示していない `dialog$e など）、
`最上層な~popover先祖を見出す$~algoは，［
当の~node~tree内に限り調べて，最初の~popoverを見出す
］ことになる。
◎
If the provided element is a top layer element such as a dialog which is not showing as a popover, then topmost popover ancestor will only look in the node tree to find the first popover.
</p>
</div>

<ol>
	<li>
<p>
~Assert：
%~popoverであるか に応じて：
◎
↓</p>
		<ul class="switch">
			<li>
<p>
~T ならば ~AND↓ が満たされる：
◎
If isPopover is true:
</p>
				<ul>
					<li>
%~node は`~HTML要素$である。
◎
Assert: newPopoverOrTopLayerElement is an HTML element.
</li>
					<li>
%~node の `popover$a 属性の状態 ~NIN { 
`~popoverなし$st, `手動$st }
◎
Assert: newPopoverOrTopLayerElement's popover attribute is not in the no popover state or the manual state.
</li>
					<li>
%~node の`~popover可視性~状態$ ~NEQ `示している$i
◎
Assert: newPopoverOrTopLayerElement's popover visibility state is not in the popover showing state.
</li>
				</ul>
			</li>
			<li>
~F ならば次が満たされる
⇒
%呼出元 ~EQ ~NULL
◎
Otherwise:
• Assert: invoker is null.
</li>
		</ul>
	</li>
	<li>
%~popover位置~群 ~LET 新たな`有順序~map$
◎
Let popoverPositions be an empty ordered map.
</li>
	<li>
%~index ~LET 0
◎
Let index be 0.
</li>
	<li>
<p>
%~popover~list を成す
~EACH( %~popover )
に対し：
◎
For each popover of popoverList:
</p>
		<ol>
			<li>
%~popover位置~群[ %~popover ] ~SET %~index
◎
Set popoverPositions[popover] to index.
</li>
			<li>
%~index ~INCBY 1
◎
Increment index by 1.
</li>
		</ol>
	</li>
	<li>
~IF［
%~popoverであるか ~EQ ~T
］
⇒
%~popover位置~群[ %~node ] ~SET %~index
◎
If isPopover is true, then set popoverPositions[newPopoverOrTopLayerElement] to index.
</li>
	<li>
%~index ~INCBY 1
◎
Increment index by 1.
</li>
	<li>
%最上層な~popover先祖 ~LET ~NULL
◎
Let topmostPopoverAncestor be null.
</li>
	<li class="algo">
<p>
%先祖を検査する ~LET 所与の
( %候補 )
に対し，次の手続きを遂行する~algo：
◎
Let checkAncestor be an algorithm which performs the following steps given candidate:
</p>
		<ol>
			<li>
~IF［
%候補 ~EQ ~NULL
］
⇒
~RET
◎
If candidate is null, then return.
</li>
			<li>
%候補~先祖 ~LET ~NULL
◎
Let okNesting be false.
◎
Let candidateAncestor be null.
</li>
			<li>
<p>
~WHILE 無条件：
◎
While okNesting is false:
</p>
				<ol>
					<li>
%候補~先祖 ~SET `広義-先祖のうち最も近い開な~popoverを見出す$( %候補 )
◎
Set candidateAncestor to the result of running nearest inclusive open popover given candidate.
</li>
					<li>
~IF［
%候補~先祖 ~EQ ~NULL
］~OR［
%候補~先祖 ~NIN %~popover位置~群
］
⇒
~RET
◎
If candidateAncestor is null or popoverPositions does not contain candidateAncestor, then return.
</li>
					<li>
~Assert：
%候補~先祖 の`popover$a 属性の状態 ~NIN { `手動$st, `~popoverなし$st }
◎
Assert: candidateAncestor's popover attribute is not in the manual or none state.
</li>
					<li>
~IF［
%~node の `popover$a 属性の状態 ~EQ `~hint$st
］~OR［
%候補~先祖 の`popover$a 属性の状態 ~EQ `自動$st
］
⇒
~BREAK【！Set okNesting to true】
◎
Set okNesting to true＼
if newPopoverOrTopLayerElement's popover attribute is in the hint state or candidateAncestor's popover attribute is in the auto state.
◎
If okNesting is false,＼
</li>
					<li>
%候補 ~SET `平坦~tree$における %候補~先祖 の親
◎
then set candidate to candidateAncestor's parent in the flat tree.
</li>
				</ol>
			</li>
			<li>
%候補~位置 ~LET %~popover位置~群[ %候補~先祖 ]
◎
Let candidatePosition be popoverPositions[candidateAncestor].
</li>
			<li>
~IF［
%最上層な~popover先祖 ~EQ ~NULL
］~OR［
%~popover位置~群[ %最上層な~popover先祖 ] ~LT %候補~位置
］
⇒
%最上層な~popover先祖 ~SET %候補~先祖
◎
If topmostPopoverAncestor is null or popoverPositions[topmostPopoverAncestor] is less than candidatePosition, then set topmostPopoverAncestor to candidateAncestor.
</li>
		</ol>
	</li>
	<li>
%先祖を検査する( `平坦~tree$における %~node の親 )
◎
Run checkAncestor given newPopoverOrTopLayerElement's parent node within the flat tree.
</li>
	<li>
%先祖を検査する( %呼出元 )
◎
Run checkAncestor given invoker.
</li>
	<li>
~RET %最上層な~popover先祖
◎
Return topmostPopoverAncestor.
</li>
</ol>
</div>

<div class="algo">
<p>
`広義-先祖のうち最も近い開な~popoverを見出す@
~algoは、
所与の
( `~node$ %~node )
に対し，［
`~HTML要素$ ／ ~NULL
］を返す：
◎
To find the nearest inclusive open popover given a Node node, perform the following steps. They return an HTML element or null.
•↓ Let currentNode be node.
</p>
<ol>
	<li>
<p>
~WHILE［
%~node ~NEQ ~NULL
］：
◎
While currentNode is not null:
</p>
		<ol>
			<li>
~IF［
%~node の `popover$a 属性の状態 ~EQ `自動$st
］~AND［
%~node の`~popover可視性~状態$ ~EQ `示している$i
］
⇒
~RET %~node
◎
If currentNode's popover attribute is in the auto state and currentNode's popover visibility state is showing, then return currentNode.
</li>
			<li>
%~node ~SET `平坦~tree$における %~node の親
◎
Set currentNode to currentNode's parent in the flat tree.
</li>
		</ol>
	</li>
	<li>
~RET ~NULL
◎
Return null.
</li>
</ol>
</div>

<div class="algo">
<p>
`最上層な自動または~hint~popoverを見出す@
~algoは、
所与の
( `文書$ %文書 )
に対し，［
`~HTML要素$ ／ ~NULL
］を返す：
◎
To find the topmost auto or hint popover given a Document document, perform the following steps. They return an HTML element or null.
</p>
<ol>
	<li>
<p>
« `hint^l, `auto^l »
を成す
~EACH( %~mode )
に対し：
</p>
		<ol>
			<li>
%~popover~list ~LET `文書が示している~popover~listを取得する$( %文書, %~mode )
</li>
			<li>
~IF［
%~popover~list は`空$でない
］
⇒
~RET %~popover~list を成す最後の~item【！要素】
</li>
		</ol>
◎
If document's showing hint popover list is not empty, then return document's showing hint popover list's last element.
◎
If document's showing auto popover list is not empty, then return document's showing auto popover list's last element.
</li>
	<li>
~RET ~NULL
◎
Return null.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popoverを~focusする@
~algoは、
所与の
( `~HTML要素$ %~subject )
に対し：
◎
To perform the popover focusing steps for an HTML element subject:
</p>
<ol>
	<li>
~IF［
`~focusを許容する手続き$( %~subject の`~node文書$ ) ~EQ ~F
］
⇒
~RET ~F
◎
If the allow focus steps given subject's node document return false, then return.
</li>
	<li>
~IF［
%~subject は `dialog$e 要素である
］
⇒＃
`~dialogを~focusする$( %~subject )；
~RET
◎
If subject is a dialog element, then run the dialog focusing steps given subject and return.
</li>
	<li>
%~control ~LET %~subject は `autofocus$a 属性を
⇒＃
有するならば %~subject ／
有さないならば `自動focus委任-先$( %~subject, `other^l )
◎
If subject has the autofocus attribute, then let control be subject.
◎
Otherwise, let control be the autofocus delegate for subject given "other".
</li>
	<li>
~IF［
%~control ~EQ ~NULL
］
⇒
~RET
◎
If control is null, then return.
</li>
	<li>
`~objを~focusする$( %~control )
◎
Run the focusing steps given control.
</li>
	<li>
%~top-level文書 ~LET %~control の`~node文書$が`属する閲覧~文脈$の`~top-level閲覧~文脈$にて`作動中な文書$bc
◎
Let topDocument be the active document of control's node document's browsing context's top-level browsing context.
</li>
	<li>
~IF［
( %~control の`~node文書$の`生成元$doc, %~top-level文書 の`生成元$doc )
は`同一-生成元$でない
］
⇒
~RET
◎
If control's node document's origin is not the same as the origin of topDocument, then return.
</li>
	<li>
%~top-level文書 の`自動focus候補~群$を`空にする$
◎
Empty topDocument's autofocus candidates.
</li>
	<li>
%~top-level文書 の`自動focusは処理-済みか$ ~SET ~T
◎
Set topDocument's autofocus processed flag to true.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popoverの妥当性を検査する@
~algoは、
所与の
⇒＃
`~HTML要素$ %要素,
%期待される可視性~状態 ~IN { `示している$i, `隠している$i },
真偽値 %例外を投出するか,
［ `文書$／ ~NULL ］ %期待される文書
◎終
に対し，
例外を投出するか真偽値を返す：
◎
To check popover validity for an HTML element element given a boolean expectedToBeShowing, a boolean throwExceptions, and a Document or null expectedDocument, perform the following steps. They throw an exception or return a boolean.
</p>
<ol>
	<li>
<p>
~IF［
%要素 は`~popover要素$でない
］：
◎
If element's popover attribute is in the no popover state, then:
</p>
		<ol>
			<li>
~IF［
%例外を投出するか ~EQ ~T
］
⇒
~THROW `NotSupportedError$E
◎
If throwExceptions is true, then throw a "NotSupportedError" DOMException.
</li>
			<li>
~RET ~F
◎
Return false.
</li>
		</ol>
	</li>
	<li>
~IF［
%期待される可視性~状態 ~NEQ %要素 の`~popover可視性~状態$
］
⇒
~RET ~F
◎
If any of the following are true:
• expectedToBeShowing is true and element's popover visibility state is not showing; or
• expectedToBeShowing is false and element's popover visibility state is not hidden,
then return false.
</li>
	<li>
<p>
~IF［
~OR↓
］…
◎
If any of the following are true:
</p>
		<ul>
			<li>
%要素 は`接続されて$いない
◎
element is not connected;
</li>
			<li>
%要素 の`~node文書$は`全部的に作動中$でない
◎
element's node document is not fully active;
</li>
			<li>
%期待される文書 ~NIN { ~NULL, %要素 の`~node文書$ }
◎
expectedDocument is not null and element's node document is not expectedDocument;
</li>
			<li>
［
%要素 は `dialog$e 要素である
］~AND［
%要素 の`~modalか$ ~EQ ~T
］
◎
element is a dialog element and its is modal is set to true; or
</li>
			<li>
%要素 の`~fullscreenか$ ~EQ ~T
◎
element's fullscreen flag is set,
</li>
		</ul>
<p>
…ならば：
◎
then:
</p>
		<ol>
			<li>
~IF［
%例外を投出するか ~EQ ~T
］
⇒
~THROW `InvalidStateError$E
◎
If throwExceptions is true, then throw a "InvalidStateError" DOMException.
</li>
			<li>
~RET ~F
◎
Return false.
</li>
		</ol>
	</li>
	<li>
~RET ~T
◎
Return true.
</li>
</ol>

<p class="trans-note">【
%期待される可視性~状態 は，原文では真偽値をとるが、
明快にするため，`~popover可視性~状態$がとり得る値をとるよう改める。
】</p>
</div>

<div class="algo">
<p>
`文書が示している~popover~listを取得する@
~algoは、
所与の
( `文書$ %文書, 文字列 %~mode )
に対し：
</p>
<ol>
	<li>
~Assert：
%~mode ~IN { `auto^l, `hint^l }
</li>
	<li>
%~popover群 ~LET « »
</li>
	<li>
<p>
%文書 の`上端~層$を成す
~EACH( `要素$ %要素 )
に対し：
</p>
		<ol>
			<li>
<p>
~IF［
~AND↓
］…
</p>
				<ul>
					<li>
%要素 は`~HTML要素$である
</li>
					<li>
%要素 の`~popover~mode$el ~EQ %~mode
</li>
					<li>
%要素 の`~popover可視性~状態$ ~EQ `示している$i
</li>
				</ul>
<p>
…ならば
⇒
%~popover群 に %要素 を`付加する$
</p>
			</li>
		</ol>
	</li>
	<li>
~RET %~popover群
</li>
</ol>
◎
↓</div>

<p>
所与の`文書$ %文書 に対し：
◎
↓</p>
<ul>
	<li>
%文書 が
`示している自動~popover~list@doc
は、
次の結果を指す
⇒
`文書が示している~popover~listを取得する$( %文書, `auto^l )
◎
To get the showing auto popover list for a Document document:
• Let popovers be « ».
• For each Element element in document's top layer:
•• If all of the following are true:
••• element is an HTML element;
••• element's opened in popover mode is "auto"; and
••• element's popover visibility state is showing, 
•• then append element to popovers.
• Return popovers.
</li>
	<li>
%文書 が
`示している~hint~popover~list@doc
は、
次の結果を指す
⇒
`文書が示している~popover~listを取得する$( %文書, `hint^l )
◎
To get the showing hint popover list for a Document document:
• Let popovers be « ».
• For each Element element in document's top layer:
•• If all of the following are true:
••• element is an HTML element;
••• element's opened in popover mode is "hint"; and
••• element's popover visibility state is showing, 
•• then append element to popovers.
• Return popovers.
</li>
</ul>

<div class="algo">
`~popover~list全体を閉じる@
~algoは、
所与の
⇒＃
`~list$ %~popover~list,
真偽値 %前回に~focusした要素を~focusするか,
真偽値 %~eventを発火するか
◎終
に対し
⇒
~WHILE［
%~popover~list は空でない
］
⇒
`~popoverを隠す$( ↓ )
⇒＃
%~popover~list を成す最後の~item,
%前回に~focusした要素を~focusするか,
%~eventを発火するか,
~F
◎
To close entire popover list given a list popoverList, a boolean focusPreviousElement, and a boolean fireEvents:
• While popoverList is not empty:
•• Run the hide popover algorithm given popoverList's last item, focusPreviousElement, fireEvents, and false.
</div>

			</section>
			<section id="the-popover-target-attributes">
<h4 title="The popover target attributes">6.12.1. ~popover~target属性</h4>

<p>
各`~button$は、
次に挙げる各~内容~属性を有してもヨイ
— これらは、
`~popover~target属性@
と総称される
⇒＃
`popovertarget@a,
`popovertargetaction@a
◎
Buttons may have the following content attributes:
• popovertarget
• popovertargetaction
</p>

<p>
`popovertarget$a 属性に指定する値は、
次を満たす要素の`~ID$でなければナラナイ
⇒
［
`popover$a 属性を有する
］~AND［
当の`~button$と同じ`~tree$内にある
］
◎
If specified, the popovertarget attribute value must be the ID of an element with a popover attribute in the same tree as the button with the popovertarget attribute.
</p>

<p>
`popovertargetaction$a 属性は，`列挙d属性$であり、
次に挙げる~keyword, とり得る状態, それらの対応付けが定義される：
◎
The popovertargetaction attribute is an enumerated attribute with the following keywords and states:
</p>

<div>
<table><thead>
<tr><th>~keyword
<th>状態
<th>概略的な記述
<tbody>

<tr><td>`toggle@v
<td>`~toggleする@st
<td>~targetにされた~popover要素を［
示す／隠す
］。

<tr><td>`show@v
<td>`示す@st
<td>~targetにされた~popover要素を示す。

<tr><td>`hide@v
<td>`隠す@st
<td>~targetにされた~popover要素を隠す。
</table>
◎
Keyword｜State｜Brief description
toggle｜toggle｜Shows or hides the targeted popover element.
show｜show｜Shows the targeted popover element.
hide｜hide｜Hides the targeted popover element.
</div>

<p>
`popovertargetaction$a 属性の［
`欠落~値~用の既定の状態$, `妥当でない値~用の既定の状態$
］は、
いずれも `~toggleする$st とする。
◎
The attribute's missing value default and invalid value default are both the toggle state.
</p>

<p class="note">注記：
アリなときは、
~DOM内で［
~popover要素が，それを誘発している要素の直後に配置される
］ことを確保すること。
そうすれば、［
~screen~readerなどの支援~技術の利用者
］に対し［
当の~popoverが，論理的~program的な読取り順序で公開される
］ことを確保する助けになる。
◎
Whenever possible ensure the popover element is placed immediately after its triggering element in the DOM. Doing so will help ensure that the popover is exposed in a logical programmatic reading order for users of assistive technology, such as screen readers.
</p>

<div class="example">
<p>
`popovertarget$a 属性を `popovertargetaction$a 属性と組合せて，
~popoverを［
示す, 閉じる
］ために どう利用できるかを次に示す：
◎
The following shows how the popovertarget attribute in combination with the popovertargetaction attribute can be used to show and close a popover:
</p>

`popover-target-attribute-1^xCode

<p>
`popovertargetaction$a 属性が指定されなかった場合、
結付けられた~popoverを~toggleすることが既定の動作になる。
それを呼出している~buttonに `popovertarget$a 属性を指定するだけで，
`手動$stな~popoverの［
開な状態, 閉な状態
］を~toggleできる様子を次に示す。
手動な~popoverは、［
`軽く退ける$ふるまい／`閉-要請$
］に応答しない：
◎
If a popovertargetaction attribute is not specified, the default action will be to toggle the associated popover. The following shows how only specifying the popovertarget attribute on its invoking button can toggle a manual popover between its opened and closed states. A manual popover will not respond to light dismiss or close requests:
</p>

`popover-target-attribute-2^xCode

</div>

<p>
【！`~DOM~interface$】
◎
DOM interface:
</p>

<pre class="idl">
interface mixin `PopoverInvokerElement@I {
  [`CEReactions$] attribute Element? `popoverTargetElement$m;
  [`CEReactions$] attribute DOMString `popoverTargetAction$m;
};
</pre>

<p>
`popoverTargetElement@m
~IDL属性は、
`popovertarget$a 属性を`反映する$モノトスル。
◎
The popoverTargetElement IDL attribute must reflect the popovertarget attribute.
</p>

<p>
`popoverTargetAction@m
~IDL属性は、
`既知な値のみに制限され$る下で，
`popovertargetaction$a 属性を`反映する$モノトスル。
◎
The popoverTargetAction IDL attribute must reflect the popovertargetaction attribute, limited to only known values.
</p>

<div class="algo">
<p>
`~popover~target属性~作動化の挙動@
は、
所与の
( `~node$ %~node, `~node$ %~event~target )
に対し：
◎
To run the popover target attribute activation behavior given a Node node and a Node eventTarget:
</p>
<ol>
	<li>
%~popover ~LET %~node の`~popover~target要素$
◎
Let popover be node's popover target element.
</li>
	<li>
~IF［
%~popover ~EQ ~NULL
］
⇒
~RET
◎
If popover is null, then return.
</li>
	<li>
~IF［
%~event~target は %~popover の`~shadowも含めた広義-子孫$である
］~AND［
%~popover は %~node の`~shadowも含めた子孫$である
］
⇒
~RET
◎
If eventTarget is a shadow-including inclusive descendant of popover and popover is a shadow-including descendant of node, then return.
</li>
	<li>
%属性~状態 ~LET %~node の `popovertargetaction$a 属性の状態
◎
↓</li>
	<li>
%可視性~状態 ~LET %~popover の`~popover可視性~状態$
◎
↓</li>
	<li>
~IF［
%属性~状態 ~EQ `示す$st【！`show$v】
］~AND［
%可視性~状態 ~EQ `示している$i
］
⇒
~RET
◎
If node's popovertargetaction attribute is in the show state and popover's popover visibility state is showing, then return.
</li>
	<li>
~IF［
%属性~状態 ~EQ `隠す$st【！`hide$v】
］~AND［
%可視性~状態 ~EQ `隠している$i
］
⇒
~RET
◎
If node's popovertargetaction attribute is in the hide state and popover's popover visibility state is hidden, then return.
</li>
	<li>
~IF［
%可視性~状態 ~EQ `示している$i
］
⇒
`~popoverを隠す$( %~popover, ~T, ~T, ~F )
◎
If popover's popover visibility state is showing, then run the hide popover algorithm given popover, true, true, and false.
</li>
	<li>
~ELIF［
%可視性~状態 ~EQ `隠している$i
］~AND［
`~popoverの妥当性を検査する$( %~popover, `隠している$i, ~F, ~NULL ) ~EQ ~T
］
⇒
`~popoverを示す$( %~popover, ~F, %~node )
◎
Otherwise, if popover's popover visibility state is hidden and the result of running check popover validity given popover, false, false, and null is true, then run show popover given popover, false, and node.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popover~target要素@
を取得するときは、
所与の
( `~node$ %~node )
に対し，次の手続きを遂行する
— これは、［
`~HTML要素$ ／ ~NULL
］を返す：
◎
To get the popover target element given a Node node, perform the following steps. They return an HTML element or null.
</p>
<ol>
	<li>
<p>
~IF［
~OR↓
］…
</p>
		<ul>
			<li>
%~node は`~button$でない
</li>
			<li>
%~node は`不能化されて$feいる
</li>
			<li>
［
%~node の`~form所有者$ ~NEQ ~NULL
］~AND［
%~node は`提出-~button$である
］
</li>
		</ul>
<p>
…ならば
⇒
~RET ~NULL
</p>
◎
If node is not a button, then return null.
◎
If node is disabled, then return null.
◎
If node has a form owner and node is a submit button, then return null.
</li>
	<li>
%~popover要素 ~LET %~node の "`popovertarget$a" に`結付けられた要素を取得する~algo$()
◎
Let popoverElement be the result of running node's get the popovertarget-associated element.
</li>
	<li>
~IF［
%~popover要素 ~EQ ~NULL
］
⇒
~RET ~NULL
◎
If popoverElement is null, then return null.
</li>
	<li>
~IF［
%~popover要素 は`~popover要素$でない
］
⇒
~RET ~NULL
◎
If popoverElement's popover attribute is in the no popover state, then return null.
</li>
	<li>
~RET %~popover要素
◎
Return popoverElement.
</li>
</ol>
</div>

			</section>
			<section id="popover-light-dismiss">
<h4 title="Popover light dismiss">6.12.2. ~popoverを軽く退ける</h4>

<p class="note">
“軽く退ける（ `light dismiss^en ）” とは、
次を意味する
⇒
`~popover要素$のうち［
その `popover$a 属性の状態 ~EQ `自動$st
］を満たすものに対し，当の~popoverの外側を~clickすると、
当の~popoverを閉じることになる。
このふるまいは、［
そのような~popoverが`閉-要請$に対しどう応答するか
］に対する追加である。
◎
"Light dismiss" means that clicking outside of a popover whose popover attribute is in the auto state will close the popover. This is in addition to how such popovers respond to close requests.
</p>

<div class="algo">
<p>
`開な~popoverたちを軽く退ける@
~algoは、
所与の
( `PointerEvent$I %~event )
に対し：
◎
To light dismiss open popovers, given a PointerEvent event:
</p>
<ol>
	<li>
~Assert：
%~event の `isTrusted$m 属性 ~EQ ~T
◎
Assert: event's isTrusted attribute is true.
</li>
	<li>
%~target ~LET %~event の`~target$
◎
Let target be event's target.
	<li>
~Assert：
%~target ~NEQ ~NULL
【この段は、この訳による補完。】
</li>
	<li>
%文書 ~LET %~target の`~node文書$
◎
Let document be target's node document.
</li>
	<li>
%最上層な~popover ~LET `最上層な自動または~hint~popoverを見出す$( %文書 )
◎
Let topmostPopover be the result of running topmost auto popover given document.
</li>
	<li>
~IF［
%最上層な~popover ~EQ ~NULL
］
⇒
~RET
◎
If topmostPopover is null, then return.
</li>
	<li>
~IF［
%~event の `type$m ~EQ "`pointerdown$et"
］
⇒
%文書 の`~popover~pointerdown~target$doc ~SET 
`最上層な~clickされた~popoverを見出す$( %~target )
◎
If event's type is "pointerdown", then: set document's popover pointerdown target to the result of running topmost clicked popover given target.
</li>
	<li>
<p>
~ELIF［
%~event の `type$m ~EQ "`pointerup$et"
］：
◎
If event's type is "pointerup", then:
</p>
		<ol>
			<li>
%先祖 ~LET `最上層な~clickされた~popoverを見出す$( %~target )
◎
Let ancestor be the result of running topmost clicked popover given target.
</li>
			<li>
%同じ~targetか ~LET ~IS［
%先祖 ~EQ %文書 の`~popover~pointerdown~target$doc
］
◎
Let sameTarget be true if ancestor is document's popover pointerdown target.
</li>
			<li>
%文書 の`~popover~pointerdown~target$doc ~SET ~NULL
◎
Set document's popover pointerdown target to null.
</li>
			<li>
~IF［
%先祖 ~EQ ~NULL
］
⇒
%先祖 ~SET %文書
◎
If ancestor is null, then set ancestor to document.
</li>
			<li>
~IF［
%同じ~targetか ~EQ ~T
］
⇒
`ある所までの~popoverをすべて隠す$( %先祖, ~F, ~T )
◎
If sameTarget is true, then run hide all popovers until given ancestor, false, and true.
</li>
		</ol>
	</li>
</ol>
</div>

<div class="algo">
<p>
`最上層な~clickされた~popoverを見出す@
~algoは、
所与の
( `~node$ %~node )
に対し：
◎
To find the topmost clicked popover, given a Node node:
</p>
<ol>
	<li>
%~clickされた~popover ~LET `広義-先祖のうち最も近い開な~popoverを見出す$( %~node )
◎
Let clickedPopover be the result of running nearest inclusive open popover given node.
</li>
	<li>
%呼出元~popover ~LET `呼出元~用の最も近い広義-~target~popoverを見出す$( %~node )
◎
Let invokerPopover be the result of running nearest inclusive target popover for invoker given node.
</li>
	<li>
~IF［
`~popover~stack位置を取得する$( %~clickされた~popover ) ~GT `~popover~stack位置を取得する$( %呼出元~popover )
］
⇒
~RET %~clickされた~popover
◎
If the result of getting the popover stack position given clickedPopover is greater than the result of getting the popover stack position given invokerPopover, then return clickedPopover.
</li>
	<li>
~RET %呼出元~popover
◎
Return invokerPopover.
</li>
</ol>
</div>

<div class="algo">
<p>
`~popover~stack位置を取得する@
~algoは、
所与の
( `~HTML要素$ %~popover )
に対し：
◎
To get the popover stack position, given an HTML element popover:
</p>
<ol>
	<li>
%~hint~list ~LET `文書が示している~popover~listを取得する$( %~popover の`~node文書$, `hint^l )
◎
Let hintList be popover's node document's showing hint popover list.
</li>
	<li>
%自動~list ~LET `文書が示している~popover~listを取得する$( %~popover の`~node文書$, `auto^l )
◎
Let autoList be popover's node document's showing auto popover list.
</li>
	<li>
範囲 { 0 〜 %~hint~list の`~size$ ~MINUS 1 } を成す
~EACH( %~index )
に対し
⇒
~IF［
%~popover ~EQ %~hint~list[ %~index ]
］
⇒
~RET %自動~list の`~size$ ~PLUS %~index ~PLUS 1
◎
If popover is in hintList, then return the index of popover in hintList + the size of autoList + 1.
</li>
	<li>
範囲 { 0 〜 %自動~list の`~size$ ~MINUS 1 } を成す
~EACH( %~index )
に対し
⇒
~IF［
%~popover ~EQ %自動~list[ %~index ]
］
⇒
~RET %~index ~PLUS 1
◎
If popover is in autoList, then return the index of popover in autoList + 1.
</li>
	<li>
~RET 0
◎
Return 0.
</li>
</ol>
</div>

<div class="algo">
<p>
`呼出元~用の最も近い広義-~target~popoverを見出す@
~algoは、
所与の
( `~node$ %~node )
に対し：
◎
To find the nearest inclusive target popover for invoker given a Node node:
•↓ Let currentNode be node.
</p>
<ol>
	<li>
<p>
~WHILE［
%~node ~NEQ ~NULL
］：
◎
While currentNode is not null:
</p>
		<ol>
			<li>
%~target~popover ~LET %~node の`~popover~target要素$
◎
Let targetPopover be currentNode's popover target element.
</li>
			<li>
~IF［
%~target~popover ~NEQ ~NULL
］~AND［
%~target~popover の `popover$a 属性の状態 ~EQ `自動$st
］~AND［
%~target~popover の`~popover可視性~状態$ ~EQ `示している$i
］
⇒
~RET %~target~popover
◎
If targetPopover is not null and targetPopover's popover attribute is in the auto state and targetPopover's popover visibility state is showing, then return targetPopover.
</li>
			<li>
%~node ~SET `平坦~tree$における %~node の先祖
【どの先祖？ “親” の誤記？】
◎
Set currentNode to currentNode's ancestor in the flat tree.
</li>
		</ol>
	</li>
</ol>
</div>

			</section>
</main>