@multiplatform.one/components 0.2.17 → 0.7.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/LICENSE +201 -0
- package/dist/cjs/forms/FormCheckBox/FormCheckBox.stories.js +30 -1
- package/dist/cjs/forms/FormCheckBox/FormCheckBox.stories.js.map +1 -1
- package/dist/cjs/forms/{RadioSimple/RadioSimple.stories.js → FormProgress/FormProgress.stories.js} +18 -13
- package/dist/cjs/forms/FormProgress/FormProgress.stories.js.map +6 -0
- package/dist/cjs/forms/FormProgress/index.js +104 -0
- package/dist/cjs/forms/FormProgress/index.js.map +6 -0
- package/dist/cjs/forms/FormRadioGroup/FormRadioGroup.stories.js +3 -1
- package/dist/cjs/forms/FormRadioGroup/FormRadioGroup.stories.js.map +1 -1
- package/dist/cjs/forms/FormSlider/FormSlider.stories.js +2 -1
- package/dist/cjs/forms/FormSlider/FormSlider.stories.js.map +1 -1
- package/dist/cjs/forms/FormSwitch/FormSwitch.stories.js +11 -1
- package/dist/cjs/forms/FormSwitch/FormSwitch.stories.js.map +1 -1
- package/dist/cjs/forms/FormTextArea/FormTextArea.stories.js +11 -1
- package/dist/cjs/forms/FormTextArea/FormTextArea.stories.js.map +1 -1
- package/dist/cjs/forms/SimpleForm/SimpleForm.stories.js +16 -1
- package/dist/cjs/forms/SimpleForm/SimpleForm.stories.js.map +1 -1
- package/dist/cjs/hooks/useAssets/index.js +6 -13
- package/dist/cjs/hooks/useAssets/index.js.map +1 -1
- package/dist/cjs/hooks/useAssets/index.native.js +4 -10
- package/dist/cjs/hooks/useAssets/index.native.js.map +1 -1
- package/dist/cjs/images/SimpleImage/index.js +104 -123
- package/dist/cjs/images/SimpleImage/index.js.map +2 -2
- package/dist/cjs/images/SimpleImage/index.stories.js +26 -2
- package/dist/cjs/images/SimpleImage/index.stories.js.map +1 -1
- package/dist/cjs/images/index.js +2 -2
- package/dist/cjs/images/index.js.map +1 -1
- package/dist/cjs/organize/SimpleTabs/SimpleTabs.stories.js +54 -0
- package/dist/cjs/organize/SimpleTabs/SimpleTabs.stories.js.map +6 -0
- package/dist/cjs/organize/SimpleTabs/index.js +132 -0
- package/dist/cjs/organize/SimpleTabs/index.js.map +6 -0
- package/dist/cjs/{forms/RadioSimple/index.js → panels/SimpleToast/SimpleToast.stories.js} +23 -20
- package/dist/cjs/panels/SimpleToast/SimpleToast.stories.js.map +6 -0
- package/dist/cjs/panels/SimpleToast/index.js +59 -0
- package/dist/cjs/panels/SimpleToast/index.js.map +6 -0
- package/dist/esm/forms/FormCheckBox/FormCheckBox.stories.js +31 -2
- package/dist/esm/forms/FormCheckBox/FormCheckBox.stories.js.map +1 -1
- package/dist/esm/forms/FormProgress/FormProgress.stories.js +19 -0
- package/dist/esm/forms/FormProgress/FormProgress.stories.js.map +6 -0
- package/dist/esm/forms/FormProgress/index.js +71 -0
- package/dist/esm/forms/FormProgress/index.js.map +6 -0
- package/dist/esm/forms/FormRadioGroup/FormRadioGroup.stories.js +3 -1
- package/dist/esm/forms/FormRadioGroup/FormRadioGroup.stories.js.map +1 -1
- package/dist/esm/forms/FormSlider/FormSlider.stories.js +2 -1
- package/dist/esm/forms/FormSlider/FormSlider.stories.js.map +1 -1
- package/dist/esm/forms/FormSwitch/FormSwitch.stories.js +11 -1
- package/dist/esm/forms/FormSwitch/FormSwitch.stories.js.map +1 -1
- package/dist/esm/forms/FormTextArea/FormTextArea.stories.js +11 -1
- package/dist/esm/forms/FormTextArea/FormTextArea.stories.js.map +1 -1
- package/dist/esm/forms/SimpleForm/SimpleForm.stories.js +16 -1
- package/dist/esm/forms/SimpleForm/SimpleForm.stories.js.map +1 -1
- package/dist/esm/hooks/useAssets/index.js +6 -13
- package/dist/esm/hooks/useAssets/index.js.map +1 -1
- package/dist/esm/hooks/useAssets/index.native.js +4 -10
- package/dist/esm/hooks/useAssets/index.native.js.map +1 -1
- package/dist/esm/images/SimpleImage/index.js +106 -125
- package/dist/esm/images/SimpleImage/index.js.map +2 -2
- package/dist/esm/images/SimpleImage/index.stories.js +23 -1
- package/dist/esm/images/SimpleImage/index.stories.js.map +1 -1
- package/dist/esm/images/index.js +1 -1
- package/dist/esm/organize/SimpleTabs/SimpleTabs.stories.js +20 -0
- package/dist/esm/organize/SimpleTabs/SimpleTabs.stories.js.map +6 -0
- package/dist/esm/organize/SimpleTabs/index.js +96 -0
- package/dist/esm/organize/SimpleTabs/index.js.map +6 -0
- package/dist/esm/panels/SimpleToast/SimpleToast.stories.js +23 -0
- package/dist/esm/panels/SimpleToast/SimpleToast.stories.js.map +6 -0
- package/dist/esm/panels/SimpleToast/index.js +26 -0
- package/dist/esm/panels/SimpleToast/index.js.map +6 -0
- package/dist/jsx/forms/FormCheckBox/FormCheckBox.stories.js +24 -2
- package/dist/jsx/forms/FormCheckBox/FormCheckBox.stories.js.map +1 -1
- package/dist/jsx/forms/FormCheckBox/FormCheckBox.stories.mjs +24 -2
- package/dist/jsx/forms/FormCheckBox/FormCheckBox.stories.mjs.map +1 -1
- package/dist/jsx/forms/FormProgress/FormProgress.stories.js +18 -0
- package/dist/jsx/forms/FormProgress/FormProgress.stories.js.map +6 -0
- package/dist/jsx/forms/FormProgress/FormProgress.stories.mjs +18 -0
- package/dist/jsx/forms/FormProgress/FormProgress.stories.mjs.map +6 -0
- package/dist/jsx/forms/FormProgress/index.js +57 -0
- package/dist/jsx/forms/FormProgress/index.js.map +6 -0
- package/dist/jsx/forms/FormProgress/index.mjs +57 -0
- package/dist/jsx/forms/FormProgress/index.mjs.map +6 -0
- package/dist/jsx/forms/FormRadioGroup/FormRadioGroup.stories.js +2 -0
- package/dist/jsx/forms/FormRadioGroup/FormRadioGroup.stories.js.map +1 -1
- package/dist/jsx/forms/FormRadioGroup/FormRadioGroup.stories.mjs +2 -0
- package/dist/jsx/forms/FormRadioGroup/FormRadioGroup.stories.mjs.map +1 -1
- package/dist/jsx/forms/FormSlider/FormSlider.stories.js +2 -1
- package/dist/jsx/forms/FormSlider/FormSlider.stories.js.map +1 -1
- package/dist/jsx/forms/FormSlider/FormSlider.stories.mjs +2 -1
- package/dist/jsx/forms/FormSlider/FormSlider.stories.mjs.map +1 -1
- package/dist/jsx/forms/FormSwitch/FormSwitch.stories.js +8 -1
- package/dist/jsx/forms/FormSwitch/FormSwitch.stories.js.map +1 -1
- package/dist/jsx/forms/FormSwitch/FormSwitch.stories.mjs +8 -1
- package/dist/jsx/forms/FormSwitch/FormSwitch.stories.mjs.map +1 -1
- package/dist/jsx/forms/FormTextArea/FormTextArea.stories.js +8 -1
- package/dist/jsx/forms/FormTextArea/FormTextArea.stories.js.map +1 -1
- package/dist/jsx/forms/FormTextArea/FormTextArea.stories.mjs +8 -1
- package/dist/jsx/forms/FormTextArea/FormTextArea.stories.mjs.map +1 -1
- package/dist/jsx/forms/SimpleForm/SimpleForm.stories.js +15 -0
- package/dist/jsx/forms/SimpleForm/SimpleForm.stories.js.map +1 -1
- package/dist/jsx/forms/SimpleForm/SimpleForm.stories.mjs +15 -0
- package/dist/jsx/forms/SimpleForm/SimpleForm.stories.mjs.map +1 -1
- package/dist/jsx/hooks/useAssets/index.js +6 -13
- package/dist/jsx/hooks/useAssets/index.js.map +1 -1
- package/dist/jsx/hooks/useAssets/index.mjs +6 -13
- package/dist/jsx/hooks/useAssets/index.mjs.map +1 -1
- package/dist/jsx/hooks/useAssets/index.native.js +4 -10
- package/dist/jsx/hooks/useAssets/index.native.js.map +1 -1
- package/dist/jsx/hooks/useAssets/index.native.mjs +4 -10
- package/dist/jsx/hooks/useAssets/index.native.mjs.map +1 -1
- package/dist/jsx/images/SimpleImage/index.js +105 -119
- package/dist/jsx/images/SimpleImage/index.js.map +2 -2
- package/dist/jsx/images/SimpleImage/index.mjs +105 -119
- package/dist/jsx/images/SimpleImage/index.mjs.map +2 -2
- package/dist/jsx/images/SimpleImage/index.stories.js +21 -1
- package/dist/jsx/images/SimpleImage/index.stories.js.map +1 -1
- package/dist/jsx/images/SimpleImage/index.stories.mjs +21 -1
- package/dist/jsx/images/SimpleImage/index.stories.mjs.map +1 -1
- package/dist/jsx/images/index.js +1 -1
- package/dist/jsx/images/index.mjs +1 -1
- package/dist/jsx/organize/SimpleTabs/SimpleTabs.stories.js +41 -0
- package/dist/jsx/organize/SimpleTabs/SimpleTabs.stories.js.map +6 -0
- package/dist/jsx/organize/SimpleTabs/SimpleTabs.stories.mjs +41 -0
- package/dist/jsx/organize/SimpleTabs/SimpleTabs.stories.mjs.map +6 -0
- package/dist/jsx/organize/SimpleTabs/index.js +80 -0
- package/dist/jsx/organize/SimpleTabs/index.js.map +6 -0
- package/dist/jsx/organize/SimpleTabs/index.mjs +80 -0
- package/dist/jsx/organize/SimpleTabs/index.mjs.map +6 -0
- package/dist/jsx/panels/SimpleToast/SimpleToast.stories.js +25 -0
- package/dist/jsx/panels/SimpleToast/SimpleToast.stories.js.map +6 -0
- package/dist/jsx/panels/SimpleToast/SimpleToast.stories.mjs +25 -0
- package/dist/jsx/panels/SimpleToast/SimpleToast.stories.mjs.map +6 -0
- package/dist/jsx/panels/SimpleToast/index.js +24 -0
- package/dist/jsx/panels/SimpleToast/index.js.map +6 -0
- package/dist/jsx/panels/SimpleToast/index.mjs +24 -0
- package/dist/jsx/panels/SimpleToast/index.mjs.map +6 -0
- package/package.json +15 -13
- package/src/forms/FormCheckBox/FormCheckBox.stories.tsx +24 -4
- package/src/forms/FormProgress/FormProgress.stories.tsx +16 -0
- package/src/forms/FormProgress/index.tsx +74 -0
- package/src/forms/FormRadioGroup/FormRadioGroup.stories.tsx +2 -0
- package/src/forms/FormSlider/FormSlider.stories.tsx +2 -1
- package/src/forms/FormSwitch/FormSwitch.stories.tsx +8 -1
- package/src/forms/FormTextArea/FormTextArea.stories.tsx +8 -1
- package/src/forms/SimpleForm/SimpleForm.stories.tsx +15 -0
- package/src/hooks/useAssets/index.native.ts +8 -14
- package/src/hooks/useAssets/index.ts +8 -28
- package/src/images/SimpleImage/index.stories.tsx +26 -0
- package/src/images/SimpleImage/index.tsx +137 -162
- package/src/images/index.ts +1 -1
- package/src/organize/SimpleTabs/SimpleTabs.stories.tsx +63 -0
- package/src/organize/SimpleTabs/index.tsx +118 -0
- package/src/panels/SimpleToast/SimpleToast.stories.tsx +27 -0
- package/src/panels/SimpleToast/index.tsx +27 -0
- package/types/code/Code/index.d.ts +49 -15
- package/types/code/Code/index.d.ts.map +1 -1
- package/types/code/Pre/index.d.ts +16 -7
- package/types/code/Pre/index.d.ts.map +1 -1
- package/types/forms/FormCheckBox/FormCheckBox.stories.d.ts.map +1 -1
- package/types/forms/FormProgress/FormProgress.stories.d.ts +15 -0
- package/types/forms/FormProgress/FormProgress.stories.d.ts.map +1 -0
- package/types/forms/FormProgress/index.d.ts +11 -0
- package/types/forms/FormProgress/index.d.ts.map +1 -0
- package/types/forms/FormRadioGroup/FormRadioGroup.stories.d.ts.map +1 -1
- package/types/forms/FormSlider/FormSlider.stories.d.ts.map +1 -1
- package/types/forms/FormSwitch/FormSwitch.stories.d.ts.map +1 -1
- package/types/forms/FormTextArea/FormTextArea.stories.d.ts.map +1 -1
- package/types/forms/SimpleForm/SimpleForm.stories.d.ts.map +1 -1
- package/types/hooks/useAssets/index.d.ts +2 -3
- package/types/hooks/useAssets/index.d.ts.map +1 -1
- package/types/hooks/useAssets/index.native.d.ts +2 -2
- package/types/hooks/useAssets/index.native.d.ts.map +1 -1
- package/types/images/SimpleImage/index.d.ts +15 -22
- package/types/images/SimpleImage/index.d.ts.map +1 -1
- package/types/images/SimpleImage/index.stories.d.ts +8 -2
- package/types/images/SimpleImage/index.stories.d.ts.map +1 -1
- package/types/images/SvgUri/index.native.d.ts +5 -5
- package/types/images/index.d.ts +1 -1
- package/types/images/index.d.ts.map +1 -1
- package/types/mdx/LI/LI.stories.d.ts +29 -12
- package/types/mdx/LI/LI.stories.d.ts.map +1 -1
- package/types/mdx/LI/index.d.ts +29 -12
- package/types/mdx/LI/index.d.ts.map +1 -1
- package/types/mdx/UL/UL.stories.d.ts +16 -7
- package/types/mdx/UL/UL.stories.d.ts.map +1 -1
- package/types/mdx/UL/index.d.ts +16 -7
- package/types/mdx/UL/index.d.ts.map +1 -1
- package/types/mdx/components.d.ts +16 -7
- package/types/mdx/components.d.ts.map +1 -1
- package/types/organize/SimpleTabs/SimpleTabs.stories.d.ts +15 -0
- package/types/organize/SimpleTabs/SimpleTabs.stories.d.ts.map +1 -0
- package/types/organize/SimpleTabs/index.d.ts +21 -0
- package/types/organize/SimpleTabs/index.d.ts.map +1 -0
- package/types/{forms/RadioSimple/RadioSimple.stories.d.ts → panels/SimpleToast/SimpleToast.stories.d.ts} +4 -4
- package/types/panels/SimpleToast/SimpleToast.stories.d.ts.map +1 -0
- package/types/panels/SimpleToast/index.d.ts +3 -0
- package/types/panels/SimpleToast/index.d.ts.map +1 -0
- package/types/table/Table/Table.stories.d.ts +51 -10
- package/types/table/Table/Table.stories.d.ts.map +1 -1
- package/types/table/Table/index.d.ts +51 -10
- package/types/table/Table/index.d.ts.map +1 -1
- package/types/table/TableCell/index.d.ts +20 -3
- package/types/table/TableCell/index.d.ts.map +1 -1
- package/types/table/TableCol/index.d.ts +31 -7
- package/types/table/TableCol/index.d.ts.map +1 -1
- package/dist/cjs/forms/RadioSimple/RadioSimple.stories.js.map +0 -6
- package/dist/cjs/forms/RadioSimple/index.js.map +0 -6
- package/dist/cjs/hooks/useAssets/types.js +0 -16
- package/dist/cjs/hooks/useAssets/types.js.map +0 -6
- package/dist/esm/forms/RadioSimple/RadioSimple.stories.js +0 -15
- package/dist/esm/forms/RadioSimple/RadioSimple.stories.js.map +0 -6
- package/dist/esm/forms/RadioSimple/index.js +0 -20
- package/dist/esm/forms/RadioSimple/index.js.map +0 -6
- package/dist/esm/hooks/useAssets/types.js +0 -1
- package/dist/esm/hooks/useAssets/types.js.map +0 -6
- package/dist/jsx/forms/RadioSimple/RadioSimple.stories.js +0 -14
- package/dist/jsx/forms/RadioSimple/RadioSimple.stories.js.map +0 -6
- package/dist/jsx/forms/RadioSimple/RadioSimple.stories.mjs +0 -14
- package/dist/jsx/forms/RadioSimple/RadioSimple.stories.mjs.map +0 -6
- package/dist/jsx/forms/RadioSimple/index.js +0 -26
- package/dist/jsx/forms/RadioSimple/index.js.map +0 -6
- package/dist/jsx/forms/RadioSimple/index.mjs +0 -26
- package/dist/jsx/forms/RadioSimple/index.mjs.map +0 -6
- package/dist/jsx/hooks/useAssets/types.js +0 -1
- package/dist/jsx/hooks/useAssets/types.js.map +0 -6
- package/dist/jsx/hooks/useAssets/types.mjs +0 -1
- package/dist/jsx/hooks/useAssets/types.mjs.map +0 -6
- package/src/forms/RadioSimple/RadioSimple.stories.tsx +0 -12
- package/src/forms/RadioSimple/index.tsx +0 -42
- package/src/hooks/useAssets/types.ts +0 -3
- package/types/forms/RadioSimple/RadioSimple.stories.d.ts.map +0 -1
- package/types/forms/RadioSimple/index.d.ts +0 -8
- package/types/forms/RadioSimple/index.d.ts.map +0 -1
- package/types/hooks/useAssets/types.d.ts +0 -3
- package/types/hooks/useAssets/types.d.ts.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/hooks/useAssets/index.native.ts"],
|
|
4
|
-
"mappings": "AAEA,SAAS,aAAa,qBAAqB;AAE3C,MAAM,SAAS;AAER,SAAS,UAAU,
|
|
4
|
+
"mappings": "AAEA,SAAS,aAAa,qBAAqB;AAE3C,MAAM,SAAS;AAER,SAAS,UAAU,SAAuD;AAC/E,QAAM,cAAc,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC,WAAgB;AACrF,QAAI,OAAO,OAAO,YAAY;AAAa,aAAO,OAAO;AACzD,WAAO;AAAA,EACT,CAAC;AACD,QAAM,CAAC,QAAQ,GAAG,IAAI,cAAc,UAAU;AAC9C,MAAI;AAAK,WAAO,MAAM,GAAG;AACzB,MAAI,CAAC;AAAQ,WAAO,IAAI,MAAM,WAAW,MAAM;AAC/C,SAAO,OAAO,IAAI,CAAC,WAAkB;AAAA,IACnC,QAAQ,MAAM;AAAA,IACd,KAAK,MAAM;AAAA,IACX,OAAO,MAAM;AAAA,EACf,EAAE;AACJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -1,124 +1,110 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { XMLParser } from "fast-xml-parser";
|
|
6
|
-
import { YStack, Image } from "tamagui";
|
|
1
|
+
import { useMemo, forwardRef, useRef } from "react";
|
|
2
|
+
import { SolitoImage } from "solito/image";
|
|
3
|
+
import { Stack, createComponent } from "tamagui";
|
|
4
|
+
import { StyleSheet } from "react-native";
|
|
7
5
|
import { useAssets } from "../../hooks/useAssets";
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
6
|
+
const SimpleImageComponent = forwardRef(
|
|
7
|
+
({
|
|
8
|
+
alt,
|
|
9
|
+
blurDataURL,
|
|
10
|
+
contentFit,
|
|
11
|
+
contentPosition,
|
|
12
|
+
crossOrigin,
|
|
13
|
+
height,
|
|
14
|
+
loader,
|
|
15
|
+
loading,
|
|
16
|
+
onLayout,
|
|
17
|
+
onLoadingComplete,
|
|
18
|
+
placeholder,
|
|
19
|
+
priority,
|
|
20
|
+
quality,
|
|
21
|
+
aspectRatio,
|
|
22
|
+
referrerPolicy,
|
|
23
|
+
resizeMode,
|
|
24
|
+
sizes,
|
|
25
|
+
src,
|
|
26
|
+
unoptimized,
|
|
27
|
+
width,
|
|
28
|
+
...props
|
|
29
|
+
}, ref) => {
|
|
30
|
+
const parentRef = useRef();
|
|
31
|
+
const style = StyleSheet.flatten(props.style || {});
|
|
32
|
+
let asset;
|
|
33
|
+
if (typeof src === "number")
|
|
34
|
+
[asset] = useAssets([src]);
|
|
35
|
+
const staticImageData = useMemo(() => {
|
|
36
|
+
if (typeof src === "string")
|
|
37
|
+
return;
|
|
38
|
+
if (typeof src === "number")
|
|
39
|
+
return asset;
|
|
40
|
+
return src?.default || src;
|
|
41
|
+
}, [asset, src]);
|
|
42
|
+
const mAspectRatio = useMemo(() => {
|
|
43
|
+
const sAspectRatio = aspectRatio || style.aspectRatio;
|
|
44
|
+
if (typeof sAspectRatio === "string") {
|
|
45
|
+
const [width2, height2] = sAspectRatio.split(":");
|
|
46
|
+
return parseInt(width2, 10) / parseInt(height2, 10);
|
|
47
|
+
}
|
|
48
|
+
return sAspectRatio;
|
|
49
|
+
}, [aspectRatio, style.aspectRatio]);
|
|
50
|
+
const solitoHeight = useMemo(() => {
|
|
51
|
+
if (typeof height === "string")
|
|
52
|
+
return;
|
|
53
|
+
if (typeof height === "number")
|
|
54
|
+
return height;
|
|
55
|
+
const w = typeof width === "number" ? width : typeof style.width !== "undefined" ? typeof style.width === "number" ? style.width : void 0 : staticImageData?.width;
|
|
56
|
+
if (typeof w === "number" && typeof mAspectRatio === "number")
|
|
57
|
+
return w / mAspectRatio;
|
|
58
|
+
return staticImageData?.height;
|
|
59
|
+
}, [mAspectRatio, staticImageData?.width, staticImageData?.height, style.width, style.height, width, height]);
|
|
60
|
+
const solitoWidth = useMemo(() => {
|
|
61
|
+
if (typeof width === "string")
|
|
62
|
+
return;
|
|
63
|
+
if (typeof width === "number")
|
|
64
|
+
return width;
|
|
65
|
+
const h = typeof height === "number" ? height : typeof style.height !== "undefined" ? typeof style.height === "number" ? style.height : void 0 : staticImageData?.height;
|
|
66
|
+
if (typeof h === "number" && typeof mAspectRatio === "number")
|
|
67
|
+
return h * mAspectRatio;
|
|
68
|
+
return staticImageData?.width;
|
|
69
|
+
}, [mAspectRatio, staticImageData?.width, staticImageData?.height, style.width, style.height, width, height]);
|
|
70
|
+
const fill = useMemo(() => {
|
|
71
|
+
if (typeof solitoWidth === "undefined" || typeof solitoHeight === "undefined") {
|
|
72
|
+
return true;
|
|
73
|
+
}
|
|
74
|
+
return false;
|
|
75
|
+
}, [solitoWidth, solitoHeight]);
|
|
76
|
+
return <Stack {...props} aspectRatio={aspectRatio} width={width} height={height} ref={parentRef}>{src && <SolitoImage
|
|
77
|
+
alt={alt || ""}
|
|
78
|
+
blurDataURL={blurDataURL}
|
|
79
|
+
contentFit={contentFit}
|
|
80
|
+
contentPosition={contentPosition}
|
|
81
|
+
crossOrigin={crossOrigin}
|
|
82
|
+
fill={fill}
|
|
83
|
+
height={fill ? void 0 : solitoHeight}
|
|
84
|
+
loader={loader}
|
|
85
|
+
loading={loading}
|
|
86
|
+
onLayout={onLayout}
|
|
87
|
+
onLoadingComplete={onLoadingComplete}
|
|
88
|
+
placeholder={placeholder}
|
|
89
|
+
priority={priority}
|
|
90
|
+
quality={quality}
|
|
91
|
+
ref={ref}
|
|
92
|
+
referrerPolicy={referrerPolicy}
|
|
93
|
+
resizeMode={resizeMode}
|
|
94
|
+
sizes={sizes}
|
|
95
|
+
src={src}
|
|
96
|
+
unoptimized={unoptimized}
|
|
97
|
+
width={fill ? void 0 : solitoWidth}
|
|
98
|
+
/>}</Stack>;
|
|
14
99
|
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
width = height * aspectRatio;
|
|
24
|
-
}
|
|
25
|
-
if (Number.isFinite(height) && Number.isFinite(width))
|
|
26
|
-
aspectRatio = void 0;
|
|
27
|
-
const isSvg = svg || (src?.type === "svg" || origin?.substring(origin.length - 4) === ".svg") && typeof svg === "undefined";
|
|
28
|
-
useEffect(() => {
|
|
29
|
-
if (Platform.OS !== "web" && isSvg) {
|
|
30
|
-
(async () => {
|
|
31
|
-
const meta = await getSvgMeta(uri);
|
|
32
|
-
const height2 = Number.isFinite(meta.height) ? meta.height : meta.viewBox?.[3];
|
|
33
|
-
const width2 = Number.isFinite(meta.width) ? meta.width : meta.viewBox?.[2];
|
|
34
|
-
if (typeof height2 === "number" && Number.isFinite(height2) && typeof width2 === "number" && Number.isFinite(width2)) {
|
|
35
|
-
setImageAspectRatio(width2 / height2);
|
|
36
|
-
}
|
|
37
|
-
})();
|
|
38
|
-
} else if (typeof uri !== "number" && uri) {
|
|
39
|
-
RNImage.getSize(uri, (width2, height2) => {
|
|
40
|
-
const ratio = width2 / height2;
|
|
41
|
-
if (Number.isFinite(ratio))
|
|
42
|
-
setImageAspectRatio(ratio);
|
|
43
|
-
});
|
|
44
|
-
}
|
|
45
|
-
}, [uri]);
|
|
46
|
-
if (!uri) {
|
|
47
|
-
return <YStack {...imageProps} width={width} height={height} aspectRatio={aspectRatio} />;
|
|
48
|
-
}
|
|
49
|
-
if (!MultiPlatform.isWeb && isSvg) {
|
|
50
|
-
return <SvgUri
|
|
51
|
-
{...imageProps}
|
|
52
|
-
width={Number.isFinite(width) ? width : Number.isFinite(height) ? void 0 : "100%"}
|
|
53
|
-
height={height}
|
|
54
|
-
preserveAspectRatio={preserveAspectRatio}
|
|
55
|
-
aspectRatio={aspectRatio}
|
|
56
|
-
uri={uri}
|
|
57
|
-
/>;
|
|
58
|
-
}
|
|
59
|
-
return <Image
|
|
60
|
-
zIndex={void 0}
|
|
61
|
-
{...imageProps}
|
|
62
|
-
width={width}
|
|
63
|
-
height={height}
|
|
64
|
-
aspectRatio={aspectRatio}
|
|
65
|
-
resizeMode={resizeMode}
|
|
66
|
-
source={{ uri }}
|
|
67
|
-
/>;
|
|
68
|
-
}
|
|
69
|
-
SimpleImage.defaultProps = {
|
|
70
|
-
resizeMode: "cover"
|
|
71
|
-
};
|
|
72
|
-
function getPreserveAspectRatio(resizeMode) {
|
|
73
|
-
switch (resizeMode) {
|
|
74
|
-
case "stretch": {
|
|
75
|
-
return "none";
|
|
76
|
-
}
|
|
77
|
-
case "contain": {
|
|
78
|
-
return "xMidYMid meet";
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
return "xMidYMid slice";
|
|
82
|
-
}
|
|
83
|
-
const logger = console;
|
|
84
|
-
const parser = new XMLParser({
|
|
85
|
-
ignoreAttributes: false,
|
|
86
|
-
attributeNamePrefix: "@_",
|
|
87
|
-
allowBooleanAttributes: true
|
|
88
|
-
});
|
|
89
|
-
async function getSvgMeta(uri) {
|
|
90
|
-
const meta = {};
|
|
91
|
-
if (Platform.OS === "web" || typeof uri === "number" || !uri)
|
|
92
|
-
return meta;
|
|
93
|
-
const res = await fetch(uri);
|
|
94
|
-
try {
|
|
95
|
-
const xml = parser.parse(await res.text());
|
|
96
|
-
const width = parseInt(xml?.svg?.["@_width"], 10);
|
|
97
|
-
const height = parseInt(xml?.svg?.["@_height"], 10);
|
|
98
|
-
const viewBox = xml?.svg?.["@_viewBox"]?.toString().split(" ").reduce(
|
|
99
|
-
(viewBox2, itemStr, i) => {
|
|
100
|
-
if (!viewBox2)
|
|
101
|
-
return {};
|
|
102
|
-
const itemNum = parseInt(itemStr, 10);
|
|
103
|
-
if (!Number.isFinite(itemNum))
|
|
104
|
-
return {};
|
|
105
|
-
viewBox2[i] = itemNum;
|
|
106
|
-
return viewBox2;
|
|
107
|
-
},
|
|
108
|
-
[0, 0, 0, 0]
|
|
109
|
-
);
|
|
110
|
-
if (typeof width === "number" && Number.isFinite(width))
|
|
111
|
-
meta.width = width;
|
|
112
|
-
if (typeof height === "number" && Number.isFinite(height))
|
|
113
|
-
meta.height = height;
|
|
114
|
-
if (viewBox)
|
|
115
|
-
meta.viewBox = viewBox;
|
|
116
|
-
return meta;
|
|
117
|
-
} catch (err) {
|
|
118
|
-
logger.error(err);
|
|
119
|
-
}
|
|
120
|
-
return meta;
|
|
121
|
-
}
|
|
100
|
+
);
|
|
101
|
+
const SimpleImage = createComponent(
|
|
102
|
+
{
|
|
103
|
+
Component: SimpleImageComponent,
|
|
104
|
+
acceptsClassName: true
|
|
105
|
+
},
|
|
106
|
+
SimpleImageComponent
|
|
107
|
+
);
|
|
122
108
|
export {
|
|
123
109
|
SimpleImage
|
|
124
110
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/images/SimpleImage/index.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAgB,
|
|
5
|
-
"names": ["
|
|
4
|
+
"mappings": "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",
|
|
5
|
+
"names": ["width", "height"]
|
|
6
6
|
}
|
|
@@ -1,124 +1,110 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { XMLParser } from "fast-xml-parser";
|
|
6
|
-
import { YStack, Image } from "tamagui";
|
|
1
|
+
import { useMemo, forwardRef, useRef } from "react";
|
|
2
|
+
import { SolitoImage } from "solito/image";
|
|
3
|
+
import { Stack, createComponent } from "tamagui";
|
|
4
|
+
import { StyleSheet } from "react-native";
|
|
7
5
|
import { useAssets } from "../../hooks/useAssets";
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
6
|
+
const SimpleImageComponent = forwardRef(
|
|
7
|
+
({
|
|
8
|
+
alt,
|
|
9
|
+
blurDataURL,
|
|
10
|
+
contentFit,
|
|
11
|
+
contentPosition,
|
|
12
|
+
crossOrigin,
|
|
13
|
+
height,
|
|
14
|
+
loader,
|
|
15
|
+
loading,
|
|
16
|
+
onLayout,
|
|
17
|
+
onLoadingComplete,
|
|
18
|
+
placeholder,
|
|
19
|
+
priority,
|
|
20
|
+
quality,
|
|
21
|
+
aspectRatio,
|
|
22
|
+
referrerPolicy,
|
|
23
|
+
resizeMode,
|
|
24
|
+
sizes,
|
|
25
|
+
src,
|
|
26
|
+
unoptimized,
|
|
27
|
+
width,
|
|
28
|
+
...props
|
|
29
|
+
}, ref) => {
|
|
30
|
+
const parentRef = useRef();
|
|
31
|
+
const style = StyleSheet.flatten(props.style || {});
|
|
32
|
+
let asset;
|
|
33
|
+
if (typeof src === "number")
|
|
34
|
+
[asset] = useAssets([src]);
|
|
35
|
+
const staticImageData = useMemo(() => {
|
|
36
|
+
if (typeof src === "string")
|
|
37
|
+
return;
|
|
38
|
+
if (typeof src === "number")
|
|
39
|
+
return asset;
|
|
40
|
+
return src?.default || src;
|
|
41
|
+
}, [asset, src]);
|
|
42
|
+
const mAspectRatio = useMemo(() => {
|
|
43
|
+
const sAspectRatio = aspectRatio || style.aspectRatio;
|
|
44
|
+
if (typeof sAspectRatio === "string") {
|
|
45
|
+
const [width2, height2] = sAspectRatio.split(":");
|
|
46
|
+
return parseInt(width2, 10) / parseInt(height2, 10);
|
|
47
|
+
}
|
|
48
|
+
return sAspectRatio;
|
|
49
|
+
}, [aspectRatio, style.aspectRatio]);
|
|
50
|
+
const solitoHeight = useMemo(() => {
|
|
51
|
+
if (typeof height === "string")
|
|
52
|
+
return;
|
|
53
|
+
if (typeof height === "number")
|
|
54
|
+
return height;
|
|
55
|
+
const w = typeof width === "number" ? width : typeof style.width !== "undefined" ? typeof style.width === "number" ? style.width : void 0 : staticImageData?.width;
|
|
56
|
+
if (typeof w === "number" && typeof mAspectRatio === "number")
|
|
57
|
+
return w / mAspectRatio;
|
|
58
|
+
return staticImageData?.height;
|
|
59
|
+
}, [mAspectRatio, staticImageData?.width, staticImageData?.height, style.width, style.height, width, height]);
|
|
60
|
+
const solitoWidth = useMemo(() => {
|
|
61
|
+
if (typeof width === "string")
|
|
62
|
+
return;
|
|
63
|
+
if (typeof width === "number")
|
|
64
|
+
return width;
|
|
65
|
+
const h = typeof height === "number" ? height : typeof style.height !== "undefined" ? typeof style.height === "number" ? style.height : void 0 : staticImageData?.height;
|
|
66
|
+
if (typeof h === "number" && typeof mAspectRatio === "number")
|
|
67
|
+
return h * mAspectRatio;
|
|
68
|
+
return staticImageData?.width;
|
|
69
|
+
}, [mAspectRatio, staticImageData?.width, staticImageData?.height, style.width, style.height, width, height]);
|
|
70
|
+
const fill = useMemo(() => {
|
|
71
|
+
if (typeof solitoWidth === "undefined" || typeof solitoHeight === "undefined") {
|
|
72
|
+
return true;
|
|
73
|
+
}
|
|
74
|
+
return false;
|
|
75
|
+
}, [solitoWidth, solitoHeight]);
|
|
76
|
+
return <Stack {...props} aspectRatio={aspectRatio} width={width} height={height} ref={parentRef}>{src && <SolitoImage
|
|
77
|
+
alt={alt || ""}
|
|
78
|
+
blurDataURL={blurDataURL}
|
|
79
|
+
contentFit={contentFit}
|
|
80
|
+
contentPosition={contentPosition}
|
|
81
|
+
crossOrigin={crossOrigin}
|
|
82
|
+
fill={fill}
|
|
83
|
+
height={fill ? void 0 : solitoHeight}
|
|
84
|
+
loader={loader}
|
|
85
|
+
loading={loading}
|
|
86
|
+
onLayout={onLayout}
|
|
87
|
+
onLoadingComplete={onLoadingComplete}
|
|
88
|
+
placeholder={placeholder}
|
|
89
|
+
priority={priority}
|
|
90
|
+
quality={quality}
|
|
91
|
+
ref={ref}
|
|
92
|
+
referrerPolicy={referrerPolicy}
|
|
93
|
+
resizeMode={resizeMode}
|
|
94
|
+
sizes={sizes}
|
|
95
|
+
src={src}
|
|
96
|
+
unoptimized={unoptimized}
|
|
97
|
+
width={fill ? void 0 : solitoWidth}
|
|
98
|
+
/>}</Stack>;
|
|
14
99
|
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
width = height * aspectRatio;
|
|
24
|
-
}
|
|
25
|
-
if (Number.isFinite(height) && Number.isFinite(width))
|
|
26
|
-
aspectRatio = void 0;
|
|
27
|
-
const isSvg = svg || (src?.type === "svg" || origin?.substring(origin.length - 4) === ".svg") && typeof svg === "undefined";
|
|
28
|
-
useEffect(() => {
|
|
29
|
-
if (Platform.OS !== "web" && isSvg) {
|
|
30
|
-
(async () => {
|
|
31
|
-
const meta = await getSvgMeta(uri);
|
|
32
|
-
const height2 = Number.isFinite(meta.height) ? meta.height : meta.viewBox?.[3];
|
|
33
|
-
const width2 = Number.isFinite(meta.width) ? meta.width : meta.viewBox?.[2];
|
|
34
|
-
if (typeof height2 === "number" && Number.isFinite(height2) && typeof width2 === "number" && Number.isFinite(width2)) {
|
|
35
|
-
setImageAspectRatio(width2 / height2);
|
|
36
|
-
}
|
|
37
|
-
})();
|
|
38
|
-
} else if (typeof uri !== "number" && uri) {
|
|
39
|
-
RNImage.getSize(uri, (width2, height2) => {
|
|
40
|
-
const ratio = width2 / height2;
|
|
41
|
-
if (Number.isFinite(ratio))
|
|
42
|
-
setImageAspectRatio(ratio);
|
|
43
|
-
});
|
|
44
|
-
}
|
|
45
|
-
}, [uri]);
|
|
46
|
-
if (!uri) {
|
|
47
|
-
return <YStack {...imageProps} width={width} height={height} aspectRatio={aspectRatio} />;
|
|
48
|
-
}
|
|
49
|
-
if (!MultiPlatform.isWeb && isSvg) {
|
|
50
|
-
return <SvgUri
|
|
51
|
-
{...imageProps}
|
|
52
|
-
width={Number.isFinite(width) ? width : Number.isFinite(height) ? void 0 : "100%"}
|
|
53
|
-
height={height}
|
|
54
|
-
preserveAspectRatio={preserveAspectRatio}
|
|
55
|
-
aspectRatio={aspectRatio}
|
|
56
|
-
uri={uri}
|
|
57
|
-
/>;
|
|
58
|
-
}
|
|
59
|
-
return <Image
|
|
60
|
-
zIndex={void 0}
|
|
61
|
-
{...imageProps}
|
|
62
|
-
width={width}
|
|
63
|
-
height={height}
|
|
64
|
-
aspectRatio={aspectRatio}
|
|
65
|
-
resizeMode={resizeMode}
|
|
66
|
-
source={{ uri }}
|
|
67
|
-
/>;
|
|
68
|
-
}
|
|
69
|
-
SimpleImage.defaultProps = {
|
|
70
|
-
resizeMode: "cover"
|
|
71
|
-
};
|
|
72
|
-
function getPreserveAspectRatio(resizeMode) {
|
|
73
|
-
switch (resizeMode) {
|
|
74
|
-
case "stretch": {
|
|
75
|
-
return "none";
|
|
76
|
-
}
|
|
77
|
-
case "contain": {
|
|
78
|
-
return "xMidYMid meet";
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
return "xMidYMid slice";
|
|
82
|
-
}
|
|
83
|
-
const logger = console;
|
|
84
|
-
const parser = new XMLParser({
|
|
85
|
-
ignoreAttributes: false,
|
|
86
|
-
attributeNamePrefix: "@_",
|
|
87
|
-
allowBooleanAttributes: true
|
|
88
|
-
});
|
|
89
|
-
async function getSvgMeta(uri) {
|
|
90
|
-
const meta = {};
|
|
91
|
-
if (Platform.OS === "web" || typeof uri === "number" || !uri)
|
|
92
|
-
return meta;
|
|
93
|
-
const res = await fetch(uri);
|
|
94
|
-
try {
|
|
95
|
-
const xml = parser.parse(await res.text());
|
|
96
|
-
const width = parseInt(xml?.svg?.["@_width"], 10);
|
|
97
|
-
const height = parseInt(xml?.svg?.["@_height"], 10);
|
|
98
|
-
const viewBox = xml?.svg?.["@_viewBox"]?.toString().split(" ").reduce(
|
|
99
|
-
(viewBox2, itemStr, i) => {
|
|
100
|
-
if (!viewBox2)
|
|
101
|
-
return {};
|
|
102
|
-
const itemNum = parseInt(itemStr, 10);
|
|
103
|
-
if (!Number.isFinite(itemNum))
|
|
104
|
-
return {};
|
|
105
|
-
viewBox2[i] = itemNum;
|
|
106
|
-
return viewBox2;
|
|
107
|
-
},
|
|
108
|
-
[0, 0, 0, 0]
|
|
109
|
-
);
|
|
110
|
-
if (typeof width === "number" && Number.isFinite(width))
|
|
111
|
-
meta.width = width;
|
|
112
|
-
if (typeof height === "number" && Number.isFinite(height))
|
|
113
|
-
meta.height = height;
|
|
114
|
-
if (viewBox)
|
|
115
|
-
meta.viewBox = viewBox;
|
|
116
|
-
return meta;
|
|
117
|
-
} catch (err) {
|
|
118
|
-
logger.error(err);
|
|
119
|
-
}
|
|
120
|
-
return meta;
|
|
121
|
-
}
|
|
100
|
+
);
|
|
101
|
+
const SimpleImage = createComponent(
|
|
102
|
+
{
|
|
103
|
+
Component: SimpleImageComponent,
|
|
104
|
+
acceptsClassName: true
|
|
105
|
+
},
|
|
106
|
+
SimpleImageComponent
|
|
107
|
+
);
|
|
122
108
|
export {
|
|
123
109
|
SimpleImage
|
|
124
110
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/images/SimpleImage/index.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAgB,
|
|
5
|
-
"names": ["
|
|
4
|
+
"mappings": "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",
|
|
5
|
+
"names": ["width", "height"]
|
|
6
6
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Platform } from "react-native";
|
|
2
2
|
import { useAssets } from "../../hooks";
|
|
3
3
|
import { SimpleImage } from "./index";
|
|
4
|
+
import { YStack } from "tamagui";
|
|
4
5
|
var index_stories_default = {
|
|
5
6
|
title: "images/SimpleImage",
|
|
6
7
|
component: SimpleImage,
|
|
@@ -45,11 +46,30 @@ function WithRequire() {
|
|
|
45
46
|
/>;
|
|
46
47
|
}
|
|
47
48
|
const withRequire = () => <WithRequire />;
|
|
49
|
+
const withYStack = () => <YStack>
|
|
50
|
+
<YStack width="50%" height={200} bg="red" />
|
|
51
|
+
<YStack width="50%" height={200} bg="blue" />
|
|
52
|
+
<SimpleImage
|
|
53
|
+
bg="green"
|
|
54
|
+
height={200}
|
|
55
|
+
resizeMode="stretch"
|
|
56
|
+
src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a8/Inukshuk_Park_05.jpg/500px-Inukshuk_Park_05.jpg"
|
|
57
|
+
width="50%"
|
|
58
|
+
/>
|
|
59
|
+
</YStack>;
|
|
60
|
+
const withTamagui = () => <YStack><SimpleImage
|
|
61
|
+
bg="$green9"
|
|
62
|
+
h="$19"
|
|
63
|
+
src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a8/Inukshuk_Park_05.jpg/500px-Inukshuk_Park_05.jpg"
|
|
64
|
+
w="100%"
|
|
65
|
+
/></YStack>;
|
|
48
66
|
export {
|
|
49
67
|
index_stories_default as default,
|
|
50
68
|
main,
|
|
51
69
|
withRequire,
|
|
52
70
|
withSvg,
|
|
53
|
-
|
|
71
|
+
withTamagui,
|
|
72
|
+
withUseAssets,
|
|
73
|
+
withYStack
|
|
54
74
|
};
|
|
55
75
|
//# sourceMappingURL=index.stories.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/images/SimpleImage/index.stories.tsx"],
|
|
4
|
-
"mappings": "AACA,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;
|
|
4
|
+
"mappings": "AACA,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AAEvB,IAAO,wBAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACV,QAAQ,EAAE,MAAM,OAAO;AAAA,EACzB;AACF;AAEO,MAAM,OAAO,CAAC,SAAgB,CAAC,YAAY,KAAK,QAAQ,qCAAqC,OAAO,MAAM;AACjH,KAAK,OAAO;AAAA,EACV,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,IAAI;AACN;AAEO,MAAM,UAAU,CAAC,SAAgB,CAAC,YAAY,KAAK,QAAQ,8BAA8B,OAAO,MAAM;AAC7G,QAAQ,OAAO;AAAA,EACb,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,YAAY;AACd;AACA,QAAQ,WAAW;AAAA,EACjB,YAAY;AAAA,IACV,SAAS;AAAA,MACP,MAAM,SAAS,OAAO,QAAQ,WAAW;AAAA,MACzC,SAAS,CAAC,WAAW,SAAS,SAAS;AAAA,IACzC;AAAA,EACF;AACF;AAEA,SAAS,gBAAgB;AACvB,QAAM,CAAC,gBAAgB,IAAI,UAAU,CAAC,QAAQ,qCAAqC,CAAC,CAAC;AACrF,SAAO,CAAC,YAAY,OAAO,KAAK,QAAQ,KAAK,gBAAgB,QAAQ,KAAK,kBAAkB;AAC9F;AACO,MAAM,gBAAgB,MAAM,CAAC,cAAc;AAElD,SAAS,cAAc;AACrB,SACE,CAAC;AAAA,IACC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,gBAAgB;AAAA,IAChB,KAAK,QAAQ,qCAAqC;AAAA,EACpD;AAEJ;AACO,MAAM,cAAc,MAAM,CAAC,YAAY;AAEvC,MAAM,aAAa,MACxB,CAAC;AAAA,EACC,CAAC,OAAO,MAAM,MAAM,QAAQ,KAAK,GAAG,MAAM;AAAA,EAC1C,CAAC,OAAO,MAAM,MAAM,QAAQ,KAAK,GAAG,OAAO;AAAA,EAC3C,CAAC;AAAA,IACC,GAAG;AAAA,IACH,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,EACR;AACF,EAVC;AAaI,MAAM,cAAc,MACzB,CAAC,OACC,CAAC;AAAA,EACC,GAAG;AAAA,EACH,EAAE;AAAA,EACF,IAAI;AAAA,EACJ,EAAE;AACJ,EACF,EAPC;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Platform } from "react-native";
|
|
2
2
|
import { useAssets } from "../../hooks";
|
|
3
3
|
import { SimpleImage } from "./index";
|
|
4
|
+
import { YStack } from "tamagui";
|
|
4
5
|
var index_stories_default = {
|
|
5
6
|
title: "images/SimpleImage",
|
|
6
7
|
component: SimpleImage,
|
|
@@ -45,11 +46,30 @@ function WithRequire() {
|
|
|
45
46
|
/>;
|
|
46
47
|
}
|
|
47
48
|
const withRequire = () => <WithRequire />;
|
|
49
|
+
const withYStack = () => <YStack>
|
|
50
|
+
<YStack width="50%" height={200} bg="red" />
|
|
51
|
+
<YStack width="50%" height={200} bg="blue" />
|
|
52
|
+
<SimpleImage
|
|
53
|
+
bg="green"
|
|
54
|
+
height={200}
|
|
55
|
+
resizeMode="stretch"
|
|
56
|
+
src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a8/Inukshuk_Park_05.jpg/500px-Inukshuk_Park_05.jpg"
|
|
57
|
+
width="50%"
|
|
58
|
+
/>
|
|
59
|
+
</YStack>;
|
|
60
|
+
const withTamagui = () => <YStack><SimpleImage
|
|
61
|
+
bg="$green9"
|
|
62
|
+
h="$19"
|
|
63
|
+
src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a8/Inukshuk_Park_05.jpg/500px-Inukshuk_Park_05.jpg"
|
|
64
|
+
w="100%"
|
|
65
|
+
/></YStack>;
|
|
48
66
|
export {
|
|
49
67
|
index_stories_default as default,
|
|
50
68
|
main,
|
|
51
69
|
withRequire,
|
|
52
70
|
withSvg,
|
|
53
|
-
|
|
71
|
+
withTamagui,
|
|
72
|
+
withUseAssets,
|
|
73
|
+
withYStack
|
|
54
74
|
};
|
|
55
75
|
//# sourceMappingURL=index.stories.mjs.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/images/SimpleImage/index.stories.tsx"],
|
|
4
|
-
"mappings": "AACA,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;
|
|
4
|
+
"mappings": "AACA,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AAEvB,IAAO,wBAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACV,QAAQ,EAAE,MAAM,OAAO;AAAA,EACzB;AACF;AAEO,MAAM,OAAO,CAAC,SAAgB,CAAC,YAAY,KAAK,QAAQ,qCAAqC,OAAO,MAAM;AACjH,KAAK,OAAO;AAAA,EACV,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,IAAI;AACN;AAEO,MAAM,UAAU,CAAC,SAAgB,CAAC,YAAY,KAAK,QAAQ,8BAA8B,OAAO,MAAM;AAC7G,QAAQ,OAAO;AAAA,EACb,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,YAAY;AACd;AACA,QAAQ,WAAW;AAAA,EACjB,YAAY;AAAA,IACV,SAAS;AAAA,MACP,MAAM,SAAS,OAAO,QAAQ,WAAW;AAAA,MACzC,SAAS,CAAC,WAAW,SAAS,SAAS;AAAA,IACzC;AAAA,EACF;AACF;AAEA,SAAS,gBAAgB;AACvB,QAAM,CAAC,gBAAgB,IAAI,UAAU,CAAC,QAAQ,qCAAqC,CAAC,CAAC;AACrF,SAAO,CAAC,YAAY,OAAO,KAAK,QAAQ,KAAK,gBAAgB,QAAQ,KAAK,kBAAkB;AAC9F;AACO,MAAM,gBAAgB,MAAM,CAAC,cAAc;AAElD,SAAS,cAAc;AACrB,SACE,CAAC;AAAA,IACC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,gBAAgB;AAAA,IAChB,KAAK,QAAQ,qCAAqC;AAAA,EACpD;AAEJ;AACO,MAAM,cAAc,MAAM,CAAC,YAAY;AAEvC,MAAM,aAAa,MACxB,CAAC;AAAA,EACC,CAAC,OAAO,MAAM,MAAM,QAAQ,KAAK,GAAG,MAAM;AAAA,EAC1C,CAAC,OAAO,MAAM,MAAM,QAAQ,KAAK,GAAG,OAAO;AAAA,EAC3C,CAAC;AAAA,IACC,GAAG;AAAA,IACH,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,EACR;AACF,EAVC;AAaI,MAAM,cAAc,MACzB,CAAC,OACC,CAAC;AAAA,EACC,GAAG;AAAA,EACH,EAAE;AAAA,EACF,IAAI;AAAA,EACJ,EAAE;AACJ,EACF,EAPC;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/jsx/images/index.js
CHANGED