Skip to content

Commit 141fedf

Browse files
committed
[css-shadow-parts-1] Remove theme from spec
1 parent 2fc0d92 commit 141fedf

File tree

1 file changed

+13
-72
lines changed

1 file changed

+13
-72
lines changed

css-shadow-parts-1/Overview.bs

+13-72
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Work Status: exploring
88
URL: http://drafts.csswg.org/css-shadow-parts/
99
Editor: Tab Atkins-Bittner, Google, http://xanthir.com/contact/, w3cid 42199
1010
Editor: Fergal Daly, Google, fergal@chromium.org
11-
Abstract: This specification defines the ''::part()'' and ''::theme()'' pseudo-elements on <a>shadow hosts</a>, allowing <a>shadow hosts</a> to selectively expose chosen elements from their <a>shadow tree</a> to the outside page for styling purposes.
11+
Abstract: This specification defines the ''::part()'' pseudo-element on <a>shadow hosts</a>, allowing <a>shadow hosts</a> to selectively expose chosen elements from their <a>shadow tree</a> to the outside page for styling purposes.
1212
</pre>
1313

1414
<pre class=link-defaults>
@@ -32,8 +32,8 @@ accidentally over-applying and making a different part of the page look wrong.
3232
However, this styling barrier also makes it harder for a page to interact with its components
3333
when it actually <em>wants</em> to do so.
3434

35-
This specification defines the ''::part()'' and ''::theme()'' pseudo-elements,
36-
which allow an author to style specific, purposely exposed elements in a <a>shadow tree</a>
35+
This specification defines the ''::part()'' pseudo-element,
36+
which allows an author to style specific, purposely exposed elements in a <a>shadow tree</a>
3737
from the outside page's context.
3838
In combination with <a>custom properties</a>,
3939
which let the outside page pass particular values
@@ -95,25 +95,14 @@ and component users,
9595
should have much better performance,
9696
and allows for better encapsulation/API surface.
9797

98-
Another interesting facet of using <a>custom properties</a>,
99-
however,
100-
is that inheritance doesn't stop at the first shadow tree.
101-
Unless explicitly blocked,
102-
a <a>custom property</a> inherits down thru nested trees,
103-
allowing authors to style deeply nested components
104-
as easily as they style directly-visible ones.
105-
The same considerations apply to this case,
106-
so we introduce ''::theme()'' to handle this.
107-
108-
It's important to note that ''::part()'' and ''::theme()''
109-
offer <em>absolutely zero new theoretical power</em>.
110-
They are not a rehash of the ''>>>'' combinator,
111-
they're simply a more convenient and consistent syntax
98+
It's important to note that ''::part()''
99+
offers <em>absolutely zero new theoretical power</em>.
100+
It is not a rehash of the ''>>>'' combinator,
101+
it is simply a more convenient and consistent syntax
112102
for something authors can already do with <a>custom properties</a>.
113103
By separating out the explicitly "published" parts of an element
114-
(the <a>shadow part map</a>)
115-
from the sub-parts that it merely happens to contain
116-
(the <a>computed shadow theme map</a>),
104+
(the <a>shadow part map</a>
105+
from the sub-parts that it merely happens to contain,
117106
it also helps with encapsulation,
118107
as authors can use ''::part()'' without fear of accidental over-styling.
119108

@@ -259,45 +248,15 @@ Consider a mechanism to exclude sub-parts without forwarding them.
259248
&lt;/script&gt;
260249
</pre>
261250

262-
Exposing More Widely: the <{html-global/theme}> attribute {#theme-attr}
263-
-----------------------------------------------------------------------
264-
265-
Issue: The theme section is intentionally a rough sketch at the moment.
266-
The functionality of theme can be achieved with part alone
267-
however it may be tedious to explicitly export parts as a theme.
268-
The need for theme will be better understood once part is in use.
269-
270-
271-
In addition to the [=shadow part map=],
272-
every [=shadow root=] has a <dfn export for="shadow root">partial shadow theme map</dfn>
273-
and a <dfn export for="shadow root">computed shadow theme map</dfn>
274-
both of which are [=ordered maps=]
275-
(with the same key/value shape as the [=shadow part map=]),
276-
and the elements in the [=shadow tree=]
277-
have a corresponding <dfn element-attr for=html-global>theme</dfn> attribute.
278-
279-
The <{html-global/theme}> attribute is parsed and interpreted identically to the <{html-global/part}> attribute,
280-
except that it adds its entries to the [=shadow root’s=] [=partial shadow theme map=] instead.
281-
282-
If the [=shadow root’s=] {{ShadowRoot/mode}} is {{ShadowRootMode/"closed"}},
283-
the [=computed shadow theme map=] is identical to the [=partial shadow theme map=].
284-
Otherwise,
285-
it's the union of the [=partial shadow theme map=]
286-
with the [=computed shadow theme maps=] of every [=shadow host’s=] [=shadow root=] in its [=shadow tree=].
287-
288-
Issue(w3c/csswg-drafts#2381): Decide if theme can ever/always penetrate closed shadow roots.
289-
290-
Selecting a Shadow Element: the ''::part()'' and ''::theme()'' pseudo-elements {#part-theme}
251+
Selecting a Shadow Element: the ''::part()'' pseudo-element {#part}
291252
============================================================================================
292253

293-
The <dfn selector>::part()</dfn> and <dfn selector>::theme()</dfn> pseudo-elements
294-
(collectively, the <dfn export>shadow-part pseudo-elements</dfn>)
295-
allow you to select elements that have been exposed via a <{html-global/part}> attribute.
296-
The syntaxes of them are:
254+
The <dfn selector>::part()</dfn> pseudo-element
255+
allows you to select elements that have been exposed via a <{html-global/part}> attribute.
256+
The syntax is:
297257

298258
<pre class=prod>
299259
::part() = ::part( <<ident>> )
300-
::theme() = ::theme( <<ident>> )
301260
</pre>
302261

303262
The ''::part()'' pseudo-element only matches anything
@@ -316,20 +275,6 @@ Otherwise, it matches nothing.
316275
''#the-button::part(label)''.
317276
</div>
318277

319-
The ''::theme()'' pseudo-element is similar,
320-
except it can match regardless of whether the <a>originating element</a>
321-
is a <a>shadow host</a> or not.
322-
It matches the elements keyed to the specified <<ident>>
323-
in the <a>computed shadow theme map</a> of the <a>shadow trees</a>
324-
of the <a>originating element</a> or any descendants.
325-
326-
<div class="example">
327-
For example,
328-
'':root::theme(label)'' matches any element with <code>part="label"</code>
329-
anywhere in the entire document,
330-
no matter how deeply nested into shadow trees they are.
331-
</div>
332-
333278
The <a>shadow-part pseudo-elements</a> can take additional pseudo-classes after them,
334279
such as ''x-button::part(label):hover'',
335280
but never match the <a>structural pseudo-classes</a>
@@ -347,10 +292,6 @@ but never match additional <a>shadow-part pseudo-elements</a>.
347292
This is because doing so would expose more structural information
348293
than is intended.
349294

350-
One can still target the nested label with a selector like
351-
''x-panel::theme(label)''.
352-
However, this will also select the labels of any other buttons in the panel.
353-
354295
If the <code>&lt;x-panel></code>'s internal confirm button had used something like
355296
<code>part="confirm-button, * => confirm-*"</code>
356297
to forward the button's internal parts up into the panel's own <a>part element map</a>,

0 commit comments

Comments
 (0)