@threadlabs/looma 0.23.9 → 0.23.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ui-combobox/ui-combobox.html +6 -0
- package/components/ui-combobox/ui-combobox.js +17 -1
- package/components/ui-disclosure/ui-disclosure.html +2 -4
- package/components/ui-tree/ui-tree.html +4 -0
- package/components/ui-tree/ui-tree.js +32 -6
- package/components/ui-tree-item/ui-tree-item.html +21 -8
- package/components/ui-tree-item/ui-tree-item.js +3 -0
- package/dist/index.js +1 -1
- package/package.json +1 -1
- package/styles/ui-disclosure.css +0 -3
- package/styles/ui-tree-item.css +12 -4
- package/vanilla/UiCombobox.d.ts +2 -0
- package/vanilla/UiCombobox.js +1 -1
- package/vanilla/UiTree.d.ts +1 -0
- package/vanilla/UiTree.js +1 -1
- package/vanilla/UiTreeItem.js +25 -15
- package/vue/UiCombobox.d.ts +18 -0
- package/vue/UiCombobox.vue +39 -0
- package/vue/UiDisclosure.vue +1 -5
- package/vue/UiTree.d.ts +9 -0
- package/vue/UiTree.vue +31 -1
- package/vue/UiTreeItem.d.ts +3 -3
- package/vue/UiTreeItem.vue +55 -8
- package/vue/chunks/UiCombobox.js +46 -1
- package/vue/chunks/UiDisclosure.js +2 -2
- package/vue/chunks/UiTree.js +24 -1
- package/vue/chunks/UiTreeItem.js +39 -8
- package/vue/components.css +181 -178
package/vue/components.css
CHANGED
|
@@ -1800,7 +1800,7 @@ input[data-v-cb5d05aa]:focus-visible {
|
|
|
1800
1800
|
syntax: "*";
|
|
1801
1801
|
inherits: false;
|
|
1802
1802
|
}
|
|
1803
|
-
[data-component~="ui-combobox"][data-v-
|
|
1803
|
+
[data-component~="ui-combobox"][data-v-8e9a00eb] {
|
|
1804
1804
|
/* Hooks do not inherit, so the parts below read them from the root. */
|
|
1805
1805
|
--_ui-combobox-label-text: var(--ui-combobox-label-text);
|
|
1806
1806
|
--_ui-combobox-label-font-size: var(--ui-combobox-label-font-size);
|
|
@@ -1825,20 +1825,20 @@ input[data-v-cb5d05aa]:focus-visible {
|
|
|
1825
1825
|
color: var(--ui-text-primary);
|
|
1826
1826
|
font: inherit;
|
|
1827
1827
|
}
|
|
1828
|
-
label[data-v-
|
|
1828
|
+
label[data-v-8e9a00eb] {
|
|
1829
1829
|
color: var(--_ui-combobox-label-text, var(--ui-text-primary));
|
|
1830
1830
|
font-size: var(--_ui-combobox-label-font-size, var(--ui-font-size-sm));
|
|
1831
1831
|
font-weight: 500;
|
|
1832
1832
|
}
|
|
1833
1833
|
/* The field and anything that annotates it sit on one row; the help button is beside the box,
|
|
1834
1834
|
not inside it, because a control's box holds its value. */
|
|
1835
|
-
.control[data-v-
|
|
1835
|
+
.control[data-v-8e9a00eb] {
|
|
1836
1836
|
display: flex;
|
|
1837
1837
|
align-items: center;
|
|
1838
1838
|
gap: var(--ui-space-2);
|
|
1839
1839
|
min-inline-size: 0;
|
|
1840
1840
|
}
|
|
1841
|
-
.field[data-v-
|
|
1841
|
+
.field[data-v-8e9a00eb] {
|
|
1842
1842
|
flex: 1 1 auto;
|
|
1843
1843
|
display: flex;
|
|
1844
1844
|
min-inline-size: 0;
|
|
@@ -1850,19 +1850,19 @@ label[data-v-a593ab08] {
|
|
|
1850
1850
|
border-color var(--ui-motion-fast) var(--ui-motion-ease),
|
|
1851
1851
|
box-shadow var(--ui-motion-fast) var(--ui-motion-ease);
|
|
1852
1852
|
}
|
|
1853
|
-
.field[data-v-
|
|
1853
|
+
.field[data-v-8e9a00eb]:focus-within {
|
|
1854
1854
|
border-color: var(--ui-control-focus, var(--ui-accent-solid));
|
|
1855
1855
|
box-shadow:
|
|
1856
1856
|
var(--ui-control-inset),
|
|
1857
1857
|
var(--ui-control-focus-halo-shadow);
|
|
1858
1858
|
}
|
|
1859
|
-
.entry[data-v-
|
|
1859
|
+
.entry[data-v-8e9a00eb] {
|
|
1860
1860
|
display: flex;
|
|
1861
1861
|
flex: 1 1 auto;
|
|
1862
1862
|
min-inline-size: 0;
|
|
1863
1863
|
}
|
|
1864
1864
|
/* A ghost icon button: the affordance is the mark, not a box around it. */
|
|
1865
|
-
.help[data-v-
|
|
1865
|
+
.help[data-v-8e9a00eb] {
|
|
1866
1866
|
flex: none;
|
|
1867
1867
|
display: inline-flex;
|
|
1868
1868
|
align-items: center;
|
|
@@ -1879,28 +1879,28 @@ label[data-v-a593ab08] {
|
|
|
1879
1879
|
background-color var(--ui-motion-fast) var(--ui-motion-ease),
|
|
1880
1880
|
color var(--ui-motion-fast) var(--ui-motion-ease);
|
|
1881
1881
|
}
|
|
1882
|
-
.help[data-v-
|
|
1883
|
-
.help[aria-expanded="true"][data-v-
|
|
1882
|
+
.help[data-v-8e9a00eb]:hover:enabled,
|
|
1883
|
+
.help[aria-expanded="true"][data-v-8e9a00eb] {
|
|
1884
1884
|
background: color-mix(in srgb, currentColor 8%, transparent);
|
|
1885
1885
|
color: var(--ui-text-primary);
|
|
1886
1886
|
}
|
|
1887
|
-
.help[data-v-
|
|
1887
|
+
.help[data-v-8e9a00eb]:focus-visible {
|
|
1888
1888
|
outline: none;
|
|
1889
1889
|
box-shadow: var(--ui-focus-halo);
|
|
1890
1890
|
}
|
|
1891
|
-
.help[data-v-
|
|
1891
|
+
.help[data-v-8e9a00eb]:disabled {
|
|
1892
1892
|
color: var(--ui-disabled-text);
|
|
1893
1893
|
cursor: not-allowed;
|
|
1894
1894
|
}
|
|
1895
|
-
.help-icon[data-v-
|
|
1895
|
+
.help-icon[data-v-8e9a00eb] {
|
|
1896
1896
|
inline-size: var(--ui-icon-size-sm);
|
|
1897
1897
|
block-size: var(--ui-icon-size-sm);
|
|
1898
1898
|
}
|
|
1899
|
-
input[data-v-
|
|
1899
|
+
input[data-v-8e9a00eb]::selection {
|
|
1900
1900
|
background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);
|
|
1901
1901
|
color: inherit;
|
|
1902
1902
|
}
|
|
1903
|
-
input[data-v-
|
|
1903
|
+
input[data-v-8e9a00eb] {
|
|
1904
1904
|
appearance: none;
|
|
1905
1905
|
width: 100%;
|
|
1906
1906
|
min-inline-size: 0;
|
|
@@ -1916,20 +1916,20 @@ input[data-v-a593ab08] {
|
|
|
1916
1916
|
margin: 0;
|
|
1917
1917
|
outline: none;
|
|
1918
1918
|
}
|
|
1919
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"][data-v-
|
|
1919
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"][data-v-8e9a00eb] {
|
|
1920
1920
|
--_row: var(--ui-control-size-sm);
|
|
1921
1921
|
}
|
|
1922
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"] input[data-v-
|
|
1922
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"] input[data-v-8e9a00eb] {
|
|
1923
1923
|
min-block-size: calc(var(--_row) - 2px);
|
|
1924
1924
|
padding: var(--ui-space-1) var(--ui-space-2);
|
|
1925
1925
|
font-size: var(--ui-font-size-sm);
|
|
1926
1926
|
}
|
|
1927
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="size=lg"] input[data-v-
|
|
1927
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="size=lg"] input[data-v-8e9a00eb] {
|
|
1928
1928
|
min-block-size: calc(var(--ui-control-size-lg) - 2px);
|
|
1929
1929
|
padding: var(--ui-space-3) var(--ui-space-4);
|
|
1930
1930
|
font-size: var(--ui-font-size-md);
|
|
1931
1931
|
}
|
|
1932
|
-
button[data-v-
|
|
1932
|
+
button[data-v-8e9a00eb] {
|
|
1933
1933
|
appearance: none;
|
|
1934
1934
|
display: inline-grid;
|
|
1935
1935
|
place-items: center;
|
|
@@ -1944,36 +1944,36 @@ button[data-v-a593ab08] {
|
|
|
1944
1944
|
padding: 0 var(--ui-space-1);
|
|
1945
1945
|
cursor: pointer;
|
|
1946
1946
|
}
|
|
1947
|
-
.affordance-icon[data-v-
|
|
1947
|
+
.affordance-icon[data-v-8e9a00eb] {
|
|
1948
1948
|
display: block;
|
|
1949
1949
|
inline-size: var(--ui-icon-size-sm);
|
|
1950
1950
|
block-size: var(--ui-icon-size-sm);
|
|
1951
1951
|
}
|
|
1952
|
-
button[data-v-
|
|
1952
|
+
button[data-v-8e9a00eb]:hover:enabled {
|
|
1953
1953
|
background: var(--ui-surface-muted);
|
|
1954
1954
|
color: var(--ui-text-primary);
|
|
1955
1955
|
}
|
|
1956
|
-
button[data-v-
|
|
1956
|
+
button[data-v-8e9a00eb]:focus-visible {
|
|
1957
1957
|
outline: none;
|
|
1958
1958
|
background: var(--ui-surface-muted);
|
|
1959
1959
|
box-shadow: inset 0 0 0 var(--ui-focus-width)
|
|
1960
1960
|
color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);
|
|
1961
1961
|
}
|
|
1962
|
-
input[data-v-
|
|
1962
|
+
input[data-v-8e9a00eb]:disabled, button[data-v-8e9a00eb]:disabled {
|
|
1963
1963
|
color: var(--ui-disabled-text);
|
|
1964
1964
|
cursor: not-allowed;
|
|
1965
1965
|
}
|
|
1966
|
-
.field[data-v-
|
|
1966
|
+
.field[data-v-8e9a00eb]:has(input:disabled) {
|
|
1967
1967
|
background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
|
|
1968
1968
|
}
|
|
1969
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="validationStatus=error"] .field[data-v-
|
|
1970
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="invalid"] .field[data-v-
|
|
1969
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="validationStatus=error"] .field[data-v-8e9a00eb],
|
|
1970
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="invalid"] .field[data-v-8e9a00eb] {
|
|
1971
1971
|
border-color: var(
|
|
1972
1972
|
--_ui-combobox-invalid-border,
|
|
1973
1973
|
var(--ui-field-danger, var(--ui-danger-solid, var(--ui-accent-active)))
|
|
1974
1974
|
);
|
|
1975
1975
|
}
|
|
1976
|
-
.popup[data-v-
|
|
1976
|
+
.popup[data-v-8e9a00eb] {
|
|
1977
1977
|
box-sizing: border-box;
|
|
1978
1978
|
min-inline-size: 12rem;
|
|
1979
1979
|
max-inline-size: calc(100vw - 1rem);
|
|
@@ -1994,46 +1994,46 @@ input[data-v-a593ab08]:disabled, button[data-v-a593ab08]:disabled {
|
|
|
1994
1994
|
var(--ui-overlay-shadow, var(--ui-elevation-overlay, var(--ui-shadow-lg)))
|
|
1995
1995
|
);
|
|
1996
1996
|
}
|
|
1997
|
-
[hidden][data-v-
|
|
1997
|
+
[hidden][data-v-8e9a00eb] {
|
|
1998
1998
|
display: none;
|
|
1999
1999
|
}
|
|
2000
|
-
.option[aria-disabled="true"] .primary[data-v-
|
|
2001
|
-
.option[aria-disabled="true"] .secondary[data-v-
|
|
2000
|
+
.option[aria-disabled="true"] .primary[data-v-8e9a00eb],
|
|
2001
|
+
.option[aria-disabled="true"] .secondary[data-v-8e9a00eb] {
|
|
2002
2002
|
color: var(--ui-disabled-text);
|
|
2003
2003
|
}
|
|
2004
|
-
.primary[data-v-
|
|
2004
|
+
.primary[data-v-8e9a00eb] {
|
|
2005
2005
|
display: block;
|
|
2006
2006
|
color: var(--_ui-combobox-option-text, inherit);
|
|
2007
2007
|
font-weight: 500;
|
|
2008
2008
|
}
|
|
2009
2009
|
/* A row with a tag or a description: the label and its tag on one line, the description under them. */
|
|
2010
|
-
.detail[data-v-
|
|
2010
|
+
.detail[data-v-8e9a00eb] {
|
|
2011
2011
|
display: grid;
|
|
2012
2012
|
gap: var(--ui-space-0-5);
|
|
2013
2013
|
min-inline-size: 0;
|
|
2014
2014
|
}
|
|
2015
|
-
.line[data-v-
|
|
2015
|
+
.line[data-v-8e9a00eb] {
|
|
2016
2016
|
display: flex;
|
|
2017
2017
|
flex-wrap: wrap;
|
|
2018
2018
|
align-items: center;
|
|
2019
2019
|
gap: var(--ui-space-2);
|
|
2020
2020
|
}
|
|
2021
|
-
.description[data-v-
|
|
2021
|
+
.description[data-v-8e9a00eb] {
|
|
2022
2022
|
color: var(--ui-text-muted);
|
|
2023
2023
|
font-size: var(--ui-font-size-sm);
|
|
2024
2024
|
line-height: var(--ui-line-height-md);
|
|
2025
2025
|
}
|
|
2026
|
-
.message[data-v-
|
|
2026
|
+
.message[data-v-8e9a00eb], .group[data-v-8e9a00eb] {
|
|
2027
2027
|
color: var(--_ui-combobox-message-text, var(--ui-text-secondary));
|
|
2028
2028
|
font-weight: 400;
|
|
2029
2029
|
font-size: var(--ui-font-size-sm);
|
|
2030
2030
|
line-height: var(--ui-line-height-md);
|
|
2031
2031
|
overflow-wrap: anywhere;
|
|
2032
2032
|
}
|
|
2033
|
-
.group[data-v-
|
|
2033
|
+
.group[data-v-8e9a00eb], .popup .message[data-v-8e9a00eb] {
|
|
2034
2034
|
padding: var(--ui-space-2) var(--ui-space-3);
|
|
2035
2035
|
}
|
|
2036
|
-
.sr-only[data-v-
|
|
2036
|
+
.sr-only[data-v-8e9a00eb] {
|
|
2037
2037
|
position: absolute;
|
|
2038
2038
|
inline-size: 1px;
|
|
2039
2039
|
block-size: 1px;
|
|
@@ -2042,45 +2042,45 @@ input[data-v-a593ab08]:disabled, button[data-v-a593ab08]:disabled {
|
|
|
2042
2042
|
white-space: nowrap;
|
|
2043
2043
|
}
|
|
2044
2044
|
@media (pointer: coarse) {
|
|
2045
|
-
button[data-v-
|
|
2045
|
+
button[data-v-8e9a00eb] {
|
|
2046
2046
|
min-inline-size: 2.75rem;
|
|
2047
2047
|
min-block-size: 2.75rem;
|
|
2048
2048
|
}
|
|
2049
2049
|
/* Under touch a small field is still a touch-sized target, as a small button is, and keeps
|
|
2050
2050
|
body-size text: below 16px, iOS zooms the page into the focused field. */
|
|
2051
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"][data-v-
|
|
2051
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"][data-v-8e9a00eb] {
|
|
2052
2052
|
--_row: var(--ui-control-min-block-size);
|
|
2053
2053
|
}
|
|
2054
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"] input[data-v-
|
|
2054
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"] input[data-v-8e9a00eb] {
|
|
2055
2055
|
font-size: inherit;
|
|
2056
2056
|
}
|
|
2057
2057
|
}
|
|
2058
2058
|
@media (forced-colors: active) {
|
|
2059
|
-
.field[data-v-
|
|
2059
|
+
.field[data-v-8e9a00eb], .popup[data-v-8e9a00eb] {
|
|
2060
2060
|
border-color: CanvasText;
|
|
2061
2061
|
}
|
|
2062
|
-
.option.active[data-v-
|
|
2062
|
+
.option.active[data-v-8e9a00eb] {
|
|
2063
2063
|
outline-color: Highlight;
|
|
2064
2064
|
}
|
|
2065
2065
|
}
|
|
2066
2066
|
|
|
2067
2067
|
/* Multiple mode keeps one control height. Chips and the input scroll within the entry,
|
|
2068
2068
|
while the clear and disclosure controls remain fixed at the end of the field. */
|
|
2069
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .field[data-v-
|
|
2069
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .field[data-v-8e9a00eb] {
|
|
2070
2070
|
align-items: center;
|
|
2071
2071
|
min-block-size: var(--_ui-combobox-item-min-block-size, 2.5rem);
|
|
2072
2072
|
padding: var(--ui-space-1);
|
|
2073
2073
|
}
|
|
2074
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .entry[data-v-
|
|
2074
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .entry[data-v-8e9a00eb] {
|
|
2075
2075
|
align-items: center;
|
|
2076
2076
|
gap: var(--ui-space-1);
|
|
2077
2077
|
overflow-x: auto;
|
|
2078
2078
|
scrollbar-width: none;
|
|
2079
2079
|
}
|
|
2080
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .entry[data-v-
|
|
2080
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .entry[data-v-8e9a00eb]::-webkit-scrollbar {
|
|
2081
2081
|
display: none;
|
|
2082
2082
|
}
|
|
2083
|
-
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] input[data-v-
|
|
2083
|
+
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] input[data-v-8e9a00eb] {
|
|
2084
2084
|
flex: 1 0 var(--_ui-combobox-item-input-min-inline-size, 5rem);
|
|
2085
2085
|
width: auto;
|
|
2086
2086
|
min-block-size: 1.75rem;
|
|
@@ -2088,27 +2088,27 @@ button[data-v-a593ab08] {
|
|
|
2088
2088
|
}
|
|
2089
2089
|
/* Size variants keep their control height as selections are added. */
|
|
2090
2090
|
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"][data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"]
|
|
2091
|
-
.field[data-v-
|
|
2091
|
+
.field[data-v-8e9a00eb] {
|
|
2092
2092
|
min-block-size: 0;
|
|
2093
2093
|
padding: var(--ui-space-0-5);
|
|
2094
2094
|
}
|
|
2095
2095
|
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"][data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"]
|
|
2096
|
-
input[data-v-
|
|
2096
|
+
input[data-v-8e9a00eb] {
|
|
2097
2097
|
min-block-size: calc(var(--_row) - 2 * var(--ui-border-width) - 2 * var(--ui-space-0-5));
|
|
2098
2098
|
padding: 0 var(--ui-space-1);
|
|
2099
2099
|
}
|
|
2100
2100
|
/* A large multiple field starts at the large control height, as sm starts at the small one. */
|
|
2101
2101
|
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"][data-component~="ui-combobox"][data-ui-combobox-state~="size=lg"]
|
|
2102
|
-
.field[data-v-
|
|
2102
|
+
.field[data-v-8e9a00eb] {
|
|
2103
2103
|
min-block-size: 0;
|
|
2104
2104
|
}
|
|
2105
2105
|
[data-component~="ui-combobox"][data-ui-combobox-state~="multiple"][data-component~="ui-combobox"][data-ui-combobox-state~="size=lg"]
|
|
2106
|
-
input[data-v-
|
|
2106
|
+
input[data-v-8e9a00eb] {
|
|
2107
2107
|
min-block-size: calc(
|
|
2108
2108
|
var(--ui-control-size-lg) - 2 * var(--ui-border-width) - 2 * var(--ui-space-1)
|
|
2109
2109
|
);
|
|
2110
2110
|
}
|
|
2111
|
-
.item[data-v-
|
|
2111
|
+
.item[data-v-8e9a00eb] {
|
|
2112
2112
|
appearance: none;
|
|
2113
2113
|
display: inline-flex;
|
|
2114
2114
|
flex: none;
|
|
@@ -2123,16 +2123,16 @@ button[data-v-a593ab08] {
|
|
|
2123
2123
|
font: inherit;
|
|
2124
2124
|
cursor: default;
|
|
2125
2125
|
}
|
|
2126
|
-
.item[data-v-
|
|
2126
|
+
.item[data-v-8e9a00eb]:focus-visible {
|
|
2127
2127
|
outline: var(--ui-focus-width) solid var(--ui-focus-ring);
|
|
2128
2128
|
outline-offset: var(--ui-border-width);
|
|
2129
2129
|
}
|
|
2130
|
-
.item[data-v-
|
|
2130
|
+
.item[data-v-8e9a00eb]:disabled {
|
|
2131
2131
|
color: var(--ui-disabled-text);
|
|
2132
2132
|
}
|
|
2133
2133
|
|
|
2134
2134
|
/* A component that sets its display still honours the hidden attribute on its root. */
|
|
2135
|
-
[data-component~="ui-combobox"][hidden][data-v-
|
|
2135
|
+
[data-component~="ui-combobox"][hidden][data-v-8e9a00eb] {
|
|
2136
2136
|
display: none;
|
|
2137
2137
|
}
|
|
2138
2138
|
|
|
@@ -2668,7 +2668,7 @@ from {
|
|
|
2668
2668
|
}
|
|
2669
2669
|
|
|
2670
2670
|
/* Density resolves into the summary row's own values; the public tokens still override them. */
|
|
2671
|
-
[data-component~="ui-disclosure"][data-v-
|
|
2671
|
+
[data-component~="ui-disclosure"][data-v-a6fee58b] {
|
|
2672
2672
|
/* Hooks do not inherit, so the parts below read them from the root. */
|
|
2673
2673
|
--_ui-disclosure-trigger-min-block-size: var(--ui-disclosure-trigger-min-block-size);
|
|
2674
2674
|
--_ui-disclosure-trigger-padding-block: var(--ui-disclosure-trigger-padding-block);
|
|
@@ -2678,7 +2678,7 @@ from {
|
|
|
2678
2678
|
--_trigger-padding-block: var(--ui-space-2);
|
|
2679
2679
|
--_trigger-padding-inline: var(--ui-space-3);
|
|
2680
2680
|
}
|
|
2681
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="density=compact"][data-v-
|
|
2681
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="density=compact"][data-v-a6fee58b] {
|
|
2682
2682
|
--_trigger-min-block-size: var(--ui-control-size-sm);
|
|
2683
2683
|
--_trigger-padding-block: var(--ui-space-1);
|
|
2684
2684
|
--_trigger-padding-inline: var(--ui-space-2);
|
|
@@ -2686,14 +2686,14 @@ from {
|
|
|
2686
2686
|
|
|
2687
2687
|
/* An accordion row, not a field: no enclosing box, just a divider, so it never reads as a
|
|
2688
2688
|
* select or combobox. Stacked disclosures share their dividers. */
|
|
2689
|
-
[data-component~="ui-disclosure"][data-v-
|
|
2689
|
+
[data-component~="ui-disclosure"][data-v-a6fee58b] {
|
|
2690
2690
|
display: block;
|
|
2691
2691
|
inline-size: 100%;
|
|
2692
2692
|
overflow: clip;
|
|
2693
2693
|
border-block-end: var(--ui-border-width) solid var(--ui-border-divider);
|
|
2694
2694
|
color: var(--ui-text-primary);
|
|
2695
2695
|
}
|
|
2696
|
-
.trigger[data-v-
|
|
2696
|
+
.trigger[data-v-a6fee58b] {
|
|
2697
2697
|
display: flex;
|
|
2698
2698
|
gap: var(--ui-space-3);
|
|
2699
2699
|
align-items: center;
|
|
@@ -2711,67 +2711,67 @@ from {
|
|
|
2711
2711
|
border-radius: var(--ui-radius-sm);
|
|
2712
2712
|
transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);
|
|
2713
2713
|
}
|
|
2714
|
-
.trigger[data-v-
|
|
2714
|
+
.trigger[data-v-a6fee58b]:hover:not(:disabled) {
|
|
2715
2715
|
background: color-mix(in srgb, currentColor 6%, transparent);
|
|
2716
2716
|
}
|
|
2717
|
-
.trigger[data-v-
|
|
2717
|
+
.trigger[data-v-a6fee58b]:focus-visible {
|
|
2718
2718
|
outline: none;
|
|
2719
2719
|
box-shadow: inset 0 0 0 var(--ui-focus-width)
|
|
2720
2720
|
color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);
|
|
2721
2721
|
}
|
|
2722
|
-
.trigger[data-v-
|
|
2722
|
+
.trigger[data-v-a6fee58b]:disabled {
|
|
2723
2723
|
color: var(--ui-disabled-text);
|
|
2724
2724
|
cursor: not-allowed;
|
|
2725
2725
|
}
|
|
2726
|
-
.summary[data-v-
|
|
2726
|
+
.summary[data-v-a6fee58b] {
|
|
2727
2727
|
flex: 1;
|
|
2728
2728
|
min-inline-size: 0;
|
|
2729
2729
|
}
|
|
2730
|
-
.leading[data-v-
|
|
2731
|
-
.indicator[data-v-
|
|
2730
|
+
.leading[data-v-a6fee58b],
|
|
2731
|
+
.indicator[data-v-a6fee58b] {
|
|
2732
2732
|
display: inline-flex;
|
|
2733
2733
|
align-items: center;
|
|
2734
2734
|
justify-content: center;
|
|
2735
2735
|
flex: none;
|
|
2736
2736
|
}
|
|
2737
|
-
.leading[data-v-
|
|
2737
|
+
.leading[data-v-a6fee58b]:empty {
|
|
2738
2738
|
display: none;
|
|
2739
2739
|
}
|
|
2740
|
-
.indicator[data-v-
|
|
2740
|
+
.indicator[data-v-a6fee58b] {
|
|
2741
2741
|
transition: transform var(--ui-motion-feedback) var(--ui-motion-feedback-ease);
|
|
2742
2742
|
}
|
|
2743
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .indicator[data-v-
|
|
2743
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .indicator[data-v-a6fee58b] {
|
|
2744
2744
|
transform: rotate(180deg);
|
|
2745
2745
|
}
|
|
2746
|
-
.chevron[data-v-
|
|
2746
|
+
.chevron[data-v-a6fee58b] {
|
|
2747
2747
|
inline-size: 0.5rem;
|
|
2748
2748
|
block-size: 0.5rem;
|
|
2749
2749
|
border-inline-end: 2px solid currentColor;
|
|
2750
2750
|
border-block-end: 2px solid currentColor;
|
|
2751
2751
|
transform: rotate(45deg) translate(-1px, -1px);
|
|
2752
2752
|
}
|
|
2753
|
-
.panel[data-v-
|
|
2753
|
+
.panel[data-v-a6fee58b] {
|
|
2754
2754
|
display: grid;
|
|
2755
2755
|
grid-template-rows: 0fr;
|
|
2756
2756
|
transition:
|
|
2757
2757
|
grid-template-rows var(--ui-motion-reveal) var(--ui-motion-reveal-ease),
|
|
2758
2758
|
content-visibility var(--ui-motion-reveal) allow-discrete;
|
|
2759
2759
|
}
|
|
2760
|
-
.panel-inner[data-v-
|
|
2760
|
+
.panel-inner[data-v-a6fee58b] {
|
|
2761
2761
|
min-block-size: 0;
|
|
2762
2762
|
overflow: hidden;
|
|
2763
2763
|
padding-inline: var(--ui-space-3);
|
|
2764
2764
|
}
|
|
2765
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel[data-v-
|
|
2765
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel[data-v-a6fee58b] {
|
|
2766
2766
|
grid-template-rows: 1fr;
|
|
2767
2767
|
}
|
|
2768
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel-inner[data-v-
|
|
2768
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel-inner[data-v-a6fee58b] {
|
|
2769
2769
|
padding-block: 0 var(--ui-space-3);
|
|
2770
2770
|
}
|
|
2771
2771
|
|
|
2772
2772
|
/* A bounded accordion owns one flexible body, so its trigger never scrolls away. The
|
|
2773
2773
|
* normal content-sized layout and its animation remain unchanged when fill is omitted. */
|
|
2774
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"][data-v-
|
|
2774
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"][data-v-a6fee58b] {
|
|
2775
2775
|
display: flex;
|
|
2776
2776
|
flex-direction: column;
|
|
2777
2777
|
flex: 0 0 var(--_ui-disclosure-heading-size, var(--_trigger-min-block-size));
|
|
@@ -2782,27 +2782,27 @@ from {
|
|
|
2782
2782
|
border-block-end: 0;
|
|
2783
2783
|
border-block-start: var(--ui-border-width) solid var(--ui-border-divider);
|
|
2784
2784
|
}
|
|
2785
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"][data-ui-disclosure-state~="internalOpen"][data-v-
|
|
2785
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"][data-ui-disclosure-state~="internalOpen"][data-v-a6fee58b] {
|
|
2786
2786
|
flex-grow: 1;
|
|
2787
2787
|
}
|
|
2788
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .heading[data-v-
|
|
2788
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .heading[data-v-a6fee58b] {
|
|
2789
2789
|
flex: none;
|
|
2790
2790
|
}
|
|
2791
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .trigger[data-v-
|
|
2791
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .trigger[data-v-a6fee58b] {
|
|
2792
2792
|
border-radius: 0;
|
|
2793
2793
|
}
|
|
2794
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .panel[data-v-
|
|
2794
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .panel[data-v-a6fee58b] {
|
|
2795
2795
|
flex: 1;
|
|
2796
2796
|
min-block-size: 0;
|
|
2797
2797
|
}
|
|
2798
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .panel-inner[data-v-
|
|
2798
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"] .panel-inner[data-v-a6fee58b] {
|
|
2799
2799
|
display: flex;
|
|
2800
2800
|
flex-direction: column;
|
|
2801
2801
|
flex: 1;
|
|
2802
2802
|
min-block-size: 0;
|
|
2803
2803
|
padding: 0;
|
|
2804
2804
|
}
|
|
2805
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"] .trigger[data-v-
|
|
2805
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"] .trigger[data-v-a6fee58b] {
|
|
2806
2806
|
gap: var(--ui-nav-gap);
|
|
2807
2807
|
padding-inline: var(--ui-nav-padding-inline);
|
|
2808
2808
|
min-block-size: var(--ui-nav-min-block-size);
|
|
@@ -2813,42 +2813,38 @@ from {
|
|
|
2813
2813
|
color: var(--ui-text-secondary);
|
|
2814
2814
|
}
|
|
2815
2815
|
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"][data-ui-disclosure-state~="density=compact"]
|
|
2816
|
-
.trigger[data-v-
|
|
2816
|
+
.trigger[data-v-a6fee58b] {
|
|
2817
2817
|
padding-inline: var(--ui-nav-compact-padding-inline);
|
|
2818
2818
|
padding-block: var(--ui-nav-compact-padding-block);
|
|
2819
2819
|
min-block-size: var(--ui-nav-compact-min-block-size);
|
|
2820
2820
|
font-size: var(--ui-font-size-sm);
|
|
2821
2821
|
}
|
|
2822
2822
|
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"]
|
|
2823
|
-
.trigger[data-v-
|
|
2823
|
+
.trigger[data-v-a6fee58b]:hover:not(:disabled) {
|
|
2824
2824
|
background: var(--ui-nav-hover-surface);
|
|
2825
2825
|
color: var(--ui-text-primary);
|
|
2826
2826
|
}
|
|
2827
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"][data-
|
|
2828
|
-
.trigger[data-v-a0b99707] {
|
|
2829
|
-
color: var(--ui-selection-text);
|
|
2830
|
-
}
|
|
2831
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"][data-v-a0b99707]
|
|
2827
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"][data-v-a6fee58b]
|
|
2832
2828
|
:is(.leading, .indicator) {
|
|
2833
2829
|
inline-size: var(--ui-nav-icon-size);
|
|
2834
2830
|
font-size: var(--ui-nav-icon-size);
|
|
2835
2831
|
}
|
|
2836
2832
|
@media (pointer: coarse) {
|
|
2837
2833
|
[data-component~="ui-disclosure"][data-ui-disclosure-state~="variant=navigation"][data-ui-disclosure-state~="density=compact"]
|
|
2838
|
-
.trigger[data-v-
|
|
2834
|
+
.trigger[data-v-a6fee58b] {
|
|
2839
2835
|
min-block-size: var(--ui-control-min-block-size);
|
|
2840
2836
|
}
|
|
2841
2837
|
}
|
|
2842
2838
|
@media (prefers-reduced-motion: reduce) {
|
|
2843
|
-
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"][data-v-
|
|
2844
|
-
.panel[data-v-
|
|
2845
|
-
.indicator[data-v-
|
|
2839
|
+
[data-component~="ui-disclosure"][data-ui-disclosure-state~="fill"][data-v-a6fee58b],
|
|
2840
|
+
.panel[data-v-a6fee58b],
|
|
2841
|
+
.indicator[data-v-a6fee58b] {
|
|
2846
2842
|
transition: none;
|
|
2847
2843
|
}
|
|
2848
2844
|
}
|
|
2849
2845
|
|
|
2850
2846
|
/* A component that sets its display still honours the hidden attribute on its root. */
|
|
2851
|
-
[data-component~="ui-disclosure"][hidden][data-v-
|
|
2847
|
+
[data-component~="ui-disclosure"][hidden][data-v-a6fee58b] {
|
|
2852
2848
|
display: none;
|
|
2853
2849
|
}
|
|
2854
2850
|
|
|
@@ -8396,17 +8392,17 @@ to {
|
|
|
8396
8392
|
|
|
8397
8393
|
/* Reaches the items the way density does, so the setting lives on the tree the way a reader
|
|
8398
8394
|
thinks about it: this list scrolls its long names. */
|
|
8399
|
-
[data-component~="ui-tree"][data-ui-tree-state~="marquee"][data-v-
|
|
8395
|
+
[data-component~="ui-tree"][data-ui-tree-state~="marquee"][data-v-7845ed59] {
|
|
8400
8396
|
--_ui-default-tree-item-marquee: 1;
|
|
8401
8397
|
}
|
|
8402
8398
|
|
|
8403
8399
|
/* The items' defaults for this density: an item's own hook still wins. */
|
|
8404
|
-
[data-component~="ui-tree"][data-ui-tree-state~="density=compact"][data-v-
|
|
8400
|
+
[data-component~="ui-tree"][data-ui-tree-state~="density=compact"][data-v-7845ed59] {
|
|
8405
8401
|
--_ui-default-tree-item-min-block-size: var(--ui-control-size-sm);
|
|
8406
8402
|
--_ui-default-tree-item-font-size: var(--ui-font-size-sm);
|
|
8407
8403
|
--_ui-default-tree-item-label-padding-block: 0;
|
|
8408
8404
|
}
|
|
8409
|
-
[data-component~="ui-tree"][data-v-
|
|
8405
|
+
[data-component~="ui-tree"][data-v-7845ed59] {
|
|
8410
8406
|
/* Hooks do not inherit: the tree hands its own to its items here, and a tree nested in an item
|
|
8411
8407
|
starts again from its own settings. */
|
|
8412
8408
|
--_ui-tree-indent: var(--ui-tree-indent);
|
|
@@ -8419,7 +8415,7 @@ to {
|
|
|
8419
8415
|
min-inline-size: 0;
|
|
8420
8416
|
padding-inline-start: var(--ui-tree-gutter, 0px);
|
|
8421
8417
|
}
|
|
8422
|
-
[data-component~="ui-tree"][data-move-mode][data-v-
|
|
8418
|
+
[data-component~="ui-tree"][data-move-mode][data-v-7845ed59]::after {
|
|
8423
8419
|
content: "Choose a destination row, or use Up and Down; Right nests inside a branch. Enter places it, Escape cancels.";
|
|
8424
8420
|
display: block;
|
|
8425
8421
|
padding: var(--ui-space-2);
|
|
@@ -8428,7 +8424,7 @@ to {
|
|
|
8428
8424
|
}
|
|
8429
8425
|
|
|
8430
8426
|
/* A component that sets its display still honours the hidden attribute on its root. */
|
|
8431
|
-
[data-component~="ui-tree"][hidden][data-v-
|
|
8427
|
+
[data-component~="ui-tree"][hidden][data-v-7845ed59] {
|
|
8432
8428
|
display: none;
|
|
8433
8429
|
}
|
|
8434
8430
|
|
|
@@ -8453,7 +8449,7 @@ to {
|
|
|
8453
8449
|
syntax: "*";
|
|
8454
8450
|
inherits: false;
|
|
8455
8451
|
}
|
|
8456
|
-
[data-component~="ui-tree-item"][data-v-
|
|
8452
|
+
[data-component~="ui-tree-item"][data-v-d2b1bbe0] {
|
|
8457
8453
|
/* Hooks do not inherit, so the parts below read them from the root. The tree's density
|
|
8458
8454
|
sets the defaults, in --_ui-default-*. */
|
|
8459
8455
|
--_ui-tree-item-min-block-size: var(
|
|
@@ -8475,7 +8471,7 @@ to {
|
|
|
8475
8471
|
min-inline-size: 0;
|
|
8476
8472
|
margin-inline-start: calc(var(--_ui-tree-item-indent-step, 0) * var(--_ui-tree-indent, 16px));
|
|
8477
8473
|
}
|
|
8478
|
-
.row[data-v-
|
|
8474
|
+
.row[data-v-d2b1bbe0] {
|
|
8479
8475
|
position: relative;
|
|
8480
8476
|
display: grid;
|
|
8481
8477
|
grid-template-columns: var(--_tree-disclosure-size) auto minmax(0, 1fr);
|
|
@@ -8492,50 +8488,54 @@ to {
|
|
|
8492
8488
|
box-shadow var(--ui-motion-fast) var(--ui-motion-ease),
|
|
8493
8489
|
min-block-size var(--ui-motion-base) var(--ui-motion-ease);
|
|
8494
8490
|
}
|
|
8495
|
-
.row[data-v-
|
|
8496
|
-
.row[data-v-
|
|
8491
|
+
.row[data-v-d2b1bbe0]:hover,
|
|
8492
|
+
.row[data-v-d2b1bbe0]:focus-within {
|
|
8497
8493
|
color: var(--ui-text-primary);
|
|
8498
8494
|
background: var(--ui-surface-muted);
|
|
8499
8495
|
}
|
|
8500
8496
|
|
|
8501
8497
|
/* Selection is the same surface recipe as destination and choice rows. */
|
|
8502
|
-
[data-component~="ui-tree-item"][data-ui-tree-item-state~="selected"] > .row[data-v-
|
|
8498
|
+
[data-component~="ui-tree-item"][data-ui-tree-item-state~="selected"] > .row[data-v-d2b1bbe0] {
|
|
8503
8499
|
color: var(--ui-selection-text);
|
|
8504
8500
|
background: var(--ui-selection-surface);
|
|
8505
8501
|
}
|
|
8506
8502
|
[data-component~="ui-tree-item"][data-ui-tree-item-state~="selected"]:not([aria-disabled="true"])
|
|
8507
8503
|
> .row
|
|
8508
|
-
> .leading[data-v-
|
|
8504
|
+
> .leading[data-v-d2b1bbe0] {
|
|
8509
8505
|
color: var(--ui-selection-text);
|
|
8510
8506
|
}
|
|
8511
|
-
[data-component~="ui-tree-item"][data-ui-tree-item-state~="disabled"] .row[data-v-
|
|
8507
|
+
[data-component~="ui-tree-item"][data-ui-tree-item-state~="disabled"] .row[data-v-d2b1bbe0] {
|
|
8512
8508
|
color: var(--ui-disabled-text);
|
|
8513
8509
|
background: var(--ui-disabled-surface);
|
|
8514
8510
|
}
|
|
8515
|
-
[data-component~="ui-tree-item"][data-dragging] .row[data-v-
|
|
8511
|
+
[data-component~="ui-tree-item"][data-dragging]:not([data-move-source]) .row[data-v-d2b1bbe0] {
|
|
8512
|
+
opacity: 0.42;
|
|
8513
|
+
}
|
|
8514
|
+
[data-component~="ui-tree-item"][data-move-source] > .row > .label[data-v-d2b1bbe0],
|
|
8515
|
+
[data-component~="ui-tree-item"][data-move-source] > .row > .leading[data-v-d2b1bbe0] {
|
|
8516
8516
|
opacity: 0.42;
|
|
8517
8517
|
}
|
|
8518
|
-
[data-component~="ui-tree-item"][data-v-
|
|
8518
|
+
[data-component~="ui-tree-item"][data-v-d2b1bbe0]:focus {
|
|
8519
8519
|
outline: none;
|
|
8520
8520
|
}
|
|
8521
|
-
[data-component~="ui-tree-item"]:focus-visible .row[data-v-
|
|
8521
|
+
[data-component~="ui-tree-item"]:focus-visible .row[data-v-d2b1bbe0] {
|
|
8522
8522
|
box-shadow: 0 0 0 var(--ui-focus-width) var(--ui-focus-ring);
|
|
8523
8523
|
}
|
|
8524
8524
|
|
|
8525
8525
|
/* Child combinators: drop feedback belongs to this item's own row, not the rows nested in it. */
|
|
8526
|
-
[data-component~="ui-tree-item"][data-drop-position="inside"] > .row[data-v-
|
|
8526
|
+
[data-component~="ui-tree-item"][data-drop-position="inside"] > .row[data-v-d2b1bbe0] {
|
|
8527
8527
|
background: var(--ui-accent-subtle);
|
|
8528
8528
|
box-shadow: inset 0 0 0 var(--ui-accent-line-width)
|
|
8529
8529
|
var(--_ui-tree-drop-color, var(--ui-accent-solid));
|
|
8530
8530
|
}
|
|
8531
|
-
.disclosure[data-v-
|
|
8532
|
-
.disclosure-spacer[data-v-
|
|
8531
|
+
.disclosure[data-v-d2b1bbe0],
|
|
8532
|
+
.disclosure-spacer[data-v-d2b1bbe0] {
|
|
8533
8533
|
grid-column: 1;
|
|
8534
8534
|
grid-row: 1;
|
|
8535
8535
|
inline-size: var(--_tree-disclosure-size);
|
|
8536
8536
|
block-size: 28px;
|
|
8537
8537
|
}
|
|
8538
|
-
.disclosure[data-v-
|
|
8538
|
+
.disclosure[data-v-d2b1bbe0] {
|
|
8539
8539
|
display: grid;
|
|
8540
8540
|
/* Start-aligned: the chevron's ink, not its hit area, aligns with the content above it. */
|
|
8541
8541
|
place-items: center start;
|
|
@@ -8546,10 +8546,10 @@ to {
|
|
|
8546
8546
|
border-radius: var(--ui-radius-sm);
|
|
8547
8547
|
cursor: pointer;
|
|
8548
8548
|
}
|
|
8549
|
-
.disclosure[hidden][data-v-
|
|
8549
|
+
.disclosure[hidden][data-v-d2b1bbe0] {
|
|
8550
8550
|
display: none;
|
|
8551
8551
|
}
|
|
8552
|
-
.selection-hit[data-v-
|
|
8552
|
+
.selection-hit[data-v-d2b1bbe0] {
|
|
8553
8553
|
display: none;
|
|
8554
8554
|
grid-column: 2;
|
|
8555
8555
|
grid-row: 1;
|
|
@@ -8558,29 +8558,29 @@ to {
|
|
|
8558
8558
|
block-size: var(--_ui-tree-item-min-block-size, var(--_tree-row-min-height));
|
|
8559
8559
|
cursor: pointer;
|
|
8560
8560
|
}
|
|
8561
|
-
.selection-checkbox[data-v-
|
|
8561
|
+
.selection-checkbox[data-v-d2b1bbe0] {
|
|
8562
8562
|
inline-size: 1rem;
|
|
8563
8563
|
block-size: 1rem;
|
|
8564
8564
|
margin: 0;
|
|
8565
8565
|
accent-color: var(--ui-accent-solid);
|
|
8566
8566
|
}
|
|
8567
|
-
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row[data-v-
|
|
8567
|
+
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row[data-v-d2b1bbe0] {
|
|
8568
8568
|
grid-template-columns: var(--_tree-disclosure-size) 1.25rem auto minmax(0, 1fr);
|
|
8569
8569
|
}
|
|
8570
|
-
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row > .selection-hit[data-v-
|
|
8570
|
+
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row > .selection-hit[data-v-d2b1bbe0] {
|
|
8571
8571
|
display: grid;
|
|
8572
8572
|
}
|
|
8573
|
-
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row > .leading[data-v-
|
|
8573
|
+
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row > .leading[data-v-d2b1bbe0] {
|
|
8574
8574
|
grid-column: 3;
|
|
8575
8575
|
}
|
|
8576
|
-
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row > .label[data-v-
|
|
8576
|
+
[data-component~="ui-tree-item"][data-selection-mode="multiple"] > .row > .label[data-v-d2b1bbe0] {
|
|
8577
8577
|
grid-column: 4;
|
|
8578
8578
|
}
|
|
8579
|
-
.disclosure[data-v-
|
|
8579
|
+
.disclosure[data-v-d2b1bbe0]:hover {
|
|
8580
8580
|
color: var(--ui-text-primary);
|
|
8581
8581
|
background: var(--ui-surface-elevated);
|
|
8582
8582
|
}
|
|
8583
|
-
.disclosure-icon[data-v-
|
|
8583
|
+
.disclosure-icon[data-v-d2b1bbe0] {
|
|
8584
8584
|
display: grid;
|
|
8585
8585
|
place-items: center;
|
|
8586
8586
|
inline-size: 12px;
|
|
@@ -8588,7 +8588,7 @@ to {
|
|
|
8588
8588
|
transform: rotate(-90deg);
|
|
8589
8589
|
transition: transform var(--ui-motion-fast) var(--ui-motion-ease);
|
|
8590
8590
|
}
|
|
8591
|
-
.disclosure-icon[data-v-
|
|
8591
|
+
.disclosure-icon[data-v-d2b1bbe0]::before {
|
|
8592
8592
|
display: block;
|
|
8593
8593
|
inline-size: 0.375rem;
|
|
8594
8594
|
block-size: 0.375rem;
|
|
@@ -8598,19 +8598,19 @@ to {
|
|
|
8598
8598
|
/* A chevron's ink sits below its box centre; lift it so it centres optically (in either rotation). */
|
|
8599
8599
|
transform: translateY(-20%) rotate(45deg);
|
|
8600
8600
|
}
|
|
8601
|
-
[data-component~="ui-tree-item"][aria-expanded="true"] .disclosure-icon[data-v-
|
|
8601
|
+
[data-component~="ui-tree-item"][aria-expanded="true"] .disclosure-icon[data-v-d2b1bbe0] {
|
|
8602
8602
|
transform: rotate(0deg);
|
|
8603
8603
|
}
|
|
8604
8604
|
|
|
8605
8605
|
/* Lucide grip-vertical, filling the handle as in Looma 0.2. */
|
|
8606
|
-
.drag-handle svg[data-v-
|
|
8606
|
+
.drag-handle svg[data-v-d2b1bbe0] {
|
|
8607
8607
|
display: block;
|
|
8608
8608
|
inline-size: 100%;
|
|
8609
8609
|
block-size: 100%;
|
|
8610
8610
|
}
|
|
8611
8611
|
|
|
8612
8612
|
/* Slotted content is outside this scope, so :has() cannot see it; hide only a truly empty slot. */
|
|
8613
|
-
.leading[data-v-
|
|
8613
|
+
.leading[data-v-d2b1bbe0] {
|
|
8614
8614
|
display: inline-grid;
|
|
8615
8615
|
place-items: center;
|
|
8616
8616
|
grid-column: 2;
|
|
@@ -8623,12 +8623,12 @@ to {
|
|
|
8623
8623
|
position: relative;
|
|
8624
8624
|
z-index: 1;
|
|
8625
8625
|
}
|
|
8626
|
-
.leading[data-v-
|
|
8626
|
+
.leading[data-v-d2b1bbe0]:empty {
|
|
8627
8627
|
display: none;
|
|
8628
8628
|
}
|
|
8629
8629
|
|
|
8630
8630
|
/* Icons match the label's size (as in Knit's tree): an unsized SVG would otherwise render 300×150. */
|
|
8631
|
-
svg[data-v-
|
|
8631
|
+
svg[data-v-d2b1bbe0-s],img[data-v-d2b1bbe0-s] {
|
|
8632
8632
|
display: block;
|
|
8633
8633
|
inline-size: 1em;
|
|
8634
8634
|
block-size: 1em;
|
|
@@ -8637,7 +8637,7 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8637
8637
|
|
|
8638
8638
|
/* The label spans the row's height and centres its content, so slotted content (a link) can
|
|
8639
8639
|
stretch to fill the row as its own hit area; the padding tokens remove the inset. */
|
|
8640
|
-
.label[data-v-
|
|
8640
|
+
.label[data-v-d2b1bbe0] {
|
|
8641
8641
|
grid-column: 3;
|
|
8642
8642
|
grid-row: 1;
|
|
8643
8643
|
align-self: stretch;
|
|
@@ -8655,7 +8655,7 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8655
8655
|
|
|
8656
8656
|
/* Slotted label content fills the cell, so a link is the row's hit area rather than sizing to
|
|
8657
8657
|
its own text and reading as overflow. */
|
|
8658
|
-
.label-text[data-v-
|
|
8658
|
+
.label-text[data-v-d2b1bbe0] {
|
|
8659
8659
|
display: flex;
|
|
8660
8660
|
align-items: center;
|
|
8661
8661
|
/* Stretches, so slotted content can still be the row's full-height hit area. */
|
|
@@ -8665,15 +8665,16 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8665
8665
|
inline-size: 100%;
|
|
8666
8666
|
white-space: nowrap;
|
|
8667
8667
|
}
|
|
8668
|
-
.label-text > [data-v-
|
|
8668
|
+
.label-text > [data-v-d2b1bbe0-s] {
|
|
8669
8669
|
flex: 1 1 auto;
|
|
8670
8670
|
min-inline-size: 0;
|
|
8671
8671
|
}
|
|
8672
8672
|
|
|
8673
8673
|
/* The controls sit over the label's end, so the text fades out where they begin. The fade is
|
|
8674
8674
|
the truncation mark while it shows: an ellipsis under it would read as a second one. */
|
|
8675
|
-
.row:hover > .label[data-v-
|
|
8676
|
-
.row:focus-within > .label[data-v-
|
|
8675
|
+
.row:hover > .label[data-v-d2b1bbe0],
|
|
8676
|
+
.row:focus-within > .label[data-v-d2b1bbe0],
|
|
8677
|
+
[data-component~="ui-tree-item"][data-move-source] > .row > .label[data-v-d2b1bbe0] {
|
|
8677
8678
|
text-overflow: clip;
|
|
8678
8679
|
mask-image: linear-gradient(
|
|
8679
8680
|
to right,
|
|
@@ -8681,8 +8682,9 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8681
8682
|
transparent calc(100% - var(--_tree-actions-width, 1.75rem))
|
|
8682
8683
|
);
|
|
8683
8684
|
}
|
|
8684
|
-
.row:hover > .label[data-v-
|
|
8685
|
-
.row:focus-within > .label[data-v-
|
|
8685
|
+
.row:hover > .label[data-v-d2b1bbe0]:dir(rtl),
|
|
8686
|
+
.row:focus-within > .label[data-v-d2b1bbe0]:dir(rtl),
|
|
8687
|
+
[data-component~="ui-tree-item"][data-move-source] > .row > .label[data-v-d2b1bbe0]:dir(rtl) {
|
|
8686
8688
|
mask-image: linear-gradient(
|
|
8687
8689
|
to left,
|
|
8688
8690
|
#000 calc(100% - var(--_tree-actions-width, 1.75rem) - var(--ui-space-1)),
|
|
@@ -8694,10 +8696,10 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8694
8696
|
there, and starts again. Only when it actually overflows — the controller measures by how
|
|
8695
8697
|
much — after the controls have taken their place over its end — and hands over the distance
|
|
8696
8698
|
and a duration from it, so every name moves at the same speed. */
|
|
8697
|
-
.row[data-ui-marquee] > .label > .label-text[data-v-
|
|
8699
|
+
.row[data-ui-marquee] > .label > .label-text[data-v-d2b1bbe0] {
|
|
8698
8700
|
/* Once per pass: the controller restarts it after a rest at the end, so the name holds still
|
|
8699
8701
|
long enough to read rather than sliding back and forth. */
|
|
8700
|
-
animation: ui-tree-item-marquee-
|
|
8702
|
+
animation: ui-tree-item-marquee-d2b1bbe0 var(--_marquee-duration) linear 0.5s 1 normal forwards;
|
|
8701
8703
|
will-change: transform;
|
|
8702
8704
|
}
|
|
8703
8705
|
|
|
@@ -8705,7 +8707,7 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8705
8707
|
slides, the label reaches back under the icon (the controller measures how far) with its text
|
|
8706
8708
|
where it was, and fades out across the gap before the icon, fully gone where the icon begins
|
|
8707
8709
|
to cover it: the name slips under the icon rather than stopping at a hard edge beside it. */
|
|
8708
|
-
.row[data-ui-marquee] > .label[data-v-
|
|
8710
|
+
.row[data-ui-marquee] > .label[data-v-d2b1bbe0] {
|
|
8709
8711
|
margin-inline-start: calc(-1 * var(--_marquee-lead, 0px));
|
|
8710
8712
|
padding-inline-start: calc(
|
|
8711
8713
|
var(--_marquee-lead, 0px) + var(--_ui-tree-item-label-padding-inline, var(--ui-space-2))
|
|
@@ -8720,7 +8722,7 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8720
8722
|
transparent calc(100% - var(--_tree-actions-width, 1.75rem))
|
|
8721
8723
|
);
|
|
8722
8724
|
}
|
|
8723
|
-
.row[data-ui-marquee] > .label[data-v-
|
|
8725
|
+
.row[data-ui-marquee] > .label[data-v-d2b1bbe0]:dir(rtl) {
|
|
8724
8726
|
mask-image: linear-gradient(
|
|
8725
8727
|
to left,
|
|
8726
8728
|
transparent var(--_marquee-icon-width, 0px),
|
|
@@ -8731,7 +8733,7 @@ svg[data-v-567c1a55-s],img[data-v-567c1a55-s] {
|
|
|
8731
8733
|
transparent calc(100% - var(--_tree-actions-width, 1.75rem))
|
|
8732
8734
|
);
|
|
8733
8735
|
}
|
|
8734
|
-
@keyframes ui-tree-item-marquee-
|
|
8736
|
+
@keyframes ui-tree-item-marquee-d2b1bbe0 {
|
|
8735
8737
|
from {
|
|
8736
8738
|
transform: translateX(0);
|
|
8737
8739
|
}
|
|
@@ -8742,15 +8744,15 @@ to {
|
|
|
8742
8744
|
|
|
8743
8745
|
/* Reduced motion keeps the fade, which already says the name continues. */
|
|
8744
8746
|
@media (prefers-reduced-motion: reduce) {
|
|
8745
|
-
.row[data-ui-marquee] > .label > .label-text[data-v-
|
|
8747
|
+
.row[data-ui-marquee] > .label > .label-text[data-v-d2b1bbe0] {
|
|
8746
8748
|
animation: none;
|
|
8747
8749
|
}
|
|
8748
8750
|
}
|
|
8749
|
-
.row:hover > .label > [data-v-
|
|
8750
|
-
.row:focus-within > .label > [data-v-
|
|
8751
|
+
.row:hover > .label > [data-v-d2b1bbe0-s],
|
|
8752
|
+
.row:focus-within > .label > [data-v-d2b1bbe0-s] {
|
|
8751
8753
|
text-overflow: clip;
|
|
8752
8754
|
}
|
|
8753
|
-
.actions[data-v-
|
|
8755
|
+
.actions[data-v-d2b1bbe0] {
|
|
8754
8756
|
position: absolute;
|
|
8755
8757
|
z-index: 1;
|
|
8756
8758
|
inset-block: 0;
|
|
@@ -8762,18 +8764,19 @@ to {
|
|
|
8762
8764
|
pointer-events: none;
|
|
8763
8765
|
transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);
|
|
8764
8766
|
}
|
|
8765
|
-
.row:hover > .actions[data-v-
|
|
8766
|
-
.row:focus-within > .actions[data-v-
|
|
8767
|
+
.row:hover > .actions[data-v-d2b1bbe0],
|
|
8768
|
+
.row:focus-within > .actions[data-v-d2b1bbe0],
|
|
8769
|
+
[data-component~="ui-tree-item"][data-move-source] > .row > .actions[data-v-d2b1bbe0] {
|
|
8767
8770
|
opacity: 1;
|
|
8768
8771
|
pointer-events: auto;
|
|
8769
8772
|
}
|
|
8770
8773
|
|
|
8771
8774
|
/* Without hover there is no reveal, so the controls keep their own column. */
|
|
8772
8775
|
@media (hover: none) {
|
|
8773
|
-
.row[data-v-
|
|
8776
|
+
.row[data-v-d2b1bbe0] {
|
|
8774
8777
|
grid-template-columns: var(--_tree-disclosure-size) auto minmax(0, 1fr) auto;
|
|
8775
8778
|
}
|
|
8776
|
-
.actions[data-v-
|
|
8779
|
+
.actions[data-v-d2b1bbe0] {
|
|
8777
8780
|
position: static;
|
|
8778
8781
|
grid-column: 4;
|
|
8779
8782
|
grid-row: 1;
|
|
@@ -8788,7 +8791,7 @@ to {
|
|
|
8788
8791
|
empty column, right before the icon; a branch's disclosure is there, so its handle sits just
|
|
8789
8792
|
outside the row. It is bare until pointed at: a resting surface behind it read as a faint
|
|
8790
8793
|
patch rather than as a control. */
|
|
8791
|
-
.drag-handle[data-v-
|
|
8794
|
+
.drag-handle[data-v-d2b1bbe0] {
|
|
8792
8795
|
position: absolute;
|
|
8793
8796
|
z-index: 2;
|
|
8794
8797
|
inset-block-start: 50%;
|
|
@@ -8809,24 +8812,24 @@ to {
|
|
|
8809
8812
|
transform: translateY(-50%);
|
|
8810
8813
|
transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);
|
|
8811
8814
|
}
|
|
8812
|
-
.row:hover .drag-handle[data-v-
|
|
8813
|
-
.drag-handle[data-v-
|
|
8814
|
-
.drag-handle[data-v-
|
|
8815
|
-
[data-component~="ui-tree-item"][data-dragging] > .row > .drag-handle[data-v-
|
|
8815
|
+
.row:hover .drag-handle[data-v-d2b1bbe0],
|
|
8816
|
+
.drag-handle[data-v-d2b1bbe0]:hover,
|
|
8817
|
+
.drag-handle[data-v-d2b1bbe0]:focus-visible,
|
|
8818
|
+
[data-component~="ui-tree-item"][data-dragging] > .row > .drag-handle[data-v-d2b1bbe0] {
|
|
8816
8819
|
opacity: 1;
|
|
8817
8820
|
}
|
|
8818
|
-
[data-component~="ui-tree-item"][data-ui-tree-item-state~="isContainer"] > .row > .drag-handle[data-v-
|
|
8821
|
+
[data-component~="ui-tree-item"][data-ui-tree-item-state~="isContainer"] > .row > .drag-handle[data-v-d2b1bbe0] {
|
|
8819
8822
|
inset-inline-start: calc(-1 * var(--_tree-disclosure-size) - 2px);
|
|
8820
8823
|
}
|
|
8821
|
-
.drag-handle[data-v-
|
|
8822
|
-
.drag-handle[data-v-
|
|
8824
|
+
.drag-handle[data-v-d2b1bbe0]:hover,
|
|
8825
|
+
.drag-handle[data-v-d2b1bbe0]:focus-visible {
|
|
8823
8826
|
color: var(--ui-text-primary);
|
|
8824
8827
|
background: var(--ui-surface-hover);
|
|
8825
8828
|
}
|
|
8826
|
-
.drag-handle[data-v-
|
|
8829
|
+
.drag-handle[data-v-d2b1bbe0]:active {
|
|
8827
8830
|
cursor: grabbing;
|
|
8828
8831
|
}
|
|
8829
|
-
.drop-indicator[data-v-
|
|
8832
|
+
.drop-indicator[data-v-d2b1bbe0] {
|
|
8830
8833
|
position: absolute;
|
|
8831
8834
|
z-index: 3;
|
|
8832
8835
|
inset-inline: 1px;
|
|
@@ -8836,8 +8839,8 @@ to {
|
|
|
8836
8839
|
background: var(--_ui-tree-drop-color, var(--ui-accent-solid));
|
|
8837
8840
|
pointer-events: none;
|
|
8838
8841
|
}
|
|
8839
|
-
.drop-indicator[data-v-
|
|
8840
|
-
.drop-indicator[data-v-
|
|
8842
|
+
.drop-indicator[data-v-d2b1bbe0]::before,
|
|
8843
|
+
.drop-indicator[data-v-d2b1bbe0]::after {
|
|
8841
8844
|
content: "";
|
|
8842
8845
|
position: absolute;
|
|
8843
8846
|
inset-block-start: 50%;
|
|
@@ -8848,34 +8851,34 @@ to {
|
|
|
8848
8851
|
background: var(--ui-surface-elevated);
|
|
8849
8852
|
transform: translateY(-50%);
|
|
8850
8853
|
}
|
|
8851
|
-
.drop-indicator[data-v-
|
|
8854
|
+
.drop-indicator[data-v-d2b1bbe0]::before {
|
|
8852
8855
|
inset-inline-start: -1px;
|
|
8853
8856
|
}
|
|
8854
|
-
.drop-indicator[data-v-
|
|
8857
|
+
.drop-indicator[data-v-d2b1bbe0]::after {
|
|
8855
8858
|
inset-inline-end: -1px;
|
|
8856
8859
|
}
|
|
8857
|
-
[data-component~="ui-tree-item"][data-drop-position="before"] > .row > .row-drop-indicator[data-v-
|
|
8860
|
+
[data-component~="ui-tree-item"][data-drop-position="before"] > .row > .row-drop-indicator[data-v-d2b1bbe0] {
|
|
8858
8861
|
display: block;
|
|
8859
8862
|
inset-block-start: calc(-0.5 * var(--ui-accent-line-width));
|
|
8860
8863
|
}
|
|
8861
|
-
[data-component~="ui-tree-item"][data-drop-position="after"] > .subtree-drop-indicator[data-v-
|
|
8864
|
+
[data-component~="ui-tree-item"][data-drop-position="after"] > .subtree-drop-indicator[data-v-d2b1bbe0] {
|
|
8862
8865
|
display: block;
|
|
8863
8866
|
inset-block-end: calc(-0.5 * var(--ui-accent-line-width));
|
|
8864
8867
|
}
|
|
8865
|
-
.children[hidden][data-v-
|
|
8868
|
+
.children[hidden][data-v-d2b1bbe0] {
|
|
8866
8869
|
display: none;
|
|
8867
8870
|
}
|
|
8868
|
-
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"][data-v-
|
|
8871
|
+
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"][data-v-d2b1bbe0] {
|
|
8869
8872
|
--_tree-row-min-height: 44px;
|
|
8870
8873
|
}
|
|
8871
|
-
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .row[data-v-
|
|
8874
|
+
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .row[data-v-d2b1bbe0] {
|
|
8872
8875
|
grid-template-columns: 44px var(--_tree-disclosure-size) auto minmax(0, 1fr);
|
|
8873
8876
|
}
|
|
8874
|
-
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .drag-handle[data-v-
|
|
8877
|
+
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .drag-handle[data-v-d2b1bbe0],
|
|
8875
8878
|
html[data-ui-input-modality="touch"]
|
|
8876
8879
|
[data-component~="ui-tree-item"][data-ui-tree-item-state~="isContainer"]
|
|
8877
8880
|
> .row
|
|
8878
|
-
> .drag-handle[data-v-
|
|
8881
|
+
> .drag-handle[data-v-d2b1bbe0] {
|
|
8879
8882
|
position: relative;
|
|
8880
8883
|
grid-column: 1;
|
|
8881
8884
|
grid-row: 1;
|
|
@@ -8887,24 +8890,24 @@ html[data-ui-input-modality="touch"]
|
|
|
8887
8890
|
transform: none;
|
|
8888
8891
|
cursor: pointer;
|
|
8889
8892
|
}
|
|
8890
|
-
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .disclosure[data-v-
|
|
8893
|
+
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .disclosure[data-v-d2b1bbe0] {
|
|
8891
8894
|
grid-column: 2;
|
|
8892
8895
|
}
|
|
8893
|
-
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .leading[data-v-
|
|
8896
|
+
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .leading[data-v-d2b1bbe0] {
|
|
8894
8897
|
grid-column: 3;
|
|
8895
8898
|
}
|
|
8896
|
-
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .label[data-v-
|
|
8899
|
+
html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .label[data-v-d2b1bbe0] {
|
|
8897
8900
|
grid-column: 4;
|
|
8898
8901
|
}
|
|
8899
8902
|
html[data-ui-input-modality="touch"]
|
|
8900
8903
|
[data-component~="ui-tree-item"][data-selection-mode="multiple"]
|
|
8901
|
-
> .row[data-v-
|
|
8904
|
+
> .row[data-v-d2b1bbe0] {
|
|
8902
8905
|
grid-template-columns: 44px var(--_tree-disclosure-size) 44px auto minmax(0, 1fr);
|
|
8903
8906
|
}
|
|
8904
8907
|
html[data-ui-input-modality="touch"]
|
|
8905
8908
|
[data-component~="ui-tree-item"][data-selection-mode="multiple"]
|
|
8906
8909
|
> .row
|
|
8907
|
-
> .selection-hit[data-v-
|
|
8910
|
+
> .selection-hit[data-v-d2b1bbe0] {
|
|
8908
8911
|
grid-column: 3;
|
|
8909
8912
|
inline-size: 44px;
|
|
8910
8913
|
block-size: 44px;
|
|
@@ -8912,36 +8915,36 @@ html[data-ui-input-modality="touch"]
|
|
|
8912
8915
|
html[data-ui-input-modality="touch"]
|
|
8913
8916
|
[data-component~="ui-tree-item"][data-selection-mode="multiple"]
|
|
8914
8917
|
> .row
|
|
8915
|
-
> .leading[data-v-
|
|
8918
|
+
> .leading[data-v-d2b1bbe0] {
|
|
8916
8919
|
grid-column: 4;
|
|
8917
8920
|
}
|
|
8918
8921
|
html[data-ui-input-modality="touch"]
|
|
8919
8922
|
[data-component~="ui-tree-item"][data-selection-mode="multiple"]
|
|
8920
8923
|
> .row
|
|
8921
|
-
> .label[data-v-
|
|
8924
|
+
> .label[data-v-d2b1bbe0] {
|
|
8922
8925
|
grid-column: 5;
|
|
8923
8926
|
}
|
|
8924
8927
|
@media (prefers-reduced-motion: reduce) {
|
|
8925
|
-
.row[data-v-
|
|
8926
|
-
.disclosure-icon[data-v-
|
|
8927
|
-
.drag-handle[data-v-
|
|
8928
|
+
.row[data-v-d2b1bbe0],
|
|
8929
|
+
.disclosure-icon[data-v-d2b1bbe0],
|
|
8930
|
+
.drag-handle[data-v-d2b1bbe0] {
|
|
8928
8931
|
transition: none;
|
|
8929
8932
|
}
|
|
8930
8933
|
}
|
|
8931
8934
|
@media (forced-colors: active) {
|
|
8932
|
-
[data-component~="ui-tree-item"]:focus-visible > .row[data-v-
|
|
8935
|
+
[data-component~="ui-tree-item"]:focus-visible > .row[data-v-d2b1bbe0] {
|
|
8933
8936
|
outline: var(--ui-focus-width) solid Highlight;
|
|
8934
8937
|
outline-offset: calc(-1 * var(--ui-focus-width));
|
|
8935
8938
|
}
|
|
8936
8939
|
[data-component~="ui-tree-item"][data-ui-tree-item-state~="selected"]:not(:focus-visible):not([aria-disabled="true"])
|
|
8937
|
-
> .row[data-v-
|
|
8940
|
+
> .row[data-v-d2b1bbe0] {
|
|
8938
8941
|
outline: var(--ui-border-width) solid Highlight;
|
|
8939
8942
|
outline-offset: calc(-1 * var(--ui-border-width));
|
|
8940
8943
|
}
|
|
8941
8944
|
}
|
|
8942
8945
|
|
|
8943
8946
|
/* A component that sets its display still honours the hidden attribute on its root. */
|
|
8944
|
-
[data-component~="ui-tree-item"][hidden][data-v-
|
|
8947
|
+
[data-component~="ui-tree-item"][hidden][data-v-d2b1bbe0] {
|
|
8945
8948
|
display: none;
|
|
8946
8949
|
}
|
|
8947
8950
|
/**
|