@kivid/native-components 1.0.0-alpha.19 → 1.0.0-alpha.20
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/commonjs/components/Avatar/index.js +1 -1
- package/dist/commonjs/components/Avatar/index.js.map +1 -1
- package/dist/commonjs/components/ChatBubble/assets/class-variants.js +7 -2
- package/dist/commonjs/components/ChatBubble/assets/class-variants.js.map +1 -1
- package/dist/commonjs/components/ChatBubble/components/ChatBubbleContent/index.js +1 -1
- package/dist/commonjs/components/ChatBubble/components/ChatBubbleContent/index.js.map +1 -1
- package/dist/commonjs/components/ChatBubble/components/ChatBubbleText/index.js +1 -1
- package/dist/commonjs/components/ChatBubble/components/ChatBubbleText/index.js.map +1 -1
- package/dist/commonjs/components/ChatBubble/index.js +5 -2
- package/dist/commonjs/components/ChatBubble/index.js.map +1 -1
- package/dist/commonjs/components/ListButton/index.js +1 -1
- package/dist/commonjs/components/ListButton/index.js.map +1 -1
- package/dist/commonjs/components/PasswordInput/index.js +2 -2
- package/dist/commonjs/components/PasswordInput/index.js.map +1 -1
- package/dist/commonjs/components/Toast/index.js +1 -1
- package/dist/commonjs/components/Toast/index.js.map +1 -1
- package/dist/commonjs/iconography/Icons/index.js +48 -14
- package/dist/commonjs/iconography/Icons/index.js.map +1 -1
- package/dist/module/components/Avatar/index.js +2 -2
- package/dist/module/components/Avatar/index.js.map +1 -1
- package/dist/module/components/ChatBubble/assets/class-variants.js +7 -2
- package/dist/module/components/ChatBubble/assets/class-variants.js.map +1 -1
- package/dist/module/components/ChatBubble/components/ChatBubbleContent/index.js +1 -1
- package/dist/module/components/ChatBubble/components/ChatBubbleContent/index.js.map +1 -1
- package/dist/module/components/ChatBubble/components/ChatBubbleText/index.js +1 -1
- package/dist/module/components/ChatBubble/components/ChatBubbleText/index.js.map +1 -1
- package/dist/module/components/ChatBubble/index.js +5 -2
- package/dist/module/components/ChatBubble/index.js.map +1 -1
- package/dist/module/components/ListButton/index.js +2 -2
- package/dist/module/components/ListButton/index.js.map +1 -1
- package/dist/module/components/PasswordInput/index.js +3 -3
- package/dist/module/components/PasswordInput/index.js.map +1 -1
- package/dist/module/components/Toast/index.js +2 -2
- package/dist/module/components/Toast/index.js.map +1 -1
- package/dist/module/iconography/Icons/index.js +48 -14
- package/dist/module/iconography/Icons/index.js.map +1 -1
- package/dist/typescript/components/ChatBubble/assets/class-variants.d.ts +1 -0
- package/dist/typescript/components/ChatBubble/types.d.ts +1 -0
- package/package.json +5 -5
- package/src/components/Avatar/index.tsx +2 -2
- package/src/components/ChatBubble/assets/class-variants.ts +68 -66
- package/src/components/ChatBubble/components/ChatBubbleContent/index.tsx +1 -1
- package/src/components/ChatBubble/components/ChatBubbleText/index.tsx +1 -1
- package/src/components/ChatBubble/index.tsx +4 -1
- package/src/components/ChatBubble/types.ts +1 -0
- package/src/components/ListButton/index.tsx +2 -2
- package/src/components/PasswordInput/index.tsx +3 -3
- package/src/components/Toast/index.tsx +2 -2
- package/src/iconography/Icons/index.tsx +60 -17
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Animated","Pressable","View","Typography","ListButtonVariantEnum","SizeEnum","CornersEnum","
|
|
1
|
+
{"version":3,"names":["Animated","Pressable","View","Typography","ListButtonVariantEnum","SizeEnum","CornersEnum","ArrowChevronRightStroke","buttonVariants","textVariants","merge","useRef","jsx","_jsx","jsxs","_jsxs","AnimatedPressable","createAnimatedComponent","ListButton","props","iconLeft","iconRight","children","variant","GRAPE","size","SMALL","corners","disabled","className","iconLeftContainerClassName","iconRightContainerClassName","accessibilityLabel","numberOfLines","onPressIn","onPressOut","rest","typographyVariantMap","small","medium","large","typographyVariant","chevronIconColor","OUTLINE","textStyle","animatedValue","Value","current","handlePressIn","event","timing","toValue","duration","useNativeDriver","start","handlePressOut","renderLeftIcon","renderRightIcon","color","style","opacity","accessibilityRole","undefined","accessibilityState","ellipsizeMode","weight"],"sourceRoot":"../../../../src","sources":["components/ListButton/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
import { useState } from "react";
|
|
4
4
|
import TextInput from "../TextInput/index.js";
|
|
5
5
|
import { IconButton } from "../IconButton/index.js";
|
|
6
|
-
import {
|
|
6
|
+
import { EssentialEyeStroke, EssentialEyeOffStroke } from "@kivid/icons/native";
|
|
7
7
|
import { IconButtonVariantEnum } from "../IconButton/enums.js";
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
export function PasswordInput(props) {
|
|
@@ -13,12 +13,12 @@ export function PasswordInput(props) {
|
|
|
13
13
|
}
|
|
14
14
|
function renderIcon() {
|
|
15
15
|
if (shouldHidePassword) {
|
|
16
|
-
return /*#__PURE__*/_jsx(
|
|
16
|
+
return /*#__PURE__*/_jsx(EssentialEyeStroke, {
|
|
17
17
|
size: 24,
|
|
18
18
|
className: "text-chia-900"
|
|
19
19
|
});
|
|
20
20
|
}
|
|
21
|
-
return /*#__PURE__*/_jsx(
|
|
21
|
+
return /*#__PURE__*/_jsx(EssentialEyeOffStroke, {
|
|
22
22
|
size: 24,
|
|
23
23
|
className: "text-chia-900"
|
|
24
24
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useState","TextInput","IconButton","
|
|
1
|
+
{"version":3,"names":["useState","TextInput","IconButton","EssentialEyeStroke","EssentialEyeOffStroke","IconButtonVariantEnum","jsx","_jsx","PasswordInput","props","shouldHidePassword","setShouldHidePassword","toogleHidePassword","renderIcon","size","className","secureTextEntry","rightIcon","onPress","accessibilityLabel","variant","GHOST","icon"],"sourceRoot":"../../../../src","sources":["components/PasswordInput/index.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,OAAO;AAChC,OAAOC,SAAS,MAAM,uBAAc;AACpC,SAASC,UAAU,QAAQ,wBAAe;AAE1C,SAASC,kBAAkB,EAAEC,qBAAqB,QAAQ,qBAAqB;AAC/E,SAASC,qBAAqB,QAAQ,wBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE5D,OAAO,SAASC,aAAaA,CAACC,KAAyB,EAAE;EACvD,MAAM,CAACC,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGX,QAAQ,CAAC,IAAI,CAAC;EAElE,SAASY,kBAAkBA,CAAA,EAAG;IAC5BD,qBAAqB,CAAC,CAACD,kBAAkB,CAAC;EAC5C;EAEA,SAASG,UAAUA,CAAA,EAAG;IACpB,IAAIH,kBAAkB,EAAE;MACtB,oBAAOH,IAAA,CAACJ,kBAAkB;QAACW,IAAI,EAAE,EAAG;QAACC,SAAS,EAAC;MAAe,CAAE,CAAC;IACnE;IAEA,oBAAOR,IAAA,CAACH,qBAAqB;MAACU,IAAI,EAAE,EAAG;MAACC,SAAS,EAAC;IAAe,CAAE,CAAC;EACtE;EAEA,oBACER,IAAA,CAACN,SAAS;IAAA,GACJQ,KAAK;IACTO,eAAe,EAAEN,kBAAmB;IACpCO,SAAS,eACPV,IAAA,CAACL,UAAU;MACTgB,OAAO,EAAEN,kBAAmB;MAC5BO,kBAAkB,EAAC,4BAA4B;MAC/CC,OAAO,EAAEf,qBAAqB,CAACgB,KAAM;MACrCC,IAAI,EAAET,UAAU,CAAC;IAAE,CACpB;EACF,CACF,CAAC;AAEN","ignoreList":[]}
|
|
@@ -4,7 +4,7 @@ import { useEffect, useRef } from "react";
|
|
|
4
4
|
import { View, Animated, Pressable } from "react-native";
|
|
5
5
|
import { ToastPositionEnum, ToastVariantEnum } from "./enums/index.js";
|
|
6
6
|
import { containerVariants, toastVariants } from "./assets/class-variants.js";
|
|
7
|
-
import {
|
|
7
|
+
import { EssentialCloseStroke } from "@kivid/icons/native";
|
|
8
8
|
import Typography from "../Typography/index.js";
|
|
9
9
|
import { merge } from "@kivid/tailwind-preset";
|
|
10
10
|
import { Seal } from "../Seal/index.js";
|
|
@@ -106,7 +106,7 @@ export function Toast(props) {
|
|
|
106
106
|
}), /*#__PURE__*/_jsx(Pressable, {
|
|
107
107
|
className: "cursor-pointer",
|
|
108
108
|
onPress: handleClose,
|
|
109
|
-
children: /*#__PURE__*/_jsx(
|
|
109
|
+
children: /*#__PURE__*/_jsx(EssentialCloseStroke, {
|
|
110
110
|
className: "text-chia-100",
|
|
111
111
|
size: 30
|
|
112
112
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useRef","View","Animated","Pressable","ToastPositionEnum","ToastVariantEnum","containerVariants","toastVariants","
|
|
1
|
+
{"version":3,"names":["useEffect","useRef","View","Animated","Pressable","ToastPositionEnum","ToastVariantEnum","containerVariants","toastVariants","EssentialCloseStroke","Typography","merge","Seal","SealVariantEnum","elevationDown100","jsx","_jsx","jsxs","_jsxs","Toast","props","description","isToastOpen","onCloseToast","className","descriptionClassName","durationInMilliSeconds","position","TOP","variant","SUCCESS","animatedValue","Value","current","timerRef","isClosingRef","clearTimeout","timing","toValue","duration","useNativeDriver","start","setTimeout","handleClose","toastStyle","containerStyle","iconMap","inverted","ERROR","WARNING","ALERT","Icon","animatedStyle","opacity","transform","translateY","interpolate","inputRange","outputRange","style","children","boxShadow","onPress","size"],"sourceRoot":"../../../../src","sources":["components/Toast/index.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AACzC,SAASC,IAAI,EAAEC,QAAQ,EAAEC,SAAS,QAAQ,cAAc;AAExD,SAASC,iBAAiB,EAAEC,gBAAgB,QAAQ,kBAAS;AAC7D,SAASC,iBAAiB,EAAEC,aAAa,QAAQ,4BAAyB;AAE1E,SAASC,oBAAoB,QAAQ,qBAAqB;AAC1D,OAAOC,UAAU,MAAM,wBAAe;AACtC,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,IAAI,QAAQ,kBAAS;AAC9B,SAASC,eAAe,QAAQ,wBAAe;AAC/C,SAASC,gBAAgB,QAAQ,sCAA6B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/D,OAAO,SAASC,KAAKA,CAACC,KAAiB,EAAE;EACvC,MAAM;IACJC,WAAW;IACXC,WAAW;IACXC,YAAY;IACZC,SAAS;IACTC,oBAAoB;IACpBC,sBAAsB,GAAG,IAAI;IAC7BC,QAAQ,GAAGtB,iBAAiB,CAACuB,GAAG;IAChCC,OAAO,GAAGvB,gBAAgB,CAACwB;EAC7B,CAAC,GAAGV,KAAK;EAET,MAAMW,aAAa,GAAG9B,MAAM,CAAC,IAAIE,QAAQ,CAAC6B,KAAK,CAAC,CAAC,CAAC,CAAC,CAACC,OAAO;EAC3D,MAAMC,QAAQ,GAAGjC,MAAM,CAAwB,IAAI,CAAC;EACpD,MAAMkC,YAAY,GAAGlC,MAAM,CAAC,KAAK,CAAC;EAElCD,SAAS,CAAC,MAAM;IACd,IAAI,CAACsB,WAAW,EAAE;IAElBa,YAAY,CAACF,OAAO,GAAG,KAAK;IAE5B,IAAIC,QAAQ,CAACD,OAAO,EAAEG,YAAY,CAACF,QAAQ,CAACD,OAAO,CAAC;IAEpD9B,QAAQ,CAACkC,MAAM,CAACN,aAAa,EAAE;MAC7BO,OAAO,EAAE,CAAC;MACVC,QAAQ,EAAE,GAAG;MACbC,eAAe,EAAE;IACnB,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC;IAEVP,QAAQ,CAACD,OAAO,GAAGS,UAAU,CAAC,MAAM;MAClC,IAAIP,YAAY,CAACF,OAAO,EAAE;MAE1BE,YAAY,CAACF,OAAO,GAAG,IAAI;MAC3B9B,QAAQ,CAACkC,MAAM,CAACN,aAAa,EAAE;QAC7BO,OAAO,EAAE,CAAC;QACVC,QAAQ,EAAE,GAAG;QACbC,eAAe,EAAE;MACnB,CAAC,CAAC,CAACC,KAAK,CAAC,MAAM;QACblB,YAAY,CAAC,KAAK,CAAC;MACrB,CAAC,CAAC;IACJ,CAAC,EAAEG,sBAAsB,CAAC;IAE1B,OAAO,MAAM;MACX,IAAIQ,QAAQ,CAACD,OAAO,EAAEG,YAAY,CAACF,QAAQ,CAACD,OAAO,CAAC;IACtD,CAAC;EACH,CAAC,EAAE,CAACX,WAAW,CAAC,CAAC;EAEjB,IAAI,CAACA,WAAW,EAAE,OAAO,IAAI;EAE7B,SAASqB,WAAWA,CAAA,EAAG;IACrB,IAAIR,YAAY,CAACF,OAAO,EAAE;IAE1BE,YAAY,CAACF,OAAO,GAAG,IAAI;IAC3B,IAAIC,QAAQ,CAACD,OAAO,EAAEG,YAAY,CAACF,QAAQ,CAACD,OAAO,CAAC;IAEpD9B,QAAQ,CAACkC,MAAM,CAACN,aAAa,EAAE;MAC7BO,OAAO,EAAE,CAAC;MACVC,QAAQ,EAAE,GAAG;MACbC,eAAe,EAAE;IACnB,CAAC,CAAC,CAACC,KAAK,CAAC,MAAM;MACblB,YAAY,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC;EACJ;EAEA,MAAMqB,UAAU,GAAGpC,aAAa,CAAC;IAAEqB;EAAQ,CAAC,CAAC;EAC7C,MAAMgB,cAAc,GAAGtC,iBAAiB,CAAC;IAAEoB;EAAS,CAAC,CAAC;EAEtD,MAAMmB,OAAO,GAAG;IACd,CAACxC,gBAAgB,CAACwB,OAAO,GAAG,mBAC1Bd,IAAA,CAACJ,IAAI;MAACiB,OAAO,EAAEhB,eAAe,CAACiB,OAAQ;MAACiB,QAAQ;IAAA,CAAE,CACnD;IACD,CAACzC,gBAAgB,CAAC0C,KAAK,GAAG,mBACxBhC,IAAA,CAACJ,IAAI;MAACiB,OAAO,EAAEhB,eAAe,CAACmC,KAAM;MAACD,QAAQ;IAAA,CAAE,CACjD;IACD,CAACzC,gBAAgB,CAAC2C,OAAO,GAAG,mBAC1BjC,IAAA,CAACJ,IAAI;MAACiB,OAAO,EAAEhB,eAAe,CAACqC,KAAM;MAACH,QAAQ;IAAA,CAAE;EAEpD,CAAC;EAED,MAAMI,IAAI,GAAGL,OAAO,CAACjB,OAAO,CAAC;EAE7B,MAAMuB,aAAa,GAAG;IACpBC,OAAO,EAAEtB,aAAa;IACtBuB,SAAS,EAAE,CACT;MACEC,UAAU,EAAExB,aAAa,CAACyB,WAAW,CAAC;QACpCC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QAClBC,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;MACtB,CAAC;IACH,CAAC;EAEL,CAAC;EAED,oBACE1C,IAAA,CAACb,QAAQ,CAACD,IAAI;IAACsB,SAAS,EAAEqB,cAAe;IAACc,KAAK,EAAEP,aAAc;IAAAQ,QAAA,eAC7D1C,KAAA,CAAChB,IAAI;MACHsB,SAAS,EAAEb,KAAK,CAACiC,UAAU,EAAEpB,SAAS,CAAE;MACxCmC,KAAK,EAAE;QACLE,SAAS,EAAE/C;MACb,CAAE;MAAA8C,QAAA,gBAEF5C,IAAA,CAACmC,IAAI,IAAE,CAAC,eACRnC,IAAA,CAACN,UAAU;QACTc,SAAS,EAAEb,KAAK,CACd,qDAAqD,EACrDc,oBACF,CAAE;QAAAmC,QAAA,EAEDvC;MAAW,CACF,CAAC,eAEbL,IAAA,CAACZ,SAAS;QAACoB,SAAS,EAAC,gBAAgB;QAACsC,OAAO,EAAEnB,WAAY;QAAAiB,QAAA,eACzD5C,IAAA,CAACP,oBAAoB;UAACe,SAAS,EAAC,eAAe;UAACuC,IAAI,EAAE;QAAG,CAAE;MAAC,CACnD,CAAC;IAAA,CACR;EAAC,CACM,CAAC;AAEpB","ignoreList":[]}
|
|
@@ -7,13 +7,20 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
7
7
|
export function Icons(props) {
|
|
8
8
|
const {
|
|
9
9
|
size = 24,
|
|
10
|
-
color = "currentColor"
|
|
10
|
+
color: initialColor = "currentColor"
|
|
11
11
|
} = props;
|
|
12
12
|
const icons = Object.entries(IconsNative).map(([name, IconComponent]) => ({
|
|
13
13
|
name,
|
|
14
14
|
component: IconComponent
|
|
15
15
|
}));
|
|
16
16
|
const [searchTerm, setSearchTerm] = useState("");
|
|
17
|
+
const [color, setColor] = useState(initialColor);
|
|
18
|
+
const availableColors = ["currentColor", "#000000", "#FF0000", "#00FF00", "#0000FF", "#FF00FF", "#FFA500", "#800080"];
|
|
19
|
+
function handleColorChange() {
|
|
20
|
+
const currentIndex = availableColors.indexOf(color);
|
|
21
|
+
const nextIndex = (currentIndex + 1) % availableColors.length;
|
|
22
|
+
setColor(availableColors[nextIndex]);
|
|
23
|
+
}
|
|
17
24
|
const iconsFiltered = useMemo(() => {
|
|
18
25
|
const sorted = [...icons].sort((a, b) => a.name.localeCompare(b.name));
|
|
19
26
|
return sorted.filter(icon => icon.name.toLowerCase().includes(searchTerm.toLowerCase()));
|
|
@@ -25,21 +32,48 @@ export function Icons(props) {
|
|
|
25
32
|
}
|
|
26
33
|
return /*#__PURE__*/_jsxs(View, {
|
|
27
34
|
className: "m-16",
|
|
28
|
-
children: [/*#__PURE__*/
|
|
29
|
-
placeholder: "Pesquisar \xEDcones...",
|
|
30
|
-
placeholderTextColor: "#98A3A3",
|
|
35
|
+
children: [/*#__PURE__*/_jsxs(View, {
|
|
31
36
|
style: {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
marginBottom: 16
|
|
35
|
-
borderRadius: 8,
|
|
36
|
-
borderWidth: 1,
|
|
37
|
-
borderColor: "#98A3A3",
|
|
38
|
-
paddingHorizontal: 12,
|
|
39
|
-
fontSize: 16
|
|
37
|
+
flexDirection: "row",
|
|
38
|
+
gap: 8,
|
|
39
|
+
marginBottom: 16
|
|
40
40
|
},
|
|
41
|
-
|
|
42
|
-
|
|
41
|
+
children: [/*#__PURE__*/_jsx(TextInput, {
|
|
42
|
+
placeholder: "Pesquisar \xEDcones...",
|
|
43
|
+
placeholderTextColor: "#98A3A3",
|
|
44
|
+
style: {
|
|
45
|
+
flex: 1,
|
|
46
|
+
height: 40,
|
|
47
|
+
borderRadius: 8,
|
|
48
|
+
borderWidth: 1,
|
|
49
|
+
borderColor: "#98A3A3",
|
|
50
|
+
paddingHorizontal: 12,
|
|
51
|
+
fontSize: 16
|
|
52
|
+
},
|
|
53
|
+
onChangeText: setSearchTerm,
|
|
54
|
+
value: searchTerm
|
|
55
|
+
}), /*#__PURE__*/_jsx(Pressable, {
|
|
56
|
+
onPress: handleColorChange,
|
|
57
|
+
style: {
|
|
58
|
+
height: 40,
|
|
59
|
+
paddingHorizontal: 16,
|
|
60
|
+
borderRadius: 8,
|
|
61
|
+
borderWidth: 1,
|
|
62
|
+
borderColor: "#98A3A3",
|
|
63
|
+
backgroundColor: color === "currentColor" ? "#F0F0F0" : color,
|
|
64
|
+
justifyContent: "center",
|
|
65
|
+
alignItems: "center",
|
|
66
|
+
minWidth: 100
|
|
67
|
+
},
|
|
68
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
69
|
+
style: {
|
|
70
|
+
fontSize: 14,
|
|
71
|
+
fontWeight: "600",
|
|
72
|
+
color: color === "currentColor" ? "#000000" : "#FFFFFF"
|
|
73
|
+
},
|
|
74
|
+
children: "Color"
|
|
75
|
+
})
|
|
76
|
+
})]
|
|
43
77
|
}), /*#__PURE__*/_jsx(FlatList, {
|
|
44
78
|
data: iconsFiltered,
|
|
45
79
|
keyExtractor: ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["IconsNative","React","useMemo","useState","Alert","FlatList","Pressable","Text","TextInput","View","jsx","_jsx","jsxs","_jsxs","Icons","props","size","color","icons","Object","entries","map","name","IconComponent","component","searchTerm","setSearchTerm","iconsFiltered","sorted","sort","a","b","localeCompare","filter","icon","toLowerCase","includes","handleIconPress","isCurrentColor","alert","className","children","
|
|
1
|
+
{"version":3,"names":["IconsNative","React","useMemo","useState","Alert","FlatList","Pressable","Text","TextInput","View","jsx","_jsx","jsxs","_jsxs","Icons","props","size","color","initialColor","icons","Object","entries","map","name","IconComponent","component","searchTerm","setSearchTerm","setColor","availableColors","handleColorChange","currentIndex","indexOf","nextIndex","length","iconsFiltered","sorted","sort","a","b","localeCompare","filter","icon","toLowerCase","includes","handleIconPress","isCurrentColor","alert","className","children","style","flexDirection","gap","marginBottom","placeholder","placeholderTextColor","flex","height","borderRadius","borderWidth","borderColor","paddingHorizontal","fontSize","onChangeText","value","onPress","backgroundColor","justifyContent","alignItems","minWidth","fontWeight","data","keyExtractor","numColumns","columnWrapperStyle","contentContainerStyle","paddingBottom","renderItem","item","marginVertical","padding","marginTop","textAlign","maxWidth","numberOfLines"],"sourceRoot":"../../../../src","sources":["iconography/Icons/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,5 +3,6 @@ export declare const chatBubbleBoxVariants: (props?: ({
|
|
|
3
3
|
colorState?: "fill" | "outline" | null | undefined;
|
|
4
4
|
hasEar?: boolean | null | undefined;
|
|
5
5
|
messageType?: "initial" | "followUp" | null | undefined;
|
|
6
|
+
fullWidth?: boolean | null | undefined;
|
|
6
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
8
|
export declare const chatBubbleTimeVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kivid/native-components",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.20",
|
|
4
4
|
"description": "A React Native component library for the Butterfly Design System.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -79,8 +79,8 @@
|
|
|
79
79
|
"react": "19.0.0",
|
|
80
80
|
"ts-jest": "^29.2.5",
|
|
81
81
|
"typescript": "~5.8.3",
|
|
82
|
-
"@kivid/
|
|
83
|
-
"@kivid/
|
|
82
|
+
"@kivid/tailwind-preset": "1.0.0-alpha.20",
|
|
83
|
+
"@kivid/icons": "1.0.0-alpha.20"
|
|
84
84
|
},
|
|
85
85
|
"peerDependencies": {
|
|
86
86
|
"@lottiefiles/dotlottie-react": "^0.15.1",
|
|
@@ -90,8 +90,8 @@
|
|
|
90
90
|
"react-native-svg": "^15.12.0",
|
|
91
91
|
"react-native": "0.79.5",
|
|
92
92
|
"react": "19.0.0",
|
|
93
|
-
"@kivid/
|
|
94
|
-
"@kivid/
|
|
93
|
+
"@kivid/tailwind-preset": "1.0.0-alpha.20",
|
|
94
|
+
"@kivid/icons": "1.0.0-alpha.20"
|
|
95
95
|
},
|
|
96
96
|
"eslintIgnore": [
|
|
97
97
|
"node_modules/",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { AvatarProps } from "./types";
|
|
2
|
-
import {
|
|
2
|
+
import { ProfileUserStroke } from "@kivid/icons/native";
|
|
3
3
|
import { View, Image } from "react-native";
|
|
4
4
|
import { SizeEnum } from "../../enums";
|
|
5
5
|
import { avatarVariants } from "./assets/class-variants";
|
|
@@ -94,7 +94,7 @@ export function Avatar(props: AvatarProps) {
|
|
|
94
94
|
|
|
95
95
|
return (
|
|
96
96
|
<View className={merge(avatarStyle, className)}>
|
|
97
|
-
<
|
|
97
|
+
<ProfileUserStroke
|
|
98
98
|
color="#B6C2C2"
|
|
99
99
|
size={personMappedSize}
|
|
100
100
|
strokeWidth={personMappedStrokeWidth}
|
|
@@ -1,74 +1,76 @@
|
|
|
1
1
|
import { cva } from "class-variance-authority";
|
|
2
2
|
|
|
3
|
-
export const chatBubbleBoxVariants = cva(
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
error: "",
|
|
11
|
-
custom: "",
|
|
12
|
-
},
|
|
13
|
-
colorState: {
|
|
14
|
-
fill: "",
|
|
15
|
-
outline: "border border-chia-400",
|
|
16
|
-
},
|
|
17
|
-
hasEar: {
|
|
18
|
-
true: "",
|
|
19
|
-
false: "",
|
|
20
|
-
},
|
|
21
|
-
messageType: {
|
|
22
|
-
initial: "",
|
|
23
|
-
followUp: "",
|
|
24
|
-
},
|
|
3
|
+
export const chatBubbleBoxVariants = cva("gap-400 px-600 py-500 min-h-1000", {
|
|
4
|
+
variants: {
|
|
5
|
+
variant: {
|
|
6
|
+
check: "",
|
|
7
|
+
alert: "",
|
|
8
|
+
error: "",
|
|
9
|
+
custom: "",
|
|
25
10
|
},
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
},
|
|
47
|
-
{
|
|
48
|
-
variant: "custom",
|
|
49
|
-
colorState: "outline",
|
|
50
|
-
className: "bg-chia-100",
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
colorState: "outline",
|
|
54
|
-
className: "bg-chia-100",
|
|
55
|
-
},
|
|
56
|
-
{
|
|
57
|
-
hasEar: true,
|
|
58
|
-
className: "rounded-700 rounded-bl-100",
|
|
59
|
-
},
|
|
60
|
-
{
|
|
61
|
-
hasEar: false,
|
|
62
|
-
className: "rounded-700 rounded-bl-300",
|
|
63
|
-
},
|
|
64
|
-
{ messageType: "followUp", className: "rounded-tl-300" },
|
|
65
|
-
],
|
|
66
|
-
defaultVariants: {
|
|
11
|
+
colorState: {
|
|
12
|
+
fill: "",
|
|
13
|
+
outline: "border border-chia-400",
|
|
14
|
+
},
|
|
15
|
+
hasEar: {
|
|
16
|
+
true: "",
|
|
17
|
+
false: "",
|
|
18
|
+
},
|
|
19
|
+
messageType: {
|
|
20
|
+
initial: "",
|
|
21
|
+
followUp: "",
|
|
22
|
+
},
|
|
23
|
+
fullWidth: {
|
|
24
|
+
true: "flex-row w-full",
|
|
25
|
+
false: "flex-row",
|
|
26
|
+
},
|
|
27
|
+
},
|
|
28
|
+
compoundVariants: [
|
|
29
|
+
{
|
|
30
|
+
variant: "check",
|
|
67
31
|
colorState: "fill",
|
|
68
|
-
|
|
32
|
+
className: "bg-pear-500",
|
|
69
33
|
},
|
|
70
|
-
|
|
71
|
-
|
|
34
|
+
{
|
|
35
|
+
variant: "alert",
|
|
36
|
+
colorState: "fill",
|
|
37
|
+
className: "bg-tangerine-500",
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
variant: "error",
|
|
41
|
+
colorState: "fill",
|
|
42
|
+
className: "bg-blackberry-500",
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
variant: "custom",
|
|
46
|
+
colorState: "fill",
|
|
47
|
+
className: "bg-chia-100",
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
variant: "custom",
|
|
51
|
+
colorState: "outline",
|
|
52
|
+
className: "bg-chia-100",
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
colorState: "outline",
|
|
56
|
+
className: "bg-chia-100",
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
hasEar: true,
|
|
60
|
+
className: "rounded-700 rounded-bl-100",
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
hasEar: false,
|
|
64
|
+
className: "rounded-700 rounded-bl-300",
|
|
65
|
+
},
|
|
66
|
+
{ messageType: "followUp", className: "rounded-tl-300" },
|
|
67
|
+
],
|
|
68
|
+
defaultVariants: {
|
|
69
|
+
colorState: "fill",
|
|
70
|
+
messageType: "initial",
|
|
71
|
+
fullWidth: false,
|
|
72
|
+
},
|
|
73
|
+
});
|
|
72
74
|
|
|
73
75
|
export const chatBubbleTimeVariants = cva(
|
|
74
76
|
"flex-row items-center gap-400 pt-400 pl-400"
|
|
@@ -25,7 +25,7 @@ export const ChatBubbleText: React.FC<ChatBubbleTextProps> = ({
|
|
|
25
25
|
<Typography
|
|
26
26
|
variant="body_large"
|
|
27
27
|
weight="600"
|
|
28
|
-
className={merge(textColorClass, className)}
|
|
28
|
+
className={merge(textColorClass, "flex-shrink", className)}
|
|
29
29
|
{...props}
|
|
30
30
|
>
|
|
31
31
|
{children}
|
|
@@ -27,6 +27,7 @@ export function ChatBubble(props: ChatBubbleProps) {
|
|
|
27
27
|
shouldDisplayTime = true,
|
|
28
28
|
messageType = "initial",
|
|
29
29
|
chatBubbleBoxClassName,
|
|
30
|
+
fullWidth = false,
|
|
30
31
|
...restOfProps
|
|
31
32
|
} = props;
|
|
32
33
|
|
|
@@ -67,6 +68,7 @@ export function ChatBubble(props: ChatBubbleProps) {
|
|
|
67
68
|
}
|
|
68
69
|
|
|
69
70
|
const bubbleWithEarOffset = hasEar ? "mr-[8.8px]" : "";
|
|
71
|
+
const bubbleRowClass = `relative flex-row items-end ${bubbleWithEarOffset}`;
|
|
70
72
|
|
|
71
73
|
const chatBubbleBoxStyle = merge(
|
|
72
74
|
chatBubbleBoxVariants({
|
|
@@ -74,6 +76,7 @@ export function ChatBubble(props: ChatBubbleProps) {
|
|
|
74
76
|
colorState,
|
|
75
77
|
hasEar,
|
|
76
78
|
messageType,
|
|
79
|
+
fullWidth,
|
|
77
80
|
}),
|
|
78
81
|
chatBubbleBoxClassName
|
|
79
82
|
)
|
|
@@ -87,7 +90,7 @@ export function ChatBubble(props: ChatBubbleProps) {
|
|
|
87
90
|
className={merge("flex", className)}
|
|
88
91
|
{...restOfProps}
|
|
89
92
|
>
|
|
90
|
-
<View className={
|
|
93
|
+
<View className={bubbleRowClass}>
|
|
91
94
|
<View
|
|
92
95
|
className={
|
|
93
96
|
"w-[11px] h-[9px] mr-[-3.2px] pb-[1.2px] z-10 items-center justify-center"
|
|
@@ -3,7 +3,7 @@ import { Typography } from "../Typography";
|
|
|
3
3
|
import { ListButtonVariantEnum } from "./enums";
|
|
4
4
|
import { SizeEnum, CornersEnum } from "../../enums";
|
|
5
5
|
import type { ListButtonProps } from "./types";
|
|
6
|
-
import {
|
|
6
|
+
import { ArrowChevronRightStroke } from "@kivid/icons/native";
|
|
7
7
|
import { buttonVariants, textVariants } from "./assets/class-variants";
|
|
8
8
|
import { merge } from "@kivid/tailwind-preset";
|
|
9
9
|
import { useRef } from "react";
|
|
@@ -78,7 +78,7 @@ export function ListButton(props: ListButtonProps) {
|
|
|
78
78
|
|
|
79
79
|
return (
|
|
80
80
|
<View className="ml-400">
|
|
81
|
-
<
|
|
81
|
+
<ArrowChevronRightStroke color={chevronIconColor} />
|
|
82
82
|
</View>
|
|
83
83
|
);
|
|
84
84
|
}
|
|
@@ -2,7 +2,7 @@ import { useState } from "react";
|
|
|
2
2
|
import TextInput from "../TextInput";
|
|
3
3
|
import { IconButton } from "../IconButton";
|
|
4
4
|
import { PasswordInputProps } from "./types";
|
|
5
|
-
import {
|
|
5
|
+
import { EssentialEyeStroke, EssentialEyeOffStroke } from "@kivid/icons/native";
|
|
6
6
|
import { IconButtonVariantEnum } from "../IconButton/enums";
|
|
7
7
|
|
|
8
8
|
export function PasswordInput(props: PasswordInputProps) {
|
|
@@ -14,10 +14,10 @@ export function PasswordInput(props: PasswordInputProps) {
|
|
|
14
14
|
|
|
15
15
|
function renderIcon() {
|
|
16
16
|
if (shouldHidePassword) {
|
|
17
|
-
return <
|
|
17
|
+
return <EssentialEyeStroke size={24} className="text-chia-900" />;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
return <
|
|
20
|
+
return <EssentialEyeOffStroke size={24} className="text-chia-900" />;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
return (
|
|
@@ -4,7 +4,7 @@ import { ToastProps } from "./types";
|
|
|
4
4
|
import { ToastPositionEnum, ToastVariantEnum } from "./enums";
|
|
5
5
|
import { containerVariants, toastVariants } from "./assets/class-variants";
|
|
6
6
|
|
|
7
|
-
import {
|
|
7
|
+
import { EssentialCloseStroke } from "@kivid/icons/native";
|
|
8
8
|
import Typography from "../Typography";
|
|
9
9
|
import { merge } from "@kivid/tailwind-preset";
|
|
10
10
|
import { Seal } from "../Seal";
|
|
@@ -123,7 +123,7 @@ export function Toast(props: ToastProps) {
|
|
|
123
123
|
</Typography>
|
|
124
124
|
|
|
125
125
|
<Pressable className="cursor-pointer" onPress={handleClose}>
|
|
126
|
-
<
|
|
126
|
+
<EssentialCloseStroke className="text-chia-100" size={30} />
|
|
127
127
|
</Pressable>
|
|
128
128
|
</View>
|
|
129
129
|
</Animated.View>
|
|
@@ -11,7 +11,7 @@ import {
|
|
|
11
11
|
} from "react-native";
|
|
12
12
|
|
|
13
13
|
export function Icons(props: IconsProps) {
|
|
14
|
-
const { size = 24, color = "currentColor" } = props;
|
|
14
|
+
const { size = 24, color: initialColor = "currentColor" } = props;
|
|
15
15
|
|
|
16
16
|
const icons = Object.entries(IconsNative).map(([name, IconComponent]) => ({
|
|
17
17
|
name,
|
|
@@ -19,6 +19,24 @@ export function Icons(props: IconsProps) {
|
|
|
19
19
|
}));
|
|
20
20
|
|
|
21
21
|
const [searchTerm, setSearchTerm] = useState("");
|
|
22
|
+
const [color, setColor] = useState(initialColor);
|
|
23
|
+
|
|
24
|
+
const availableColors = [
|
|
25
|
+
"currentColor",
|
|
26
|
+
"#000000",
|
|
27
|
+
"#FF0000",
|
|
28
|
+
"#00FF00",
|
|
29
|
+
"#0000FF",
|
|
30
|
+
"#FF00FF",
|
|
31
|
+
"#FFA500",
|
|
32
|
+
"#800080",
|
|
33
|
+
];
|
|
34
|
+
|
|
35
|
+
function handleColorChange() {
|
|
36
|
+
const currentIndex = availableColors.indexOf(color);
|
|
37
|
+
const nextIndex = (currentIndex + 1) % availableColors.length;
|
|
38
|
+
setColor(availableColors[nextIndex]);
|
|
39
|
+
}
|
|
22
40
|
|
|
23
41
|
const iconsFiltered = useMemo(() => {
|
|
24
42
|
const sorted = [...icons].sort((a, b) => a.name.localeCompare(b.name));
|
|
@@ -36,22 +54,47 @@ export function Icons(props: IconsProps) {
|
|
|
36
54
|
|
|
37
55
|
return (
|
|
38
56
|
<View className="m-16">
|
|
39
|
-
<
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
57
|
+
<View style={{ flexDirection: "row", gap: 8, marginBottom: 16 }}>
|
|
58
|
+
<TextInput
|
|
59
|
+
placeholder="Pesquisar ícones..."
|
|
60
|
+
placeholderTextColor="#98A3A3"
|
|
61
|
+
style={{
|
|
62
|
+
flex: 1,
|
|
63
|
+
height: 40,
|
|
64
|
+
borderRadius: 8,
|
|
65
|
+
borderWidth: 1,
|
|
66
|
+
borderColor: "#98A3A3",
|
|
67
|
+
paddingHorizontal: 12,
|
|
68
|
+
fontSize: 16,
|
|
69
|
+
}}
|
|
70
|
+
onChangeText={setSearchTerm}
|
|
71
|
+
value={searchTerm}
|
|
72
|
+
/>
|
|
73
|
+
<Pressable
|
|
74
|
+
onPress={handleColorChange}
|
|
75
|
+
style={{
|
|
76
|
+
height: 40,
|
|
77
|
+
paddingHorizontal: 16,
|
|
78
|
+
borderRadius: 8,
|
|
79
|
+
borderWidth: 1,
|
|
80
|
+
borderColor: "#98A3A3",
|
|
81
|
+
backgroundColor: color === "currentColor" ? "#F0F0F0" : color,
|
|
82
|
+
justifyContent: "center",
|
|
83
|
+
alignItems: "center",
|
|
84
|
+
minWidth: 100,
|
|
85
|
+
}}
|
|
86
|
+
>
|
|
87
|
+
<Text
|
|
88
|
+
style={{
|
|
89
|
+
fontSize: 14,
|
|
90
|
+
fontWeight: "600",
|
|
91
|
+
color: color === "currentColor" ? "#000000" : "#FFFFFF",
|
|
92
|
+
}}
|
|
93
|
+
>
|
|
94
|
+
Color
|
|
95
|
+
</Text>
|
|
96
|
+
</Pressable>
|
|
97
|
+
</View>
|
|
55
98
|
|
|
56
99
|
<FlatList
|
|
57
100
|
data={iconsFiltered}
|