@hzblj/kara-components 0.13.0 → 0.13.1
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/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# @hzblj/kara-components
|
|
2
2
|
|
|
3
|
+
## 0.13.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#34](https://github.com/hzblj/kara-ui/pull/34) [`3691a12`](https://github.com/hzblj/kara-ui/commit/3691a1255908dd1c8f1cb4d2bd5ce8f679e95a81) Thanks [@hzblj](https://github.com/hzblj)! - `SegmentedControl` on Android draws one outline around every segment, the selected one too. Its accent border used to run the fill out over the line the other segments draw inside, so the selected segment looked taller than its neighbours.
|
|
8
|
+
|
|
9
|
+
- Updated dependencies []:
|
|
10
|
+
- @hzblj/kara-theme@0.13.1
|
|
11
|
+
- @hzblj/kara-sx@0.13.1
|
|
12
|
+
- @hzblj/kara-native@0.13.1
|
|
13
|
+
|
|
3
14
|
## 0.13.0
|
|
4
15
|
|
|
5
16
|
### Minor Changes
|
|
@@ -27,11 +27,14 @@ export const SegmentedControl = ({
|
|
|
27
27
|
values
|
|
28
28
|
}) => {
|
|
29
29
|
const theme = useAppTheme();
|
|
30
|
+
|
|
31
|
+
// Every segment keeps the same outline, the selected one too: an accent border would run its fill out over the line
|
|
32
|
+
// the others draw inside, and make it look taller than its neighbours.
|
|
30
33
|
const colors = useMemo(() => ({
|
|
31
|
-
activeBorderColor: theme.color('
|
|
34
|
+
activeBorderColor: theme.color('border.secondary.base'),
|
|
32
35
|
activeContainerColor: theme.color('fill.accent.primary'),
|
|
33
36
|
activeContentColor: theme.color('content.on.accent'),
|
|
34
|
-
disabledActiveBorderColor: theme.color('
|
|
37
|
+
disabledActiveBorderColor: theme.color('border.tertiary'),
|
|
35
38
|
disabledActiveContainerColor: theme.color('fill.accent.disabled'),
|
|
36
39
|
disabledActiveContentColor: theme.color('btn.content.disabled'),
|
|
37
40
|
disabledInactiveBorderColor: theme.color('border.tertiary'),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Host","SegmentedButton","SingleChoiceSegmentedButtonRow","Text","fillMaxWidth","testID","testIdModifier","weight","haptics","useAppTheme","useCallback","useMemo","jsx","_jsx","MATCH_HEIGHT_ONLY","horizontal","vertical","SEGMENT","SegmentedControl","disabled","onChange","selectedIndex","values","theme","colors","activeBorderColor","color","activeContainerColor","activeContentColor","disabledActiveBorderColor","disabledActiveContainerColor","disabledActiveContentColor","disabledInactiveBorderColor","disabledInactiveContentColor","inactiveBorderColor","inactiveContentColor","rowModifiers","select","index","selection","colorScheme","dark","matchContents","seedColor","materialSeed","children","modifiers","map","label","enabled","onClick","selected","Label","style","typography","subheadlineMedium"],"sourceRoot":"../../../../src","sources":["atoms/segmented-control/segmented-control.android.tsx"],"mappings":";;AAAA,SAAQA,IAAI,EAAEC,eAAe,EAAEC,8BAA8B,EAAEC,IAAI,QAAO,0BAA0B;AACpG,SAAQC,YAAY,EAAEC,MAAM,IAAIC,cAAc,EAAEC,MAAM,QAAO,oCAAoC;AACjG,SAAQC,OAAO,QAAO,0BAA0B;AAChD,SAAQC,WAAW,QAAO,mBAAmB;AAC7C,SAAQC,WAAW,EAAEC,OAAO,QAAO,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAI1C,MAAMC,iBAAiB,GAAG;EAACC,UAAU,EAAE,KAAK;EAAEC,QAAQ,EAAE;AAAI,CAAC;;AAE7D;AACA,MAAMC,OAAO,GAAG,CAACV,MAAM,CAAC,CAAC,CAAC,CAAC;;AAE3B;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMW,gBAA2C,GAAGA,CAAC;EAC1DC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,aAAa;EACbhB,MAAM;EACNiB;AACqB,CAAC,KAAK;EAC3B,MAAMC,KAAK,GAAGd,WAAW,CAAC,CAAC;
|
|
1
|
+
{"version":3,"names":["Host","SegmentedButton","SingleChoiceSegmentedButtonRow","Text","fillMaxWidth","testID","testIdModifier","weight","haptics","useAppTheme","useCallback","useMemo","jsx","_jsx","MATCH_HEIGHT_ONLY","horizontal","vertical","SEGMENT","SegmentedControl","disabled","onChange","selectedIndex","values","theme","colors","activeBorderColor","color","activeContainerColor","activeContentColor","disabledActiveBorderColor","disabledActiveContainerColor","disabledActiveContentColor","disabledInactiveBorderColor","disabledInactiveContentColor","inactiveBorderColor","inactiveContentColor","rowModifiers","select","index","selection","colorScheme","dark","matchContents","seedColor","materialSeed","children","modifiers","map","label","enabled","onClick","selected","Label","style","typography","subheadlineMedium"],"sourceRoot":"../../../../src","sources":["atoms/segmented-control/segmented-control.android.tsx"],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hzblj/kara-components",
|
|
3
|
-
"version": "0.13.
|
|
3
|
+
"version": "0.13.1",
|
|
4
4
|
"description": "The atoms, molecules, organisms and templates of @hzblj/kara-ui — real SwiftUI and Jetpack Compose views through @expo/ui.",
|
|
5
5
|
"author": "Jan Blazej",
|
|
6
6
|
"license": "MIT",
|
|
@@ -61,9 +61,9 @@
|
|
|
61
61
|
"dependencies": {
|
|
62
62
|
"@hzblj/expo-native-icons": "^0.1.0",
|
|
63
63
|
"@hzblj/expo-rich-haptics": "^0.1.0",
|
|
64
|
-
"@hzblj/kara-native": "^0.13.
|
|
65
|
-
"@hzblj/kara-sx": "^0.13.
|
|
66
|
-
"@hzblj/kara-theme": "^0.13.
|
|
64
|
+
"@hzblj/kara-native": "^0.13.1",
|
|
65
|
+
"@hzblj/kara-sx": "^0.13.1",
|
|
66
|
+
"@hzblj/kara-theme": "^0.13.1",
|
|
67
67
|
"sf-symbols-typescript": "^2.2.0"
|
|
68
68
|
},
|
|
69
69
|
"peerDependencies": {
|
|
@@ -25,12 +25,14 @@ export const SegmentedControl: SegmentedControlComponent = ({
|
|
|
25
25
|
}: SegmentedControlProps) => {
|
|
26
26
|
const theme = useAppTheme()
|
|
27
27
|
|
|
28
|
+
// Every segment keeps the same outline, the selected one too: an accent border would run its fill out over the line
|
|
29
|
+
// the others draw inside, and make it look taller than its neighbours.
|
|
28
30
|
const colors = useMemo(
|
|
29
31
|
() => ({
|
|
30
|
-
activeBorderColor: theme.color('
|
|
32
|
+
activeBorderColor: theme.color('border.secondary.base'),
|
|
31
33
|
activeContainerColor: theme.color('fill.accent.primary'),
|
|
32
34
|
activeContentColor: theme.color('content.on.accent'),
|
|
33
|
-
disabledActiveBorderColor: theme.color('
|
|
35
|
+
disabledActiveBorderColor: theme.color('border.tertiary'),
|
|
34
36
|
disabledActiveContainerColor: theme.color('fill.accent.disabled'),
|
|
35
37
|
disabledActiveContentColor: theme.color('btn.content.disabled'),
|
|
36
38
|
disabledInactiveBorderColor: theme.color('border.tertiary'),
|