Skip to content

Commit cc543a3

Browse files
nolimits4webnolimits4web
committed
fix(vue): useContext util
fixes #196
1 parent 5206ae0 commit cc543a3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

61 files changed

+260
-174
lines changed

‎src/vue/components/Actions.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
import { useContext } from '../shared/use-context.js';
1010
1111
import { ActionsClasses } from '../../shared/classes/ActionsClasses.js';
12-
import { useThemeClasses } from '../shared/use-theme-classes.js';
12+
import { themeClasses } from '../shared/use-theme-classes.js';
1313
1414
export default {
1515
name: 'k-actions',
@@ -32,6 +32,7 @@
3232
emits: ['backdropclick'],
3333
setup(props, ctx) {
3434
const context = useContext();
35+
const useThemeClasses = themeClasses(context);
3536
const state = computed(() => (props.opened ? 'opened' : 'closed'));
3637
3738
const c = useThemeClasses(props, () =>

‎src/vue/components/ActionsButton.vue

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,9 @@
1414
import { useContext } from '../shared/use-context.js';
1515
1616
import { useTouchRipple } from '../shared/use-touch-ripple.js';
17-
import { useThemeClasses } from '../shared/use-theme-classes.js';
17+
import { themeClasses } from '../shared/use-theme-classes.js';
1818
import { useTheme } from '../shared/use-theme.js';
19-
import { useDarkClasses } from '../shared/use-dark-classes.js';
19+
import { darkClasses } from '../shared/use-dark-classes.js';
2020
import { ActionsButtonClasses } from '../../shared/classes/ActionsButtonClasses.js';
2121
import { ActionsButtonColors } from '../../shared/colors/ActionsButtonColors.js';
2222
@@ -56,6 +56,8 @@
5656
},
5757
setup(props) {
5858
const context = useContext();
59+
const useDarkClasses = darkClasses(context);
60+
const useThemeClasses = themeClasses(context);
5961
const rippleElRef = ref(null);
6062
const Component = computed(() => {
6163
let c = props.component;
@@ -74,7 +76,7 @@
7476
ActionsButtonColors(props.colors || {}, useDarkClasses)
7577
);
7678
77-
const theme = useTheme(context);
79+
const theme = useTheme({}, context);
7880
7981
const isDividers = computed(() =>
8082
typeof props.dividers === 'undefined'

‎src/vue/components/ActionsGroup.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
import { useContext } from '../shared/use-context.js';
88
import { ActionsGroupClasses } from '../../shared/classes/ActionsGroupClasses.js';
99
10-
import { useThemeClasses } from '../shared/use-theme-classes.js';
10+
import { themeClasses } from '../shared/use-theme-classes.js';
1111
1212
export default {
1313
name: 'k-actions-group',
@@ -28,6 +28,7 @@
2828
},
2929
setup(props, ctx) {
3030
const context = useContext();
31+
const useThemeClasses = themeClasses(context);
3132
const c = useThemeClasses(props, () =>
3233
ActionsGroupClasses(props, ctx.attrs.class)
3334
);

‎src/vue/components/ActionsLabel.vue

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@
99
1010
import { ActionsLabelClasses } from '../../shared/classes/ActionsLabelClasses.js';
1111
import { ActionsLabelColors } from '../../shared/colors/ActionsLabelColors.js';
12-
import { useDarkClasses } from '../shared/use-dark-classes.js';
13-
import { useThemeClasses } from '../shared/use-theme-classes.js';
12+
import { darkClasses } from '../shared/use-dark-classes.js';
13+
import { themeClasses } from '../shared/use-theme-classes.js';
1414
import { useTheme } from '../shared/use-theme.js';
1515
1616
export default {
@@ -35,13 +35,15 @@
3535
fontSizeIos: { type: String, default: 'text-sm' },
3636
fontSizeMaterial: { type: String, default: 'text-sm' },
3737
},
38-
setup(props, ctx) {
38+
setup(props) {
3939
const context = useContext();
40+
const useDarkClasses = darkClasses(context);
41+
const useThemeClasses = themeClasses(context);
4042
const colors = computed(() =>
4143
ActionsLabelColors(props.colors || {}, useDarkClasses)
4244
);
4345
44-
const theme = useTheme(context);
46+
const theme = useTheme({}, context);
4547
4648
const isDividers = computed(() =>
4749
typeof props.dividers === 'undefined'

‎src/vue/components/Badge.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
import { useContext } from '../shared/use-context.js';
99
import { BadgeClasses } from '../../shared/classes/BadgeClasses.js';
1010
import { BadgeColors } from '../../shared/colors/BadgeColors.js';
11-
import { useThemeClasses } from '../shared/use-theme-classes.js';
11+
import { themeClasses } from '../shared/use-theme-classes.js';
1212
1313
export default {
1414
name: 'k-badge',
@@ -35,6 +35,7 @@
3535
},
3636
setup(props) {
3737
const context = useContext();
38+
const useThemeClasses = themeClasses(context);
3839
const colors = computed(() => BadgeColors(props.colors || {}));
3940
4041
const size = computed(() => (props.small ? 'sm' : 'md'));

‎src/vue/components/Block.vue

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,9 @@
99
1010
import { useTheme } from '../shared/use-theme.js';
1111
12-
import { useThemeClasses } from '../shared/use-theme-classes.js';
12+
import { themeClasses } from '../shared/use-theme-classes.js';
1313
14-
import { useDarkClasses } from '../shared/use-dark-classes.js';
14+
import { darkClasses } from '../shared/use-dark-classes.js';
1515
1616
import { cls } from '../../shared/cls.js';
1717
@@ -52,11 +52,13 @@
5252
},
5353
setup(props, ctx) {
5454
const context = useContext();
55+
const useDarkClasses = darkClasses(context);
56+
const useThemeClasses = themeClasses(context);
5557
const colors = computed(() =>
5658
BlockColors(props.colors || {}, useDarkClasses)
5759
);
5860
59-
const theme = useTheme(context);
61+
const theme = useTheme({}, context);
6062
6163
const isStrong = computed(() =>
6264
typeof props.strong === 'undefined'

‎src/vue/components/BlockFooter.vue

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,9 @@
1313
1414
import { useTheme } from '../shared/use-theme.js';
1515
16-
import { useThemeClasses } from '../shared/use-theme-classes.js';
16+
import { themeClasses } from '../shared/use-theme-classes.js';
1717
18-
import { useDarkClasses } from '../shared/use-dark-classes.js';
18+
import { darkClasses } from '../shared/use-dark-classes.js';
1919
2020
export default {
2121
name: 'k-block-footer',
@@ -39,9 +39,11 @@
3939
insetIos: { type: Boolean, default: false },
4040
insetMaterial: { type: Boolean, default: false },
4141
},
42-
setup(props, ctx) {
42+
setup(props) {
4343
const context = useContext();
44-
const theme = useTheme(context);
44+
const useDarkClasses = darkClasses(context);
45+
const useThemeClasses = themeClasses(context);
46+
const theme = useTheme({}, context);
4547
const isInset = computed(() =>
4648
typeof props.inset === 'undefined'
4749
? theme.value === 'ios'

‎src/vue/components/BlockHeader.vue

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,9 @@
1313
1414
import { BlockHeaderColors } from '../../shared/colors/BlockHeaderColors.js';
1515
16-
import { useThemeClasses } from '../shared/use-theme-classes.js';
16+
import { themeClasses } from '../shared/use-theme-classes.js';
1717
18-
import { useDarkClasses } from '../shared/use-dark-classes.js';
18+
import { darkClasses } from '../shared/use-dark-classes.js';
1919
2020
export default {
2121
name: 'k-block-header',
@@ -41,7 +41,9 @@
4141
},
4242
setup(props) {
4343
const context = useContext();
44-
const theme = useTheme(context);
44+
const useDarkClasses = darkClasses(context);
45+
const useThemeClasses = themeClasses(context);
46+
const theme = useTheme({}, context);
4547
const isInset = computed(() =>
4648
typeof props.inset === 'undefined'
4749
? theme.value === 'ios'

‎src/vue/components/BlockTitle.vue

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@
1111
1212
import { BlockTitleColors } from '../../shared/colors/BlockTitleColors.js';
1313
14-
import { useThemeClasses } from '../shared/use-theme-classes.js';
14+
import { themeClasses } from '../shared/use-theme-classes.js';
1515
16-
import { useDarkClasses } from '../shared/use-dark-classes.js';
16+
import { darkClasses } from '../shared/use-dark-classes.js';
1717
1818
export default {
1919
name: 'k-block-title',
@@ -48,6 +48,8 @@
4848
},
4949
setup(props) {
5050
const context = useContext();
51+
const useDarkClasses = darkClasses(context);
52+
const useThemeClasses = themeClasses(context);
5153
const colors = computed(() =>
5254
BlockTitleColors(props.colors || {}, useDarkClasses)
5355
);

‎src/vue/components/Breadcrumbs.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
import { useContext } from '../shared/use-context.js';
88
import { BreadcrumbsClasses } from '../../shared/classes/BreadcrumbsClasses.js';
99
10-
import { useThemeClasses } from '../shared/use-theme-classes.js';
10+
import { themeClasses } from '../shared/use-theme-classes.js';
1111
1212
export default {
1313
name: 'k-breadcrumbs',
@@ -35,6 +35,7 @@
3535
},
3636
setup(props) {
3737
const context = useContext();
38+
const useThemeClasses = themeClasses(context);
3839
const c = useThemeClasses(props, () => BreadcrumbsClasses(props));
3940
return {
4041
c,

0 commit comments

Comments
 (0)