@korsolutions/ui 0.0.60 → 0.0.62
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/module/components/button/variants/ghost.js +59 -0
- package/dist/module/components/button/variants/ghost.js.map +1 -0
- package/dist/module/components/button/variants/index.js +3 -1
- package/dist/module/components/button/variants/index.js.map +1 -1
- package/dist/module/components/icon-button/icon-button.js +63 -0
- package/dist/module/components/icon-button/icon-button.js.map +1 -0
- package/dist/module/components/icon-button/index.js +4 -0
- package/dist/module/components/icon-button/index.js.map +1 -0
- package/dist/module/components/icon-button/types.js +4 -0
- package/dist/module/components/icon-button/types.js.map +1 -0
- package/dist/module/components/icon-button/variants/default.js +34 -0
- package/dist/module/components/icon-button/variants/default.js.map +1 -0
- package/dist/module/components/icon-button/variants/ghost.js +35 -0
- package/dist/module/components/icon-button/variants/ghost.js.map +1 -0
- package/dist/module/components/icon-button/variants/index.js +11 -0
- package/dist/module/components/icon-button/variants/index.js.map +1 -0
- package/dist/module/components/icon-button/variants/secondary.js +37 -0
- package/dist/module/components/icon-button/variants/secondary.js.map +1 -0
- package/dist/module/components/index.js +2 -0
- package/dist/module/components/index.js.map +1 -1
- package/dist/module/components/separator/index.js +4 -0
- package/dist/module/components/separator/index.js.map +1 -0
- package/dist/module/components/separator/separator.js +17 -0
- package/dist/module/components/separator/separator.js.map +1 -0
- package/dist/module/components/separator/types.js +4 -0
- package/dist/module/components/separator/types.js.map +1 -0
- package/dist/module/components/separator/variants/horizontal.js +15 -0
- package/dist/module/components/separator/variants/horizontal.js.map +1 -0
- package/dist/module/components/separator/variants/index.js +9 -0
- package/dist/module/components/separator/variants/index.js.map +1 -0
- package/dist/module/components/separator/variants/vertical.js +15 -0
- package/dist/module/components/separator/variants/vertical.js.map +1 -0
- package/dist/module/components/tabs/components/tabs-item.js +61 -0
- package/dist/module/components/tabs/components/tabs-item.js.map +1 -0
- package/dist/module/components/tabs/components/tabs-root.js +3 -2
- package/dist/module/components/tabs/components/tabs-root.js.map +1 -1
- package/dist/module/components/tabs/index.js +2 -6
- package/dist/module/components/tabs/index.js.map +1 -1
- package/dist/module/components/tabs/use-organized-children.js +37 -0
- package/dist/module/components/tabs/use-organized-children.js.map +1 -0
- package/dist/module/components/tabs/variants/default.js +26 -8
- package/dist/module/components/tabs/variants/default.js.map +1 -1
- package/dist/module/components/tabs/variants/line.js +24 -7
- package/dist/module/components/tabs/variants/line.js.map +1 -1
- package/dist/typescript/src/components/button/variants/ghost.d.ts +3 -0
- package/dist/typescript/src/components/button/variants/ghost.d.ts.map +1 -0
- package/dist/typescript/src/components/button/variants/index.d.ts +1 -0
- package/dist/typescript/src/components/button/variants/index.d.ts.map +1 -1
- package/dist/typescript/src/components/icon-button/icon-button.d.ts +15 -0
- package/dist/typescript/src/components/icon-button/icon-button.d.ts.map +1 -0
- package/dist/typescript/src/components/icon-button/index.d.ts +3 -0
- package/dist/typescript/src/components/icon-button/index.d.ts.map +1 -0
- package/dist/typescript/src/components/icon-button/types.d.ts +8 -0
- package/dist/typescript/src/components/icon-button/types.d.ts.map +1 -0
- package/dist/typescript/src/components/icon-button/variants/default.d.ts +3 -0
- package/dist/typescript/src/components/icon-button/variants/default.d.ts.map +1 -0
- package/dist/typescript/src/components/icon-button/variants/ghost.d.ts +3 -0
- package/dist/typescript/src/components/icon-button/variants/ghost.d.ts.map +1 -0
- package/dist/typescript/src/components/icon-button/variants/index.d.ts +6 -0
- package/dist/typescript/src/components/icon-button/variants/index.d.ts.map +1 -0
- package/dist/typescript/src/components/icon-button/variants/secondary.d.ts +3 -0
- package/dist/typescript/src/components/icon-button/variants/secondary.d.ts.map +1 -0
- package/dist/typescript/src/components/index.d.ts +2 -0
- package/dist/typescript/src/components/index.d.ts.map +1 -1
- package/dist/typescript/src/components/separator/index.d.ts +3 -0
- package/dist/typescript/src/components/separator/index.d.ts.map +1 -0
- package/dist/typescript/src/components/separator/separator.d.ts +9 -0
- package/dist/typescript/src/components/separator/separator.d.ts.map +1 -0
- package/dist/typescript/src/components/separator/types.d.ts +5 -0
- package/dist/typescript/src/components/separator/types.d.ts.map +1 -0
- package/dist/typescript/src/components/separator/variants/horizontal.d.ts +3 -0
- package/dist/typescript/src/components/separator/variants/horizontal.d.ts.map +1 -0
- package/dist/typescript/src/components/separator/variants/index.d.ts +5 -0
- package/dist/typescript/src/components/separator/variants/index.d.ts.map +1 -0
- package/dist/typescript/src/components/separator/variants/vertical.d.ts +3 -0
- package/dist/typescript/src/components/separator/variants/vertical.d.ts.map +1 -0
- package/dist/typescript/src/components/tabs/components/{tabs-trigger.d.ts → tabs-item.d.ts} +3 -3
- package/dist/typescript/src/components/tabs/components/tabs-item.d.ts.map +1 -0
- package/dist/typescript/src/components/tabs/components/tabs-root.d.ts.map +1 -1
- package/dist/typescript/src/components/tabs/index.d.ts +3 -9
- package/dist/typescript/src/components/tabs/index.d.ts.map +1 -1
- package/dist/typescript/src/components/tabs/types.d.ts +8 -7
- package/dist/typescript/src/components/tabs/types.d.ts.map +1 -1
- package/dist/typescript/src/components/tabs/use-organized-children.d.ts +5 -0
- package/dist/typescript/src/components/tabs/use-organized-children.d.ts.map +1 -0
- package/dist/typescript/src/components/tabs/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/tabs/variants/line.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/button/variants/ghost.tsx +55 -0
- package/src/components/button/variants/index.ts +2 -0
- package/src/components/icon-button/icon-button.tsx +92 -0
- package/src/components/icon-button/index.ts +2 -0
- package/src/components/icon-button/types.ts +9 -0
- package/src/components/icon-button/variants/default.tsx +32 -0
- package/src/components/icon-button/variants/ghost.tsx +33 -0
- package/src/components/icon-button/variants/index.ts +9 -0
- package/src/components/icon-button/variants/secondary.tsx +35 -0
- package/src/components/index.ts +2 -0
- package/src/components/separator/index.ts +2 -0
- package/src/components/separator/separator.tsx +15 -0
- package/src/components/separator/types.ts +5 -0
- package/src/components/separator/variants/horizontal.tsx +14 -0
- package/src/components/separator/variants/index.ts +7 -0
- package/src/components/separator/variants/vertical.tsx +14 -0
- package/src/components/tabs/components/tabs-item.tsx +96 -0
- package/src/components/tabs/components/tabs-root.tsx +9 -2
- package/src/components/tabs/index.ts +3 -9
- package/src/components/tabs/types.ts +8 -7
- package/src/components/tabs/use-organized-children.tsx +37 -0
- package/src/components/tabs/variants/default.tsx +25 -7
- package/src/components/tabs/variants/line.tsx +22 -5
- package/dist/module/components/tabs/components/tabs-list.js +0 -23
- package/dist/module/components/tabs/components/tabs-list.js.map +0 -1
- package/dist/module/components/tabs/components/tabs-trigger-text.js +0 -28
- package/dist/module/components/tabs/components/tabs-trigger-text.js.map +0 -1
- package/dist/module/components/tabs/components/tabs-trigger.js +0 -45
- package/dist/module/components/tabs/components/tabs-trigger.js.map +0 -1
- package/dist/typescript/src/components/tabs/components/tabs-list.d.ts +0 -8
- package/dist/typescript/src/components/tabs/components/tabs-list.d.ts.map +0 -1
- package/dist/typescript/src/components/tabs/components/tabs-trigger-text.d.ts +0 -10
- package/dist/typescript/src/components/tabs/components/tabs-trigger-text.d.ts.map +0 -1
- package/dist/typescript/src/components/tabs/components/tabs-trigger.d.ts.map +0 -1
- package/src/components/tabs/components/tabs-list.tsx +0 -21
- package/src/components/tabs/components/tabs-trigger-text.tsx +0 -26
- package/src/components/tabs/components/tabs-trigger.tsx +0 -43
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
|
+
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
+
export const useButtonVariantGhost = () => {
|
|
6
|
+
return useThemedStyles(({
|
|
7
|
+
colors,
|
|
8
|
+
radius,
|
|
9
|
+
fontFamily,
|
|
10
|
+
fontSize
|
|
11
|
+
}) => ({
|
|
12
|
+
root: {
|
|
13
|
+
default: {
|
|
14
|
+
flexDirection: "row",
|
|
15
|
+
paddingVertical: 12,
|
|
16
|
+
paddingHorizontal: 16,
|
|
17
|
+
borderRadius: radius,
|
|
18
|
+
gap: 8,
|
|
19
|
+
alignItems: "center",
|
|
20
|
+
justifyContent: "center",
|
|
21
|
+
backgroundColor: "transparent"
|
|
22
|
+
},
|
|
23
|
+
disabled: {
|
|
24
|
+
opacity: 0.5
|
|
25
|
+
},
|
|
26
|
+
loading: {
|
|
27
|
+
opacity: 0.5
|
|
28
|
+
},
|
|
29
|
+
hovered: {
|
|
30
|
+
backgroundColor: hslaSetRelativeLightness(colors.secondary, -1)
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
label: {
|
|
34
|
+
default: {
|
|
35
|
+
color: colors.foreground,
|
|
36
|
+
fontSize,
|
|
37
|
+
fontFamily
|
|
38
|
+
},
|
|
39
|
+
disabled: {
|
|
40
|
+
color: colors.mutedForeground
|
|
41
|
+
},
|
|
42
|
+
loading: {
|
|
43
|
+
color: colors.mutedForeground
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
spinner: {
|
|
47
|
+
default: {
|
|
48
|
+
color: colors.foreground
|
|
49
|
+
},
|
|
50
|
+
disabled: {
|
|
51
|
+
color: colors.mutedForeground
|
|
52
|
+
},
|
|
53
|
+
loading: {
|
|
54
|
+
color: colors.mutedForeground
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}));
|
|
58
|
+
};
|
|
59
|
+
//# sourceMappingURL=ghost.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useButtonVariantGhost","colors","radius","fontFamily","fontSize","root","default","flexDirection","paddingVertical","paddingHorizontal","borderRadius","gap","alignItems","justifyContent","backgroundColor","disabled","opacity","loading","hovered","secondary","label","color","foreground","mutedForeground","spinner"],"sourceRoot":"../../../../../src","sources":["components/button/variants/ghost.tsx"],"mappings":";;AACA,SAASA,wBAAwB,QAAQ,8BAA2B;AACpE,SAASC,eAAe,QAAQ,qCAAkC;AAElE,OAAO,MAAMC,qBAAqB,GAAGA,CAAA,KAAoB;EACvD,OAAOD,eAAe,CACpB,CAAC;IAAEE,MAAM;IAAEC,MAAM;IAAEC,UAAU;IAAEC;EAAS,CAAC,MAAoB;IAC3DC,IAAI,EAAE;MACJC,OAAO,EAAE;QACPC,aAAa,EAAE,KAAK;QACpBC,eAAe,EAAE,EAAE;QACnBC,iBAAiB,EAAE,EAAE;QACrBC,YAAY,EAAER,MAAM;QACpBS,GAAG,EAAE,CAAC;QACNC,UAAU,EAAE,QAAQ;QACpBC,cAAc,EAAE,QAAQ;QACxBC,eAAe,EAAE;MACnB,CAAC;MACDC,QAAQ,EAAE;QACRC,OAAO,EAAE;MACX,CAAC;MACDC,OAAO,EAAE;QACPD,OAAO,EAAE;MACX,CAAC;MACDE,OAAO,EAAE;QACPJ,eAAe,EAAEhB,wBAAwB,CAACG,MAAM,CAACkB,SAAS,EAAE,CAAC,CAAC;MAChE;IACF,CAAC;IACDC,KAAK,EAAE;MACLd,OAAO,EAAE;QACPe,KAAK,EAAEpB,MAAM,CAACqB,UAAU;QACxBlB,QAAQ;QACRD;MACF,CAAC;MACDY,QAAQ,EAAE;QACRM,KAAK,EAAEpB,MAAM,CAACsB;MAChB,CAAC;MACDN,OAAO,EAAE;QACPI,KAAK,EAAEpB,MAAM,CAACsB;MAChB;IACF,CAAC;IACDC,OAAO,EAAE;MACPlB,OAAO,EAAE;QACPe,KAAK,EAAEpB,MAAM,CAACqB;MAChB,CAAC;MACDP,QAAQ,EAAE;QACRM,KAAK,EAAEpB,MAAM,CAACsB;MAChB,CAAC;MACDN,OAAO,EAAE;QACPI,KAAK,EAAEpB,MAAM,CAACsB;MAChB;IACF;EACF,CAAC,CACH,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { useButtonVariantDefault } from "./default.js";
|
|
4
|
+
import { useButtonVariantGhost } from "./ghost.js";
|
|
4
5
|
import { useButtonVariantSecondary } from "./secondary.js";
|
|
5
6
|
export const ButtonVariants = {
|
|
6
7
|
default: useButtonVariantDefault,
|
|
7
|
-
secondary: useButtonVariantSecondary
|
|
8
|
+
secondary: useButtonVariantSecondary,
|
|
9
|
+
ghost: useButtonVariantGhost
|
|
8
10
|
};
|
|
9
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useButtonVariantDefault","useButtonVariantSecondary","ButtonVariants","default","secondary"],"sourceRoot":"../../../../../src","sources":["components/button/variants/index.ts"],"mappings":";;AAAA,SAASA,uBAAuB,QAAQ,cAAW;AACnD,SAASC,yBAAyB,QAAQ,gBAAa;AAEvD,OAAO,MAAMC,cAAc,GAAG;EAC5BC,OAAO,
|
|
1
|
+
{"version":3,"names":["useButtonVariantDefault","useButtonVariantGhost","useButtonVariantSecondary","ButtonVariants","default","secondary","ghost"],"sourceRoot":"../../../../../src","sources":["components/button/variants/index.ts"],"mappings":";;AAAA,SAASA,uBAAuB,QAAQ,cAAW;AACnD,SAASC,qBAAqB,QAAQ,YAAS;AAC/C,SAASC,yBAAyB,QAAQ,gBAAa;AAEvD,OAAO,MAAMC,cAAc,GAAG;EAC5BC,OAAO,EAAEJ,uBAAuB;EAChCK,SAAS,EAAEH,yBAAyB;EACpCI,KAAK,EAAEL;AACT,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React, { useState } from "react";
|
|
4
|
+
import { Pressable } from "react-native";
|
|
5
|
+
import { IconButtonVariants } from "./variants/index.js";
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
const calculateState = (props, isHovered) => {
|
|
8
|
+
if (props.isDisabled) return "disabled";
|
|
9
|
+
if (isHovered) return "hovered";
|
|
10
|
+
return "default";
|
|
11
|
+
};
|
|
12
|
+
const cursorValue = state => {
|
|
13
|
+
if (state === "disabled") return "not-allowed";
|
|
14
|
+
return "pointer";
|
|
15
|
+
};
|
|
16
|
+
export function IconButton(props) {
|
|
17
|
+
const {
|
|
18
|
+
render: IconComponent,
|
|
19
|
+
variant = "default",
|
|
20
|
+
isDisabled,
|
|
21
|
+
size,
|
|
22
|
+
color,
|
|
23
|
+
strokeWidth,
|
|
24
|
+
style,
|
|
25
|
+
...rest
|
|
26
|
+
} = props;
|
|
27
|
+
const variantStyles = IconButtonVariants[variant]();
|
|
28
|
+
const [isHovered, setIsHovered] = useState(false);
|
|
29
|
+
const state = calculateState(props, isHovered);
|
|
30
|
+
const handlePress = event => {
|
|
31
|
+
if (isDisabled) {
|
|
32
|
+
event.preventDefault();
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
rest.onPress?.(event);
|
|
36
|
+
};
|
|
37
|
+
const iconProps = {
|
|
38
|
+
size: size ?? variantStyles.icon?.default?.size,
|
|
39
|
+
color: color ?? variantStyles.icon?.[state]?.color ?? variantStyles.icon?.default?.color,
|
|
40
|
+
strokeWidth,
|
|
41
|
+
absoluteStrokeWidth: true
|
|
42
|
+
};
|
|
43
|
+
return /*#__PURE__*/_jsx(Pressable, {
|
|
44
|
+
...rest,
|
|
45
|
+
onPress: handlePress,
|
|
46
|
+
onHoverIn: e => {
|
|
47
|
+
setIsHovered(true);
|
|
48
|
+
rest.onHoverIn?.(e);
|
|
49
|
+
},
|
|
50
|
+
onHoverOut: e => {
|
|
51
|
+
setIsHovered(false);
|
|
52
|
+
rest.onHoverOut?.(e);
|
|
53
|
+
},
|
|
54
|
+
disabled: isDisabled,
|
|
55
|
+
style: [variantStyles.root?.default, variantStyles.root?.[state], {
|
|
56
|
+
cursor: cursorValue(state)
|
|
57
|
+
}, style],
|
|
58
|
+
children: /*#__PURE__*/_jsx(IconComponent, {
|
|
59
|
+
...iconProps
|
|
60
|
+
})
|
|
61
|
+
});
|
|
62
|
+
}
|
|
63
|
+
//# sourceMappingURL=icon-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useState","Pressable","IconButtonVariants","jsx","_jsx","calculateState","props","isHovered","isDisabled","cursorValue","state","IconButton","render","IconComponent","variant","size","color","strokeWidth","style","rest","variantStyles","setIsHovered","handlePress","event","preventDefault","onPress","iconProps","icon","default","absoluteStrokeWidth","onHoverIn","e","onHoverOut","disabled","root","cursor","children"],"sourceRoot":"../../../../src","sources":["components/icon-button/icon-button.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SACEC,SAAS,QAKJ,cAAc;AAGrB,SAASC,kBAAkB,QAAQ,qBAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAahD,MAAMC,cAAc,GAAGA,CACrBC,KAAsB,EACtBC,SAAkB,KACE;EACpB,IAAID,KAAK,CAACE,UAAU,EAAE,OAAO,UAAU;EACvC,IAAID,SAAS,EAAE,OAAO,SAAS;EAC/B,OAAO,SAAS;AAClB,CAAC;AAED,MAAME,WAAW,GAAIC,KAAsB,IAAkB;EAC3D,IAAIA,KAAK,KAAK,UAAU,EAAE,OAAO,aAAa;EAC9C,OAAO,SAAS;AAClB,CAAC;AAED,OAAO,SAASC,UAAUA,CAACL,KAAsB,EAAE;EACjD,MAAM;IACJM,MAAM,EAAEC,aAAa;IACrBC,OAAO,GAAG,SAAS;IACnBN,UAAU;IACVO,IAAI;IACJC,KAAK;IACLC,WAAW;IACXC,KAAK;IACL,GAAGC;EACL,CAAC,GAAGb,KAAK;EAET,MAAMc,aAAa,GAAGlB,kBAAkB,CAACY,OAAO,CAAC,CAAC,CAAC;EACnD,MAAM,CAACP,SAAS,EAAEc,YAAY,CAAC,GAAGrB,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAMU,KAAK,GAAGL,cAAc,CAACC,KAAK,EAAEC,SAAS,CAAC;EAE9C,MAAMe,WAAsC,GAAIC,KAAK,IAAK;IACxD,IAAIf,UAAU,EAAE;MACde,KAAK,CAACC,cAAc,CAAC,CAAC;MACtB;IACF;IACAL,IAAI,CAACM,OAAO,GAAGF,KAAK,CAAC;EACvB,CAAC;EAED,MAAMG,SAAmB,GAAG;IAC1BX,IAAI,EAAEA,IAAI,IAAIK,aAAa,CAACO,IAAI,EAAEC,OAAO,EAAEb,IAAI;IAC/CC,KAAK,EAAEA,KAAK,IAAII,aAAa,CAACO,IAAI,GAAGjB,KAAK,CAAC,EAAEM,KAAK,IAAII,aAAa,CAACO,IAAI,EAAEC,OAAO,EAAEZ,KAAK;IACxFC,WAAW;IACXY,mBAAmB,EAAE;EACvB,CAAC;EAED,oBACEzB,IAAA,CAACH,SAAS;IAAA,GACJkB,IAAI;IACRM,OAAO,EAAEH,WAAY;IACrBQ,SAAS,EAAGC,CAAC,IAAK;MAChBV,YAAY,CAAC,IAAI,CAAC;MAClBF,IAAI,CAACW,SAAS,GAAGC,CAAC,CAAC;IACrB,CAAE;IACFC,UAAU,EAAGD,CAAC,IAAK;MACjBV,YAAY,CAAC,KAAK,CAAC;MACnBF,IAAI,CAACa,UAAU,GAAGD,CAAC,CAAC;IACtB,CAAE;IACFE,QAAQ,EAAEzB,UAAW;IACrBU,KAAK,EAAE,CACLE,aAAa,CAACc,IAAI,EAAEN,OAAO,EAC3BR,aAAa,CAACc,IAAI,GAAGxB,KAAK,CAAC,EAC3B;MAAEyB,MAAM,EAAE1B,WAAW,CAACC,KAAK;IAAE,CAAC,EAC9BQ,KAAK,CACL;IAAAkB,QAAA,eAEFhC,IAAA,CAACS,aAAa;MAAA,GAAKa;IAAS,CAAG;EAAC,CACvB,CAAC;AAEhB","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["IconButton"],"sourceRoot":"../../../../src","sources":["components/icon-button/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAA8B,kBAAe","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/icon-button/types.ts"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
|
+
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
+
export const useIconButtonVariantDefault = () => {
|
|
6
|
+
return useThemedStyles(({
|
|
7
|
+
colors,
|
|
8
|
+
radius
|
|
9
|
+
}) => ({
|
|
10
|
+
root: {
|
|
11
|
+
default: {
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
justifyContent: "center",
|
|
14
|
+
padding: 8,
|
|
15
|
+
borderRadius: radius,
|
|
16
|
+
backgroundColor: colors.primary,
|
|
17
|
+
borderWidth: 1,
|
|
18
|
+
borderColor: colors.border
|
|
19
|
+
},
|
|
20
|
+
disabled: {
|
|
21
|
+
opacity: 0.5
|
|
22
|
+
},
|
|
23
|
+
hovered: {
|
|
24
|
+
backgroundColor: hslaSetRelativeLightness(colors.primary, -10)
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
icon: {
|
|
28
|
+
default: {
|
|
29
|
+
color: colors.primaryForeground
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}));
|
|
33
|
+
};
|
|
34
|
+
//# sourceMappingURL=default.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantDefault","colors","radius","root","default","alignItems","justifyContent","padding","borderRadius","backgroundColor","primary","borderWidth","borderColor","border","disabled","opacity","hovered","icon","color","primaryForeground"],"sourceRoot":"../../../../../src","sources":["components/icon-button/variants/default.tsx"],"mappings":";;AAAA,SAASA,wBAAwB,QAAQ,8BAA2B;AACpE,SAASC,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,2BAA2B,GAAGA,CAAA,KAAwB;EACjE,OAAOD,eAAe,CACpB,CAAC;IAAEE,MAAM;IAAEC;EAAO,CAAC,MAAwB;IACzCC,IAAI,EAAE;MACJC,OAAO,EAAE;QACPC,UAAU,EAAE,QAAQ;QACpBC,cAAc,EAAE,QAAQ;QACxBC,OAAO,EAAE,CAAC;QACVC,YAAY,EAAEN,MAAM;QACpBO,eAAe,EAAER,MAAM,CAACS,OAAO;QAC/BC,WAAW,EAAE,CAAC;QACdC,WAAW,EAAEX,MAAM,CAACY;MACtB,CAAC;MACDC,QAAQ,EAAE;QACRC,OAAO,EAAE;MACX,CAAC;MACDC,OAAO,EAAE;QACPP,eAAe,EAAEX,wBAAwB,CAACG,MAAM,CAACS,OAAO,EAAE,CAAC,EAAE;MAC/D;IACF,CAAC;IACDO,IAAI,EAAE;MACJb,OAAO,EAAE;QACPc,KAAK,EAAEjB,MAAM,CAACkB;MAChB;IACF;EACF,CAAC,CACH,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
|
+
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
+
export const useIconButtonVariantGhost = () => {
|
|
6
|
+
return useThemedStyles(({
|
|
7
|
+
colors,
|
|
8
|
+
radius
|
|
9
|
+
}) => ({
|
|
10
|
+
root: {
|
|
11
|
+
default: {
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
justifyContent: "center",
|
|
14
|
+
padding: 8,
|
|
15
|
+
borderRadius: radius,
|
|
16
|
+
backgroundColor: "transparent"
|
|
17
|
+
},
|
|
18
|
+
disabled: {
|
|
19
|
+
opacity: 0.5
|
|
20
|
+
},
|
|
21
|
+
hovered: {
|
|
22
|
+
backgroundColor: hslaSetRelativeLightness(colors.secondary, -1)
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
icon: {
|
|
26
|
+
default: {
|
|
27
|
+
color: colors.foreground
|
|
28
|
+
},
|
|
29
|
+
disabled: {
|
|
30
|
+
color: colors.mutedForeground
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}));
|
|
34
|
+
};
|
|
35
|
+
//# sourceMappingURL=ghost.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantGhost","colors","radius","root","default","alignItems","justifyContent","padding","borderRadius","backgroundColor","disabled","opacity","hovered","secondary","icon","color","foreground","mutedForeground"],"sourceRoot":"../../../../../src","sources":["components/icon-button/variants/ghost.tsx"],"mappings":";;AAAA,SAASA,wBAAwB,QAAQ,8BAA2B;AACpE,SAASC,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,yBAAyB,GAAGA,CAAA,KAAwB;EAC/D,OAAOD,eAAe,CACpB,CAAC;IAAEE,MAAM;IAAEC;EAAO,CAAC,MAAwB;IACzCC,IAAI,EAAE;MACJC,OAAO,EAAE;QACPC,UAAU,EAAE,QAAQ;QACpBC,cAAc,EAAE,QAAQ;QACxBC,OAAO,EAAE,CAAC;QACVC,YAAY,EAAEN,MAAM;QACpBO,eAAe,EAAE;MACnB,CAAC;MACDC,QAAQ,EAAE;QACRC,OAAO,EAAE;MACX,CAAC;MACDC,OAAO,EAAE;QACPH,eAAe,EAAEX,wBAAwB,CAACG,MAAM,CAACY,SAAS,EAAE,CAAC,CAAC;MAChE;IACF,CAAC;IACDC,IAAI,EAAE;MACJV,OAAO,EAAE;QACPW,KAAK,EAAEd,MAAM,CAACe;MAChB,CAAC;MACDN,QAAQ,EAAE;QACRK,KAAK,EAAEd,MAAM,CAACgB;MAChB;IACF;EACF,CAAC,CACH,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useIconButtonVariantDefault } from "./default.js";
|
|
4
|
+
import { useIconButtonVariantGhost } from "./ghost.js";
|
|
5
|
+
import { useIconButtonVariantSecondary } from "./secondary.js";
|
|
6
|
+
export const IconButtonVariants = {
|
|
7
|
+
default: useIconButtonVariantDefault,
|
|
8
|
+
secondary: useIconButtonVariantSecondary,
|
|
9
|
+
ghost: useIconButtonVariantGhost
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useIconButtonVariantDefault","useIconButtonVariantGhost","useIconButtonVariantSecondary","IconButtonVariants","default","secondary","ghost"],"sourceRoot":"../../../../../src","sources":["components/icon-button/variants/index.ts"],"mappings":";;AAAA,SAASA,2BAA2B,QAAQ,cAAW;AACvD,SAASC,yBAAyB,QAAQ,YAAS;AACnD,SAASC,6BAA6B,QAAQ,gBAAa;AAE3D,OAAO,MAAMC,kBAAkB,GAAG;EAChCC,OAAO,EAAEJ,2BAA2B;EACpCK,SAAS,EAAEH,6BAA6B;EACxCI,KAAK,EAAEL;AACT,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
|
+
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
+
export const useIconButtonVariantSecondary = () => {
|
|
6
|
+
return useThemedStyles(({
|
|
7
|
+
colors,
|
|
8
|
+
radius
|
|
9
|
+
}) => ({
|
|
10
|
+
root: {
|
|
11
|
+
default: {
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
justifyContent: "center",
|
|
14
|
+
padding: 8,
|
|
15
|
+
borderRadius: radius,
|
|
16
|
+
borderWidth: 1,
|
|
17
|
+
borderColor: colors.border,
|
|
18
|
+
backgroundColor: colors.secondary
|
|
19
|
+
},
|
|
20
|
+
disabled: {
|
|
21
|
+
opacity: 0.5
|
|
22
|
+
},
|
|
23
|
+
hovered: {
|
|
24
|
+
backgroundColor: hslaSetRelativeLightness(colors.secondary, -1)
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
icon: {
|
|
28
|
+
default: {
|
|
29
|
+
color: colors.secondaryForeground
|
|
30
|
+
},
|
|
31
|
+
disabled: {
|
|
32
|
+
color: colors.mutedForeground
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}));
|
|
36
|
+
};
|
|
37
|
+
//# sourceMappingURL=secondary.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantSecondary","colors","radius","root","default","alignItems","justifyContent","padding","borderRadius","borderWidth","borderColor","border","backgroundColor","secondary","disabled","opacity","hovered","icon","color","secondaryForeground","mutedForeground"],"sourceRoot":"../../../../../src","sources":["components/icon-button/variants/secondary.tsx"],"mappings":";;AAAA,SAASA,wBAAwB,QAAQ,8BAA2B;AACpE,SAASC,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,6BAA6B,GAAGA,CAAA,KAAwB;EACnE,OAAOD,eAAe,CACpB,CAAC;IAAEE,MAAM;IAAEC;EAAO,CAAC,MAAwB;IACzCC,IAAI,EAAE;MACJC,OAAO,EAAE;QACPC,UAAU,EAAE,QAAQ;QACpBC,cAAc,EAAE,QAAQ;QACxBC,OAAO,EAAE,CAAC;QACVC,YAAY,EAAEN,MAAM;QACpBO,WAAW,EAAE,CAAC;QACdC,WAAW,EAAET,MAAM,CAACU,MAAM;QAC1BC,eAAe,EAAEX,MAAM,CAACY;MAC1B,CAAC;MACDC,QAAQ,EAAE;QACRC,OAAO,EAAE;MACX,CAAC;MACDC,OAAO,EAAE;QACPJ,eAAe,EAAEd,wBAAwB,CAACG,MAAM,CAACY,SAAS,EAAE,CAAC,CAAC;MAChE;IACF,CAAC;IACDI,IAAI,EAAE;MACJb,OAAO,EAAE;QACPc,KAAK,EAAEjB,MAAM,CAACkB;MAChB,CAAC;MACDL,QAAQ,EAAE;QACRI,KAAK,EAAEjB,MAAM,CAACmB;MAChB;IACF;EACF,CAAC,CACH,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -11,6 +11,7 @@ export * from "./checkbox/index.js";
|
|
|
11
11
|
export * from "./empty/index.js";
|
|
12
12
|
export * from "./field/index.js";
|
|
13
13
|
export * from "./icon/index.js";
|
|
14
|
+
export * from "./icon-button/index.js";
|
|
14
15
|
export * from "./input/index.js";
|
|
15
16
|
export * from "./link/index.js";
|
|
16
17
|
export * from "./list/index.js";
|
|
@@ -21,6 +22,7 @@ export * from "./portal/index.js";
|
|
|
21
22
|
export * from "./progress/index.js";
|
|
22
23
|
export * from "./scroll-bar/index.js";
|
|
23
24
|
export * from "./select/index.js";
|
|
25
|
+
export * from "./separator/index.js";
|
|
24
26
|
export * from "./tabs/index.js";
|
|
25
27
|
export * from "./textarea/index.js";
|
|
26
28
|
export * from "./toast/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,kBAAS;AACvB,cAAc,yBAAgB;AAC9B,cAAc,mBAAU;AACxB,cAAc,kBAAS;AACvB,cAAc,mBAAU;AACxB,cAAc,qBAAY;AAC1B,cAAc,iBAAQ;AACtB,cAAc,qBAAY;AAC1B,cAAc,kBAAS;AACvB,cAAc,kBAAS;AACvB,cAAc,iBAAQ;AACtB,cAAc,kBAAS;AACvB,cAAc,iBAAQ;AACtB,cAAc,iBAAQ;AACtB,cAAc,iBAAQ;AACtB,cAAc,wBAAe;AAC7B,cAAc,oBAAW;AACzB,cAAc,mBAAU;AACxB,cAAc,qBAAY;AAC1B,cAAc,uBAAc;AAC5B,cAAc,mBAAU;AACxB,cAAc,iBAAQ;AACtB,cAAc,qBAAY;AAC1B,cAAc,kBAAS;AACvB,cAAc,sBAAa;AAC3B,cAAc,uBAAc","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,kBAAS;AACvB,cAAc,yBAAgB;AAC9B,cAAc,mBAAU;AACxB,cAAc,kBAAS;AACvB,cAAc,mBAAU;AACxB,cAAc,qBAAY;AAC1B,cAAc,iBAAQ;AACtB,cAAc,qBAAY;AAC1B,cAAc,kBAAS;AACvB,cAAc,kBAAS;AACvB,cAAc,iBAAQ;AACtB,cAAc,wBAAe;AAC7B,cAAc,kBAAS;AACvB,cAAc,iBAAQ;AACtB,cAAc,iBAAQ;AACtB,cAAc,iBAAQ;AACtB,cAAc,wBAAe;AAC7B,cAAc,oBAAW;AACzB,cAAc,mBAAU;AACxB,cAAc,qBAAY;AAC1B,cAAc,uBAAc;AAC5B,cAAc,mBAAU;AACxB,cAAc,sBAAa;AAC3B,cAAc,iBAAQ;AACtB,cAAc,qBAAY;AAC1B,cAAc,kBAAS;AACvB,cAAc,sBAAa;AAC3B,cAAc,uBAAc","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Separator"],"sourceRoot":"../../../../src","sources":["components/separator/index.ts"],"mappings":";;AAAA,SAASA,SAAS,QAA6B,gBAAa","ignoreList":[]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { View } from "react-native";
|
|
5
|
+
import { SeparatorVariants } from "./variants/index.js";
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
export function Separator(props) {
|
|
8
|
+
const {
|
|
9
|
+
variant = "horizontal",
|
|
10
|
+
style
|
|
11
|
+
} = props;
|
|
12
|
+
const variantStyles = SeparatorVariants[variant]();
|
|
13
|
+
return /*#__PURE__*/_jsx(View, {
|
|
14
|
+
style: [variantStyles.root, style]
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
//# sourceMappingURL=separator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","View","SeparatorVariants","jsx","_jsx","Separator","props","variant","style","variantStyles","root"],"sourceRoot":"../../../../src","sources":["components/separator/separator.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAwC,cAAc;AACnE,SAASC,iBAAiB,QAAQ,qBAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAO/C,OAAO,SAASC,SAASA,CAACC,KAAqB,EAAE;EAC/C,MAAM;IAAEC,OAAO,GAAG,YAAY;IAAEC;EAAM,CAAC,GAAGF,KAAK;EAC/C,MAAMG,aAAa,GAAGP,iBAAiB,CAACK,OAAO,CAAC,CAAC,CAAC;EAElD,oBAAOH,IAAA,CAACH,IAAI;IAACO,KAAK,EAAE,CAACC,aAAa,CAACC,IAAI,EAAEF,KAAK;EAAE,CAAE,CAAC;AACrD","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/separator/types.ts"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
4
|
+
export const useSeparatorVariantHorizontal = () => {
|
|
5
|
+
return useThemedStyles(({
|
|
6
|
+
colors
|
|
7
|
+
}) => ({
|
|
8
|
+
root: {
|
|
9
|
+
height: 1,
|
|
10
|
+
alignSelf: "stretch",
|
|
11
|
+
backgroundColor: colors.border
|
|
12
|
+
}
|
|
13
|
+
}));
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=horizontal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useThemedStyles","useSeparatorVariantHorizontal","colors","root","height","alignSelf","backgroundColor","border"],"sourceRoot":"../../../../../src","sources":["components/separator/variants/horizontal.tsx"],"mappings":";;AAAA,SAASA,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,6BAA6B,GAAGA,CAAA,KAAuB;EAClE,OAAOD,eAAe,CACpB,CAAC;IAAEE;EAAO,CAAC,MAAuB;IAChCC,IAAI,EAAE;MACJC,MAAM,EAAE,CAAC;MACTC,SAAS,EAAE,SAAS;MACpBC,eAAe,EAAEJ,MAAM,CAACK;IAC1B;EACF,CAAC,CACH,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useSeparatorVariantHorizontal } from "./horizontal.js";
|
|
4
|
+
import { useSeparatorVariantVertical } from "./vertical.js";
|
|
5
|
+
export const SeparatorVariants = {
|
|
6
|
+
horizontal: useSeparatorVariantHorizontal,
|
|
7
|
+
vertical: useSeparatorVariantVertical
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useSeparatorVariantHorizontal","useSeparatorVariantVertical","SeparatorVariants","horizontal","vertical"],"sourceRoot":"../../../../../src","sources":["components/separator/variants/index.ts"],"mappings":";;AAAA,SAASA,6BAA6B,QAAQ,iBAAc;AAC5D,SAASC,2BAA2B,QAAQ,eAAY;AAExD,OAAO,MAAMC,iBAAiB,GAAG;EAC/BC,UAAU,EAAEH,6BAA6B;EACzCI,QAAQ,EAAEH;AACZ,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
4
|
+
export const useSeparatorVariantVertical = () => {
|
|
5
|
+
return useThemedStyles(({
|
|
6
|
+
colors
|
|
7
|
+
}) => ({
|
|
8
|
+
root: {
|
|
9
|
+
width: 1,
|
|
10
|
+
alignSelf: "stretch",
|
|
11
|
+
backgroundColor: colors.border
|
|
12
|
+
}
|
|
13
|
+
}));
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=vertical.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useThemedStyles","useSeparatorVariantVertical","colors","root","width","alignSelf","backgroundColor","border"],"sourceRoot":"../../../../../src","sources":["components/separator/variants/vertical.tsx"],"mappings":";;AAAA,SAASA,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,2BAA2B,GAAGA,CAAA,KAAuB;EAChE,OAAOD,eAAe,CACpB,CAAC;IAAEE;EAAO,CAAC,MAAuB;IAChCC,IAAI,EAAE;MACJC,KAAK,EAAE,CAAC;MACRC,SAAS,EAAE,SAAS;MACpBC,eAAe,EAAEJ,MAAM,CAACK;IAC1B;EACF,CAAC,CACH,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React, { useState } from "react";
|
|
4
|
+
import { Pressable, StyleSheet } from "react-native";
|
|
5
|
+
import { useTabsContext } from "../context.js";
|
|
6
|
+
import { useOrganizedChildren } from "../use-organized-children.js";
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
const calculateState = (isActive, isDisabled, isHovered) => {
|
|
9
|
+
if (isDisabled) {
|
|
10
|
+
return "disabled";
|
|
11
|
+
}
|
|
12
|
+
if (isActive) {
|
|
13
|
+
return "active";
|
|
14
|
+
}
|
|
15
|
+
if (isHovered) {
|
|
16
|
+
return "hovered";
|
|
17
|
+
}
|
|
18
|
+
return "default";
|
|
19
|
+
};
|
|
20
|
+
export function TabsItem(props) {
|
|
21
|
+
const {
|
|
22
|
+
children,
|
|
23
|
+
value: triggerValue,
|
|
24
|
+
isDisabled = false,
|
|
25
|
+
style,
|
|
26
|
+
...pressableProps
|
|
27
|
+
} = props;
|
|
28
|
+
const {
|
|
29
|
+
value,
|
|
30
|
+
onChange,
|
|
31
|
+
styles
|
|
32
|
+
} = useTabsContext();
|
|
33
|
+
const [isHovered, setIsHovered] = useState(false);
|
|
34
|
+
const isActive = value === triggerValue;
|
|
35
|
+
const state = calculateState(isActive, isDisabled, isHovered);
|
|
36
|
+
const handlePress = () => {
|
|
37
|
+
if (!isDisabled) {
|
|
38
|
+
onChange(triggerValue);
|
|
39
|
+
}
|
|
40
|
+
};
|
|
41
|
+
const calculatedStyle = StyleSheet.flatten([styles?.item?.default, styles?.item?.[state], style]);
|
|
42
|
+
const textStyles = StyleSheet.flatten([styles?.itemText?.default, styles?.itemText?.[state]]);
|
|
43
|
+
const iconStyles = StyleSheet.flatten([styles?.itemIcon?.default, styles?.itemIcon?.[state]]);
|
|
44
|
+
const organizedChildren = useOrganizedChildren(children, textStyles, iconStyles ?? undefined);
|
|
45
|
+
return /*#__PURE__*/_jsx(Pressable, {
|
|
46
|
+
...pressableProps,
|
|
47
|
+
onHoverIn: e => {
|
|
48
|
+
setIsHovered(true);
|
|
49
|
+
pressableProps.onHoverIn?.(e);
|
|
50
|
+
},
|
|
51
|
+
onHoverOut: e => {
|
|
52
|
+
setIsHovered(false);
|
|
53
|
+
pressableProps.onHoverOut?.(e);
|
|
54
|
+
},
|
|
55
|
+
disabled: isDisabled,
|
|
56
|
+
onPress: handlePress,
|
|
57
|
+
style: calculatedStyle,
|
|
58
|
+
children: organizedChildren
|
|
59
|
+
});
|
|
60
|
+
}
|
|
61
|
+
//# sourceMappingURL=tabs-item.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useState","Pressable","StyleSheet","useTabsContext","useOrganizedChildren","jsx","_jsx","calculateState","isActive","isDisabled","isHovered","TabsItem","props","children","value","triggerValue","style","pressableProps","onChange","styles","setIsHovered","state","handlePress","calculatedStyle","flatten","item","default","textStyles","itemText","iconStyles","itemIcon","organizedChildren","undefined","onHoverIn","e","onHoverOut","disabled","onPress"],"sourceRoot":"../../../../../src","sources":["components/tabs/components/tabs-item.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SACEC,SAAS,EACTC,UAAU,QAIL,cAAc;AACrB,SAASC,cAAc,QAAQ,eAAY;AAE3C,SAASC,oBAAoB,QAAQ,8BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AASjE,MAAMC,cAAc,GAAGA,CACrBC,QAAiB,EACjBC,UAAmB,EACnBC,SAAkB,KACA;EAClB,IAAID,UAAU,EAAE;IACd,OAAO,UAAU;EACnB;EACA,IAAID,QAAQ,EAAE;IACZ,OAAO,QAAQ;EACjB;EACA,IAAIE,SAAS,EAAE;IACb,OAAO,SAAS;EAClB;EACA,OAAO,SAAS;AAClB,CAAC;AAED,OAAO,SAASC,QAAQA,CAACC,KAAoB,EAAE;EAC7C,MAAM;IACJC,QAAQ;IACRC,KAAK,EAAEC,YAAY;IACnBN,UAAU,GAAG,KAAK;IAClBO,KAAK;IACL,GAAGC;EACL,CAAC,GAAGL,KAAK;EACT,MAAM;IAAEE,KAAK;IAAEI,QAAQ;IAAEC;EAAO,CAAC,GAAGhB,cAAc,CAAC,CAAC;EACpD,MAAM,CAACO,SAAS,EAAEU,YAAY,CAAC,GAAGpB,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAMQ,QAAQ,GAAGM,KAAK,KAAKC,YAAY;EACvC,MAAMM,KAAK,GAAGd,cAAc,CAACC,QAAQ,EAAEC,UAAU,EAAEC,SAAS,CAAC;EAE7D,MAAMY,WAAW,GAAGA,CAAA,KAAM;IACxB,IAAI,CAACb,UAAU,EAAE;MACfS,QAAQ,CAACH,YAAY,CAAC;IACxB;EACF,CAAC;EAED,MAAMQ,eAAe,GAAGrB,UAAU,CAACsB,OAAO,CAAC,CACzCL,MAAM,EAAEM,IAAI,EAAEC,OAAO,EACrBP,MAAM,EAAEM,IAAI,GAAGJ,KAAK,CAAC,EACrBL,KAAK,CACN,CAAC;EAEF,MAAMW,UAAU,GAAGzB,UAAU,CAACsB,OAAO,CAAC,CACpCL,MAAM,EAAES,QAAQ,EAAEF,OAAO,EACzBP,MAAM,EAAES,QAAQ,GAAGP,KAAK,CAAC,CAC1B,CAAC;EAEF,MAAMQ,UAAU,GAAG3B,UAAU,CAACsB,OAAO,CAAC,CACpCL,MAAM,EAAEW,QAAQ,EAAEJ,OAAO,EACzBP,MAAM,EAAEW,QAAQ,GAAGT,KAAK,CAAC,CAC1B,CAAC;EAEF,MAAMU,iBAAiB,GAAG3B,oBAAoB,CAC5CS,QAAQ,EACRc,UAAU,EACVE,UAAU,IAAIG,SAChB,CAAC;EAED,oBACE1B,IAAA,CAACL,SAAS;IAAA,GACJgB,cAAc;IAClBgB,SAAS,EAAGC,CAAC,IAAK;MAChBd,YAAY,CAAC,IAAI,CAAC;MAClBH,cAAc,CAACgB,SAAS,GAAGC,CAAC,CAAC;IAC/B,CAAE;IACFC,UAAU,EAAGD,CAAC,IAAK;MACjBd,YAAY,CAAC,KAAK,CAAC;MACnBH,cAAc,CAACkB,UAAU,GAAGD,CAAC,CAAC;IAChC,CAAE;IACFE,QAAQ,EAAE3B,UAAW;IACrB4B,OAAO,EAAEf,WAAY;IACrBN,KAAK,EAAEO,eAAgB;IAAAV,QAAA,EAEtBkB;EAAiB,CACT,CAAC;AAEhB","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import React, { useMemo } from "react";
|
|
4
|
-
import { View } from "react-native";
|
|
4
|
+
import { StyleSheet, View } from "react-native";
|
|
5
5
|
import { TabsContext } from "../context.js";
|
|
6
6
|
import { TabsVariants } from "../variants/index.js";
|
|
7
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -19,11 +19,12 @@ export function TabsRoot(props) {
|
|
|
19
19
|
onChange,
|
|
20
20
|
styles: variantStyles
|
|
21
21
|
}), [value, onChange, variantStyles]);
|
|
22
|
+
const composedStyles = StyleSheet.flatten([variantStyles?.root, style]);
|
|
22
23
|
return /*#__PURE__*/_jsx(TabsContext.Provider, {
|
|
23
24
|
value: contextValue,
|
|
24
25
|
children: /*#__PURE__*/_jsx(View, {
|
|
25
26
|
...viewProps,
|
|
26
|
-
style:
|
|
27
|
+
style: composedStyles,
|
|
27
28
|
children: children
|
|
28
29
|
})
|
|
29
30
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMemo","View","TabsContext","TabsVariants","jsx","_jsx","TabsRoot","props","children","value","onChange","style","viewProps","variantStyles","variant","contextValue","styles","Provider"],"sourceRoot":"../../../../../src","sources":["components/tabs/components/tabs-root.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,
|
|
1
|
+
{"version":3,"names":["React","useMemo","StyleSheet","View","TabsContext","TabsVariants","jsx","_jsx","TabsRoot","props","children","value","onChange","style","viewProps","variantStyles","variant","contextValue","styles","composedStyles","flatten","root","Provider"],"sourceRoot":"../../../../../src","sources":["components/tabs/components/tabs-root.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SACEC,UAAU,EACVC,IAAI,QAIC,cAAc;AACrB,SAASC,WAAW,QAAQ,eAAY;AACxC,SAASC,YAAY,QAAQ,sBAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAU3C,OAAO,SAASC,QAAQA,CAACC,KAAoB,EAAE;EAC7C,MAAM;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,KAAK;IAAE,GAAGC;EAAU,CAAC,GAAGL,KAAK;EAChE,MAAMM,aAAa,GAAGV,YAAY,CAACI,KAAK,CAACO,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC;EAEhE,MAAMC,YAAY,GAAGhB,OAAO,CAC1B,OAAO;IACLU,KAAK;IACLC,QAAQ;IACRM,MAAM,EAAEH;EACV,CAAC,CAAC,EACF,CAACJ,KAAK,EAAEC,QAAQ,EAAEG,aAAa,CACjC,CAAC;EACD,MAAMI,cAAc,GAAGjB,UAAU,CAACkB,OAAO,CAAC,CAACL,aAAa,EAAEM,IAAI,EAAER,KAAK,CAAC,CAAC;EAEvE,oBACEN,IAAA,CAACH,WAAW,CAACkB,QAAQ;IAACX,KAAK,EAAEM,YAAa;IAAAP,QAAA,eACxCH,IAAA,CAACJ,IAAI;MAAA,GAAKW,SAAS;MAAED,KAAK,EAAEM,cAAe;MAAAT,QAAA,EACxCA;IAAQ,CACL;EAAC,CACa,CAAC;AAE3B","ignoreList":[]}
|
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import { TabsItem } from "./components/tabs-item.js";
|
|
4
4
|
import { TabsRoot } from "./components/tabs-root.js";
|
|
5
|
-
import { TabsTrigger } from "./components/tabs-trigger.js";
|
|
6
|
-
import { TabsTriggerText } from "./components/tabs-trigger-text.js";
|
|
7
5
|
export const Tabs = {
|
|
8
6
|
Root: TabsRoot,
|
|
9
|
-
|
|
10
|
-
Trigger: TabsTrigger,
|
|
11
|
-
TriggerText: TabsTriggerText
|
|
7
|
+
Item: TabsItem
|
|
12
8
|
};
|
|
13
9
|
export * from "./types.js";
|
|
14
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["TabsItem","TabsRoot","Tabs","Root","Item"],"sourceRoot":"../../../../src","sources":["components/tabs/index.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,2BAAwB;AACjD,SAASC,QAAQ,QAAQ,2BAAwB;AAEjD,OAAO,MAAMC,IAAI,GAAG;EAClBC,IAAI,EAAEF,QAAQ;EACdG,IAAI,EAAEJ;AACR,CAAC;AAID,cAAc,YAAS","ignoreList":[]}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React, { useMemo } from "react";
|
|
4
|
+
import { Text } from "react-native";
|
|
5
|
+
import { getElementProp } from "../../utils/element-utils.js";
|
|
6
|
+
import { Icon } from "../icon/index.js";
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
export function useOrganizedChildren(children, textStyle, iconProps) {
|
|
9
|
+
const organizedChildren = useMemo(() => {
|
|
10
|
+
if (typeof children === "string") {
|
|
11
|
+
return /*#__PURE__*/_jsx(Text, {
|
|
12
|
+
style: textStyle,
|
|
13
|
+
children: children
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
if (Array.isArray(children)) {
|
|
17
|
+
return children.map((child, index) => {
|
|
18
|
+
if (typeof child === "string") {
|
|
19
|
+
return /*#__PURE__*/_jsx(Text, {
|
|
20
|
+
style: textStyle,
|
|
21
|
+
children: child
|
|
22
|
+
}, index);
|
|
23
|
+
} else if (/*#__PURE__*/React.isValidElement(child) && child.type === Icon) {
|
|
24
|
+
return /*#__PURE__*/React.cloneElement(child, {
|
|
25
|
+
key: child.key,
|
|
26
|
+
...iconProps,
|
|
27
|
+
style: [iconProps?.style, getElementProp(child, "style")]
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
return child;
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
return children;
|
|
34
|
+
}, [children, iconProps, textStyle]);
|
|
35
|
+
return organizedChildren;
|
|
36
|
+
}
|
|
37
|
+
//# sourceMappingURL=use-organized-children.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useMemo","Text","getElementProp","Icon","jsx","_jsx","useOrganizedChildren","children","textStyle","iconProps","organizedChildren","style","Array","isArray","map","child","index","isValidElement","type","cloneElement","key"],"sourceRoot":"../../../../src","sources":["components/tabs/use-organized-children.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,IAAI,QAAwC,cAAc;AACnE,SAASC,cAAc,QAAQ,8BAA2B;AAC1D,SAASC,IAAI,QAAwB,kBAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/C,OAAO,SAASC,oBAAoBA,CAClCC,QAAyB,EACzBC,SAA2C,EAC3CC,SAAgC,EAChC;EACA,MAAMC,iBAAiB,GAAGV,OAAO,CAAC,MAAM;IACtC,IAAI,OAAOO,QAAQ,KAAK,QAAQ,EAAE;MAChC,oBAAOF,IAAA,CAACJ,IAAI;QAACU,KAAK,EAAEH,SAAU;QAAAD,QAAA,EAAEA;MAAQ,CAAO,CAAC;IAClD;IACA,IAAIK,KAAK,CAACC,OAAO,CAACN,QAAQ,CAAC,EAAE;MAC3B,OAAOA,QAAQ,CAACO,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAK;QACpC,IAAI,OAAOD,KAAK,KAAK,QAAQ,EAAE;UAC7B,oBACEV,IAAA,CAACJ,IAAI;YAAaU,KAAK,EAAEH,SAAU;YAAAD,QAAA,EAChCQ;UAAK,GADGC,KAEL,CAAC;QAEX,CAAC,MAAM,IAAI,aAAAjB,KAAK,CAACkB,cAAc,CAACF,KAAK,CAAC,IAAIA,KAAK,CAACG,IAAI,KAAKf,IAAI,EAAE;UAC7D,oBAAOJ,KAAK,CAACoB,YAAY,CAACJ,KAAK,EAA6B;YAC1DK,GAAG,EAAEL,KAAK,CAACK,GAAG;YACd,GAAGX,SAAS;YACZE,KAAK,EAAE,CAACF,SAAS,EAAEE,KAAK,EAAET,cAAc,CAACa,KAAK,EAAE,OAAO,CAAC;UAC1D,CAAC,CAAC;QACJ;QACA,OAAOA,KAAK;MACd,CAAC,CAAC;IACJ;IACA,OAAOR,QAAQ;EACjB,CAAC,EAAE,CAACA,QAAQ,EAAEE,SAAS,EAAED,SAAS,CAAC,CAAC;EAEpC,OAAOE,iBAAiB;AAC1B","ignoreList":[]}
|