@mapples/ui 1.0.2 → 1.0.3
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/dist/components/inputs/IconButton/IconButton.d.ts +3 -2
- package/dist/components/inputs/IconButton/IconButton.d.ts.map +1 -1
- package/dist/components/inputs/IconButton/IconButton.js +15 -4
- package/dist/components/inputs/IconButton/IconButton.js.map +1 -1
- package/dist/components/media/Icon/Icon.d.ts +3 -2
- package/dist/components/media/Icon/Icon.d.ts.map +1 -1
- package/dist/components/media/Icon/Icon.js +16 -5
- package/dist/components/media/Icon/Icon.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { PropsWithChildren } from 'react';
|
|
2
2
|
import { StyledProp, StyledProps, WithStyledProps } from '@mapples/style';
|
|
3
|
+
import { SvgSource } from '@mapples/types';
|
|
3
4
|
import { PressableProps, TextStyle, View, ViewProps } from 'react-native';
|
|
4
5
|
/**
|
|
5
6
|
* Props for the IconButton component.
|
|
@@ -14,7 +15,7 @@ export type IconProps = PropsWithChildren<Omit<WithStyledProps<PressableProps>,
|
|
|
14
15
|
};
|
|
15
16
|
}> & {
|
|
16
17
|
/** URI for the SVG icon to display */
|
|
17
|
-
uri?: string;
|
|
18
|
+
uri?: string | SvgSource;
|
|
18
19
|
};
|
|
19
20
|
/**
|
|
20
21
|
* A customizable icon button component with SVG support.
|
|
@@ -56,7 +57,7 @@ declare const IconButton: import("react").ForwardRefExoticComponent<Omit<WithSty
|
|
|
56
57
|
children?: import("react").ReactNode | undefined;
|
|
57
58
|
} & {
|
|
58
59
|
/** URI for the SVG icon to display */
|
|
59
|
-
uri?: string;
|
|
60
|
+
uri?: string | SvgSource;
|
|
60
61
|
} & import("react").RefAttributes<View>>;
|
|
61
62
|
export default IconButton;
|
|
62
63
|
//# sourceMappingURL=IconButton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/inputs/IconButton/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/inputs/IconButton/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAIL,UAAU,EACV,WAAW,EAEX,eAAe,EAChB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAK1E;;;;GAIG;AACH,MAAM,MAAM,SAAS,GAAG,iBAAiB,CACvC,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,EAAE,QAAQ,CAAC,GAAG;IAChD,kEAAkE;IAClE,MAAM,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,GAAG;QAChC,2BAA2B;QAC3B,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;KAClC,CAAC;CACH,CACF,GAAG;IACF,sCAAsC;IACtC,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC1B,CAAC;AAIF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,QAAA,MAAM,UAAU;IA3CZ,kEAAkE;aACzD,WAAW,CAAC,SAAS,CAAC,GAAG;QAChC,2BAA2B;QAC3B,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;KAClC;;;;IAGH,sCAAsC;UAChC,MAAM,GAAG,SAAS;wCAuFzB,CAAC;AAGF,eAAe,UAAU,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { forwardRef } from 'react';
|
|
2
|
-
import { styled, StyledPressable, Styler, } from '@mapples/style';
|
|
2
|
+
import { styled as makeStyled, styled, StyledPressable, Styler, } from '@mapples/style';
|
|
3
3
|
import { SvgUri } from 'react-native-svg';
|
|
4
4
|
import MockIcon from './MockIcon';
|
|
5
5
|
const StyledSvgUri = styled(SvgUri);
|
|
@@ -36,13 +36,24 @@ const StyledSvgUri = styled(SvgUri);
|
|
|
36
36
|
const IconButton = forwardRef(({ styled, uri, ...props }, ref) => {
|
|
37
37
|
const { styleSvg, ...styledViewProps } = styled || {};
|
|
38
38
|
const ejectStyle = Styler.flatten(styleSvg);
|
|
39
|
-
|
|
40
|
-
|
|
39
|
+
const getUriComponent = (Uri) => {
|
|
40
|
+
const StyledSvg = makeStyled(Uri.default);
|
|
41
|
+
return (<StyledSvg styled={{
|
|
41
42
|
width: ejectStyle?.width,
|
|
42
43
|
height: ejectStyle?.height,
|
|
43
44
|
color: ejectStyle?.color,
|
|
44
45
|
style: styleSvg,
|
|
45
|
-
}}/>)
|
|
46
|
+
}}/>);
|
|
47
|
+
};
|
|
48
|
+
return (<StyledPressable ref={ref} styled={styledViewProps} {...props}>
|
|
49
|
+
{uri ? (<>
|
|
50
|
+
{typeof uri === 'string' ? (<StyledSvgUri uri={uri} styled={{
|
|
51
|
+
width: ejectStyle?.width,
|
|
52
|
+
height: ejectStyle?.height,
|
|
53
|
+
color: ejectStyle?.color,
|
|
54
|
+
style: styleSvg,
|
|
55
|
+
}}/>) : (getUriComponent(uri))}
|
|
56
|
+
</>) : (<MockIcon styled={{
|
|
46
57
|
width: ejectStyle?.width,
|
|
47
58
|
height: ejectStyle?.height,
|
|
48
59
|
color: ejectStyle?.color,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../../src/components/inputs/IconButton/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../../src/components/inputs/IconButton/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,UAAU,EAAqB,MAAM,OAAO,CAAC;AAErE,OAAO,EACL,MAAM,IAAI,UAAU,EACpB,MAAM,EACN,eAAe,EAGf,MAAM,GAEP,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EAAY,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAEpD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAoBlC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;AAEpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,UAAU,GAAG,UAAU,CAC3B,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,MAAM,EAAE,QAAQ,EAAE,GAAG,eAAe,EAAE,GAAG,MAAM,IAAI,EAAE,CAAC;IAEtD,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAE5C,MAAM,eAAe,GAAG,CAAC,GAAyC,EAAE,EAAE;QACpE,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QAE1C,OAAO,CACL,CAAC,SAAS,CACR,MAAM,CAAC,CAAC;gBACN,KAAK,EAAE,UAAU,EAAE,KAAwB;gBAC3C,MAAM,EAAE,UAAU,EAAE,MAAyB;gBAC7C,KAAK,EAAE,UAAU,EAAE,KAAK;gBACxB,KAAK,EAAE,QAAQ;aAChB,CAAC,EACF,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,CAAC,IAAI,KAAK,CAAC,CAC5D;QAAA,CAAC,GAAG,CAAC,CAAC,CAAC,CACL,EACE;YAAA,CAAC,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,CACzB,CAAC,YAAY,CACX,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,MAAM,CAAC,CAAC;oBACN,KAAK,EAAE,UAAU,EAAE,KAAwB;oBAC3C,MAAM,EAAE,UAAU,EAAE,MAAyB;oBAC7C,KAAK,EAAE,UAAU,EAAE,KAAK;oBACxB,KAAK,EAAE,QAAQ;iBAChB,CAAC,EACF,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAAC,GAAG,CAAC,CACrB,CACH;UAAA,GAAG,CACJ,CAAC,CAAC,CAAC,CACF,CAAC,QAAQ,CACP,MAAM,CAAC,CAAC;gBACN,KAAK,EAAE,UAAU,EAAE,KAAwB;gBAC3C,MAAM,EAAE,UAAU,EAAE,MAAyB;gBAC7C,KAAK,EAAE,UAAU,EAAE,KAAK;gBACxB,KAAK,EAAE,QAAQ;aAChB,CAAC,EACF,CACH,CACH;MAAA,EAAE,eAAe,CAAC,CACnB,CAAC;AACJ,CAAC,CACF,CAAC;AACF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAEtC,eAAe,UAAU,CAAC"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { PropsWithChildren } from 'react';
|
|
2
2
|
import { StyledProp, StyledProps, WithStyledProps } from '@mapples/style';
|
|
3
|
+
import { SvgSource } from '@mapples/types';
|
|
3
4
|
import { TextStyle, View, ViewProps } from 'react-native';
|
|
4
5
|
export type IconProps = PropsWithChildren<Omit<WithStyledProps<ViewProps>, 'styled'> & {
|
|
5
6
|
styled?: StyledProps<ViewProps> & {
|
|
6
7
|
styleSvg?: StyledProp<TextStyle>;
|
|
7
8
|
};
|
|
8
9
|
}> & {
|
|
9
|
-
uri?: string;
|
|
10
|
+
uri?: string | SvgSource;
|
|
10
11
|
};
|
|
11
12
|
declare const Icon: import("react").ForwardRefExoticComponent<Omit<WithStyledProps<ViewProps>, "styled"> & {
|
|
12
13
|
styled?: StyledProps<ViewProps> & {
|
|
@@ -15,7 +16,7 @@ declare const Icon: import("react").ForwardRefExoticComponent<Omit<WithStyledPro
|
|
|
15
16
|
} & {
|
|
16
17
|
children?: import("react").ReactNode | undefined;
|
|
17
18
|
} & {
|
|
18
|
-
uri?: string;
|
|
19
|
+
uri?: string | SvgSource;
|
|
19
20
|
} & import("react").RefAttributes<View>>;
|
|
20
21
|
export default Icon;
|
|
21
22
|
//# sourceMappingURL=Icon.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/components/media/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/components/media/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAEL,UAAU,EACV,WAAW,EAGX,eAAe,EAChB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAK1D,MAAM,MAAM,SAAS,GAAG,iBAAiB,CACvC,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,EAAE,QAAQ,CAAC,GAAG;IAC3C,MAAM,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,GAAG;QAChC,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;KAClC,CAAC;CACH,CACF,GAAG;IACF,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC1B,CAAC;AAIF,QAAA,MAAM,IAAI;aAVG,WAAW,CAAC,SAAS,CAAC,GAAG;QAChC,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;KAClC;;;;UAGG,MAAM,GAAG,SAAS;wCAyDzB,CAAC;AAGF,eAAe,IAAI,CAAC"}
|
|
@@ -1,18 +1,29 @@
|
|
|
1
1
|
import { forwardRef } from 'react';
|
|
2
|
-
import { styled, StyledView, Styler, } from '@mapples/style';
|
|
2
|
+
import { styled as makeStyled, StyledView, Styler, } from '@mapples/style';
|
|
3
3
|
import { SvgUri } from 'react-native-svg';
|
|
4
4
|
import MockIcon from './MockIcon';
|
|
5
|
-
const StyledSvgUri =
|
|
5
|
+
const StyledSvgUri = makeStyled(SvgUri);
|
|
6
6
|
const Icon = forwardRef(({ styled, uri, ...props }, ref) => {
|
|
7
7
|
const { styleSvg, ...styledViewProps } = styled || {};
|
|
8
8
|
const ejectStyle = Styler.flatten(styleSvg);
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
const getUriComponent = (Uri) => {
|
|
10
|
+
const StyledSvg = makeStyled(Uri.default);
|
|
11
|
+
return (<StyledSvg styled={{
|
|
11
12
|
width: ejectStyle?.width,
|
|
12
13
|
height: ejectStyle?.height,
|
|
13
14
|
color: ejectStyle?.color,
|
|
14
15
|
style: styleSvg,
|
|
15
|
-
}}/>)
|
|
16
|
+
}}/>);
|
|
17
|
+
};
|
|
18
|
+
return (<StyledView ref={ref} styled={styledViewProps} {...props}>
|
|
19
|
+
{uri ? (<>
|
|
20
|
+
{typeof uri === 'string' ? (<StyledSvgUri uri={uri} styled={{
|
|
21
|
+
width: ejectStyle?.width,
|
|
22
|
+
height: ejectStyle?.height,
|
|
23
|
+
color: ejectStyle?.color,
|
|
24
|
+
style: styleSvg,
|
|
25
|
+
}}/>) : (getUriComponent(uri))}
|
|
26
|
+
</>) : (<MockIcon styled={{
|
|
16
27
|
width: ejectStyle?.width,
|
|
17
28
|
height: ejectStyle?.height,
|
|
18
29
|
color: ejectStyle?.color,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/media/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/media/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,UAAU,EAAqB,MAAM,OAAO,CAAC;AAErE,OAAO,EACL,MAAM,IAAI,UAAU,EAGpB,UAAU,EACV,MAAM,GAEP,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EAAE,MAAM,EAAY,MAAM,kBAAkB,CAAC;AAEpD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAYlC,MAAM,YAAY,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC;AAExC,MAAM,IAAI,GAAG,UAAU,CACrB,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,MAAM,EAAE,QAAQ,EAAE,GAAG,eAAe,EAAE,GAAG,MAAM,IAAI,EAAE,CAAC;IAEtD,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAE5C,MAAM,eAAe,GAAG,CAAC,GAAyC,EAAE,EAAE;QACpE,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QAE1C,OAAO,CACL,CAAC,SAAS,CACR,MAAM,CAAC,CAAC;gBACN,KAAK,EAAE,UAAU,EAAE,KAAwB;gBAC3C,MAAM,EAAE,UAAU,EAAE,MAAyB;gBAC7C,KAAK,EAAE,UAAU,EAAE,KAAK;gBACxB,KAAK,EAAE,QAAQ;aAChB,CAAC,EACF,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,CAAC,IAAI,KAAK,CAAC,CACvD;QAAA,CAAC,GAAG,CAAC,CAAC,CAAC,CACL,EACE;YAAA,CAAC,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,CACzB,CAAC,YAAY,CACX,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,MAAM,CAAC,CAAC;oBACN,KAAK,EAAE,UAAU,EAAE,KAAwB;oBAC3C,MAAM,EAAE,UAAU,EAAE,MAAyB;oBAC7C,KAAK,EAAE,UAAU,EAAE,KAAK;oBACxB,KAAK,EAAE,QAAQ;iBAChB,CAAC,EACF,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAAC,GAAG,CAAC,CACrB,CACH;UAAA,GAAG,CACJ,CAAC,CAAC,CAAC,CACF,CAAC,QAAQ,CACP,MAAM,CAAC,CAAC;gBACN,KAAK,EAAE,UAAU,EAAE,KAAwB;gBAC3C,MAAM,EAAE,UAAU,EAAE,MAAyB;gBAC7C,KAAK,EAAE,UAAU,EAAE,KAAK;gBACxB,KAAK,EAAE,QAAQ;aAChB,CAAC,EACF,CACH,CACH;MAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CACF,CAAC;AACF,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC;AAE1B,eAAe,IAAI,CAAC"}
|