@mappedin/viewer 0.36.1-e3d997b.0 → 0.37.1-67d846e.0
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/CHANGELOG.md +15 -0
- package/dist/index.js +5459 -5432
- package/dist/types/src/components/async-image/index.d.ts +12 -0
- package/dist/types/src/components/async-image/utils.d.ts +13 -0
- package/dist/types/src/components/async-image/utils.test.d.ts +1 -0
- package/dist/types/src/lib/utils/color-utils.d.ts +5 -0
- package/package.json +1 -1
|
@@ -3,7 +3,19 @@ type TAsyncImageProps = {
|
|
|
3
3
|
alt?: string;
|
|
4
4
|
style?: React.CSSProperties;
|
|
5
5
|
role?: string;
|
|
6
|
+
onLoad?: () => void;
|
|
6
7
|
onError?: () => void;
|
|
8
|
+
/**
|
|
9
|
+
* What color to use for the background behind the image. This is only relevant if the image
|
|
10
|
+
* has transparency or if the image is given padding.
|
|
11
|
+
*
|
|
12
|
+
* - `top-left`: The color of the top left pixel of the image.
|
|
13
|
+
* - `average`: The approx. average color of all pixels in the image.
|
|
14
|
+
* - `contrast`: Either a white or dark background that maximizes contrast with the image.
|
|
15
|
+
* - `auto`: `contrast` if the top left pixel is transparent, otherwise `top-left`.
|
|
16
|
+
*/
|
|
17
|
+
imageBackgroundStyle?: 'auto' | 'top-left' | 'average' | 'contrast';
|
|
18
|
+
debug?: boolean;
|
|
7
19
|
};
|
|
8
20
|
declare const AsyncImage: React.FC<TAsyncImageProps>;
|
|
9
21
|
export default AsyncImage;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
type TUseAsyncImageOptions = Partial<{
|
|
2
|
+
onError: () => void;
|
|
3
|
+
loadingBackgroundColor: string;
|
|
4
|
+
imageBackgroundStyle: 'auto' | 'top-left' | 'average' | 'contrast';
|
|
5
|
+
}>;
|
|
6
|
+
export declare const useAsyncImage: (src?: string | string[], options?: TUseAsyncImageOptions) => {
|
|
7
|
+
loaded: boolean;
|
|
8
|
+
error: boolean;
|
|
9
|
+
initialized: boolean;
|
|
10
|
+
imgSrc: string | undefined;
|
|
11
|
+
background: string;
|
|
12
|
+
};
|
|
13
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export declare const isHex: (hex: string) => boolean;
|
|
2
2
|
export declare const hexToRGB: (hex: string) => [number, number, number];
|
|
3
|
+
export declare const hexToRGBA: (hex: string) => [number, number, number, number];
|
|
3
4
|
export declare const RGBToHex: (color: [number, number, number]) => string;
|
|
4
5
|
export declare const mixColors: (color1: string, color2: string, ratio: number) => string;
|
|
5
6
|
export declare const opacityToHex: (opacity: number) => string;
|
|
@@ -22,3 +23,7 @@ export declare const getDisabledTextOpacity: (backgroundColor: string) => 0.4 |
|
|
|
22
23
|
* the button text.
|
|
23
24
|
*/
|
|
24
25
|
export declare const getDisabledButtonColor: (buttonColor: string, backgroundColor: string) => string;
|
|
26
|
+
/**
|
|
27
|
+
* Returns true if
|
|
28
|
+
*/
|
|
29
|
+
export declare const hasTransparency: (color: string) => "#FFFFFF" | "#000000";
|