Skip to content

Commit 319a4fb

Browse files
committed
fix #160
1 parent bf752c9 commit 319a4fb

13 files changed

+87
-17
lines changed

packages/uikit/src/caret.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,13 @@ export function createCaret(
7373
panelGroupManager: PanelGroupManager,
7474
initializers: Initializers,
7575
) {
76-
const orderInfo = computedOrderInfo(undefined, ElementType.Panel, defaultPanelDependencies, parentOrderInfo)
76+
const orderInfo = computedOrderInfo(
77+
undefined,
78+
'zIndexOffset',
79+
ElementType.Panel,
80+
defaultPanelDependencies,
81+
parentOrderInfo,
82+
)
7783
const blinkingCaretPosition = signal<Vector3Tuple | undefined>(undefined)
7884
initializers.push(() =>
7985
effect(() => {

packages/uikit/src/components/container.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,13 @@ export function createContainer<EM extends ThreeEventMap = ThreeEventMap>(
106106

107107
//instanced panel
108108
const groupDeps = computedPanelGroupDependencies(mergedProperties)
109-
const orderInfo = computedOrderInfo(mergedProperties, ElementType.Panel, groupDeps, parentCtx.orderInfo)
109+
const orderInfo = computedOrderInfo(
110+
mergedProperties,
111+
'zIndexOffset',
112+
ElementType.Panel,
113+
groupDeps,
114+
parentCtx.orderInfo,
115+
)
110116
initializers.push((subscriptions) =>
111117
createInstancedPanel(
112118
mergedProperties,

packages/uikit/src/components/content.ts

+8-2
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,13 @@ export function createContent<EM extends ThreeEventMap = ThreeEventMap>(
114114

115115
//instanced panel
116116
const groupDeps = computedPanelGroupDependencies(mergedProperties)
117-
const backgroundorderInfo = computedOrderInfo(mergedProperties, ElementType.Panel, groupDeps, parentCtx.orderInfo)
117+
const backgroundorderInfo = computedOrderInfo(
118+
mergedProperties,
119+
'zIndexOffset',
120+
ElementType.Panel,
121+
groupDeps,
122+
parentCtx.orderInfo,
123+
)
118124
initializers.push((subscriptions) =>
119125
createInstancedPanel(
120126
mergedProperties,
@@ -132,7 +138,7 @@ export function createContent<EM extends ThreeEventMap = ThreeEventMap>(
132138
),
133139
)
134140

135-
const orderInfo = computedOrderInfo(undefined, ElementType.Object, undefined, backgroundorderInfo)
141+
const orderInfo = computedOrderInfo(undefined, 'zIndexOffset', ElementType.Object, undefined, backgroundorderInfo)
136142

137143
const interactionPanel = createInteractionPanel(
138144
backgroundorderInfo,

packages/uikit/src/components/custom.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,13 @@ export function createCustomContainer<EM extends ThreeEventMap = ThreeEventMap>(
8888
const isVisible = computedIsVisible(flexState, isClipped, mergedProperties)
8989

9090
//instanced panel
91-
const orderInfo = computedOrderInfo(mergedProperties, ElementType.Custom, undefined, parentCtx.orderInfo)
91+
const orderInfo = computedOrderInfo(
92+
mergedProperties,
93+
'zIndexOffset',
94+
ElementType.Custom,
95+
undefined,
96+
parentCtx.orderInfo,
97+
)
9298
const clippingPlanes = createGlobalClippingPlanes(parentCtx.root, parentCtx.clippingRect)
9399

94100
initializers.push((subscriptions) => {

packages/uikit/src/components/icon.ts

+8-2
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,13 @@ export function createIcon<EM extends ThreeEventMap = ThreeEventMap>(
105105
const isVisible = computedIsVisible(flexState, isClipped, mergedProperties)
106106

107107
const groupDeps = computedPanelGroupDependencies(mergedProperties)
108-
const backgroundOrderInfo = computedOrderInfo(mergedProperties, ElementType.Panel, groupDeps, parentCtx.orderInfo)
108+
const backgroundOrderInfo = computedOrderInfo(
109+
mergedProperties,
110+
'zIndexOffset',
111+
ElementType.Panel,
112+
groupDeps,
113+
parentCtx.orderInfo,
114+
)
109115
initializers.push((subscriptions) =>
110116
createInstancedPanel(
111117
mergedProperties,
@@ -123,7 +129,7 @@ export function createIcon<EM extends ThreeEventMap = ThreeEventMap>(
123129
),
124130
)
125131

126-
const orderInfo = computedOrderInfo(undefined, ElementType.Svg, undefined, backgroundOrderInfo)
132+
const orderInfo = computedOrderInfo(undefined, 'zIndexOffset', ElementType.Svg, undefined, backgroundOrderInfo)
127133

128134
const clippingPlanes = createGlobalClippingPlanes(parentCtx.root, parentCtx.clippingRect)
129135
const iconGroup = createIconGroup(

packages/uikit/src/components/image.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,13 @@ export function createImage<EM extends ThreeEventMap = ThreeEventMap>(
164164

165165
const isVisible = computedIsVisible(flexState, isHidden, mergedProperties)
166166

167-
const orderInfo = computedOrderInfo(mergedProperties, ElementType.Image, undefined, parentCtx.orderInfo)
167+
const orderInfo = computedOrderInfo(
168+
mergedProperties,
169+
'zIndexOffset',
170+
ElementType.Image,
171+
undefined,
172+
parentCtx.orderInfo,
173+
)
168174

169175
const scrollPosition = createScrollPosition()
170176
applyScrollPosition(childrenContainer, scrollPosition, parentCtx.root.pixelSize, initializers)

packages/uikit/src/components/input.ts

+8-1
Original file line numberDiff line numberDiff line change
@@ -160,7 +160,13 @@ export function createInput<EM extends ThreeEventMap = ThreeEventMap>(
160160
const isVisible = computedIsVisible(flexState, isClipped, mergedProperties)
161161

162162
const groupDeps = computedPanelGroupDependencies(mergedProperties)
163-
const backgroundOrderInfo = computedOrderInfo(mergedProperties, ElementType.Panel, groupDeps, parentCtx.orderInfo)
163+
const backgroundOrderInfo = computedOrderInfo(
164+
mergedProperties,
165+
'zIndexOffset',
166+
ElementType.Panel,
167+
groupDeps,
168+
parentCtx.orderInfo,
169+
)
164170
initializers.push((subscriptions) =>
165171
createInstancedPanel(
166172
mergedProperties,
@@ -206,6 +212,7 @@ export function createInput<EM extends ThreeEventMap = ThreeEventMap>(
206212
const fontSignal = computedFont(mergedProperties, fontFamilies, parentCtx.root.renderer, initializers)
207213
const orderInfo = computedOrderInfo(
208214
undefined,
215+
'zIndexOffset',
209216
ElementType.Text,
210217
computedGylphGroupDependencies(fontSignal),
211218
selectionOrderInfo,

packages/uikit/src/components/root.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,7 @@ export function createRoot<EM extends ThreeEventMap = ThreeEventMap>(
145145
applyTransform(ctx, object, globalMatrix, initializers)
146146
const groupDeps = computedPanelGroupDependencies(mergedProperties)
147147

148-
const orderInfo = computedOrderInfo(undefined, ElementType.Panel, groupDeps, undefined)
148+
const orderInfo = computedOrderInfo(undefined, 'zIndexOffset', ElementType.Panel, groupDeps, undefined)
149149

150150
const panelGroupManager = new PanelGroupManager(pixelSize, ctx, object, initializers)
151151

packages/uikit/src/components/svg.ts

+8-2
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,13 @@ export function createSvg<EM extends ThreeEventMap = ThreeEventMap>(
134134
const isVisible = computedIsVisible(flexState, isClipped, mergedProperties)
135135

136136
const groupDeps = computedPanelGroupDependencies(mergedProperties)
137-
const backgroundOrderInfo = computedOrderInfo(mergedProperties, ElementType.Panel, groupDeps, parentCtx.orderInfo)
137+
const backgroundOrderInfo = computedOrderInfo(
138+
mergedProperties,
139+
'zIndexOffset',
140+
ElementType.Panel,
141+
groupDeps,
142+
parentCtx.orderInfo,
143+
)
138144
initializers.push((subscriptions) =>
139145
createInstancedPanel(
140146
mergedProperties,
@@ -152,7 +158,7 @@ export function createSvg<EM extends ThreeEventMap = ThreeEventMap>(
152158
),
153159
)
154160

155-
const orderInfo = computedOrderInfo(undefined, ElementType.Svg, undefined, backgroundOrderInfo)
161+
const orderInfo = computedOrderInfo(undefined, 'zIndexOffset', ElementType.Svg, undefined, backgroundOrderInfo)
156162

157163
const src = computed(() => readReactive(style.value?.src) ?? readReactive(properties.value?.src))
158164
const svgObject = signal<Object3D | undefined>(undefined)

packages/uikit/src/components/text.ts

+8-1
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,13 @@ export function createText<EM extends ThreeEventMap = ThreeEventMap>(
9999
const isVisible = computedIsVisible(flexState, isClipped, mergedProperties)
100100

101101
const groupDeps = computedPanelGroupDependencies(mergedProperties)
102-
const backgroundOrderInfo = computedOrderInfo(mergedProperties, ElementType.Panel, groupDeps, parentCtx.orderInfo)
102+
const backgroundOrderInfo = computedOrderInfo(
103+
mergedProperties,
104+
'zIndexOffset',
105+
ElementType.Panel,
106+
groupDeps,
107+
parentCtx.orderInfo,
108+
)
103109
initializers.push((subscriptions) =>
104110
createInstancedPanel(
105111
mergedProperties,
@@ -120,6 +126,7 @@ export function createText<EM extends ThreeEventMap = ThreeEventMap>(
120126
const fontSignal = computedFont(mergedProperties, fontFamilies, parentCtx.root.renderer, initializers)
121127
const orderInfo = computedOrderInfo(
122128
undefined,
129+
'zIndexOffset',
123130
ElementType.Text,
124131
computedGylphGroupDependencies(fontSignal),
125132
backgroundOrderInfo,

packages/uikit/src/order.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -70,14 +70,15 @@ export type ZIndexOffset = { major?: number; minor?: number } | number
7070

7171
export function computedOrderInfo(
7272
propertiesSignal: Signal<MergedProperties> | undefined,
73+
zIndexOffsetKey: string,
7374
type: ElementType,
7475
instancedGroupDependencies: Signal<Record<string, any>> | Record<string, any> | undefined,
7576
parentOrderInfoSignal: Signal<OrderInfo | undefined> | undefined,
7677
): Signal<OrderInfo | undefined> {
7778
const zIndexOffset =
7879
propertiesSignal == null
7980
? undefined
80-
: computedInheritableProperty<ZIndexOffset | undefined>(propertiesSignal, 'zIndexOffset', undefined)
81+
: computedInheritableProperty<ZIndexOffset | undefined>(propertiesSignal, zIndexOffsetKey, undefined)
8182
return computed(() => {
8283
let parentOrderInfo: OrderInfo | undefined
8384
if (parentOrderInfoSignal == null) {

packages/uikit/src/scroll.ts

+9-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { ColorRepresentation, Initializers, computedBorderInset } from './utils.
55
import { ClippingRect } from './clipping.js'
66
import { clamp } from 'three/src/math/MathUtils.js'
77
import { PanelProperties, createInstancedPanel } from './panel/instanced-panel.js'
8-
import { ElementType, OrderInfo, computedOrderInfo } from './order.js'
8+
import { ElementType, OrderInfo, ZIndexOffset, computedOrderInfo } from './order.js'
99
import { MergedProperties } from './properties/merged.js'
1010
import { PanelMaterialConfig, createPanelMaterialConfig } from './panel/panel-material.js'
1111
import { PanelGroupManager, defaultPanelDependencies } from './panel/instanced-panel-group.js'
@@ -362,6 +362,7 @@ export type ScrollbarBorderSizeProperties = {
362362
export type ScrollbarProperties = {
363363
scrollbarOpacity?: number
364364
scrollbarColor?: ColorRepresentation
365+
scrollbarZIndexOffset?: ZIndexOffset
365366
} & ScrollbarWidthProperties &
366367
ScrollbarBorderSizeProperties & {
367368
[Key in Exclude<
@@ -389,7 +390,13 @@ export function createScrollbars(
389390
scrollbarWidth: Signal<number>,
390391
initializers: Initializers,
391392
): void {
392-
const scrollbarOrderInfo = computedOrderInfo(undefined, ElementType.Panel, defaultPanelDependencies, orderInfo)
393+
const scrollbarOrderInfo = computedOrderInfo(
394+
undefined,
395+
'scrollbarZIndexOffset',
396+
ElementType.Panel,
397+
defaultPanelDependencies,
398+
orderInfo,
399+
)
393400

394401
const borderInset = computedBorderInset(propertiesSignal, scrollbarBorderPropertyKeys)
395402
createScrollbar(

packages/uikit/src/selection.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,13 @@ export function createSelection(
8181
offset: Signal<Vector2Tuple>
8282
panelSubscriptions: Subscriptions
8383
}> = []
84-
const orderInfo = computedOrderInfo(undefined, ElementType.Panel, defaultPanelDependencies, prevOrderInfo)
84+
const orderInfo = computedOrderInfo(
85+
undefined,
86+
'zIndexOffset',
87+
ElementType.Panel,
88+
defaultPanelDependencies,
89+
prevOrderInfo,
90+
)
8591
const borderInset = computedBorderInset(propertiesSignal, selectionBorderKeys)
8692

8793
initializers.push(

0 commit comments

Comments
 (0)