mirror of
https://github.com/utopia-os/utopia-ui.git
synced 2025-12-13 07:46:10 +00:00
9e6bcf1846
* removed daisy from config * removed tw-elements artefact * removed comments from tailwind config * removed safelist * migrated to tailwind4 and daisyui5 * deleted tailwind.config.js which is not eeded anymore * 3.0.79 * version number * fixed broken layouts * more fixing * more layout fixing * tested theming * small fixes * adapt snapshots to changes * package.json: add unit test update script * more ui refactoring & theme controller * ui improvements * package-lock.json * fix linting * fixed tabs * fix linting * fixed typing --------- Co-authored-by: mahula <lenzmath@posteo.de>
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
/* eslint-disable @typescript-eslint/restrict-template-expressions */
|
|
import { DomEvent } from 'leaflet'
|
|
import { createRef, useEffect } from 'react'
|
|
|
|
export const Control = ({
|
|
position,
|
|
children,
|
|
zIndex,
|
|
absolute,
|
|
}: {
|
|
position: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight'
|
|
children: React.ReactNode
|
|
zIndex: string
|
|
absolute: boolean
|
|
}) => {
|
|
const controlContainerRef = createRef<HTMLDivElement>()
|
|
|
|
useEffect(() => {
|
|
if (controlContainerRef.current !== null) {
|
|
DomEvent.disableClickPropagation(controlContainerRef.current)
|
|
DomEvent.disableScrollPropagation(controlContainerRef.current)
|
|
}
|
|
}, [controlContainerRef])
|
|
|
|
return (
|
|
<div
|
|
ref={controlContainerRef}
|
|
style={{ zIndex }}
|
|
className={`${absolute && 'tw:absolute'} tw:z-999 tw:flex-col ${position === 'topLeft' && 'tw:top-4 tw:left-4'} ${position === 'bottomLeft' && 'tw:bottom-4 tw:left-4'} ${position === 'topRight' && 'tw:bottom-4 tw:right-4'} ${position === 'bottomRight' && 'tw:bottom-4 tw:right-4'}`}
|
|
>
|
|
{children}
|
|
</div>
|
|
)
|
|
}
|