@korsolutions/ui 0.0.85 → 0.0.86
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/AGENTS.md +3 -3
- package/dist/module/components/alert-dialog/components/alert-dialog-root.js +1 -1
- package/dist/module/components/alert-dialog/components/alert-dialog-root.js.map +1 -1
- package/dist/module/components/alert-dialog/variants/default.js +93 -85
- package/dist/module/components/alert-dialog/variants/default.js.map +1 -1
- package/dist/module/components/button/button.js +1 -1
- package/dist/module/components/button/button.js.map +1 -1
- package/dist/module/components/button/variants/default.js +48 -44
- package/dist/module/components/button/variants/default.js.map +1 -1
- package/dist/module/components/button/variants/ghost.js +64 -60
- package/dist/module/components/button/variants/ghost.js.map +1 -1
- package/dist/module/components/button/variants/secondary.js +66 -62
- package/dist/module/components/button/variants/secondary.js.map +1 -1
- package/dist/module/components/combobox/components/combobox-root.js +1 -1
- package/dist/module/components/combobox/components/combobox-root.js.map +1 -1
- package/dist/module/components/combobox/variants/default.js +91 -88
- package/dist/module/components/combobox/variants/default.js.map +1 -1
- package/dist/module/components/icon-button/icon-button.js +4 -5
- package/dist/module/components/icon-button/icon-button.js.map +1 -1
- package/dist/module/components/icon-button/variants/default.js +31 -24
- package/dist/module/components/icon-button/variants/default.js.map +1 -1
- package/dist/module/components/icon-button/variants/ghost.js +32 -25
- package/dist/module/components/icon-button/variants/ghost.js.map +1 -1
- package/dist/module/components/icon-button/variants/secondary.js +34 -27
- package/dist/module/components/icon-button/variants/secondary.js.map +1 -1
- package/dist/module/components/input/input.js +1 -1
- package/dist/module/components/input/input.js.map +1 -1
- package/dist/module/components/input/variants/default.js +39 -37
- package/dist/module/components/input/variants/default.js.map +1 -1
- package/dist/module/components/input/variants/secondary.js +39 -37
- package/dist/module/components/input/variants/secondary.js.map +1 -1
- package/dist/module/components/phone-input/components/phone-input-root.js +2 -1
- package/dist/module/components/phone-input/components/phone-input-root.js.map +1 -1
- package/dist/module/components/phone-input/variants/default.js +115 -112
- package/dist/module/components/phone-input/variants/default.js.map +1 -1
- package/dist/module/components/select/components/select-root.js +1 -1
- package/dist/module/components/select/components/select-root.js.map +1 -1
- package/dist/module/components/select/variants/default.js +75 -73
- package/dist/module/components/select/variants/default.js.map +1 -1
- package/dist/module/themes/default/index.js +1 -0
- package/dist/module/themes/default/index.js.map +1 -1
- package/dist/module/themes/provider.js +1 -0
- package/dist/module/themes/provider.js.map +1 -1
- package/dist/module/themes/utils.js +2 -1
- package/dist/module/themes/utils.js.map +1 -1
- package/dist/module/utils/size-scale.js +42 -0
- package/dist/module/utils/size-scale.js.map +1 -0
- package/dist/module/utils/use-themed-styles.js +4 -1
- package/dist/module/utils/use-themed-styles.js.map +1 -1
- package/dist/typescript/src/components/alert-dialog/components/alert-dialog-root.d.ts +2 -0
- package/dist/typescript/src/components/alert-dialog/components/alert-dialog-root.d.ts.map +1 -1
- package/dist/typescript/src/components/alert-dialog/variants/default.d.ts +3 -2
- package/dist/typescript/src/components/alert-dialog/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/alert-dialog/variants/index.d.ts +1 -1
- package/dist/typescript/src/components/button/button.d.ts +2 -0
- package/dist/typescript/src/components/button/button.d.ts.map +1 -1
- package/dist/typescript/src/components/button/variants/default.d.ts +2 -1
- package/dist/typescript/src/components/button/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/button/variants/ghost.d.ts +2 -1
- package/dist/typescript/src/components/button/variants/ghost.d.ts.map +1 -1
- package/dist/typescript/src/components/button/variants/index.d.ts +3 -3
- package/dist/typescript/src/components/button/variants/secondary.d.ts +2 -1
- package/dist/typescript/src/components/button/variants/secondary.d.ts.map +1 -1
- package/dist/typescript/src/components/combobox/components/combobox-root.d.ts +2 -0
- package/dist/typescript/src/components/combobox/components/combobox-root.d.ts.map +1 -1
- package/dist/typescript/src/components/combobox/variants/default.d.ts +2 -1
- package/dist/typescript/src/components/combobox/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/icon-button/icon-button.d.ts +2 -1
- package/dist/typescript/src/components/icon-button/icon-button.d.ts.map +1 -1
- package/dist/typescript/src/components/icon-button/variants/default.d.ts +2 -1
- package/dist/typescript/src/components/icon-button/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/icon-button/variants/ghost.d.ts +2 -1
- package/dist/typescript/src/components/icon-button/variants/ghost.d.ts.map +1 -1
- package/dist/typescript/src/components/icon-button/variants/index.d.ts +3 -3
- package/dist/typescript/src/components/icon-button/variants/secondary.d.ts +2 -1
- package/dist/typescript/src/components/icon-button/variants/secondary.d.ts.map +1 -1
- package/dist/typescript/src/components/input/input.d.ts +2 -0
- package/dist/typescript/src/components/input/input.d.ts.map +1 -1
- package/dist/typescript/src/components/input/variants/default.d.ts +2 -1
- package/dist/typescript/src/components/input/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/input/variants/secondary.d.ts +3 -2
- package/dist/typescript/src/components/input/variants/secondary.d.ts.map +1 -1
- package/dist/typescript/src/components/phone-input/components/phone-input-root.d.ts +3 -1
- package/dist/typescript/src/components/phone-input/components/phone-input-root.d.ts.map +1 -1
- package/dist/typescript/src/components/phone-input/variants/default.d.ts +2 -1
- package/dist/typescript/src/components/phone-input/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/components/select/components/select-root.d.ts +2 -0
- package/dist/typescript/src/components/select/components/select-root.d.ts.map +1 -1
- package/dist/typescript/src/components/select/variants/default.d.ts +3 -2
- package/dist/typescript/src/components/select/variants/default.d.ts.map +1 -1
- package/dist/typescript/src/index.d.ts +2 -0
- package/dist/typescript/src/index.d.ts.map +1 -1
- package/dist/typescript/src/themes/default/index.d.ts.map +1 -1
- package/dist/typescript/src/themes/provider.d.ts +1 -0
- package/dist/typescript/src/themes/provider.d.ts.map +1 -1
- package/dist/typescript/src/themes/types.d.ts +1 -0
- package/dist/typescript/src/themes/types.d.ts.map +1 -1
- package/dist/typescript/src/themes/utils.d.ts.map +1 -1
- package/dist/typescript/src/utils/size-scale.d.ts +20 -0
- package/dist/typescript/src/utils/size-scale.d.ts.map +1 -0
- package/dist/typescript/src/utils/use-themed-styles.d.ts +5 -0
- package/dist/typescript/src/utils/use-themed-styles.d.ts.map +1 -1
- package/package.json +2 -2
- package/src/components/alert-dialog/components/alert-dialog-root.tsx +3 -1
- package/src/components/alert-dialog/variants/default.tsx +88 -79
- package/src/components/button/button.tsx +3 -1
- package/src/components/button/variants/default.tsx +14 -10
- package/src/components/button/variants/ghost.tsx +14 -10
- package/src/components/button/variants/secondary.tsx +14 -10
- package/src/components/combobox/components/combobox-root.tsx +3 -1
- package/src/components/combobox/variants/default.tsx +17 -14
- package/src/components/icon-button/icon-button.tsx +6 -6
- package/src/components/icon-button/variants/default.tsx +12 -6
- package/src/components/icon-button/variants/ghost.tsx +12 -6
- package/src/components/icon-button/variants/secondary.tsx +12 -6
- package/src/components/input/input.tsx +3 -1
- package/src/components/input/variants/default.tsx +11 -9
- package/src/components/input/variants/secondary.tsx +12 -10
- package/src/components/phone-input/components/phone-input-root.tsx +4 -1
- package/src/components/phone-input/variants/default.tsx +21 -18
- package/src/components/select/components/select-root.tsx +3 -1
- package/src/components/select/variants/default.tsx +16 -14
- package/src/index.tsx +2 -0
- package/src/themes/default/index.ts +1 -0
- package/src/themes/provider.tsx +2 -0
- package/src/themes/types.ts +1 -0
- package/src/themes/utils.ts +1 -0
- package/src/utils/size-scale.ts +45 -0
- package/src/utils/use-themed-styles.ts +8 -0
|
@@ -2,75 +2,79 @@
|
|
|
2
2
|
|
|
3
3
|
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
4
|
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
-
export const useButtonVariantSecondary =
|
|
5
|
+
export const useButtonVariantSecondary = size => {
|
|
6
6
|
return useThemedStyles(({
|
|
7
7
|
colors,
|
|
8
8
|
radius,
|
|
9
9
|
fontFamily,
|
|
10
|
-
|
|
11
|
-
}) =>
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
10
|
+
sizeScale
|
|
11
|
+
}) => {
|
|
12
|
+
const sizeStyles = sizeScale(size);
|
|
13
|
+
return {
|
|
14
|
+
root: {
|
|
15
|
+
default: {
|
|
16
|
+
flexDirection: "row",
|
|
17
|
+
height: sizeStyles.height,
|
|
18
|
+
paddingHorizontal: sizeStyles.paddingHorizontal,
|
|
19
|
+
borderRadius: radius,
|
|
20
|
+
gap: sizeStyles.gap,
|
|
21
|
+
alignItems: "center",
|
|
22
|
+
justifyContent: "center",
|
|
23
|
+
borderWidth: 1,
|
|
24
|
+
borderColor: colors.border,
|
|
25
|
+
backgroundColor: colors.secondary,
|
|
26
|
+
cursor: "pointer"
|
|
27
|
+
},
|
|
28
|
+
disabled: {
|
|
29
|
+
opacity: 0.5,
|
|
30
|
+
cursor: "not-allowed"
|
|
31
|
+
},
|
|
32
|
+
loading: {
|
|
33
|
+
opacity: 0.5,
|
|
34
|
+
cursor: "wait"
|
|
35
|
+
},
|
|
36
|
+
hovered: {
|
|
37
|
+
backgroundColor: hslaSetRelativeLightness(colors.secondary, -1)
|
|
38
|
+
}
|
|
25
39
|
},
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
40
|
+
text: {
|
|
41
|
+
default: {
|
|
42
|
+
color: colors.secondaryForeground,
|
|
43
|
+
fontSize: sizeStyles.fontSize,
|
|
44
|
+
fontFamily
|
|
45
|
+
},
|
|
46
|
+
disabled: {
|
|
47
|
+
color: colors.mutedForeground
|
|
48
|
+
},
|
|
49
|
+
loading: {
|
|
50
|
+
color: colors.mutedForeground
|
|
51
|
+
}
|
|
29
52
|
},
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
53
|
+
icon: {
|
|
54
|
+
default: {
|
|
55
|
+
color: colors.secondaryForeground,
|
|
56
|
+
size: sizeStyles.iconSize,
|
|
57
|
+
strokeWidth: sizeStyles.strokeWidth
|
|
58
|
+
},
|
|
59
|
+
disabled: {
|
|
60
|
+
color: colors.mutedForeground
|
|
61
|
+
},
|
|
62
|
+
loading: {
|
|
63
|
+
color: colors.mutedForeground
|
|
64
|
+
}
|
|
33
65
|
},
|
|
34
|
-
|
|
35
|
-
|
|
66
|
+
spinner: {
|
|
67
|
+
default: {
|
|
68
|
+
color: colors.secondaryForeground
|
|
69
|
+
},
|
|
70
|
+
disabled: {
|
|
71
|
+
color: colors.mutedForeground
|
|
72
|
+
},
|
|
73
|
+
loading: {
|
|
74
|
+
color: colors.mutedForeground
|
|
75
|
+
}
|
|
36
76
|
}
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
default: {
|
|
40
|
-
color: colors.secondaryForeground,
|
|
41
|
-
fontSize,
|
|
42
|
-
fontFamily
|
|
43
|
-
},
|
|
44
|
-
disabled: {
|
|
45
|
-
color: colors.mutedForeground
|
|
46
|
-
},
|
|
47
|
-
loading: {
|
|
48
|
-
color: colors.mutedForeground
|
|
49
|
-
}
|
|
50
|
-
},
|
|
51
|
-
icon: {
|
|
52
|
-
default: {
|
|
53
|
-
color: colors.secondaryForeground,
|
|
54
|
-
size: fontSize
|
|
55
|
-
},
|
|
56
|
-
disabled: {
|
|
57
|
-
color: colors.mutedForeground
|
|
58
|
-
},
|
|
59
|
-
loading: {
|
|
60
|
-
color: colors.mutedForeground
|
|
61
|
-
}
|
|
62
|
-
},
|
|
63
|
-
spinner: {
|
|
64
|
-
default: {
|
|
65
|
-
color: colors.secondaryForeground
|
|
66
|
-
},
|
|
67
|
-
disabled: {
|
|
68
|
-
color: colors.mutedForeground
|
|
69
|
-
},
|
|
70
|
-
loading: {
|
|
71
|
-
color: colors.mutedForeground
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
}));
|
|
77
|
+
};
|
|
78
|
+
});
|
|
75
79
|
};
|
|
76
80
|
//# sourceMappingURL=secondary.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useButtonVariantSecondary","colors","radius","fontFamily","
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useButtonVariantSecondary","size","colors","radius","fontFamily","sizeScale","sizeStyles","root","default","flexDirection","height","paddingHorizontal","borderRadius","gap","alignItems","justifyContent","borderWidth","borderColor","border","backgroundColor","secondary","cursor","disabled","opacity","loading","hovered","text","color","secondaryForeground","fontSize","mutedForeground","icon","iconSize","strokeWidth","spinner"],"sourceRoot":"../../../../../src","sources":["components/button/variants/secondary.tsx"],"mappings":";;AACA,SAASA,wBAAwB,QAAQ,8BAA2B;AAEpE,SAASC,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,yBAAyB,GAAIC,IAAU,IAAmB;EACrE,OAAOF,eAAe,CAAC,CAAC;IAAEG,MAAM;IAAEC,MAAM;IAAEC,UAAU;IAAEC;EAAU,CAAC,KAAmB;IAClF,MAAMC,UAAU,GAAGD,SAAS,CAACJ,IAAI,CAAC;IAElC,OAAO;MACLM,IAAI,EAAE;QACJC,OAAO,EAAE;UACPC,aAAa,EAAE,KAAK;UACpBC,MAAM,EAAEJ,UAAU,CAACI,MAAM;UACzBC,iBAAiB,EAAEL,UAAU,CAACK,iBAAiB;UAC/CC,YAAY,EAAET,MAAM;UACpBU,GAAG,EAAEP,UAAU,CAACO,GAAG;UACnBC,UAAU,EAAE,QAAQ;UACpBC,cAAc,EAAE,QAAQ;UACxBC,WAAW,EAAE,CAAC;UACdC,WAAW,EAAEf,MAAM,CAACgB,MAAM;UAC1BC,eAAe,EAAEjB,MAAM,CAACkB,SAAS;UACjCC,MAAM,EAAE;QACV,CAAC;QACDC,QAAQ,EAAE;UACRC,OAAO,EAAE,GAAG;UACZF,MAAM,EAAE;QACV,CAAC;QACDG,OAAO,EAAE;UACPD,OAAO,EAAE,GAAG;UACZF,MAAM,EAAE;QACV,CAAC;QACDI,OAAO,EAAE;UACPN,eAAe,EAAErB,wBAAwB,CAACI,MAAM,CAACkB,SAAS,EAAE,CAAC,CAAC;QAChE;MACF,CAAC;MACDM,IAAI,EAAE;QACJlB,OAAO,EAAE;UACPmB,KAAK,EAAEzB,MAAM,CAAC0B,mBAAmB;UACjCC,QAAQ,EAAEvB,UAAU,CAACuB,QAAQ;UAC7BzB;QACF,CAAC;QACDkB,QAAQ,EAAE;UACRK,KAAK,EAAEzB,MAAM,CAAC4B;QAChB,CAAC;QACDN,OAAO,EAAE;UACPG,KAAK,EAAEzB,MAAM,CAAC4B;QAChB;MACF,CAAC;MACDC,IAAI,EAAE;QACJvB,OAAO,EAAE;UACPmB,KAAK,EAAEzB,MAAM,CAAC0B,mBAAmB;UACjC3B,IAAI,EAAEK,UAAU,CAAC0B,QAAQ;UACzBC,WAAW,EAAE3B,UAAU,CAAC2B;QAC1B,CAAC;QACDX,QAAQ,EAAE;UACRK,KAAK,EAAEzB,MAAM,CAAC4B;QAChB,CAAC;QACDN,OAAO,EAAE;UACPG,KAAK,EAAEzB,MAAM,CAAC4B;QAChB;MACF,CAAC;MACDI,OAAO,EAAE;QACP1B,OAAO,EAAE;UACPmB,KAAK,EAAEzB,MAAM,CAAC0B;QAChB,CAAC;QACDN,QAAQ,EAAE;UACRK,KAAK,EAAEzB,MAAM,CAAC4B;QAChB,CAAC;QACDN,OAAO,EAAE;UACPG,KAAK,EAAEzB,MAAM,CAAC4B;QAChB;MACF;IACF,CAAC;EACH,CAAC,CAAC;AACJ,CAAC","ignoreList":[]}
|
|
@@ -15,7 +15,7 @@ const calculateState = props => {
|
|
|
15
15
|
return "default";
|
|
16
16
|
};
|
|
17
17
|
export function ComboboxRoot(props) {
|
|
18
|
-
const variantStyles = ComboboxVariants[props.variant ?? "default"]();
|
|
18
|
+
const variantStyles = ComboboxVariants[props.variant ?? "default"](props.size ?? "md");
|
|
19
19
|
const globalStyles = useComponentConfig("combobox");
|
|
20
20
|
const mergedStyles = mergeStyles(variantStyles, globalStyles?.styles);
|
|
21
21
|
const [isOpen, setIsOpen] = useState(false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","useMemo","useRef","useState","StyleSheet","View","DEFAULT_LAYOUT","DEFAULT_POSITION","useComponentConfig","mergeStyles","ComboboxContext","ComboboxVariants","jsx","_jsx","calculateState","props","isDisabled","ComboboxRoot","variantStyles","variant","globalStyles","mergedStyles","styles","isOpen","setIsOpen","contentLayout","setContentLayout","triggerPosition","setTriggerPosition","inputValue","setInputValueInternal","onInputChangeRef","onInputChange","current","setInputValue","action","prev","next","state","composedStyles","flatten","root","default","style","contextValue","value","onChange","Provider","children"],"sourceRoot":"../../../../../src","sources":["components/combobox/components/combobox-root.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACrE,SAGEC,UAAU,EACVC,IAAI,QAEC,cAAc;AACrB,SAASC,cAAc,EAAEC,gBAAgB,QAA6B,yBAAgB;AACtF,SAASC,kBAAkB,QAAQ,6BAA0B;AAC7D,SAASC,WAAW,QAAQ,oCAAiC;
|
|
1
|
+
{"version":3,"names":["React","useCallback","useMemo","useRef","useState","StyleSheet","View","DEFAULT_LAYOUT","DEFAULT_POSITION","useComponentConfig","mergeStyles","ComboboxContext","ComboboxVariants","jsx","_jsx","calculateState","props","isDisabled","ComboboxRoot","variantStyles","variant","size","globalStyles","mergedStyles","styles","isOpen","setIsOpen","contentLayout","setContentLayout","triggerPosition","setTriggerPosition","inputValue","setInputValueInternal","onInputChangeRef","onInputChange","current","setInputValue","action","prev","next","state","composedStyles","flatten","root","default","style","contextValue","value","onChange","Provider","children"],"sourceRoot":"../../../../../src","sources":["components/combobox/components/combobox-root.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,105 +2,108 @@
|
|
|
2
2
|
|
|
3
3
|
import { Platform } from "react-native";
|
|
4
4
|
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
-
export function useComboboxVariantDefault() {
|
|
5
|
+
export function useComboboxVariantDefault(size) {
|
|
6
6
|
return useThemedStyles(({
|
|
7
7
|
colors,
|
|
8
8
|
radius,
|
|
9
9
|
fontFamily,
|
|
10
|
-
|
|
11
|
-
}) =>
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
10
|
+
sizeScale
|
|
11
|
+
}) => {
|
|
12
|
+
const s = sizeScale(size);
|
|
13
|
+
return {
|
|
14
|
+
root: {
|
|
15
|
+
default: {},
|
|
16
|
+
disabled: {}
|
|
17
|
+
},
|
|
18
|
+
trigger: {
|
|
19
|
+
default: {
|
|
20
|
+
placeholderTextColor: colors.mutedForeground,
|
|
21
|
+
editable: true,
|
|
22
|
+
style: {
|
|
23
|
+
borderWidth: 1,
|
|
24
|
+
borderColor: colors.border,
|
|
25
|
+
borderRadius: radius,
|
|
26
|
+
backgroundColor: colors.surface,
|
|
27
|
+
justifyContent: "center",
|
|
28
|
+
paddingVertical: 4,
|
|
29
|
+
paddingHorizontal: s.paddingHorizontal,
|
|
30
|
+
minHeight: s.height,
|
|
31
|
+
fontFamily,
|
|
32
|
+
fontSize: s.fontSize,
|
|
33
|
+
color: colors.foreground,
|
|
34
|
+
outlineWidth: 0,
|
|
35
|
+
pointerEvents: "auto",
|
|
36
|
+
...Platform.select({
|
|
37
|
+
web: {
|
|
38
|
+
outline: "none"
|
|
39
|
+
}
|
|
40
|
+
})
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
focused: {
|
|
44
|
+
style: {
|
|
45
|
+
borderColor: colors.primary
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
disabled: {
|
|
49
|
+
editable: false,
|
|
50
|
+
style: {
|
|
51
|
+
backgroundColor: colors.muted,
|
|
52
|
+
color: colors.mutedForeground,
|
|
53
|
+
pointerEvents: "none"
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
overlay: {
|
|
58
|
+
default: {
|
|
59
|
+
zIndex: 999
|
|
60
|
+
},
|
|
61
|
+
disabled: {}
|
|
62
|
+
},
|
|
63
|
+
content: {
|
|
64
|
+
default: {
|
|
65
|
+
backgroundColor: colors.surface,
|
|
66
|
+
borderRadius: radius,
|
|
21
67
|
borderWidth: 1,
|
|
22
68
|
borderColor: colors.border,
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
69
|
+
padding: 4,
|
|
70
|
+
gap: 4,
|
|
71
|
+
zIndex: 1000,
|
|
72
|
+
maxHeight: 256
|
|
73
|
+
},
|
|
74
|
+
disabled: {}
|
|
75
|
+
},
|
|
76
|
+
option: {
|
|
77
|
+
default: {
|
|
78
|
+
paddingVertical: s.paddingVertical,
|
|
79
|
+
paddingHorizontal: s.paddingHorizontal,
|
|
29
80
|
fontFamily,
|
|
30
|
-
fontSize,
|
|
81
|
+
fontSize: s.fontSize,
|
|
31
82
|
color: colors.foreground,
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
style: {
|
|
43
|
-
borderColor: colors.primary
|
|
83
|
+
borderRadius: radius / 2
|
|
84
|
+
},
|
|
85
|
+
disabled: {
|
|
86
|
+
color: colors.mutedForeground
|
|
87
|
+
},
|
|
88
|
+
selected: {
|
|
89
|
+
backgroundColor: colors.muted
|
|
90
|
+
},
|
|
91
|
+
hovered: {
|
|
92
|
+
backgroundColor: colors.muted
|
|
44
93
|
}
|
|
45
94
|
},
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
95
|
+
empty: {
|
|
96
|
+
default: {
|
|
97
|
+
paddingVertical: s.paddingVertical,
|
|
98
|
+
paddingHorizontal: s.paddingHorizontal,
|
|
99
|
+
fontFamily,
|
|
100
|
+
fontSize: s.fontSize,
|
|
50
101
|
color: colors.mutedForeground,
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
},
|
|
55
|
-
overlay: {
|
|
56
|
-
default: {
|
|
57
|
-
zIndex: 999
|
|
58
|
-
},
|
|
59
|
-
disabled: {}
|
|
60
|
-
},
|
|
61
|
-
content: {
|
|
62
|
-
default: {
|
|
63
|
-
backgroundColor: colors.surface,
|
|
64
|
-
borderRadius: radius,
|
|
65
|
-
borderWidth: 1,
|
|
66
|
-
borderColor: colors.border,
|
|
67
|
-
padding: 4,
|
|
68
|
-
gap: 4,
|
|
69
|
-
zIndex: 1000,
|
|
70
|
-
maxHeight: 256
|
|
71
|
-
},
|
|
72
|
-
disabled: {}
|
|
73
|
-
},
|
|
74
|
-
option: {
|
|
75
|
-
default: {
|
|
76
|
-
paddingVertical: 12,
|
|
77
|
-
paddingHorizontal: 16,
|
|
78
|
-
fontFamily,
|
|
79
|
-
fontSize,
|
|
80
|
-
color: colors.foreground,
|
|
81
|
-
borderRadius: radius / 2
|
|
82
|
-
},
|
|
83
|
-
disabled: {
|
|
84
|
-
color: colors.mutedForeground
|
|
85
|
-
},
|
|
86
|
-
selected: {
|
|
87
|
-
backgroundColor: colors.muted
|
|
88
|
-
},
|
|
89
|
-
hovered: {
|
|
90
|
-
backgroundColor: colors.muted
|
|
102
|
+
textAlign: "center"
|
|
103
|
+
},
|
|
104
|
+
disabled: {}
|
|
91
105
|
}
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
default: {
|
|
95
|
-
paddingVertical: 12,
|
|
96
|
-
paddingHorizontal: 16,
|
|
97
|
-
fontFamily,
|
|
98
|
-
fontSize,
|
|
99
|
-
color: colors.mutedForeground,
|
|
100
|
-
textAlign: "center"
|
|
101
|
-
},
|
|
102
|
-
disabled: {}
|
|
103
|
-
}
|
|
104
|
-
}));
|
|
106
|
+
};
|
|
107
|
+
});
|
|
105
108
|
}
|
|
106
109
|
//# sourceMappingURL=default.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Platform","useThemedStyles","useComboboxVariantDefault","colors","radius","fontFamily","
|
|
1
|
+
{"version":3,"names":["Platform","useThemedStyles","useComboboxVariantDefault","size","colors","radius","fontFamily","sizeScale","s","root","default","disabled","trigger","placeholderTextColor","mutedForeground","editable","style","borderWidth","borderColor","border","borderRadius","backgroundColor","surface","justifyContent","paddingVertical","paddingHorizontal","minHeight","height","fontSize","color","foreground","outlineWidth","pointerEvents","select","web","outline","focused","primary","muted","overlay","zIndex","content","padding","gap","maxHeight","option","selected","hovered","empty","textAlign"],"sourceRoot":"../../../../../src","sources":["components/combobox/variants/default.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -19,14 +19,14 @@ export function IconButton(props) {
|
|
|
19
19
|
const {
|
|
20
20
|
render: IconComponent,
|
|
21
21
|
variant = "default",
|
|
22
|
+
size = "md",
|
|
22
23
|
isDisabled,
|
|
23
|
-
size,
|
|
24
24
|
color,
|
|
25
25
|
strokeWidth,
|
|
26
26
|
style,
|
|
27
27
|
...rest
|
|
28
28
|
} = props;
|
|
29
|
-
const variantStyles = IconButtonVariants[variant]();
|
|
29
|
+
const variantStyles = IconButtonVariants[variant](size);
|
|
30
30
|
const componentConfig = useComponentConfig("iconButton");
|
|
31
31
|
const mergedStyles = mergeStyles(variantStyles, componentConfig?.styles);
|
|
32
32
|
const [isHovered, setIsHovered] = useState(false);
|
|
@@ -39,10 +39,9 @@ export function IconButton(props) {
|
|
|
39
39
|
rest.onPress?.(event);
|
|
40
40
|
};
|
|
41
41
|
const iconProps = {
|
|
42
|
-
size:
|
|
42
|
+
size: mergedStyles.icon?.default?.size,
|
|
43
43
|
color: color ?? mergedStyles.icon?.[state]?.color ?? mergedStyles.icon?.default?.color,
|
|
44
|
-
strokeWidth
|
|
45
|
-
absoluteStrokeWidth: true
|
|
44
|
+
strokeWidth: strokeWidth ?? mergedStyles.icon?.default?.strokeWidth
|
|
46
45
|
};
|
|
47
46
|
return /*#__PURE__*/_jsx(Pressable, {
|
|
48
47
|
...rest,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useState","Pressable","useComponentConfig","mergeStyles","IconButtonVariants","jsx","_jsx","calculateState","props","isHovered","isDisabled","cursorValue","state","IconButton","render","IconComponent","variant","size","color","strokeWidth","style","rest","variantStyles","componentConfig","mergedStyles","styles","setIsHovered","handlePress","event","preventDefault","onPress","iconProps","icon","default","
|
|
1
|
+
{"version":3,"names":["React","useState","Pressable","useComponentConfig","mergeStyles","IconButtonVariants","jsx","_jsx","calculateState","props","isHovered","isDisabled","cursorValue","state","IconButton","render","IconComponent","variant","size","color","strokeWidth","style","rest","variantStyles","componentConfig","mergedStyles","styles","setIsHovered","handlePress","event","preventDefault","onPress","iconProps","icon","default","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;AACrB,SAASC,kBAAkB,QAAQ,0BAAuB;AAE1D,SAASC,WAAW,QAAQ,iCAA8B;AAG1D,SAASC,kBAAkB,QAAQ,qBAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAYhD,MAAMC,cAAc,GAAGA,CAACC,KAAsB,EAAEC,SAAkB,KAAsB;EACtF,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;IACnBC,IAAI,GAAG,IAAI;IACXP,UAAU;IACVQ,KAAK;IACLC,WAAW;IACXC,KAAK;IACL,GAAGC;EACL,CAAC,GAAGb,KAAK;EAET,MAAMc,aAAa,GAAGlB,kBAAkB,CAACY,OAAO,CAAC,CAACC,IAAI,CAAC;EACvD,MAAMM,eAAe,GAAGrB,kBAAkB,CAAC,YAAY,CAAC;EACxD,MAAMsB,YAAY,GAAGrB,WAAW,CAACmB,aAAa,EAAEC,eAAe,EAAEE,MAAM,CAAC;EAExE,MAAM,CAAChB,SAAS,EAAEiB,YAAY,CAAC,GAAG1B,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAMY,KAAK,GAAGL,cAAc,CAACC,KAAK,EAAEC,SAAS,CAAC;EAE9C,MAAMkB,WAAsC,GAAIC,KAAK,IAAK;IACxD,IAAIlB,UAAU,EAAE;MACdkB,KAAK,CAACC,cAAc,CAAC,CAAC;MACtB;IACF;IACAR,IAAI,CAACS,OAAO,GAAGF,KAAK,CAAC;EACvB,CAAC;EAED,MAAMG,SAAmB,GAAG;IAC1Bd,IAAI,EAAEO,YAAY,CAACQ,IAAI,EAAEC,OAAO,EAAEhB,IAAI;IACtCC,KAAK,EAAEA,KAAK,IAAIM,YAAY,CAACQ,IAAI,GAAGpB,KAAK,CAAC,EAAEM,KAAK,IAAIM,YAAY,CAACQ,IAAI,EAAEC,OAAO,EAAEf,KAAK;IACtFC,WAAW,EAAEA,WAAW,IAAIK,YAAY,CAACQ,IAAI,EAAEC,OAAO,EAAEd;EAC1D,CAAC;EAED,oBACEb,IAAA,CAACL,SAAS;IAAA,GACJoB,IAAI;IACRS,OAAO,EAAEH,WAAY;IACrBO,SAAS,EAAGC,CAAC,IAAK;MAChBT,YAAY,CAAC,IAAI,CAAC;MAClBL,IAAI,CAACa,SAAS,GAAGC,CAAC,CAAC;IACrB,CAAE;IACFC,UAAU,EAAGD,CAAC,IAAK;MACjBT,YAAY,CAAC,KAAK,CAAC;MACnBL,IAAI,CAACe,UAAU,GAAGD,CAAC,CAAC;IACtB,CAAE;IACFE,QAAQ,EAAE3B,UAAW;IACrBU,KAAK,EAAE,CACLI,YAAY,CAACc,IAAI,EAAEL,OAAO,EAC1BT,YAAY,CAACc,IAAI,GAAG1B,KAAK,CAAC,EAC1B;MAAE2B,MAAM,EAAE5B,WAAW,CAACC,KAAK;IAAE,CAAC,EAC9BQ,KAAK,CACL;IAAAoB,QAAA,eAEFlC,IAAA,CAACS,aAAa;MAAA,GAAKgB;IAAS,CAAG;EAAC,CACvB,CAAC;AAEhB","ignoreList":[]}
|
|
@@ -2,33 +2,40 @@
|
|
|
2
2
|
|
|
3
3
|
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
4
|
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
-
export const useIconButtonVariantDefault =
|
|
5
|
+
export const useIconButtonVariantDefault = size => {
|
|
6
6
|
return useThemedStyles(({
|
|
7
7
|
colors,
|
|
8
|
-
radius
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
8
|
+
radius,
|
|
9
|
+
sizeScale
|
|
10
|
+
}) => {
|
|
11
|
+
const s = sizeScale(size);
|
|
12
|
+
return {
|
|
13
|
+
root: {
|
|
14
|
+
default: {
|
|
15
|
+
alignItems: "center",
|
|
16
|
+
justifyContent: "center",
|
|
17
|
+
height: s.height,
|
|
18
|
+
width: s.height,
|
|
19
|
+
borderRadius: radius,
|
|
20
|
+
backgroundColor: colors.primary,
|
|
21
|
+
borderWidth: 1,
|
|
22
|
+
borderColor: colors.border
|
|
23
|
+
},
|
|
24
|
+
disabled: {
|
|
25
|
+
opacity: 0.5
|
|
26
|
+
},
|
|
27
|
+
hovered: {
|
|
28
|
+
backgroundColor: hslaSetRelativeLightness(colors.primary, -10)
|
|
29
|
+
}
|
|
19
30
|
},
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
},
|
|
27
|
-
icon: {
|
|
28
|
-
default: {
|
|
29
|
-
color: colors.primaryForeground
|
|
31
|
+
icon: {
|
|
32
|
+
default: {
|
|
33
|
+
color: colors.primaryForeground,
|
|
34
|
+
size: s.iconSize,
|
|
35
|
+
strokeWidth: s.strokeWidth
|
|
36
|
+
}
|
|
30
37
|
}
|
|
31
|
-
}
|
|
32
|
-
})
|
|
38
|
+
};
|
|
39
|
+
});
|
|
33
40
|
};
|
|
34
41
|
//# sourceMappingURL=default.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantDefault","colors","radius","root","default","alignItems","justifyContent","
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantDefault","size","colors","radius","sizeScale","s","root","default","alignItems","justifyContent","height","width","borderRadius","backgroundColor","primary","borderWidth","borderColor","border","disabled","opacity","hovered","icon","color","primaryForeground","iconSize","strokeWidth"],"sourceRoot":"../../../../../src","sources":["components/icon-button/variants/default.tsx"],"mappings":";;AAAA,SAASA,wBAAwB,QAAQ,8BAA2B;AAEpE,SAASC,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,2BAA2B,GAAIC,IAAU,IAAuB;EAC3E,OAAOF,eAAe,CAAC,CAAC;IAAEG,MAAM;IAAEC,MAAM;IAAEC;EAAU,CAAC,KAAuB;IAC1E,MAAMC,CAAC,GAAGD,SAAS,CAACH,IAAI,CAAC;IAEzB,OAAO;MACLK,IAAI,EAAE;QACJC,OAAO,EAAE;UACPC,UAAU,EAAE,QAAQ;UACpBC,cAAc,EAAE,QAAQ;UACxBC,MAAM,EAAEL,CAAC,CAACK,MAAM;UAChBC,KAAK,EAAEN,CAAC,CAACK,MAAM;UACfE,YAAY,EAAET,MAAM;UACpBU,eAAe,EAAEX,MAAM,CAACY,OAAO;UAC/BC,WAAW,EAAE,CAAC;UACdC,WAAW,EAAEd,MAAM,CAACe;QACtB,CAAC;QACDC,QAAQ,EAAE;UACRC,OAAO,EAAE;QACX,CAAC;QACDC,OAAO,EAAE;UACPP,eAAe,EAAEf,wBAAwB,CAACI,MAAM,CAACY,OAAO,EAAE,CAAC,EAAE;QAC/D;MACF,CAAC;MACDO,IAAI,EAAE;QACJd,OAAO,EAAE;UACPe,KAAK,EAAEpB,MAAM,CAACqB,iBAAiB;UAC/BtB,IAAI,EAAEI,CAAC,CAACmB,QAAQ;UAChBC,WAAW,EAAEpB,CAAC,CAACoB;QACjB;MACF;IACF,CAAC;EACH,CAAC,CAAC;AACJ,CAAC","ignoreList":[]}
|
|
@@ -2,34 +2,41 @@
|
|
|
2
2
|
|
|
3
3
|
import { hslaSetRelativeLightness } from "../../../utils/hsla-utils.js";
|
|
4
4
|
import { useThemedStyles } from "../../../utils/use-themed-styles.js";
|
|
5
|
-
export const useIconButtonVariantGhost =
|
|
5
|
+
export const useIconButtonVariantGhost = size => {
|
|
6
6
|
return useThemedStyles(({
|
|
7
7
|
colors,
|
|
8
|
-
radius
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
8
|
+
radius,
|
|
9
|
+
sizeScale
|
|
10
|
+
}) => {
|
|
11
|
+
const s = sizeScale(size);
|
|
12
|
+
return {
|
|
13
|
+
root: {
|
|
14
|
+
default: {
|
|
15
|
+
alignItems: "center",
|
|
16
|
+
justifyContent: "center",
|
|
17
|
+
height: s.height,
|
|
18
|
+
width: s.height,
|
|
19
|
+
borderRadius: radius,
|
|
20
|
+
backgroundColor: "transparent"
|
|
21
|
+
},
|
|
22
|
+
disabled: {
|
|
23
|
+
opacity: 0.5
|
|
24
|
+
},
|
|
25
|
+
hovered: {
|
|
26
|
+
backgroundColor: hslaSetRelativeLightness(colors.secondary, -1)
|
|
27
|
+
}
|
|
17
28
|
},
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
color: colors.foreground
|
|
28
|
-
},
|
|
29
|
-
disabled: {
|
|
30
|
-
color: colors.mutedForeground
|
|
29
|
+
icon: {
|
|
30
|
+
default: {
|
|
31
|
+
color: colors.foreground,
|
|
32
|
+
size: s.iconSize,
|
|
33
|
+
strokeWidth: s.strokeWidth
|
|
34
|
+
},
|
|
35
|
+
disabled: {
|
|
36
|
+
color: colors.mutedForeground
|
|
37
|
+
}
|
|
31
38
|
}
|
|
32
|
-
}
|
|
33
|
-
})
|
|
39
|
+
};
|
|
40
|
+
});
|
|
34
41
|
};
|
|
35
42
|
//# sourceMappingURL=ghost.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantGhost","colors","radius","root","default","alignItems","justifyContent","
|
|
1
|
+
{"version":3,"names":["hslaSetRelativeLightness","useThemedStyles","useIconButtonVariantGhost","size","colors","radius","sizeScale","s","root","default","alignItems","justifyContent","height","width","borderRadius","backgroundColor","disabled","opacity","hovered","secondary","icon","color","foreground","iconSize","strokeWidth","mutedForeground"],"sourceRoot":"../../../../../src","sources":["components/icon-button/variants/ghost.tsx"],"mappings":";;AAAA,SAASA,wBAAwB,QAAQ,8BAA2B;AAEpE,SAASC,eAAe,QAAQ,qCAAkC;AAGlE,OAAO,MAAMC,yBAAyB,GAAIC,IAAU,IAAuB;EACzE,OAAOF,eAAe,CAAC,CAAC;IAAEG,MAAM;IAAEC,MAAM;IAAEC;EAAU,CAAC,KAAuB;IAC1E,MAAMC,CAAC,GAAGD,SAAS,CAACH,IAAI,CAAC;IAEzB,OAAO;MACLK,IAAI,EAAE;QACJC,OAAO,EAAE;UACPC,UAAU,EAAE,QAAQ;UACpBC,cAAc,EAAE,QAAQ;UACxBC,MAAM,EAAEL,CAAC,CAACK,MAAM;UAChBC,KAAK,EAAEN,CAAC,CAACK,MAAM;UACfE,YAAY,EAAET,MAAM;UACpBU,eAAe,EAAE;QACnB,CAAC;QACDC,QAAQ,EAAE;UACRC,OAAO,EAAE;QACX,CAAC;QACDC,OAAO,EAAE;UACPH,eAAe,EAAEf,wBAAwB,CAACI,MAAM,CAACe,SAAS,EAAE,CAAC,CAAC;QAChE;MACF,CAAC;MACDC,IAAI,EAAE;QACJX,OAAO,EAAE;UACPY,KAAK,EAAEjB,MAAM,CAACkB,UAAU;UACxBnB,IAAI,EAAEI,CAAC,CAACgB,QAAQ;UAChBC,WAAW,EAAEjB,CAAC,CAACiB;QACjB,CAAC;QACDR,QAAQ,EAAE;UACRK,KAAK,EAAEjB,MAAM,CAACqB;QAChB;MACF;IACF,CAAC;EACH,CAAC,CAAC;AACJ,CAAC","ignoreList":[]}
|